/* ============================================================
   Spira & Sage — brand tokens from Figma (MEoOI60UwN8sYvdSUbm6eV)
   ============================================================ */
:root{
  color-scheme: light;

  /* Pigments & Elements */
  --forest:#1F3A2F;        /* Deep Forest — primary text & brand base */
  --sage:#8EAE90;          /* Morning Sage — secondary text & soft highlights */
  --oat:#EDE3D3;           /* Warm Oat — warm accent & highlights */
  --lichen:#A9A78E;        /* Lichen — support / secondary accent */
  --haze:#E0DBDD;          /* Haze — dividers, borders, subtle fills */
  --parchment:#FAF8F5;     /* Parchment White — card canvas */
  --ground:#F6F3EE;        /* page ground */
  --ink:#2A3028;           /* body copy */
  --moss:#557A5B;          /* muted green — meta labels */

  --ink-60:rgba(42,48,40,.72);
  --ink-45:rgba(42,48,40,.58);

  /* Type */
  --display:"Cormorant Garamond", "Iowan Old Style", Georgia, serif;
  --body:"Figtree", "Helvetica Neue", Arial, sans-serif;
  --mono:"IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  /* Rhythm */
  --gut: clamp(20px, 5.2vw, 80px);
  --max: 1280px;
  --r-sm:4px; --r:6px; --r-md:8px;
  --hair:1px solid var(--haze);

  /* Section rhythm — four steps, chosen by section rank, never by content
     length. 1: a section attached to the one above it. 2: a section inside
     a group. 3: a top-level section or a group boundary. 4: the separation
     between narrative groups and before the closing call. */
  --sp-1:24px; --sp-2:40px; --sp-3:64px; --sp-4:96px;

  /* Photography — one bounded width for the 4:5 half-column portrait. */
  --portrait-w:320px;
}
@media(max-width:860px){:root{--sp-1:20px;--sp-2:32px;--sp-3:48px;--sp-4:68px}}
@media(max-width:560px){:root{--sp-1:16px;--sp-2:26px;--sp-3:38px;--sp-4:52px}}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--ground);
  color:var(--ink);
  font-family:var(--body);
  font-size:16px;
  font-weight:400;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%}
a{color:inherit}
::selection{background:var(--oat);color:var(--forest)}

/* ---------- typography ---------- */
h1,h2,h3,h4{font-family:var(--display);color:var(--forest);font-weight:500;margin:0;text-wrap:balance}
h1{font-size:clamp(38px,5.6vw,72px);line-height:1.02;letter-spacing:-.005em}
h2{font-size:clamp(28px,3.6vw,44px);line-height:1.14}
h3{font-size:clamp(21px,2.1vw,27px);line-height:1.24}
h4{font-size:19px;line-height:1.3}
p{margin:0}
.lede{font-size:clamp(17px,1.45vw,19.5px);line-height:1.62;color:var(--ink-60);max-width:62ch}
.body-w{max-width:64ch}

.eyebrow{
  font-family:var(--mono);font-size:11.5px;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--lichen);
  display:flex;align-items:center;gap:14px;margin:0 0 22px;
}
.eyebrow::before{content:"";width:32px;height:1px;background:var(--lichen);flex:none}
.eyebrow.plain::before{display:none}

.mono-label{
  font-family:var(--mono);font-size:11px;font-weight:600;
  letter-spacing:.15em;text-transform:uppercase;color:var(--lichen);
}

/* ---------- layout ---------- */
.wrap{max-width:var(--max);margin:0 auto;padding-inline:var(--gut)}
section{padding-block:var(--sp-3)}
.rule{height:1px;background:var(--haze);border:0;margin:0}
.stack{display:flex;flex-direction:column}
.g-8{gap:8px}.g-12{gap:12px}.g-16{gap:16px}.g-20{gap:20px}.g-24{gap:24px}.g-32{gap:32px}.g-40{gap:40px}

.two-col{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:start}
.two-col.tight{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}
.sec-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(20px,3vw,48px);align-items:end;margin-bottom:clamp(24px,2.6vw,36px)}
@media(max-width:860px){
  .two-col,.two-col.tight,.sec-head{grid-template-columns:1fr}
}

/* ---------- header ---------- */
.site-head{
  position:sticky;top:0;z-index:60;
  background:rgba(246,243,238,.92);
  backdrop-filter:saturate(1.1) blur(10px);
  border-bottom:var(--hair);
}
.head-in{max-width:var(--max);margin:0 auto;padding:0 var(--gut);
  height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.lockup{display:flex;align-items:center;gap:12px;text-decoration:none;flex:none}
.lockup .mark{width:16px;height:16px;border-radius:50%;background:var(--lichen);flex:none;transition:background .3s}
.lockup:hover .mark{background:var(--sage)}
.lockup .word{font-family:var(--display);font-weight:600;font-size:20px;color:var(--forest);line-height:1;letter-spacing:.005em}

.head-actions{display:flex;align-items:center;gap:12px;flex:none}
.nav{display:flex;align-items:center;justify-content:center;gap:clamp(14px,1.8vw,28px)}
.nav a{
  display:inline-flex;align-items:center;justify-content:center;min-height:44px;line-height:1.2;
  font-size:13.5px;font-weight:500;color:var(--ink-60);text-decoration:none;
  padding:6px 0;position:relative;white-space:nowrap;transition:color .25s;
}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--forest);transform:scaleX(0);transform-origin:left;transition:transform .3s}
.nav a:hover{color:var(--forest)}
.nav a:hover::after,.nav a.on::after{transform:scaleX(1)}
.nav a.on{color:var(--forest)}
.nav a.discreet{font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--lichen)}
.nav a.discreet:hover{color:var(--moss)}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-family:var(--body);font-size:13.5px;font-weight:600;letter-spacing:.02em;
  padding:12px 22px;border-radius:100px;border:1px solid var(--forest);
  background:var(--forest);color:var(--ground);text-decoration:none;cursor:pointer;
  transition:background .28s,color .28s,border-color .28s;white-space:normal;
  max-width:100%;text-align:center;overflow-wrap:anywhere;
}
.btn:hover{background:#16291F;border-color:#16291F}
.btn.ghost{background:transparent;color:var(--forest);border-color:var(--haze)}
.btn.ghost:hover{border-color:var(--forest);background:transparent}
.btn.lg{padding:15px 30px;font-size:14.5px}
.btn.sm{padding:9px 16px;font-size:12.5px}

.burger{display:none;width:40px;height:40px;border:1px solid var(--haze);border-radius:100px;background:transparent;cursor:pointer;align-items:center;justify-content:center;flex-direction:column;gap:4px}
.burger span{display:block;width:15px;height:1px;background:var(--forest);transition:transform .3s,opacity .3s}
.burger.open span:nth-child(1){transform:translateY(2.5px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translateY(-2.5px) rotate(-45deg)}

.mobile-nav{display:none;border-bottom:var(--hair);background:var(--ground)}
.mobile-nav.open{display:block}
.mobile-nav .inner{padding:8px var(--gut) 26px;display:flex;flex-direction:column}
.mobile-nav a{padding:13px 0;text-decoration:none;color:var(--forest);font-family:var(--display);font-size:22px;border-bottom:var(--hair)}
.mobile-nav .btn{margin-top:22px;align-self:flex-start}
@media(max-width:1280px){
  .nav{display:none}
  .burger{display:flex}
  .head-cta{display:none}
}

/* ---------- hero ---------- */
.hero{padding-block:var(--sp-2) var(--sp-3)}
.book-hero .book-intro{max-width:760px;margin-bottom:clamp(22px,3vw,36px)}
.book-hero .book-intro h1{margin-bottom:12px}
.book-hero .book-main{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(24px,4vw,60px);align-items:start}
.book-hero .book-assurance{padding-top:4px}
@media(max-width:860px){.book-hero .book-main{grid-template-columns:1fr}.book-hero .book-assurance{padding-top:0}}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.85fr);gap:clamp(28px,3.6vw,56px);align-items:center}
.hero h1{margin-bottom:20px}
.hero .cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
@media(max-width:920px){.hero-grid{grid-template-columns:1fr}}

/* arch — Figma: radius 240px 240px 16px 16px, 1px forest border */
.arch{
  position:relative;width:100%;aspect-ratio:720/560;
  border:1px solid var(--forest);
  border-radius:min(240px,34vw) min(240px,34vw) 16px 16px;
  overflow:hidden;background:
    radial-gradient(120% 90% at 50% 4%, #FFFDFA 0%, var(--parchment) 42%, var(--oat) 100%);
}
.arch svg{position:absolute;inset:0;width:100%;height:100%}
.arch.sm{aspect-ratio:5/6;border-radius:min(180px,40vw) min(180px,40vw) 12px 12px}

/* ---------- cards ---------- */
.card{
  background:var(--parchment);border:var(--hair);border-radius:var(--r-md);
  padding:clamp(18px,1.9vw,26px);display:flex;flex-direction:column;gap:12px;
}
.grid{display:grid;gap:14px}
.grid.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid.c4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:960px){.grid.c4{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.c3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.grid.c2,.grid.c3,.grid.c4{grid-template-columns:1fr}}

.card .num{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;color:var(--lichen);font-weight:600}
.card p{font-size:15px;color:var(--ink-60)}

/* editorial list rows */
.rows{border-top:var(--hair)}
.row{
  display:grid;grid-template-columns:44px minmax(0,1fr) minmax(0,1.25fr);
  gap:clamp(14px,2.2vw,32px);align-items:baseline;
  padding:15px 0;border-bottom:var(--hair);
}
.row .idx{font-family:var(--mono);font-size:11px;color:var(--lichen);letter-spacing:.1em;font-weight:600}
.row h4{font-family:var(--display);font-size:clamp(19px,1.9vw,23px);font-weight:500;color:var(--forest)}
.row p{font-size:14.5px;color:var(--ink-60)}
@media(max-width:760px){.row{grid-template-columns:32px minmax(0,1fr);}.row p{grid-column:2}}
.rows-compact .row{grid-template-columns:30px minmax(0,1fr);gap:12px 18px;padding:12px 0}
.rows-compact .row p{grid-column:2;font-size:13.5px}
.rows-compact .row h4{font-size:19px}

/* quote */
.quote{
  border:var(--hair);border-radius:var(--r-md);background:var(--parchment);
  padding:clamp(30px,4.4vw,56px);
}
.quote .q{
  font-family:var(--display);font-style:italic;font-weight:500;
  font-size:clamp(23px,2.9vw,34px);line-height:1.32;color:var(--forest);text-wrap:balance;
}
.quote .after{margin-top:22px;font-size:15.5px;color:var(--ink-60);max-width:60ch}

/* dark panel — used sparingly for the private gateway */
.panel-dark{background:var(--forest);color:var(--oat);border-radius:var(--r-md);padding:clamp(32px,4.6vw,64px)}
.panel-dark h2,.panel-dark h3{color:var(--parchment)}
.panel-dark p{color:rgba(237,227,211,.78)}
.panel-dark .mono-label{color:var(--sage)}
.panel-dark .btn{background:transparent;border-color:rgba(237,227,211,.45);color:var(--oat)}
.panel-dark .btn:hover{background:var(--oat);color:var(--forest);border-color:var(--oat)}

/* ---------- footer ---------- */
.site-foot{border-top:var(--hair);background:var(--ground);padding-block:clamp(44px,5.5vw,72px) 30px}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.3fr) repeat(3,minmax(0,.7fr));gap:clamp(26px,4vw,56px)}
.site-foot h4{font-family:var(--display);font-size:23px;font-weight:500}
.foot-col .mono-label{display:block;margin-bottom:16px}
.foot-col a{display:block;font-size:14px;color:var(--ink-60);text-decoration:none;padding:5px 0;transition:color .25s}
.foot-col a:hover{color:var(--forest)}
.foot-base{margin-top:clamp(34px,4vw,56px);padding-top:22px;border-top:var(--hair);
  display:flex;flex-wrap:wrap;gap:16px 32px;justify-content:space-between;align-items:flex-start}
.disclaimer{font-size:12.5px;color:var(--ink-45);max-width:66ch;line-height:1.6}
@media(max-width:860px){.foot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.foot-grid{grid-template-columns:1fr}}

/* ---------- FAQ ---------- */
.faq{border-top:var(--hair)}
.faq details{border-bottom:var(--hair)}
.faq summary{
  list-style:none;cursor:pointer;padding:22px 40px 22px 0;position:relative;
  font-family:var(--display);font-size:clamp(19px,1.9vw,23px);color:var(--forest);font-weight:500;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";position:absolute;right:6px;top:50%;width:11px;height:11px;
  border-right:1px solid var(--lichen);border-bottom:1px solid var(--lichen);
  transform:translateY(-70%) rotate(45deg);transition:transform .3s;
}
.faq details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.faq .ans{padding:0 0 24px;max-width:70ch;color:var(--ink-60);font-size:15.5px}

/* ---------- form ---------- */
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
@media(max-width:700px){.form-grid{grid-template-columns:1fr}}
.field{display:flex;flex-direction:column;gap:7px}
.field.full{grid-column:1/-1}
.field label{font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--moss)}
.field input,.field select,.field textarea{
  font-family:var(--body);font-size:15px;color:var(--ink);
  background:var(--parchment);border:var(--hair);border-radius:var(--r);
  padding:12px 14px;width:100%;transition:border-color .25s,box-shadow .25s;
}
.field textarea{min-height:112px;resize:vertical;line-height:1.6}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-color:var(--sage);box-shadow:0 0 0 3px rgba(142,174,144,.22);
}
.field .hint{font-size:12px;color:var(--ink-45)}
.placeholder-block{
  border:1px dashed var(--lichen);border-radius:var(--r-md);background:transparent;
  padding:clamp(22px,3vw,34px);display:flex;flex-direction:column;gap:10px;
}
.form-note{font-size:13px;color:var(--ink-45);margin-top:6px}
.form-msg{
  margin-top:18px;padding:16px 18px;border-radius:var(--r);
  background:var(--oat);color:var(--forest);font-size:14.5px;display:none;
}
.form-msg.show{display:block}

/* ---------- journal ---------- */
.j-card{
  background:var(--parchment);border:var(--hair);border-radius:var(--r-md);
  padding:26px;display:flex;flex-direction:column;gap:12px;
  text-decoration:none;transition:border-color .3s,transform .3s;
}
.j-card:hover{border-color:var(--sage);transform:translateY(-2px)}
.j-card .top{display:flex;justify-content:space-between;gap:14px;align-items:baseline}
.j-card h4{font-family:var(--display);font-size:21px;line-height:1.25;font-weight:500}
.j-card p{font-size:14.5px;color:var(--ink-60);flex:1}
.j-card .read{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--moss);font-weight:600}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.11em;text-transform:uppercase;font-weight:600;
  color:var(--moss);border:var(--hair);border-radius:100px;padding:7px 14px;background:var(--parchment);
}

/* ---------- misc ---------- */
.kv{display:flex;flex-direction:column;gap:5px;padding:16px 0;border-bottom:var(--hair)}
.kv .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--lichen);font-weight:600}
.kv .v{font-size:15px;color:var(--ink-60)}
.tag-oat{background:var(--oat);border-radius:var(--r);padding:3px 9px;font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--forest);font-weight:600}
.center{text-align:center}
.cta-band{border:var(--hair);border-radius:var(--r-md);background:
  linear-gradient(180deg,var(--parchment) 0%, #F3EFE7 100%);
  padding:clamp(34px,5vw,72px);text-align:center;display:flex;flex-direction:column;align-items:center;gap:20px}
.cta-band h2{max-width:20ch}
.cta-band .cta-row{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:6px}

a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:2px solid var(--sage);outline-offset:3px;border-radius:2px;
}

