/* Soulwaves: light moving across the real studio imagery. */
:root {
  --sw-polish-earth:#382c2a;
  --sw-polish-clay:#d5a18e;
  --sw-polish-rose:#b9796a;
  --sw-polish-cream:#fffaf6;
  --sw-polish-gold:#d5ad61;
  --sw-polish-ease:cubic-bezier(.16,1,.3,1);
  --sw-polish-radius:22px;
}

/* The brand light runs continuously. The gem retains its linework and contrast. */
.topbar .brand {overflow:visible}
.topbar .brand-mark {isolation:isolate;animation:sw-gem-float 4.8s ease-in-out infinite,sw-gem-glow 3.2s ease-in-out infinite!important}
.topbar .brand-mark::after {content:"";position:absolute;inset:-12% -55%;z-index:2;pointer-events:none;background:linear-gradient(100deg,transparent 36%,#fff0 43%,#fff8 49%,#ffe5c2b8 51%,transparent 59%);transform:translateX(-75%) skewX(-12deg);animation:sw-logo-sweep 3.8s linear infinite}
.topbar .brand::after {opacity:1!important;animation:sw-sparkle-loop 2.7s ease-in-out infinite!important}
.topbar .brand-name {background:linear-gradient(105deg,var(--sw-polish-earth) 0%,var(--sw-polish-earth) 35%,#fff7e6 48%,#b76c56 52%,var(--sw-polish-earth) 64%,var(--sw-polish-earth) 100%);background-size:240% 100%;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:sw-logo-type-sweep 4.6s linear infinite!important}
@keyframes sw-logo-sweep {0% {transform:translateX(-90%) skewX(-12deg)}100% {transform:translateX(95%) skewX(-12deg)}}
@keyframes sw-logo-type-sweep {0% {background-position:100% 50%}100% {background-position:-100% 50%}}
@keyframes sw-gem-glow {0%,100% {filter:drop-shadow(0 0 2px #d5a18e60)}50% {filter:drop-shadow(0 0 9px #d5a18ec9)}}
@keyframes sw-sparkle-loop {0%,100% {opacity:.25;transform:scale(.55) rotate(0)}50% {opacity:1;transform:scale(1.24) rotate(90deg)}}

/* A dedicated child keeps existing image gradients, captions and links intact. */
.sw-photo-frame {position:relative;isolation:isolate;overflow:hidden}
.sw-photo-frame>.sw-photo-sheen {position:absolute;inset:-45% -85%;z-index:4;pointer-events:none;opacity:0;background:linear-gradient(105deg,transparent 41%,#fff2 45%,#fff9 49%,#ffe6be8c 51%,#fff6 55%,transparent 60%);transform:translateX(-85%) skewX(-12deg)}
@media (hover:hover) {
  .sw-photo-frame:hover>.sw-photo-sheen,.sw-photo-frame:focus-visible>.sw-photo-sheen {animation:sw-photo-sweep 1.15s var(--sw-polish-ease) both}
}
@keyframes sw-photo-sweep {0% {opacity:0;transform:translateX(-85%) skewX(-12deg)}16% {opacity:.8}68% {opacity:.9}100% {opacity:0;transform:translateX(85%) skewX(-12deg)}}

/* Photo stories, class covers and gallery share the same soft cut corners. */
#about .about-art.discover-slideshow[data-photo-carousel],
#services .experience-card,
#gallery .gallery-item,
#facilitators .facilitator,
#facilitators .facilitator-photo,
.brand-choice {border-radius:var(--sw-polish-radius)!important}
#services .experience-card {box-shadow:0 14px 34px #382c2a27;transition:transform .4s var(--sw-polish-ease),box-shadow .4s ease}
#services .experience-card:nth-child(-n+4):hover,#services .experience-card:nth-child(-n+4):focus-visible {transform:translateY(-7px) scale(1.012);box-shadow:0 24px 43px #382c2a54}
#services .experience-card:nth-child(-n+4):hover::before,#services .experience-card:nth-child(-n+4):focus-visible::before {transform:scale(1.095)}
#services .experience-card:nth-child(n+5) img {border-radius:15px}
#services .experience-card:nth-child(n+5):hover img {transform:scale(1.035)}
#services .experience-card:nth-child(n+5) img {transition:transform .4s var(--sw-polish-ease)}
#gallery .gallery-item {box-shadow:0 9px 22px #382c2a1a;transition:transform .38s var(--sw-polish-ease),box-shadow .38s ease}
#gallery .gallery-item:hover {transform:translateY(-5px);box-shadow:0 18px 34px #382c2a38}
#gallery .gallery-item:hover img {transform:scale(1.085)}
#facilitators .facilitator {border:1px solid #e9d8cb;box-shadow:0 14px 32px #382c2a1d;transition:transform .42s var(--sw-polish-ease),box-shadow .42s ease}
#facilitators .facilitator:hover {transform:translateY(-7px) scale(1.012);box-shadow:0 24px 48px #382c2a32}
#facilitators .facilitator-photo {border-radius:var(--sw-polish-radius) var(--sw-polish-radius) 0 0!important}
#facilitators .facilitator-photo img {transition:transform .65s var(--sw-polish-ease),filter .65s ease}
#facilitators .facilitator:hover .facilitator-photo img {transform:scale(1.085);filter:saturate(1.08)}
#facilitators .facilitator-read-more {display:inline-flex;align-items:center;justify-content:center;min-height:42px;margin:13px 0 17px;padding:9px 19px;border:1px solid #b9796a8c;border-radius:999px;background:linear-gradient(120deg,#fff9f5,#f3e4da);color:#814d41;text-decoration:none;box-shadow:0 7px 16px #814d4117;transition:transform .25s var(--sw-polish-ease),box-shadow .25s ease,background .25s ease}
#facilitators .facilitator-read-more:hover,#facilitators .facilitator-read-more:focus-visible {transform:translateY(-3px) scale(1.035);background:linear-gradient(120deg,#f3ddd0,#fffaf6);box-shadow:0 13px 24px #814d4133}

/* Training and event panels inherit the logo's gentle visual rhythm. */
#services #trainingCoursesToggle {border:1px solid #b6caba;border-radius:25px!important;transition:transform .4s var(--sw-polish-ease),box-shadow .4s ease}
#services #trainingCoursesToggle:hover {transform:translateY(-5px) scale(1.018)}
#services #trainingCoursesToggle .training-courses-toggle-icon {animation:sw-icon-orbit 5.8s ease-in-out infinite}
#services .venue-highlight {border-radius:26px!important}
#services .venue-highlight:hover {transform:translateY(-8px) scale(1.016)}
#services .venue-highlight-icon svg {animation:sw-icon-orbit 6.5s ease-in-out infinite}
#services .venue-highlight:nth-of-type(2) .venue-highlight-icon svg {animation-delay:-2.1s}
#services .venue-highlight:hover .venue-highlight-icon svg {animation-duration:1.6s;filter:drop-shadow(0 0 9px #ffe2cbbf)}
@keyframes sw-icon-orbit {0%,100% {transform:translateY(0) rotate(-3deg) scale(1)}50% {transform:translateY(-5px) rotate(4deg) scale(1.08)}}

/* Reviews: source is visible; only actual five-star reviews get the top badge. */
#reviews .sw-google-heading {display:inline-flex;align-items:center;gap:15px;margin:18px auto 4px;padding:11px 18px;border:1px solid #e7d7c8;border-radius:999px;background:#fff;box-shadow:0 8px 24px #382c2a12}
#reviews .sw-google-heading img {width:74px;height:24px;object-fit:contain}
#reviews .sw-google-heading .sw-google-stars {color:var(--sw-polish-gold);font-size:18px;letter-spacing:.12em;white-space:nowrap}
#reviews .review {border-radius:19px!important;box-shadow:0 10px 25px #382c2a12;transition:transform .35s var(--sw-polish-ease),box-shadow .35s ease}
#reviews .review:hover {transform:translateY(-5px);box-shadow:0 20px 35px #382c2a28}
#reviews .sw-review-badge {display:inline-flex;align-items:center;gap:6px;margin-bottom:13px;padding:6px 11px;border-radius:999px;background:#fff7e7;color:#765a27;font-size:11px;font-weight:700;letter-spacing:.035em}
#reviews .sw-review-badge::after {content:"★★★★★";color:#c99b43;letter-spacing:.06em}
#reviews .sw-review-badge [data-sw-th] {display:none}
html[lang="th"] #reviews .sw-review-badge [data-sw-th] {display:inline}
html[lang="th"] #reviews .sw-review-badge [data-sw-en] {display:none}
#reviews a.btn {border-radius:999px;background:linear-gradient(115deg,#a65e4e,#c7836d 48%,#94584b);color:#fff!important;border:1px solid #a65e4e;box-shadow:0 10px 23px #a65e4e4a}
#reviews a.btn:hover {transform:translateY(-4px);box-shadow:0 17px 29px #a65e4e61}

/* Booking: clear steps and visible focus; native fields and submit behaviour remain intact. */
#booking .booking-wrap {border:1px solid #e1cabc;border-radius:28px;overflow:hidden;box-shadow:0 29px 65px #50372b2b}
#booking .booking-form {position:relative;padding:clamp(25px,4vw,54px);background:linear-gradient(150deg,#fffdfb 0%,#fff8f3 100%)}
#booking .booking-step-head {margin:32px 0 18px;padding-bottom:15px;border-bottom:1px solid #e8d6c9}
#booking .booking-step-head:first-child {margin-top:0}
#booking .booking-step-number {box-shadow:0 5px 12px #81998829}
#booking .booking-form .field {min-width:0}
#booking .booking-form .field label {margin-bottom:7px;color:#594037;font-weight:650}
#booking .booking-form :is(input:not([type="checkbox"]),select,textarea) {min-height:50px;border:1px solid #d9bcae;border-radius:13px!important;background:#fff;box-shadow:0 4px 14px #382c2a09;transition:border-color .25s ease,box-shadow .25s ease,transform .25s var(--sw-polish-ease)}
#booking .booking-form :is(input:not([type="checkbox"]),select,textarea):hover {border-color:#b9796a;box-shadow:0 8px 18px #382c2a16}
#booking .booking-form :is(input:not([type="checkbox"]),select,textarea):focus {outline:2px solid transparent;border-color:#a96553;box-shadow:0 0 0 4px #d5a18e3d,0 9px 22px #382c2a1e;transform:translateY(-2px)}
#booking .booking-form .booking-multiple-toggle {border-radius:13px!important;background:#f6f0e9}
#booking .booking-form .calendar-wrap,#booking .booking-form .calendar,#booking .booking-form .time-option {border-radius:15px}
#booking .booking-form .btn[type="submit"] {min-height:56px;padding-inline:28px;border-radius:999px!important;background:linear-gradient(110deg,#955647,#c17862 48%,#955647);background-size:200% 100%;color:#fff;box-shadow:0 10px 25px #a65e4e55;animation:sw-booking-button-light 6s ease-in-out infinite;transition:transform .25s var(--sw-polish-ease),box-shadow .25s ease}
#booking .booking-form .btn[type="submit"]:hover {transform:translateY(-4px) scale(1.018);box-shadow:0 18px 32px #a65e4e70}
#booking .booking-form .btn[type="submit"]:disabled {opacity:.68;cursor:progress;animation:none}
#booking .booking-submit-status {min-height:1.6em;margin:15px 0 0;color:#405d51;font-size:14px;line-height:1.5}
#booking .booking-submit-status.is-error {color:#8f3e32}
@keyframes sw-booking-button-light {0%,100% {background-position:100% 50%}50% {background-position:0 50%}}

/* Contact choices feel tactile, and the text remains readable in both languages. */
#contact .contact-quick-grid {gap:16px}
#contact .contact-quick-btn {min-height:165px;padding:24px 17px;border:1px solid #e2cdbf;border-radius:23px!important;background:linear-gradient(150deg,#fffefc,#f7ede7);box-shadow:0 11px 27px #382c2a1b;transition:transform .36s var(--sw-polish-ease),box-shadow .36s ease,border-color .36s ease}
#contact .contact-quick-btn:nth-child(2) {background:linear-gradient(145deg,#eaf2e9,#f9f9f3);border-color:#c3d6c5}
#contact .contact-quick-btn:nth-child(3) {background:linear-gradient(145deg,#fff0e8,#faf2ed)}
#contact .contact-quick-btn:nth-child(4) {background:linear-gradient(145deg,#e9f0ed,#faf6ef)}
#contact .contact-quick-btn:hover,#contact .contact-quick-btn:focus-visible {transform:translateY(-7px) scale(1.018);border-color:#d5a18e;box-shadow:0 22px 38px #382c2a30,0 0 26px #d5a18e42}
#contact .contact-quick-icon {display:grid;place-items:center;width:50px;height:50px;margin:0 auto 12px;border:1px solid #d5a18e70;border-radius:16px;background:#fff9f2;box-shadow:0 6px 15px #382c2a0f;transition:transform .4s var(--sw-polish-ease),box-shadow .4s ease}
#contact .contact-quick-btn:hover .contact-quick-icon {transform:translateY(-3px) rotate(-7deg) scale(1.12);box-shadow:0 9px 20px #d5a18e55}
#contact .contact-quick-btn>span:not(.contact-quick-icon) {font-size:16px;color:#46322d}
#contact .contact-quick-btn small {font-size:12px;line-height:1.45;color:#725c51}

@media (max-width:760px) {
  #booking .booking-wrap {border-radius:22px}
  #booking .booking-form {padding:25px 17px}
  #services .experience-card,#gallery .gallery-item,#facilitators .facilitator,.brand-choice {border-radius:18px!important}
  #contact .contact-quick-grid {gap:11px}
  #contact .contact-quick-btn {min-height:150px;padding:17px 11px;border-radius:18px!important}
  #reviews .sw-google-heading {gap:10px;padding:9px 13px}
}
@media (prefers-reduced-motion:reduce) {
  .topbar .brand-mark,.topbar .brand-mark::after,.topbar .brand::after,.topbar .brand-name,.sw-photo-frame>.sw-photo-sheen,#services #trainingCoursesToggle .training-courses-toggle-icon,#services .venue-highlight-icon svg,#booking .booking-form .btn[type="submit"] {animation:none!important}
  .sw-photo-frame:hover>.sw-photo-sheen,.sw-photo-frame:focus-visible>.sw-photo-sheen {animation:none!important;opacity:0}
  #gallery .gallery-item:hover,#facilitators .facilitator:hover,#contact .contact-quick-btn:hover,#services .experience-card:nth-child(-n+4):hover,#services .venue-highlight:hover,#services #trainingCoursesToggle:hover {transform:none!important}
}
