/* ==========================================================================
   Hypnotherapy for Shopping Addiction — Vibha Jain, Hypnotherapy Pvt Ltd
   Core design system
   ========================================================================== */

/* ---------- 1. Tokens ---------- */
:root{
  --ink:#101F2C;
  --ink-2:#172C3C;
  --ink-3:#24394A;
  --teal:#2A6A64;
  --teal-deep:#1E514C;
  --teal-light:#4E8F87;
  --sage:#8AA79A;
  --ivory:#F9F5EF;
  --ivory-2:#F3EDE3;
  --sand:#E8DCCB;
  --line:#DCD1C1;
  --line-dark:rgba(249,245,239,.16);
  --text:#22303A;
  --text-2:#4F5E68;
  --text-3:#5E6B73;
  --clay:#A6552F;
  --clay-2:#C4784E;
  --white:#fff;

  --font-display:"Fraunces","Iowan Old Style","Palatino Linotype",Georgia,serif;
  --font-body:"Inter","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;

  --wrap:1240px;
  --wrap-narrow:880px;
  --gutter:clamp(1.15rem,4vw,2.75rem);
  --sec-y:clamp(3.75rem,7.5vw,7rem);
  --radius:4px;
  --radius-lg:14px;
  --radius-xl:26px;

  --shadow-sm:0 1px 2px rgba(16,31,44,.05),0 3px 10px rgba(16,31,44,.05);
  --shadow-md:0 4px 12px rgba(16,31,44,.06),0 16px 40px rgba(16,31,44,.09);
  --shadow-lg:0 10px 30px rgba(16,31,44,.09),0 34px 70px rgba(16,31,44,.13);

  --ease:cubic-bezier(.22,.61,.36,1);
  --header-h:76px;
}

/* ---------- 2. Reset & base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:hidden;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 18px)}
body{
  margin:0;
  background:var(--ivory);
  color:var(--text);
  font-family:var(--font-body);
  font-size:clamp(1rem,.965rem + .16vw,1.075rem);
  line-height:1.75;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,svg,video{max-width:100%;display:block}
img{height:auto}
a{color:var(--teal-deep);text-decoration:none}
a:hover{color:var(--clay)}
button{font:inherit;color:inherit}
ul,ol{margin:0 0 1.15em;padding-left:1.25em}
li{margin-bottom:.5em}
p{margin:0 0 1.15em}
p:last-child,ul:last-child,ol:last-child{margin-bottom:0}
hr{border:0;border-top:1px solid var(--line);margin:2.5rem 0}
strong{font-weight:650;color:var(--ink-2)}
::selection{background:var(--sand);color:var(--ink)}

h1,h2,h3,h4,h5{
  font-family:var(--font-display);
  font-weight:500;
  color:var(--ink);
  line-height:1.14;
  letter-spacing:-.015em;
  margin:0 0 .6em;
  font-variation-settings:"SOFT" 0,"WONK" 0;
}
h1{font-size:clamp(2.35rem,1.55rem + 3.55vw,4.15rem);line-height:1.06}
h2{font-size:clamp(1.85rem,1.32rem + 2.35vw,3rem);line-height:1.11}
h3{font-size:clamp(1.32rem,1.13rem + .82vw,1.78rem);line-height:1.22}
h4{font-size:clamp(1.09rem,1.02rem + .32vw,1.26rem);line-height:1.32;letter-spacing:-.005em}
h5{font-size:1.02rem;line-height:1.4}

/* ---------- 3. Layout ---------- */
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
.wrap-narrow{width:100%;max-width:var(--wrap-narrow);margin-inline:auto;padding-inline:var(--gutter)}
.wrap-wide{width:100%;max-width:1440px;margin-inline:auto;padding-inline:var(--gutter)}
.section{padding-block:var(--sec-y);position:relative}
.section--tight{padding-block:clamp(2.75rem,5vw,4.5rem)}
.section--ink{background:var(--ink);color:rgba(249,245,239,.84)}
.section--ink h1,.section--ink h2,.section--ink h3,.section--ink h4,.section--ink h5{color:var(--ivory)}
.section--ink strong{color:var(--ivory)}
.section--ink a{color:var(--sage)}
.section--ink a:hover{color:var(--clay-2)}
.section--sand{background:var(--ivory-2)}
.section--teal{background:var(--teal-deep);color:rgba(249,245,239,.88)}
.section--teal h2,.section--teal h3,.section--teal h4{color:var(--ivory)}
.skip-link{
  position:absolute;left:-9999px;top:0;z-index:999;
  background:var(--ink);color:var(--ivory);padding:.85rem 1.4rem;border-radius:0 0 var(--radius-lg) 0;
  font-size:.92rem;font-weight:600;
}
.skip-link:focus{left:0;color:var(--ivory)}

/* ---------- 4. Type utilities ---------- */
.eyebrow{
  display:inline-flex;align-items:center;gap:.6rem;
  font-family:var(--font-body);
  font-size:.735rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  color:var(--clay);margin:0 0 1.15rem;
}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--clay);opacity:.65;flex:none}
.eyebrow--light{color:var(--sage)}
.eyebrow--light::before{background:var(--sage)}
.lede{font-size:clamp(1.09rem,1.02rem + .38vw,1.28rem);line-height:1.66;color:var(--text-2)}
.section--ink .lede,.section--teal .lede{color:rgba(249,245,239,.8)}
.measure{max-width:64ch}
.measure-sm{max-width:52ch}
.center{text-align:center}
.center .eyebrow{justify-content:center}
.mt-0{margin-top:0}.mb-0{margin-bottom:0}
.text-clay{color:var(--clay)}
.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}

.section-head{max-width:70ch;margin-bottom:clamp(2.2rem,4vw,3.4rem)}
.section-head.center{margin-inline:auto}

/* ---------- 5. Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
  padding:.95rem 1.7rem;min-height:52px;
  font-family:var(--font-body);font-size:.945rem;font-weight:600;letter-spacing:.005em;
  border-radius:100px;border:1.5px solid transparent;cursor:pointer;
  transition:background .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease),transform .35s var(--ease),box-shadow .35s var(--ease);
  text-align:center;
}
.btn svg{flex:none;transition:transform .35s var(--ease)}
.btn:hover svg{transform:translateX(3px)}
.btn--primary{background:var(--teal-deep);color:var(--white);border-color:var(--teal-deep)}
.btn--primary:hover{background:var(--ink-2);border-color:var(--ink-2);color:var(--white);transform:translateY(-2px);box-shadow:var(--shadow-md)}
.btn--clay{background:var(--clay);color:var(--white);border-color:var(--clay)}
.btn--clay:hover{background:#8E4726;border-color:#8E4726;color:var(--white);transform:translateY(-2px);box-shadow:var(--shadow-md)}
.btn--ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn--ghost:hover{background:var(--ink);color:var(--ivory);border-color:var(--ink);transform:translateY(-2px)}
.btn--light{background:var(--ivory);color:var(--ink);border-color:var(--ivory)}
.btn--light:hover{background:var(--sand);border-color:var(--sand);color:var(--ink);transform:translateY(-2px)}
.btn--outline-light{background:transparent;color:var(--ivory);border-color:rgba(249,245,239,.4)}
.btn--outline-light:hover{background:rgba(249,245,239,.1);border-color:var(--ivory);color:var(--ivory);transform:translateY(-2px)}
.btn-row{display:flex;flex-wrap:wrap;gap:.85rem;margin-top:2rem}
.btn-row.center{justify-content:center}

.link-arrow{
  display:inline-flex;align-items:center;gap:.5rem;font-weight:600;font-size:.94rem;
  color:var(--teal-deep);border-bottom:1.5px solid rgba(42,106,100,.3);padding-bottom:2px;
  transition:color .3s var(--ease),border-color .3s var(--ease),gap .3s var(--ease);
}
.link-arrow:hover{color:var(--clay);border-color:var(--clay);gap:.75rem}
.section--ink .link-arrow{color:var(--sage);border-color:rgba(138,167,154,.4)}
.section--ink .link-arrow:hover{color:var(--clay-2);border-color:var(--clay-2)}

/* ---------- 6. Header / navigation ---------- */
.site-header{
  position:sticky;top:0;z-index:100;
  background:rgba(249,245,239,.9);
  backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid transparent;
  transition:border-color .4s var(--ease),background .4s var(--ease),box-shadow .4s var(--ease);
}
.site-header.is-stuck{border-bottom-color:var(--line);box-shadow:0 4px 24px rgba(16,31,44,.06)}
.nav-bar{display:flex;align-items:center;justify-content:space-between;gap:1.25rem;min-height:var(--header-h)}
.brand{display:flex;align-items:center;gap:.7rem;flex:none}
.brand__mark{
  width:38px;height:38px;border-radius:50%;flex:none;
  background:var(--ink);display:grid;place-items:center;
  transition:transform .5s var(--ease);
}
.brand:hover .brand__mark{transform:rotate(-12deg)}
.brand__mark svg{width:20px;height:20px}
.brand__text{display:flex;flex-direction:column;line-height:1.1}
.brand__name{font-family:var(--font-display);font-size:1.09rem;font-weight:600;color:var(--ink);letter-spacing:-.01em}
.brand__sub{font-size:.63rem;letter-spacing:.16em;text-transform:uppercase;color:var(--text-3);font-weight:600;margin-top:2px}

