/* Fernhill Dental Studio — Asheville, NC.
   One stylesheet for all four pages. Palette: botanical green + bone + clay. */

/* ============ 1. TOKENS ============ */
:root{
  --ink:#101F18;
  --forest:#1C3A2C;
  --moss:#2C5442;
  --fern:#4F9B6B;
  --fern-soft:#7FBE95;
  --clay:#BE6F46;
  --clay-soft:#E3B79A;
  --bone:#F4EFE4;
  --bone-2:#EDE6D8;
  --cream:#FBF8F0;
  --sage:#CBD8C7;
  --sage-2:#DCE5D6;
  --body:#35473C;
  --stone:#5A6A5F;
  --line:rgba(28,58,44,.14);
  --line-soft:rgba(28,58,44,.08);

  --ff-display:"Bricolage Grotesque","Trebuchet MS",sans-serif;
  --ff-text:"Instrument Sans","Helvetica Neue",Arial,sans-serif;
  --ff-serif:"Instrument Serif","Iowan Old Style",Georgia,serif;

  --r-sm:12px; --r-md:20px; --r-lg:32px; --r-xl:44px; --r-pill:999px;

  --gut:clamp(1.15rem,4.2vw,4.5rem);
  --sec:clamp(4.5rem,9vw,8.5rem);
  --max:1280px;

  --ease:cubic-bezier(.22,.85,.28,1);
  --ease-out:cubic-bezier(.16,1,.3,1);

  --sh-1:0 1px 2px rgba(16,31,24,.05), 0 4px 12px rgba(16,31,24,.05);
  --sh-2:0 1px 2px rgba(16,31,24,.05), 0 10px 24px -8px rgba(16,31,24,.12), 0 30px 60px -30px rgba(16,31,24,.22);
  --sh-3:0 2px 4px rgba(16,31,24,.06), 0 18px 40px -14px rgba(16,31,24,.20), 0 56px 90px -50px rgba(16,31,24,.36);
}

/* ============ 2. RESET ============ */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--bone);
  color:var(--body);
  font-family:var(--ff-text);
  font-size:clamp(1rem,.96rem + .18vw,1.0625rem);
  line-height:1.62;
  letter-spacing:.002em;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
h1,h2,h3,h4,p,figure,blockquote,ul,ol,dl,dd{margin:0}
ul,ol{padding:0;list-style:none}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;padding:0;cursor:pointer}
[hidden]{display:none !important} /* beats .btn's display:inline-flex */
:focus-visible{outline:2.5px solid var(--fern);outline-offset:3px;border-radius:6px}
::selection{background:var(--fern);color:#fff}

/* grain */
body::after{
  content:"";position:fixed;inset:0;z-index:60;pointer-events:none;opacity:.32;
  mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E");
}

/* ============ 3. TYPE ============ */
.h-xl,.h-lg,.h-md,.h-sm{
  font-family:var(--ff-display);font-weight:800;color:var(--ink);
  line-height:.94;letter-spacing:-.035em;text-wrap:balance;
}
.h-xl{font-size:clamp(2.5rem,1.35rem + 4.9vw,4.4rem)}
.h-lg{font-size:clamp(2.05rem,1.3rem + 3.3vw,3.5rem);line-height:.98}
.h-md{font-size:clamp(1.65rem,1.15rem + 2.1vw,2.65rem);line-height:1.04;letter-spacing:-.03em;font-weight:700}
.h-sm{font-size:clamp(1.18rem,1.03rem + .68vw,1.5rem);line-height:1.16;letter-spacing:-.022em;font-weight:700}
.accent{color:var(--fern)}
.accent-clay{color:var(--clay)}

.eyebrow{
  font-family:var(--ff-text);font-size:.735rem;font-weight:600;
  letter-spacing:.19em;text-transform:uppercase;color:var(--moss);
  display:flex;align-items:center;gap:.7rem;
}
.eyebrow::before{content:"";width:26px;height:1.5px;background:var(--fern);flex:none;border-radius:2px}
.eyebrow--plain::before{display:none}
.lead{font-size:clamp(1.06rem,1rem + .38vw,1.24rem);line-height:1.6;color:var(--body);max-width:46ch}
.muted{color:var(--stone)}
.small{font-size:.875rem;line-height:1.55}
.tiny{font-size:.775rem;letter-spacing:.02em}
.num{font-family:var(--ff-serif);font-style:italic;font-weight:400}

/* ============ 4. LAYOUT ============ */
.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--gut)}
.wrap--wide{max-width:1480px}
.sec{padding-block:var(--sec)}
.sec--tight{padding-block:clamp(3rem,6vw,5.5rem)}
.stack>*+*{margin-top:1.15rem}
.rule{height:1px;background:var(--line);border:0;margin:0}