.fade{opacity:1;animation:rise .6s cubic-bezier(.22,.7,.3,1) both}
@keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
}
/* ---------- photography slots ---------- */
.photo{
  position:relative;overflow:hidden;background:
    linear-gradient(150deg,#F1EDE4 0%, var(--parchment) 45%, var(--oat) 100%);
  border:var(--hair);border-radius:var(--r-md);
  display:flex;align-items:flex-end;min-height:0;
}
.photo.arch{border-radius:min(220px,32vw) min(220px,32vw) 8px 8px;border-color:var(--forest)}
.photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.photo .slot{
  position:relative;z-index:2;width:100%;padding:14px 16px;
  display:flex;justify-content:space-between;gap:10px;align-items:flex-end;
  background:linear-gradient(180deg,rgba(246,243,238,0) 0%, rgba(246,243,238,.86) 70%);
}
.photo .slot .mono-label{color:var(--moss)}
.photo.has-img .slot{background:linear-gradient(180deg,rgba(31,58,47,0) 0%, rgba(31,58,47,.55) 100%)}
.photo.has-img .slot .mono-label{color:var(--oat)}
.photo .art{position:absolute;inset:0;width:100%;height:100%;opacity:.4}
.ratio-4x3{aspect-ratio:4/3}
.ratio-3x2{aspect-ratio:3/2}
.ratio-1x1{aspect-ratio:1/1}
.ratio-arch{aspect-ratio:5/6}
/* The two site-wide photographic ratios: a full-width band and a
   half-column editorial portrait. See "photographic ratios" at the end. */
.ratio-16x9{aspect-ratio:16/9}
.ratio-4x5{aspect-ratio:4/5}

/* ---------- quick book card ---------- */
.quickbook{
  background:var(--parchment);border:1px solid var(--haze);border-radius:var(--r-md);
  padding:clamp(20px,2.2vw,30px);display:flex;flex-direction:column;gap:14px;
  box-shadow:0 1px 0 rgba(31,58,47,.04), 0 18px 40px -34px rgba(31,58,47,.5);
}
.quickbook .qb-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.quickbook h3{font-size:25px}
.quickbook .qb-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.quickbook .field.full,.quickbook .qb-grid .field.full{grid-column:1/-1}
.quickbook input,.quickbook select,.quickbook textarea{padding:10px 12px;font-size:14.5px}
.quickbook textarea{min-height:74px}
@media(max-width:520px){.quickbook .qb-grid{grid-template-columns:1fr}}

/* ---------- carousel ---------- */
.carousel{position:relative}
.carousel-track{
  display:grid;grid-auto-flow:column;grid-auto-columns:minmax(302px,32.2%);
  gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;
  scroll-behavior:smooth;padding-bottom:6px;
  scrollbar-width:thin;scrollbar-color:var(--haze) transparent;
}
.carousel-track > *{scroll-snap-align:start}
.carousel-track::-webkit-scrollbar{height:6px}
.carousel-track::-webkit-scrollbar-thumb{background:var(--haze);border-radius:100px}
.carousel-track::-webkit-scrollbar-track{background:transparent}
@media(max-width:760px){.carousel-track{grid-auto-columns:minmax(258px,84%)}}
.carousel-ctrl{display:flex;align-items:center;gap:10px}
.c-btn{
  width:38px;height:38px;border-radius:50%;border:1px solid var(--haze);background:var(--parchment);
  display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:border-color .25s,background .25s;
}
.c-btn:hover{border-color:var(--forest)}
.c-btn:disabled{opacity:.35;cursor:default;border-color:var(--haze)}
.c-btn svg{width:14px;height:14px}
.c-dots{display:flex;gap:6px;margin-left:4px}
.c-dot{width:6px;height:6px;border-radius:50%;background:var(--haze);border:0;padding:0;cursor:pointer;transition:background .25s,width .25s}
.c-dot.on{background:var(--forest);width:18px;border-radius:100px}

/* ---------- gate ---------- */
[hidden]{display:none!important}
.gate{
  position:fixed;inset:0;z-index:200;background:var(--ground);
  display:flex;align-items:center;justify-content:center;padding:24px;
}
.gate[hidden]{display:none!important}
.gate-inner{
  width:100%;max-width:404px;background:var(--parchment);border:var(--hair);
  border-radius:var(--r-md);padding:clamp(26px,3.4vw,40px);display:flex;flex-direction:column;gap:16px;
  box-shadow:0 30px 70px -50px rgba(31,58,47,.7);
}
.gate .lock{display:flex;align-items:center;gap:12px;margin-bottom:2px}
.gate .lock .mark{width:16px;height:16px;border-radius:50%;background:var(--lichen)}
.gate .lock .word{font-family:var(--display);font-weight:600;font-size:20px;color:var(--forest)}
.gate .gate-h1{font-family:var(--display);font-weight:500;color:var(--forest);font-size:30px;line-height:1.15;margin:0}
.gate .err{color:#8A3A2E;font-size:13.5px;display:none}
.gate .err.show{display:block}
.gate .note{font-size:12px;color:var(--ink-45);line-height:1.55;border-top:var(--hair);padding-top:14px}
body.locked{overflow:hidden}
body:has(.env-flag){padding-bottom:34px}
.env-flag{
  position:fixed;left:0;right:0;bottom:0;z-index:80;
  background:var(--forest);color:var(--oat);
  font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;
  padding:7px 16px;display:flex;justify-content:center;gap:18px;align-items:center;flex-wrap:wrap;
}
.env-flag button{background:transparent;border:1px solid rgba(237,227,211,.4);color:var(--oat);
  font-family:var(--mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;
  padding:3px 10px;border-radius:100px;cursor:pointer}
.env-flag button:hover{background:rgba(237,227,211,.14)}

/* ============================================================
   Multipage additions
   ============================================================ */
.skip{position:absolute;left:-9999px;top:0;background:var(--forest);color:var(--oat);padding:10px 16px;z-index:300;border-radius:0 0 6px 0}
.skip:focus{left:0}

/* breadcrumb */
.crumbs{font-family:var(--mono);font-size:10.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--lichen);
  display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding-top:18px}
.crumbs a{text-decoration:none;color:var(--lichen)}
.crumbs a:hover{color:var(--forest)}
.crumbs span[aria-current]{color:var(--moss)}

/* language switch */
.langs{display:flex;gap:2px;align-items:center;border:var(--hair);border-radius:100px;padding:3px;background:var(--parchment)}
.langs a{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  text-decoration:none;color:var(--ink-45);padding:5px 9px;border-radius:100px;line-height:1}
.langs a.on{background:var(--forest);color:var(--oat)}
.langs a:hover:not(.on){color:var(--forest)}

/* AEO direct-answer block */
.answer{
  border-left:2px solid var(--sage);background:var(--parchment);
  border-radius:0 var(--r-md) var(--r-md) 0;padding:clamp(20px,2.4vw,30px);
  display:flex;flex-direction:column;gap:10px;max-width:74ch;
}
.answer .q{font-family:var(--display);font-size:clamp(20px,2.1vw,25px);color:var(--forest);font-weight:500;line-height:1.25}
.answer .a{font-size:16.5px;line-height:1.6;color:var(--ink)}

/* pricing */
.price-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
@media(max-width:900px){.price-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.price-grid{grid-template-columns:1fr}}
.price{background:var(--parchment);border:var(--hair);border-radius:var(--r-md);padding:24px;display:flex;flex-direction:column;gap:12px}
.price.feature{border-color:var(--sage);box-shadow:0 18px 40px -36px rgba(31,58,47,.55)}
.price .amt{font-family:var(--display);font-size:38px;line-height:1;color:var(--forest);font-variant-numeric:tabular-nums}
.price .amt small{font-family:var(--body);font-size:13px;color:var(--ink-45);font-weight:500;letter-spacing:.02em}
.price ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.price li{font-size:14px;color:var(--ink-60);padding-left:18px;position:relative;line-height:1.5}
.price li::before{content:"";position:absolute;left:0;top:8px;width:6px;height:6px;border-radius:50%;background:var(--sage)}

/* article */
.article{max-width:72ch;margin:0 auto}
.article h2{font-size:clamp(24px,2.7vw,33px);margin-top:44px;margin-bottom:14px}
.article p{font-size:17px;line-height:1.72;color:var(--ink);margin-bottom:18px}
.article ul,.article ol{margin:0 0 20px;padding-left:22px;display:flex;flex-direction:column;gap:9px}
.article li{font-size:16.5px;line-height:1.65;color:var(--ink-60)}
.article .pull{border-left:2px solid var(--lichen);padding:4px 0 4px 20px;margin:26px 0;
  font-family:var(--display);font-style:italic;font-size:clamp(20px,2.2vw,25px);line-height:1.34;color:var(--forest)}
.article-meta{display:flex;flex-wrap:wrap;gap:10px 22px;align-items:center;padding-bottom:22px;border-bottom:var(--hair);margin-bottom:30px}
.takeaways{background:var(--oat);border-radius:var(--r-md);padding:26px;margin:32px 0}
.takeaways h3{font-size:19px;margin-bottom:12px}
.takeaways ul{margin:0;padding-left:20px}
.takeaways li{color:var(--forest);font-size:15.5px}

/* community */
.tier-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
@media(max-width:760px){.tier-grid{grid-template-columns:1fr}}
.lib-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
@media(max-width:960px){.lib-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.lib-grid{grid-template-columns:1fr}}
.lib{background:var(--parchment);border:var(--hair);border-radius:var(--r-md);padding:22px;
  display:flex;flex-direction:column;gap:10px;text-decoration:none;position:relative;transition:border-color .3s,transform .3s}
.lib:hover{border-color:var(--sage);transform:translateY(-2px)}
.lib h3{font-size:20px;line-height:1.28}
.lib p{font-size:14px;color:var(--ink-60);flex:1}
.lib .top{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.lock-tag{font-family:var(--mono);font-size:9.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:var(--moss);border:1px solid var(--haze);border-radius:100px;padding:4px 9px;background:var(--ground)}
.lock-tag.free{background:var(--sage);color:var(--forest);border-color:transparent}
.lib.locked h3,.lib.locked p{opacity:.62}
.practice-box{border:var(--hair);border-radius:var(--r-md);background:var(--parchment);padding:24px;display:flex;flex-direction:column;gap:14px;margin:28px 0}
.practice-box ol{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:8px}
.practice-box li{font-size:15.5px;color:var(--ink)}

/* diagram figure */
.dia{border:var(--hair);border-radius:var(--r-md);background:var(--parchment);padding:clamp(20px,2.6vw,34px);margin:0}
.dia svg{width:100%;height:auto;display:block}
.dia figcaption{display:flex;justify-content:space-between;gap:14px;border-top:var(--hair);margin-top:20px;padding-top:14px;flex-wrap:wrap}

/* table */
.tbl-wrap{overflow-x:auto;border:var(--hair);border-radius:var(--r-md);background:var(--parchment)}
table{border-collapse:collapse;width:100%;min-width:520px}
th,td{text-align:left;padding:14px 18px;border-bottom:var(--hair);font-size:14.5px;vertical-align:top}
th{font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--moss)}
td{color:var(--ink-60)}
tr:last-child td{border-bottom:0}

/* ---------- Devanagari adjustments ----------
   IBM Plex Mono has no Devanagari coverage and letter-spacing breaks
   conjunct glyphs, so Hindi drops the mono label treatment.           */
html[lang="hi-IN"] .eyebrow,
html[lang="hi-IN"] .mono-label,
html[lang="hi-IN"] .card .num,
html[lang="hi-IN"] .row .idx,
html[lang="hi-IN"] .chip,
html[lang="hi-IN"] .lock-tag,
html[lang="hi-IN"] .crumbs,
html[lang="hi-IN"] .field label,
html[lang="hi-IN"] .kv .k,
html[lang="hi-IN"] th,
html[lang="hi-IN"] .price .amt small,
html[lang="hi-IN"] .langs a{
  font-family:var(--body);
  letter-spacing:.02em;
  text-transform:none;
}
html[lang="hi-IN"] .eyebrow,
html[lang="hi-IN"] .mono-label{font-size:12.5px}
html[lang="hi-IN"] h1{line-height:1.22}
html[lang="hi-IN"] h2{line-height:1.3}
html[lang="hi-IN"] h3,html[lang="hi-IN"] h4{line-height:1.38}
html[lang="hi-IN"] .article p{line-height:1.85}
html[lang="hi-IN"] body{line-height:1.78}

/* ============================================================
   PREMIUM PASS
   Same brand tokens — nothing here invents a colour or a face.
   What changes is craft: type weight and tracking, how surfaces
   are separated, button language, paper texture, and motion.
   ============================================================ */

/* ---------- paper ----------
   A real press sheet is never a flat colour field. This is the
   single biggest reason a screen reads "printed" rather than "rendered". */
body::before{
  content:"";position:fixed;inset:0;z-index:1;pointer-events:none;
  opacity:.055;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='.82' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
}
.site-head,.gate,.env-flag,.preview-note{z-index:60}

/* ---------- typography ----------
   Cormorant is a display face with a high contrast axis: at large
   sizes it wants LIGHT weight and NEGATIVE tracking. At 500 with
   default tracking it reads soft and undesigned. */
h1,h2,h3,h4{
  font-feature-settings:"kern" 1,"liga" 1,"dlig" 1,"calt" 1;
  font-variant-ligatures:common-ligatures discretionary-ligatures;
}
h1{font-weight:300;font-size:clamp(40px,6.2vw,86px);line-height:.97;letter-spacing:-.024em}
h2{font-weight:300;font-size:clamp(29px,4vw,50px);line-height:1.08;letter-spacing:-.018em}
h3{font-weight:400;font-size:clamp(21px,2.1vw,27px);line-height:1.2;letter-spacing:-.008em}
h4{font-weight:400;letter-spacing:-.005em}

body{font-size:16.5px;line-height:1.7;letter-spacing:.001em}
.lede{
  font-size:clamp(17.5px,1.55vw,21px);line-height:1.58;font-weight:300;
  color:var(--ink-60);letter-spacing:.002em;max-width:60ch;
}
p{text-wrap:pretty}

.eyebrow{
  font-size:10.5px;letter-spacing:.24em;gap:16px;margin-bottom:26px;color:var(--lichen);
}
.eyebrow::before{width:26px;opacity:.7}
.mono-label{font-size:10px;letter-spacing:.2em}

/* prices and figures set like a rate card, not a pricing page */
.price .amt,.hero .grid.c3 p:first-child{
  font-variant-numeric:lining-nums tabular-nums;font-weight:300;letter-spacing:-.02em;
}

/* ---------- buttons ----------
   Pills read software. An editorial brand sets its calls to action
   as small-caps rules — closer to a letterpress card. */
.btn{
  border-radius:2px;padding:15px 28px;
  font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  transition:background .4s cubic-bezier(.2,.7,.3,1),color .4s,border-color .4s,transform .4s;
}
.btn.lg{padding:18px 34px;font-size:11.5px}
.btn.sm{padding:11px 18px;font-size:10px;letter-spacing:.14em}
.btn.ghost{border-color:rgba(31,58,47,.28);color:var(--forest)}
.btn.ghost:hover{border-color:var(--forest);background:rgba(31,58,47,.04)}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.cta-row{gap:14px}

/* ---------- surfaces ----------
   Card soup is the clearest tell. A grid of cards that SHARE
   hairlines reads as a considered table; a grid of floating boxes
   reads as a template. */
.grid.c2,.grid.c3,.grid.c4{
  gap:1px;background:var(--haze);border:1px solid var(--haze);border-radius:2px;overflow:hidden;
}
.grid.c2 > .card,.grid.c3 > .card,.grid.c4 > .card,
.grid.c2 > article,.grid.c3 > article,.grid.c4 > article{
  background:var(--ground);border:0;border-radius:0;
  padding:clamp(24px,2.4vw,34px);
  transition:background .5s cubic-bezier(.2,.7,.3,1);
}
.grid.c2 > .card:hover,.grid.c3 > .card:hover,.grid.c4 > .card:hover,
.grid.c2 > article:hover,.grid.c3 > article:hover,.grid.c4 > article:hover{
  background:var(--parchment);
}
.card .num{letter-spacing:.18em;font-size:10px}
.card h3{margin-top:2px}

/* the quote stops being a box and becomes a page */
.quote{
  border:0;background:transparent;border-top:1px solid var(--haze);border-bottom:1px solid var(--haze);
  border-radius:0;padding:clamp(40px,6vw,80px) 0;text-align:center;
}
.quote .q{font-weight:300;font-size:clamp(26px,3.6vw,46px);line-height:1.22;max-width:19ch;margin:0 auto}
.quote .after{margin:26px auto 0;text-align:center;max-width:56ch}

/* the closing call to action, likewise */
.cta-band{
  background:transparent;border:0;border-top:1px solid var(--haze);border-radius:0;
  padding:clamp(48px,7vw,104px) 0 clamp(36px,5vw,64px);
}
.cta-band h2{max-width:17ch}

/* the direct-answer block: a marginal note, not a callout box */
.answer{
  background:transparent;border-left:1px solid var(--sage);border-radius:0;
  padding:4px 0 4px clamp(20px,2.4vw,32px);
}
.answer .q{font-weight:300;letter-spacing:-.012em}
.answer .a{font-size:17px;line-height:1.66;color:var(--ink-60)}

/* ---------- editorial rows ---------- */
.row{padding:20px 0;transition:background .45s}
.rows .row:first-child{border-top:0}
.row h4{font-weight:400;font-size:clamp(20px,2vw,25px);letter-spacing:-.01em}
.row .idx{letter-spacing:.18em;font-size:10px;opacity:.85}

/* ---------- photography ---------- */
.photo{border:0;border-radius:2px;overflow:hidden;background:var(--oat)}
.photo img{transition:transform 1.1s cubic-bezier(.16,.8,.28,1);will-change:transform}
.photo:hover img{transform:scale(1.035)}
.photo.arch{border:0;border-radius:min(240px,34vw) min(240px,34vw) 2px 2px}
.photo .slot{display:none}

/* ---------- header ----------
   Hairline only once the page has moved. At rest the header should
   float on the sheet, not sit in a tray. */
.site-head{border-bottom:1px solid transparent;background:rgba(246,243,238,.72);transition:background .5s,border-color .5s}
.site-head.scrolled{border-bottom-color:var(--haze);background:rgba(246,243,238,.94)}
.head-in{height:82px}
.nav a{font-size:12px;letter-spacing:.04em;font-weight:500}
.nav a.discreet{font-size:9.5px;letter-spacing:.2em}
.lockup .word{font-size:21px;font-weight:500;letter-spacing:.012em}
.lockup .mark{width:13px;height:13px}
.langs a{font-size:9.5px;letter-spacing:.14em}

/* ---------- article ---------- */
.article p{font-size:17.5px;line-height:1.78;letter-spacing:.002em}
.article h2{font-weight:300;margin-top:52px;letter-spacing:-.016em}
/* a drop cap on the opening paragraph — old typographic manners */
.article > h2:first-of-type + p::first-letter{
  float:left;font-family:var(--display);font-weight:300;font-size:4.05em;
  line-height:.82;padding:.06em .1em 0 0;color:var(--forest);
}
.article .pull{border-left:0;padding:0;margin:40px 0;text-align:center;font-weight:300;
  font-size:clamp(23px,2.7vw,33px);line-height:1.26;letter-spacing:-.014em}
.takeaways{background:transparent;border-top:1px solid var(--haze);border-bottom:1px solid var(--haze);
  border-radius:0;padding:30px 0}

/* ---------- pricing ---------- */
.price{background:var(--ground);border-color:var(--haze);border-radius:2px;padding:30px}
.price.feature{background:var(--parchment);border-color:var(--sage)}
.price .amt{font-size:44px}

/* ---------- forms ---------- */
.quickbook{border-radius:2px;box-shadow:none;border-color:var(--haze);background:var(--parchment)}
.field input,.field select,.field textarea{border-radius:2px;background:transparent;border-color:rgba(31,58,47,.18)}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--forest);box-shadow:none;background:var(--parchment)}
.field label{letter-spacing:.18em;font-size:10px}