.nav-list-wrap{
  display:flex;align-items:center;justify-content:flex-end;gap:clamp(.5rem,1.5vw,1.5rem);
  flex:1 1 auto;min-width:0
}
.nav-list{display:flex;align-items:center;gap:.15rem;list-style:none;margin:0;padding:0;flex-wrap:nowrap;justify-content:flex-end}
.nav-list li{margin:0}
.nav-link{
  display:block;padding:.6rem .72rem;border-radius:8px;
  font-size:.875rem;font-weight:500;color:var(--text-2);white-space:nowrap;
  position:relative;transition:color .3s var(--ease),background .3s var(--ease);
}
.nav-link::after{
  content:"";position:absolute;left:.72rem;right:.72rem;bottom:.34rem;height:1.5px;
  background:var(--clay);transform:scaleX(0);transform-origin:left;
  transition:transform .38s var(--ease);
}
.nav-link:hover{color:var(--ink)}
.nav-link:hover::after,.nav-link[aria-current="page"]::after{transform:scaleX(1)}
.nav-link[aria-current="page"]{color:var(--ink);font-weight:600}

.has-drop{position:relative}
.drop-toggle{
  display:inline-flex;align-items:center;gap:.35rem;background:none;border:0;cursor:pointer;
  padding:.6rem .72rem;border-radius:8px;font-size:.875rem;font-weight:500;color:var(--text-2);
  transition:color .3s var(--ease);white-space:nowrap;
}
.drop-toggle:hover{color:var(--ink)}
.drop-toggle svg{width:11px;height:11px;transition:transform .35s var(--ease)}
.has-drop.is-open .drop-toggle,.drop-toggle.is-current{color:var(--ink);font-weight:600}
.drop-toggle.is-current{position:relative}
.drop-toggle.is-current::after{
  content:"";position:absolute;left:.72rem;right:1.75rem;bottom:.34rem;height:1.5px;background:var(--clay)
}
.has-drop.is-open .drop-toggle svg{transform:rotate(180deg)}
.drop-menu{
  position:absolute;top:calc(100% + 6px);left:-6px;min-width:290px;
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);
  box-shadow:var(--shadow-lg);padding:.5rem;list-style:none;margin:0;
  opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:opacity .3s var(--ease),transform .3s var(--ease),visibility .3s;
}
.has-drop.is-open .drop-menu{opacity:1;visibility:visible;transform:translateY(0)}
.drop-menu a{
  display:block;padding:.62rem .8rem;border-radius:8px;font-size:.885rem;font-weight:500;
  color:var(--text-2);line-height:1.35;transition:background .25s,color .25s;
}
.drop-menu a:hover,.drop-menu a[aria-current="page"]{background:var(--ivory-2);color:var(--ink)}
.drop-menu a span{display:block;font-size:.735rem;color:var(--text-3);font-weight:400;margin-top:1px}

.nav-cta{display:flex;align-items:center;gap:.6rem;flex:none}
.nav-cta .btn{padding:.68rem 1.25rem;min-height:44px;font-size:.87rem}
.nav-phone{
  display:inline-flex;align-items:center;gap:.45rem;font-size:.875rem;font-weight:600;color:var(--ink);
  padding:.5rem .3rem;transition:color .3s
}
.nav-phone:hover{color:var(--clay)}
.nav-phone svg{width:15px;height:15px;color:var(--teal)}

.nav-toggle{
  display:none;width:46px;height:46px;border:1px solid var(--line);background:transparent;
  border-radius:10px;cursor:pointer;place-items:center;flex:none;transition:background .3s,border-color .3s
}
.nav-toggle:hover{background:var(--ivory-2)}
.nav-toggle span{display:block;width:19px;height:1.5px;background:var(--ink);position:relative;transition:background .25s}
.nav-toggle span::before,.nav-toggle span::after{
  content:"";position:absolute;left:0;width:19px;height:1.5px;background:var(--ink);
  transition:transform .35s var(--ease),top .3s var(--ease)
}
.nav-toggle span::before{top:-6px}
.nav-toggle span::after{top:6px}
body.nav-open .nav-toggle span{background:transparent}
body.nav-open .nav-toggle span::before{top:0;transform:rotate(45deg)}
body.nav-open .nav-toggle span::after{top:0;transform:rotate(-45deg)}

/* ---------- 7. Hero patterns ---------- */
.hero{position:relative;overflow:hidden;background:var(--ivory)}
.hero-home{padding-block:clamp(2.5rem,5.5vw,4.75rem) clamp(3rem,6vw,5.5rem)}
.hero-home__grid{display:grid;grid-template-columns:1.06fr .94fr;gap:clamp(2rem,4.5vw,4.25rem);align-items:center}
.hero-home__title{margin-bottom:1.35rem}
.hero-home__title em{font-style:italic;color:var(--teal-deep);font-variation-settings:"SOFT" 40,"WONK" 1}
.hero-home__media{position:relative}
.hero-home__frame{
  position:relative;border-radius:var(--radius-xl) var(--radius-xl) var(--radius-xl) 90px;
  overflow:hidden;background:var(--sand);box-shadow:var(--shadow-lg);aspect-ratio:4/3;
}
.hero-home__frame img{width:100%;height:100%;object-fit:cover;object-position:64% 42%}
.hero-home__badge{
  position:absolute;left:-14px;bottom:26px;z-index:2;
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:1rem 1.25rem;box-shadow:var(--shadow-md);display:flex;gap:1.1rem;align-items:center;
}
.hero-home__badge div{line-height:1.15}
.hero-home__badge b{display:block;font-family:var(--font-display);font-size:1.42rem;color:var(--ink);font-weight:600}
.hero-home__badge span{font-size:.705rem;letter-spacing:.09em;text-transform:uppercase;color:var(--text-3);font-weight:600}
.hero-home__badge i{width:1px;height:34px;background:var(--line);display:block;flex:none}
.hero-trust{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;margin-top:2.1rem;padding-top:1.6rem;border-top:1px solid var(--line)}
.hero-trust span{display:inline-flex;align-items:center;gap:.5rem;font-size:.845rem;color:var(--text-2);font-weight:500}
.hero-trust svg{width:15px;height:15px;color:var(--teal);flex:none}