/* ============ 5. BUTTONS ============ */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
  min-height:52px;padding:.9rem 1.8rem;border-radius:var(--r-pill);
  font-family:var(--ff-text);font-size:.955rem;font-weight:600;letter-spacing:.005em;
  text-decoration:none;cursor:pointer;position:relative;isolation:isolate;
  transition:transform .45s var(--ease),box-shadow .45s var(--ease),background-color .3s var(--ease),color .3s var(--ease);
}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn--primary{background:var(--forest);color:var(--bone);box-shadow:var(--sh-2)}
.btn--primary:hover{background:var(--ink);box-shadow:var(--sh-3)}
.btn--fern{background:var(--fern);color:#0C2016;box-shadow:0 10px 26px -12px rgba(79,155,107,.85)}
.btn--fern:hover{background:var(--fern-soft)}
.btn--ghost{background:transparent;color:var(--forest);box-shadow:inset 0 0 0 1.5px var(--line)}
.btn--ghost:hover{box-shadow:inset 0 0 0 1.5px var(--forest);background:rgba(28,58,44,.04)}
.btn--light{background:var(--bone);color:var(--forest)}
.btn--light:hover{background:#fff}
.btn__ico{width:16px;height:16px;transition:transform .45s var(--ease)}
.btn:hover .btn__ico{transform:translateX(4px)}
.btn[disabled]{opacity:.42;pointer-events:none}

.textlink{
  display:inline-flex;align-items:center;gap:.45rem;color:var(--moss);
  font-weight:600;text-decoration:none;padding-block:.35rem;min-height:44px;
  background-image:linear-gradient(var(--fern),var(--fern));
  background-size:100% 1.5px;background-repeat:no-repeat;background-position:0 100%;
  transition:background-size .45s var(--ease),color .3s;
}
.textlink:hover{background-size:0% 1.5px;color:var(--fern)}

/* chips */
.chips{display:flex;flex-wrap:wrap;gap:.55rem}
.chip{
  display:inline-flex;align-items:center;gap:.5rem;min-height:44px;
  padding:.55rem 1.05rem;border-radius:var(--r-pill);
  border:1.4px solid var(--line);background:rgba(255,255,255,.42);
  font-size:.85rem;font-weight:500;color:var(--body);text-decoration:none;
  transition:border-color .4s var(--ease),background-color .4s var(--ease),transform .4s var(--ease),color .4s;
}
.chip:hover{border-color:var(--fern);background:#fff;transform:translateY(-2px);color:var(--forest)}
.chip__dot{width:5px;height:5px;border-radius:50%;background:var(--fern-soft);flex:none}

/* ============ 6. NAV ============ */
.nav{
  position:sticky;top:0;z-index:70;
  background:rgba(244,239,228,.78);
  backdrop-filter:blur(16px) saturate(1.3);
  -webkit-backdrop-filter:blur(16px) saturate(1.3);
  border-bottom:1px solid transparent;
  transition:border-color .4s var(--ease),background-color .4s var(--ease);
}
.nav.is-stuck{border-bottom-color:var(--line-soft);background:rgba(244,239,228,.93)}
.nav__in{display:flex;align-items:center;gap:1.5rem;min-height:78px}
.brand{display:flex;align-items:center;gap:.62rem;text-decoration:none;flex:none;margin-right:auto;min-height:44px}
.brand__mark{width:34px;height:34px;flex:none;color:var(--fern)}
.brand__txt{display:flex;flex-direction:column;line-height:1}
.brand__name{
  font-family:var(--ff-display);font-weight:700;font-size:1.02rem;
  letter-spacing:-.02em;color:var(--ink);
}
.brand__sub{font-size:.605rem;letter-spacing:.22em;text-transform:uppercase;color:var(--stone);margin-top:.24rem}

.nav__links{display:flex;align-items:center;gap:.25rem}
.nav__link{
  position:relative;padding:.55rem .85rem;border-radius:var(--r-pill);
  font-size:.925rem;font-weight:500;color:var(--body);text-decoration:none;
  transition:color .3s var(--ease),background-color .3s var(--ease);
}
.nav__link:hover{color:var(--ink);background:rgba(28,58,44,.055)}
.nav__link[aria-current="page"]{color:var(--forest);font-weight:600}
.nav__link[aria-current="page"]::after{
  content:"";position:absolute;left:50%;bottom:.18rem;translate:-50% 0;
  width:5px;height:5px;border-radius:50%;background:var(--fern);
}
.nav__cta{margin-left:.9rem;min-height:46px;padding:.7rem 1.35rem;font-size:.9rem}
.nav__tel{font-size:.9rem;font-weight:600;color:var(--moss);text-decoration:none;white-space:nowrap;padding:.5rem .3rem}
.nav__tel:hover{color:var(--fern)}

.burger{
  display:none;flex-direction:column;width:46px;height:46px;border-radius:50%;
  border:1.4px solid var(--line);align-items:center;justify-content:center;flex:none;
  transition:border-color .3s,background-color .3s;
}
.burger:hover{border-color:var(--forest)}
.burger span{display:block;width:17px;height:1.7px;background:var(--ink);border-radius:2px;transition:transform .5s var(--ease-out),opacity .3s}
.burger span+span{margin-top:4.6px}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(6.3px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.3px) rotate(-45deg)}

/* drawer */
.drawer{
  position:fixed;inset:0;z-index:80;visibility:hidden;pointer-events:none;
  overflow:hidden; /* clips the off-canvas panel so it can't extend the document */
}
.drawer__scrim{
  position:absolute;inset:0;background:rgba(16,31,24,.42);
  opacity:0;transition:opacity .5s var(--ease);
  backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
}
.drawer__panel{
  position:absolute;top:0;right:0;bottom:0;width:min(92vw,400px);
  background:var(--forest);color:var(--bone);
  padding:1.4rem var(--gut) 2rem;
  display:flex;flex-direction:column;
  transform:translateX(102%);
  transition:transform .62s var(--ease-out);
  box-shadow:-30px 0 80px -30px rgba(16,31,24,.6);
  overflow-y:auto;
}
.drawer.is-open{visibility:visible;pointer-events:auto}
.drawer.is-open .drawer__scrim{opacity:1}
.drawer.is-open .drawer__panel{transform:translateX(0)}
.drawer__head{display:flex;align-items:center;justify-content:space-between;min-height:56px;margin-bottom:1.6rem}
.drawer__close{
  width:44px;height:44px;border-radius:50%;display:grid;place-items:center;
  border:1.4px solid rgba(244,239,228,.24);color:var(--bone);
  transition:background-color .3s,transform .4s var(--ease);
}
.drawer__close:hover{background:rgba(244,239,228,.1);transform:rotate(90deg)}
.drawer__nav{display:flex;flex-direction:column;border-top:1px solid rgba(244,239,228,.14)}
.drawer__link{
  display:flex;align-items:baseline;gap:.9rem;
  padding:1.05rem 0;text-decoration:none;
  border-bottom:1px solid rgba(244,239,228,.14);
  font-family:var(--ff-display);font-weight:600;font-size:1.6rem;letter-spacing:-.03em;
  color:var(--bone);
  opacity:0;transform:translateX(22px);
}
.drawer.is-open .drawer__link{
  animation:drawerIn .6s var(--ease-out) forwards;
  animation-delay:calc(.1s + var(--i,0)*.06s);
}
@keyframes drawerIn{to{opacity:1;transform:none}}
.drawer__link i{font-style:normal;font-family:var(--ff-serif);font-size:.8rem;color:var(--fern-soft);letter-spacing:.05em}
.drawer__link[aria-current="page"]{color:var(--fern-soft)}
.drawer__foot{margin-top:auto;padding-top:2rem;display:grid;gap:.85rem}
.drawer__foot .btn{width:100%}
.drawer__meta{font-size:.83rem;color:rgba(244,239,228,.66);line-height:1.6}
.drawer__meta a{color:var(--bone);text-decoration:none;border-bottom:1px solid rgba(244,239,228,.3)}

/* ============ 7. HERO ============ */
.hero{position:relative;padding-block:clamp(1.8rem,3.2vw,2.9rem) clamp(2.6rem,5vw,4.2rem);overflow:hidden}
.hero__glow{
  position:absolute;top:-18%;right:-12%;width:min(760px,86vw);aspect-ratio:1;
  background:radial-gradient(circle closest-side,rgba(127,190,149,.34),rgba(127,190,149,0) 74%);
  pointer-events:none;z-index:0;
}
.hero__in{position:relative;z-index:1;display:grid;gap:clamp(2.6rem,5vw,3.5rem);align-items:center;
  grid-template-columns:minmax(0,1.02fr) minmax(0,1fr)}
.hero__eyebrow{margin-bottom:1.15rem}
.hero__title{margin-bottom:1.25rem}
.hero__lead{margin-bottom:1.7rem;max-width:44ch;font-size:clamp(1rem,.95rem + .3vw,1.16rem)}
.hero__actions{display:flex;flex-wrap:wrap;align-items:center;gap:.85rem 1.5rem;margin-bottom:2rem}
.hero__chips-label{
  font-size:.7rem;letter-spacing:.19em;text-transform:uppercase;color:var(--stone);
  margin-bottom:.7rem;
}

/* visual: green block + photo breaking out of it */
.hero__visual{position:relative;padding-top:clamp(26px,3.4vw,48px);padding-bottom:clamp(26px,3.2vw,44px)}
.hero__block{
  position:relative;border-radius:var(--r-xl);
  background:linear-gradient(158deg,var(--moss),var(--forest) 58%,#163024);
  aspect-ratio:1/.92;
  box-shadow:var(--sh-3);
  overflow:hidden;
}
.hero__block::before{
  content:"";position:absolute;inset:0;
  background:
    repeating-linear-gradient(90deg,rgba(244,239,228,.05) 0 1px,transparent 1px 74px),
    radial-gradient(120% 90% at 20% 8%,rgba(127,190,149,.22),transparent 60%);
}
.hero__block::after{
  content:"";position:absolute;left:-16%;bottom:-30%;width:78%;aspect-ratio:1;border-radius:50%;
  border:1px solid rgba(244,239,228,.14);
}
.hero__photo{
  position:absolute;left:9%;right:-2.5%;top:0;
  border-radius:calc(var(--r-lg) + 4px);
  overflow:hidden;
  box-shadow:0 30px 70px -28px rgba(16,31,24,.55), 0 0 0 7px var(--bone);
  aspect-ratio:4/3.1;
}
.hero__photo img{width:100%;height:100%;object-fit:cover}
.hero__badge{
  position:absolute;left:0;bottom:0;z-index:3;
  background:var(--bone);border-radius:var(--r-md);
  padding:1rem 1.15rem;box-shadow:var(--sh-2);
  display:flex;align-items:center;gap:.85rem;max-width:min(280px,72%);
}
.hero__badge-num{
  font-family:var(--ff-display);font-weight:800;font-size:1.85rem;
  color:var(--forest);letter-spacing:-.04em;line-height:1;
}
.hero__badge-txt{font-size:.775rem;line-height:1.4;color:var(--stone)}
.hero__badge-txt b{display:block;color:var(--ink);font-weight:600;font-size:.83rem}
.hero__leaf{
  position:absolute;right:-4%;bottom:6%;width:34%;max-width:170px;z-index:2;
  color:var(--fern);opacity:.9;
}

/* page-load stagger */
[data-r]{opacity:0;animation:riseIn .95s var(--ease-out) forwards;animation-delay:calc(var(--d,0)*1ms)}
@keyframes riseIn{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}

/* ============ 8. TICKER ============ */
.ticker{
  background:var(--forest);color:var(--bone);overflow:hidden;
  padding-block:.95rem;
  border-block:1px solid rgba(244,239,228,.1);
}
.ticker__track{display:flex;width:max-content;animation:slide 42s linear infinite}
.ticker:hover .ticker__track{animation-play-state:paused}
@keyframes slide{to{transform:translateX(-50%)}}
.ticker__row{display:flex;align-items:center;gap:2.6rem;padding-right:2.6rem}
.ticker__item{
  display:flex;align-items:center;gap:.7rem;white-space:nowrap;
  font-size:.815rem;letter-spacing:.13em;text-transform:uppercase;font-weight:500;
  color:rgba(244,239,228,.82);
}
.ticker__item::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--fern-soft);flex:none}

/* ============ 9. SPLIT / EDITORIAL ============ */
.split{display:grid;gap:clamp(2.2rem,5vw,4.5rem);align-items:center}
.split>*{min-width:0}
.split--41{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr)}
.split--14{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr)}
.frame{position:relative;border-radius:var(--r-lg);overflow:hidden;background:var(--bone-2);box-shadow:var(--sh-2)}
.frame img{width:100%;height:100%;object-fit:cover}
.frame--tall{aspect-ratio:3/4}
.frame--wide{aspect-ratio:16/11}
.frame--sq{aspect-ratio:1}
.frame--arch{border-radius:220px 220px var(--r-lg) var(--r-lg)}
.frame__tag{
  position:absolute;left:1rem;bottom:1rem;
  background:rgba(244,239,228,.92);backdrop-filter:blur(8px);
  padding:.5rem .9rem;border-radius:var(--r-pill);
  font-size:.74rem;font-weight:600;letter-spacing:.05em;color:var(--forest);
}