/* ---------- library & journal ---------- */
.lib,.j-card{border-radius:2px;background:var(--parchment);transition:background .5s,border-color .5s,transform .5s cubic-bezier(.2,.7,.3,1)}
.lib:hover,.j-card:hover{transform:translateY(-3px);border-color:var(--sage)}
.j-card h3,.j-card h4{font-weight:400}

/* ---------- carousel ---------- */
.carousel-track{gap:1px;background:var(--haze);border:1px solid var(--haze);border-radius:2px}
.carousel-track > *{border-radius:0!important;border:0!important;background:var(--ground)}
.c-btn{border-radius:2px;width:42px;height:42px}

/* ---------- chips, tags ---------- */
.chip{border-radius:2px;letter-spacing:.16em;font-size:10px;padding:8px 14px;background:transparent}
.lock-tag{border-radius:2px;letter-spacing:.16em}
.tag-oat{border-radius:2px}

/* ---------- footer ---------- */
.site-foot{padding-block:clamp(64px,8vw,110px) 34px}
.site-foot h4,.site-foot .foot-col span{letter-spacing:.2em}
.foot-col a{font-size:13.5px;letter-spacing:.005em}

/* ---------- motion ----------
   Sections settle in rather than appear. Nothing is hidden at rest:
   the class is added by script, so with JS off everything is visible. */
.js [data-reveal]{opacity:0;transform:translateY(16px)}
.js [data-reveal].in{
  opacity:1;transform:none;
  transition:opacity .9s cubic-bezier(.22,.7,.28,1),transform .9s cubic-bezier(.22,.7,.28,1);
}
.js [data-reveal].in [data-stagger]{animation:settle .8s cubic-bezier(.22,.7,.28,1) both}
@keyframes settle{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

@media(prefers-reduced-motion:reduce){
  .js [data-reveal],.js [data-reveal].in,.js [data-reveal].in [data-stagger]{
    opacity:1!important;transform:none!important;animation:none!important;transition:none!important;
  }
  .photo img{transition:none}
}

/* hero figures — a rate line, not a card grid */
.hero-stats{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(16px,3vw,44px);margin-top:34px;padding-top:22px;
  border-top:1px solid var(--haze);background:transparent;border-radius:0;
}
.hero-stats .fig{
  font-family:var(--display);font-weight:300;font-size:clamp(24px,2.5vw,32px);
  line-height:1;color:var(--forest);letter-spacing:-.02em;
  font-variant-numeric:lining-nums tabular-nums;
}
.hero-stats .cap{
  font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--lichen);margin-top:9px;line-height:1.5;
}
@media(max-width:560px){.hero-stats{grid-template-columns:1fr;gap:14px}}

/* Keep every service-choice card aligned, including captions and actions. */
.carousel-track{
  grid-auto-columns:calc(100% / 3);
  column-gap:0;padding-bottom:0;
  grid-template-rows:auto auto auto auto auto auto;
  row-gap:0;
}
.carousel-track > .card{
  min-width:0;
  display:grid;
  grid-row:span 6;
  grid-template-rows:subgrid;
}
.carousel-track > .card + .card{border-inline-start:1px solid var(--haze)!important}
.carousel-track > .card > .dia{
  min-width:0;
  display:grid;
  grid-row:span 2;
  grid-template-rows:subgrid;
  border:0;
  border-radius:0;
}
.carousel-track > .card > .dia > svg{
  width:100%;
  height:220px;
  align-self:center;
}
.carousel-track > .card > .dia > figcaption{
  align-content:start;
  overflow-wrap:anywhere;
}
.carousel-track > .card > div{
  min-width:0;
  display:grid!important;
  grid-row:span 4;
  grid-template-rows:subgrid;
}
.carousel-track > .card > div > .btn{
  align-self:end!important;
  justify-self:start;
}
@media(max-width:960px){
  .carousel-track{grid-auto-columns:50%}
}
@media(max-width:640px){
  .carousel-track{grid-auto-columns:100%}
}

/* Approved sage-ampersand artwork: display the original wordmark region.
   Source pixels stay unchanged; the presentation study is outside this viewport. */
.brand-art{display:block;position:relative;width:186px;aspect-ratio:1120 / 400;overflow:hidden;mix-blend-mode:multiply;flex:none}
.brand-art img{filter:brightness(1.06);position:absolute;width:158.392857%;max-width:none;height:auto;left:-5.803571%;top:-25%;display:block}
.footer-brand{display:inline-block;margin-bottom:16px;text-decoration:none}
.footer-brand .brand-art{width:260px;max-width:100%}
@media(max-width:640px){.head-in{gap:10px}.lockup .brand-art{width:150px}}
@media(max-width:360px){.lockup .brand-art{width:120px}.head-in{gap:8px}}

@media(min-width:1281px){.head-in{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:18px}.site-head .nav{gap:clamp(10px,1.2vw,18px)}}

.site-head,.site-head.scrolled{background:var(--ground)}

/* One reading flow: eyebrow, heading, explanation, then any local action. */
.editorial-layout{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.8fr);align-items:center;gap:clamp(28px,5vw,72px)}
.editorial-text{max-width:860px}
.editorial-copy h2{font-size:clamp(30px,3.3vw,44px);margin-bottom:24px;max-width:30ch}
.editorial-copy .eyebrow,.diagram-copy .eyebrow{margin-bottom:22px}
.editorial-copy .stack{max-width:62ch;color:var(--ink-60);font-size:17px;line-height:1.7}
.editorial-copy .lede{font-size:17px;line-height:1.7}
.editorial-layout .dia{max-width:400px;margin-inline:auto}
.editorial-layout .dia svg{max-height:300px}
.page-closing{padding-block:var(--sp-3) var(--sp-4)}
.page-closing .cta-band h2{font-size:clamp(32px,4vw,50px);line-height:1.15}
[id]{scroll-margin-top:110px}
@media(max-width:760px){.editorial-layout{grid-template-columns:minmax(0,1fr);gap:24px}}

/* Explain the illustration at reading scale, rather than full-page scale. */
.diagram-layout{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.8fr);align-items:center;gap:clamp(28px,5vw,72px)}
.diagram-copy h2{font-size:clamp(30px,3.3vw,44px);margin-bottom:24px}
.diagram-copy .stack{max-width:62ch;color:var(--ink-60);font-size:17px;line-height:1.7}
.diagram-layout>.dia{width:100%;max-width:400px;justify-self:center;padding:24px}
.diagram-layout>.dia svg{height:300px;max-width:100%;object-fit:contain}
.diagram-layout>.dia figcaption{gap:8px;margin-top:16px;line-height:1.65}
@media(max-width:760px){
  .diagram-layout{grid-template-columns:minmax(0,1fr);gap:24px}
  .diagram-layout>.dia{max-width:340px;padding:20px}
  .diagram-layout>.dia svg{height:220px}
}