/* Page hero (inner pages) */
.page-hero{position:relative;background:var(--ink);color:rgba(249,245,239,.82);overflow:hidden;padding-block:clamp(3.2rem,6.5vw,5.5rem)}
.page-hero__glow{position:absolute;border-radius:50%;filter:blur(90px);pointer-events:none}
.page-hero__glow--a{width:440px;height:440px;background:rgba(42,106,100,.42);top:-160px;right:-80px}
.page-hero__glow--b{width:340px;height:340px;background:rgba(166,85,47,.24);bottom:-180px;left:-60px}
.page-hero__inner{position:relative;z-index:2}
.page-hero h1{color:var(--ivory);margin-bottom:1.1rem;max-width:19ch}
.page-hero .lede{color:rgba(249,245,239,.78);max-width:62ch}
.breadcrumb{list-style:none;display:flex;flex-wrap:wrap;gap:.4rem;padding:0;margin:0 0 1.5rem;font-size:.8rem}
.breadcrumb li{margin:0;color:rgba(249,245,239,.5)}
.breadcrumb li+li::before{content:"/";margin-right:.42rem;opacity:.5}
.breadcrumb a{color:rgba(249,245,239,.7)}
.breadcrumb a:hover{color:var(--sage)}
.breadcrumb [aria-current]{color:var(--sage)}

.page-hero--split .page-hero__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(2rem,4vw,3.75rem);align-items:center}
.page-hero--split .page-hero__media{border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-lg);aspect-ratio:4/3;background:var(--ink-3)}
.page-hero--split .page-hero__media img{width:100%;height:100%;object-fit:cover}
.page-hero--split .page-hero__media--portrait{aspect-ratio:3/4}
.page-hero--split .page-hero__media--wide{aspect-ratio:2/1}
.page-hero--split .page-hero__media--3-2{aspect-ratio:3/2}

/* ---------- 8. Reusable blocks ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,4.5vw,4.25rem);align-items:center}
.split--wide-left{grid-template-columns:1.14fr .86fr}
.split--wide-right{grid-template-columns:.86fr 1.14fr}
.split__media{position:relative}
.split__img{
  border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-md);
  background:var(--sand);aspect-ratio:3/2;
}
.split__img img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease)}
.split__img:hover img{transform:scale(1.035)}
.split__img--portrait{aspect-ratio:3/4}
.split__img--tall{aspect-ratio:4/5}
.split__img--wide{aspect-ratio:2/1}
/* Flip column order on desktop only (keeps a sensible reading order on mobile) */
@media (min-width:981px){
  .split--flip{direction:rtl}
  .split--flip>*{direction:ltr}
}
/* Force an element to the top of a stacked grid on small screens */
@media (max-width:980px){
  .m-first{order:-1}
}

.offset-media{position:relative;padding:0 0 3.25rem 3.25rem}
.offset-media__main{border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-lg);aspect-ratio:4/3;background:var(--sand)}
.offset-media__main img{width:100%;height:100%;object-fit:cover}
.offset-media__accent{
  position:absolute;left:0;bottom:0;width:52%;aspect-ratio:4/3;
  border-radius:var(--radius-lg);overflow:hidden;border:8px solid var(--ivory);
  box-shadow:var(--shadow-md);background:var(--sand);
}
.offset-media__accent img{width:100%;height:100%;object-fit:cover}
.section--sand .offset-media__accent{border-color:var(--ivory-2)}

.pill-list{list-style:none;padding:0;margin:1.6rem 0 0;display:flex;flex-wrap:wrap;gap:.55rem}
.pill-list li{
  margin:0;padding:.5rem 1rem;border-radius:100px;background:var(--white);
  border:1px solid var(--line);font-size:.855rem;font-weight:500;color:var(--text-2);
}
.section--ink .pill-list li{background:rgba(249,245,239,.06);border-color:var(--line-dark);color:rgba(249,245,239,.82)}

.check-list{list-style:none;padding:0;margin:1.5rem 0 0}
.check-list li{position:relative;padding-left:2rem;margin-bottom:.95rem;color:var(--text-2)}
.check-list li::before{
  content:"";position:absolute;left:0;top:.52em;width:14px;height:8px;
  border-left:2px solid var(--teal);border-bottom:2px solid var(--teal);
  transform:rotate(-45deg);
}
.section--ink .check-list li{color:rgba(249,245,239,.8)}
.section--ink .check-list li::before{border-color:var(--sage)}
.check-list b{color:var(--ink);font-weight:600}
.section--ink .check-list b{color:var(--ivory)}

.num-list{list-style:none;padding:0;margin:1.6rem 0 0;counter-reset:n}
.num-list li{
  counter-increment:n;position:relative;padding-left:3rem;margin-bottom:1.4rem;color:var(--text-2)
}
.num-list li::before{
  content:counter(n,decimal-leading-zero);position:absolute;left:0;top:.05em;
  font-family:var(--font-display);font-size:1.02rem;color:var(--clay);font-weight:600;
  width:2.1rem;border-bottom:1px solid var(--line);padding-bottom:.15rem
}
.num-list b{display:block;color:var(--ink);font-weight:600;margin-bottom:.15rem;font-size:1.02rem}

/* Cards */
.card{
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:clamp(1.5rem,2.5vw,2.1rem);position:relative;overflow:hidden;
  transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color .45s var(--ease);
}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--sand)}
.card h3,.card h4{margin-bottom:.55rem}
.card p{color:var(--text-2);margin-bottom:0}
.card__icon{
  width:46px;height:46px;border-radius:12px;display:grid;place-items:center;
  background:var(--ivory-2);color:var(--teal-deep);margin-bottom:1.15rem;flex:none;
}
.card__icon svg{width:21px;height:21px}
.card__num{
  font-family:var(--font-display);font-size:2.1rem;color:var(--sand);font-weight:600;
  line-height:1;margin-bottom:.85rem;display:block
}
.section--ink .card{background:rgba(249,245,239,.045);border-color:var(--line-dark)}
.section--ink .card p{color:rgba(249,245,239,.76)}
.section--ink .card:hover{border-color:rgba(249,245,239,.28);background:rgba(249,245,239,.07)}
.section--ink .card__icon{background:rgba(138,167,154,.16);color:var(--sage)}
.section--ink .card__num{color:rgba(138,167,154,.45)}

.grid{display:grid;gap:clamp(1rem,2vw,1.6rem)}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}

/* Asymmetric feature grid */
.asym{display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(1rem,2vw,1.6rem)}
.asym>*{grid-column:span 2}
.asym>.asym--wide{grid-column:span 3}
.asym>.asym--full{grid-column:span 6}

/* Quote / editorial block */
.pull-quote{
  position:relative;padding:clamp(1.75rem,4vw,3rem) 0 0;
  border-top:2px solid var(--clay);max-width:44ch;
}
.pull-quote p{
  font-family:var(--font-display);font-size:clamp(1.32rem,1.05rem + 1.15vw,1.95rem);
  line-height:1.34;color:var(--ink);font-weight:400;font-variation-settings:"SOFT" 30;
}
.section--ink .pull-quote p{color:var(--ivory)}
.pull-quote cite{
  display:block;margin-top:1.15rem;font-style:normal;font-size:.78rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--text-3);font-weight:600;font-family:var(--font-body)
}
.section--ink .pull-quote cite{color:var(--sage)}

/* Stat band */
.stat-band{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line-dark);border-radius:var(--radius-lg);overflow:hidden}
.stat{background:var(--ink-2);padding:clamp(1.5rem,3vw,2.35rem);text-align:center}
.stat b{
  display:block;font-family:var(--font-display);font-weight:600;color:var(--ivory);
  font-size:clamp(1.85rem,1.35rem + 2.1vw,2.85rem);line-height:1;margin-bottom:.5rem
}
.stat span{font-size:.775rem;letter-spacing:.12em;text-transform:uppercase;color:var(--sage);font-weight:600;line-height:1.45;display:block}

/* Notice / callout */
.notice{
  border-radius:var(--radius-lg);padding:clamp(1.4rem,2.5vw,2rem);
  background:var(--white);border:1px solid var(--line);border-left:3px solid var(--clay);
}
.notice h3,.notice h4{margin-bottom:.5rem}
.notice p{color:var(--text-2)}
.notice--teal{border-left-color:var(--teal)}
.notice--sand{background:var(--ivory-2);border-color:var(--sand)}
.section--ink .notice{background:rgba(249,245,239,.05);border-color:var(--line-dark);border-left-color:var(--clay-2)}
.section--ink .notice p{color:rgba(249,245,239,.78)}

