/* =========================================================================
   ELEANA Thailand - design tokens
   Colour, type, spacing and motion values come from the developer brief.
   Nothing below hard-codes a colour outside this block.
   ========================================================================= */
:root{
  /* colour */
  --ivory:#FBF8F4;
  --warm:#F4F0EA;
  --beige:#E7DDD2;
  --taupe:#B9A99A;
  --ink:#171513;
  --black:#111111;
  --hair:#D7CEC5;
  --ink-70:rgba(23,21,19,.70);
  --ink-55:rgba(23,21,19,.55);
  --ink-38:rgba(23,21,19,.38);

  --bg:var(--ivory);
  --fg:var(--ink);

  /* type */
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --sans:Inter,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --thai:Sarabun,var(--sans);
  --thai-serif:"Noto Serif Thai",var(--serif);

  --fs-display:clamp(2.5rem,1.1rem + 6.2vw,5.25rem);   /* 40 -> 84 */
  --fs-h2:clamp(2rem,1.05rem + 3.9vw,3.5rem);
  --fs-h3:clamp(1.25rem,1.05rem + .8vw,1.6rem);
  --fs-lead:clamp(1.0625rem,1rem + .35vw,1.25rem);
  --fs-body:1.0625rem;
  --fs-small:.875rem;
  --fs-micro:.75rem;

  --lh-display:1.02;
  --lh-body:1.7;
  --track-ui:.14em;

  /* layout */
  --max:1440px;
  --gut:clamp(20px,4.5vw,72px);
  --sec:clamp(64px,9vw,152px);
  --sec-half:clamp(40px,5vw,88px);
  --measure:38em;

  /* motion */
  --motion-instant:150ms;
  --motion-fast:200ms;
  --motion-base:700ms;
  --motion-slow:1100ms;
  --ease-ui:cubic-bezier(.4,0,.2,1);
  --ease-editorial:cubic-bezier(.22,1,.36,1);
  --stagger:80ms;

  --header-h:86px;
  --announce-h:30px;
}
@media (max-width:1023px){ :root{ --header-h:62px; --announce-h:28px; } }

/* =========================================================================
   Base
   ========================================================================= */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--bg);color:var(--fg);
  font-family:var(--sans);font-size:var(--fs-body);line-height:var(--lh-body);
  font-weight:400;-webkit-font-smoothing:antialiased;overflow-x:hidden;
}
html[lang^="th"] body{font-family:var(--thai);line-height:1.75}
img,svg,video{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4,p,ul,ol,figure,blockquote,dl{margin:0}
ul,ol{list-style:none;padding:0}
summary::-webkit-details-marker{display:none}

:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:2px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}

.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--ink);color:var(--ivory);padding:12px 18px}
.skip:focus{left:12px;top:12px}

.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--gut)}

/* type roles ------------------------------------------------------------ */
.display{
  font-family:var(--serif);font-weight:300;font-size:var(--fs-display);
  line-height:var(--lh-display);letter-spacing:-.012em;
  text-wrap:balance;
}
html[lang^="th"] .display{font-family:var(--thai-serif);line-height:1.25;letter-spacing:0}
.display__em{display:block;font-style:italic;font-size:.62em;color:var(--ink-70);margin-top:.28em;line-height:1.2}
html[lang^="th"] .display__em{font-style:normal}
h2.display,.sechead .display{font-size:var(--fs-h2)}

.lead{font-size:var(--fs-lead);color:var(--ink-70);max-width:34em}
.note{font-size:var(--fs-small);color:var(--ink-55)}

.eyebrow{
  display:flex;align-items:center;gap:.55em;
  font-family:var(--sans);font-size:var(--fs-micro);font-weight:500;
  letter-spacing:var(--track-ui);text-transform:uppercase;color:var(--ink-55);
  margin-bottom:1.1rem;
}
html[lang^="th"] .eyebrow{font-family:var(--thai);letter-spacing:.06em;text-transform:none;font-size:.8125rem}
.eyebrow .icon{width:8px;height:11px;color:var(--taupe);flex:none}

.icon{width:20px;height:20px;flex:none}
.icon--arrow{width:18px;height:18px;transition:transform var(--motion-fast) var(--ease-ui)}
.icon--droplet-lg{width:22px;height:29px}

/* =========================================================================
   Buttons
   ========================================================================= */
.btn{
  --btn-bg:transparent;--btn-fg:var(--ink);
  display:inline-flex;align-items:center;justify-content:center;gap:.6em;
  min-height:46px;padding:0 1.6em;border:0;border-radius:2px;
  background:var(--btn-bg);color:var(--btn-fg);
  font-family:var(--sans);font-size:.78rem;font-weight:500;
  letter-spacing:var(--track-ui);text-transform:uppercase;
  cursor:pointer;text-align:center;
  transition:background var(--motion-fast) var(--ease-ui),
             color var(--motion-fast) var(--ease-ui),
             transform var(--motion-fast) var(--ease-ui),
             border-color var(--motion-fast) var(--ease-ui);
}
html[lang^="th"] .btn{font-family:var(--thai);text-transform:none;letter-spacing:.03em;font-size:.9375rem}
.btn--primary{--btn-bg:var(--black);--btn-fg:var(--ivory)}
.btn--primary:hover{--btn-bg:#2A2724;transform:translateY(-1px)}
.btn--quiet{border:1px solid var(--hair)}
.btn--quiet:hover{border-color:var(--ink);transform:translateY(-1px)}
.btn--block{width:100%}
.btn--sm{min-height:38px;padding:0 1.1em}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.42;pointer-events:none}

.btn--text{
  min-height:auto;padding:0;gap:.5em;position:relative;
  border-bottom:1px solid var(--ink-38);padding-bottom:.35em;border-radius:0;
}
.btn--text:hover{border-bottom-color:var(--ink)}
.btn--text:hover .icon--arrow{transform:translateX(4px)}

.iconbtn{
  display:inline-flex;align-items:center;gap:.5em;
  min-width:40px;min-height:40px;padding:0 .35em;
  background:none;border:0;cursor:pointer;color:inherit;justify-content:center;
  transition:opacity var(--motion-fast) var(--ease-ui);
}
.iconbtn:hover{opacity:.62}