/* Editorial refinement: preserve the full reading experience and page content. */
:root{--ink-60:#596057;--ink-45:#656b60}
body::before{opacity:.025}
h1{font-weight:400;font-size:clamp(38px,4.6vw,64px);line-height:1.06;letter-spacing:-.025em;text-wrap:balance}
h2{font-weight:400;line-height:1.13;text-wrap:balance}
h3{text-wrap:balance}
.lede{font-weight:400;font-size:clamp(17px,1.4vw,19px);line-height:1.7}
.eyebrow,.mono-label,.card .num,.hero-stats .cap{color:#666c54}
.eyebrow{letter-spacing:.18em;line-height:1.65}
.hero-grid{grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:clamp(30px,5vw,76px)}
.hero-grid>div{min-width:0}
.hero-deck{font-family:var(--display);font-size:clamp(23px,2.3vw,30px);line-height:1.25;color:var(--moss);margin:20px 0 16px;max-width:32ch}
.hero .lede{max-width:57ch}
.hero .dia{background:transparent;border:0;padding:clamp(14px,2vw,26px)}
.hero .dia svg{max-height:390px}
.hero .dia figcaption{line-height:1.65;gap:12px}
.practitioner{margin-top:28px;padding-top:20px;border-top:1px solid var(--haze);font-size:15px;line-height:1.6}
.practitioner>p:first-child{font-weight:600;color:var(--forest)}
.practitioner-detail{font-size:13px;color:var(--ink-60);margin-top:3px}
.practitioner a{display:inline-block;margin-top:8px;font-size:13px;text-decoration:underline;text-underline-offset:4px}
.answer{max-width:960px;padding-block:8px;border-left:2px solid var(--sage)}
.answer .q{font-weight:500;font-size:clamp(23px,2.2vw,29px);margin-bottom:12px}
.answer .a{max-width:85ch}
.sec-head{gap:clamp(24px,4vw,64px);margin-bottom:30px}
[data-section="cards"] .grid{background:transparent;gap:20px;border:0;overflow:visible;grid-auto-rows:1fr}
[data-section="cards"] .grid>.card{padding:clamp(24px,2.6vw,36px);border:1px solid var(--haze);background:var(--parchment)}
[data-section="cards"] .card>h3{font-size:clamp(25px,2.3vw,31px);line-height:1.15}
[data-section="cards"] .card>p{font-size:16px;line-height:1.7}
[data-section="cards"] .card>.btn{margin-top:auto!important;padding-top:13px;padding-bottom:13px}
[data-section="cards"] .card>.num{font-size:11px;letter-spacing:.11em;font-weight:500;line-height:1.6}
#meet-dahlia{background:#eeeae2;border-block:1px solid #e0dbd1;margin-block:26px}
#meet-dahlia .two-col{gap:clamp(32px,6vw,88px)}
#meet-dahlia .photo{border-radius:2px}
#meet-dahlia .lede{font-size:17px}
.photo{border-radius:2px}
.photo figcaption{line-height:1.65}
.cta-band{background:var(--forest);color:var(--parchment);border:0;padding:clamp(36px,5vw,72px) clamp(24px,5vw,72px)}
.cta-band h2{color:var(--parchment);max-width:23ch}
.cta-band .lede{color:#e1e7dc}
.cta-band .btn{background:var(--parchment);border-color:var(--parchment);color:var(--forest)}
.cta-band .btn.ghost{background:transparent;border-color:#a8b8a8;color:var(--parchment)}
.cta-band .btn:hover{background:#e5ebdf;color:var(--forest);border-color:#e5ebdf}
.author-link{text-underline-offset:4px}
:focus-visible{outline:2px solid var(--moss);outline-offset:5px}
.cta-band :focus-visible{outline-color:var(--parchment)}
html[lang="hi-IN"] h1{line-height:1.3;font-size:clamp(34px,4vw,54px)}
html[lang="hi-IN"] h2,html[lang="hi-IN"] h3{line-height:1.45}
@media(max-width:920px){.hero-grid{grid-template-columns:1fr}.hero .dia{max-width:520px;margin-inline:auto;width:100%}}
@media(max-width:640px){
  .hero-grid{gap:32px}
  .hero-deck{font-size:25px}
  .hero .dia svg{max-height:300px}
  [data-section="cards"] .grid{gap:14px}
  #meet-dahlia{margin-block:12px}
  .cta-band .cta-row{width:100%}
  .cta-band .btn{width:100%}
}

/* Read at a glance; expand for the complete explanation. */
main>section{padding-block:var(--sp-2)}
.hero h1{font-size:clamp(36px,4.2vw,58px);line-height:1.09}
.key-message{font-size:clamp(18px,1.6vw,21px);line-height:1.55;color:var(--forest);max-width:48ch}
.hero .key-message{margin-top:22px}
/* Disclosure form A: full-width row in its own text column, hairline above, control at the right edge. */
.read-more{margin-top:14px;max-width:none}
.read-more>summary{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;cursor:pointer;font-size:14px;font-weight:500;line-height:1.5;color:var(--forest);list-style:none;border-top:var(--hair);padding-block:12px;min-height:44px}
.read-more>summary .key-message{display:block;max-width:none;margin:0;font-weight:400}
.read-more>summary::-webkit-details-marker{display:none}
.read-more>summary::after{content:"+";font-size:22px;font-weight:400;line-height:1;flex:0 0 28px;display:grid;place-items:center;height:1.35em}
.read-more[open]>summary::after{content:"−"}
.expanded-copy{padding-top:18px}
.expanded-copy .lede{font-size:16px;line-height:1.7}
.read-more>summary:focus-visible{outline:2px solid var(--moss);outline-offset:5px}
.hero .read-more{margin-bottom:20px}
.editorial-copy h2,.diagram-copy h2{font-size:clamp(29px,3vw,40px);margin-bottom:18px;max-width:28ch}
.editorial-copy .eyebrow,.diagram-copy .eyebrow{margin-bottom:16px}
.editorial-layout,.diagram-layout{gap:clamp(24px,4vw,52px);align-items:start}
.editorial-layout .dia svg,.diagram-layout>.dia svg{height:240px;max-height:240px}
.editorial-layout .dia,.diagram-layout>.dia{max-width:350px;padding:20px}
.sec-head:not(.hero-split):not(:has(>.lede)){grid-template-columns:1fr}
.sec-head{margin-bottom:24px}
.sec-head h2{max-width:27ch}
.reading-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,4vw,52px);padding-block:var(--sp-2)}
.reading-pair>section{padding:0;min-width:0}
.reading-pair>section>.wrap{width:100%;max-width:none;padding-inline:0;margin:0}
.reading-pair .editorial-text{max-width:none}
.reading-pair .editorial-copy{height:100%;padding-top:24px;border-top:1px solid var(--haze)}
.reading-pair h2{font-size:clamp(28px,2.8vw,36px)}
.page-closing .cta-band{padding-block:clamp(32px,4vw,52px)}
#meet-dahlia{margin-block:12px}
@media(max-width:760px){
  .reading-pair{grid-template-columns:1fr;gap:30px}
  .editorial-layout .dia svg,.diagram-layout>.dia svg{height:200px}
  .hero .dia svg{max-height:280px}
  .editorial-copy h2,.diagram-copy h2{max-width:100%}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Keep the About introduction and biography together beside the portrait. */
main[data-page="about"] .hero-grid{align-items:center}
.hero-answer{padding:0;margin-top:24px}
.hero-answer>.wrap{width:100%;max-width:none;margin:0;padding:0}
.hero-answer .answer{padding-block:0;padding-left:20px}
.hero-answer .answer .q{font-size:25px;margin-bottom:10px}
.hero-answer .answer .a{font-size:16px;line-height:1.65}
main[data-page="about"] .hero .cta-row{margin-top:24px}

/* Keep the home overview within the same balanced margins as every section. */
main[data-page="home"]>[data-section="answer"] .answer,
main[data-page="home"]>[data-section="answer"] .answer .a{max-width:none}

/* Consultation choices: titles on the front, explanations on the reverse. */
.flip-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:1fr;gap:20px}
.flip-card{min-width:0;perspective:1200px}
.flip-inner{height:100%}
.flip-face{padding:28px;display:flex;flex-direction:column;gap:24px;border:1px solid var(--haze);background:var(--parchment);min-width:0}
.flip-front{min-height:286px;justify-content:space-between}
.flip-front .num{font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:#666c54}
.flip-front h3{font-size:clamp(25px,2.2vw,31px);line-height:1.2;margin:0;text-wrap:initial}
.flip-front h3 span{display:block;white-space:nowrap}
.flip-toggle{display:none}
.flip-back{background:var(--forest);color:var(--parchment)}
.flip-back p{font-size:16px;line-height:1.65;color:var(--parchment)}
.flip-actions{display:flex;align-items:flex-start;flex-direction:column;gap:14px;margin-top:auto}
.flip-back .btn{background:var(--parchment);color:var(--forest);border-color:var(--parchment)}
.flip-return{padding:6px 0;font:inherit;font-size:14px;color:var(--parchment);background:none;border:0;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.flip-back :focus-visible{outline-color:var(--parchment)}
.is-ready .flip-inner{display:grid;transform-style:preserve-3d;transition:transform .45s ease}
.is-ready .flip-face{grid-area:1/1;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.is-ready .flip-back{transform:rotateY(180deg)}
.is-ready .flip-toggle{display:inline-flex;align-self:flex-start;justify-content:center}
.is-flipped .flip-inner{transform:rotateY(180deg)}
@media(max-width:960px){.flip-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.flip-grid{grid-template-columns:1fr;gap:16px}.flip-face{padding:24px}.flip-front h3{font-size:27px}}
@media(max-width:360px){.flip-front h3{font-size:24px}.flip-face{padding:22px}}
@media(prefers-reduced-motion:reduce){.is-ready .flip-inner{transition:none}}
@media(max-width:920px){
  main[data-page="about"] .hero-grid{gap:28px}
  main[data-page="about"] .hero .photo{max-width:440px;margin-inline:auto}
}

/* Spread the About statement across the page instead of a narrow column. */
main[data-page="about"] .quote .q{max-width:none;font-size:clamp(24px,2.6vw,34px);line-height:1.3}

/* Homepage: orientation, choosing a consultation, the practitioner, and reading. */
.home-act{padding-block:var(--sp-3)}
.home-act+.home-act{border-top:1px solid var(--haze)}
.home-act>section{padding-block:var(--sp-1)}
.home-act>section:first-child{padding-top:0}
.home-act>section:last-child{padding-bottom:0}
.home-act .sec-head{align-items:end;gap:40px;margin-bottom:26px}
.home-act .sec-head .lede{font-size:17px;line-height:1.6}
.home-act .eyebrow{margin-bottom:16px}
.act--orient .hero-grid{align-items:start;gap:clamp(32px,5vw,72px)}
.act--orient .hero-stats{margin-top:24px;padding-top:18px}
.act--orient .practitioner{border:0;margin-top:18px;padding-top:0}
.act--orient .practitioner a{margin-top:4px}
.act--orient .hero-grid>div:last-child{padding-top:46px}
.act--orient .answer{max-width:none}
.act--orient .answer .a{max-width:none}
.act--orient .answer .q{font-size:26px}
.act--choose .rows{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:40px;border:0}
.act--choose .row{display:grid;grid-template-columns:28px minmax(0,1fr);gap:8px 14px;padding-block:20px;align-items:start;border-top:1px solid var(--haze);border-bottom:0}
.act--choose .row .idx{grid-row:span 2}
.act--choose .row h4{font-size:22px}
.act--choose .row p{grid-column:2;font-size:15px;line-height:1.6;max-width:none}
.act--choose .carousel-track>.card>.dia>svg{height:140px}
.act--choose .carousel-track>.card>.dia{padding:20px}
.act--choose .carousel-track>.card>.dia>figcaption{margin-top:14px;padding-top:12px}
.act--choose .flip-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;border:0;background:transparent}
.act--choose .flip-card{transition:transform .25s ease}
.act--choose .flip-card:hover{transform:translateY(-4px)}
.act--choose .flip-face{border:1px solid var(--haze);padding:24px;gap:16px;box-shadow:0 10px 26px rgba(31,58,47,.07)}
.act--choose .flip-front{min-height:310px;background:var(--ground)}
.act--choose .flip-front:hover{background:var(--parchment)}
.act--choose .flip-front h3{font-size:clamp(24px,2.1vw,30px)}
.act--choose .flip-front h3 span{white-space:normal;overflow-wrap:anywhere}
.act--choose .flip-back p{font-size:15.5px;line-height:1.6}
.act--choose .flip-actions{flex-direction:column;align-items:flex-start;gap:10px}
.act--choose .flip-actions .btn{max-width:100%}
.act--choose .flip-toggle{margin-top:0}
@media(max-width:850px){.act--choose .flip-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.act--choose .flip-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.act--choose .flip-card{transition:none}.act--choose .flip-card:hover{transform:none}}
.act--practice{background:#eeeae2;border-bottom:1px solid #e0dbd1}
.act--practice #meet-dahlia{background:none;border:0;margin:0}
.act--practice .editorial-layout{align-items:start;grid-template-columns:minmax(0,1fr) minmax(0,var(--portrait-w))}
.act--practice .editorial-layout>div{min-width:0}
/* The guide pair: the disclosure stack stopped at a 62ch measure inside
   a much wider column, so a ~215px trough opened between the "+" control
   and the portrait while the copy ended ~120px above the photograph.
   The measure now fills its column, the portrait takes a slightly larger
   bound at the same 4:5 crop, and the short copy centres against it. */
.act--practice #meet-dahlia .editorial-layout{--portrait-w:360px;align-items:center}
.act--practice #meet-dahlia .editorial-copy .stack{max-width:68ch}
.act--practice #the-method{padding-top:var(--sp-2);border-top:1px solid #d9d6cb;margin-top:12px}
.act--practice #the-method .dia{max-width:270px;padding:12px}
.act--practice #the-method .dia svg{height:180px;max-height:180px}
.act--continue #the-practice .grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-block:1px solid var(--haze)}
.act--continue #the-practice .card{background:transparent;border:0;border-right:1px solid var(--haze);padding:24px}
.act--continue #the-practice .card:last-child{border-right:0}
.act--continue [data-section="gateway"] .panel-dark{background:transparent;color:var(--forest);border:1px solid #c7c9bd;padding:30px}
.act--continue [data-section="gateway"] .panel-dark h2{color:var(--forest)}
.act--continue [data-section="gateway"] .panel-dark p{color:var(--ink-60)}
.act--continue [data-section="gateway"] .panel-dark .mono-label{color:#666c54}
.act--continue [data-section="gateway"] .panel-dark .btn{background:var(--forest);color:var(--parchment);border-color:var(--forest)}
.act--continue .quote{padding-block:var(--sp-2);border-bottom:0}
.act--continue .quote .q{max-width:46ch;font-size:clamp(26px,2.5vw,34px);line-height:1.3}
.act--continue .quote .after{max-width:74ch;margin-top:18px}
@media(max-width:920px){
  .act--orient .hero-grid>div:last-child{padding-top:0}
  .home-act .sec-head{gap:24px}
  .act--practice .editorial-layout{grid-template-columns:1fr;gap:24px}
}
@media(max-width:760px){
  .home-act .sec-head{gap:14px;margin-bottom:22px}
  .act--choose .rows{grid-template-columns:1fr}
  .act--practice .editorial-layout{grid-template-columns:1fr;gap:24px}
  .act--continue #the-practice .grid{grid-template-columns:1fr}
  .act--continue #the-practice .card{padding:22px 0;border-right:0;border-bottom:1px solid var(--haze)}
  .act--continue #the-practice .card:last-child{border-bottom:0}
}
@media(max-width:640px){
  .act--orient .hero-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
  .act--orient .hero-stats .fig{font-size:25px}
  .act--orient .hero-stats .cap{font-size:9px;letter-spacing:.08em;overflow-wrap:anywhere}
  .act--continue #the-practice .card{padding:22px 0;border-right:0;border-bottom:1px solid var(--haze)}
  .act--continue #the-practice .card:last-child{border-bottom:0}
  .act--continue [data-section="gateway"] .panel-dark{padding:24px}
}
@media(max-width:360px){.act--choose .flip-front h3{font-size:24px}.act--choose .flip-face{padding:22px}}

/* Supporting detail stays attached to its subject, instead of repeating a CTA. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.act--orient .hero .read-more{margin-block:22px 20px;padding:0}
.act--orient .hero .read-more .key-message{margin:0}
.decision-help{border-block:1px solid var(--haze);margin-top:8px}
.decision-help>summary{display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:64px;padding-block:12px;font-family:var(--display);font-size:26px;color:var(--forest);list-style:none;cursor:pointer}
.decision-help>summary::-webkit-details-marker{display:none}
.decision-help>summary::after{content:"+";font-family:var(--body);font-size:24px;display:grid;place-items:center;min-width:44px;min-height:44px}
.decision-help[open]>summary::after{content:"−"}
.decision-help>summary:focus-visible{outline:2px solid var(--moss);outline-offset:4px}
.decision-help-content{padding-bottom:24px}
.decision-help-content>section{padding-block:var(--sp-1)}
.decision-help-content>section>.wrap{max-width:none;padding-inline:0}
.decision-help-content .sec-head{grid-template-columns:1fr;gap:10px}
.decision-help-content .sec-head .eyebrow{display:none}
.decision-help-content .sec-head h2{font-size:28px}
.decision-help-content .sec-head .lede{max-width:72ch;font-size:16px}
.decision-help-content [data-section="rows"]{border-top:1px solid var(--haze);margin-top:20px}
.act--practice .quote{padding:var(--sp-2) 0 0;border-bottom:0}
.act--practice .quote .q{font-size:clamp(26px,2.5vw,34px);line-height:1.3;max-width:46ch}
.act--practice .quote .after{max-width:74ch;margin-top:16px}
.act--practice #the-method .editorial-layout{grid-template-columns:minmax(0,1.5fr) minmax(0,.5fr)}
.act--practice #the-method .editorial-layout>div:last-child{justify-self:end;width:100%;max-width:240px}
.act--practice #the-method .dia{width:100%;margin:0}
.act--continue [data-section="gateway"]{padding-bottom:0}
@media(max-width:920px){
  .act--practice #the-method .editorial-layout{grid-template-columns:1fr}
  .act--practice #the-method .editorial-layout>div:last-child{justify-self:center}
}

/* About Dahlia: a continuous personal profile, rather than disconnected blocks. */
main[data-page="about"]>.profile-hero{padding-block:var(--sp-1) var(--sp-3)}
.profile-hero-grid{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:clamp(32px,5vw,72px);align-items:center}
.profile-hero-grid>div{min-width:0}
.profile-hero-head .eyebrow{margin-bottom:18px}
.profile-hero h1{font-size:clamp(42px,4.6vw,64px);line-height:1.08}
.profile-hero-body{margin-top:26px}
.profile-hero-body .lede{font-size:18px;line-height:1.75;max-width:58ch}
.profile-hero-image .profile-photo{width:100%;height:540px;max-height:none}
main[data-page="about"] .profile-hero .cta-row{gap:12px;margin-top:28px}
main[data-page="about"] .profile-hero .btn.lg{padding-inline:24px}
main[data-page="about"]>.profile-story{padding-block:var(--sp-3) var(--sp-1);border-top:1px solid var(--haze)}
.profile-editorial{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,6vw,80px)}
.profile-editorial>header,.profile-story-body{min-width:0}
.profile-editorial h2{font-size:clamp(30px,3.1vw,40px);line-height:1.18;max-width:20ch}
.profile-thought{font-family:var(--display);font-size:25px;line-height:1.4;color:var(--moss);margin-top:24px;max-width:28ch}
.profile-story-body{display:flex;flex-direction:column;align-items:flex-start;gap:20px;font-size:17px;line-height:1.75;color:var(--ink-60)}
.profile-story .profile-story-body>p:first-child{font-size:21px;line-height:1.6;color:var(--forest)}
main[data-page="about"]>[data-section="quote"]{padding-block:var(--sp-1) var(--sp-2)}
main[data-page="about"] .quote{padding:24px 0 0;border-bottom:0}
main[data-page="about"] .quote .q{max-width:none;font-size:clamp(24px,2.4vw,31px);line-height:1.35}
#dahlia-approach{background:#eeeae2;border-block:1px solid #e0dbd1;padding-block:var(--sp-3)}
#dahlia-approach .sec-head{margin-bottom:30px}
#dahlia-approach .sec-head>div:empty{display:none}
#dahlia-approach .rows{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 40px;border:0}
#dahlia-approach .row{display:grid;grid-template-columns:26px minmax(0,1fr);align-items:start;gap:10px 16px;padding-block:24px;border-top:1px solid #d0d2c6;border-bottom:0}
#dahlia-approach .row .idx{grid-row:span 2;padding-top:3px}
#dahlia-approach .row h4{font-size:25px;line-height:1.25}
#dahlia-approach .row p{grid-column:2;font-size:16px;line-height:1.7}
main[data-page="about"]>.profile-note{padding-block:var(--sp-3) var(--sp-1)}
.profile-note .profile-thought{font-family:var(--body);font-size:16px;line-height:1.65;max-width:36ch;margin-top:18px;color:var(--ink-60)}
.profile-note .profile-story-body{font-size:17px;gap:18px}
@media(max-width:920px){
  .profile-hero-grid{grid-template-columns:1fr;gap:26px}
  .profile-hero-main{display:contents}
  .profile-hero-head{grid-row:1}
  .profile-hero-image{grid-row:2;justify-self:center;width:min(100%,440px)}
  .profile-hero-body{grid-row:3;margin-top:0}
  .profile-hero-image .profile-photo{height:440px}
  .profile-hero-body .lede{max-width:none}
  .profile-editorial{grid-template-columns:1fr;gap:24px}
  .profile-thought{max-width:46ch;margin-top:18px}
}
@media(max-width:640px){
  .profile-hero h1{font-size:42px}
  .profile-hero-image .profile-photo{height:390px}
  .profile-hero-body .lede{font-size:17px;line-height:1.7}
  .profile-hero-body .cta-row{display:grid;grid-template-columns:1fr}
  .profile-story-body{font-size:16px}
  .profile-story .profile-story-body>p:first-child{font-size:19px}
  #dahlia-approach .rows{grid-template-columns:1fr}
  #dahlia-approach .row{padding-block:22px}
  #dahlia-approach .row h4{font-size:23px}
}
/* Sciences: a connected editorial sequence, scoped to this page. */
main[data-page="sciences"]>.hero{padding-block:var(--sp-1) var(--sp-2)}
/* hero grid and diagram tile: see "illustration heroes" at the end of file */
main[data-page="sciences"] .hero h1{max-width:19ch}
main[data-page="sciences"] .read-more .key-message{font-size:18px;line-height:1.5}
main[data-page="sciences"] .expanded-copy{padding-top:16px;gap:14px}
main[data-page="sciences"] .expanded-copy .lede{font-size:16px;line-height:1.7}
main[data-page="sciences"] [data-section="answer"]{padding-bottom:var(--sp-2)}
main[data-page="sciences"] .answer{max-width:none;padding:22px 26px;border-left:2px solid var(--sage);background:var(--parchment)}
main[data-page="sciences"] .answer .q{font-size:26px}
main[data-page="sciences"] .answer .a{max-width:none;font-size:16px}
main[data-page="sciences"] [data-section="rows"]{padding-block:var(--sp-2)}
main[data-page="sciences"] .sec-head>div:empty{display:none}
main[data-page="sciences"] .sec-head{margin-bottom:24px}
main[data-page="sciences"] .row{grid-template-columns:28px minmax(0,.4fr) minmax(0,1fr);gap:20px;align-items:baseline;padding-block:23px}
main[data-page="sciences"] .row .idx{color:var(--moss);opacity:1}
main[data-page="sciences"] .row h4{font-size:25px;line-height:1.25}
main[data-page="sciences"] .row p{font-size:16px;line-height:1.65;max-width:none}
main[data-page="sciences"] .traditions-reading{display:flex;justify-content:flex-end;padding-top:18px}
main[data-page="sciences"] .text-link{border-bottom:1px solid var(--sage);padding-bottom:4px;font-size:15px}
main[data-page="sciences"] #sacred-geometry{padding-block:var(--sp-2)}
main[data-page="sciences"] .diagram-layout{grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr);align-items:center;gap:48px}
main[data-page="sciences"] .diagram-layout>.dia{border:0;background:var(--parchment);border-radius:0;width:100%;padding:24px;max-width:340px}
main[data-page="sciences"] .diagram-layout>.dia svg{height:250px;max-height:250px}
main[data-page="sciences"] .reading-pair{padding-block:var(--sp-2);gap:40px}
main[data-page="sciences"] .reading-pair .editorial-copy{padding-top:24px}
main[data-page="sciences"] .reading-pair h2{font-size:32px}
@media(max-width:920px){
  main[data-page="sciences"] .diagram-layout{gap:24px}
}
@media(max-width:760px){
  main[data-page="sciences"] .hero .cta-row{display:grid;grid-template-columns:minmax(0,1fr)}
  main[data-page="sciences"] .hero .cta-row .btn{width:100%;text-align:center}
  main[data-page="sciences"] .answer{padding:20px}
  main[data-page="sciences"] .answer .q{font-size:24px}
  main[data-page="sciences"] .row{grid-template-columns:24px minmax(0,1fr);gap:8px 12px;padding-block:20px}
  main[data-page="sciences"] .row p{grid-column:2}
  main[data-page="sciences"] .row h4{font-size:24px}
  main[data-page="sciences"] .traditions-reading{justify-content:flex-start}
  main[data-page="sciences"] .diagram-layout{grid-template-columns:minmax(0,1fr)}
  main[data-page="sciences"] .diagram-layout>.dia{max-width:320px;padding:18px}
  main[data-page="sciences"] .diagram-layout>.dia svg{height:210px}
  main[data-page="sciences"] .reading-pair{gap:28px}
  main[data-page="sciences"] .dia .mono-label{letter-spacing:.1em;font-size:10px}
}
/* Services: prioritize consultation choice, with quieter supporting content. */
main[data-page="services"]>.hero{padding-block:var(--sp-1) var(--sp-2)}
main[data-page="services"] .hero h1{font-size:clamp(36px,3.8vw,52px);max-width:23ch}
main[data-page="services"] .hero-deck{font-size:25px;max-width:36ch;margin-block:18px 12px}
main[data-page="services"] .hero .lede{font-size:17px;line-height:1.6;max-width:58ch}
main[data-page="services"] .practitioner{margin-top:20px;padding-top:14px}
main[data-page="services"] #choosing-a-consultation{padding-block:0 var(--sp-1)}
main[data-page="services"] .answer{background:var(--parchment);border-left:2px solid var(--sage);padding:22px 26px;max-width:none}
main[data-page="services"] .answer .q{font-size:27px}
main[data-page="services"] .answer .a{font-size:16px;max-width:none;line-height:1.65}
main[data-page="services"] #consultations{padding-block:var(--sp-1) var(--sp-2)}
main[data-page="services"] .sec-head{margin-bottom:22px;gap:0}
main[data-page="services"] .sec-head>div:empty{display:none}
main[data-page="services"] .sec-head h2{font-size:clamp(30px,3vw,40px)}
main[data-page="services"] .flip-grid{gap:1px;border:1px solid var(--haze);background:var(--haze)}
main[data-page="services"] .flip-face{padding:24px;border:0;gap:18px}
main[data-page="services"] .flip-front{min-height:238px;background:var(--ground)}
main[data-page="services"] .flip-front:hover{background:var(--parchment)}
main[data-page="services"] .flip-front h3{font-size:clamp(24px,2.1vw,30px)}
main[data-page="services"] .flip-back p{font-size:16px;line-height:1.6}
main[data-page="services"] .flip-actions{flex-direction:row;flex-wrap:wrap;align-items:center;gap:12px}
main[data-page="services"] .flip-actions .btn{max-width:calc(100% - 60px)}
main[data-page="services"] #ongoing-support{padding-block:var(--sp-2)}
main[data-page="services"] #ongoing-support>.wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:24px;align-items:start}
main[data-page="services"] #ongoing-support .grid{gap:24px;border-top:1px solid var(--haze);background:none}
main[data-page="services"] #ongoing-support .card{padding:22px 0 0;border:0;background:none;gap:12px;box-shadow:none;transform:none}
main[data-page="services"] #ongoing-support .card h3{font-size:25px;line-height:1.25;min-height:2.5em}
main[data-page="services"] #ongoing-support .card p{font-size:15px;line-height:1.65}
main[data-page="services"] #ongoing-support .card .num{font-size:11px}
main[data-page="services"] #ongoing-support .card .btn{margin-top:auto!important}
/* The band keeps its shared ratio; only the focal point is page business. */
main[data-page="services"] #consultation-photo .photo img{object-position:center 56%}
/* Consultations compare side by side; the approach notes attach beneath them. */
.compare-wrap{margin-top:6px;max-width:100%}
table.compare{width:100%;min-width:0;table-layout:fixed;border-collapse:collapse}
table.compare thead th{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--moss);font-weight:400;text-align:left;padding:0 18px 10px 0;border-bottom:1px solid var(--haze);vertical-align:bottom}
table.compare tbody th,table.compare tbody td{text-align:left;vertical-align:middle;padding:22px 20px 22px 0;border-bottom:1px solid var(--haze);font-size:15px;line-height:1.6;color:var(--ink-60)}
table.compare tbody th{font-family:var(--display);font-weight:500;font-size:22px;line-height:1.25;letter-spacing:normal;text-transform:none;color:var(--forest)}
table.compare thead th:last-child,table.compare .compare-link{padding-right:0}
table.compare tbody td:nth-child(3),table.compare tbody td:nth-child(4){white-space:normal;color:var(--forest)}
table.compare thead th:nth-child(n+3),table.compare tbody td:nth-child(n+3){text-align:center;padding-inline:12px}
table.compare .compare-link a{font-size:14px;color:var(--forest);text-decoration:none;border-bottom:1px solid var(--sage);padding-bottom:2px}
table.compare .compare-link a:hover{border-bottom-color:var(--forest)}
main[data-page="services"] #consultations table.compare{margin-top:2px}
main[data-page="services"] #consultations thead th:nth-child(1){width:24%}
main[data-page="services"] #consultations thead th:nth-child(2){width:36%}
main[data-page="services"] #consultations thead th:nth-child(3){width:16%}
main[data-page="services"] #consultations thead th:nth-child(4){width:12%}
main[data-page="services"] #consultations thead th:nth-child(5){width:12%}
/* Disclosure form A, unnumbered and compact: shared with the pricing terms. */
.disclosure-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 40px}
.disclosure-grid .read-more.disclosure-compact{margin-top:0}
.disclosure-compact>summary{padding-block:14px;align-items:flex-start}
.disclosure-compact>summary .key-message{font-family:var(--display);font-size:20px;line-height:1.3;font-weight:500;margin:0}
.disclosure-compact .expanded-copy{padding-top:0;padding-bottom:14px}
.disclosure-compact .expanded-copy .lede{font-size:15.5px;line-height:1.7;color:var(--ink-60);max-width:60ch}
.disclosure-scope{font-size:14px;line-height:1.6;color:var(--ink-45);max-width:72ch;margin:0 0 6px}
.attached-group>section+section{padding-top:0}
main[data-page="services"] #service-approach{padding-block:0 var(--sp-2)}
main[data-page="services"] #service-approach .sec-head{margin-bottom:6px}
/* Phones: the table stacks into labelled rows, disclosures into one column. */
@media(max-width:860px){
  .disclosure-grid{grid-template-columns:minmax(0,1fr);gap:0}
}
@media(max-width:900px){
  table.compare,table.compare tbody,table.compare tr,table.compare tbody th,table.compare tbody td{display:block;width:auto}
  table.compare thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
  table.compare tr{padding-block:18px;border-bottom:1px solid var(--haze)}
  table.compare tbody th,table.compare tbody td{border-bottom:0;padding:0}
  table.compare tbody th{font-size:24px;margin-bottom:10px}
  table.compare tbody td{margin-top:8px;display:grid;grid-template-columns:minmax(0,7.5em) minmax(0,1fr);gap:8px 12px;align-items:baseline}
  table.compare tbody td::before{content:attr(data-label);font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--moss);line-height:1.6}
  table.compare tbody td:nth-child(n+3){text-align:left;padding-inline:0}
  table.compare tbody td:nth-child(3){text-align:center}
  table.compare tbody td:nth-child(3)::before{text-align:left}
  table.compare tbody td.is-empty{display:none}
  table.compare tbody td:nth-child(3),table.compare tbody td:nth-child(4){white-space:normal}
}
@media(max-width:960px){
  main[data-page="services"] #ongoing-support>.wrap{display:block}
  main[data-page="services"] #ongoing-support .card h3{min-height:0}
}
@media(max-width:760px){
  main[data-page="services"] .hero .cta-row{display:grid;grid-template-columns:1fr}
  main[data-page="services"] .hero .cta-row .btn{width:100%;text-align:center}
  main[data-page="services"] .answer{padding:20px}
  main[data-page="services"] .answer .q{font-size:24px}
  main[data-page="services"] .dia .mono-label{font-size:10px;letter-spacing:.1em}
}
@media(max-width:640px){
  main[data-page="services"] .flip-front{min-height:220px}
  main[data-page="services"] .flip-front h3{font-size:27px}
  main[data-page="services"] #ongoing-support .grid{gap:20px}
  main[data-page="services"] #ongoing-support .card+.card{padding-top:20px;border-top:1px solid var(--haze)}
}
@media(max-width:360px){main[data-page="services"] .flip-front h3{font-size:24px}main[data-page="services"] .flip-face{padding:22px}}
/* Pricing: comparable rates, visible conditions, optional supplementary detail. */
main[data-page="pricing"]>.hero{padding-block:var(--sp-1) var(--sp-2)}
main[data-page="pricing"] .hero .sec-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px 48px;align-items:start}
main[data-page="pricing"] .hero .sec-head>div:first-child{display:contents}
main[data-page="pricing"] .hero .sec-head .eyebrow{grid-column:1;grid-row:1;margin:0}
main[data-page="pricing"] .hero .sec-head h1{grid-column:1;grid-row:2}
main[data-page="pricing"] .hero .sec-head>.stack{grid-column:2;grid-row:2}
main[data-page="pricing"] .hero h1{max-width:none!important;font-size:clamp(36px,3.8vw,52px)}
main[data-page="pricing"] .hero .lede{font-size:17px;line-height:1.6}
main[data-page="pricing"] .hero .stack{gap:18px}
main[data-page="pricing"] .answer{max-width:none;background:var(--parchment);border-left:2px solid var(--sage);padding:20px 24px}
main[data-page="pricing"] .answer .q{font-size:26px;max-width:none}
main[data-page="pricing"] .answer .a{font-size:16px;line-height:1.65;max-width:none}
main[data-page="pricing"] .sec-head{gap:0;margin-bottom:22px}
main[data-page="pricing"] .sec-head>div:empty{display:none}
main[data-page="pricing"] .sec-head h2{font-size:clamp(30px,3vw,40px);max-width:none}
main[data-page="pricing"] [data-section="pricing"]{padding-block:var(--sp-1) var(--sp-2)}
main[data-page="pricing"] .price-grid{gap:14px 20px;align-items:stretch}
main[data-page="pricing"] .price--compact{display:grid;grid-template-rows:subgrid;grid-row:span 7;gap:12px;padding:24px;min-width:0;border-radius:0;background:var(--parchment);box-shadow:none}
main[data-page="pricing"] .price.feature{border-top:3px solid var(--moss);padding-top:22px}
main[data-page="pricing"] .price h3{font-size:25px;line-height:1.25;min-height:2.5em}
main[data-page="pricing"] .price .amt{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 9px;font-size:44px;line-height:1.15;min-height:1.15em}
main[data-page="pricing"] .price .amt--words{font-size:28px;line-height:1.3;font-variant-numeric:normal;align-self:end}
main[data-page="pricing"] .price .amt small{font-size:14px;line-height:1.45;color:var(--ink-60)}
main[data-page="pricing"] .price-desc{font-size:16px;line-height:1.6;color:var(--ink-60);min-height:3.2em}
main[data-page="pricing"] .price li{font-size:14px;line-height:1.6;color:var(--ink-60)}
main[data-page="pricing"] .price-note{font-size:14px;line-height:1.6;color:var(--ink-60)}
main[data-page="pricing"] .price-note:empty{margin:0}
main[data-page="pricing"] .price .btn{justify-self:start;align-self:end;max-width:100%;text-align:center}
/* Disclosure form B: compact in-card row, aligned to the card text edge. */
main[data-page="pricing"] .price-more{margin-top:8px}
main[data-page="pricing"] .price-more>summary{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;min-height:44px;padding-block:10px;font-size:14px;line-height:1.5;color:var(--forest);cursor:pointer;list-style:none;border-top:var(--hair)}
main[data-page="pricing"] .price-more>summary::-webkit-details-marker{display:none}
main[data-page="pricing"] .price-more>summary::after{content:"+";font-size:20px;line-height:1;flex:0 0 28px;display:grid;place-items:center;height:1.05em}
main[data-page="pricing"] .price-more[open]>summary::after{content:"−"}
main[data-page="pricing"] .price-more>summary:focus-visible{outline:2px solid var(--moss);outline-offset:3px}
main[data-page="pricing"] .price-more>ul{padding-top:8px}
main[data-page="pricing"] .price-terms{font-size:15px;line-height:1.7;color:var(--ink-60);margin-top:22px;padding:14px 24px;border-left:2px solid var(--sage);background:var(--parchment)}
main[data-page="pricing"] .price-terms p{max-width:none;margin:0}
/* Shared consultation terms, stated once as a footer to the rate cards. */
main[data-page="pricing"] #fee-inclusions{padding-block:var(--sp-1) var(--sp-2)}
main[data-page="pricing"] #fee-inclusions>.wrap{position:relative;padding-top:22px}
main[data-page="pricing"] #fee-inclusions>.wrap::before{content:"";position:absolute;top:0;inset-inline:var(--gut);border-top:2px solid var(--haze)}
main[data-page="pricing"] #fee-inclusions .sec-head{margin-bottom:4px}
main[data-page="pricing"] #fee-inclusions .sec-head h2{font-size:clamp(24px,2.4vw,32px)}
main[data-page="pricing"] [data-section="faq"]{padding-block:var(--sp-1) var(--sp-2)}
main[data-page="pricing"] [data-section="faq"] .two-col{display:block}
main[data-page="pricing"] [data-section="faq"] h2{max-width:none!important;font-size:clamp(30px,3vw,40px);margin-bottom:24px}
main[data-page="pricing"] .faq summary{font-size:21px;min-height:64px}
main[data-page="pricing"] .faq .ans{width:100%;max-width:none;font-size:16px;line-height:1.7}
@media(max-width:760px){
  main[data-page="pricing"] .hero .sec-head{grid-template-columns:minmax(0,1fr);gap:22px}
  main[data-page="pricing"] .hero .sec-head>div:first-child{display:block}
  main[data-page="pricing"] .hero .sec-head .eyebrow{margin-bottom:22px}
  main[data-page="pricing"] .hero .sec-head>.stack{grid-column:1;grid-row:auto}
  main[data-page="pricing"] .hero .btn{width:100%;text-align:center}
  main[data-page="pricing"] .price-grid{grid-template-columns:minmax(0,1fr);gap:18px}
  main[data-page="pricing"] .price--compact{grid-row:auto;grid-template-rows:auto;gap:14px;padding:22px}
  main[data-page="pricing"] .price h3,main[data-page="pricing"] .price-desc{min-height:0}
  main[data-page="pricing"] .price-note:empty{display:none}
  main[data-page="pricing"] .answer,main[data-page="pricing"] .price-terms{padding:20px}
  main[data-page="pricing"] .price-terms{padding:14px 18px}
  main[data-page="pricing"] .answer .q{font-size:24px}
}
/* Preserve the shared article title typography outside the Journal hub. */
.j-card .journal-title{font-family:var(--display);font-size:21px;line-height:1.25;font-weight:500}
/* Journal: free reading first, continuing support after the articles. */
main[data-page="journal"]>.hero{padding-block:var(--sp-1) var(--sp-2)}
main[data-page="journal"] .hero .sec-head{display:block;margin:0}
main[data-page="journal"] .hero h1{max-width:none!important;font-size:clamp(36px,3.8vw,52px)}
main[data-page="journal"] .hero .stack{margin-top:20px;max-width:76ch}
main[data-page="journal"] .hero .lede{font-size:18px;line-height:1.6;max-width:none}
main[data-page="journal"] .hero .cta-row:empty{display:none}
main[data-page="journal"] #journal-articles{padding-block:var(--sp-1) var(--sp-2)}
main[data-page="journal"] #journal-articles .sec-head{gap:0;margin-bottom:24px}
main[data-page="journal"] #journal-articles .sec-head>div:empty{display:none}
main[data-page="journal"] #journal-articles .sec-head h2{font-size:32px;max-width:none}
main[data-page="journal"] #journal-articles .eyebrow{display:none}
main[data-page="journal"] #journal-articles .grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:auto;gap:18px 24px;border:0;background:none;overflow:visible}
main[data-page="journal"] .j-card{display:grid;grid-template-rows:subgrid;grid-row:span 4;padding:28px;gap:14px;border:1px solid var(--haze);border-radius:2px;min-width:0;background:var(--parchment);transform:none}
main[data-page="journal"] .j-card:hover{background:#eef1e9;border-color:var(--sage);transform:none}
main[data-page="journal"] .j-card:focus-visible{outline:2px solid var(--forest);outline-offset:4px}
main[data-page="journal"] .j-card .journal-title{font-size:25px;line-height:1.25;font-weight:500;text-wrap:pretty}
main[data-page="journal"] .j-card p{font-size:16px;line-height:1.65;max-width:none}
main[data-page="journal"] .j-card .top{gap:14px;flex-wrap:wrap}
main[data-page="journal"] .j-card .top .mono-label{color:#656b60}
main[data-page="journal"] .j-card>.read{padding-top:4px}
main[data-page="journal"] .journal-continuation{padding-block:var(--sp-2)}
/* The closing pair is a heading, one line and two buttons beside a
   portrait. Top-aligned at the full portrait bound the copy ended
   roughly 230px above the photograph, leaving an empty companion
   column; the portrait keeps its 4:5 crop at a smaller bound and the
   short copy centres against it, so the two sides finish together. */
main[data-page="journal"] .continuation-grid{display:grid;--portrait-w:272px;grid-template-columns:minmax(0,var(--portrait-w)) minmax(0,1fr);gap:clamp(28px,4vw,56px);align-items:center;border-block:1px solid var(--haze);padding-block:var(--sp-2)}
main[data-page="journal"] .continuation-copy{max-width:64ch}
main[data-page="journal"] .continuation-copy h2{font-size:clamp(29px,3vw,38px);line-height:1.2;margin-bottom:16px}
main[data-page="journal"] .continuation-copy p{font-size:17px;line-height:1.6;color:var(--ink-60)}
main[data-page="journal"] .continuation-copy .cta-row{gap:12px;margin-top:24px}
main[data-page="journal"] .continuation-copy .btn{font-size:10px;max-width:100%;text-align:center}
@media(max-width:760px){
  main[data-page="journal"] .hero .lede{font-size:17px}
  main[data-page="journal"] #journal-articles .grid{grid-template-columns:minmax(0,1fr);gap:18px}
  main[data-page="journal"] .j-card{grid-row:auto;grid-template-rows:auto;padding:22px;gap:14px}
  main[data-page="journal"] .j-card .journal-title{font-size:24px}
  main[data-page="journal"] .continuation-grid{--portrait-w:320px;grid-template-columns:minmax(0,1fr);gap:24px;align-items:start}
  main[data-page="journal"] .continuation-copy{max-width:none}
  main[data-page="journal"] .continuation-copy .cta-row{display:grid;grid-template-columns:minmax(0,1fr)}
  main[data-page="journal"] .continuation-copy .btn{width:100%;font-size:11px}
}
/* Community: sample first, understand the membership, then join. */
main[data-page="community"]>.hero{padding-block:var(--sp-1) var(--sp-2)}
main[data-page="community"] .hero h1{font-size:clamp(36px,3.8vw,52px);max-width:none}
main[data-page="community"] .hero .key-message{font-size:18px;line-height:1.5}
main[data-page="community"] .hero-stats{margin-top:24px;padding-top:18px;gap:20px}
main[data-page="community"] .hero-stats .fig{font-size:30px}
main[data-page="community"] .hero-stats .cap{font-size:10px;line-height:1.55;letter-spacing:.08em}
main[data-page="community"] [data-section="answer"]{padding-bottom:var(--sp-1)}
main[data-page="community"] .answer{max-width:none;padding:20px 24px;border-left:2px solid var(--sage);background:var(--parchment)}
main[data-page="community"] .answer .q{font-size:25px}
main[data-page="community"] .answer .a{font-size:16px;line-height:1.65;max-width:none}
main[data-page="community"] #library{padding-block:var(--sp-1) var(--sp-2)}
main[data-page="community"] .sec-head{margin-bottom:24px;gap:20px;align-items:center}
main[data-page="community"] .sec-head>div:empty{display:none}
main[data-page="community"] .sec-head h2{font-size:clamp(30px,3vw,40px)}
main[data-page="community"] .sec-head .lede{font-size:17px;line-height:1.6}
main[data-page="community"] .free-library{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 24px}
main[data-page="community"] .lib{padding:24px;border-radius:2px;transform:none}
main[data-page="community"] .lib:hover{transform:none;background:#eef1e9}
main[data-page="community"] .lib h3{font-size:24px;line-height:1.3}
main[data-page="community"] .lib p{font-size:16px;line-height:1.6}
main[data-page="community"] .lib .top{flex-wrap:wrap;gap:10px 14px}
main[data-page="community"] .lib .top>.mono-label{color:#656b60}
main[data-page="community"] .lock-tag{white-space:nowrap;flex-shrink:0;border-radius:2px;font-size:10px;letter-spacing:.08em}
main[data-page="community"] .lock-tag.free{background:var(--forest);color:var(--parchment)}
main[data-page="community"] .lib.locked{background:#eef0e8}
main[data-page="community"] .lib.locked h3,main[data-page="community"] .lib.locked p{opacity:1}
main[data-page="community"] .member-library{margin-top:24px;border-block:1px solid var(--haze)}
main[data-page="community"] .member-library>summary{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px 0;min-height:64px;font-family:var(--display);font-size:27px;line-height:1.3;cursor:pointer;list-style:none}
main[data-page="community"] .member-library>summary::-webkit-details-marker{display:none}
main[data-page="community"] .member-library>summary::after{content:"+";display:grid;place-items:center;min-width:44px;min-height:44px;font-family:var(--body);font-size:24px}
main[data-page="community"] .member-library[open]>summary::after{content:"−"}
main[data-page="community"] .member-library>summary:focus-visible{outline:2px solid var(--forest);outline-offset:4px}
main[data-page="community"] .member-library-grid{padding-bottom:24px;gap:20px}
main[data-page="community"] .member-library-grid h3{font-size:22px}
main[data-page="community"] .member-library-grid p{font-size:15px}
main[data-page="community"] #membership-includes{padding-block:var(--sp-2)}
main[data-page="community"] #membership-includes .grid{gap:0;border-block:1px solid var(--haze);background:none}
main[data-page="community"] #membership-includes .card{padding:24px;border:0;border-right:1px solid var(--haze);background:none;gap:12px}
main[data-page="community"] #membership-includes .card:last-child{border-right:0}
main[data-page="community"] #membership-includes h3{font-size:25px;line-height:1.25}
main[data-page="community"] #membership-includes .card p{font-size:16px;line-height:1.65}
/* Hold the speaker and the seated audience inside the band as it reflows.
   50% centres the 2:1 desktop window on source rows 313-940 of the square
   original: headroom over Dahlia, her whole figure and raised hand, the
   back row facing her, and one row of foreground chairs for depth.       */
main[data-page="community"] #community-gathering img{object-position:center 50%}
/* Desktop: the gathering reads as an inset editorial plate, not a full-bleed
   band. 900px wide at 2:1 trims the redundant foreground floor rather than
   the room, so the crop tightens without letterboxing.                   */
@media(min-width:861px){
  main[data-page="community"] #community-gathering>.wrap{display:flex;justify-content:center}
  main[data-page="community"] #community-gathering .photo{
    max-width:900px;aspect-ratio:2/1
  }
}
main[data-page="community"] #join{padding-block:var(--sp-2)}
main[data-page="community"] #join h2{font-size:clamp(30px,3vw,40px)}
main[data-page="community"] #join .lede{font-size:17px;line-height:1.65}
main[data-page="community"] #join .two-col{gap:40px;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
main[data-page="community"] .preview-notice{font-size:14px;line-height:1.6;color:var(--ink-60);padding:16px;border-left:2px solid var(--sage);background:var(--ground)}
main[data-page="community"] #join input{font-size:16px}
main[data-page="community"] [data-section="faq"]{padding-block:var(--sp-1) var(--sp-2)}
main[data-page="community"] [data-section="faq"] .two-col{display:block}
main[data-page="community"] [data-section="faq"] h2{max-width:none!important;font-size:clamp(30px,3vw,40px);margin-bottom:24px}
main[data-page="community"] .faq summary{font-size:21px;min-height:64px}
main[data-page="community"] .faq .ans{width:100%;max-width:none;font-size:16px;line-height:1.7}
@media(max-width:960px){main[data-page="community"] #membership-includes .grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){
  main[data-page="community"] .hero .cta-row{display:grid;grid-template-columns:minmax(0,1fr)}
  main[data-page="community"] .hero .cta-row .btn{width:100%;text-align:center}
  main[data-page="community"] .hero-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
  main[data-page="community"] .hero-stats .fig{font-size:27px}
  main[data-page="community"] .sec-head{grid-template-columns:minmax(0,1fr);gap:14px}
  main[data-page="community"] .free-library{grid-template-columns:minmax(0,1fr)}
  main[data-page="community"] .lib{padding:22px}
  main[data-page="community"] #membership-includes .grid{grid-template-columns:minmax(0,1fr)}
  main[data-page="community"] #membership-includes .card{border-right:0;border-bottom:1px solid var(--haze);padding:22px 0}
  main[data-page="community"] #membership-includes .card:last-child{border-bottom:0}
  main[data-page="community"] #join .two-col{grid-template-columns:minmax(0,1fr);gap:24px}
  main[data-page="community"] .answer{padding:20px}
}

main[data-page="community"] .lib-grid{grid-auto-rows:auto}
main[data-page="community"] .lib{display:grid;grid-template-rows:subgrid;grid-row:span 4;gap:12px}
@media(max-width:760px){main[data-page="community"] .free-library .lib{grid-template-rows:auto;grid-row:auto}}
@media(max-width:620px){main[data-page="community"] .lib{grid-template-rows:auto;grid-row:auto}}

/* ============================================================
   Editorial system — shared composition, reading and enquiry.
   Page-specific treatments above keep their approved content;
   these components establish the same grid and interaction grammar.
   ============================================================ */
:root{--max:1360px;--reading-rail:224px;--reading-gap:48px}
[id]{scroll-margin-top:110px}
body::before{display:none}
main h2{letter-spacing:-.018em}
main .eyebrow{letter-spacing:.14em}
main .quote .q{max-width:48ch;font-size:clamp(26px,2.8vw,38px);line-height:1.3}
main .quote{padding-block:var(--sp-2)}
main .quote .after{max-width:74ch;margin-top:18px}
.hero-split{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:48px}
.hero-split .cta-row:empty{display:none}
.hero-split .lede{max-width:none}
.hero-split h1{max-width:18ch!important}

/* A person welcomes the visitor; enquiry is an intentional second step. */
.act--orient{padding-top:var(--sp-2)}
.act--orient .hero-grid{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);align-items:center;gap:56px}
.act--orient .hero-grid>div:last-child{padding:0}
.act--orient .hero h1{font-size:clamp(42px,4.8vw,66px);line-height:1.04;max-width:17ch;text-wrap:balance}
.act--orient .entrance-portrait{height:540px;aspect-ratio:auto;border-radius:48% 48% 2px 2px}
.act--orient .entrance-portrait img{object-position:center 44%}
.act--orient .hero-stats{gap:18px;border-top:1px solid var(--haze);padding-top:18px;margin-top:28px}
.act--orient .hero-stats .fig{font-size:30px}
.act--orient .practitioner{font-size:14px;margin-top:22px}
.act--orient .hero .read-more .key-message{font-size:19px;line-height:1.6}
.enquiry-drawer{margin-top:30px;border-block:1px solid var(--haze)}
.enquiry-drawer>summary,.intake-extra>summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:64px;cursor:pointer;color:var(--forest)}
.enquiry-drawer>summary{font-family:var(--display);font-size:26px}
.enquiry-drawer>summary::after,.intake-extra>summary::after{content:'+';font:24px var(--body);min-width:44px;text-align:center}
.enquiry-drawer[open]>summary::after,.intake-extra[open]>summary::after{content:'−'}
.enquiry-drawer>summary::-webkit-details-marker,.intake-extra>summary::-webkit-details-marker{display:none}
.enquiry-drawer .quickbook{margin-block:4px 24px;max-width:820px;border:0;box-shadow:none;background:var(--parchment)}
.act--orient .answer{border:0;padding:0;max-width:none}
.act--orient .answer .a{font-size:16px;line-height:1.7}

/* Reading links are editorial lists rather than a second set of sales cards. */
main[data-page="journal"] #journal-articles .grid,
.act--continue [data-section="journal"] .grid{gap:0 32px;border:0;background:none;overflow:visible}
main[data-page="journal"] .j-card,
.act--continue [data-section="journal"] .j-card{border:0;border-top:1px solid #b8c1b2;border-radius:0;padding:26px 0;background:transparent;box-shadow:none}
main[data-page="journal"] .j-card:hover,
.act--continue [data-section="journal"] .j-card:hover{background:transparent;border-color:var(--forest);transform:none}
.j-card:hover .journal-title,.lib:hover h3{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
main[data-page="community"] .free-library{gap:0 32px}
main[data-page="community"] .free-library .lib{background:transparent;border:0;border-top:1px solid #b8c1b2;border-radius:0;padding:26px 0}
main[data-page="community"] .free-library .lib:hover{background:transparent}

/* One shared FAQ convention: heading, full-width rows, plus/minus control. */
main [data-section="faq"] .two-col{display:block}
main [data-section="faq"] h2{max-width:none!important;font-size:clamp(30px,3vw,40px);margin-bottom:24px}
main [data-section="faq"] .eyebrow{margin-bottom:12px}
main .faq summary{font-size:22px;line-height:1.4;min-height:68px;padding:20px 54px 20px 0}
main .faq summary::after{content:'+';border:0;width:40px;height:40px;display:grid;place-items:center;right:0;top:50%;transform:translateY(-50%);font:24px var(--body);color:var(--forest)}
main .faq details[open]>summary::after{content:'−';transform:translateY(-50%)}
main .faq .ans{max-width:none;width:100%;font-size:16px;line-height:1.75;padding:0 48px 24px 0}

/* Service and process introductions: explanation and image belong together. */
.detail-overview{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:48px;align-items:start;padding-block:var(--sp-1) var(--sp-2)}
.detail-overview>section{min-width:0;padding:0!important}
.detail-overview>section>.wrap{max-width:none;padding:0;margin:0}
.detail-overview .answer{padding:0;border:0;max-width:none}
.detail-overview .answer .q{font-size:32px;line-height:1.2;margin-bottom:20px}
.detail-overview .answer .a{font-size:17px;line-height:1.75;max-width:none}
main[data-page^="services/"]>.hero,
main[data-page="how-it-works"]>.hero{padding-block:var(--sp-1) var(--sp-2)}
/* Service detail covers keep their own figure; how it works joins the
   shared illustration-hero rules at the end of this file. */
main[data-page^="services/"] .hero-grid{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:48px;align-items:center}
main[data-page^="services/"] .hero .dia{max-width:330px;margin-inline:auto;padding:12px}
main[data-page^="services/"] .hero .dia svg{height:235px;width:100%}
main[data-page^="services/"] .hero .dia figcaption{font-size:10px;gap:8px;margin-top:12px;padding-top:12px}
main[data-page^="services/"] .hero h1,
main[data-page="how-it-works"] .hero h1{font-size:clamp(36px,4vw,54px);max-width:21ch}
main[data-page^="services/"] .hero .lede{font-size:18px;max-width:55ch}
main[data-page^="services/"] .hero .photo{height:370px;aspect-ratio:auto}
main[data-page^="services/"] [data-section="rows"] .rows,
main[data-page="how-it-works"] [data-section="rows"] .rows{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 40px;border:0}
main[data-page^="services/"] [data-section="rows"] .row,
main[data-page="how-it-works"] [data-section="rows"] .row{display:grid;grid-template-columns:26px minmax(0,1fr);gap:8px 14px;align-items:start;padding-block:22px;border-top:1px solid var(--haze);border-bottom:0}
main[data-page^="services/"] [data-section="rows"] .idx,
main[data-page="how-it-works"] [data-section="rows"] .idx{grid-row:span 2;padding-top:5px}
main[data-page^="services/"] [data-section="rows"] h4,
main[data-page="how-it-works"] [data-section="rows"] h4{font-size:25px;line-height:1.25}
main[data-page^="services/"] [data-section="rows"] .row p,
main[data-page="how-it-works"] [data-section="rows"] .row p{grid-column:2;font-size:16px;line-height:1.7}
main [data-section="steps"] .row{grid-template-columns:82px minmax(0,.85fr) minmax(0,1.15fr);padding-block:24px;gap:24px;align-items:baseline}
main [data-section="steps"] .idx{font-size:13px;letter-spacing:.03em;color:var(--moss)}
main [data-section="steps"] .row p{font-size:16px;line-height:1.7}
main[data-page^="services/"] [data-section="diagram"]>.wrap>.dia{max-width:440px;margin-inline:auto}
main[data-page^="services/"] [data-section="diagram"]>.wrap>.dia svg{max-height:340px}
main[data-page^="services/"] [data-section="prose"] .editorial-text{max-width:none}
main[data-page^="services/"] [data-section="prose"] .editorial-copy{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:0 48px;padding-top:26px;border-top:1px solid var(--haze)}
main[data-page^="services/"] [data-section="prose"] .editorial-copy>.eyebrow{grid-column:1/-1}
main[data-page^="services/"] [data-section="prose"] .editorial-copy>.stack{min-width:0}

/* Long-form pages: a readable measure with a useful, anchored margin. */
.reading-header .reading-intro{margin-left:calc(var(--reading-rail) + var(--reading-gap));max-width:760px}
.reading-header h1{max-width:27ch;line-height:1.12!important}
.reading-header .article-meta{gap:12px 20px;padding-bottom:20px;margin-bottom:24px}
.reading-header .answer{max-width:none;padding:20px 24px;background:#eceee5;border:0;margin-bottom:0!important}
.reading-header .answer .a{font-size:17px;line-height:1.75}
.reading-layout{display:grid;grid-template-columns:var(--reading-rail) minmax(0,1fr);gap:var(--reading-gap);align-items:start}
.reading-layout>*{min-width:0}
.reading-body{max-width:760px}
.reading-body .article{max-width:none;margin:0}
.reading-body .article>h2:first-child{margin-top:0}
.reading-body .article h2{font-size:32px;line-height:1.25;margin-top:36px;margin-bottom:16px}
.reading-body .article p{font-size:17px;line-height:1.8}
.reading-body .article>h2:first-of-type+p::first-letter{float:none;font:inherit;padding:0}
.reading-body .article .pull{font-size:27px;line-height:1.4;text-align:left;border-left:2px solid var(--sage);padding-left:24px;margin-block:28px}
.reading-nav{position:sticky;top:112px;max-height:calc(100dvh - 136px);overflow:auto;padding-right:6px;scrollbar-width:thin}
.reading-contents{border-top:1px solid #b8c1b2}
.reading-contents>summary{list-style:none;font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--forest);padding-block:18px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px}
.reading-contents>summary::after{content:'+';font:22px var(--body)}
.reading-contents[open]>summary::after{content:'−'}
.reading-contents>summary::-webkit-details-marker{display:none}
.reading-contents ol{margin:0;padding:0;list-style:none;counter-reset:reading}
.reading-contents li{counter-increment:reading;border-top:1px solid var(--haze)}
.reading-contents a{display:flex;gap:12px;padding:12px 0;text-decoration:none;font-size:13px;line-height:1.5;color:var(--ink-60)}
.reading-contents a::before{content:counter(reading,decimal-leading-zero);font-family:var(--mono);font-size:10px;color:var(--moss);padding-top:2px}
.reading-contents a:hover{color:var(--forest);text-decoration:underline;text-underline-offset:4px}
.reading-contents a:focus-visible{outline-offset:1px}
.reading-layout:has(>.reading-nav[hidden]){display:block;margin-left:calc(var(--reading-rail) + var(--reading-gap))}
.reading-section>.wrap>.card{margin-left:calc(var(--reading-rail) + var(--reading-gap))!important;max-width:760px!important}
.entry-figure{max-width:360px;margin:28px auto 0}
.entry-figure .dia{background:transparent;border:0;padding:12px}
.entry-figure .dia svg{height:250px;max-width:100%}
.reading-body .takeaways,.reading-body .practice-box{margin-block:28px;background:#eceee5;border:0;border-radius:0;padding:26px}
.reading-body .faq summary{font-size:24px}

/* Enquiry: essentials first, optional context in one clearly labelled drawer. */
main[data-page="book"] .hero>.wrap>.two-col{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:56px}
main[data-page="book"] .hero>.wrap>.two-col>.stack{position:sticky;top:112px}
main[data-page="book"] #intake-form{border:0;background:var(--parchment);box-shadow:none}
main[data-page="book"] #intake-form>div:first-child{flex-wrap:wrap}
.intake-extra{border-block:1px solid var(--haze)}
.intake-extra>summary{font-size:15px;min-height:58px}
.intake-extra>.form-grid{padding-block:8px 20px}
.preview-notice{font-size:13px;line-height:1.6;color:var(--ink-60);border-left:2px solid var(--sage);padding:10px 16px;background:var(--ground)}
main[data-page="book"] .field input,main[data-page="book"] .field select,main[data-page="book"] .field textarea{font-size:16px;background:var(--ground)}
main[data-page="book"] [data-section="carousel"] .dia svg{max-height:160px}
main[data-page="book"] [data-section="placeholders"]{padding-block:var(--sp-1)}
main[data-page="book"] .placeholder-block{padding:20px;border-style:solid;background:transparent}
main[data-page="book"] .placeholder-block p{font-size:13px}
main[data-page="private-advisory"] .hero h1{color:var(--parchment);font-size:clamp(42px,5vw,68px)}
main[data-page="private-advisory"] .hero .eyebrow{color:#c1cbb8}
main[data-page="private-advisory"] .hero .lede{color:#e1e7dc}
main[data-page="private-advisory"] .hero .btn{color:var(--forest);background:var(--parchment)}
main[data-page="private-advisory"] .hero :focus-visible{outline-color:var(--parchment)}
main[data-page="private-advisory"] [data-section="prose"] .editorial-text{max-width:860px}

@media(max-width:1100px){
  :root{--reading-rail:190px;--reading-gap:32px}
  .act--orient .hero-grid{gap:32px}
  .act--orient .entrance-portrait{height:490px}
}
@media(max-width:960px){
  .reading-header .reading-intro{margin:0;max-width:none}
  .reading-layout{grid-template-columns:minmax(0,1fr);gap:26px}
  .reading-body{max-width:none}
  .reading-nav{position:static;max-height:none;overflow:visible;padding:0}
  .reading-contents{border-bottom:1px solid var(--haze)}
  .reading-contents>summary{min-height:56px}
  .reading-contents a{font-size:15px;padding:12px}
  .reading-layout:has(>.reading-nav[hidden]){margin-left:0}
  .reading-section>.wrap>.card{margin-left:0!important}
  main[data-page="book"] .hero>.wrap>.two-col{grid-template-columns:minmax(0,1fr);gap:30px}
  main[data-page="book"] .hero>.wrap>.two-col>.stack{position:static}
}
@media(max-width:920px){
  .act--orient .hero-grid{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:28px}
  .act--orient .hero h1{font-size:44px}
  .act--orient .entrance-portrait{height:480px}
  main[data-page^="services/"] .hero-grid{grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:24px}
}
@media(max-width:760px){
  .hero-split,.act--orient .hero-grid,.detail-overview,
  main[data-page^="services/"] .hero-grid{grid-template-columns:minmax(0,1fr);gap:24px}
  .act--orient .hero h1{font-size:42px;max-width:20ch}
  .act--orient .entrance-portrait{height:390px;width:100%;max-width:420px;margin-inline:auto!important}
  .act--orient .hero-grid>div:last-child{padding-top:6px}
  .act--orient .hero .cta-row{display:grid;grid-template-columns:1fr}
  .act--orient .hero .cta-row .btn{width:100%}
  .enquiry-drawer{margin-top:24px}
  .enquiry-drawer>summary{font-size:24px}
  .detail-overview .answer .q{font-size:28px}
  main[data-page^="services/"] [data-section="rows"] .rows,
  main[data-page="how-it-works"] [data-section="rows"] .rows{grid-template-columns:minmax(0,1fr)}
  main[data-page^="services/"] [data-section="prose"] .editorial-copy{display:block}
  main [data-section="steps"] .row{grid-template-columns:64px minmax(0,1fr);gap:10px 14px}
  main [data-section="steps"] .row p{grid-column:2}
  main[data-page^="services/"] .hero .dia svg{height:175px}
  main[data-page^="services/"] .hero .photo{height:280px}
  main .faq .ans{padding-right:0}
  main .faq summary{font-size:21px}
  .reading-body .article h2{font-size:28px}
  .reading-body .article p{font-size:16px;line-height:1.8}
  .reading-header .answer{padding:20px}
  .reading-header .answer .a{font-size:16px}
  .reading-contents a{padding-left:0}
  .reading-body .takeaways,.reading-body .practice-box{padding:20px}
  .entry-figure .dia svg{height:210px}
}
@media(max-width:360px){.act--orient .hero h1{font-size:37px}.act--orient .entrance-portrait{height:330px}}
/* Keep the mobile welcome personal, before the supporting facts. */
.nav a.discreet,.crumbs,.kv .k{color:#666c54}
@media(max-width:760px){
  .act--orient .hero-grid>div:first-child{display:contents}
  .act--orient .hero-grid>div:last-child{grid-row:3;padding:0}
  .act--orient .hero-grid .eyebrow,.act--orient .hero-grid h1,.act--orient .hero-grid .read-more{margin:0}
  .act--orient .hero-grid .cta-row{margin-top:0}
  .act--orient .hero-stats,.act--orient .practitioner{margin-top:0}
}
/* Locked previews retain a centered reading measure until the contents rail opens. */
main:has(.reading-nav[hidden]) .reading-header .reading-intro{margin-inline:auto}
.reading-layout:has(>.reading-nav[hidden]){max-width:760px;margin-inline:auto}
.reading-section>.wrap>.member-gate{margin-inline:auto!important}
.member-gate[hidden]{display:none}
html[lang="hi-IN"] .act--orient .hero h1{line-height:1.35;letter-spacing:0}

/* Service detail collection: photographic covers, clear terms and quiet diagrams. */
main[data-page^="services/"]>.service-cover{padding-block:var(--sp-1) 0}
main[data-page^="services/"]>.service-cover .hero-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:56px;align-items:center}
main[data-page^="services/"]>.service-cover h1{font-size:clamp(38px,4.2vw,58px);line-height:1.08;max-width:20ch;margin-bottom:18px}
.service-terms{font-size:15px;line-height:1.6;font-weight:500;color:var(--moss);padding-bottom:20px;margin-bottom:20px;border-bottom:1px solid #c9cbbd;max-width:540px}
main[data-page^="services/"]>.service-cover .lede{font-size:18px;line-height:1.75;max-width:50ch}
main[data-page^="services/"]>.service-cover .cta-row{align-items:center;gap:16px 24px;margin-top:26px}
main[data-page^="services/"]>.service-cover .cta-row .ghost{border:0;border-radius:0;padding:8px 0;text-align:left;text-transform:none;letter-spacing:0;font-size:14px;text-decoration:underline;text-underline-offset:5px;max-width:36ch;box-shadow:none}
main[data-page^="services/"]>.service-cover .cta-row .ghost:hover{background:none;transform:none}
main[data-page^="services/"]>.service-cover .practitioner{border:0;padding:0;margin-top:24px;max-width:50ch}
main[data-page^="services/"]>.service-cover .practitioner-detail{font-size:13px}
main[data-page^="services/"]>.service-cover .photo{height:460px;width:100%;aspect-ratio:auto;border-radius:2px 90px 2px 2px}
main[data-page^="services/"]>.service-cover .photo img{object-position:center 45%}
main[data-page="services/feng-shui-consultation"]>.service-cover .photo img{object-position:57% 40%}
main[data-page="services/auspicious-date-selection"]>.service-cover .photo img{object-position:center 50%}
main[data-page^="services/"]>.service-cover .service-cover-visual>.dia{max-width:none;padding:26px;border:1px solid #d8dacd;background:#edece2;border-radius:2px 90px 2px 2px}
main[data-page^="services/"]>.service-cover .service-cover-visual>.dia svg{height:355px;max-height:none;width:100%}
main[data-page^="services/"]>.service-cover .service-cover-visual>.dia figcaption{margin-top:6px;padding-top:14px}
.service-sections{display:flex;flex-wrap:wrap;gap:0 30px;border-block:1px solid var(--haze);margin-top:32px;padding-block:6px}
.service-sections a{display:inline-flex;align-items:center;min-height:44px;font-size:13px;font-weight:500;color:var(--ink-60);text-decoration:none;text-underline-offset:5px}
.service-sections a:hover,.service-sections a:focus-visible{color:var(--forest);text-decoration:underline}
main[data-page^="services/"] .detail-overview{grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr);gap:64px;padding-block:var(--sp-2);align-items:center}
main[data-page^="services/"] .detail-overview .answer{max-width:74ch}
main[data-page^="services/"] .detail-overview .answer .q{font-size:30px;max-width:30ch;margin-bottom:18px}
main[data-page^="services/"] .detail-overview .answer .a{font-size:16px;line-height:1.8}
main[data-page^="services/"] .service-symbol .dia{max-width:280px;border:0;background:transparent;padding:12px;margin-inline:auto}
main[data-page^="services/"] .service-symbol .dia svg{width:100%;height:175px;max-height:none}
main[data-page^="services/"] .service-symbol .dia figcaption{margin-top:10px;padding-top:12px;gap:8px;line-height:1.6}
main[data-page^="services/"] .service-symbol .dia .mono-label{font-size:9px;letter-spacing:.09em}
main[data-page="services/tarot-reading"] #service-answer{padding-block:var(--sp-2)!important}
main[data-page="services/tarot-reading"] #service-answer .answer{max-width:none;border:0;padding:0;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:40px}
main[data-page="services/tarot-reading"] #service-answer .q{font-size:32px;margin:0}
main[data-page="services/tarot-reading"] #service-answer .a{font-size:17px;line-height:1.8}

/* Align paired topics and let an odd final topic use the entire row. */
main[data-page^="services/"] #service-rows .rows{gap:0 40px}
main[data-page^="services/"] #service-rows .row{grid-template-rows:subgrid;grid-row:span 2;gap:10px 14px;padding-block:22px}
main[data-page^="services/"] #service-rows .row .idx{grid-row:1/3;color:#666c54}
main[data-page^="services/"] #service-rows .row h4{grid-column:2;grid-row:1;font-size:25px}
main[data-page^="services/"] #service-rows .row p{grid-column:2;grid-row:2;font-size:16px;line-height:1.7;padding-bottom:2px}
main[data-page^="services/"] #service-rows .row:last-child:nth-child(odd){grid-column:1/-1;grid-template-columns:26px minmax(0,.6fr) minmax(0,1.4fr);align-items:start}
main[data-page^="services/"] #service-rows .row:last-child:nth-child(odd) p{grid-column:3;grid-row:1/3;max-width:74ch}
main[data-page^="services/"] #service-rows .row:last-child:nth-child(odd) h4{grid-row:1/3}
main[data-page^="services/"] #service-cards .grid{border:0;gap:0 32px;background:transparent;grid-auto-rows:auto}
main[data-page^="services/"] #service-cards .card{display:grid;grid-template-rows:subgrid;grid-row:span 2;gap:12px;padding:24px 0;border:0;border-top:1px solid #c9cbbd;background:transparent;border-radius:0;box-shadow:none}
main[data-page^="services/"] #service-cards .card h3{font-size:26px;line-height:1.25}
main[data-page^="services/"] #service-cards .card p{font-size:16px;line-height:1.7;padding-bottom:8px}
main[data-page^="services/"] #service-steps{background:#edece3;margin-block:18px;padding-block:var(--sp-2)}
main[data-page^="services/"] #service-steps .row{border-color:#d4d6c8}
main[data-page^="services/"] #service-prose{padding-block:var(--sp-2)}
main[data-page^="services/"] #service-prose .editorial-copy{padding-top:24px}
main[data-page^="services/"] [data-section="quote"]{padding-block:var(--sp-1) var(--sp-2)}
main[data-page^="services/"] [data-section="quote"] .quote{padding-block:var(--sp-2)}
main[data-page^="services/"] [data-section="quote"] .q{font-size:clamp(27px,2.7vw,36px);max-width:52ch}
main[data-page^="services/"] #service-faq{padding-block:var(--sp-2)}
main[data-page^="services/"] #service-faq .eyebrow{margin-bottom:10px}
main[data-page^="services/"] #service-faq h2{margin-bottom:20px}
html[lang="hi-IN"] main[data-page^="services/"] .service-cover h1{line-height:1.4;letter-spacing:0}
html[lang="hi-IN"] main[data-page^="services/"] #service-rows h4,
html[lang="hi-IN"] main[data-page^="services/"] #service-cards h3{line-height:1.5}
@media(max-width:1050px){
 main[data-page^="services/"]>.service-cover .hero-grid{gap:32px}
 main[data-page^="services/"]>.service-cover .photo{height:430px}
 main[data-page^="services/"] .detail-overview{gap:32px}
}
@media(max-width:760px){
 main[data-page^="services/"]>.service-cover .hero-grid{grid-template-columns:minmax(0,1fr);gap:26px}
 main[data-page^="services/"]>.service-cover h1{font-size:39px;max-width:none}
 main[data-page^="services/"]>.service-cover .photo{height:320px;max-width:none;border-top-right-radius:60px}
 main[data-page^="services/"]>.service-cover .service-cover-visual>.dia{border-top-right-radius:60px;padding:20px}
 main[data-page^="services/"]>.service-cover .service-cover-visual>.dia svg{height:270px}
 main[data-page^="services/"]>.service-cover .lede{font-size:17px}
 main[data-page^="services/"]>.service-cover .cta-row{gap:10px;align-items:flex-start;flex-direction:column}
 main[data-page^="services/"]>.service-cover .cta-row>.btn:not(.ghost){width:100%}
 .service-sections{gap:0 22px;margin-top:24px}
 .service-sections a{font-size:13px}
 main[data-page^="services/"] .detail-overview{grid-template-columns:minmax(0,1fr);gap:16px}
 main[data-page^="services/"] .service-symbol .dia{max-width:320px;display:grid;grid-template-columns:130px minmax(0,1fr);gap:16px;align-items:center;padding:12px 0}
 main[data-page^="services/"] .service-symbol .dia svg{height:130px}
 main[data-page^="services/"] .service-symbol .dia figcaption{border:0;margin:0;padding:0;display:flex;flex-direction:column}
 main[data-page^="services/"] #service-rows .row{grid-row:auto;grid-template-rows:auto auto}
 main[data-page^="services/"] #service-rows .row:last-child:nth-child(odd){grid-column:auto;grid-template-columns:26px minmax(0,1fr)}
 main[data-page^="services/"] #service-rows .row:last-child:nth-child(odd) h4{grid-row:1}
 main[data-page^="services/"] #service-rows .row:last-child:nth-child(odd) p{grid-column:2;grid-row:2}
 main[data-page="services/tarot-reading"] #service-answer .answer{grid-template-columns:minmax(0,1fr);gap:18px}
 main[data-page^="services/"] #service-cards .grid{grid-template-columns:minmax(0,1fr)}
 main[data-page^="services/"] #service-cards .card{grid-template-rows:auto;grid-row:auto;gap:12px}
}
@media(max-width:360px){
 main[data-page^="services/"]>.service-cover h1{font-size:35px}
 main[data-page^="services/"] .service-symbol .dia{grid-template-columns:110px minmax(0,1fr);gap:12px}
 main[data-page^="services/"] .service-symbol .dia svg{height:110px}
}
@media(max-width:760px){
 main[data-page^="services/"] .sec-head{grid-template-columns:minmax(0,1fr);gap:14px}
 main[data-page^="services/"] .sec-head .lede{font-size:17px}
}
main[data-page^="services/"] .sec-head>div:empty{display:none}
main[data-page^="services/"] #service-diagram{padding-block:var(--sp-2)}
main[data-page^="services/"] #service-diagram .diagram-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:center;padding:28px 0;border-block:1px solid var(--haze)}
main[data-page^="services/"] #service-diagram .diagram-copy{max-width:52ch}
main[data-page^="services/"] #service-diagram .diagram-copy h2{margin-bottom:22px}
main[data-page^="services/"] #service-diagram .dia{margin:0 auto;max-width:360px;border:0;background:transparent;padding:0}
main[data-page^="services/"] #service-diagram .dia svg{height:240px}
@media(max-width:760px){
 main[data-page^="services/"] #service-diagram .diagram-layout{grid-template-columns:minmax(0,1fr);gap:24px}
}
/* Advisory, personal portraits and the shared page ending. */
:root{--portrait-arch:50% 50% 4px 4px / 34% 34% 4px 4px}
main[data-page="private-advisory"]>.advisory-hero{background:transparent;padding-block:var(--sp-1) var(--sp-2);margin:0}
.advisory-cover{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;background:var(--forest);padding:clamp(28px,4vw,56px);align-items:start}
.advisory-cover .eyebrow{margin-bottom:24px}
main[data-page="private-advisory"] .advisory-cover h1{font-size:clamp(42px,4.6vw,64px);max-width:13ch}
.advisory-intro .lede{font-size:18px;line-height:1.75;max-width:44ch}
.advisory-intro .cta-row{margin-top:24px}
main[data-page="private-advisory"] #advisory-engagements{padding-block:var(--sp-1) var(--sp-2)}
#advisory-engagements .sec-head{margin-bottom:28px}
#advisory-engagements .sec-head>div:empty{display:none}
#advisory-engagements .rows{border-bottom:1px solid var(--haze)}
#advisory-engagements .row{grid-template-columns:40px minmax(0,1fr) minmax(0,1.15fr);gap:24px;padding-block:26px;align-items:baseline;border-top:1px solid var(--haze);border-bottom:0}
#advisory-engagements .row h4{font-size:25px;line-height:1.3}
#advisory-engagements .row p{font-size:16px;line-height:1.75;max-width:52ch}
#advisory-engagements .idx{font-family:var(--body);font-size:11px;letter-spacing:.16em;color:#666c54}
main[data-page="private-advisory"]>.advisory-note{padding-block:var(--sp-2) var(--sp-3)}
.advisory-note .profile-editorial{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:64px}
.advisory-note .profile-thought{font-family:var(--body);font-size:17px;line-height:1.7;max-width:34ch}
.advisory-note .profile-story-body{gap:18px}
.advisory-note .cta-row{margin-top:8px}
main[data-page="private-advisory"] .page-closing .cta-band{align-items:flex-start;text-align:left;padding:clamp(28px,4vw,56px)}
main[data-page="private-advisory"] .page-closing h2{max-width:24ch;text-wrap:balance}
main[data-page="private-advisory"] .page-closing .lede{margin-inline:0!important;max-width:60ch!important}
main[data-page="private-advisory"] .page-closing .cta-row{justify-content:flex-start}
.profile-hero-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(32px,5vw,64px);align-items:center}
.profile-hero-image .profile-photo,.act--orient .entrance-portrait{height:auto;aspect-ratio:4/5;border-radius:var(--portrait-arch);max-height:none}
.profile-hero-image .profile-photo img,.act--orient .entrance-portrait img{object-fit:cover;object-position:52% 40%}
.profile-hero-image{width:100%;max-width:460px;justify-self:end}
.act--orient .hero-grid>div:last-child{width:100%;max-width:460px;justify-self:end}
main[data-page="about"] .profile-hero .cta-row{align-items:center;gap:16px 24px}
main[data-page="about"] .profile-hero .cta-row .ghost{padding:8px 0;border:0;text-transform:none;letter-spacing:0;font-size:15px;text-decoration:underline;text-underline-offset:5px}
main[data-page="about"] .profile-hero .cta-row .ghost:hover{background:transparent;transform:none}
main[data-page]>.page-closing{padding-block:var(--sp-3) var(--sp-4);margin-bottom:0}
.page-closing .cta-row{align-items:stretch;gap:12px}
.page-closing .btn{min-height:52px;display:inline-flex;align-items:center;justify-content:center}
.site-foot{padding-block:var(--sp-3) var(--sp-1);background:var(--ground)}
.foot-grid{grid-template-columns:minmax(0,3fr) repeat(3,minmax(0,2fr));gap:36px;align-items:start}
.foot-grid>*{min-width:0}
.footer-brand{display:block;width:200px;max-width:100%;margin:0 0 14px;padding:0}
.footer-brand .brand-art{width:200px;max-width:100%}
.foot-statement{font-size:15px;line-height:1.7;color:var(--ink-60);max-width:29ch}
.foot-col .mono-label{margin:0 0 16px;min-height:18px}
.foot-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.foot-col a{display:flex;align-items:center;min-height:40px;line-height:1.5;padding:6px 0;font-size:14px}
.foot-base{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"location copyright" "legal legal";align-items:baseline;gap:12px 24px;margin-top:28px;padding-top:24px}
.foot-location{grid-area:location;font-size:13px;line-height:1.6;color:var(--forest)}
.foot-base .foot-disclaimer{grid-area:legal;max-width:none;min-width:0;font-size:12px;line-height:1.65}
.foot-copyright{grid-area:copyright;white-space:nowrap;font-size:12px;text-align:right}
@media(max-width:1024px){
 .foot-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
 .foot-identity{grid-column:1/-1;display:grid;grid-template-columns:220px minmax(0,1fr);gap:24px;align-items:center;padding-bottom:24px;border-bottom:1px solid var(--haze)}
 .footer-brand{margin:0}
 .foot-statement{max-width:50ch}
 .profile-hero-image{max-width:420px}
}
@media(max-width:920px){
 .profile-hero-grid{grid-template-columns:minmax(0,1fr)}
 .profile-hero-image{justify-self:center;width:min(100%,420px)}
 .profile-hero-image .profile-photo{height:auto;aspect-ratio:4/5}
 .profile-hero-body{max-width:64ch}
 .advisory-cover{gap:32px}
}
@media(max-width:760px){
 .advisory-cover{grid-template-columns:minmax(0,1fr);gap:24px;padding:28px 24px}
 main[data-page="private-advisory"] .advisory-cover h1{max-width:none}
 .advisory-cover .eyebrow{margin-bottom:18px}
 .advisory-intro .lede{font-size:17px}
 #advisory-engagements .row{grid-template-columns:26px minmax(0,1fr);gap:8px 14px;padding-block:22px}
 #advisory-engagements .row .idx{grid-row:span 2}
 #advisory-engagements .row p{grid-column:2}
 .advisory-note .profile-editorial{grid-template-columns:minmax(0,1fr);gap:24px}
 .act--orient .hero-grid>div:last-child{max-width:400px;justify-self:center}
 .act--orient .entrance-portrait{height:auto;aspect-ratio:4/5;max-width:none}
 main[data-page="about"] .profile-hero .cta-row{display:flex;flex-wrap:wrap}
 .foot-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 24px}
 .foot-identity{display:block;padding-bottom:22px}
 .footer-brand{margin-bottom:14px}
 .foot-col:last-child{grid-column:1/-1}
 .foot-col:last-child ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px}
 .foot-col a{min-height:44px;font-size:14px}
 .foot-base{grid-template-columns:minmax(0,1fr);grid-template-areas:"location" "legal" "copyright";gap:14px;margin-top:26px;padding-top:22px}
 .foot-copyright{text-align:left}
}
@media(max-width:380px){.foot-grid{column-gap:18px}.foot-col:last-child ul{column-gap:18px}.footer-brand,.footer-brand .brand-art{width:180px}}

/* ---------- illustration heroes ----------
   Sciences, Services, Community and How it works all open with a line
   diagram rather than a photograph. They previously carried four
   different widths, paddings and caption treatments, each centred inside
   an undersized column, so no mark reached the right content edge. One
   grid and one bounded parchment tile now serve all four: the tile fills
   its column, so its right edge lands on the same content edge as the
   header button, and it sits on the baseline of the copy beside it.
   Portrait heroes (home, about) are untouched and stay centred.        */
.hero--diagram .hero-grid{
  grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);
  gap:clamp(28px,3.4vw,48px);
  align-items:start;
}
.hero--diagram .hero-figure{min-width:0;align-self:end}
.hero--diagram .hero-figure>.dia{
  width:100%;max-width:none;margin:0;
  background:var(--parchment);
  border:1px solid var(--haze);
  border-radius:2px;
  padding:clamp(20px,1.9vw,28px);
}
.hero--diagram .hero-figure>.dia svg{
  width:100%;height:clamp(230px,18.5vw,286px);max-height:none;object-fit:contain;
}
.hero--diagram .hero-figure>.dia figcaption{
  display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;
  gap:6px 16px;margin-top:18px;padding-top:14px;
  border-top:1px solid var(--haze);line-height:1.6;
}
.hero--diagram .hero-figure>.dia .mono-label{font-size:10px;letter-spacing:.1em}
@media(max-width:920px){
  /* Copy first, then the diagram: the reading order the markup already has. */
  .hero--diagram .hero-grid{grid-template-columns:minmax(0,1fr);gap:24px}
  .hero--diagram .hero-figure{align-self:start;width:100%;max-width:520px;margin-inline:auto}
  .hero--diagram .hero-figure>.dia svg{height:clamp(200px,40vw,260px)}
}
@media(max-width:560px){
  .hero--diagram .hero-figure>.dia{padding:18px}
  .hero--diagram .hero-figure>.dia svg{height:190px}
  .hero--diagram .hero-figure>.dia figcaption{margin-top:14px;padding-top:12px}
}

/* ---------- photographic ratios ----------
   Interior photography previously ran at three unrelated proportions: a
   4:1 letterbox on Services, a 2:1 gathering plate on Community and a
   3:2 half-column plate on Journal that aligned to nothing. Two ratios
   now carry all of it — a 16:9 band at full content width, and a 4:5
   editorial portrait bounded inside a half column. Where a portrait
   pairs with text both columns start on the same line and the shorter
   one ends early. The approved portrait heroes (home, about) and the
   service covers keep their own crops and are not touched here.        */
.photo-band{padding-block:var(--sp-2)}
.photo-band>.wrap>.photo{width:100%;height:auto}
@media(max-width:860px){.photo-band .ratio-16x9{aspect-ratio:3/2}}
@media(max-width:600px){.photo-band .ratio-16x9{aspect-ratio:4/3}}

/* The half-column portrait: one bound, one alignment, three placements. */
.editorial-portrait,
.continuation-photo,
.detail-overview .photo{width:100%;max-width:var(--portrait-w);height:auto;max-height:none}
.editorial-layout>div:has(>.editorial-portrait),
.detail-overview>section:last-child{justify-self:end;width:100%;max-width:var(--portrait-w);min-width:0}
@media(max-width:920px){
  .editorial-layout>div:has(>.editorial-portrait){justify-self:start}
  .editorial-portrait,.continuation-photo{margin-inline:0}
}
@media(max-width:760px){
  .detail-overview>section:last-child{justify-self:start}
}

/* A captioned plate. The frame stays the .photo box so every existing
   crop rule still applies; the caption sits beneath it. */
.photo-figure{margin:0;display:flex;flex-direction:column;gap:12px;min-width:0}
.photo-caption{font-size:13.5px;line-height:1.6;color:var(--ink-60);max-width:36ch}

/* The three-plate strip belongs to the practice it illustrates: one
   ratio, one grid, and a caption under each plate stating what is in
   the frame. On phones each plate turns to face its own caption.       */
.photo-strip{padding-block:var(--sp-1)}
.strip-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.6vw,22px)}
.strip-grid>.photo-figure{min-width:0}
@media(max-width:760px){
  .strip-grid{grid-template-columns:minmax(0,1fr);gap:18px}
  .strip-grid>.photo-figure{display:grid;grid-template-columns:104px minmax(0,1fr);gap:16px;align-items:center}
  .strip-grid .photo-caption{max-width:none}
}
@media(max-width:360px){
  .strip-grid>.photo-figure{grid-template-columns:84px minmax(0,1fr);gap:14px}
}

/* ---------- home: narrative groups ----------
   Home reads hero → what we do → consultations → Dahlia → journal →
   one closing call. Every supporting section stays on the page and
   stays discoverable; each one now sits inside the step it supports,
   at the attached rank, so the page ends once instead of four times.  */
.home-act .act-group>section{padding-block:var(--sp-1)}
.home-act>.act-group:first-child>section:first-child{padding-top:0}
.home-act>.act-group:last-child>section:last-child{padding-bottom:0}
/* Meet Dahlia and the plates that illustrate the practice are one group. */
.act--practice .act-group--guide>section+section{padding-top:0}
/* Journal leads; membership and Private Advisory follow beneath one
   hairline as related ways to continue, not as two more closing bands. */
.act--continue .act-group--more{margin-top:var(--sp-2);border-top:1px solid var(--haze)}
.act--continue .act-group--more>section:first-child{padding-top:var(--sp-2)}

/* Keep caption-free photo strips compact on phones. */
@media(max-width:760px){.strip-grid.strip-grid--uncaptioned{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}}

/* Preserve all three people in the approved consultation composition. */
.photo.ratio-square{aspect-ratio:1/1}

/* ============================================================
   Community page — scoped additions only
   ============================================================ */

/* --- 1. Membership includes: editorial rows, not boxed cards --- */
main[data-page="community"] #membership-includes .grid,
main[data-page="community"] #membership-includes .cards {
  display: block;
  gap: 0;
  margin-top: 2rem;
  border-top: 1px solid color-mix(in srgb, var(--forest) 16%, transparent);
}

main[data-page="community"] #membership-includes .card {
  border-right: 0 !important;
  border-left: 0;
  border-top: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  border-bottom: 1px solid color-mix(in srgb, var(--forest) 12%, transparent);
  display: grid;
  grid-template-columns: 90px 1fr 1.8fr;
  align-items: start;
  column-gap: 1.75rem;
  row-gap: 0.35rem;
  padding: 1.25rem 0 1.35rem;
}

main[data-page="community"] #membership-includes .card:last-child { border-bottom: 0; }

main[data-page="community"] #membership-includes .card .num {
  font-family: var(--display);
  font-size: 1.5rem;
  line-height: 1.1;
  color: color-mix(in srgb, var(--forest) 55%, transparent);
  letter-spacing: 0.01em;
  margin: 0;
  display: block;
}

main[data-page="community"] #membership-includes .card h3 {
  font-family: var(--display);
  font-size: 1.125rem;
  line-height: 1.3;
  color: var(--forest);
  margin: 0;
  max-width: 22ch;
  text-wrap: balance;
}

main[data-page="community"] #membership-includes .card p {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.6;
  max-width: 62ch;
  color: color-mix(in srgb, var(--forest) 82%, transparent);
}

@media (max-width: 860px) {
  main[data-page="community"] #membership-includes .card {
    grid-template-columns: 1fr;
    row-gap: 0.45rem;
    padding: 1.15rem 0 1.25rem;
  }
  main[data-page="community"] #membership-includes .card h3,
  main[data-page="community"] #membership-includes .card p { max-width: none; }
  main[data-page="community"] #membership-includes .card .num { font-size: 1.25rem; }
}