/* Feature row (icon + text) */
.feature-row{display:flex;gap:1.15rem;align-items:flex-start}
.feature-row .card__icon{margin-bottom:0}
.feature-row h4{margin-bottom:.35rem}
.feature-row p{color:var(--text-2);margin:0;font-size:.965rem}
.section--ink .feature-row p{color:rgba(249,245,239,.74)}

/* ---------- 9. Behavioural cycle diagram ---------- */
.cycle{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(2rem,4vw,3.5rem);align-items:center}
.cycle__stage{position:relative;aspect-ratio:1/1;max-width:520px;margin-inline:auto;width:100%}
.cycle__ring{position:absolute;inset:0;width:100%;height:100%}
.cycle__ring circle{fill:none;stroke:var(--line);stroke-width:1}
.section--ink .cycle__ring circle{stroke:rgba(249,245,239,.16)}
.cycle__center{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:44%;aspect-ratio:1/1;border-radius:50%;background:var(--white);
  border:1px solid var(--line);display:grid;place-items:center;text-align:center;
  padding:1rem;box-shadow:var(--shadow-sm)
}
.section--ink .cycle__center{background:var(--ink-2);border-color:var(--line-dark)}
.cycle__center span{font-size:.66rem;letter-spacing:.15em;text-transform:uppercase;color:var(--text-3);font-weight:600;display:block;margin-bottom:.3rem}
.cycle__center strong{display:block;font-family:var(--font-display);font-size:clamp(.92rem,.78rem + .5vw,1.2rem);color:var(--ink);font-weight:500;line-height:1.2}
.section--ink .cycle__center strong{color:var(--ivory)}
.cycle__node{
  position:absolute;transform:translate(-50%,-50%);
  background:var(--white);border:1px solid var(--line);border-radius:100px;
  padding:.5rem .95rem;font-size:.79rem;font-weight:600;color:var(--text-2);cursor:pointer;
  white-space:nowrap;box-shadow:var(--shadow-sm);
  transition:background .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease),transform .35s var(--ease);
}
.cycle__node:hover{transform:translate(-50%,-50%) scale(1.05);border-color:var(--clay)}
.cycle__node.is-active{background:var(--clay);border-color:var(--clay);color:var(--white)}
.section--ink .cycle__node{background:var(--ink-2);border-color:var(--line-dark);color:rgba(249,245,239,.8)}
.section--ink .cycle__node.is-active{background:var(--clay);border-color:var(--clay);color:var(--white)}
.cycle__panel{min-height:200px}
.cycle__panel-item{display:none}
.cycle__panel-item.is-active{display:block;animation:fadeUp .5s var(--ease) both}
.cycle__panel-item .step-tag{
  font-size:.72rem;letter-spacing:.15em;text-transform:uppercase;color:var(--clay);font-weight:700;
  display:block;margin-bottom:.6rem
}
.cycle__panel-item h3{margin-bottom:.65rem}
.cycle__panel-item p{color:var(--text-2)}
.section--ink .cycle__panel-item p{color:rgba(249,245,239,.78)}

/* Linear flow (arrow chain) */
.flow{display:flex;flex-wrap:wrap;gap:.55rem;align-items:stretch;margin-top:2rem}
.flow__step{
  flex:1 1 150px;background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:1.15rem 1.15rem 1.25rem;position:relative;
  transition:transform .4s var(--ease),border-color .4s var(--ease)
}
.flow__step:hover{transform:translateY(-3px);border-color:var(--clay)}
.flow__step b{display:block;font-size:.7rem;letter-spacing:.13em;text-transform:uppercase;color:var(--clay);font-weight:700;margin-bottom:.5rem}
.flow__step p{font-size:.9rem;color:var(--text-2);margin:0}
.flow__step h4{font-size:1.02rem;margin-bottom:.3rem}
.section--ink .flow__step{background:rgba(249,245,239,.05);border-color:var(--line-dark)}
.section--ink .flow__step p{color:rgba(249,245,239,.74)}

/* Dossier (sticky category label + practice list) */
.dossier{
  display:grid;grid-template-columns:minmax(180px,.75fr) 1.9fr;gap:clamp(1.5rem,4vw,3.5rem);
  padding-block:clamp(2.25rem,4vw,3.25rem);border-top:1px solid var(--line)
}
.section--ink .dossier{border-color:var(--line-dark)}
.dossier__label{position:sticky;top:calc(var(--header-h) + 24px);align-self:start}
.dossier__label .eyebrow{margin-bottom:.75rem}
.dossier__label h3{margin-bottom:.6rem}
.dossier__label p{font-size:.94rem;color:var(--text-2);margin:0}
.section--ink .dossier__label p{color:rgba(249,245,239,.72)}
.practice{
  display:grid;grid-template-columns:auto 1fr;gap:1.15rem;align-items:start;
  padding-bottom:1.5rem;margin-bottom:1.5rem;border-bottom:1px dashed var(--line)
}
.practice:last-child{border-bottom:0;padding-bottom:0;margin-bottom:0}
.section--ink .practice{border-color:var(--line-dark)}
.practice__mark{
  width:32px;height:32px;border-radius:50%;border:1px solid var(--line);
  display:grid;place-items:center;font-size:.76rem;font-weight:700;color:var(--clay);
  font-family:var(--font-body);flex:none;background:var(--white)
}
.section--sand .practice__mark{background:var(--ivory-2)}
.section--ink .practice__mark{background:transparent;border-color:var(--line-dark);color:var(--clay-2)}
.practice h4{margin-bottom:.4rem}
.practice p{color:var(--text-2);margin:0;font-size:.965rem}
.section--ink .practice p{color:rgba(249,245,239,.76)}
@media (max-width:820px){
  .dossier{grid-template-columns:1fr;gap:1.5rem}
  .dossier__label{position:static}
}

/* Step blocks (process journey) */
.step-block{position:relative;padding-block:clamp(2.5rem,5vw,4.25rem);border-top:1px solid var(--line)}
.step-block:first-of-type{border-top:0;padding-top:0}
.section--ink .step-block{border-color:var(--line-dark)}
.step-block__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,4.5vw,4rem);align-items:center}
.step-block--reverse .step-block__media{order:-1}
.step-block__label{
  display:flex;align-items:baseline;gap:.85rem;margin-bottom:1.15rem
}
.step-block__no{
  font-family:var(--font-display);font-size:clamp(2.4rem,1.8rem + 2.6vw,3.9rem);
  line-height:.9;color:var(--clay);font-weight:600;letter-spacing:-.02em
}
.step-block__tag{
  font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--text-3);font-weight:700
}
.section--ink .step-block__tag{color:var(--sage)}
.step-block h3{font-size:clamp(1.45rem,1.2rem + 1.1vw,2.1rem);margin-bottom:.75rem}
.step-block p{color:var(--text-2)}
.section--ink .step-block p{color:rgba(249,245,239,.78)}
.step-block__media .split__img{margin:0}
.step-block__aside{
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:clamp(1.4rem,2.5vw,2rem)
}
.section--ink .step-block__aside{background:rgba(249,245,239,.05);border-color:var(--line-dark)}
.step-block__aside h4{margin-bottom:.75rem;font-size:1.02rem}
.step-block__aside ul{list-style:none;padding:0;margin:0}
.step-block__aside li{
  position:relative;padding-left:1.35rem;font-size:.94rem;color:var(--text-2);margin-bottom:.6rem
}
.section--ink .step-block__aside li{color:rgba(249,245,239,.76)}
.step-block__aside li::before{
  content:"";position:absolute;left:0;top:.62em;width:6px;height:6px;border-radius:50%;background:var(--clay-2)
}
@media (max-width:980px){
  .step-block__grid{grid-template-columns:1fr;gap:1.85rem}
  .step-block--reverse .step-block__media{order:0}
}