/* =========================================================================
   Media frames + pending placeholder
   ========================================================================= */
.media{position:relative;margin:0;overflow:hidden;background:var(--warm);border-radius:2px}
.media picture{display:block}
.media img{width:100%;aspect-ratio:var(--ratio,4/5);object-fit:cover;object-position:var(--focus,50% 50%);
  transition:transform var(--motion-slow) var(--ease-editorial)}
.media__pending{display:none}
.media--pending{
  aspect-ratio:var(--ratio,4/5);
  background:
    radial-gradient(120% 90% at 30% 20%,#FFFDFB 0%,var(--warm) 42%,var(--beige) 100%);
  border:1px solid var(--hair);
}
.media--pending img,.media--pending picture{display:none}
.media--pending .media__pending{
  display:grid;place-items:center;position:absolute;inset:0;color:var(--taupe);opacity:.5;
}
.media__caption{font-size:var(--fs-small);color:var(--ink-55);padding-top:.7rem}

/* =========================================================================
   Header
   ========================================================================= */
.announce{
  height:var(--announce-h);display:grid;place-items:center;
  background:var(--ink);color:var(--ivory);
  font-size:var(--fs-micro);letter-spacing:.08em;text-transform:uppercase;
  padding-inline:var(--gut);text-align:center;
}
html[lang^="th"] .announce{text-transform:none;font-size:.8125rem;letter-spacing:0}
.announce p{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}

.header{
  position:sticky;top:0;z-index:60;
  background:transparent;
  transition:background var(--motion-base) var(--ease-ui),
             transform var(--motion-base) var(--ease-ui),
             box-shadow var(--motion-base) var(--ease-ui);
}
.header__inner{
  max-width:var(--max);margin-inline:auto;padding-inline:var(--gut);
  height:var(--header-h);display:flex;align-items:center;gap:1rem;
}
.header.is-solid{
  background:rgba(251,248,244,.92);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  box-shadow:0 1px 0 var(--hair);
}
.header.is-hidden{transform:translateY(calc(-100% - var(--announce-h)))}

.brand{flex:none;margin-right:auto}
.brand__mark{width:clamp(118px,11vw,168px);height:auto;opacity:.92}
.header__burger{display:none}

.nav{position:absolute;left:50%;transform:translateX(-50%)}
.nav>ul{display:flex;gap:clamp(1rem,2.1vw,2.4rem)}
.nav__link{
  display:inline-block;padding:.9em 0;position:relative;
  font-size:.78rem;letter-spacing:var(--track-ui);text-transform:uppercase;font-weight:500;
}
html[lang^="th"] .nav__link{text-transform:none;letter-spacing:.02em;font-size:.9375rem}
.nav__link::after{
  content:"";position:absolute;left:0;right:0;bottom:.45em;height:1px;background:currentColor;
  transform:scaleX(0);transform-origin:left;transition:transform var(--motion-fast) var(--ease-ui);
}
.nav__item:hover .nav__link::after,.nav__link:focus-visible::after{transform:scaleX(1)}

.subnav{
  position:absolute;top:100%;left:50%;translate:-50% 0;min-width:230px;
  background:var(--ivory);border:1px solid var(--hair);border-radius:2px;
  padding:.7rem 0;opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:opacity var(--motion-fast) var(--ease-ui),transform var(--motion-fast) var(--ease-ui),visibility 0s linear var(--motion-fast);
}
.nav__item:hover .subnav,.nav__item:focus-within .subnav{
  opacity:1;visibility:visible;transform:translateY(0);transition-delay:0s;
}
.subnav a{display:block;padding:.5rem 1.4rem;font-size:.9375rem;color:var(--ink-70)}
.subnav a:hover{color:var(--ink);background:var(--warm)}

.header__end{display:flex;align-items:center;gap:.15rem;margin-left:auto}
.lang span{font-size:var(--fs-micro);letter-spacing:.1em;text-transform:uppercase}
html[lang^="th"] .lang span{text-transform:none;letter-spacing:0;font-size:.8125rem}
.cartbtn{position:relative}
.cartbtn__count{
  position:absolute;top:2px;right:0;min-width:17px;height:17px;padding:0 4px;
  display:grid;place-items:center;border-radius:9px;
  background:var(--ink);color:var(--ivory);font-size:10px;line-height:1;letter-spacing:0;
}

/* =========================================================================
   Sections - shared rhythm
   ========================================================================= */
main>section{padding-block:var(--sec)}
main>section.hero{padding-block:clamp(28px,4vw,56px) var(--sec-half)}
main>section.benefits{padding-block:var(--sec-half)}
main>section.founder{padding-block:0}
main>section.phead{padding-block:clamp(48px,7vw,110px) var(--sec-half)}

.sechead{max-width:44em;margin-bottom:clamp(2rem,4vw,3.6rem)}
.sechead .lead{margin-top:1.1rem}
.sechead--split{
  display:grid;gap:1.4rem;max-width:none;align-items:end;
  grid-template-columns:minmax(0,1fr);
}
@media (min-width:900px){
  .sechead--split{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(2rem,5vw,5rem)}
  .sechead--split>:last-child{justify-self:end;text-align:right}
  .sechead--split .lead{margin-top:0}
}
.rowhead{display:flex;align-items:baseline;justify-content:space-between;gap:1.5rem;
  padding-bottom:1rem;margin-bottom:2rem;border-bottom:1px solid var(--hair)}
.rowhead__t{font-family:var(--serif);font-weight:300;font-size:var(--fs-h3)}
html[lang^="th"] .rowhead__t{font-family:var(--thai-serif)}

/* alternating surfaces - fixed per module, never random */
.thesis,.concerns,.member,.news{background:var(--warm)}
.founder{background:var(--beige)}
.benefits{background:var(--ivory)}

/* =========================================================================
   02 Hero
   ========================================================================= */
.hero__grid{display:grid;gap:clamp(1.8rem,4vw,3rem);align-items:center}
@media (min-width:900px){
  .hero__grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(2rem,5vw,5.5rem)}
}
.hero__h1{margin-bottom:1.1rem}
.hero__h1 .line{display:block}
.hero__sub{font-size:var(--fs-lead);color:var(--ink-70);max-width:22em}
.hero__points{
  margin:clamp(1.6rem,3vw,2.4rem) 0;padding-top:1.4rem;border-top:1px solid var(--hair);
  display:grid;gap:.85rem;max-width:24em;
}
.hero__points li{display:flex;align-items:center;gap:.9rem;font-size:.9375rem;color:var(--ink-70)}
.hero__points .icon{width:20px;height:20px;color:var(--taupe)}
.hero__cta{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(1rem,2.5vw,2rem)}
.media--hero{border-radius:2px}
@media (min-width:900px){ .media--hero img{aspect-ratio:5/6} }