/* --- 2. Boundaries: two compact hairline columns --- */
main[data-page="community"] #community-boundaries .grid,
main[data-page="community"] #community-boundaries .cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 3rem;
  row-gap: 0;
  margin-top: 1.75rem;
}

main[data-page="community"] #community-boundaries .card {
  border: 0;
  border-top: 1px solid color-mix(in srgb, var(--forest) 16%, transparent);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  padding: 1.1rem 0 1.4rem;
}

main[data-page="community"] #community-boundaries .card h3 {
  font-family: var(--display);
  font-size: 1.05rem;
  line-height: 1.3;
  color: var(--forest);
  margin: 0 0 0.4rem;
  max-width: 28ch;
}

main[data-page="community"] #community-boundaries .card p {
  margin: 0;
  font-size: 0.925rem;
  line-height: 1.6;
  max-width: 54ch;
  color: color-mix(in srgb, var(--forest) 80%, transparent);
}

@media (max-width: 760px) {
  main[data-page="community"] #community-boundaries .grid,
  main[data-page="community"] #community-boundaries .cards { grid-template-columns: 1fr; column-gap: 0; }
  main[data-page="community"] #community-boundaries .card p { max-width: none; }
}

/* --- 3. Rhythm rows --- */
main[data-page="community"] #community-rhythm .rows {
  margin-top: 1.75rem;
  border-top: 1px solid color-mix(in srgb, var(--forest) 16%, transparent);
}