/* Editorial index list (three-column rows divided by hairlines) */
.index-list{border-top:1px solid var(--line);margin-top:clamp(2rem,4vw,3rem)}
.section--ink .index-list{border-color:var(--line-dark)}
.index-row{
  display:grid;grid-template-columns:6rem 1fr 1.35fr;gap:clamp(1rem,2.5vw,2.5rem);
  padding:clamp(1.5rem,3vw,2.25rem) 0;border-bottom:1px solid var(--line);
  align-items:start;transition:background .45s var(--ease)
}
.section--ink .index-row{border-color:var(--line-dark)}
.index-row:hover{background:rgba(232,220,203,.28)}
.section--ink .index-row:hover{background:rgba(249,245,239,.04)}
.index-row__no{
  font-family:var(--font-display);font-size:clamp(1.2rem,1rem + .7vw,1.55rem);
  color:var(--clay);font-weight:600;line-height:1.2;letter-spacing:.02em
}
.index-row h3{margin:0;font-size:clamp(1.18rem,1.06rem + .55vw,1.5rem)}
.index-row p{color:var(--text-2);margin:0}
.section--ink .index-row p{color:rgba(249,245,239,.78)}
.index-row p+p{margin-top:.85rem}
@media (max-width:860px){
  .index-row{grid-template-columns:3.4rem 1fr;gap:1rem 1.15rem}
  .index-row p{grid-column:2}
  .index-row:hover{background:transparent}
}

/* Interactive behavioural track (Trigger → Urge → … → Pattern) */
.track{margin-top:clamp(2rem,4vw,3rem)}
.track__rail{
  position:relative;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;
  gap:.5rem;padding-top:2.6rem
}
.track__rail::before{
  content:"";position:absolute;top:calc(2.6rem - 9px);left:6%;right:6%;height:2px;
  background:var(--line)
}
.section--ink .track__rail::before{background:rgba(249,245,239,.18)}
.track__btn{
  position:relative;background:none;border:0;cursor:pointer;padding:0 .25rem;text-align:center;
  font-family:var(--font-body);font-size:.775rem;font-weight:600;color:var(--text-3);
  line-height:1.35;transition:color .35s var(--ease)
}
.track__btn::before{
  content:"";position:absolute;top:-2.6rem;left:50%;transform:translateX(-50%);
  width:16px;height:16px;border-radius:50%;background:var(--ivory);
  border:2px solid var(--line);transition:all .4s var(--ease)
}
.section--sand .track__btn::before{background:var(--ivory-2)}
.section--ink .track__btn::before{background:var(--ink);border-color:rgba(249,245,239,.28)}
.track__btn:hover{color:var(--ink)}
.section--ink .track__btn:hover{color:var(--ivory)}
.track__btn:hover::before{border-color:var(--clay)}
.track__btn.is-active{color:var(--clay)}
.track__btn.is-active::before{
  background:var(--clay);border-color:var(--clay);width:22px;height:22px;top:calc(-2.6rem - 3px);
  box-shadow:0 0 0 5px rgba(166,85,47,.15)
}
.track__step-no{
  display:block;font-family:var(--font-display);font-size:.72rem;letter-spacing:.1em;
  color:var(--text-3);margin-bottom:.25rem;opacity:.8
}
.track__panels{margin-top:clamp(1.75rem,3vw,2.5rem)}
.track__panel{display:none}
.track__panel.is-active{display:block;animation:fadeUp .5s var(--ease) both}
.track__panel-inner{
  background:var(--white);border:1px solid var(--line);border-left:3px solid var(--clay);
  border-radius:var(--radius-lg);padding:clamp(1.5rem,3vw,2.35rem);
  display:grid;grid-template-columns:auto 1fr;gap:clamp(1.25rem,3vw,2.25rem);align-items:start
}
.section--ink .track__panel-inner{background:rgba(249,245,239,.05);border-color:var(--line-dark);border-left-color:var(--clay-2)}
.track__panel-no{
  font-family:var(--font-display);font-size:clamp(2.2rem,1.6rem + 2.4vw,3.4rem);
  color:var(--sand);line-height:1;font-weight:600
}
.section--ink .track__panel-no{color:rgba(138,167,154,.4)}
.track__panel h3{margin-bottom:.6rem}
.track__panel p{color:var(--text-2)}
.section--ink .track__panel p{color:rgba(249,245,239,.78)}
.track__tag{
  display:inline-block;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;
  font-weight:700;color:var(--clay);margin-bottom:.55rem
}
@media (max-width:760px){
  .track__rail{grid-auto-flow:row;grid-auto-columns:auto;gap:0;padding-top:0;padding-left:2.25rem}
  .track__rail::before{top:10px;bottom:10px;left:9px;right:auto;width:2px;height:auto}
  .track__btn{text-align:left;padding:.72rem 0}
  .track__btn::before{top:50%;left:-2.25rem;transform:translateY(-50%);margin-left:1px}
  .track__btn.is-active::before{top:50%;left:calc(-2.25rem - 3px)}
  .track__panel-inner{grid-template-columns:1fr;gap:.75rem}
}

/* ---------- 10. Timelines ---------- */
.timeline{position:relative;margin-top:clamp(2rem,4vw,3.25rem)}
.timeline::before{
  content:"";position:absolute;left:27px;top:8px;bottom:8px;width:1px;background:var(--line)
}
.section--ink .timeline::before{background:var(--line-dark)}
.timeline__item{position:relative;padding-left:5rem;padding-bottom:clamp(2rem,3.5vw,3rem)}
.timeline__item:last-child{padding-bottom:0}
.timeline__num{
  position:absolute;left:0;top:0;width:56px;height:56px;border-radius:50%;
  background:var(--ivory);border:1px solid var(--line);display:grid;place-items:center;
  font-family:var(--font-display);font-size:.95rem;font-weight:600;color:var(--ink);z-index:2;
  transition:background .4s var(--ease),color .4s var(--ease),border-color .4s var(--ease)
}
.timeline__item:hover .timeline__num{background:var(--teal-deep);color:var(--ivory);border-color:var(--teal-deep)}
.section--sand .timeline__num{background:var(--ivory-2)}
.section--ink .timeline__num{background:var(--ink);border-color:var(--line-dark);color:var(--ivory)}
.timeline__item h3{margin-bottom:.5rem}
.timeline__item p{color:var(--text-2)}
.section--ink .timeline__item p{color:rgba(249,245,239,.78)}
.timeline__meta{
  font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--clay);
  font-weight:700;display:block;margin-bottom:.45rem
}

/* Horizontal process rail */
.rail{
  display:grid;grid-auto-flow:column;grid-auto-columns:minmax(255px,1fr);
  gap:1rem;overflow-x:auto;padding-bottom:1.25rem;scroll-snap-type:x proximity;
  scrollbar-width:thin;scrollbar-color:var(--sand) transparent
}
.rail::-webkit-scrollbar{height:6px}
.rail::-webkit-scrollbar-thumb{background:var(--sand);border-radius:10px}
.rail::-webkit-scrollbar-track{background:transparent}
.rail__card{
  scroll-snap-align:start;background:var(--white);border:1px solid var(--line);
  border-radius:var(--radius-lg);padding:1.5rem;display:flex;flex-direction:column;gap:.5rem;
  transition:border-color .4s var(--ease),transform .4s var(--ease)
}
.rail__card:hover{border-color:var(--clay);transform:translateY(-3px)}
.rail__card b{font-family:var(--font-display);font-size:1.6rem;color:var(--sand);line-height:1;font-weight:600}
.rail__card h4{margin:0}
.rail__card p{font-size:.925rem;color:var(--text-2);margin:0}
.section--ink .rail__card{background:rgba(249,245,239,.05);border-color:var(--line-dark)}
.section--ink .rail__card p{color:rgba(249,245,239,.74)}
.section--ink .rail__card b{color:rgba(138,167,154,.5)}
.rail-hint{
  margin:.85rem 0 0;font-size:.79rem;letter-spacing:.09em;text-transform:uppercase;
  font-weight:600;color:var(--text-3);display:flex;align-items:center;gap:.5rem
}
.section--ink .rail-hint{color:var(--sage)}
.rail-hint span{font-size:1.05rem;line-height:1}