/* =========================================================================
   03 Brand thesis
   ========================================================================= */
.thesis__inner{max-width:52em;margin-inline:auto;text-align:center}
.thesis__q{font-style:italic;font-size:clamp(1.75rem,1rem + 3vw,3.1rem);line-height:1.2}
html[lang^="th"] .thesis__q{font-style:normal;line-height:1.45}
.thesis__b{margin-top:1.6rem;color:var(--ink-70);max-width:34em;margin-inline:auto}

/* =========================================================================
   04 Founder - sticky story
   ========================================================================= */
.founder__stage{padding-block:var(--sec)}
.founder__grid{display:grid;gap:clamp(2rem,4vw,4rem)}
.founder__media{display:grid}
.founder__frame{grid-area:1/1}
.founder__head{margin-bottom:2rem}
.founder__n{
  font-size:var(--fs-micro);letter-spacing:var(--track-ui);text-transform:uppercase;
  color:var(--ink-55);margin-bottom:.9rem;
}
html[lang^="th"] .founder__n{text-transform:none;letter-spacing:.04em;font-size:.8125rem}
.founder__n span{color:var(--taupe)}
.founder__ch p+p{margin-top:1rem}
.founder__ch{max-width:var(--measure)}
.founder__chapters>li+li{margin-top:clamp(2.5rem,5vw,4rem)}
.founder__foot{margin-top:2.4rem;display:flex;align-items:center;gap:1.4rem;flex-wrap:wrap}
.progress{position:relative;height:1px;background:var(--hair);flex:1 1 120px;min-width:90px;max-width:220px}
.progress__bar{position:absolute;inset:0;background:var(--ink);transform-origin:left;transform:scaleX(0);
  transition:transform var(--motion-base) var(--ease-editorial)}
.progress__label{font-size:var(--fs-micro);letter-spacing:.1em;color:var(--ink-55)}

@media (min-width:1024px){
  .founder{--founder-len:280vh}
  .founder__stage{height:var(--founder-len);padding:0;position:relative}
  .founder__grid{
    position:sticky;top:0;height:100vh;align-items:center;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    padding-block:calc(var(--header-h) + 2rem) 2rem;
  }
  .founder__media{align-self:center}
  .founder__frame{opacity:0;transition:opacity var(--motion-slow) var(--ease-editorial)}
  .founder__frame.is-active{opacity:1}
  /* Size the frame, not the image, so the plate never letterboxes. */
  .founder__frame .media{max-width:calc(66vh * 4 / 5);margin-inline:auto}
  .founder__frame img{aspect-ratio:4/5;width:100%;height:auto}
  .founder__text{position:relative;align-self:center}
  .founder__chapters{display:grid}
  .founder__chapters>li{grid-area:1/1;margin:0!important;opacity:0;
    transform:translateY(14px);pointer-events:none;
    transition:opacity 520ms var(--ease-editorial),transform 520ms var(--ease-editorial)}
  .founder__chapters>li.is-active{opacity:1;transform:none;pointer-events:auto}
  .founder__chapters{min-height:15.5em}
}
@media (max-width:1023px){
  .founder__frame{display:none}
  .founder__frame.is-active{display:block}
  .founder__foot .progress,.founder__foot .progress__label{display:none}
}

/* =========================================================================
   05 Three rituals
   ========================================================================= */
.rituals__list{display:grid;gap:1px;background:var(--hair);border-block:1px solid var(--hair)}
@media (min-width:820px){ .rituals__list{grid-template-columns:repeat(3,1fr)} }
.ritualcard{background:var(--bg);padding:clamp(1.8rem,3.2vw,2.8rem) clamp(1.3rem,2.4vw,2.2rem)}
.ritualcard__mark{display:block;color:var(--taupe);margin-bottom:1.6rem}
.ritualcard__mark .icon{width:44px;height:44px}
.ritualcard__t{font-family:var(--serif);font-weight:300;font-size:clamp(1.6rem,1.2rem + 1.1vw,2.1rem);line-height:1.1}
html[lang^="th"] .ritualcard__t{font-family:var(--thai-serif);line-height:1.35}
.ritualcard__s{font-size:var(--fs-micro);letter-spacing:var(--track-ui);text-transform:uppercase;color:var(--ink-55);margin:.5rem 0 1rem}
html[lang^="th"] .ritualcard__s{text-transform:none;letter-spacing:.04em;font-size:.8125rem}
.ritualcard__b{color:var(--ink-70);margin-bottom:1.6rem;max-width:26em}

/* =========================================================================
   06 Face Yoga
   ========================================================================= */
.fyoga__grid{display:grid;gap:clamp(2rem,4vw,3.6rem)}
@media (min-width:1024px){
  .fyoga__grid{grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);gap:clamp(2rem,4.5vw,5rem);align-items:start}
  .fyoga__aside{position:sticky;top:calc(var(--header-h) + 2rem)}
}
.fyoga__aside p{color:var(--ink-70);margin-top:1rem;max-width:34em}
.fyoga__aside .btn--text{margin-top:1.8rem}

.fyintro__grid{display:grid;gap:clamp(2rem,4vw,3.6rem)}
@media (min-width:900px){ .fyintro__grid{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:start} }
.fyintro__copy p{color:var(--ink-70);max-width:var(--measure)}
.fyintro__copy p+p{margin-top:1.1rem}