.figset{position:relative}
.figset__b{
  position:absolute;right:-6%;bottom:-9%;width:46%;z-index:2;
  border-radius:var(--r-md);overflow:hidden;box-shadow:0 0 0 8px var(--bone),var(--sh-3);
  aspect-ratio:1;
}
.figset__b img{width:100%;height:100%;object-fit:cover}

.statgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.4rem 1.2rem;margin-top:2.4rem}
.stat{border-top:1.5px solid var(--line);padding-top:.9rem}
.stat__n{
  font-family:var(--ff-display);font-weight:700;font-size:clamp(1.7rem,1.2rem + 1.5vw,2.3rem);
  letter-spacing:-.035em;color:var(--forest);line-height:1;
}
.stat__l{font-size:.815rem;color:var(--stone);margin-top:.42rem;line-height:1.45}

/* pull quote */
.quote{
  position:relative;color:var(--bone);overflow:hidden;
  background:var(--forest);
}
.quote__bg{position:absolute;inset:0;opacity:.2;filter:saturate(.7)}
.quote__bg img{width:100%;height:100%;object-fit:cover}
.quote::before{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(28,58,44,.55),rgba(16,31,24,.9));
}
.quote__in{position:relative;z-index:2;padding-block:clamp(4.2rem,9vw,8rem);max-width:1080px}
.quote__mark{
  font-family:var(--ff-serif);font-size:clamp(5rem,12vw,9rem);line-height:.5;
  color:var(--fern-soft);opacity:.5;display:block;height:.42em;
}
.quote__text{
  font-family:var(--ff-serif);font-weight:400;
  font-size:clamp(1.7rem,1rem + 3.1vw,3.35rem);
  line-height:1.14;letter-spacing:-.02em;color:var(--bone);
  margin-top:1.6rem;text-wrap:balance;
}
.quote__text em{color:var(--fern-soft)}
.quote__by{
  margin-top:2.2rem;display:flex;align-items:center;gap:1rem;flex-wrap:wrap;
  font-size:.86rem;color:rgba(244,239,228,.74);
}
.quote__by b{color:var(--bone);font-weight:600}
.quote__by span{width:34px;height:1.5px;background:var(--fern-soft);flex:none}