/* ---------- 11. Trigger cards (interactive) ---------- */
.trigger-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1rem;margin-top:2.25rem}
.trigger{
  position:relative;text-align:left;background:var(--white);border:1px solid var(--line);
  border-radius:var(--radius-lg);padding:1.35rem;cursor:pointer;overflow:hidden;
  transition:transform .4s var(--ease),border-color .4s var(--ease),box-shadow .4s var(--ease);
  display:flex;flex-direction:column;gap:.6rem;width:100%;
}
.trigger::before{
  content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(42,106,100,.07),transparent 62%);
  opacity:0;transition:opacity .45s var(--ease)
}
.trigger:hover,.trigger.is-open{border-color:var(--teal-light);box-shadow:var(--shadow-md);transform:translateY(-3px)}
.trigger:hover::before,.trigger.is-open::before{opacity:1}
.trigger__top{display:flex;align-items:center;gap:.8rem;position:relative;z-index:1}
.trigger__icon{width:38px;height:38px;border-radius:10px;background:var(--ivory-2);color:var(--teal-deep);display:grid;place-items:center;flex:none}
.trigger__icon svg{width:18px;height:18px}
.trigger h4{margin:0;font-size:1.04rem}
.trigger__body{
  position:relative;z-index:1;font-size:.925rem;color:var(--text-2);
  max-height:0;overflow:hidden;opacity:0;
  transition:max-height .5s var(--ease),opacity .4s var(--ease)
}
.trigger.is-open .trigger__body{max-height:400px;opacity:1}
.trigger__hint{
  position:relative;z-index:1;font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;
  font-weight:700;color:var(--clay);display:flex;align-items:center;gap:.4rem;margin-top:auto
}
.trigger__hint svg{width:12px;height:12px;transition:transform .4s var(--ease)}
.trigger.is-open .trigger__hint svg{transform:rotate(180deg)}

/* ---------- 12. Accordion (FAQ) ---------- */
.accordion{border-top:1px solid var(--line)}
.section--ink .accordion{border-color:var(--line-dark)}
.acc{border-bottom:1px solid var(--line)}
.section--ink .acc{border-color:var(--line-dark)}
.acc__btn{
  width:100%;background:none;border:0;cursor:pointer;text-align:left;
  padding:clamp(1.1rem,2vw,1.5rem) 3rem clamp(1.1rem,2vw,1.5rem) 0;
  display:flex;align-items:flex-start;gap:1rem;position:relative;
  font-family:var(--font-display);font-size:clamp(1.06rem,1rem + .38vw,1.28rem);
  font-weight:500;color:var(--ink);line-height:1.35;letter-spacing:-.01em;
  transition:color .3s var(--ease)
}
.section--ink .acc__btn{color:var(--ivory)}
.acc__btn:hover{color:var(--clay)}
.acc__btn::after,.acc__btn::before{
  content:"";position:absolute;right:6px;top:50%;background:var(--clay);
  transition:transform .4s var(--ease),opacity .3s var(--ease)
}
.acc__btn::before{width:15px;height:1.5px;margin-top:-.75px}
.acc__btn::after{width:1.5px;height:15px;margin-top:-7.5px;margin-right:6.75px}
.acc.is-open .acc__btn::after{transform:rotate(90deg);opacity:0}
.acc__q-num{
  font-family:var(--font-body);font-size:.75rem;font-weight:700;color:var(--clay);
  letter-spacing:.08em;padding-top:.42em;flex:none
}
.acc__panel{overflow:hidden;height:0;transition:height .45s var(--ease)}
.acc__inner{padding:0 3rem 1.6rem 3.05rem;color:var(--text-2)}
.section--ink .acc__inner{color:rgba(249,245,239,.78)}
.acc__inner p:last-child{margin-bottom:0}

/* ---------- 13. Forms ---------- */
.form-card{
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius-xl);
  padding:clamp(1.6rem,3.5vw,2.85rem);box-shadow:var(--shadow-md)
}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.15rem}
.field{display:flex;flex-direction:column;gap:.42rem}
.field--full{grid-column:1/-1}
.field label{font-size:.815rem;font-weight:600;color:var(--ink-2);letter-spacing:.02em}
.field label .req{color:var(--clay)}
.field input,.field textarea,.field select{
  width:100%;padding:.85rem 1rem;border:1px solid var(--line);border-radius:10px;
  background:var(--ivory);color:var(--text);font-family:var(--font-body);font-size:.965rem;
  transition:border-color .3s var(--ease),box-shadow .3s var(--ease),background .3s var(--ease)
}
.field textarea{min-height:140px;resize:vertical;line-height:1.6}
.field input:hover,.field textarea:hover,.field select:hover{border-color:var(--sand)}
.field input:focus,.field textarea:focus,.field select:focus{
  outline:none;border-color:var(--teal);background:var(--white);
  box-shadow:0 0 0 3px rgba(42,106,100,.14)
}
.field input::placeholder,.field textarea::placeholder{color:#5E6B73;opacity:1}
.field .err{font-size:.79rem;color:#96291B;display:none;font-weight:500}
.field.is-invalid input,.field.is-invalid textarea{border-color:#96291B;background:#FDF6F4}
.field.is-invalid .err{display:block}
.field .hint{font-size:.79rem;color:var(--text-3)}
.form-consent{display:flex;gap:.7rem;align-items:flex-start;font-size:.855rem;color:var(--text-2);line-height:1.55}
.form-consent input{width:18px;height:18px;flex:none;margin-top:.22rem;accent-color:var(--teal-deep)}
.form-note{
  margin-top:1.15rem;font-size:.815rem;color:var(--text-3);line-height:1.6;
  padding-top:1.15rem;border-top:1px solid var(--line)
}
.form-status{
  margin-top:1.15rem;padding:1rem 1.15rem;border-radius:10px;font-size:.92rem;font-weight:500;display:none
}
.form-status.is-success{display:block;background:#EAF2EF;border:1px solid #B9D4CC;color:#1C4C44}
.form-status.is-error{display:block;background:#FBF0ED;border:1px solid #E4BDB2;color:#83321F}

/* Contact detail tiles */
.contact-tiles{display:grid;gap:1rem}
.contact-tile{
  display:flex;gap:1.1rem;align-items:flex-start;background:var(--white);
  border:1px solid var(--line);border-radius:var(--radius-lg);padding:1.35rem 1.5rem;
  transition:transform .4s var(--ease),border-color .4s var(--ease),box-shadow .4s var(--ease)
}
.contact-tile:hover{transform:translateY(-3px);border-color:var(--teal-light);box-shadow:var(--shadow-md)}
.contact-tile__icon{
  width:44px;height:44px;border-radius:12px;background:var(--ivory-2);color:var(--teal-deep);
  display:grid;place-items:center;flex:none
}
.contact-tile__icon svg{width:20px;height:20px}
.contact-tile span{
  display:block;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--text-3);font-weight:700;margin-bottom:.3rem
}
.contact-tile a,.contact-tile strong{
  font-family:var(--font-display);font-size:1.14rem;color:var(--ink);font-weight:500;
  word-break:break-word;display:block;line-height:1.32
}
.contact-tile a:hover{color:var(--clay)}
.contact-tile p{font-size:.87rem;color:var(--text-2);margin:.3rem 0 0}
.section--ink .contact-tile{background:rgba(249,245,239,.05);border-color:var(--line-dark)}
.section--ink .contact-tile a,.section--ink .contact-tile strong{color:var(--ivory)}
.section--ink .contact-tile__icon{background:rgba(138,167,154,.16);color:var(--sage)}
.section--ink .contact-tile p{color:rgba(249,245,239,.72)}
.section--ink .contact-tile span{color:var(--sage)}

/* ---------- 14. CTA band ---------- */
.cta-band{position:relative;overflow:hidden;background:var(--ink);color:rgba(249,245,239,.84)}
.cta-band__glow{position:absolute;width:520px;height:520px;border-radius:50%;filter:blur(110px);background:rgba(42,106,100,.4);top:-200px;left:50%;transform:translateX(-50%);pointer-events:none}
.cta-band__inner{position:relative;z-index:2;text-align:center;max-width:70ch;margin-inline:auto}
.cta-band h2{color:var(--ivory)}
.cta-band p{color:rgba(249,245,239,.78)}

/* ---------- 15. Footer ---------- */
.site-footer{background:var(--ink);color:rgba(249,245,239,.72);padding-top:clamp(3rem,5.5vw,4.75rem)}
.footer-top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.15fr;gap:clamp(1.75rem,3vw,3rem);padding-bottom:clamp(2.25rem,4vw,3.25rem)}
.footer-brand .brand__name{color:var(--ivory)}
.footer-brand .brand__sub{color:var(--sage)}
.footer-brand .brand__mark{background:rgba(249,245,239,.1)}
.footer-about{margin-top:1.15rem;font-size:.92rem;line-height:1.7;color:rgba(249,245,239,.66);max-width:38ch}
.footer-col h2,.footer-col h4{
  font-family:var(--font-body);font-size:.735rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--sage);font-weight:700;margin:0 0 1.15rem;line-height:1.4
}
.footer-links{list-style:none;padding:0;margin:0}
.footer-links li{margin-bottom:.6rem}
.footer-links a{font-size:.9rem;color:rgba(249,245,239,.7);transition:color .3s var(--ease),padding .3s var(--ease);display:inline-block}
.footer-links a:hover{color:var(--ivory);padding-left:4px}
.footer-contact{list-style:none;padding:0;margin:0}
.footer-contact li{margin-bottom:1rem;display:flex;gap:.7rem;align-items:flex-start}
.footer-contact svg{width:16px;height:16px;color:var(--sage);flex:none;margin-top:.28rem}
.footer-contact a,.footer-contact span{font-size:.92rem;color:rgba(249,245,239,.76);word-break:break-word}
.footer-contact a:hover{color:var(--ivory)}
.social{display:flex;gap:.55rem;margin-top:1.5rem;list-style:none;padding:0;flex-wrap:wrap}
.social li{margin:0}
.social a,.social .social-icon{
  width:40px;height:40px;border-radius:50%;border:1px solid var(--line-dark);
  display:grid;place-items:center;color:rgba(249,245,239,.7);
  transition:background .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease),transform .35s var(--ease)
}
.social a:hover{background:var(--teal-deep);border-color:var(--teal-deep);color:var(--ivory);transform:translateY(-3px)}
.social .social-icon{color:rgba(249,245,239,.45);background:rgba(249,245,239,.03)}
.social svg{width:17px;height:17px}
.social-note{font-size:.78rem;color:rgba(249,245,239,.45);margin-top:.85rem;line-height:1.6}
.footer-bottom{
  border-top:1px solid var(--line-dark);padding-block:1.6rem;
  display:flex;flex-wrap:wrap;gap:.85rem 1.75rem;align-items:center;justify-content:space-between;
  font-size:.845rem;color:rgba(249,245,239,.58)
}
.footer-bottom a{color:rgba(249,245,239,.75)}
.footer-bottom a:hover{color:var(--sage)}
.footer-legal{display:flex;flex-wrap:wrap;gap:.5rem 1.25rem;list-style:none;margin:0;padding:0}
.footer-legal li{margin:0}
.footer-disclaimer{
  border-top:1px solid var(--line-dark);padding-block:1.4rem 2.25rem;
  font-size:.795rem;line-height:1.7;color:rgba(249,245,239,.52);max-width:105ch
}

/* ---------- 16. Motion ---------- */
[data-reveal]{opacity:0;transform:translateY(22px);transition:opacity .85s var(--ease),transform .85s var(--ease)}
[data-reveal].is-in{opacity:1;transform:none}
[data-reveal][data-delay="1"]{transition-delay:.09s}
[data-reveal][data-delay="2"]{transition-delay:.18s}
[data-reveal][data-delay="3"]{transition-delay:.27s}
[data-reveal][data-delay="4"]{transition-delay:.36s}
[data-reveal][data-delay="5"]{transition-delay:.45s}
@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.float-slow{animation:floatY 9s ease-in-out infinite}
@keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}