/* rail (scroll-snap) ---------------------------------------------------- */
.rail{position:relative}
.rail__track{
  display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);
  gap:clamp(.8rem,1.6vw,1.4rem);
  overflow-x:auto;scroll-snap-type:x mandatory;
  scrollbar-width:none;touch-action:pan-y pinch-zoom;
  padding-bottom:.5rem;
}
.rail__track::-webkit-scrollbar{display:none}
.rail__track>*{scroll-snap-align:start}
@media (max-width:900px){
  .rail__track{grid-auto-columns:84%;margin-inline:calc(var(--gut) * -1);padding-inline:var(--gut)}
}
.rail__ctrl{display:flex;align-items:center;gap:1.4rem;margin-top:1.4rem}
.rail__btns{display:flex;gap:.2rem;margin-left:auto}
@media (max-width:900px){ .rail__btns{display:none} }

.vcard__btn{
  display:block;position:relative;width:100%;padding:0;border:0;background:none;
  cursor:pointer;text-align:left;
}
.vcard__btn[disabled]{cursor:default}
.vcard__btn .media img{transition:transform 500ms var(--ease-editorial)}
.vcard__btn:hover:not([disabled]) .media img{transform:scale(1.025)}
.vcard__play{position:absolute;inset:0;display:grid;place-items:center;color:var(--ivory);
  opacity:0;transition:opacity var(--motion-fast) var(--ease-ui)}
.vcard__play .icon{width:48px;height:48px}
.vcard__btn:hover .vcard__play,.vcard__btn:focus-visible .vcard__play{opacity:1}
.vcard__dur{
  position:absolute;right:.7rem;bottom:.7rem;padding:.2em .55em;border-radius:2px;
  background:rgba(17,17,17,.72);color:var(--ivory);font-size:var(--fs-micro);letter-spacing:.04em;
}
.vcard__dur--soon{background:rgba(251,248,244,.9);color:var(--ink-70)}
.vcard__lock{position:absolute;right:.7rem;top:.7rem;color:var(--ivory);opacity:.9}
.vcard__t{font-size:.9375rem;font-weight:500;margin-top:.9rem}
.vcard__s{font-size:var(--fs-small);color:var(--ink-55)}
.vcard__locked{font-size:var(--fs-micro);letter-spacing:.08em;text-transform:uppercase;color:var(--taupe);margin-top:.5rem}
html[lang^="th"] .vcard__locked{text-transform:none;letter-spacing:.03em;font-size:.8125rem}
.libgrid{display:grid;gap:clamp(1rem,2vw,1.8rem);grid-template-columns:repeat(2,1fr)}
@media (min-width:820px){ .libgrid{grid-template-columns:repeat(4,1fr)} }
.vcard--lib .vcard__btn.is-locked{display:block;cursor:default}

/* =========================================================================
   07 Concerns
   ========================================================================= */
.concerns__grid{display:grid;gap:1px;background:var(--hair);border:1px solid var(--hair)}
@media (min-width:700px){ .concerns__grid{grid-template-columns:repeat(2,1fr)} }
@media (min-width:1100px){ .concerns__grid{grid-template-columns:repeat(3,1fr)} }
.concern{background:var(--warm);padding:clamp(1.4rem,2.4vw,2.1rem);display:flex;gap:1.1rem;align-items:flex-start}
.concern__n{font-family:var(--serif);font-size:1.3rem;color:var(--taupe);line-height:1;padding-top:.15em}
.concern p{color:var(--ink-70);font-size:.9375rem}
.concerns__cta,.steps__cta{margin-top:clamp(1.8rem,3vw,2.8rem);display:flex;gap:1.6rem;flex-wrap:wrap;align-items:center}

/* =========================================================================
   08 Steps
   ========================================================================= */
.steps__grid{display:grid;gap:clamp(1.6rem,3vw,2.6rem);counter-reset:step}
@media (min-width:700px){ .steps__grid{grid-template-columns:repeat(2,1fr)} }
@media (min-width:1100px){ .steps__grid{grid-template-columns:repeat(4,1fr)} }
.step{padding-top:1.4rem;border-top:1px solid var(--hair);position:relative}
.step__art{display:block;color:var(--taupe);margin-bottom:1.2rem}
.step__art .icon{width:64px;height:64px}
.step__n{font-size:var(--fs-micro);letter-spacing:.16em;color:var(--taupe);margin-bottom:.4rem}
.step__t{font-family:var(--serif);font-weight:300;font-size:var(--fs-h3)}
html[lang^="th"] .step__t{font-family:var(--thai-serif)}
.step__b{color:var(--ink-70);font-size:.9375rem;margin-top:.5rem;max-width:26em}

/* benefits strip -------------------------------------------------------- */
.benefits__row{display:grid;gap:1px;background:var(--hair);border-block:1px solid var(--hair);
  grid-template-columns:repeat(2,1fr)}
@media (min-width:820px){ .benefits__row{grid-template-columns:repeat(5,1fr)} }
.benefit{background:var(--ivory);padding:clamp(1.3rem,2.4vw,2rem) 1rem;text-align:center;
  display:flex;flex-direction:column;align-items:center;gap:.8rem}
.benefit__i{color:var(--taupe)}
.benefit__i .icon{width:26px;height:26px}
.benefit p{font-size:var(--fs-small);color:var(--ink-70);line-height:1.5}

/* =========================================================================
   09 Products
   ========================================================================= */
.products{display:grid;gap:clamp(1.4rem,3vw,2.6rem)}
@media (min-width:700px){ .products{grid-template-columns:repeat(3,1fr)} .products--two{grid-template-columns:repeat(2,1fr)} }
.pcard__link{display:block}
.pcard .media{background:var(--warm)}
.pcard__link:hover .media img{transform:scale(1.022)}
.pcard__t{font-family:var(--serif);font-weight:300;font-size:var(--fs-h3);margin-top:1.1rem}
html[lang^="th"] .pcard__t{font-family:var(--thai-serif)}
.pcard__s{font-size:.9375rem;color:var(--ink-70);margin-top:.35rem;max-width:30em}
.pcard__price{font-size:.9375rem;margin-top:.6rem;color:var(--ink)}
.pcard__add{margin-top:1.1rem}
.wrapnote{margin-bottom:2rem}

/* =========================================================================
   10 Membership
   ========================================================================= */