/* ============ 10. TIMELINE ============ */
.tl{position:relative;margin-top:clamp(2.5rem,5vw,4rem)}
.tl__rail{
  position:absolute;left:0;right:0;top:34px;height:1.5px;
  background:linear-gradient(90deg,var(--line),var(--fern) 22%,var(--fern) 78%,var(--line));
  transform:scaleX(0);transform-origin:left;
  transition:transform 1.5s var(--ease-out) .1s;
}
.tl.in .tl__rail{transform:scaleX(1)}
.tl__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(1.2rem,2.4vw,2.2rem);position:relative}
.tl__step{position:relative;padding-right:.5rem}
.tl__dot{
  width:68px;height:68px;border-radius:50%;flex:none;
  display:grid;place-items:center;background:var(--bone);
  border:1.5px solid var(--line);
  font-family:var(--ff-display);font-weight:700;font-size:1.05rem;color:var(--forest);
  letter-spacing:-.02em;position:relative;z-index:2;
  transition:background-color .5s var(--ease),color .5s var(--ease),border-color .5s var(--ease),transform .5s var(--ease);
}
.tl__step:hover .tl__dot{background:var(--fern);color:#0C2016;border-color:var(--fern);transform:scale(1.06)}
.tl__t{margin-top:1.35rem;font-family:var(--ff-display);font-weight:700;font-size:1.09rem;letter-spacing:-.022em;color:var(--ink)}
.tl__d{margin-top:.55rem;font-size:.895rem;color:var(--stone);line-height:1.55}
.tl__meta{margin-top:.8rem;font-size:.735rem;letter-spacing:.13em;text-transform:uppercase;color:var(--fern);font-weight:600}

/* ============ 11. BENTO ============ */
.bento{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(.85rem,1.5vw,1.35rem)}
.bento>*{min-width:0}
.tile{
  position:relative;border-radius:var(--r-lg);overflow:hidden;
  padding:clamp(1.5rem,2.4vw,2.2rem);display:flex;flex-direction:column;
  transition:transform .6s var(--ease),box-shadow .6s var(--ease);
}
.tile:hover{transform:translateY(-4px)}
.tile--img{padding:0;min-height:300px}
.tile--img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease-out)}
.tile--img:hover img{transform:scale(1.045)}
.tile--img .tile__body{
  position:relative;z-index:2;margin-top:auto;padding:clamp(1.4rem,2.4vw,2rem);
  color:var(--bone);
}
.tile--img::after{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(16,31,24,0) 34%,rgba(16,31,24,.82));
}
.tile--cream{background:var(--cream);box-shadow:inset 0 0 0 1px var(--line-soft)}
.tile--cream:hover{box-shadow:inset 0 0 0 1px var(--line-soft),var(--sh-2)}
.tile--forest{background:var(--forest);color:rgba(244,239,228,.84)}
.tile--forest .h-sm,.tile--forest .h-md{color:var(--bone)}
.tile--clay{background:var(--clay);color:#FCEFE6}
.tile--clay .h-sm{color:#fff}
.tile--sage{background:var(--sage-2);box-shadow:inset 0 0 0 1px rgba(28,58,44,.07)}
.tile__k{
  font-size:.7rem;letter-spacing:.19em;text-transform:uppercase;font-weight:600;
  opacity:.72;margin-bottom:auto;padding-bottom:2.2rem;
}
.tile__list{margin-top:1.3rem;display:grid;gap:.62rem}
.tile__list li{display:flex;gap:.7rem;font-size:.9rem;line-height:1.45;align-items:flex-start}
.tile__list li::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--fern-soft);margin-top:.52em;flex:none}
.tile__big{
  font-family:var(--ff-display);font-weight:800;letter-spacing:-.045em;line-height:.88;
  font-size:clamp(2.8rem,2rem + 3.4vw,4.4rem);color:var(--forest);
}

/* ============ 12. MEMBERSHIP ============ */
.plan{
  position:relative;border-radius:var(--r-xl);overflow:hidden;
  background:linear-gradient(150deg,#1F4132,var(--forest) 55%,#14291F);
  color:rgba(244,239,228,.82);box-shadow:var(--sh-3);
}
.plan::before{
  content:"";position:absolute;right:-8%;top:-24%;width:min(480px,62%);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(127,190,149,.26),transparent 66%);
}
.plan__in{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.86fr);
  gap:clamp(2rem,4vw,3.6rem);padding:clamp(1.9rem,4vw,3.6rem)}
.plan__price{display:flex;align-items:flex-end;gap:.6rem;margin:1.4rem 0 .3rem}
.plan__price b{
  font-family:var(--ff-display);font-weight:800;font-size:clamp(3rem,2rem + 4.2vw,4.6rem);
  letter-spacing:-.05em;color:var(--bone);line-height:.85;
}
.plan__price span{font-size:.95rem;color:rgba(244,239,228,.66);padding-bottom:.4rem}
.plan__card{
  background:rgba(244,239,228,.06);border:1px solid rgba(244,239,228,.14);
  border-radius:var(--r-md);padding:clamp(1.3rem,2.2vw,1.8rem);
  backdrop-filter:blur(6px);
}
.plan__ul{display:grid;gap:.85rem;margin-top:1.15rem}
.plan__ul li{display:grid;grid-template-columns:20px 1fr;gap:.75rem;font-size:.9rem;line-height:1.5;align-items:start}
.plan__ul svg{width:20px;height:20px;color:var(--fern-soft);margin-top:.1em}
.plan__note{margin-top:1.3rem;font-size:.78rem;color:rgba(244,239,228,.55);line-height:1.55}

/* ============ 13. SLIDER ============ */
.slider{position:relative;min-width:0}
.slider__viewport{overflow:hidden;border-radius:var(--r-lg);min-width:0}
.slider__track{display:flex;transition:transform .78s var(--ease-out)}
.slide{flex:0 0 100%;min-width:0;padding:clamp(1.8rem,4vw,3.4rem);background:var(--cream);
  box-shadow:inset 0 0 0 1px var(--line-soft)}