/* Focus states */
:focus-visible{outline:2.5px solid var(--clay);outline-offset:3px;border-radius:3px}
.section--ink :focus-visible,.site-footer :focus-visible,.page-hero :focus-visible,.cta-band :focus-visible{outline-color:var(--sage)}

/* Decorative texture */
.grain{
  position:absolute;inset:0;pointer-events:none;opacity:.03;z-index:1;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}
.section>.wrap,.section>.wrap-narrow,.section>.wrap-wide{position:relative;z-index:2}

/* Legal / long-form article */
.legal h2{margin-top:2.75rem;font-size:clamp(1.42rem,1.2rem + .9vw,1.85rem)}
.legal h2:first-child{margin-top:0}
.legal h3{margin-top:1.85rem;font-size:clamp(1.12rem,1.05rem + .38vw,1.3rem)}
.legal p,.legal li{color:var(--text-2)}
.legal ul{padding-left:1.15rem}
.legal__meta{
  font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3);
  font-weight:600;padding-bottom:1.5rem;margin-bottom:2.25rem;border-bottom:1px solid var(--line)
}
.toc{
  background:var(--ivory-2);border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:1.5rem 1.75rem;margin-bottom:2.75rem
}
.toc h2{font-family:var(--font-body);font-size:.735rem;letter-spacing:.16em;text-transform:uppercase;color:var(--text-3);margin:0 0 1rem;font-weight:700}
.toc ol{margin:0;padding-left:1.15rem;columns:2;column-gap:2rem}
.toc li{margin-bottom:.42rem;font-size:.9rem}

/* Inline mini-nav between related pages */
.related{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:clamp(2rem,4vw,3rem)}
.related__card{
  display:block;background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:1.5rem;transition:transform .4s var(--ease),border-color .4s var(--ease),box-shadow .4s var(--ease)
}
.related__card:hover{transform:translateY(-4px);border-color:var(--teal-light);box-shadow:var(--shadow-md)}
.related__card .tag{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--clay);font-weight:700}
.related__card h4{margin:.55rem 0 .4rem}
.related__card p{font-size:.9rem;color:var(--text-2);margin:0}
.section--ink .related__card{background:rgba(249,245,239,.05);border-color:var(--line-dark)}
.section--ink .related__card p{color:rgba(249,245,239,.74)}
.section--ink .related__card h4{color:var(--ivory)}

/* Definition / comparison table */
.compare{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:2rem}
.compare__col{
  border-radius:var(--radius-lg);padding:clamp(1.4rem,2.5vw,2rem);border:1px solid var(--line);background:var(--white)
}
.compare__col--alt{background:var(--ivory-2);border-color:var(--sand)}
.compare__col h4{margin-bottom:1rem;display:flex;align-items:center;gap:.6rem}
.compare__col h4 i{width:8px;height:8px;border-radius:50%;background:var(--teal);flex:none;display:block}
.compare__col--alt h4 i{background:var(--clay)}
.compare__col ul{list-style:none;padding:0;margin:0}
.compare__col li{
  padding-left:1.35rem;position:relative;font-size:.955rem;color:var(--text-2);margin-bottom:.75rem
}
.compare__col li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:6px;border-radius:50%;background:var(--sand)}
.compare__col--alt li::before{background:var(--clay-2)}
/* Comparison columns keep a readable treatment inside dark sections */
.section--ink .compare__col{background:rgba(249,245,239,.05);border-color:var(--line-dark)}
.section--ink .compare__col--alt{background:rgba(196,120,78,.09);border-color:rgba(196,120,78,.3)}
.section--ink .compare__col li{color:rgba(249,245,239,.8)}
.section--ink .compare__col li::before{background:var(--sage)}
.section--ink .compare__col--alt li::before{background:var(--clay-2)}
.section--ink .compare__col h3 i,.section--ink .compare__col h4 i{background:var(--sage)}
.section--ink .compare__col--alt h3 i,.section--ink .compare__col--alt h4 i{background:var(--clay-2)}
/* Trigger cards inside dark sections */
.section--ink .trigger{background:rgba(249,245,239,.05);border-color:var(--line-dark)}
.section--ink .trigger h3,.section--ink .trigger h4{color:var(--ivory)}
.section--ink .trigger__body{color:rgba(249,245,239,.78)}
.section--ink .trigger__icon{background:rgba(138,167,154,.16);color:var(--sage)}
.section--ink .trigger__hint{color:var(--clay-2)}