.member__grid{display:grid}
@media (min-width:900px){ .member__grid{grid-template-columns:repeat(2,1fr);align-items:stretch} }
.member__copy{display:flex;align-items:center;padding:clamp(2rem,5vw,5rem) var(--gut)}
.member__copyin{max-width:34em;margin-inline:auto;width:100%}
.member__copy .lead{margin-top:1rem}
.member__price{margin:1.8rem 0;display:flex;align-items:baseline;gap:.6rem}
.member__price strong{font-family:var(--serif);font-weight:300;font-size:clamp(2.2rem,1.4rem + 2.4vw,3.2rem);line-height:1}
.member__price span{font-size:var(--fs-micro);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-55)}
.member__price--soon{font-size:var(--fs-micro);letter-spacing:.14em;text-transform:uppercase;color:var(--taupe)}
html[lang^="th"] .member__price span,html[lang^="th"] .member__price--soon{text-transform:none;letter-spacing:.04em;font-size:.875rem}
.member__perks{margin-top:1.8rem;display:grid;gap:.7rem}
.member__perks li{display:flex;gap:.8rem;align-items:center;font-size:.9375rem;color:var(--ink-70)}
.member__perks .icon{width:8px;height:11px;color:var(--taupe)}
.member__media{position:relative}
.member__media .media img{aspect-ratio:1/1;height:100%}
@media (max-width:899px){ .member__media .media img{aspect-ratio:4/3} }
.member__watch{
  position:absolute;left:clamp(1.4rem,3vw,3rem);bottom:clamp(1.4rem,3vw,3rem);
  display:flex;align-items:center;gap:.9rem;color:var(--ivory);
  font-family:var(--serif);font-size:clamp(1.5rem,1rem + 1.6vw,2.4rem);font-weight:300;
  text-shadow:0 1px 24px rgba(17,17,17,.35);
}
html[lang^="th"] .member__watch{font-family:var(--thai-serif)}
.member__watch .icon{width:40px;height:40px}

/* =========================================================================
   11 Spa
   ========================================================================= */
.spa__grid{display:grid;gap:clamp(1.8rem,4vw,3.4rem);align-items:center}
@media (min-width:900px){ .spa__grid{grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr)} }
.spa__copy p{color:var(--ink-70);margin:1rem 0 1.8rem;max-width:30em}
.spahero .media img{aspect-ratio:21/9}
@media (max-width:767px){ .spahero .media img{aspect-ratio:4/3} }
.treat__grid{display:grid;gap:1px;background:var(--hair);border:1px solid var(--hair)}
@media (min-width:820px){ .treat__grid{grid-template-columns:repeat(3,1fr)} }
.treat__i{background:var(--bg);padding:clamp(1.6rem,3vw,2.4rem)}
.treat__t{font-family:var(--serif);font-weight:300;font-size:var(--fs-h3);margin-bottom:.6rem}
html[lang^="th"] .treat__t{font-family:var(--thai-serif)}
.treat__i p{color:var(--ink-70);font-size:.9375rem}
.addr{font-style:normal;color:var(--ink-70);margin-bottom:1rem}
.hours{display:grid;gap:.4rem;font-size:.9375rem;color:var(--ink-70)}
.hours li{display:flex;justify-content:space-between;gap:1rem;max-width:20em;border-bottom:1px solid var(--hair);padding-bottom:.35rem}

/* =========================================================================
   12 Journal
   ========================================================================= */
.jgrid{display:grid;gap:clamp(1.6rem,3vw,2.6rem)}
@media (min-width:760px){ .jgrid{grid-template-columns:repeat(3,1fr)} }
.jcard a:hover .media img{transform:scale(1.022)}
.jcard__d{font-size:var(--fs-micro);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-55);margin-top:1rem}
html[lang^="th"] .jcard__d{text-transform:none;letter-spacing:.03em;font-size:.8125rem}
.jcard__t{font-family:var(--serif);font-weight:300;font-size:var(--fs-h3);margin-top:.6rem;line-height:1.2}
html[lang^="th"] .jcard__t{font-family:var(--thai-serif);line-height:1.4}
.jcard__x{color:var(--ink-70);font-size:.9375rem;margin-top:.5rem}