.slide__q{
  font-family:var(--ff-serif);font-size:clamp(1.25rem,.95rem + 1.4vw,1.95rem);
  line-height:1.32;letter-spacing:-.012em;color:var(--ink);text-wrap:pretty;
}
.slide__stars{display:flex;gap:.22rem;color:var(--clay);margin-bottom:1.4rem}
.slide__stars svg{width:16px;height:16px}
.slide__who{margin-top:1.9rem;display:flex;align-items:center;gap:.9rem;flex-wrap:wrap}
.slide__av{
  width:44px;height:44px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:var(--sage-2);color:var(--forest);font-family:var(--ff-display);font-weight:700;font-size:.9rem;
  letter-spacing:-.01em;
}
.slide__nm{font-weight:600;color:var(--ink);font-size:.93rem}
.slide__mt{font-size:.8rem;color:var(--stone)}
.slider__bar{display:flex;align-items:center;gap:1.1rem;margin-top:1.6rem;flex-wrap:wrap}
.slider__btn{
  width:50px;height:50px;border-radius:50%;display:grid;place-items:center;flex:none;
  border:1.4px solid var(--line);color:var(--forest);
  transition:background-color .4s var(--ease),border-color .4s var(--ease),transform .4s var(--ease),color .4s;
}
.slider__btn:hover{background:var(--forest);border-color:var(--forest);color:var(--bone);transform:translateY(-2px)}
.slider__btn svg{width:17px;height:17px}
.slider__dots{display:flex;gap:.15rem;margin-left:auto;align-items:center}
.slider__dot{
  position:relative;width:26px;height:44px;flex:none;padding:0;background:none;
  display:grid;place-items:center;
}
.slider__dot::before{
  content:"";width:9px;height:9px;border-radius:var(--r-pill);background:rgba(28,58,44,.22);
  transition:background-color .4s var(--ease),width .4s var(--ease);
}
.slider__dot[aria-selected="true"]::before{background:var(--fern);width:26px}

/* ============ 14. TABS + ROWS (services) ============ */
.tabs{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:clamp(2rem,3.5vw,2.8rem)}
.tab{
  min-height:46px;padding:.62rem 1.15rem;border-radius:var(--r-pill);
  border:1.4px solid var(--line);background:transparent;
  font-size:.885rem;font-weight:500;color:var(--body);
  transition:all .42s var(--ease);
}
.tab:hover{border-color:var(--fern);color:var(--forest)}
.tab[aria-selected="true"]{background:var(--forest);border-color:var(--forest);color:var(--bone);font-weight:600}

.rows{border-top:1.5px solid var(--line)}
.row{border-bottom:1.5px solid var(--line);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.row.is-hidden{display:none}
.row.is-anim{opacity:0;transform:translateY(14px)}
.row__head{
  width:100%;display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;
  gap:1rem 1.3rem;padding:clamp(1.15rem,2vw,1.55rem) 0;text-align:left;
  transition:padding-left .5s var(--ease);
}
.row__head:hover{padding-left:.5rem}
.row__idx{font-family:var(--ff-serif);font-style:italic;font-size:.88rem;color:var(--fern);width:2ch}
.row__t{font-family:var(--ff-display);font-weight:700;font-size:clamp(1.06rem,.98rem + .5vw,1.32rem);
  letter-spacing:-.024em;color:var(--ink);line-height:1.2}
.row__p{font-size:.92rem;font-weight:600;color:var(--moss);white-space:nowrap}
.row__ico{
  width:38px;height:38px;border-radius:50%;border:1.4px solid var(--line);
  display:grid;place-items:center;flex:none;color:var(--forest);
  transition:background-color .45s var(--ease),transform .45s var(--ease),border-color .45s,color .45s;
}
.row__head:hover .row__ico{border-color:var(--forest)}
.row__head[aria-expanded="true"] .row__ico{background:var(--forest);border-color:var(--forest);color:var(--bone);transform:rotate(45deg)}
.row__panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows .58s var(--ease-out)}
.row__head[aria-expanded="true"]+.row__panel{grid-template-rows:1fr}
.row__panel>div{overflow:hidden;min-height:0}
.row__inner{
  padding:0 0 1.9rem;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);
  gap:1.5rem 2.4rem;padding-left:calc(2ch + 1.3rem);
}
.row__inner p{color:var(--stone);font-size:.955rem;max-width:56ch}
.row__facts{display:grid;gap:.7rem;align-content:start;
  background:var(--cream);border-radius:var(--r-md);padding:1.15rem 1.25rem;
  box-shadow:inset 0 0 0 1px var(--line-soft)}
.row__fact{display:flex;justify-content:space-between;gap:1rem;font-size:.85rem}
.row__fact dt{color:var(--stone)}
.row__fact dd{margin:0;color:var(--ink);font-weight:600;text-align:right}

/* ============ 15. FAQ ============ */
.faq{display:grid;gap:.7rem}
.faq__item{background:var(--cream);border-radius:var(--r-md);box-shadow:inset 0 0 0 1px var(--line-soft);
  transition:box-shadow .45s var(--ease)}
.faq__item:has([aria-expanded="true"]){box-shadow:inset 0 0 0 1.5px rgba(79,155,107,.5),var(--sh-1)}
.faq__q{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:1.2rem;
  padding:1.2rem 1.35rem;text-align:left;font-weight:600;color:var(--ink);font-size:1rem;line-height:1.35;
  min-height:60px;
}
.faq__sign{position:relative;width:15px;height:15px;flex:none}
.faq__sign::before,.faq__sign::after{
  content:"";position:absolute;background:var(--fern);border-radius:2px;
  transition:transform .5s var(--ease-out);
}
.faq__sign::before{left:0;top:6.7px;width:15px;height:1.8px}
.faq__sign::after{top:0;left:6.7px;height:15px;width:1.8px}
.faq__q[aria-expanded="true"] .faq__sign::after{transform:scaleY(0)}
.faq__a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .55s var(--ease-out)}
.faq__q[aria-expanded="true"]+.faq__a{grid-template-rows:1fr}
.faq__a>div{overflow:hidden;min-height:0}
.faq__a p{padding:0 1.35rem 1.35rem;color:var(--stone);font-size:.945rem;max-width:62ch}