main[data-page="community"] #community-rhythm .rows .row {
  display: grid;
  grid-template-columns: 70px 1fr 1.8fr;
  align-items: baseline;
  column-gap: 1.75rem;
  row-gap: 0.3rem;
  padding: 1.05rem 0 1.15rem;
  border-bottom: 1px solid color-mix(in srgb, var(--forest) 12%, transparent);
}

main[data-page="community"] #community-rhythm .rows .row:last-child { border-bottom: 0; }

main[data-page="community"] #community-rhythm .rows .row .idx {
  font-family: var(--display);
  font-size: 0.9rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--forest) 50%, transparent);
}

main[data-page="community"] #community-rhythm .rows .row h3,
main[data-page="community"] #community-rhythm .rows .row h4 {
  font-family: var(--display);
  font-size: 1.05rem;
  line-height: 1.3;
  color: var(--forest);
  margin: 0;
  max-width: 20ch;
}

main[data-page="community"] #community-rhythm .rows .row p {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.6;
  max-width: 60ch;
  color: color-mix(in srgb, var(--forest) 82%, transparent);
}

main[data-page="community"] #community-rhythm .rows .row:hover {
  background: color-mix(in srgb, var(--haze) 45%, transparent);
}

@media (max-width: 860px) {
  main[data-page="community"] #community-rhythm .rows .row {
    grid-template-columns: 1fr;
    row-gap: 0.4rem;
    padding: 1rem 0 1.1rem;
  }
  main[data-page="community"] #community-rhythm .rows .row h3,
  main[data-page="community"] #community-rhythm .rows .row h4,
  main[data-page="community"] #community-rhythm .rows .row p { max-width: none; }
  main[data-page="community"] #community-rhythm .rows .row:hover { background: transparent; }
}