/* newsletter ------------------------------------------------------------ */
.news__inner{max-width:44em;margin-inline:auto;text-align:center}
.news__inner .eyebrow{justify-content:center}
.subscribe{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:2rem;justify-content:center}
.subscribe input{
  flex:1 1 260px;max-width:380px;min-height:46px;padding:0 1rem;
  background:var(--bg);border:1px solid var(--hair);border-radius:2px;
}
.subscribe input:focus-visible{border-color:var(--ink)}
.news__note{font-size:var(--fs-small);color:var(--ink-55);margin-top:1rem}
.formmsg{flex-basis:100%;font-size:var(--fs-small);color:var(--ink-70);min-height:1.4em}
.formmsg.is-error{color:#8A2A16}

/* =========================================================================
   Page head + editorial pages
   ========================================================================= */
.phead__inner{max-width:46em}
.phead .lead{margin-top:1.4rem}

.story__ch{padding-block:var(--sec-half)}
.story__grid{display:grid;gap:clamp(1.8rem,4vw,3.4rem);align-items:center}
@media (min-width:900px){
  .story__grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
  .story__ch--flip .story__media{order:2}
}
.story__copy p{color:var(--ink-70);max-width:var(--measure)}
.story__copy p+p{margin-top:1rem}
.story__copy .btn--text{margin-top:1.8rem}
.story__n{font-size:var(--fs-micro);letter-spacing:var(--track-ui);text-transform:uppercase;color:var(--ink-55);margin-bottom:1rem}
html[lang^="th"] .story__n{text-transform:none;letter-spacing:.04em;font-size:.8125rem}
.story__n span{color:var(--taupe)}

.pillars__grid{display:grid;gap:1px;background:var(--hair);border:1px solid var(--hair)}
@media (min-width:820px){ .pillars__grid{grid-template-columns:repeat(3,1fr)} }
.pillar{background:var(--bg);padding:clamp(1.7rem,3vw,2.6rem)}
.pillar__n{font-family:var(--serif);font-size:1.2rem;color:var(--taupe)}
.pillar__t{font-family:var(--serif);font-weight:300;font-size:var(--fs-h3);margin:.7rem 0 .7rem}
html[lang^="th"] .pillar__t{font-family:var(--thai-serif)}
.pillar p{color:var(--ink-70);font-size:.9375rem}
.pillars__close{margin-top:clamp(2rem,4vw,3.2rem);max-width:var(--measure);color:var(--ink-70)}

.sci__wrap{max-width:52em}
.sci__block+.sci__block{margin-top:clamp(2.4rem,5vw,4rem);padding-top:clamp(2.4rem,5vw,4rem);border-top:1px solid var(--hair)}
.sci__t{font-family:var(--serif);font-weight:300;font-size:var(--fs-h2);margin-bottom:1rem}
html[lang^="th"] .sci__t{font-family:var(--thai-serif)}
.sci__block p{color:var(--ink-70);max-width:var(--measure)}
.ticks{display:grid;gap:.75rem;margin-top:1.4rem}
.ticks li{display:flex;gap:.85rem;align-items:flex-start;color:var(--ink-70);font-size:.9375rem}
.ticks .icon{width:8px;height:11px;color:var(--taupe);margin-top:.45em}

.faq{border-top:1px solid var(--hair);margin-top:1.4rem}
.faq__i{border-bottom:1px solid var(--hair)}
.faq__i summary{
  display:flex;justify-content:space-between;gap:1.4rem;align-items:center;
  padding:1.1rem 0;cursor:pointer;list-style:none;font-size:1.0625rem;
}
.faq__i summary::after{content:"";width:11px;height:11px;flex:none;
  border-right:1px solid var(--ink);border-bottom:1px solid var(--ink);
  transform:rotate(45deg) translate(-2px,-2px);
  transition:transform var(--motion-fast) var(--ease-ui)}
.faq__i[open] summary::after{transform:rotate(225deg) translate(-2px,-2px)}
.faq__a{padding-bottom:1.2rem;color:var(--ink-70);max-width:var(--measure)}

.howto__list{display:grid;gap:clamp(2rem,4vw,3.2rem)}
.howto__item{display:grid;gap:1.4rem;align-items:start;padding-top:1.6rem;border-top:1px solid var(--hair)}
@media (min-width:760px){ .howto__item{grid-template-columns:96px minmax(0,1fr);gap:2.4rem} }
.howto__art{color:var(--taupe)}
.howto__art .icon{width:80px;height:80px}
.howto__t{font-family:var(--serif);font-weight:300;font-size:var(--fs-h3);margin:.3rem 0 .6rem}
html[lang^="th"] .howto__t{font-family:var(--thai-serif)}
.howto__item p{color:var(--ink-70);max-width:var(--measure)}
.caution{margin-top:clamp(2.4rem,4vw,3.6rem);padding:clamp(1.4rem,2.6vw,2.2rem);
  background:var(--warm);border:1px solid var(--hair);border-radius:2px;max-width:44em}
.caution__t{font-size:var(--fs-micro);letter-spacing:var(--track-ui);text-transform:uppercase;margin-bottom:1rem}
html[lang^="th"] .caution__t{text-transform:none;letter-spacing:.05em;font-size:.875rem}
.caution ul{display:grid;gap:.6rem}
.caution li{color:var(--ink-70);font-size:.9375rem;padding-left:1.1rem;position:relative}
.caution li::before{content:"";position:absolute;left:0;top:.75em;width:5px;height:1px;background:var(--taupe)}

/* PDP -------------------------------------------------------------------- */
.pdp__grid{display:grid;gap:clamp(1.8rem,4vw,3.6rem);align-items:start}
@media (min-width:900px){ .pdp__grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)}
  .pdp__copy{position:sticky;top:calc(var(--header-h) + 2rem)} }
.pdp__copy .display{font-size:var(--fs-h2)}
.pdp__price{font-size:1.125rem;margin-top:1.4rem}
.pdp__size{font-size:var(--fs-small);color:var(--ink-55);margin-bottom:1.6rem}
.pdp .lead{margin-top:.8rem}
.acc{margin-top:2.2rem;border-top:1px solid var(--hair)}
.acc__i{border-bottom:1px solid var(--hair)}
.acc__i summary{display:flex;justify-content:space-between;align-items:center;gap:1rem;
  padding:1rem 0;cursor:pointer;list-style:none;
  font-size:var(--fs-micro);letter-spacing:var(--track-ui);text-transform:uppercase}
html[lang^="th"] .acc__i summary{text-transform:none;letter-spacing:.04em;font-size:.9375rem}
.acc__i summary::after{content:"+";font-size:1.1rem;line-height:1}
.acc__i[open] summary::after{content:"–"}
.acc__b{padding-bottom:1.2rem;color:var(--ink-70)}

/* article ---------------------------------------------------------------- */
.art{padding-block:clamp(48px,7vw,110px) var(--sec)}
.art__headin{max-width:42em}
.art__d{font-size:var(--fs-micro);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-55);margin-top:1.2rem}
html[lang^="th"] .art__d{text-transform:none;letter-spacing:.03em;font-size:.8125rem}
.art__media{margin-block:clamp(2rem,4vw,3.4rem)}
.art__body{max-width:calc(var(--measure) + var(--gut) * 2)}
.art__body p{color:var(--ink-70);font-size:1.0625rem}
.art__body p+p{margin-top:1.2rem}
.art__foot{margin-top:2.6rem}

/* forms ------------------------------------------------------------------ */
.formsec__grid{display:grid;gap:clamp(2rem,4vw,3.6rem)}
@media (min-width:900px){ .formsec__grid{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)} }
.formsec__aside .rowhead__t{margin-bottom:1rem}
.contactlines{display:grid;gap:.5rem;color:var(--ink-70);font-size:.9375rem}
.lead__row{display:grid;gap:1rem}
@media (min-width:640px){ .lead__row{grid-template-columns:repeat(2,1fr)} }
.field{display:block;margin-bottom:1rem}
.field>span{display:block;font-size:var(--fs-micro);letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-55);margin-bottom:.5rem}
html[lang^="th"] .field>span{text-transform:none;letter-spacing:.03em;font-size:.875rem}
.field input,.field select,.field textarea{
  width:100%;min-height:46px;padding:.6rem .9rem;background:var(--bg);
  border:1px solid var(--hair);border-radius:2px;
}
.field textarea{min-height:120px;resize:vertical}
.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible{border-color:var(--ink)}
.lead .btn{margin-top:.6rem}
.pending{display:flex;gap:.85rem;align-items:flex-start;padding:1rem 1.1rem;
  background:var(--warm);border:1px solid var(--hair);border-radius:2px;
  font-size:.9375rem;color:var(--ink-70);max-width:40em}