/* ============ 16. BOOKER (multi-step form) ============ */
.booker{
  background:var(--cream);border-radius:var(--r-xl);
  box-shadow:inset 0 0 0 1px var(--line-soft),var(--sh-2);
  padding:clamp(1.4rem,3vw,2.6rem);position:relative;overflow:hidden;
}
.booker__head{display:flex;align-items:flex-start;justify-content:space-between;gap:1.2rem;flex-wrap:wrap;margin-bottom:1.5rem}
.booker__count{font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;color:var(--stone);font-weight:600;white-space:nowrap}
.booker__bar{display:flex;gap:.4rem;margin-bottom:1.9rem}
.booker__seg{flex:1;height:4px;border-radius:2px;background:rgba(28,58,44,.13);overflow:hidden}
.booker__seg i{display:block;height:100%;width:0;background:var(--fern);border-radius:2px;
  transition:width .65s var(--ease-out)}
.booker__seg.done i,.booker__seg.now i{width:100%}
.booker__steps{position:relative;overflow-anchor:none}
.booker__step{display:none}
.booker__step.is-active{display:block;animation:stepIn .55s var(--ease-out)}
@keyframes stepIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.booker__legend:focus{outline:none}
.booker__legend{font-family:var(--ff-display);font-weight:700;font-size:clamp(1.22rem,1.05rem + .7vw,1.55rem);
  letter-spacing:-.026em;color:var(--ink);margin-bottom:.4rem;display:block}
.booker__hint{font-size:.885rem;color:var(--stone);margin-bottom:1.5rem}

.opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:.6rem}
.opt{position:relative}
.opt input{position:absolute;opacity:0;width:0;height:0}
.opt span{
  display:flex;align-items:center;gap:.65rem;min-height:56px;
  padding:.85rem 1.1rem;border-radius:var(--r-md);
  border:1.5px solid var(--line);background:rgba(255,255,255,.5);
  font-size:.9rem;font-weight:500;color:var(--body);cursor:pointer;
  transition:border-color .4s var(--ease),background-color .4s var(--ease),transform .35s var(--ease),color .35s;
  line-height:1.3;
}
.opt span::before{
  content:"";width:15px;height:15px;border-radius:50%;flex:none;
  border:1.5px solid var(--line);transition:all .35s var(--ease);
}
.opt:hover span{border-color:var(--fern-soft);transform:translateY(-2px)}
.opt input:checked+span{border-color:var(--fern);background:#fff;color:var(--forest);font-weight:600}
.opt input:checked+span::before{border-color:var(--fern);background:var(--fern);box-shadow:inset 0 0 0 3px #fff}
.opt input:focus-visible+span{outline:2.5px solid var(--fern);outline-offset:3px}

.fields{display:grid;gap:1.05rem}
.fields--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.field{display:grid;gap:.42rem;min-width:0}
.field label{font-size:.815rem;font-weight:600;color:var(--body);letter-spacing:.01em}
.field input,.field select,.field textarea{
  width:100%;min-height:52px;padding:.85rem 1rem;border-radius:var(--r-sm);
  border:1.5px solid var(--line);background:rgba(255,255,255,.62);
  font-size:.95rem;color:var(--ink);
  transition:border-color .35s var(--ease),background-color .35s var(--ease),box-shadow .35s var(--ease);
}
.field textarea{min-height:104px;resize:vertical;line-height:1.55}
.field select{appearance:none;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232C5442' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 1rem center;background-size:16px;padding-right:2.6rem}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-color:var(--fern);background:#fff;box-shadow:0 0 0 4px rgba(79,155,107,.16)}
.field.err input,.field.err select,.field.err textarea{border-color:#B4472F;background:rgba(180,71,47,.045)}
.field__msg{font-size:.775rem;color:#9C3B26;min-height:0;display:none;align-items:center;gap:.35rem}
.field.err .field__msg{display:flex}
.err-note{
  display:none;align-items:center;gap:.6rem;margin-bottom:1.1rem;
  background:rgba(180,71,47,.08);border:1px solid rgba(180,71,47,.24);
  border-radius:var(--r-sm);padding:.7rem .95rem;font-size:.845rem;color:#8E3520;
}
.err-note.show{display:flex;animation:shake .42s var(--ease)}
@keyframes shake{10%,90%{transform:translateX(-2px)}30%,70%{transform:translateX(3px)}50%{transform:translateX(-3px)}}

.booker__nav{display:flex;align-items:center;gap:.8rem;margin-top:1.9rem;flex-wrap:wrap}
.booker__nav .btn{flex:1 1 auto;min-width:140px}
.booker__back{flex:0 0 auto !important;min-width:0 !important}
.booker__note{width:100%;font-size:.775rem;color:var(--stone);line-height:1.5}

.booker__done{display:none;text-align:left;padding:.6rem 0}
.booker.is-done .booker__steps,.booker.is-done .booker__nav,.booker.is-done .booker__bar,.booker.is-done .booker__head{display:none}
.booker.is-done .booker__done{display:block;animation:stepIn .7s var(--ease-out)}
.done__ico{
  width:66px;height:66px;border-radius:50%;background:var(--fern);color:#0C2016;
  display:grid;place-items:center;margin-bottom:1.4rem;
  box-shadow:0 14px 34px -14px rgba(79,155,107,.9);
}
.done__ico svg{width:30px;height:30px}
.done__ico path{stroke-dasharray:34;stroke-dashoffset:34;animation:draw .6s var(--ease-out) .25s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.done__recap{
  margin:1.6rem 0;border-radius:var(--r-md);background:rgba(28,58,44,.045);
  padding:1.1rem 1.25rem;display:grid;gap:.6rem;
}
.done__recap div{display:flex;justify-content:space-between;gap:1rem;font-size:.875rem}
.done__recap dt{color:var(--stone)}
.done__recap dd{margin:0;font-weight:600;color:var(--ink);text-align:right}

/* ============ 17. MAP ============ */
.map{
  position:relative;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4/3.3;
  background:#E7E3D6;box-shadow:inset 0 0 0 1px var(--line-soft),var(--sh-1);
}
.map__svg{position:absolute;inset:0;width:100%;height:100%}
.map__pin{
  position:absolute;left:50%;top:47%;translate:-50% -100%;z-index:3;
  display:flex;flex-direction:column;align-items:center;gap:.4rem;
}
.map__bubble{
  background:var(--forest);color:var(--bone);border-radius:var(--r-pill);
  padding:.5rem .95rem;font-size:.78rem;font-weight:600;white-space:nowrap;
  box-shadow:var(--sh-2);
}
.map__dot{width:15px;height:15px;border-radius:50%;background:var(--fern);border:3px solid var(--bone);
  box-shadow:0 4px 10px rgba(16,31,24,.35);position:relative}
.map__dot::after{
  content:"";position:absolute;inset:-9px;border-radius:50%;border:2px solid var(--fern);
  animation:ping 2.6s var(--ease-out) infinite;
}
@keyframes ping{0%{transform:scale(.6);opacity:.85}70%,100%{transform:scale(1.9);opacity:0}}
.map__chip{
  position:absolute;left:1rem;bottom:1rem;z-index:3;
  background:rgba(251,248,240,.94);backdrop-filter:blur(8px);
  border-radius:var(--r-md);padding:.75rem .95rem;font-size:.79rem;line-height:1.45;color:var(--body);
  box-shadow:var(--sh-1);max-width:min(240px,68%);
}
.map__chip b{display:block;color:var(--ink);font-weight:600;margin-bottom:.15rem}

/* hours */
.hours{display:grid;gap:0}
.hours li{
  display:flex;justify-content:space-between;gap:1rem;padding:.72rem 0;
  border-bottom:1px solid var(--line-soft);font-size:.92rem;
}
.hours li:last-child{border-bottom:0}
.hours dt,.hours b{font-weight:500;color:var(--body)}
.hours span{color:var(--stone);text-align:right}
.hours li.is-today{color:var(--forest)}
.hours li.is-today b{font-weight:700}
.hours li.is-today span{color:var(--fern);font-weight:600}

/* ============ 18. TEAM ============ */
.docs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1rem,2vw,1.6rem)}
.doc{
  background:var(--cream);border-radius:var(--r-lg);padding:clamp(1.4rem,2.4vw,2rem);
  box-shadow:inset 0 0 0 1px var(--line-soft);
  display:flex;flex-direction:column;position:relative;overflow:hidden;
  transition:transform .6s var(--ease),box-shadow .6s var(--ease);
}
.doc:hover{transform:translateY(-5px);box-shadow:inset 0 0 0 1px var(--line-soft),var(--sh-2)}
.doc::before{
  content:"";position:absolute;right:-30%;top:-46%;width:76%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(127,190,149,.22),transparent 68%);
}
.doc__mono{
  width:60px;height:60px;border-radius:var(--r-md);display:grid;place-items:center;
  background:var(--forest);color:var(--fern-soft);
  font-family:var(--ff-display);font-weight:700;font-size:1.2rem;letter-spacing:-.03em;
  position:relative;
}
.doc__nm{margin-top:1.3rem}
.doc__cr{font-size:.775rem;letter-spacing:.14em;text-transform:uppercase;color:var(--fern);font-weight:600;margin-top:.5rem}
.doc__bio{margin-top:.95rem;font-size:.92rem;color:var(--stone);line-height:1.6}
.doc__tags{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:1.3rem;padding-top:1.2rem;border-top:1px solid var(--line-soft)}
.doc__tag{font-size:.735rem;padding:.32rem .68rem;border-radius:var(--r-pill);background:var(--sage-2);color:var(--moss);font-weight:500}

/* gallery */
.gal{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(.7rem,1.4vw,1.15rem)}
.gal figure{margin:0;border-radius:var(--r-md);overflow:hidden;position:relative;background:var(--bone-2)}
.gal img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease-out)}
.gal figure:hover img{transform:scale(1.05)}
.gal figcaption{
  position:absolute;left:.7rem;bottom:.7rem;z-index:2;
  background:rgba(251,248,240,.9);backdrop-filter:blur(8px);
  border-radius:var(--r-pill);padding:.38rem .8rem;font-size:.735rem;font-weight:600;color:var(--forest);
}

/* ============ 19. FOOTER ============ */
.foot{background:var(--ink);color:rgba(244,239,228,.68);position:relative;overflow:hidden}
.foot::before{
  content:"";position:absolute;left:-6%;bottom:-40%;width:min(620px,72%);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(79,155,107,.2),transparent 68%);
}
.foot__in{position:relative;padding-block:clamp(3.4rem,6vw,5.4rem) 2rem}
.foot__grid{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:clamp(2rem,4vw,3rem)}
.foot__brand .brand__name{color:var(--bone)}
.foot__brand .brand__sub{color:rgba(244,239,228,.5)}
.foot__brand .brand__mark{color:var(--fern-soft)}
.foot__blurb{margin-top:1.3rem;font-size:.9rem;line-height:1.65;max-width:34ch}
.foot__blurb a{display:inline-flex;align-items:center;min-height:44px}
.h-md a,.h-sm a{display:inline-flex;align-items:center;min-height:44px}
.foot__h{font-size:.715rem;letter-spacing:.19em;text-transform:uppercase;color:rgba(244,239,228,.45);
  font-weight:600;margin-bottom:1.05rem}