/* ---------- 16b. Component headings ----------
   Cards, notices and other repeating blocks use h3/h4 depending on their
   position in the document outline. Their visual size is set by the component
   rather than by the tag, so the outline can stay semantically correct. */
.card h3,.card h4,
.notice h3,.notice h4,
.flow__step h3,.flow__step h4,
.rail__card h3,.rail__card h4,
.trigger h3,.trigger h4,
.step-block__aside h3,.step-block__aside h4,
.practice h3,.practice h4,
.related__card h3,.related__card h4,
.compare__col h3,.compare__col h4,
.feature-row h3,.feature-row h4,
.contact-tile h3,.contact-tile h4,
.form-card h3{
  font-size:clamp(1.09rem,1.01rem + .4vw,1.3rem);
  line-height:1.34;
  letter-spacing:-.005em;
}
.rail__card h3,.rail__card h4,.trigger h3,.trigger h4{margin:0}
.related__card h3,.related__card h4{margin:.55rem 0 .4rem}
.practice h3,.practice h4{margin-bottom:.4rem}
.step-block__aside h3,.step-block__aside h4{margin-bottom:.75rem}
.feature-row h3,.feature-row h4{margin-bottom:.35rem}
.compare__col h3,.compare__col h4{margin-bottom:1rem;display:flex;align-items:flex-start;gap:.6rem}
.compare__col h3 i,.compare__col h4 i{width:8px;height:8px;border-radius:50%;background:var(--teal);flex:none;display:block;margin-top:.52em}
.compare__col--alt h3 i,.compare__col--alt h4 i{background:var(--clay)}
.notice h3,.notice h4{margin-bottom:.5rem;margin-top:0}
.card h3,.card h4{margin-bottom:.55rem;margin-top:0}
/* Legal pages keep the document-style hierarchy */
.legal h3{font-size:clamp(1.12rem,1.05rem + .38vw,1.3rem)}
.notice .legal-h,.notice h3.legal-h{font-size:1.15rem}

/* ---------- 17. Responsive ---------- */
@media (max-width:1180px){
  .nav-link,.drop-toggle{font-size:.83rem;padding-inline:.55rem}
  .nav-phone{display:none}
}
@media (max-width:1040px){
  :root{--header-h:70px}
  /* backdrop-filter would make the header a containing block for the
     position:fixed drawer, collapsing it — so it is dropped on small screens. */
  .site-header{
    backdrop-filter:none;-webkit-backdrop-filter:none;background:var(--ivory)
  }
  /* The drawer stays inside the viewport at all times (an off-screen panel
     would widen the document and create horizontal scrolling on phones). */
  .nav-list-wrap{
    position:fixed;inset:var(--header-h) 0 0;background:var(--ivory);
    padding:1.5rem var(--gutter) 2.5rem;overflow-y:auto;overscroll-behavior:contain;
    z-index:99;display:flex;flex-direction:column;justify-content:flex-start;gap:1.25rem;
    opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-10px);
    transition:opacity .35s var(--ease),transform .4s var(--ease),visibility .4s;
  }
  body.nav-open .nav-list-wrap{opacity:1;visibility:visible;pointer-events:auto;transform:none}
  body.nav-open{overflow:hidden}
  .nav-list{flex-direction:column;align-items:stretch;gap:0;width:100%}
  .nav-list>li{border-bottom:1px solid var(--line)}
  .nav-link,.drop-toggle{
    padding:1.02rem .25rem;font-size:1.05rem;width:100%;border-radius:0;
    font-family:var(--font-display);font-weight:500;color:var(--ink);letter-spacing:-.01em
  }
  .drop-toggle{justify-content:space-between}
  .nav-link::after{display:none}
  .nav-link[aria-current="page"]{color:var(--clay)}
  .drop-menu{
    position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;
    border:0;border-left:2px solid var(--line);border-radius:0;padding:0 0 0 .95rem;
    margin:0 0 .5rem;min-width:0;max-height:0;overflow:hidden;transition:max-height .45s var(--ease),padding .3s
  }
  .has-drop.is-open .drop-menu{max-height:560px;padding-bottom:.85rem}
  .drop-menu a{padding:.62rem .3rem}
  .nav-cta{width:100%;flex-direction:column;align-items:stretch;gap:.75rem}
  .nav-cta .btn{width:100%;min-height:52px;font-size:.95rem}
  .nav-phone{display:inline-flex;justify-content:center;font-size:1rem;padding:.5rem}
  .nav-toggle{display:grid}
  .site-header .nav-bar>.nav-cta{display:none}
  .nav-list-wrap .nav-cta{display:flex;margin-top:1rem}
}
@media (max-width:980px){
  .hero-home__grid{grid-template-columns:1fr;gap:2.5rem}
  .hero-home__media{max-width:560px;width:100%}
  .hero-home__badge{left:auto;right:14px;bottom:-18px}
  .split,.split--wide-left,.split--wide-right,.cycle,.page-hero--split .page-hero__grid{grid-template-columns:1fr;gap:2.25rem}
  .split__media{order:-1}
  .split--media-last .split__media{order:0}
  .grid-4{grid-template-columns:repeat(2,1fr)}
  .grid-3{grid-template-columns:repeat(2,1fr)}
  .asym>*,.asym>.asym--wide{grid-column:span 3}
  .footer-top{grid-template-columns:1fr 1fr;gap:2.25rem}
  .related{grid-template-columns:1fr 1fr}
  .stat-band{grid-template-columns:repeat(2,1fr)}
  .cycle__stage{max-width:440px}
  .compare{grid-template-columns:1fr}
}
@media (max-width:720px){
  .grid-2,.grid-3,.grid-4{grid-template-columns:1fr}
  .asym>*,.asym>.asym--wide,.asym>.asym--full{grid-column:span 6}
  .form-grid{grid-template-columns:1fr}
  .related{grid-template-columns:1fr}
  .toc ol{columns:1}
  .offset-media{padding:0 0 2.25rem 2rem}
  .timeline__item{padding-left:4.15rem}
  .timeline__num{width:48px;height:48px;font-size:.87rem}
  .timeline::before{left:23px}
  .footer-bottom{flex-direction:column;align-items:flex-start;gap:.9rem}
  .hero-home__badge{position:static;margin-top:1.15rem;width:100%;justify-content:center}
  .btn-row{flex-direction:column;align-items:stretch}
  .btn-row .btn{width:100%}
  .cycle__stage{max-width:340px}
  .cycle__node{font-size:.66rem;padding:.38rem .62rem}
  .cycle__center{width:40%}
}
/* Small screens: the circular cycle becomes a wrapped set of stage chips so no
   label can overflow the viewport, with the explanation panel below it. */
@media (max-width:600px){
  .cycle__stage{
    aspect-ratio:auto;max-width:100%;display:flex;flex-wrap:wrap;
    gap:.5rem;justify-content:center;margin-bottom:.5rem
  }
  .cycle__ring,.cycle__center{display:none}
  .cycle__node{
    position:static !important;left:auto !important;top:auto !important;
    transform:none !important;font-size:.8rem;padding:.55rem 1rem
  }
  .cycle__panel{min-height:0}
}

@media (max-width:420px){
  :root{--gutter:1.05rem}
  .brand__sub{display:none}
  .cycle__node{font-size:.76rem;padding:.5rem .85rem}
  .acc__inner{padding-left:0;padding-right:.5rem}
  .acc__btn{padding-right:2.4rem}
  .hero-home__badge{flex-direction:column;gap:.75rem}
  .hero-home__badge i{width:34px;height:1px}
}

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

@media print{
  .site-header,.site-footer,.cta-band,.nav-toggle{display:none}
  body{background:#fff;color:#000}
}