.pending .icon{width:8px;height:11px;color:var(--taupe);margin-top:.5em;flex:none}

/* cta band --------------------------------------------------------------- */
.cta__inner{max-width:40em;margin-inline:auto;text-align:center}
.cta__inner p{color:var(--ink-70);margin:1rem 0 2rem}

/* cross links ------------------------------------------------------------ */
.xlinks__row{display:grid;gap:1px;background:var(--hair);border-block:1px solid var(--hair)}
@media (min-width:820px){ .xlinks__row{grid-template-columns:repeat(3,1fr)} }
.xlinks__row a{display:flex;flex-direction:column;gap:.5rem;background:var(--bg);
  padding:clamp(1.5rem,2.8vw,2.2rem);height:100%;transition:background var(--motion-fast) var(--ease-ui)}
.xlinks__row a:hover{background:var(--warm)}
.xlinks__row a:hover .icon--arrow{transform:translateX(4px)}
.xlinks__e{font-size:var(--fs-micro);letter-spacing:var(--track-ui);text-transform:uppercase;color:var(--ink-55)}
html[lang^="th"] .xlinks__e{text-transform:none;letter-spacing:.04em;font-size:.8125rem}
.xlinks__t{font-family:var(--serif);font-weight:300;font-size:1.35rem;line-height:1.2}
html[lang^="th"] .xlinks__t{font-family:var(--thai-serif);line-height:1.4}

/* disclaimer ------------------------------------------------------------- */
.disclaim{background:var(--beige);padding-block:var(--sec-half)!important}
.disclaim__inner{max-width:52em}
.disclaim__t{font-size:var(--fs-micro);letter-spacing:var(--track-ui);text-transform:uppercase;margin-bottom:.8rem}
html[lang^="th"] .disclaim__t{text-transform:none;letter-spacing:.05em;font-size:.875rem}
.disclaim p{font-size:.9375rem;color:var(--ink-70)}

/* legal ------------------------------------------------------------------ */
.legal__wrap{max-width:46em}
.legal__b+.legal__b{margin-top:2.4rem}
.legal__t{font-family:var(--serif);font-weight:300;font-size:var(--fs-h3);margin-bottom:.8rem}
html[lang^="th"] .legal__t{font-family:var(--thai-serif)}
.legal__b p{color:var(--ink-70);font-size:.9375rem}
.legal__b p+p{margin-top:.8rem}
.legal .pending{margin-bottom:2.4rem}
.legal__upd{margin-top:2.6rem;font-size:var(--fs-small);color:var(--ink-55)}

/* =========================================================================
   Footer
   ========================================================================= */
.footer{background:var(--ink);color:var(--ivory);padding-block:clamp(3rem,6vw,5.5rem) 2rem}
.footer__grid{display:grid;gap:clamp(2rem,4vw,3rem)}
@media (min-width:760px){ .footer__grid{grid-template-columns:repeat(2,1fr)} }
@media (min-width:1100px){ .footer__grid{grid-template-columns:1.4fr repeat(4,1fr)} }
.fbrand .brand__mark{width:150px;opacity:1}
.fbrand__tag{color:rgba(251,248,244,.62);margin-top:1.2rem;max-width:22em;font-size:.9375rem}
.fbrand__mail{margin-top:1rem;font-size:.9375rem;color:rgba(251,248,244,.62)}
.fbrand__mail a:hover{color:var(--ivory)}
.fsocial{display:flex;gap:.4rem;margin-top:1.2rem}
.fcol__t{font-size:var(--fs-micro);letter-spacing:var(--track-ui);text-transform:uppercase;
  color:rgba(251,248,244,.5);margin-bottom:1.1rem;font-weight:500}
html[lang^="th"] .fcol__t{text-transform:none;letter-spacing:.04em;font-size:.875rem}
.fcol ul{display:grid;gap:.6rem}
.fcol a{font-size:.9375rem;color:rgba(251,248,244,.78)}
.fcol a:hover{color:var(--ivory)}
.footer__base{
  margin-top:clamp(2.4rem,5vw,4rem);padding-top:1.6rem;
  border-top:1px solid rgba(251,248,244,.16);
  display:flex;flex-wrap:wrap;gap:1rem 2rem;align-items:center;
  font-size:var(--fs-small);color:rgba(251,248,244,.5);
}
.footer__legal{display:flex;flex-wrap:wrap;gap:1.2rem}
.footer__legal a:hover,.footer__lang a:hover{color:var(--ivory)}
.footer__lang{margin-left:auto}

/* =========================================================================
   Drawers, scrim, cookie
   ========================================================================= */
.scrim{position:fixed;inset:0;z-index:80;background:rgba(17,17,17,.42);
  opacity:0;transition:opacity var(--motion-fast) var(--ease-ui)}
.scrim.is-on{opacity:1}
.drawer{
  position:fixed;top:0;bottom:0;z-index:90;width:min(420px,90vw);
  background:var(--ivory);display:flex;flex-direction:column;
  transition:transform 380ms var(--ease-editorial);
}
.drawer--left{left:0;transform:translateX(-102%)}
.drawer--right{right:0;transform:translateX(102%)}
.drawer.is-open{transform:none}
.drawer__head{display:flex;align-items:center;justify-content:space-between;
  padding:1rem var(--gut);border-bottom:1px solid var(--hair);min-height:var(--header-h)}
.drawer__head .eyebrow{margin:0}
.drawer__foot{padding:1.2rem var(--gut) 1.6rem;border-top:1px solid var(--hair)}
.drawer__foot a{display:inline-flex;align-items:center;gap:.6rem;font-size:.9375rem}