.foot__list{display:grid;gap:.1rem}
.foot__list a,.foot__list li{font-size:.9rem;line-height:1.5}
.foot__list li{display:flex;align-items:center;min-height:38px}
.foot__list a{display:inline-flex;align-items:center;min-height:44px}
.foot__list a{text-decoration:none;color:rgba(244,239,228,.76);transition:color .3s var(--ease),padding-left .4s var(--ease)}
.foot__list a:hover{color:var(--fern-soft);padding-left:5px}
.foot__cta{
  margin-top:clamp(3rem,5vw,4.4rem);padding-top:2.2rem;border-top:1px solid rgba(244,239,228,.12);
  display:flex;align-items:center;justify-content:space-between;gap:1.6rem;flex-wrap:wrap;
}
.foot__word{
  font-family:var(--ff-display);font-weight:800;letter-spacing:-.05em;line-height:.82;
  font-size:clamp(2.6rem,1.2rem + 6.4vw,7rem);color:rgba(244,239,228,.09);
  margin-top:2.4rem;user-select:none;
}
.foot__bar{
  margin-top:1.6rem;padding-top:1.5rem;border-top:1px solid rgba(244,239,228,.12);
  display:flex;justify-content:space-between;gap:1rem 1.6rem;flex-wrap:wrap;font-size:.79rem;
  color:rgba(244,239,228,.46);
}
.foot__bar a{color:rgba(244,239,228,.62);text-decoration:none;display:inline-flex;align-items:center;min-height:44px}
.foot__bar a:hover{color:var(--fern-soft)}