/* Compact homepage choose cards */
.act--choose .flip-grid {
  grid-auto-rows: auto;
  align-items: start;
}

.act--choose .flip-front {
  min-height: 220px;
  padding: 20px 24px;
  display: grid;
  grid-template-rows: auto 1fr auto;
  align-content: start;
  gap: 12px;
}

.act--choose .flip-front > * {
  margin: 0;
}

.act--choose .flip-front button,
.act--choose .flip-front .btn,
.act--choose .flip-front a.button {
  min-height: 44px;
}

/* Ready state: no 3D transform, only active face rendered */
.act--choose .is-ready .flip-inner {
  display: block;
  transform-style: flat;
  transform: none;
}

.act--choose .is-ready .flip-face {
  position: static;
  grid-area: auto;
  transform: none;
  backface-visibility: visible;
}

.act--choose .is-ready .flip-back {
  display: none;
}

/* Flipped state: reverse face shown in normal flow, no rotation */
.act--choose .is-ready.is-flipped .flip-front,
.act--choose .is-ready .is-flipped .flip-front {
  display: none;
}

.act--choose .is-ready.is-flipped .flip-back,
.act--choose .is-ready .is-flipped .flip-back {
  display: block;
  transform: none;
  padding: 20px 24px;
}

/* Keep compact card actions at their natural, consistent width. */
.act--choose .flip-front .flip-toggle{justify-self:start}
.act--choose .is-ready.is-flipped .flip-back{display:flex}