.mnav{flex:1;overflow-y:auto;padding:.6rem var(--gut) 2rem}
.mnav>ul>li{border-bottom:1px solid var(--hair)}
.mnav__toggle,.mnav__link{
  display:flex;width:100%;align-items:center;justify-content:space-between;gap:1rem;
  padding:1rem 0;background:none;border:0;cursor:pointer;text-align:left;
  font-family:var(--serif);font-weight:300;font-size:1.4rem;
}
html[lang^="th"] .mnav__toggle,html[lang^="th"] .mnav__link{font-family:var(--thai-serif);font-size:1.15rem}
.mnav__toggle .icon--arrow{transform:rotate(90deg);transition:transform var(--motion-fast) var(--ease-ui)}
.mnav__toggle[aria-expanded="true"] .icon--arrow{transform:rotate(-90deg)}
.mnav__sub{display:none;padding:0 0 1rem .2rem;gap:.7rem}
.mnav__sub.is-open{display:grid}
.mnav__sub a{font-size:.9375rem;color:var(--ink-70)}

.cart{flex:1;overflow-y:auto;padding:1.4rem var(--gut)}
.cart__empty{color:var(--ink-55);font-size:.9375rem}
.citem{display:grid;grid-template-columns:64px 1fr auto;gap:1rem;align-items:center;
  padding:1rem 0;border-bottom:1px solid var(--hair)}
.citem .media img{aspect-ratio:1/1}
.citem__t{font-size:.9375rem}
.citem__m{font-size:var(--fs-small);color:var(--ink-55)}
.citem__x{background:none;border:0;cursor:pointer;font-size:var(--fs-micro);
  letter-spacing:.08em;text-transform:uppercase;color:var(--ink-55)}
.cart__foot .note{margin-bottom:1rem}

.cookie{
  position:fixed;right:clamp(12px,2vw,24px);bottom:clamp(12px,2vw,24px);z-index:70;
  width:min(360px,calc(100vw - 24px));background:var(--ivory);
  border:1px solid var(--hair);border-radius:2px;padding:1.1rem 1.2rem;
  display:grid;gap:.9rem;box-shadow:0 12px 40px rgba(23,21,19,.08);
  opacity:0;transform:translateY(12px);
  transition:opacity var(--motion-base) var(--ease-editorial),transform var(--motion-base) var(--ease-editorial);
}
.cookie.is-on{opacity:1;transform:none}
.cookie p{font-size:var(--fs-small);color:var(--ink-70)}
.cookie a{text-decoration:underline;text-underline-offset:2px}
.cookie .btn{justify-self:start}

body.is-locked{overflow:hidden}

/* video modal ------------------------------------------------------------ */
.vmodal{position:fixed;inset:0;z-index:95;display:grid;place-items:center;padding:var(--gut)}
.vmodal__panel{width:min(960px,100%);background:var(--black);border-radius:2px;position:relative;
  opacity:0;transform:translateY(12px);transition:opacity 360ms var(--ease-editorial),transform 360ms var(--ease-editorial)}
.vmodal.is-on .vmodal__panel{opacity:1;transform:none}
.vmodal__panel video{width:100%;aspect-ratio:16/9;background:#000}
.vmodal__close{position:absolute;top:-46px;right:0;color:var(--ivory)}

/* =========================================================================
   Reveal on scroll
   ========================================================================= */
.reveal{opacity:0;transform:translateY(24px);
  transition:opacity var(--motion-base) var(--ease-editorial),transform var(--motion-base) var(--ease-editorial)}
.reveal.is-in{opacity:1;transform:none}
.reveal.is-in .ritualcard,.reveal.is-in .concern,.reveal.is-in .step,
.reveal.is-in .pcard,.reveal.is-in .jcard,.reveal.is-in .pillar{
  animation:rise var(--motion-base) var(--ease-editorial) both;
  animation-delay:calc(min(var(--i,0),4) * var(--stagger));
}
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

/* hero entrance timeline (brief 07) */
.hero .line{display:block;opacity:0;clip-path:inset(0 0 105% 0);
  animation:lineIn var(--motion-base) var(--ease-editorial) both;
  animation-delay:calc(320ms + var(--l,0) * var(--stagger))}
@keyframes lineIn{to{opacity:1;clip-path:inset(0 0 -10% 0)}}
.hero__sub,.hero__points{opacity:0;animation:rise var(--motion-base) var(--ease-editorial) both;animation-delay:620ms}
.hero__cta{opacity:0;animation:rise var(--motion-base) var(--ease-editorial) both;animation-delay:760ms}
.hero .media img{animation:heroImg var(--motion-slow) var(--ease-editorial) both;animation-delay:120ms}
@keyframes heroImg{from{clip-path:inset(0 0 100% 0);transform:scale(1.035)}to{clip-path:inset(0);transform:scale(1)}}
.header{animation:fadeIn 180ms var(--ease-ui) both}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

/* =========================================================================
   Responsive: header collapse
   ========================================================================= */
@media (max-width:1179px){
  .nav{display:none}
  .header__burger{display:inline-flex}
  .brand{position:absolute;left:50%;transform:translateX(-50%);margin:0}
  .header__inner{justify-content:space-between}
  .lang span{display:none}
}
/* Below 700px absolute centring can collide with the burger and the utility
   icons, so the wordmark returns to the normal flow instead. */
@media (max-width:699px){
  .brand{position:static;left:auto;transform:none;margin-left:.6rem;margin-right:auto}
  .brand__mark{width:clamp(88px,26vw,116px)}
}

/* =========================================================================
   prefers-reduced-motion (brief 13 - required behaviour)
   ========================================================================= */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important;
  }
  .reveal{opacity:1!important;transform:none!important}
  .hero .line{opacity:1;clip-path:none;animation:none}
  .hero__sub,.hero__points,.hero__cta{opacity:1;animation:none}
  .hero .media img{animation:none;clip-path:none;transform:none}
  .founder__chapters>li{opacity:1!important;transform:none!important;position:static!important;pointer-events:auto!important}
  @media (min-width:1024px){
    .founder__stage{height:auto}
    .founder__grid{position:static;height:auto;padding-block:var(--sec)}
    .founder__chapters{display:block;min-height:0}
    .founder__chapters>li+li{margin-top:2.5rem}
    .founder__frame{opacity:1;display:none}
    .founder__frame.is-active{display:block}
  }
  .rail__track{scroll-snap-type:none}
}