/* ============ 20. SF BADGE ============ */
.sf-badge{
  position:fixed;right:16px;bottom:16px;z-index:9999;display:inline-flex;align-items:center;
  gap:.5rem;padding:.6rem .95rem;border-radius:999px;font-size:.78rem;letter-spacing:.01em;
  text-decoration:none;line-height:1;backdrop-filter:blur(12px);
  transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s;
  background:rgba(28,58,44,.9);color:rgba(244,239,228,.9);
  box-shadow:0 2px 6px rgba(16,31,24,.18),0 12px 30px -12px rgba(16,31,24,.5);
  border:1px solid rgba(244,239,228,.14);
}
.sf-badge:hover{transform:translateY(-2px);box-shadow:0 2px 6px rgba(16,31,24,.2),0 18px 38px -14px rgba(16,31,24,.6)}
.sf-badge strong{font-weight:600;color:var(--bone)}
.sf-badge__dot{width:6px;height:6px;border-radius:50%;flex:none;background:var(--fern);
  box-shadow:0 0 0 0 rgba(79,155,107,.7);animation:sfPulse 2.4s var(--ease-out) infinite}
@keyframes sfPulse{
  0%{box-shadow:0 0 0 0 rgba(79,155,107,.65)}
  70%{box-shadow:0 0 0 8px rgba(79,155,107,0)}
  100%{box-shadow:0 0 0 0 rgba(79,155,107,0)}
}
@media(max-width:600px){.sf-badge{right:12px;bottom:12px;padding:.5rem .8rem;font-size:.72rem}}

/* mobile sticky book bar */
.bookbar{
  display:none;position:fixed;left:0;right:0;bottom:0;z-index:75;
  padding:.7rem 12px calc(.7rem + env(safe-area-inset-bottom));
  background:rgba(244,239,228,.9);backdrop-filter:blur(14px);
  border-top:1px solid var(--line-soft);
  align-items:center;gap:.7rem;
  transform:translateY(105%);transition:transform .55s var(--ease-out);
}
.bookbar.show{transform:translateY(0)}
.bookbar__tel{
  width:50px;height:50px;border-radius:50%;flex:none;display:grid;place-items:center;
  border:1.4px solid var(--line);color:var(--forest);text-decoration:none;background:rgba(255,255,255,.6);
}
.bookbar__tel svg{width:19px;height:19px}
.bookbar .btn{flex:1;min-height:50px}

/* ============ 21. REVEAL ============ */
.rv{opacity:0;transform:translateY(20px);
  transition:opacity .85s var(--ease-out),transform .85s var(--ease-out);
  transition-delay:calc(var(--d,0)*1ms)}
.rv.in{opacity:1;transform:none}

/* ============ 22. PAGE HEADERS ============ */
.phead{position:relative;padding-block:clamp(2.2rem,4vw,3.4rem) clamp(1.5rem,2.6vw,2.2rem);overflow:hidden}
.phead__glow{
  position:absolute;top:-40%;left:-10%;width:min(680px,80vw);aspect-ratio:1;pointer-events:none;
  background:radial-gradient(circle closest-side,rgba(127,190,149,.30),transparent 72%);
}
.phead__in{position:relative;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);
  gap:clamp(1.8rem,4vw,3.5rem);align-items:end}
.crumb{display:flex;align-items:center;gap:.5rem;font-size:.78rem;color:var(--stone);margin-bottom:1.4rem;min-height:44px}
.crumb a{display:inline-flex;align-items:center;min-height:44px}
.crumb a{text-decoration:none;color:var(--moss)}
.crumb a:hover{color:var(--fern)}
.crumb svg{width:12px;height:12px;opacity:.5}

/* ============ 23. RESPONSIVE ============ */
@media(max-width:1080px){
  .nav__links,.nav__tel{display:none}
  .burger{display:flex}
  .nav__cta{display:none}
  .hero__in{grid-template-columns:minmax(0,1fr);gap:2.6rem}
  .hero__visual{max-width:620px;margin-inline:auto;width:100%}
  .plan__in{grid-template-columns:minmax(0,1fr)}
  .foot__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:2.2rem}
  .docs{grid-template-columns:minmax(0,1fr);gap:1rem}
  .split--41,.split--14{grid-template-columns:minmax(0,1fr)}
  .phead__in{grid-template-columns:minmax(0,1fr);align-items:start;gap:1.6rem}
  .figset__b{position:relative;right:auto;bottom:auto;width:100%;margin-top:.9rem;
    box-shadow:0 0 0 1px var(--line-soft);aspect-ratio:16/9}
}
@media(max-width:840px){
  .tl__grid{grid-template-columns:minmax(0,1fr);gap:0}
  .tl__rail{left:33px;right:auto;top:0;bottom:0;width:1.5px;height:auto;
    background:linear-gradient(180deg,var(--fern),var(--fern) 78%,var(--line));
    transform:scaleY(0);transform-origin:top;transition:transform 1.5s var(--ease-out) .1s}
  .tl.in .tl__rail{transform:scaleY(1)}
  .tl__step{display:grid;grid-template-columns:68px minmax(0,1fr);gap:0 1.25rem;padding-bottom:2.1rem}
  .tl__step>*{grid-column:2}
  .tl__dot{grid-column:1;grid-row:1/span 4;width:66px;height:66px}
  .tl__t{margin-top:.15rem}
  .bento{grid-template-columns:repeat(6,minmax(0,1fr))}
  .row__inner{grid-template-columns:1fr;padding-left:0}
  .gal{grid-template-columns:repeat(6,minmax(0,1fr))}
}
@media(max-width:640px){
  .fields--2{grid-template-columns:minmax(0,1fr)}
  .statgrid{gap:1.1rem}
  .bookbar{display:flex}
  body.bar-up .sf-badge{bottom:calc(88px + env(safe-area-inset-bottom))}
  body{padding-bottom:0}
  .has-bookbar{padding-bottom:76px}
  .foot__grid{grid-template-columns:minmax(0,1fr);gap:1.9rem}
  .bento{grid-template-columns:minmax(0,1fr)}
  .bento>*{grid-column:1/-1 !important}
  .gal{grid-template-columns:minmax(0,1fr)}
  .gal figure{grid-column:1/-1 !important;aspect-ratio:4/3 !important}
  .quote__by span{display:none}
  .row__head{grid-template-columns:auto 1fr auto;gap:.7rem .9rem}
  .row__p{grid-column:2/3;grid-row:2;font-size:.85rem}
  .row__ico{grid-row:1/span 2}
  .slider__bar{gap:.7rem}
  .booker__nav .btn{min-width:0}
  .booker__nav{padding-bottom:2.6rem} /* keeps Continue clear of the fixed badge */
}
@media(max-width:400px){
  .opts{grid-template-columns:1fr}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;animation-iteration-count:1 !important;
    transition-duration:.01ms !important;scroll-behavior:auto !important;
  }
  [data-r],.rv{opacity:1 !important;transform:none !important}
  .tl__rail{transform:none !important}
}