
:root{
  --green:#174b3a;--green-deep:#103a2f;--gold:#b59758;--cream:#f7f3e9;--paper:#fcfaf5;
  --sage:#edf0e7;--ink:#173a32;--muted:#66746f;--line:#d8ddd1;
  --serif:Georgia,'Times New Roman',serif;--sans:Arial,Helvetica,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.6}
img{display:block;max-width:100%}
a{color:inherit}
.site-header{position:sticky;top:0;z-index:30;background:rgba(252,250,245,.96);border-bottom:1px solid var(--line);backdrop-filter:blur(10px)}
.nav-wrap{height:76px;max-width:1240px;margin:auto;padding:0 28px;display:flex;align-items:center;gap:28px}
.brand img{width:118px}
.nav{display:flex;gap:22px;margin-left:auto;font-size:13px}.nav a{text-decoration:none}
.book-top,.primary{display:inline-flex;align-items:center;justify-content:center;background:var(--green);color:#fff;text-decoration:none;padding:12px 18px;border-radius:999px;font-size:13px;font-weight:700}
.hero{min-height:680px;display:grid;grid-template-columns:.9fr 1.1fr;background:var(--cream)}
.hero-copy{padding:78px max(40px,calc((100vw - 1240px)/2));padding-right:68px;display:flex;flex-direction:column;justify-content:center}
.eyebrow,.section-kicker{text-transform:uppercase;letter-spacing:.21em;font-size:11px;font-weight:700;color:var(--gold);margin:0 0 14px}
h1,h2,h3,blockquote{font-family:var(--serif);font-weight:500}
h1{font-size:clamp(70px,8vw,112px);line-height:.88;letter-spacing:-.045em;margin:0}
.hero-sub{font:italic 22px/1.45 var(--serif);color:#8c7441;max-width:460px;margin:28px 0}
.hero-actions{display:flex;gap:18px;align-items:center}.secondary{text-underline-offset:5px}
.hero-media{overflow:hidden}.hero-media img{width:100%;height:100%;object-fit:cover;object-position:center 32%}
.service-index{padding:86px 28px;max-width:1240px;margin:auto}.index-grid{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.index-grid a{min-height:250px;padding:28px 22px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);text-decoration:none;display:flex;flex-direction:column}
.index-grid span{font:italic 20px var(--serif);color:var(--gold)}.index-grid h2{font-size:25px;line-height:1.1;margin:18px 0 12px}.index-grid p{font-size:13px;color:var(--muted)}.index-grid b{margin-top:auto;font-size:12px;text-transform:uppercase;letter-spacing:.12em}
.experience-section{padding:110px 28px}.experience-section>*{max-width:1180px;margin-left:auto;margin-right:auto}
.section-head{max-width:760px!important;margin-bottom:54px!important}.section-head h2{font-size:clamp(46px,5vw,68px);line-height:1.02;margin:0 0 18px}.section-head>p:last-child{font-size:18px;color:var(--muted)}
.service-feature{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center;margin-bottom:100px!important}.service-feature.reverse .service-photo{order:2}
.service-photo img{width:100%;height:560px;object-fit:cover}.service-photo.tall img{height:620px}.service-copy h3{font-size:46px;line-height:1.06;margin:0 0 18px}.service-copy>p{font-size:17px;color:var(--muted)}
.quick-facts{display:flex;flex-wrap:wrap;gap:8px;margin:24px 0}.quick-facts span{background:var(--sage);padding:9px 12px;font-size:12px;font-weight:700}
details{border-top:1px solid var(--line)}details:last-child{border-bottom:1px solid var(--line)}
summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding:18px 0;font-weight:700}summary::-webkit-details-marker{display:none}
summary span:last-child,summary i{font-style:normal;font-size:22px;font-weight:400}
details[open] summary span:last-child,details[open] summary i{transform:rotate(45deg)}
.detail-body{padding:0 0 24px;color:var(--muted);font-size:14px;max-width:780px}.detail-body h4{text-transform:uppercase;letter-spacing:.12em;font-size:10px;color:var(--gold);margin:16px 0 6px}.detail-body ol{padding-left:20px;margin-bottom:0}
.dark{background:var(--green-deep);color:#f6f3ea}.dark-head>p:last-child,.dark p{color:#d8dfdb}.gold{color:#d2b77a}
.intro-split{display:grid;grid-template-columns:.82fr 1.18fr;gap:58px;align-items:center;margin-bottom:46px!important}.intro-split img{width:100%;height:420px;object-fit:cover}.intro-split h3{font-size:42px;margin:0 0 18px}.intro-split p{font-size:16px}
.accordion-list{margin-top:20px!important}.accordion-list details{border-color:rgba(23,58,50,.2)}.accordion-list summary{padding:20px 0}.accordion-list summary span{display:flex;justify-content:space-between;gap:30px;align-items:baseline;width:100%;padding-right:24px}.accordion-list summary b{font:500 24px var(--serif)}.accordion-list summary small{font-size:11px;color:var(--muted);white-space:nowrap}
.dark-list details{border-color:rgba(255,255,255,.2)}.dark-list summary small{color:#d5ddd8}.dark-list .detail-body{color:#d8dfdb}
.light-intro{margin-top:10px!important}.intensive-heading{margin-top:78px!important;max-width:760px!important}.intensive-heading h3{font-size:44px;margin:0 0 12px}.intensive-list{background:var(--green);color:#fff;padding:0 26px}.intensive-list details{border-color:rgba(255,255,255,.22)}.intensive-list summary small{color:#dfe6e1}.intensive-list .detail-body{color:#dfe6e1}
.soft{background:#eef0e8}
.closing{display:grid;grid-template-columns:.9fr 1.1fr;background:var(--cream);min-height:650px}.closing-copy{padding:70px max(40px,calc((100vw - 1240px)/2));padding-right:60px;display:flex;flex-direction:column;justify-content:center}.closing-logo{width:170px;margin-bottom:46px}.closing blockquote{font-size:48px;line-height:1.08;margin:0 0 30px}.closing blockquote em{color:#9b7d3e;font-style:normal}.aw-logo{width:205px;margin:42px 0 18px}.site-link{font-size:13px;text-underline-offset:4px}.closing-media img{width:100%;height:100%;object-fit:cover}
@media(max-width:1000px){
  .nav{display:none}.book-top{margin-left:auto}
  .hero{grid-template-columns:1fr}.hero-media{height:420px}.hero-copy{padding:54px 24px}
  .index-grid{grid-template-columns:1fr 1fr}.service-feature,.intro-split{grid-template-columns:1fr;gap:30px}.service-feature.reverse .service-photo{order:0}
  .service-photo img,.service-photo.tall img{height:460px}.closing{grid-template-columns:1fr}.closing-media{height:500px}
}
@media(max-width:640px){
  .nav-wrap{height:68px;padding:0 16px}.brand img{width:105px}.book-top{font-size:12px;padding:10px 14px}
  h1{font-size:67px}.hero-sub{font-size:18px}.hero-actions{align-items:flex-start;flex-direction:column}
  .service-index,.experience-section{padding:64px 18px}.index-grid{grid-template-columns:1fr}.index-grid a{min-height:auto}
  .section-head h2{font-size:42px}.service-copy h3{font-size:36px}.service-photo img,.service-photo.tall img{height:360px}
  .accordion-list summary span{display:block}.accordion-list summary small{display:block;margin-top:5px;white-space:normal}
  .intro-split img{height:330px}.intro-split h3{font-size:36px}.closing-copy{padding:58px 22px}.closing blockquote{font-size:38px}
}


/* ===== V16 refinement: lighter service palette + tighter vertical rhythm ===== */

/* Planet no longer uses the heavy full green block.
   Keep brand green for typography and accents, same visual family as other services. */
.experience-section.dark{
  background:var(--paper);
  color:var(--ink);
}
.experience-section.dark .dark-head > p:last-child,
.experience-section.dark p{
  color:var(--muted);
}
.experience-section.dark .gold{
  color:var(--gold);
}
.experience-section.dark .intro-split h3{
  color:var(--ink);
}
.experience-section.dark .highlight{
  color:var(--muted);
}

/* Planet accordion uses the same light treatment as Fullmoon. */
.dark-list details{
  border-color:rgba(23,58,50,.18);
}
.dark-list summary{
  color:var(--ink);
}
.dark-list summary small{
  color:var(--muted);
}
.dark-list .detail-body{
  color:var(--muted);
}
.dark-list details[open]{
  background:#f7f4ec;
}

/* Intensive Healing: remove the large dark-green block.
   Use a refined light panel with green accents only. */
.intensive-list{
  background:#f3f1e8;
  color:var(--ink);
  padding:0 22px;
  border:1px solid var(--line);
}
.intensive-list details{
  border-color:rgba(23,58,50,.18);
}
.intensive-list summary{
  color:var(--ink);
}
.intensive-list summary small{
  color:var(--muted);
}
.intensive-list .detail-body{
  color:var(--muted);
}

/* Tighter vertical rhythm across the website */
.experience-section{
  padding-top:84px;
  padding-bottom:84px;
}
.section-head{
  margin-bottom:38px!important;
}
.section-head h2{
  margin-bottom:12px;
}
.section-head > p:last-child{
  margin-bottom:0;
}
.service-feature{
  gap:54px;
  margin-bottom:72px!important;
}
.service-feature:last-child{
  margin-bottom:0!important;
}
.service-photo img{
  height:500px;
}
.service-photo.tall img{
  height:540px;
}
.quick-facts{
  margin:18px 0;
}
.service-copy > p{
  margin-top:8px;
  margin-bottom:12px;
}

/* Compact details controls */
details summary{
  padding:14px 0;
}
.detail-body{
  padding-bottom:18px;
}
.detail-body h4{
  margin-top:12px;
}
.accordion-list{
  margin-top:14px!important;
}
.accordion-list summary{
  padding:14px 0;
}
.accordion-list summary b{
  font-size:22px;
}
.accordion-list summary small{
  font-size:11px;
}
.accordion-list .detail-body{
  padding-bottom:16px;
}

/* Planet intro was visually too spread out */
.intro-split{
  gap:42px;
  margin-bottom:28px!important;
}
.intro-split img{
  height:360px;
}
.intro-split h3{
  margin-bottom:12px;
}
.intro-split p{
  margin-top:0;
  margin-bottom:12px;
}

/* Fullmoon intensive heading should sit closer to the accordion */
.intensive-heading{
  margin-top:56px!important;
  margin-bottom:18px!important;
}
.intensive-heading h3{
  margin-bottom:8px;
}
.intensive-heading p{
  margin-top:0;
}

/* Slightly tighter service-index cards */
.service-index{
  padding-top:72px;
  padding-bottom:72px;
}
.index-grid a{
  min-height:220px;
  padding-top:24px;
  padding-bottom:22px;
}
.index-grid h2{
  margin-top:14px;
}

/* Mobile tightening */
@media(max-width:1000px){
  .experience-section{
    padding-top:64px;
    padding-bottom:64px;
  }
  .service-feature{
    gap:26px;
    margin-bottom:56px!important;
  }
  .intro-split{
    gap:24px;
    margin-bottom:22px!important;
  }
  .intro-split img{
    height:320px;
  }
}
@media(max-width:640px){
  .experience-section{
    padding-top:52px;
    padding-bottom:52px;
  }
  .section-head{
    margin-bottom:28px!important;
  }
  .service-feature{
    margin-bottom:48px!important;
  }
  .accordion-list summary{
    padding:12px 0;
  }
  .accordion-list summary b{
    font-size:20px;
  }
  .intensive-heading{
    margin-top:44px!important;
  }
}


/* ===== V17 accordion refinement ===== */

/* Keep the accordion list itself narrower so the interaction feels intentional,
   not stretched across the whole page. */
.accordion-list{
  max-width:1040px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* Row layout: title, metadata and control form one compact visual unit. */
.accordion-list summary{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  column-gap:28px;
  padding:16px 0;
}
.accordion-list summary > span:first-child{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:24px;
  width:100%;
  padding-right:0;
}
.accordion-list summary b{
  font-size:21px;
  line-height:1.25;
}
.accordion-list summary small{
  font-size:11px;
  color:var(--muted);
  white-space:nowrap;
  font-weight:700;
}

/* Elegant explicit control instead of a lonely + at the far edge. */
.details-control{
  display:inline-flex!important;
  align-items:center;
  gap:9px;
  justify-content:flex-end;
  min-width:118px;
  color:var(--green);
  font-size:11px;
  font-weight:700;
  letter-spacing:.03em;
  white-space:nowrap;
}
.details-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:28px;
  border:1px solid rgba(23,75,58,.28);
  border-radius:50%;
  font-size:15px;
  line-height:1;
  transition:transform .18s ease, background-color .18s ease, border-color .18s ease;
}
details[open] .details-icon{
  transform:rotate(180deg);
}
details[open] .details-label::after{
  content:"";
}
details[open] .details-label{
  font-size:0;
}
details[open] .details-label::before{
  content:"Close";
  font-size:11px;
}

/* Softer hover/focus interaction, still restrained. */
.accordion-list details{
  padding:0 12px;
  margin:0 -12px;
  border-radius:10px;
  transition:background-color .18s ease;
}
.accordion-list details:hover{
  background:#f6f3eb;
}
.accordion-list details:hover .details-icon{
  background:#eef2ea;
  border-color:rgba(23,75,58,.48);
}
.accordion-list summary:focus-visible{
  outline:2px solid rgba(181,151,88,.55);
  outline-offset:4px;
  border-radius:6px;
}

/* Open content sits under the title, not across the whole viewport. */
.accordion-list .detail-body{
  max-width:720px;
  margin-right:auto;
  padding:0 0 18px;
}
.accordion-list .detail-body p{
  margin-top:0;
}

/* Intensive section uses same system, with subtle contrast only. */
.intensive-list{
  max-width:1040px!important;
  padding:0 18px;
}
.intensive-list details{
  margin:0;
  padding:0 6px;
  border-radius:0;
}
.intensive-list details:hover{
  background:rgba(23,75,58,.035);
}
.intensive-list .details-control{
  color:var(--green);
}
.intensive-list .details-icon{
  border-color:rgba(23,75,58,.28);
}

/* Compact service rows a little further. */
.accordion-list summary{
  min-height:64px;
}
.accordion-list details + details{
  margin-top:0;
}

/* Keep basic one-card View details rows visually aligned with the new system. */
.service-copy details summary{
  padding:15px 0;
}
.service-copy details summary > span:last-child{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:28px;
  border:1px solid rgba(23,75,58,.28);
  border-radius:50%;
  font-size:14px;
  line-height:1;
}
.service-copy details[open] summary > span:last-child{
  transform:rotate(45deg);
}

/* Responsive layout */
@media(max-width:820px){
  .accordion-list{
    max-width:100%!important;
  }
  .accordion-list summary{
    grid-template-columns:1fr auto;
    column-gap:14px;
    padding:14px 0;
  }
  .accordion-list summary > span:first-child{
    grid-template-columns:1fr;
    gap:4px;
  }
  .accordion-list summary small{
    white-space:normal;
  }
  .details-control{
    min-width:auto;
  }
  .details-label{
    display:none;
  }
  details[open] .details-label{
    display:none;
  }
}
@media(max-width:520px){
  .accordion-list details{
    padding:0 6px;
    margin:0 -6px;
  }
  .accordion-list summary b{
    font-size:19px;
  }
  .details-icon{
    width:26px;
    height:26px;
  }
}


/* ===== V18: gold + button, no "View details" text in service accordions ===== */

.accordion-list summary{
  grid-template-columns:minmax(0,1fr) auto;
  column-gap:18px;
}

/* Hide any legacy text label if cached markup remains. */
.details-label{
  display:none!important;
}

.details-control{
  min-width:36px!important;
  width:36px;
  height:36px;
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  color:var(--gold)!important;
}

.details-icon{
  width:34px!important;
  height:34px!important;
  border:1.5px solid var(--gold)!important;
  border-radius:50%;
  color:var(--gold)!important;
  font-size:20px!important;
  font-family:Arial,Helvetica,sans-serif;
  font-weight:400!important;
  line-height:1;
  background:transparent;
  transition:background-color .18s ease,color .18s ease,transform .18s ease!important;
}

/* Open state: plus rotates into x, elegant and obvious. */
details[open] .details-icon{
  transform:rotate(45deg)!important;
  background:var(--gold);
  color:#fff!important;
}

/* Hover: use the logo gold as the active cue. */
.accordion-list details:hover .details-icon{
  background:var(--gold)!important;
  color:#fff!important;
  border-color:var(--gold)!important;
}

/* Also make the + buttons in Grounded/Cocoon/Private/Aqua use the same gold language. */
.service-copy details summary > span:last-child{
  border-color:var(--gold)!important;
  color:var(--gold)!important;
  background:transparent;
}
.service-copy details:hover summary > span:last-child{
  background:var(--gold);
  color:#fff!important;
}
.service-copy details[open] summary > span:last-child{
  background:var(--gold);
  color:#fff!important;
}

/* Keep metadata close to the title and button. */
.accordion-list summary > span:first-child{
  grid-template-columns:minmax(0,1fr) auto;
  gap:18px;
}

/* Mobile: keep the gold circular button compact. */
@media(max-width:820px){
  .details-control{
    width:32px;
    min-width:32px!important;
    height:32px;
  }
  .details-icon{
    width:30px!important;
    height:30px!important;
    font-size:18px!important;
  }
}


/* ===== V19: feature-detail button only, matching the gold round button ===== */
.sr-only{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}

.service-copy details .feature-toggle{
  min-height:72px;
  padding:14px 0;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  cursor:pointer;
}

.service-copy details .feature-toggle::before{
  content:"";
  flex:1 1 auto;
}

.feature-plus{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  width:36px!important;
  height:36px!important;
  border-radius:50%;
  background:var(--gold)!important;
  color:#fff!important;
  border:none!important;
  font-family:Arial,Helvetica,sans-serif;
  font-size:20px!important;
  line-height:1;
  font-weight:400!important;
  box-shadow:none!important;
  transition:transform .18s ease, filter .18s ease!important;
}

.service-copy details:hover .feature-plus{
  filter:brightness(.96);
}

.service-copy details[open] .feature-plus{
  transform:rotate(45deg)!important;
  background:var(--gold)!important;
  color:#fff!important;
}

/* Remove old generic summary circle rules for these feature rows */
.service-copy details .feature-toggle > span:last-child{
  border:none!important;
  background:var(--gold)!important;
  color:#fff!important;
}

/* Mobile keeps the same clean icon-only control */
@media(max-width:640px){
  .service-copy details .feature-toggle{
    min-height:64px;
    padding:12px 0;
  }
  .feature-plus{
    width:34px!important;
    height:34px!important;
    font-size:19px!important;
  }
}


/* ===== V20: restore View details on feature sections; center + in service accordions ===== */

/* Larger feature sections (Grounded / Cocoon / Private / Aqua):
   restore the text because these have longer hidden content. */
.feature-toggle{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  min-height:72px;
  padding:14px 0!important;
}
.feature-label{
  display:inline-block;
  font-size:14px;
  font-weight:700;
  color:var(--ink);
}
.feature-plus{
  flex:0 0 36px;
  width:36px!important;
  height:36px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:50%;
  background:var(--gold)!important;
  color:#fff!important;
  border:none!important;
  font-family:Arial,Helvetica,sans-serif;
  font-size:20px!important;
  line-height:1!important;
  font-weight:400!important;
  padding:0!important;
  text-align:center!important;
}
.service-copy details[open] .feature-plus{
  transform:rotate(45deg)!important;
}

/* Service accordions (Planet / Fullmoon / Intensive):
   keep icon-only, but perfectly center the plus inside the gold-outlined circle. */
.details-control{
  flex:0 0 36px!important;
  width:36px!important;
  height:36px!important;
  min-width:36px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0!important;
  margin:0!important;
}
.details-icon{
  box-sizing:border-box!important;
  width:34px!important;
  height:34px!important;
  min-width:34px!important;
  min-height:34px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:1.5px solid var(--gold)!important;
  border-radius:50%!important;
  color:var(--gold)!important;
  background:transparent!important;
  font-family:Arial,Helvetica,sans-serif!important;
  font-size:18px!important;
  font-weight:400!important;
  line-height:34px!important;
  padding:0!important;
  margin:0!important;
  text-align:center!important;
  text-indent:0!important;
  vertical-align:middle!important;
}
.accordion-list details:hover .details-icon{
  background:var(--gold)!important;
  color:#fff!important;
}
.accordion-list details[open] .details-icon{
  transform:rotate(45deg)!important;
  background:var(--gold)!important;
  color:#fff!important;
}

/* Prevent inherited baseline offsets from affecting + symbol placement */
.details-icon::before,
.details-icon::after{
  content:none!important;
}

/* Mobile */
@media(max-width:640px){
  .feature-toggle{
    min-height:64px;
  }
  .feature-label{
    font-size:13px;
  }
  .feature-plus{
    width:34px!important;
    height:34px!important;
    flex-basis:34px;
    font-size:19px!important;
  }
  .details-control{
    width:32px!important;
    height:32px!important;
    min-width:32px!important;
    flex-basis:32px!important;
  }
  .details-icon{
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    min-height:30px!important;
    line-height:30px!important;
    font-size:17px!important;
  }
}


/* ===== V21: align View details left / + right, enlarge section labels 1.5x ===== */

/* Feature accordions: text left, gold + button right exactly opposite. */
.service-copy details .feature-toggle{
  display:grid!important;
  grid-template-columns:1fr auto!important;
  align-items:center!important;
  width:100%!important;
  min-height:76px;
  padding:16px 0!important;
  column-gap:18px;
}

.feature-label{
  justify-self:start!important;
  text-align:left!important;
  font-size:14px;
  font-weight:700;
  color:var(--ink);
}

.feature-plus{
  justify-self:end!important;
  margin-left:auto!important;
}

/* Make the main section/menu labels 1.5x larger:
   01 Weekend..., 02 Planet..., 03 Fullmoon..., 04 Private..., 05 Private Experience */
.section-head > .eyebrow,
.service-copy > .eyebrow,
.dark-head > .eyebrow,
.intensive-heading > .eyebrow{
  font-size:16.5px!important;
  letter-spacing:.18em!important;
  line-height:1.35!important;
  margin-bottom:16px!important;
}

/* Keep smaller internal labels like Grounded/Cocoon/Basic readable but not oversized */
.service-copy .eyebrow:not(:first-child){
  font-size:11px;
}

/* Responsive scaling */
@media(max-width:820px){
  .section-head > .eyebrow,
  .service-copy > .eyebrow,
  .dark-head > .eyebrow,
  .intensive-heading > .eyebrow{
    font-size:15px!important;
    letter-spacing:.16em!important;
  }
}

@media(max-width:520px){
  .service-copy details .feature-toggle{
    min-height:68px;
    padding:14px 0!important;
  }
  .feature-label{
    font-size:13px;
  }
  .section-head > .eyebrow,
  .service-copy > .eyebrow,
  .dark-head > .eyebrow,
  .intensive-heading > .eyebrow{
    font-size:14px!important;
  }
}


/* ===== V22: View details aligned left; compact 5-product menu near top ===== */

/* Feature detail rows: label flush left, + flush right */
.service-copy details .feature-toggle{
  display:grid!important;
  grid-template-columns:1fr auto!important;
  align-items:center!important;
  width:100%!important;
  min-height:70px;
  padding:14px 0!important;
  column-gap:18px;
}
.feature-label{
  justify-self:start!important;
  align-self:center!important;
  margin:0!important;
  padding:0!important;
  text-align:left!important;
}
.feature-plus{
  justify-self:end!important;
  margin:0!important;
}

/* Compact top 5-product overview so it appears higher on the page */
.service-index{
  padding-top:46px!important;
  padding-bottom:52px!important;
}
.service-index .section-kicker{
  margin-bottom:12px!important;
  font-size:10px!important;
}
.index-grid a{
  min-height:168px!important;
  padding:18px 18px 16px!important;
}
.index-grid span{
  font-size:16px!important;
}
.index-grid h2{
  font-size:20px!important;
  line-height:1.08!important;
  margin:10px 0 8px!important;
}
.index-grid p{
  font-size:12px!important;
  line-height:1.42!important;
  margin:0 0 10px!important;
}
.index-grid b{
  font-size:10px!important;
  margin-top:auto!important;
  letter-spacing:.11em!important;
}

/* Reduce hero height so the 5 product menu is visible sooner */
.hero{
  min-height:560px!important;
}
.hero-media{
  min-height:560px!important;
}
.hero-copy{
  padding-top:56px!important;
  padding-bottom:46px!important;
}
.hero-copy h1{
  font-size:clamp(58px,6.3vw,92px)!important;
}
.hero-sub{
  font-size:19px!important;
  margin:22px 0!important;
}
.hero-actions{
  margin-top:2px!important;
}

/* Slightly smaller image on desktop to shorten first screen further */
.hero-media img{
  object-position:center 30%!important;
}

/* Mobile */
@media(max-width:1000px){
  .hero{
    min-height:auto!important;
  }
  .hero-media{
    min-height:0!important;
    height:350px!important;
  }
  .service-index{
    padding-top:36px!important;
    padding-bottom:42px!important;
  }
  .index-grid a{
    min-height:145px!important;
  }
}
@media(max-width:640px){
  .hero-copy h1{
    font-size:54px!important;
  }
  .hero-sub{
    font-size:17px!important;
  }
  .hero-media{
    height:300px!important;
  }
  .index-grid a{
    min-height:auto!important;
    padding:16px!important;
  }
  .index-grid h2{
    font-size:18px!important;
  }
}


/* ===== V23: compact opening so the 5-product summary appears immediately ===== */

/* Header slightly tighter */
.nav-wrap{
  height:68px!important;
}

/* Much shorter hero: keep the same composition, but no longer consumes a full screen */
.hero{
  min-height:410px!important;
  grid-template-columns:.88fr 1.12fr!important;
}
.hero-copy{
  padding-top:38px!important;
  padding-bottom:34px!important;
  padding-right:48px!important;
}
.hero-copy h1{
  font-size:clamp(48px,5.2vw,76px)!important;
  line-height:.9!important;
}
.hero-sub{
  font-size:17px!important;
  line-height:1.4!important;
  margin:16px 0 18px!important;
  max-width:420px!important;
}
.hero-actions{
  gap:14px!important;
}
.hero-actions .primary,
.hero-actions .secondary{
  font-size:12px!important;
}
.hero-media{
  min-height:410px!important;
  height:410px!important;
}
.hero-media img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center 31%!important;
}

/* Put the 5-product overview directly under the hero with minimal white space */
.service-index{
  padding-top:24px!important;
  padding-bottom:34px!important;
}
.service-index .section-kicker{
  margin-bottom:8px!important;
  font-size:9px!important;
}
.index-grid a{
  min-height:132px!important;
  padding:13px 14px 12px!important;
}
.index-grid span{
  font-size:14px!important;
}
.index-grid h2{
  font-size:17px!important;
  line-height:1.06!important;
  margin:6px 0 6px!important;
}
.index-grid p{
  font-size:10.5px!important;
  line-height:1.35!important;
  margin:0 0 6px!important;
}
.index-grid b{
  font-size:9px!important;
  margin-top:auto!important;
}

/* Reduce gap before the first service section */
#weekend.experience-section{
  padding-top:58px!important;
}

/* Keep View details correctly aligned: text left, plus right */
.service-copy details .feature-toggle{
  display:grid!important;
  grid-template-columns:1fr auto!important;
  width:100%!important;
  align-items:center!important;
}
.feature-label{
  justify-self:start!important;
  text-align:left!important;
}
.feature-plus{
  justify-self:end!important;
  margin-left:auto!important;
}

/* Tablet/mobile */
@media(max-width:1000px){
  .nav-wrap{height:64px!important}
  .hero{
    grid-template-columns:1fr!important;
    min-height:auto!important;
  }
  .hero-copy{
    padding:34px 22px 28px!important;
  }
  .hero-copy h1{
    font-size:54px!important;
  }
  .hero-media{
    height:280px!important;
    min-height:280px!important;
  }
  .service-index{
    padding-top:20px!important;
    padding-bottom:30px!important;
  }
  .index-grid a{
    min-height:118px!important;
  }
}

@media(max-width:640px){
  .hero-copy h1{
    font-size:48px!important;
  }
  .hero-sub{
    font-size:16px!important;
  }
  .hero-media{
    height:250px!important;
    min-height:250px!important;
  }
  .index-grid{
    grid-template-columns:1fr 1fr!important;
  }
  .index-grid a{
    min-height:104px!important;
    padding:12px!important;
  }
  .index-grid h2{
    font-size:16px!important;
  }
  .index-grid p{
    display:none!important;
  }
  .index-grid b{
    font-size:8px!important;
  }
}


/* ===== V24: fix View details alignment definitively ===== */

/* Remove the old spacer pseudo-element that was pushing the label to the right. */
.service-copy details .feature-toggle::before{
  content:none!important;
  display:none!important;
}

/* Force true left/right alignment. */
.service-copy details .feature-toggle{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  width:100%!important;
  min-height:70px!important;
  padding:14px 0!important;
  margin:0!important;
  column-gap:18px!important;
}

.service-copy details .feature-toggle .feature-label{
  grid-column:1!important;
  justify-self:start!important;
  align-self:center!important;
  margin:0!important;
  padding:0!important;
  text-align:left!important;
  width:auto!important;
}

.service-copy details .feature-toggle .feature-plus{
  grid-column:2!important;
  justify-self:end!important;
  align-self:center!important;
  margin:0!important;
}

/* Keep the text aligned with the content edge, exactly like the reference. */
.service-copy details{
  width:100%!important;
}

/* Integrated EN/VI language switch — isolated to the V24 menu route. */
.lang-switch{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:34px;height:34px;padding:0 9px;
  border:1px solid rgba(23,58,50,.22);border-radius:999px;
  font-size:11px;font-weight:700;text-decoration:none;color:var(--ink);
}
.lang-switch:hover{border-color:var(--gold);color:var(--gold)}
@media(max-width:640px){.lang-switch{min-width:32px;height:32px;padding:0 8px}}


/* ===== V7.13 integrated footer refinement ===== */

/* Header logo: slightly smaller, never overflows the sticky header. */
.brand{
  display:flex;
  align-items:center;
  height:100%;
  overflow:hidden;
}
.brand img{
  width:102px!important;
  max-width:102px!important;
  max-height:58px!important;
  height:auto!important;
  object-fit:contain;
}

/* Compact QR block remains at the bottom of the menu, above the standard footer. */
.menu-qr{
  background:#f7f3e9;
  padding:48px 7%;
  border-top:1px solid #d8ddd1;
}
.menu-qr-inner{
  max-width:920px;
  margin:0 auto;
  display:grid;
  grid-template-columns:150px 1fr;
  align-items:center;
  gap:34px;
  background:#fffdf7;
  border:1px solid #ded9cc;
  padding:24px 28px;
}
.menu-qr-inner>img{
  width:150px;
  height:150px;
  object-fit:contain;
  background:#fff;
  padding:8px;
}
.menu-qr-inner h2{
  font:500 34px/1.1 Georgia,'Times New Roman',serif;
  margin:4px 0 10px;
  color:#173a32;
}
.menu-qr-inner p{
  margin:0;
  color:#66746f;
}
.menu-qr-inner .eyebrow{
  color:#b59758;
  margin-bottom:6px;
}

/* Match the footer used on /sound-to-soul/training/ */
.menu-footer-cta{
  background:#153d2e;
  color:#fff;
  padding:55px 7%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
}
.menu-footer-cta h2{
  font:500 44px/1.08 Georgia,'Times New Roman',serif;
  margin:0;
  color:#fff;
}
.menu-footer-cta .st-eyebrow{
  margin:0 0 12px;
  text-transform:uppercase;
  letter-spacing:.18em;
  font-size:10px;
  color:#c7b477;
}
.menu-footer-cta .st-button{
  display:inline-flex;
  align-items:center;
  gap:8px;
  text-decoration:none;
  padding:13px 18px;
  border:1px solid #c7b477;
  font-size:11px;
  background:#fff;
  color:#153d2e;
  border-radius:3px;
}

.menu-site-footer{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  align-items:center;
  gap:24px;
  padding:45px 6% 25px;
  background:#fff;
}
.menu-site-footer img{width:180px}
.menu-site-footer>p{
  text-align:center;
  font:500 24px/1.2 Georgia,'Times New Roman',serif;
  margin:0;
  color:#173a32;
}
.menu-site-footer>div{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  justify-content:end;
  font-size:11px;
}
.menu-site-footer a{
  color:#173a32;
  text-decoration:none;
}
.menu-site-footer>div>a{
  display:flex;
  align-items:center;
  gap:6px;
}
.menu-site-footer small{
  grid-column:1/-1;
  border-top:1px solid #d4dcd4;
  padding-top:24px;
  font-size:10px;
  color:#66746f;
}

.menu-review-links{
  display:flex;
  gap:25px;
  flex-wrap:wrap;
  padding:0 7% 80px;
  background:#fff;
  font-size:11px;
}
.menu-review-links a{
  display:flex;
  gap:8px;
  align-items:center;
  color:#173a32;
  text-decoration:none;
}

.menu-chat{
  position:fixed;
  right:22px;
  bottom:18px;
  z-index:20;
  background:#153d2e;
  color:#fff;
  display:flex;
  align-items:center;
  gap:10px;
  padding:13px 19px;
  box-shadow:0 3px 14px #0002;
  font-size:11px;
  border:1px solid #c7b477;
  border-radius:4px;
  text-decoration:none;
}

@media(max-width:900px){
  .menu-site-footer{grid-template-columns:1fr 1fr}
  .menu-site-footer>p{display:none}
}
@media(max-width:620px){
  .brand img{
    width:90px!important;
    max-width:90px!important;
    max-height:52px!important;
  }
  .menu-qr{padding:34px 6%}
  .menu-qr-inner{
    grid-template-columns:92px 1fr;
    gap:18px;
    padding:18px;
  }
  .menu-qr-inner>img{
    width:92px;
    height:92px;
  }
  .menu-qr-inner h2{font-size:25px}
  .menu-qr-inner p{font-size:12px}
  .menu-footer-cta{
    flex-direction:column;
    align-items:flex-start;
    padding:40px 7%;
  }
  .menu-footer-cta h2{font-size:34px}
  .menu-site-footer{
    grid-template-columns:1fr;
    padding:36px 7% 22px;
  }
  .menu-site-footer>div{
    justify-content:flex-start;
  }
  .menu-review-links{
    padding:0 7% 70px;
  }
  .menu-chat{
    right:12px;
    bottom:12px;
    padding:11px 14px;
    font-size:10px;
  }
}


/* ===== V7.14 mobile header + footer fixes ===== */

/* Mobile-only Home button and quick service navigation */
.mobile-home-link,
.mobile-service-nav{
  display:none;
}

@media(max-width:760px){
  /* Top bar: fit logo + Home + language + booking on one row */
  .site-header{
    position:sticky!important;
    top:0!important;
    z-index:80!important;
    background:#fcfaf5!important;
  }
  .nav-wrap{
    height:66px!important;
    min-height:66px!important;
    padding:0 10px!important;
    gap:7px!important;
    max-width:none!important;
  }
  .brand{
    flex:0 0 auto!important;
    overflow:visible!important;
  }
  .brand img{
    width:76px!important;
    max-width:76px!important;
    max-height:48px!important;
  }
  .nav{
    display:none!important;
  }
  .mobile-home-link{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:4px!important;
    height:32px!important;
    padding:0 8px!important;
    border:1px solid rgba(23,58,50,.20)!important;
    border-radius:999px!important;
    text-decoration:none!important;
    color:var(--ink)!important;
    font-size:9px!important;
    font-weight:700!important;
    white-space:nowrap!important;
    margin-left:auto!important;
  }
  .mobile-home-link svg{
    width:12px!important;
    height:12px!important;
  }
  .lang-switch{
    min-width:32px!important;
    width:32px!important;
    height:32px!important;
    padding:0!important;
    font-size:9px!important;
    flex:0 0 32px!important;
  }
  .book-top{
    height:34px!important;
    padding:0 11px!important;
    font-size:9px!important;
    white-space:nowrap!important;
    flex:0 0 auto!important;
  }

  /* Mobile quick service navigation below the header */
  .mobile-service-nav{
    display:flex!important;
    gap:8px!important;
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
    background:#f7f3e9!important;
    border-bottom:1px solid #d8ddd1!important;
    padding:8px 10px!important;
    position:sticky!important;
    top:66px!important;
    z-index:70!important;
  }
  .mobile-service-nav::-webkit-scrollbar{display:none!important}
  .mobile-service-nav a{
    flex:0 0 auto!important;
    display:inline-flex!important;
    align-items:center!important;
    min-height:30px!important;
    padding:0 10px!important;
    border:1px solid #ded9cc!important;
    border-radius:999px!important;
    background:#fffdf7!important;
    color:var(--ink)!important;
    text-decoration:none!important;
    font-size:9px!important;
    font-weight:700!important;
    white-space:nowrap!important;
  }

  html{scroll-padding-top:112px!important}

  /* QR block: compact two-column card, never full-width image */
  .menu-qr{
    padding:26px 16px!important;
    background:#f7f3e9!important;
    border-top:1px solid #d8ddd1!important;
  }
  .menu-qr-inner{
    width:100%!important;
    max-width:520px!important;
    margin:0 auto!important;
    display:grid!important;
    grid-template-columns:86px minmax(0,1fr)!important;
    gap:16px!important;
    align-items:center!important;
    padding:16px!important;
    border:1px solid #ded9cc!important;
    background:#fffdf7!important;
  }
  .menu-qr-inner>img{
    width:86px!important;
    height:86px!important;
    max-width:86px!important;
    max-height:86px!important;
    min-width:86px!important;
    min-height:86px!important;
    object-fit:contain!important;
    padding:5px!important;
    margin:0!important;
    background:#fff!important;
  }
  .menu-qr-inner .eyebrow{
    margin:0 0 5px!important;
    font-size:8px!important;
    letter-spacing:.15em!important;
  }
  .menu-qr-inner h2{
    margin:0 0 6px!important;
    font:500 22px/1.05 Georgia,'Times New Roman',serif!important;
  }
  .menu-qr-inner p{
    margin:0!important;
    font-size:11px!important;
    line-height:1.42!important;
  }

  /* CTA: enforce the same green section as desktop/training */
  .menu-footer-cta{
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:flex-start!important;
    gap:18px!important;
    padding:30px 18px!important;
    background:#153d2e!important;
    color:#fff!important;
  }
  .menu-footer-cta .st-eyebrow{
    margin:0 0 7px!important;
    color:#c7b477!important;
    font-size:8px!important;
  }
  .menu-footer-cta h2{
    margin:0!important;
    color:#fff!important;
    font:500 30px/1.06 Georgia,'Times New Roman',serif!important;
  }
  .menu-footer-cta .st-button{
    display:inline-flex!important;
    align-items:center!important;
    gap:7px!important;
    padding:11px 14px!important;
    background:#fff!important;
    color:#153d2e!important;
    border:1px solid #c7b477!important;
    text-decoration:none!important;
    font-size:10px!important;
  }

  /* Site footer: clean stacked mobile layout */
  .menu-site-footer{
    display:block!important;
    padding:28px 18px 18px!important;
    background:#fff!important;
  }
  .menu-site-footer>a:first-child{
    display:inline-block!important;
    margin-bottom:18px!important;
  }
  .menu-site-footer img{
    width:148px!important;
    max-width:148px!important;
    height:auto!important;
  }
  .menu-site-footer>p{
    display:block!important;
    text-align:left!important;
    margin:0 0 18px!important;
    font:500 20px/1.2 Georgia,'Times New Roman',serif!important;
    color:#173a32!important;
  }
  .menu-site-footer>div{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:10px 14px!important;
    justify-content:stretch!important;
    margin-bottom:20px!important;
    font-size:10px!important;
  }
  .menu-site-footer>div>a{
    display:flex!important;
    align-items:center!important;
    gap:5px!important;
    min-height:28px!important;
    padding-bottom:6px!important;
    border-bottom:1px solid #edf0e7!important;
    text-decoration:none!important;
  }
  .menu-site-footer small{
    display:block!important;
    border-top:1px solid #d4dcd4!important;
    padding-top:16px!important;
    font-size:9px!important;
    line-height:1.5!important;
    color:#66746f!important;
  }

  .menu-review-links{
    display:flex!important;
    gap:8px!important;
    flex-wrap:wrap!important;
    padding:0 18px 22px!important;
    background:#fff!important;
  }
  .menu-review-links a{
    display:inline-flex!important;
    align-items:center!important;
    gap:5px!important;
    padding:8px 10px!important;
    border:1px solid #d8ddd1!important;
    border-radius:999px!important;
    text-decoration:none!important;
    font-size:9px!important;
    background:#fffdf7!important;
  }

  /* Avoid Safari bottom toolbar collision: mobile chat becomes part of document flow */
  .menu-chat{
    position:static!important;
    display:inline-flex!important;
    margin:0 18px 26px!important;
    padding:10px 13px!important;
    box-shadow:none!important;
    font-size:9px!important;
    border-radius:3px!important;
    text-decoration:none!important;
  }
}

@media(max-width:360px){
  .nav-wrap{gap:5px!important;padding:0 7px!important}
  .brand img{width:70px!important;max-width:70px!important}
  .mobile-home-link{
    width:32px!important;
    padding:0!important;
  }
  .mobile-home-link span{display:none!important}
  .book-top{padding:0 9px!important;font-size:8.5px!important}
  .menu-qr-inner{
    grid-template-columns:74px minmax(0,1fr)!important;
    gap:12px!important;
    padding:13px!important;
  }
  .menu-qr-inner>img{
    width:74px!important;
    height:74px!important;
    max-width:74px!important;
    max-height:74px!important;
    min-width:74px!important;
    min-height:74px!important;
  }
  .menu-qr-inner h2{font-size:20px!important}
}


/* ===== V7.15 mobile refinement: clean header + compact 5-product rail ===== */

@media(max-width:760px){

  /* Clean single-row header */
  .site-header{
    position:sticky!important;
    top:0!important;
    z-index:90!important;
    background:#fcfaf5!important;
    border-bottom:1px solid #d8ddd1!important;
  }
  .nav-wrap{
    height:62px!important;
    min-height:62px!important;
    padding:0 12px!important;
    gap:8px!important;
    display:flex!important;
    align-items:center!important;
  }
  .brand{
    flex:0 0 auto!important;
    height:62px!important;
    display:flex!important;
    align-items:center!important;
  }
  .brand img{
    width:72px!important;
    max-width:72px!important;
    max-height:46px!important;
    height:auto!important;
  }
  .nav{display:none!important}

  .mobile-home-link{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:32px!important;
    height:32px!important;
    flex:0 0 32px!important;
    margin-left:auto!important;
    padding:0!important;
    border:1px solid rgba(23,58,50,.18)!important;
    border-radius:50%!important;
    color:var(--ink)!important;
    background:#fffdf7!important;
    text-decoration:none!important;
  }
  .mobile-home-link svg{
    width:14px!important;
    height:14px!important;
  }

  .lang-switch{
    width:32px!important;
    min-width:32px!important;
    height:32px!important;
    flex:0 0 32px!important;
    padding:0!important;
    border-radius:50%!important;
    font-size:9px!important;
  }

  /* Short booking button so it never wraps */
  .book-top{
    height:34px!important;
    min-height:34px!important;
    padding:0 13px!important;
    border-radius:999px!important;
    font-size:0!important;
    line-height:34px!important;
    white-space:nowrap!important;
    flex:0 0 auto!important;
  }
  .book-top::after{
    content:"Book";
    font-size:10px!important;
    font-weight:700!important;
  }
  html[lang="vi"] .book-top::after{
    content:"Đặt lịch";
  }

  /* Remove the extra second navigation bar completely */
  .mobile-service-nav{
    display:none!important;
  }
  html{scroll-padding-top:72px!important}

  /* More compact opening on mobile */
  .hero{
    display:grid!important;
    grid-template-columns:1fr!important;
    min-height:auto!important;
  }
  .hero-copy{
    padding:28px 18px 22px!important;
  }
  .hero-copy .eyebrow{
    font-size:8px!important;
    margin-bottom:9px!important;
    letter-spacing:.18em!important;
  }
  .hero-copy h1{
    font-size:44px!important;
    line-height:.9!important;
  }
  .hero-sub{
    font-size:15px!important;
    line-height:1.4!important;
    margin:14px 0 16px!important;
  }
  .hero-actions{
    flex-direction:row!important;
    align-items:center!important;
    gap:12px!important;
    margin:0!important;
  }
  .hero-actions .primary{
    padding:10px 13px!important;
    font-size:9px!important;
  }
  .hero-actions .secondary{
    font-size:9px!important;
  }
  .hero-media{
    height:235px!important;
    min-height:235px!important;
  }
  .hero-media img{
    object-position:center 32%!important;
  }

  /* 5-product summary becomes a compact horizontal rail */
  .service-index{
    padding:18px 0 24px!important;
    overflow:hidden!important;
  }
  .service-index .section-kicker{
    padding:0 16px!important;
    margin-bottom:8px!important;
    font-size:8px!important;
  }
  .index-grid{
    display:flex!important;
    gap:10px!important;
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch!important;
    scroll-snap-type:x mandatory!important;
    scrollbar-width:none!important;
    border:0!important;
    padding:0 16px 4px!important;
  }
  .index-grid::-webkit-scrollbar{display:none!important}
  .index-grid a{
    flex:0 0 180px!important;
    min-height:112px!important;
    padding:13px!important;
    border:1px solid #d8ddd1!important;
    border-radius:10px!important;
    background:#fffdf7!important;
    scroll-snap-align:start!important;
  }
  .index-grid span{
    font-size:13px!important;
  }
  .index-grid h2{
    font-size:16px!important;
    line-height:1.08!important;
    margin:5px 0 0!important;
  }
  .index-grid p,
  .index-grid b{
    display:none!important;
  }

  /* Slightly reduce first service spacing */
  #weekend.experience-section{
    padding-top:42px!important;
  }
}

@media(max-width:360px){
  .nav-wrap{
    padding:0 9px!important;
    gap:6px!important;
  }
  .brand img{
    width:68px!important;
    max-width:68px!important;
  }
  .mobile-home-link,
  .lang-switch{
    width:30px!important;
    min-width:30px!important;
    height:30px!important;
    flex-basis:30px!important;
  }
  .book-top{
    height:32px!important;
    min-height:32px!important;
    padding:0 10px!important;
  }
  .book-top::after{
    font-size:9px!important;
  }
  .hero-copy h1{
    font-size:40px!important;
  }
  .hero-media{
    height:215px!important;
    min-height:215px!important;
  }
  .index-grid a{
    flex-basis:165px!important;
  }
}


/* ===== V7.15 HEADER ONLY: exact Sound to Soul Training header ===== */
@font-face{font-family:'Be Vietnam Pro';src:url('/fonts/BeVietnamPro-Regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}

/* Disable the old standalone menu header controls only. */
.site-header,.mobile-home-link,.mobile-service-nav{display:none!important}

.st-housebar,.sf-header,.sf-header *{box-sizing:border-box}
.st-housebar{background:#153d2e;color:#fff;display:flex;justify-content:space-between;align-items:center;gap:15px;padding:10px 5%;font-family:'Be Vietnam Pro',Arial,sans-serif;font-size:10px;line-height:1.4}
.st-housebar a{display:flex;align-items:center;gap:8px;color:#fff;text-decoration:none}
.st-housebar>span{letter-spacing:2px}
.sf-header{min-height:94px;padding:10px 5%;display:flex;align-items:center;gap:26px;background:#fff;border-bottom:1px solid #e2e7e1;position:relative;z-index:50;font-family:'Be Vietnam Pro',Arial,sans-serif;color:#153d2e}
.sf-header .st-logo{width:94px;flex-shrink:0;display:block}
.sf-header .st-logo img{width:100%;height:72px;object-fit:contain;display:block}
.sf-header>nav:not(.language-switch):not(.ah-mobile-nav){margin-left:auto;display:flex;align-items:center;gap:22px;font-size:12px}
.sf-header>nav:not(.language-switch):not(.ah-mobile-nav) a{color:#153d2e;text-decoration:none;white-space:nowrap}
.sf-header>nav:not(.language-switch):not(.ah-mobile-nav) a[aria-current='page']{border-bottom:1px solid #b48a38;padding-bottom:6px}
.sf-cart-link{display:flex;align-items:center;gap:6px;color:#153d2e;text-decoration:none;white-space:nowrap}
.sf-book{display:flex;align-items:center;gap:12px;color:#153d2e;text-decoration:none;font-size:12px;border-bottom:1px solid #b48a38;padding:12px 0;white-space:nowrap}
.sf-header>.language-switch{display:flex;margin-left:0;gap:4px;padding-left:14px;border-left:1px solid #d8ddd1}
.sf-header>.language-switch a{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:36px;color:#57645b;text-decoration:none;font-size:11px}
.sf-header>.language-switch a[aria-current='true']{color:#b48a38;border-bottom:1px solid #b48a38}
.site-menu-toggle{display:none;width:44px;height:44px;padding:10px;border:0;background:transparent;color:#153d2e;cursor:pointer;flex-shrink:0}
.site-menu-toggle .menu-close{display:none}.site-menu-toggle[aria-expanded=true] .menu-open{display:none}.site-menu-toggle[aria-expanded=true] .menu-close{display:block}
.ah-mobile-nav{display:none}

@media(max-width:1350px){.sf-header>.sf-book{display:none}}
@media(max-width:980px){
  .st-housebar{font-size:9px;padding:9px 6%}.st-housebar>span{display:none}
  .sf-header{min-height:86px;padding:10px 7%;gap:18px}
  .sf-header .st-logo{width:90px}.sf-header .st-logo img{height:68px}
  .sf-header>nav:not(.language-switch):not(.ah-mobile-nav){display:none}
  .sf-header>.language-switch{margin-left:auto;padding-left:8px;gap:2px}
  .site-menu-toggle{display:grid;place-items:center;width:44px;height:44px}
  .ah-mobile-nav[hidden]{display:none!important}
  .ah-mobile-nav:not([hidden]){display:flex!important;position:absolute;left:0;right:0;top:100%;z-index:80;background:#fff;border-top:1px solid #e2e7e1;border-bottom:1px solid #e2e7e1;padding:18px 7% 24px;flex-direction:column;gap:0;max-height:calc(100svh - 86px);overflow:auto}
  .ah-mobile-nav a{padding:12px 0;border-bottom:1px solid #edf0e7;color:#153d2e;text-decoration:none;font-size:12px}
}
@media(max-width:620px){
  .st-housebar{padding:9px 6%}.sf-header{min-height:86px;padding:10px 6%;gap:12px}
  .sf-header .st-logo{width:90px}.sf-header .st-logo img{height:65px}
  .sf-cart-link{margin-left:auto}.sf-header>.language-switch{margin-left:0}
}

/* ===== Mobile header hardening (cache-busted v25) ===== */
html,body{margin:0;padding:0}
.sf-header a,.st-housebar a{text-decoration:none}
.site-menu-toggle svg,.sf-cart-link svg,.st-housebar svg{display:block}

@media (max-width: 980px){
  .sf-header{
    display:grid;
    grid-template-columns:minmax(86px,96px) 1fr auto auto auto;
    align-items:center;
    column-gap:12px;
    row-gap:0;
    padding:10px 18px;
    min-height:86px;
  }
  .sf-header>.st-logo{grid-column:1;grid-row:1}
  .sf-header>.st-logo img{height:64px}
  .sf-header>nav:not(.language-switch):not(.ah-mobile-nav){display:none!important}
  .sf-header>.sf-cart-link{grid-column:3;grid-row:1;justify-self:end;margin-left:0}
  .sf-header>.language-switch{grid-column:4;grid-row:1;justify-self:end;margin-left:0;padding-left:10px;border-left:1px solid #d8ddd1;gap:0}
  .sf-header>.language-switch a{min-width:31px;height:42px;font-size:11px}
  .sf-header>.site-menu-toggle{grid-column:5;grid-row:1;display:grid!important;place-items:center;justify-self:end;width:44px;height:44px;padding:10px}
  .ah-mobile-nav[hidden]{display:none!important}
  .ah-mobile-nav:not([hidden]){
    display:flex!important;
    position:absolute;
    left:0;right:0;top:100%;
    z-index:90;
    flex-direction:column;
    background:#fff;
    border-top:1px solid #e2e7e1;
    border-bottom:1px solid #e2e7e1;
    box-shadow:0 16px 28px rgba(21,61,46,.08);
    padding:16px 20px 24px;
    gap:0;
    max-height:calc(100svh - 86px);
    overflow:auto;
  }
  .ah-mobile-nav a{
    display:flex;
    align-items:center;
    min-height:50px;
    padding:10px 0;
    border-bottom:1px solid #edf0e7;
    color:#153d2e;
    font-size:15px;
    line-height:1.35;
  }
}

@media (max-width: 620px){
  .st-housebar{
    padding:11px 14px;
    font-size:9px;
    line-height:1.3;
    gap:10px;
  }
  .st-housebar a{font-size:9px;gap:6px}
  .st-housebar > span{display:none}
  .sf-header{
    grid-template-columns:minmax(88px,96px) 1fr auto auto auto;
    padding:10px 14px;
    column-gap:8px;
  }
  .sf-header .st-logo{width:88px}
  .sf-header .st-logo img{height:62px}
  .sf-cart-link{gap:4px;font-size:12px}
  .sf-cart-link svg{width:18px;height:18px}
  .site-menu-toggle{width:42px;height:42px}
  .site-menu-toggle svg{width:22px;height:22px}
}

@media (max-width: 380px){
  .sf-header{grid-template-columns:minmax(84px,90px) 1fr auto auto auto;padding:10px 12px;column-gap:7px}
  .sf-header .st-logo{width:84px}
  .sf-header .st-logo img{height:58px}
  .sf-header>.language-switch a{min-width:28px;font-size:10px}
  .sf-cart-link span{font-size:11px}
}

/* ===== Mobile product summary: show all 5 cards in a visible grid, no sideways scroll (v26) ===== */
@media (max-width: 640px){
  .service-index{
    padding:18px 16px 24px!important;
    overflow:visible!important;
  }
  .service-index .section-kicker{
    padding:0!important;
    margin-bottom:10px!important;
    font-size:8px!important;
  }
  .index-grid{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:12px!important;
    overflow:visible!important;
    scroll-snap-type:none!important;
    border:0!important;
    padding:0!important;
  }
  .index-grid a{
    flex:none!important;
    min-width:0!important;
    min-height:116px!important;
    width:auto!important;
    padding:14px!important;
    border:1px solid #d8ddd1!important;
    border-radius:14px!important;
    background:#fffdf7!important;
    scroll-snap-align:none!important;
    box-sizing:border-box!important;
  }
  .index-grid a:nth-child(5){
    grid-column:1 / -1!important;
  }
  .index-grid h2{
    font-size:16px!important;
    line-height:1.08!important;
    margin:6px 0 0!important;
  }
  .index-grid p,
  .index-grid b{
    display:none!important;
  }
}

@media (max-width: 380px){
  .index-grid{
    grid-template-columns:1fr!important;
  }
  .index-grid a:nth-child(5){
    grid-column:auto!important;
  }
}

/* ===== v27: QR image clickable, layout unchanged ===== */
.menu-qr-link{display:block;width:150px;height:150px;line-height:0;text-decoration:none;cursor:pointer}
.menu-qr-link img{width:150px!important;height:150px!important;object-fit:contain!important;background:#fff!important;padding:8px!important;box-sizing:border-box!important}
.menu-qr-link:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
@media(max-width:760px){.menu-qr-link{width:86px;height:86px}.menu-qr-link img{width:86px!important;height:86px!important;padding:5px!important}}
@media(max-width:360px){.menu-qr-link{width:74px;height:74px}.menu-qr-link img{width:74px!important;height:74px!important}}
