/* ==========================================================================
   LEAFORO DISPENSARY — Las Cruces, NM
   Art direction: "HIGH DESERT, HIGH CONTRAST"
   Structural motif: the page is one trading day, 10AM → 10PM.
   Sun rises at the hero, sets into the ridgeline at the footer.
   ========================================================================== */

/* ---------- 1. TOKENS ---------- */
:root{
  --ink:#12150F;
  --ink-2:#1B2016;
  --ink-3:#2A3023;
  --bone:#F5EEE1;
  --bone-2:#EBE0CB;
  --bone-3:#DDD0B6;
  --leaf:#3E8E41;          /* client's existing brand token */
  --leaf-deep:#2C6A2F;
  --leaf-bright:#5CC661;
  --chile:#D93A1E;
  --chile-deep:#A82812;
  --sun:#F2A03D;
  --sand:#E7CFA3;
  --clay:#B4552F;
  --dusk:#3A2A24;

  --sh-1:0 2px 0 var(--ink);
  --sh-2:6px 6px 0 var(--ink);
  --sh-3:10px 10px 0 var(--ink);

  --f-display:'Anton', 'Arial Narrow', Impact, sans-serif;
  --f-body:'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --f-mono:'Space Mono', ui-monospace, 'Courier New', monospace;

  --pad:clamp(1.25rem, 5vw, 5.5rem);
  --maxw:1400px;
  --rule:2px solid var(--ink);
}

/* ---------- 2. RESET / BASE ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--bone);
  color:var(--ink);
  font-family:var(--f-body);
  font-size:clamp(1rem,.95rem + .25vw,1.1rem);
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
}
/* `clip` (not `hidden`) so no scroll container is created and position:sticky survives */
html,body{overflow-x:clip}
body.is-gated{overflow:hidden}
img,svg{max-width:100%;display:block}
h1,h2,h3,h4{margin:0;line-height:.92;letter-spacing:-.01em}
p{margin:0 0 1em}
p:last-child{margin-bottom:0}
a{color:inherit}
ul,ol{margin:0;padding:0;list-style:none}
button{font:inherit;color:inherit}
table{border-collapse:collapse;width:100%}
:focus-visible{outline:3px solid var(--chile);outline-offset:3px;border-radius:2px}
/* The gate's primary button is focused programmatically on first paint, so
   :focus-visible fires on the very first frame. A chile (alert-red) ring around
   a green "Yes" reads as a validation error. Inside the gate — the one screen
   with a near-black ground — the ring is bone: unmistakably focus, not alarm,
   and far more visible on dark than either chile or ink. */
.gate :focus-visible{outline-color:var(--bone)}
.nb{white-space:nowrap}
.vh{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:-9999px;top:0;z-index:999;background:var(--ink);color:var(--bone);padding:.9rem 1.4rem;font-family:var(--f-mono);font-size:.8rem}
.skip:focus{left:0}

/* ---------- 3. TYPE SYSTEM ---------- */
.eyebrow{
  display:flex;align-items:center;gap:.75rem;
  font-family:var(--f-mono);font-size:clamp(.62rem,.58rem + .18vw,.74rem);
  letter-spacing:.18em;text-transform:uppercase;
  color:color-mix(in srgb, var(--ink) 62%, transparent);
  margin:0 0 1.4rem;
}
.eyebrow__rule{display:block;width:clamp(24px,4vw,56px);height:2px;background:currentColor;flex:none}
.eyebrow--onink{color:color-mix(in srgb, var(--bone) 60%, transparent)}
.eyebrow--onleaf{color:color-mix(in srgb, var(--ink) 68%, transparent)}
.eyebrow--hero{margin-bottom:1.1rem}

/* Anton's caps sit high in the em box — under 1.0 the lines physically collide. */
.sechead__h,.why__h,.spec__h,.label__h,.dt__h,.pay__h,.nm__h,.visit__h,
.signup__h,.comply__h,.gate__h{line-height:1}
.sechead{padding:0 0 clamp(2rem,4vw,3.4rem)}
.sechead__h{
  font-family:var(--f-display);
  font-size:clamp(3.2rem,1.6rem + 8.4vw,8.5rem);
  text-transform:uppercase;letter-spacing:-.015em;
}
.sechead__h--light{color:var(--bone)}
.sechead__aside{max-width:44ch}
.sechead__aside .mini{font-size:.92rem;color:color-mix(in srgb, var(--ink) 70%, transparent)}
.sechead--split,.sechead--center{display:block}

/* ---------- 4. BUTTONS ---------- */
.btn{
  --btn-bg:var(--leaf-bright);--btn-fg:var(--ink);
  display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
  background:var(--btn-bg);color:var(--btn-fg);
  border:2px solid var(--ink);border-radius:999px;
  padding:.85rem 1.5rem;
  font-weight:700;font-size:.95rem;line-height:1.15;text-decoration:none;
  cursor:pointer;text-align:center;
  box-shadow:4px 4px 0 var(--ink);
  transition:transform .16s cubic-bezier(.2,.9,.3,1.2), box-shadow .16s ease, background .18s ease;
}
.btn:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--ink)}
.btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}
.btn--lg{padding:1.05rem 1.9rem;font-size:1.02rem}
.btn--sm{padding:.6rem 1.05rem;font-size:.82rem;box-shadow:3px 3px 0 var(--ink)}
.btn--leaf{--btn-bg:var(--leaf-bright)}
.btn--sun{--btn-bg:var(--sun)}
.btn--ink{--btn-bg:var(--ink);--btn-fg:var(--bone);border-color:var(--ink)}
.btn--outline{--btn-bg:transparent;--btn-fg:var(--ink);box-shadow:4px 4px 0 var(--ink)}
.btn--outline:hover{--btn-bg:var(--bone)}
.btn--ghost-light{--btn-bg:transparent;--btn-fg:var(--bone);border-color:var(--bone);box-shadow:4px 4px 0 color-mix(in srgb,var(--bone) 40%, transparent)}
.btn--ghost-light:hover{--btn-bg:var(--bone);--btn-fg:var(--ink)}

/* ---------- 5. GRAIN ---------- */
.grain,.gate__grain{
  position:fixed;inset:0;pointer-events:none;z-index:60;
  opacity:.5;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='180' height='180' filter='url(%23n)' opacity='0.42'/></svg>");
  background-size:180px 180px;
}
.gate__grain{position:absolute;z-index:1;mix-blend-mode:overlay;opacity:.35}

/* ---------- 6. AGE GATE ---------- */
.gate{
  position:fixed;inset:0;z-index:200;
  background:var(--ink);color:var(--bone);
  display:grid;place-items:center;
  padding:clamp(1.1rem,4vw,2.5rem);
  overflow:hidden;
}
.gate[hidden]{display:none}
.gate__ridge{position:absolute;left:0;right:0;bottom:0;color:var(--leaf-deep);opacity:.5;z-index:0}
.gate__ridge svg{width:100%;height:clamp(120px,26vh,260px)}
.gate__card,.gate__deny{position:relative;z-index:2;max-width:620px;text-align:center}
.gate__word{font-family:var(--f-display);text-transform:uppercase;font-size:clamp(1.8rem,1.2rem + 2.4vw,3rem);letter-spacing:.06em;margin:0 0 .2rem;color:var(--bone)}
.gate__badge{color:var(--leaf-bright);width:clamp(70px,13vw,96px);margin:1.2rem auto 1.4rem}
.gate__eyebrow{font-family:var(--f-mono);font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--sun);margin:0 0 1rem}
.gate__h{
  font-family:var(--f-display);text-transform:uppercase;
  font-size:clamp(2.6rem,1.4rem + 6.4vw,5.4rem);margin:0 0 1.2rem;
}
.gate__p{max-width:46ch;margin:0 auto 2rem;color:color-mix(in srgb,var(--bone) 82%,transparent);font-size:1.02rem}
.gate__actions{display:flex;flex-wrap:wrap;gap:.9rem;justify-content:center}
.gate__fine{margin:1.9rem 0 0;font-family:var(--f-mono);font-size:.7rem;letter-spacing:.13em;text-transform:uppercase;color:color-mix(in srgb,var(--bone) 55%,transparent)}
.gate__deny{text-align:center}
.gate__deny .gate__p{margin-bottom:1.6rem}

/* ---------- 7. TICKER ---------- */
.tickerbar{background:var(--ink);color:var(--bone);border-block:2px solid var(--ink);overflow:hidden}
.tickerbar--chile{background:var(--chile);color:var(--bone);border-color:var(--ink)}
.marquee{overflow:hidden;width:100%}
.marquee__row{
  display:flex;align-items:center;gap:1.6rem;white-space:nowrap;width:max-content;
  padding:.62rem 0;
  font-family:var(--f-mono);font-size:.74rem;letter-spacing:.19em;text-transform:uppercase;
  will-change:transform;
}
.marquee__row b{color:var(--leaf-bright);font-size:.7rem}
.tickerbar--chile .marquee__row b{color:var(--sun)}
.marquee__row--big{
  font-family:var(--f-display);font-size:clamp(3rem,10vw,7.5rem);
  letter-spacing:.01em;text-transform:uppercase;gap:2.5rem;padding:.1rem 0;
}

/* ---------- 8. HEADER ---------- */
.hdr{
  position:sticky;top:0;z-index:50;
  display:flex;align-items:center;gap:1.4rem;
  padding:.7rem var(--pad);
  background:color-mix(in srgb,var(--bone) 92%,transparent);
  backdrop-filter:blur(10px);
  border-bottom:2px solid var(--ink);
}
.brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;flex:none}
.brand__mark{display:block;width:38px;flex:none}
.brand__mark--lg{width:60px}
.brand__type strong{display:block;font-family:var(--f-display);font-size:1.32rem;letter-spacing:.02em;text-transform:uppercase;line-height:1}
.brand__type em{display:block;font-family:var(--f-mono);font-style:normal;font-size:.58rem;letter-spacing:.15em;text-transform:uppercase;color:color-mix(in srgb,var(--ink) 60%,transparent);margin-top:.16rem}
.nav{display:flex;gap:1.5rem;margin-left:auto}
.nav a{
  font-family:var(--f-mono);font-size:.76rem;letter-spacing:.13em;text-transform:uppercase;
  text-decoration:none;padding:.35rem 0;position:relative;
}
.nav a::after{content:"";position:absolute;left:0;right:100%;bottom:.05rem;height:2px;background:var(--chile);transition:right .25s ease}
.nav a:hover::after{right:0}
.hdr__right{display:flex;align-items:center;gap:.75rem;margin-left:auto}
.nav + .hdr__right{margin-left:0}

.status{
  display:inline-flex;align-items:center;gap:.45rem;
  border:2px solid var(--ink);border-radius:999px;padding:.3rem .75rem;
  font-family:var(--f-mono);font-size:.66rem;letter-spacing:.11em;text-transform:uppercase;
  background:var(--bone);white-space:nowrap;
}
.status__dot{width:8px;height:8px;border-radius:50%;background:var(--leaf);flex:none}
.status.is-closed .status__dot{background:var(--chile)}
.status.is-open .status__dot{animation:pulse 2s ease-in-out infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--leaf) 70%,transparent)}50%{box-shadow:0 0 0 6px transparent}}
.status--inline{margin-left:.6rem;vertical-align:middle}

.burger{display:none;width:44px;height:40px;border:2px solid var(--ink);border-radius:10px;background:var(--bone);cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:4px;padding:0}
.burger i{display:block;width:20px;height:2px;background:var(--ink);transition:transform .2s ease,opacity .2s ease}
.burger[aria-expanded="true"] i:nth-child(1){transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded="true"] i:nth-child(2){opacity:0}
.burger[aria-expanded="true"] i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

.mobnav{
  position:sticky;top:57px;z-index:49;background:var(--ink);color:var(--bone);
  padding:1rem var(--pad) 1.4rem;display:flex;flex-direction:column;gap:.1rem;
  border-bottom:2px solid var(--ink);
}
.mobnav[hidden]{display:none}
.mobnav a{font-family:var(--f-mono);font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;padding:.65rem 0;border-bottom:1px solid color-mix(in srgb,var(--bone) 18%,transparent)}
.mobnav__call{color:var(--leaf-bright);border-bottom:0 !important;margin-top:.5rem}

/* ---------- 9. DAY GAUGE (signature scroll device) ---------- */
.gauge{
  position:fixed;right:clamp(.6rem,1.6vw,1.4rem);top:50%;transform:translateY(-50%);
  z-index:45;display:flex;flex-direction:column;align-items:center;gap:.55rem;
  background:var(--ink);color:var(--bone);
  padding:.85rem .55rem;border-radius:999px;border:2px solid var(--ink);
  box-shadow:4px 4px 0 color-mix(in srgb,var(--ink) 30%,transparent);
}
.gauge__cap{font-family:var(--f-mono);font-size:.56rem;letter-spacing:.1em;opacity:.65}
.gauge__track{position:relative;width:8px;height:clamp(120px,22vh,190px);border-radius:999px;background:color-mix(in srgb,var(--bone) 20%,transparent);overflow:visible}
.gauge__fill{position:absolute;left:0;right:0;top:0;height:0%;border-radius:999px;background:linear-gradient(180deg,var(--sun),var(--chile))}
.gauge__sun{position:absolute;left:50%;top:0;width:24px;margin-left:-12px;margin-top:-12px;color:var(--sun);filter:drop-shadow(0 0 6px color-mix(in srgb,var(--sun) 70%,transparent))}
.gauge__now{font-family:var(--f-mono);font-size:.58rem;letter-spacing:.06em;color:var(--sun);writing-mode:vertical-rl;text-orientation:mixed;margin-top:.15rem}

/* ---------- 10. RIDGE DIVIDERS ---------- */
.ridge{position:absolute;left:0;right:0;line-height:0;pointer-events:none}
.ridge--top{top:0;transform:translateY(-99%)}
.ridge svg{width:100%;height:clamp(40px,6vw,90px);display:block}

/* ---------- 11. HERO ---------- */
.hero{
  position:relative;overflow:hidden;
  display:grid;align-items:center;
  padding:clamp(2rem,4vw,3.6rem) var(--pad) clamp(2.5rem,5vw,4.5rem);
  background:linear-gradient(175deg,#FBF4E6 0%, #F5EEE1 42%, #EFE2C9 100%);
  border-bottom:2px solid var(--ink);
}
.hero__art{position:absolute;right:0;top:0;bottom:0;width:min(62%,880px);z-index:0}
.hero__svg{width:100%;height:100%;object-fit:cover}
.hero__art::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(96deg, var(--bone) 0%, color-mix(in srgb,var(--bone) 82%,transparent) 14%, color-mix(in srgb,var(--bone) 30%,transparent) 30%, transparent 46%);
}
.hero__inner{position:relative;z-index:2;max-width:min(100%,720px)}
.hero__h{
  font-family:var(--f-display);text-transform:uppercase;
  font-size:clamp(3.4rem,1.2rem + 10.4vw,9rem);
  line-height:.9;letter-spacing:-.02em;margin:0 0 1.3rem;
}
.hero__line{display:block}
.hero__mid{display:flex;align-items:center;gap:.7rem}
.hero__line--out{
  color:transparent;-webkit-text-stroke:2px var(--ink);
  flex:none;
}
.hero__midrule{flex:1 1 auto;height:3px;background:var(--ink);min-width:20px;max-width:180px}
.hero__midtag{
  flex:none;font-family:var(--f-mono);font-size:.62rem;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;line-height:1.4;
  border:2px solid var(--ink);border-radius:8px;padding:.3rem .6rem;
  background:var(--sun);box-shadow:3px 3px 0 var(--ink);transform:rotate(-2deg);
}
.hero__line--green{color:var(--leaf-deep)}
.hero__lede{max-width:50ch;font-size:clamp(1rem,.94rem + .32vw,1.16rem);margin-bottom:1.7rem}
.hero__lede strong{font-weight:700;box-shadow:inset 0 -.45em 0 color-mix(in srgb,var(--sun) 45%,transparent)}
.hero__cta{display:flex;flex-wrap:wrap;gap:.9rem;margin-bottom:.9rem}
.hero__note{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.09em;text-transform:uppercase;color:color-mix(in srgb,var(--ink) 62%,transparent);max-width:52ch;margin-bottom:2rem}

.stickers{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:2.2rem}
.sticker{
  display:inline-block;border:2px solid var(--ink);border-radius:999px;
  padding:.34rem .85rem;font-family:var(--f-mono);font-size:.68rem;
  letter-spacing:.12em;text-transform:uppercase;font-weight:700;
  box-shadow:3px 3px 0 var(--ink);background:var(--bone);
}
.sticker--chile{background:var(--chile);color:var(--bone);transform:rotate(-2.5deg)}
.sticker--sun{background:var(--sun);transform:rotate(1.5deg)}
.sticker--leaf{background:var(--leaf-bright);transform:rotate(-1deg)}
.sticker--bone{background:var(--bone);transform:rotate(2deg)}

.datastrip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:2px solid var(--ink);margin:0;background:color-mix(in srgb,var(--bone) 70%,transparent);max-width:720px}
.datastrip>div{padding:.7rem .85rem;border-right:2px solid var(--ink)}
.datastrip>div:last-child{border-right:0}
.datastrip dt{font-family:var(--f-mono);font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;color:color-mix(in srgb,var(--ink) 55%,transparent)}
.datastrip dd{margin:.2rem 0 0;font-family:var(--f-mono);font-size:.82rem;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.hero__spin{position:absolute;right:clamp(1rem,7vw,7rem);bottom:clamp(1rem,5vw,3.5rem);width:clamp(96px,13vw,168px);z-index:3;animation:spin 26s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* ---------- 12. AMENITY RAIL ---------- */
/* extra bottom padding so the ridgeline of the next section never eats the chips */
.rail{background:var(--ink);color:var(--bone);padding:1.1rem var(--pad) clamp(3.6rem,7vw,6.5rem);border-bottom:2px solid var(--ink)}
.rail__head{max-width:var(--maxw);margin:clamp(1.4rem,3vw,2.6rem) auto clamp(1rem,2.2vw,1.6rem)}
.rail__head .eyebrow{margin:0}
.rail__list{display:flex;flex-wrap:wrap;gap:.5rem .5rem;justify-content:space-between;max-width:var(--maxw);margin:0 auto}
.rail__list li{
  display:inline-flex;align-items:center;gap:.5rem;flex:1 1 auto;
  border:1px solid color-mix(in srgb,var(--bone) 30%,transparent);border-radius:999px;
  padding:.45rem .9rem;
  font-family:var(--f-mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;
  transition:background .2s ease,color .2s ease,border-color .2s ease;
}
.rail__list li:hover{background:var(--leaf-bright);color:var(--ink);border-color:var(--leaf-bright)}
.rail__ico{width:19px;flex:none;color:var(--leaf-bright)}
.rail__list li:hover .rail__ico{color:var(--ink)}

/* ---------- 13. WHY (leaf statement band) ---------- */
.why{
  position:relative;background:var(--leaf);color:var(--ink);
  padding:clamp(3.5rem,7vw,7rem) var(--pad) clamp(3rem,6vw,5.5rem);
  border-bottom:2px solid var(--ink);
}
.why .ridge{color:var(--leaf)}
.why__grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(1.5rem,4vw,4rem);align-items:start;max-width:var(--maxw);margin:0 auto}
.why__h{font-family:var(--f-display);text-transform:uppercase;font-size:clamp(2.3rem,.8rem + 6.2vw,5.8rem);letter-spacing:-.015em}
.why__h span{display:block;position:relative}
.why__h span:nth-child(2){padding-left:.14em;color:var(--ink)}
.why__h span:nth-child(1){color:var(--bone)}
.why__h--alt{color:var(--sun);padding-left:.28em}
.why__left{align-self:start}
/* A fixed 3-up grid: the scatter reads as deliberate instead of as a bad wrap. */
.why__stickers{
  display:grid;grid-template-columns:repeat(3,auto);justify-content:start;justify-items:start;
  gap:.7rem .6rem;margin-top:clamp(1.4rem,3vw,2.4rem);max-width:34rem;
}
.why__stickers .sticker{background:var(--bone);white-space:nowrap}
.why__stickers .sticker--sun{background:var(--sun)}
.why__stickers .sticker--chile{background:var(--chile);color:var(--bone)}
.why__stickers .sticker:nth-child(even){transform:rotate(1.2deg)}
.why__stickers .sticker:nth-child(odd){transform:rotate(-1.4deg)}
.why__body{font-size:clamp(1rem,.96rem + .25vw,1.1rem)}
.why__lead{font-size:1.22em;font-weight:600}
.why__body strong{box-shadow:inset 0 -.42em 0 color-mix(in srgb,var(--sun) 70%,transparent)}
.why__facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;max-width:var(--maxw);margin:clamp(2.5rem,5vw,4rem) auto 0;border-top:2px solid var(--ink)}
.why__facts li{display:flex;flex-direction:column;gap:.5rem;padding:1.3rem 1.3rem 1.3rem 0;border-right:2px solid var(--ink);padding-right:1.3rem}
.why__facts li:last-child{border-right:0}
.why__facts li:not(:first-child){padding-left:1.3rem}
.why__num{font-family:var(--f-display);font-size:2.6rem;line-height:.8;color:var(--bone)}
.why__facts span:last-child{font-size:.95rem;line-height:1.45}

/* ---------- 14. CARRY (menu-board rows) ---------- */
.carry{padding:clamp(3.5rem,7vw,7rem) var(--pad);max-width:var(--maxw);margin:0 auto}
.carry .sechead{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1.5rem,4vw,4rem);align-items:end}
.carry .sechead .eyebrow{grid-column:1/-1}
.cat{border-top:3px solid var(--ink)}
.cat__row{
  display:grid;
  grid-template-columns:auto 84px minmax(0,1fr) 240px;
  gap:clamp(.8rem,1.6vw,1.5rem);align-items:start;
  padding:clamp(1.3rem,2.4vw,2.1rem) 0;
  border-bottom:1px solid color-mix(in srgb,var(--ink) 25%,transparent);
  position:relative;
}
.cat__row::before{content:"";position:absolute;inset:0 -1.2rem;background:var(--leaf-bright);opacity:0;transition:opacity .22s ease;z-index:-1}
.cat__row:hover::before{opacity:.16}
.cat__n{font-family:var(--f-mono);font-size:.78rem;font-weight:700;letter-spacing:.1em;color:var(--chile);padding-top:.55rem}
.cat__ico{
  width:84px;height:84px;color:var(--leaf-deep);
  border:2px solid var(--ink);border-radius:50%;background:var(--bone-2);
  display:grid;place-items:center;padding:8px;
  box-shadow:3px 3px 0 var(--ink);
  transition:transform .3s cubic-bezier(.2,.9,.3,1.3),background .25s ease;
}
.cat__row:hover .cat__ico{transform:rotate(-8deg) scale(1.06);background:var(--sun)}
.cat__body h3{font-family:var(--f-display);text-transform:uppercase;font-size:clamp(1.7rem,1.1rem + 2.1vw,3.1rem);letter-spacing:-.005em;margin-bottom:.5rem}
.cat__body p{font-size:1rem;max-width:60ch;color:color-mix(in srgb,var(--ink) 88%,transparent)}
.cat__meta{
  display:grid;grid-template-columns:auto;gap:.1rem;
  font-family:var(--f-mono);font-size:.76rem;line-height:1.45;
  border-left:2px solid var(--ink);padding-left:1rem;
}
.cat__meta b{display:block;font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;color:color-mix(in srgb,var(--ink) 52%,transparent);margin-top:.5rem}
.cat__meta b:first-child{margin-top:0}
.carry__foot{margin-top:2rem;font-size:.95rem;max-width:70ch;color:color-mix(in srgb,var(--ink) 75%,transparent)}
.carry__foot strong{color:var(--chile-deep)}

/* ---------- 15. SPECTRUM ---------- */
.spec{background:var(--ink);color:var(--bone);padding:clamp(3.5rem,7vw,7rem) var(--pad);border-bottom:2px solid var(--ink)}
.spec__inner{max-width:var(--maxw);margin-inline:auto}
.spec__h{font-family:var(--f-display);text-transform:uppercase;font-size:clamp(2.2rem,1rem + 5.4vw,5.2rem);margin-bottom:1.5rem}
.spec__h span{color:var(--sun)}
.spec__lede{max-width:70ch;font-size:clamp(1rem,.96rem + .3vw,1.15rem);color:color-mix(in srgb,var(--bone) 82%,transparent);margin-bottom:clamp(2rem,4vw,3rem)}
.spec__bar{display:flex;border:2px solid var(--bone);border-radius:999px;overflow:hidden;font-family:var(--f-mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700}
/* All three labels share one colour (ink) and every background they sit on is
   light enough to clear 6:1 — including the whole hybrid gradient run. */
.spec__seg{padding:.85rem 1rem;text-align:center;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.spec__seg--i{background:#A98BE8;flex:0 0 20%}
.spec__seg--h{background:linear-gradient(90deg,#A98BE8,var(--leaf-bright),var(--sun));flex:1 1 0}
.spec__seg--s{background:var(--sun);flex:0 0 20%}
.spec__ticks{display:flex;justify-content:space-between;font-family:var(--f-mono);font-size:.64rem;letter-spacing:.15em;text-transform:uppercase;opacity:.55;margin:.6rem .4rem 0}
.spec__cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.2rem,3vw,2.6rem);margin-top:clamp(2rem,4vw,3.2rem)}
.spec__cols article{border-top:2px solid color-mix(in srgb,var(--bone) 35%,transparent);padding-top:1.1rem}
.spec__cols p{color:color-mix(in srgb,var(--bone) 78%,transparent);font-size:.98rem}
.spec__tag{display:inline-block;font-family:var(--f-display);text-transform:uppercase;font-size:clamp(1.5rem,1rem + 1.6vw,2.4rem);margin-bottom:.5rem}
.spec__tag--i{color:#A98BE8}.spec__tag--h{color:var(--leaf-bright)}.spec__tag--s{color:var(--sun)}
.spec__foot{margin-top:clamp(2rem,4vw,3rem);border-left:4px solid var(--sun);padding:.4rem 0 .4rem 1.3rem;max-width:82ch;font-size:1.02rem;color:color-mix(in srgb,var(--bone) 86%,transparent)}

/* ---------- 16. LABEL ---------- */
.label{position:relative;background:var(--bone-2);padding:clamp(3.5rem,7vw,7rem) var(--pad);border-bottom:2px solid var(--ink)}
.label .ridge{color:var(--bone-2)}
.label__wrap{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:clamp(2rem,5vw,5rem);align-items:start;max-width:var(--maxw);margin:0 auto}
.label__card{
  position:relative;background:var(--bone);border:3px solid var(--ink);
  padding:1.5rem 1.5rem 1.3rem;box-shadow:var(--sh-3);transform:rotate(-2deg);
  max-width:420px;
}
.label__cardhead{display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid var(--ink);padding-bottom:.6rem;margin-bottom:1rem}
.label__brandline{font-family:var(--f-mono);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:color-mix(in srgb,var(--ink) 55%,transparent)}
.label__ill{width:30px;color:var(--leaf-deep)}
.label__name{font-family:var(--f-display);text-transform:uppercase;font-size:1.9rem;line-height:.95;margin:0 0 .2rem;color:color-mix(in srgb,var(--ink) 35%,transparent)}
.label__type{font-family:var(--f-mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;margin:0 0 1rem;color:color-mix(in srgb,var(--ink) 55%,transparent)}
.label__fields{display:grid;grid-template-columns:1fr 1fr;gap:.1rem;border-top:1px dashed var(--ink);margin:0}
.label__fields>div{padding:.55rem .2rem;border-bottom:1px dashed color-mix(in srgb,var(--ink) 40%,transparent)}
.label__fields>div:nth-child(4),.label__fields>div:nth-child(5),.label__fields>div:nth-child(6){grid-column:span 2}
.label__fields dt{font-family:var(--f-mono);font-size:.58rem;letter-spacing:.15em;text-transform:uppercase;color:var(--chile)}
.label__fields dd{margin:.15rem 0 0;font-family:var(--f-mono);font-size:.86rem;font-weight:700}
.label__warn{margin:.9rem 0 0;font-family:var(--f-mono);font-size:.56rem;line-height:1.5;letter-spacing:.06em;text-transform:uppercase;border-top:2px solid var(--ink);padding-top:.6rem}
.label__stamp{
  position:absolute;right:-22px;bottom:-26px;
  background:var(--chile);color:var(--bone);border:2px solid var(--ink);
  font-family:var(--f-mono);font-size:.62rem;line-height:1.3;letter-spacing:.12em;text-transform:uppercase;font-weight:700;
  padding:.55rem .8rem;transform:rotate(6deg);box-shadow:var(--sh-2);text-align:center;
}
.label__caption{margin:3rem 0 0;font-family:var(--f-mono);font-size:.68rem;line-height:1.6;letter-spacing:.05em;color:color-mix(in srgb,var(--ink) 62%,transparent);max-width:38ch}
.label__h{font-family:var(--f-display);text-transform:uppercase;font-size:clamp(2.6rem,1.2rem + 6vw,6rem);margin-bottom:1.8rem}
.notes{display:grid;gap:1.4rem}
.notes li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:1.1rem;align-items:start;border-top:2px solid var(--ink);padding-top:1.1rem}
.notes__n{
  width:38px;height:38px;flex:none;border-radius:50%;background:var(--ink);color:var(--bone);
  display:grid;place-items:center;font-family:var(--f-mono);font-weight:700;font-size:.9rem;
}
.notes h3{font-size:1.18rem;font-family:var(--f-body);font-weight:700;letter-spacing:0;line-height:1.3;margin-bottom:.35rem}
.notes p{font-size:.98rem;color:color-mix(in srgb,var(--ink) 82%,transparent)}
.label__ps{margin-top:1.8rem;font-size:1rem;font-weight:600;border-left:4px solid var(--chile);padding-left:1.1rem}

/* ---------- 17. FIRST VISIT ---------- */
.first{
  position:relative;background:var(--ink-2);color:var(--bone);
  padding:clamp(3.5rem,7vw,7rem) var(--pad);border-bottom:2px solid var(--ink);
  background-image:
    radial-gradient(circle at 82% 8%, color-mix(in srgb,var(--clay) 42%,transparent) 0%, transparent 46%),
    linear-gradient(180deg,var(--ink-2),var(--ink));
}
.first__head{
  display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);
  gap:clamp(1.6rem,4vw,4rem);align-items:end;
  max-width:var(--maxw);margin:0 auto;padding-bottom:clamp(2rem,4vw,3.4rem);
}
.first__lede{max-width:52ch;margin-top:1.4rem;font-size:1.08rem;color:color-mix(in srgb,var(--bone) 80%,transparent)}

/* the "bring this" ID card — a crafted object, not a photo frame */
.idcard{
  background:var(--bone);color:var(--ink);border:3px solid var(--ink);border-radius:14px;
  padding:1.1rem 1.2rem 1rem;box-shadow:var(--sh-3);transform:rotate(1.8deg);max-width:400px;margin-left:auto;
}
.idcard__top{
  font-family:var(--f-mono);font-size:.66rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  border-bottom:2px solid var(--ink);padding-bottom:.55rem;margin:0 0 .9rem;display:flex;justify-content:space-between;gap:.6rem;
}
.idcard__top span{color:var(--chile)}
.idcard__body{display:grid;grid-template-columns:auto minmax(0,1fr);gap:1rem;align-items:start}
.idcard__photo{width:62px;color:var(--ink-3);flex:none}
.idcard__body dl{margin:0;display:grid;gap:.5rem}
.idcard__body dt{font-family:var(--f-mono);font-size:.55rem;letter-spacing:.16em;text-transform:uppercase;color:var(--chile)}
.idcard__body dd{margin:0;font-family:var(--f-mono);font-size:.86rem;font-weight:700;line-height:1.2}
.idcard__big{font-family:var(--f-display) !important;font-size:2.2rem !important;line-height:.9}
.idcard__foot{
  margin:.9rem 0 0;border-top:1px dashed var(--ink);padding-top:.6rem;
  font-family:var(--f-mono);font-size:.56rem;letter-spacing:.09em;text-transform:uppercase;line-height:1.7;
}
.steps{
  max-width:var(--maxw);margin:0 auto;position:relative;
  display:grid;gap:0;
  border-left:2px dashed color-mix(in srgb,var(--sun) 55%,transparent);
  padding-left:clamp(1.2rem,3vw,3rem);
}
.steps__i{position:relative;padding:clamp(1.4rem,2.6vw,2.2rem) 0;border-bottom:1px solid color-mix(in srgb,var(--bone) 16%,transparent);display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(1rem,3vw,2.6rem);align-items:start}
.steps__i:last-child{border-bottom:0}
.steps__i::before{
  content:"";position:absolute;left:calc(clamp(1.2rem,3vw,3rem) * -1 - 9px);top:calc(clamp(1.4rem,2.6vw,2.2rem) + .55rem);
  width:16px;height:16px;border-radius:50%;background:var(--sun);border:2px solid var(--ink-2);
}
.steps__n{font-family:var(--f-display);font-size:clamp(2.6rem,1.4rem + 4.4vw,5.4rem);line-height:.85;color:transparent;-webkit-text-stroke:2px var(--sun);min-width:2.2em}
.steps__i h3{font-family:var(--f-display);text-transform:uppercase;font-size:clamp(1.4rem,1rem + 1.5vw,2.3rem);line-height:1;margin-bottom:.6rem;color:var(--bone)}
.steps__i p{color:color-mix(in srgb,var(--bone) 80%,transparent);max-width:70ch}
.steps__i em{color:var(--sun);font-style:italic}

/* ---------- 18. DRIVE-THRU ---------- */
.dt{
  display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
  gap:clamp(2rem,5vw,5rem);align-items:center;
  padding:clamp(3.5rem,7vw,7rem) var(--pad);max-width:var(--maxw);margin:0 auto;
}
.dt__h{font-family:var(--f-display);text-transform:uppercase;font-size:clamp(2.8rem,1.2rem + 6.6vw,6.4rem);margin-bottom:1.4rem}
.dt__h span{color:var(--chile)}
.dt__lede{max-width:56ch;font-size:1.08rem;margin-bottom:2rem}
.dt__how{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.4rem}
.dt__how article{border:2px solid var(--ink);border-radius:14px;padding:1.2rem 1.2rem 1.3rem;background:var(--bone-2);box-shadow:var(--sh-2)}
.dt__how h3{display:flex;align-items:center;gap:.6rem;font-family:var(--f-display);text-transform:uppercase;font-size:1.5rem;margin-bottom:.9rem}
.dt__how h3 span{width:28px;height:28px;border-radius:50%;background:var(--ink);color:var(--bone);display:grid;place-items:center;font-size:.9rem;font-family:var(--f-mono);flex:none}
.dt__how ol{counter-reset:s;display:grid;gap:.55rem}
.dt__how li{counter-increment:s;position:relative;padding-left:1.6rem;font-size:.93rem;line-height:1.5}
.dt__how li::before{content:counter(s);position:absolute;left:0;top:.05rem;font-family:var(--f-mono);font-size:.7rem;font-weight:700;color:var(--chile)}
.dt__note{margin-top:1.4rem;font-family:var(--f-mono);font-size:.72rem;letter-spacing:.09em;text-transform:uppercase;color:color-mix(in srgb,var(--ink) 62%,transparent)}
.dt__art{border:3px solid var(--ink);border-radius:22px;overflow:hidden;box-shadow:var(--sh-3)}

/* ---------- 19. PAYMENTS ---------- */
.pay{background:var(--sand);border-block:2px solid var(--ink);padding:clamp(3.5rem,7vw,7rem) var(--pad);
  background-image:repeating-linear-gradient(45deg,transparent 0 22px,color-mix(in srgb,var(--clay) 9%,transparent) 22px 44px)}
.pay>.eyebrow{max-width:var(--maxw);margin-inline:auto}
.pay__wrap{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(2rem,5vw,5rem);align-items:start;max-width:var(--maxw);margin:0 auto}
.pay__h{font-family:var(--f-display);text-transform:uppercase;font-size:clamp(2.8rem,1.4rem + 6.4vw,6.4rem);margin-bottom:1.3rem}
.pay__copy>p{max-width:56ch;font-size:1.06rem}
.pay__list{display:grid;gap:.1rem;margin:1.6rem 0;border-top:2px solid var(--ink)}
.pay__list li{padding:.85rem 0;border-bottom:1px solid color-mix(in srgb,var(--ink) 28%,transparent);font-size:1.02rem}
.pay__list b{font-family:var(--f-display);text-transform:uppercase;font-size:1.35rem;letter-spacing:.01em;margin-right:.6rem;vertical-align:baseline}
.pay__list strong{background:var(--chile);color:var(--bone);padding:.05em .35em}
.pay__tip{font-weight:600;border-left:4px solid var(--ink);padding-left:1rem;max-width:50ch}
.rcpt{
  background:var(--bone);border:2px solid var(--ink);max-width:340px;margin-left:auto;
  padding:1.5rem 1.3rem 1.1rem;font-family:var(--f-mono);font-size:.72rem;line-height:1.6;
  box-shadow:var(--sh-3);transform:rotate(1.6deg);
  -webkit-mask-image:radial-gradient(circle at 6px 100%, transparent 6px, #000 6.5px), none;
}
.rcpt__logo{font-family:var(--f-display);font-size:2.1rem;text-align:center;margin:0 0 .3rem;letter-spacing:.02em}
.rcpt__sub{text-align:center;font-size:.62rem;letter-spacing:.08em;margin:0 0 .9rem;color:color-mix(in srgb,var(--ink) 65%,transparent)}
.rcpt hr{border:0;border-top:1px dashed var(--ink);margin:.7rem 0}
.rcpt__row{display:flex;justify-content:space-between;gap:1rem;margin:0 0 .2rem;letter-spacing:.05em}
.rcpt__row--big{font-size:.95rem;font-weight:700}
.rcpt__foot{text-align:center;font-size:.56rem;letter-spacing:.1em;line-height:1.7;margin:.6rem 0 .8rem}
.rcpt__barcode{display:flex;gap:2px;justify-content:center;height:34px;margin:0 0 .5rem}
.rcpt__barcode span{display:block;width:3px;background:var(--ink)}
.rcpt__barcode span:nth-child(3n){width:5px}
.rcpt__barcode span:nth-child(4n){width:1px}
.rcpt__barcode span:nth-child(5n){height:70%;align-self:flex-start}
.rcpt__thanks{text-align:center;font-size:.6rem;letter-spacing:.14em;margin:0}

/* ---------- 20. NM 101 ---------- */
.nm{position:relative;background:var(--ink);color:var(--bone);padding:clamp(3.5rem,7vw,7rem) var(--pad) clamp(3rem,6vw,5rem)}
.nm .ridge{color:var(--ink)}
.nm__head{position:relative;max-width:var(--maxw);margin:0 auto clamp(2.4rem,5vw,4rem)}
.nm__h{font-family:var(--f-display);text-transform:uppercase;font-size:clamp(2.8rem,1.2rem + 7.4vw,7.4rem);margin-bottom:1.4rem}
.nm__lede{max-width:56ch;font-size:1.08rem;color:color-mix(in srgb,var(--bone) 82%,transparent)}
.nm__stamp{position:absolute;right:0;top:0;width:clamp(96px,13vw,170px);color:var(--sun);opacity:.9}
.nm__facts{
  position:absolute;right:0;top:clamp(120px,15vw,200px);width:min(340px,42%);margin:0;
  border-top:2px solid color-mix(in srgb,var(--bone) 35%,transparent);
}
.nm__facts > div{display:flex;justify-content:space-between;gap:1rem;padding:.5rem 0;border-bottom:1px solid color-mix(in srgb,var(--bone) 15%,transparent)}
.nm__facts dt{font-family:var(--f-mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:color-mix(in srgb,var(--bone) 50%,transparent)}
.nm__facts dd{margin:0;font-family:var(--f-mono);font-size:.72rem;font-weight:700;text-align:right;color:var(--bone)}
.rules{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(2rem,4vw,4rem);max-width:var(--maxw);margin:0 auto;border-top:2px solid color-mix(in srgb,var(--bone) 30%,transparent)}
.rules li{padding:1.6rem 0;border-bottom:1px solid color-mix(in srgb,var(--bone) 16%,transparent);position:relative}
.rules__n{font-family:var(--f-display);font-size:1.4rem;color:var(--chile);display:block;margin-bottom:.4rem;letter-spacing:.06em}
.rules h3{font-family:var(--f-display);text-transform:uppercase;font-size:clamp(1.25rem,1rem + 1.1vw,1.9rem);line-height:1;margin-bottom:.6rem;color:var(--sun)}
.rules p{color:color-mix(in srgb,var(--bone) 78%,transparent);font-size:.98rem;max-width:56ch}
.nm__foot{max-width:var(--maxw);margin:1.8rem auto 0;font-family:var(--f-mono);font-size:.68rem;line-height:1.7;letter-spacing:.06em;color:color-mix(in srgb,var(--bone) 55%,transparent)}

/* ---------- 21. COMPLIANCE BAND ---------- */
/* Mandated warnings. Ground is chile-deep, not chile, so body copy clears 6:1
   and the mono sub-labels clear it too — these are the legible disclosures. */
.comply{background:var(--chile-deep);color:var(--bone);border-block:3px solid var(--ink);padding:clamp(2.6rem,5vw,4.4rem) var(--pad)}
.comply__h{font-family:var(--f-display);text-transform:uppercase;font-size:clamp(2.2rem,1rem + 6vw,5.6rem);max-width:var(--maxw);margin:0 auto 1.8rem;text-align:center}
.comply__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(1rem,2.5vw,2.2rem);max-width:var(--maxw);margin:0 auto}
.comply__grid p{font-size:.98rem;line-height:1.55;border-top:2px solid var(--bone);padding-top:.9rem}
.comply__grid b{display:block;font-family:var(--f-mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;margin-bottom:.35rem;color:var(--bone)}

/* ---------- 22. VISIT ---------- */
.visit{padding:clamp(3.5rem,7vw,7rem) var(--pad);max-width:var(--maxw);margin:0 auto}
.visit__h{font-family:var(--f-display);text-transform:uppercase;font-size:clamp(2.6rem,1.2rem + 6.6vw,6.6rem);margin-bottom:clamp(2rem,4vw,3.2rem)}
.visit__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.6rem}
.visit__card{border:2px solid var(--ink);border-radius:18px;padding:1.6rem;background:var(--bone-2);box-shadow:var(--sh-2)}
.visit__card--nap{background:var(--leaf-bright)}
.visit__card--hours{background:var(--bone)}
.visit__card--amen{background:var(--ink);color:var(--bone)}
.visit__sub{font-family:var(--f-mono);font-size:.66rem;letter-spacing:.19em;text-transform:uppercase;margin-bottom:1.1rem;opacity:.7}
.nap{font-style:normal;font-size:1.06rem;line-height:1.5;margin-bottom:1.3rem}
.nap__name{display:block;font-family:var(--f-display);text-transform:uppercase;font-size:1.8rem;line-height:1;margin-bottom:.5rem}
.nap__links{margin:0 0 1.3rem}
.nap__dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.4rem .9rem;margin:0;border-top:2px solid var(--ink);padding-top:1rem;font-size:.95rem}
.nap__dl dt{font-family:var(--f-mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;padding-top:.28rem;opacity:.72}
.nap__dl dd{margin:0;font-weight:600;overflow-wrap:anywhere}
.hours{font-size:.98rem}
.hours th,.hours td{text-align:left;padding:.5rem 0;border-bottom:1px solid color-mix(in srgb,var(--ink) 20%,transparent);font-weight:500}
.hours th{font-family:var(--f-mono);font-size:.74rem;letter-spacing:.09em;text-transform:uppercase}
.hours td{text-align:right;font-family:var(--f-mono);font-size:.8rem}
.hours tr.is-today th,.hours tr.is-today td{background:var(--sun);font-weight:700}
.hours tr.is-today th{padding-left:.5rem}
.hours tr.is-today td{padding-right:.5rem}
.hours__note{margin-top:1rem;font-size:.9rem;color:color-mix(in srgb,var(--ink) 70%,transparent)}
.chips{display:flex;flex-wrap:wrap;gap:.45rem;margin-bottom:1.2rem}
.chips li{border:1px solid color-mix(in srgb,var(--bone) 38%,transparent);border-radius:999px;padding:.35rem .8rem;font-family:var(--f-mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase}
.visit__ps{font-size:.95rem;color:color-mix(in srgb,var(--bone) 76%,transparent)}

/* ---------- 23. FAQ ---------- */
.faq{background:var(--bone-2);border-top:2px solid var(--ink);padding:clamp(3.5rem,7vw,7rem) var(--pad)}
.faq .sechead{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1.5rem,4vw,4rem);align-items:end;max-width:var(--maxw);margin:0 auto}
.faq__side{display:flex;align-items:flex-end;gap:clamp(1rem,2.5vw,2rem);padding-bottom:.6rem}
.faq__stamp{width:clamp(110px,13vw,170px);flex:none;color:var(--chile-deep)}
/* only the ring of type rotates — the numeral stays readable */
.spinring{transform-origin:50% 50%;animation:spin 30s linear infinite}
.faq__aside{max-width:36ch;font-size:1.05rem}
.faq__list{max-width:var(--maxw);margin:0 auto;border-top:3px solid var(--ink);columns:2;column-gap:clamp(1.6rem,4vw,4rem)}
.qa{break-inside:avoid;border-bottom:1px solid color-mix(in srgb,var(--ink) 25%,transparent);display:block}
.qa summary{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:1.05rem 0;cursor:pointer;list-style:none;
}
.qa summary::-webkit-details-marker{display:none}
.qa__q{font-family:var(--f-display);text-transform:uppercase;font-size:clamp(1.05rem,.95rem + .6vw,1.5rem);line-height:1.05;letter-spacing:.005em}
.qa__ico{position:relative;width:26px;height:26px;flex:none;border:2px solid var(--ink);border-radius:50%;transition:background .2s ease,transform .25s ease}
.qa__ico::before,.qa__ico::after{content:"";position:absolute;left:50%;top:50%;background:var(--ink);transition:transform .25s ease}
.qa__ico::before{width:11px;height:2px;transform:translate(-50%,-50%)}
.qa__ico::after{width:2px;height:11px;transform:translate(-50%,-50%)}
.qa[open] .qa__ico{background:var(--chile);transform:rotate(90deg)}
.qa[open] .qa__ico::before,.qa[open] .qa__ico::after{background:var(--bone)}
.qa[open] .qa__ico::after{transform:translate(-50%,-50%) scaleY(0)}
.qa summary:hover .qa__q{color:var(--chile-deep)}
.qa__a{padding:0 0 1.2rem;max-width:56ch}
.qa__a p{font-size:.98rem;color:color-mix(in srgb,var(--ink) 84%,transparent)}
.qa__a strong{background:color-mix(in srgb,var(--sun) 55%,transparent);padding:.05em .25em}

/* ---------- 24. SIGNUP ---------- */
.signup{background:var(--leaf);border-top:3px solid var(--ink);overflow:hidden;position:relative}
.signup__inner{position:relative;padding:clamp(3.5rem,7vw,6.5rem) var(--pad) clamp(2.5rem,5vw,4rem);max-width:var(--maxw);margin:0 auto}
/* the day-arc closes: the page opened on a sunrise, it ends on a moon */
.signup__night{position:absolute;right:var(--pad);top:clamp(2.5rem,6vw,5rem);width:clamp(180px,26vw,360px);z-index:0}
.signup__nightcap{margin:.9rem 0 0;text-align:center;font-family:var(--f-mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:color-mix(in srgb,var(--ink) 72%,transparent)}
.signup__inner > *:not(.signup__night){position:relative;z-index:1}
.signup__h{font-family:var(--f-display);text-transform:uppercase;font-size:clamp(3rem,1.4rem + 8vw,8rem);margin-bottom:1.3rem}
.signup__lede{max-width:48ch;font-size:1.1rem;margin-bottom:2.2rem}
.join{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:1rem;align-items:end;max-width:920px}
.join__field label{display:block;font-family:var(--f-mono);font-size:.66rem;letter-spacing:.15em;text-transform:uppercase;margin-bottom:.45rem}
.join__field label span{opacity:.6;text-transform:none;letter-spacing:.05em}
.join__field input{
  width:100%;padding:.9rem 1rem;border:2px solid var(--ink);border-radius:999px;
  background:var(--bone);font-family:var(--f-body);font-size:1rem;color:var(--ink);
}
.join__field input::placeholder{color:color-mix(in srgb,var(--ink) 42%,transparent)}
.join__field input:invalid:not(:placeholder-shown){border-color:var(--chile-deep)}
.join__honest{grid-column:1/-1;font-size:.88rem;max-width:66ch;margin:.4rem 0 0;color:color-mix(in srgb,var(--ink) 82%,transparent)}
.join__status{grid-column:1/-1;margin:.3rem 0 0;font-family:var(--f-mono);font-size:.74rem;letter-spacing:.08em;text-transform:uppercase;min-height:1.2em}
/* The form is a made object like every other right-hand element on the page. */
.join{
  border:3px solid var(--ink);border-radius:6px;background:var(--bone-2);
  box-shadow:var(--sh-2);padding:clamp(1.1rem,2.6vw,1.7rem);
}
/* Fills the flat-green void under the night circle with a plate of real,
   confirmed facts — the closing CTA keeps the page's object habit. */
.signup__plate{
  margin-top:1.5rem;border:3px solid var(--ink);background:var(--bone);
  box-shadow:var(--sh-2);padding:1rem 1.1rem 1.1rem;transform:rotate(-1.6deg);
}
.signup__plate-h{font-family:var(--f-display);text-transform:uppercase;font-size:1.55rem;line-height:1;margin:0 0 .7rem}
.signup__plate ul{
  display:grid;gap:.42rem;border-top:2px solid var(--ink);padding-top:.65rem;
  font-family:var(--f-mono);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;
}
.signup__plate-f{
  margin:.75rem 0 0;border-top:2px solid var(--ink);padding-top:.55rem;
  font-family:var(--f-mono);font-size:.64rem;letter-spacing:.06em;line-height:1.6;
  color:color-mix(in srgb,var(--ink) 72%,transparent);
}
@media (max-width:1023px){.signup__plate{display:none}}
/* Keep the form clear of the illustration column on wide screens. */
@media (min-width:1024px){
  .join{max-width:calc(100% - clamp(180px,26vw,360px) - 3rem)}
}
.signup__alt{margin-top:1.8rem;font-size:.95rem}
.signup__type{border-top:3px solid var(--ink);color:var(--ink);opacity:.22}
.signup__type .marquee__row{color:transparent;-webkit-text-stroke:2px var(--ink)}

/* ---------- 25. FOOTER ---------- */
.ftr{position:relative;background:var(--ink);color:var(--bone);padding:clamp(3rem,6vw,5rem) var(--pad) 2rem}
.ftr .ridge{color:var(--ink)}
.ftr__top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:clamp(1.6rem,4vw,3.4rem);max-width:var(--maxw);margin:0 auto clamp(2.4rem,5vw,3.6rem)}
.ftr__word{font-family:var(--f-display);font-size:clamp(2.6rem,1.6rem + 3vw,4rem);letter-spacing:.02em;margin:.8rem 0 .1rem;line-height:.9}
.ftr__tag{font-family:var(--f-mono);font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;color:var(--sun);margin:0 0 1rem}
.ftr__blurb{font-size:.95rem;color:color-mix(in srgb,var(--bone) 72%,transparent);max-width:38ch}
.ftr__col h2{font-family:var(--f-mono);font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--leaf-bright);margin-bottom:1.1rem;font-weight:700}
.ftr__col p{margin:0 0 .55rem;font-size:.95rem}
.ftr__col a{text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--bone) 30%,transparent);transition:color .18s ease,border-color .18s ease}
.ftr__col a:hover{color:var(--leaf-bright);border-color:var(--leaf-bright)}
.ftr__addr{font-style:normal;font-size:.95rem;line-height:1.6;margin-bottom:.8rem;color:color-mix(in srgb,var(--bone) 82%,transparent)}
.ftr__hours{font-family:var(--f-display);font-size:1.7rem;line-height:1.05}
.ftr__hours span{display:block;font-family:var(--f-mono);font-size:.64rem;letter-spacing:.13em;text-transform:uppercase;color:color-mix(in srgb,var(--bone) 60%,transparent);margin-top:.4rem}
.ftr__amen{font-size:.82rem !important;color:color-mix(in srgb,var(--bone) 65%,transparent);line-height:1.6}
.ftr__nav{display:grid;gap:.42rem}
.ftr__nav a{font-size:.9rem;border-bottom-color:transparent}
.ftr__compliance{max-width:var(--maxw);margin:0 auto;border:2px solid var(--leaf-bright);border-radius:16px;padding:clamp(1.4rem,3vw,2.2rem)}
.ftr__cbig{font-family:var(--f-display);text-transform:uppercase;font-size:clamp(1.5rem,1rem + 2.4vw,2.8rem);color:var(--sun);margin:0 0 1rem;line-height:1}
.ftr__compliance ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem clamp(1.4rem,3vw,3rem)}
.ftr__compliance li{position:relative;padding-left:1.2rem;font-size:.92rem;line-height:1.55;color:color-mix(in srgb,var(--bone) 90%,transparent)}
.ftr__compliance li::before{content:"▲";position:absolute;left:0;top:.1rem;font-size:.6rem;color:var(--chile)}
.ftr__base{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.8rem;max-width:var(--maxw);margin:2rem auto 0;padding-top:1.3rem;border-top:1px solid color-mix(in srgb,var(--bone) 20%,transparent);font-family:var(--f-mono);font-size:.66rem;letter-spacing:.11em;text-transform:uppercase;color:color-mix(in srgb,var(--bone) 58%,transparent)}
.ftr__base p{margin:0}

/* Footer site nav — the same six pages on every page, so every page is one click from every other. */
.ftr__sitenav{display:flex;flex-wrap:wrap;gap:.55rem clamp(1rem,3vw,2.4rem);max-width:var(--maxw);margin:0 auto clamp(1.8rem,4vw,2.6rem);padding-top:1.4rem;border-top:1px solid color-mix(in srgb,var(--bone) 20%,transparent)}
.ftr__sitenav a{font-family:var(--f-mono);font-size:.68rem;letter-spacing:.17em;text-transform:uppercase;font-weight:700;text-decoration:none;color:color-mix(in srgb,var(--bone) 76%,transparent);border-bottom:2px solid transparent;padding-bottom:.18rem;transition:color .18s ease,border-color .18s ease}
.ftr__sitenav a:hover,.ftr__sitenav a:focus-visible{color:var(--leaf-bright);border-bottom-color:var(--leaf-bright)}
.ftr__sitenav a[aria-current="page"]{color:var(--sun);border-bottom-color:color-mix(in srgb,var(--sun) 55%,transparent)}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:1180px){
  .nav{display:none}
  .burger{display:flex}
  .gauge{display:none}
  .why__grid,.carry .sechead,.faq .sechead,.label__wrap,.dt,.pay__wrap{grid-template-columns:minmax(0,1fr)}
  .why__facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .why__facts li:nth-child(2){border-right:0}
  .why__facts li:nth-child(3),.why__facts li:nth-child(4){border-top:2px solid var(--ink)}
  .why__facts li:nth-child(3){padding-left:0}
  .visit__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .visit__card--amen{grid-column:1/-1}
  .comply__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ftr__top{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero__art{width:min(78%,760px);opacity:.9}
  .cat__row{grid-template-columns:auto 52px minmax(0,1fr);}
  .cat__meta{grid-column:1/-1;border-left:0;border-top:2px solid var(--ink);padding-left:0;padding-top:.7rem;display:flex;flex-wrap:wrap;gap:.2rem 1.6rem;align-items:baseline}
  .cat__meta b{margin-top:0}
  .label__card{margin:0 auto}
  .label__caption{margin-top:2.4rem;margin-inline:auto;text-align:center}
  .dt__art{max-width:520px;margin:0 auto}
  .first__head{grid-template-columns:minmax(0,1fr)}
  .idcard{margin:1.5rem auto 0}
  .why__h{font-size:clamp(2.4rem,1rem + 6.4vw,4.6rem)}
}

@media (max-width:820px){
  .nm__facts{position:static;width:100%;margin-top:1.8rem}
  .nm__stamp{width:clamp(84px,16vw,120px)}
  .faq__side{flex-direction:column;align-items:flex-start;gap:1.2rem}
  .spec__cols,.rules,.faq__list{grid-template-columns:minmax(0,1fr)}
  .faq__list{columns:1}
  .rules{display:grid}
  .join{grid-template-columns:minmax(0,1fr)}
  .datastrip{grid-template-columns:repeat(2,minmax(0,1fr))}
  .datastrip>div:nth-child(2){border-right:0}
  .datastrip>div:nth-child(1),.datastrip>div:nth-child(2){border-bottom:2px solid var(--ink)}
  .dt__how{grid-template-columns:minmax(0,1fr)}
  .ftr__compliance ul{grid-template-columns:minmax(0,1fr)}
  .hero__spin{display:none}
  /* MOBILE HERO: the sign is a crafted object, not a wash. At this width it
     cannot sit at 34% behind the lede without leaving readable ghost words
     ("LEAFORO", "OPEN 10-10 DAILY", "STE 101") under real copy. So the mobile
     backdrop is landscape only — sun, rays, ridges, plants. No lettering. */
  .hero__sign,.hero__marker,.hero__suntext{display:none}
  .hero__art{width:118%;right:-9%;opacity:.5}
  .hero__art::after{background:linear-gradient(180deg,color-mix(in srgb,var(--bone) 55%,transparent),color-mix(in srgb,var(--bone) 78%,transparent))}
  .hero__midtag{font-size:.55rem}
  .spec__seg--i,.spec__seg--s{flex:0 0 30%}
  .spec__seg--h{font-size:0}
  .spec__seg--h::after{content:"HYBRID";font-size:.72rem}
}

@media (max-width:560px){
  /* three tidy columns don't fit at phone width — two do, still no ragged wrap */
  .why__stickers{grid-template-columns:repeat(2,auto);gap:.6rem .5rem}
  .comply__grid,.visit__grid,.ftr__top,.why__facts{grid-template-columns:minmax(0,1fr)}
  .visit__card--amen{grid-column:auto}
  .why__facts li{border-right:0 !important;border-top:2px solid var(--ink);padding-left:0 !important}
  .why__facts li:first-child{border-top:0}
  .cat__row{grid-template-columns:auto minmax(0,1fr)}
  .cat__ico{grid-row:1;width:44px}
  .cat__n{padding-top:.35rem}
  .cat__body{grid-column:1/-1}
  .hdr{gap:.5rem;padding-inline:1rem}
  .hdr .btn--sm{display:none}
  .brand__type strong{font-size:1.05rem}
  .brand__type em{font-size:.5rem}
  /* compact status pill — full sentence doesn't fit next to the burger */
  .hdr .status{font-size:.58rem;padding:.3rem .62rem;gap:.35rem}
  .hdr .status .status__txt{display:none}
  .hdr .status::after{content:attr(data-short);font-weight:700}
  .steps__i{grid-template-columns:minmax(0,1fr);gap:.2rem}
  .notes li{grid-template-columns:minmax(0,1fr);gap:.6rem}
  /* The card animates in from a steeper tilt, and a rotated box is wider than a
     flat one. Sized so the card PLUS its stamp still clears 375px at the start
     of that tween, not just once it settles. See initMotion() in /js/site.js,
     which also shortens the rotation on narrow screens. */
  .label__card{transform:rotate(-1.4deg);max-width:min(100%,292px)}
  .label__stamp{right:-2px;bottom:-18px;font-size:.54rem;padding:.45rem .6rem}
  .label__fields{grid-template-columns:minmax(0,1fr)}
  .label__fields>div{grid-column:span 1 !important}
  .rcpt{margin-inline:auto;transform:rotate(1deg)}
  .marquee__row--big{font-size:3rem}
  .mobnav{top:53px}
}

/* ==========================================================================
   MOTION — everything below collapses when the visitor asks it to
   ========================================================================== */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}
  .hero__spin{animation:none}
  .marquee__row{transform:none !important}
  .status.is-open .status__dot{animation:none}
}

/* ==========================================================================
   26. EDUCATION — /education "The Field Guide"
   Same system as the landing page: bone / ink / leaf / sand bands, Anton
   headings, mono eyebrows, hard offset shadows, SVG + type only (no photos).
   Every selector below is namespaced `edu-` so nothing here can reach back
   into the landing page. Existing classes (.sechead, .eyebrow, .qa, .steps,
   .rules, .notes, .cat, .comply, .btn, .sticker, .ridge) are reused as-is.
   ========================================================================== */

/* size modifiers so 27 sections of Anton don't all shout at 8.5rem */
.sechead__h--md{font-size:clamp(2.1rem,1.2rem + 4.2vw,4.4rem)}
.sechead__h--sm{font-size:clamp(1.8rem,1.1rem + 3vw,3.1rem)}
/* Anton at line-height:1 has no descender room; on this page the headings sit
   directly above body copy rather than inside a padded .sechead wrapper. */
.edu-sec .sechead__h,.edu-end .edu-end__h{margin-bottom:clamp(1.1rem,2.2vw,1.9rem)}
.edu-sec .sechead .sechead__h{margin-bottom:0}

/* ---- band scaffolding ---- */
.edu-sec{padding:clamp(3rem,6vw,6rem) var(--pad);border-bottom:2px solid var(--ink);position:relative}
.edu-sec--ink{background:var(--ink);color:var(--bone)}
.edu-sec--ink2{background:var(--ink-2);color:var(--bone)}
.edu-sec--leaf{background:var(--leaf);color:var(--ink)}
.edu-sec--sand{background:var(--sand);color:var(--ink);
  background-image:repeating-linear-gradient(45deg,transparent 0 22px,color-mix(in srgb,var(--clay) 8%,transparent) 22px 44px)}
.edu-sec--bone2{background:var(--bone-2)}
.edu-sec--chile{background:var(--chile-deep);color:var(--bone)}
.edu-wrap{max-width:var(--maxw);margin-inline:auto}
.edu-narrow{max-width:78ch;margin-inline:auto}
.edu-lede{max-width:68ch;font-size:clamp(1.01rem,.97rem + .28vw,1.14rem);margin-bottom:clamp(1.6rem,3vw,2.4rem)}
.edu-sec--ink .edu-lede,.edu-sec--ink2 .edu-lede,.edu-sec--chile .edu-lede{color:color-mix(in srgb,var(--bone) 84%,transparent)}
.edu-body{max-width:72ch}
.edu-body p{font-size:1.01rem}
.edu-sec--ink .edu-body p,.edu-sec--ink2 .edu-body p{color:color-mix(in srgb,var(--bone) 82%,transparent)}
.edu-sec--ink a,.edu-sec--ink2 a,.edu-sec--chile a{color:var(--leaf-bright)}
.edu-hr{border:0;border-top:2px solid color-mix(in srgb,var(--ink) 28%,transparent);margin:clamp(2rem,4vw,3rem) 0}
.edu-sec--ink .edu-hr,.edu-sec--ink2 .edu-hr{border-top-color:color-mix(in srgb,var(--bone) 26%,transparent)}

/* ---- masthead ---- */
.edu-mast{position:relative;overflow:hidden;background:var(--ink);color:var(--bone);
  padding:clamp(2.6rem,5vw,5rem) var(--pad) clamp(2.6rem,5vw,4.2rem);border-bottom:3px solid var(--ink)}
.edu-mast__grid{display:grid;grid-template-columns:minmax(0,1.22fr) minmax(0,.78fr);
  gap:clamp(1.8rem,4vw,4rem);align-items:center;max-width:var(--maxw);margin-inline:auto}
.edu-crumb{font-family:var(--f-mono);font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;
  color:color-mix(in srgb,var(--bone) 58%,transparent);margin-bottom:1.3rem}
.edu-crumb a{color:var(--leaf-bright);text-decoration:none;border-bottom:1px solid transparent}
.edu-crumb a:hover{border-bottom-color:var(--leaf-bright)}
.edu-mast__h{font-family:var(--f-display);text-transform:uppercase;line-height:1;
  font-size:clamp(2.2rem,.9rem + 5.2vw,5.2rem);letter-spacing:-.015em;margin-bottom:1.2rem}
.edu-mast__h span{display:block;color:var(--sun)}
.edu-mast__lede{max-width:56ch;font-size:clamp(1.04rem,1rem + .35vw,1.22rem);
  color:color-mix(in srgb,var(--bone) 84%,transparent);margin-bottom:1.6rem}
.edu-mast__cta{display:flex;flex-wrap:wrap;gap:.8rem;margin-bottom:1.5rem}
.edu-mast__fine{font-family:var(--f-mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;
  line-height:1.8;color:color-mix(in srgb,var(--bone) 62%,transparent);max-width:46ch}
.edu-plate{border:3px solid var(--bone);border-radius:20px;padding:1.1rem;background:var(--ink-2);
  box-shadow:10px 10px 0 color-mix(in srgb,var(--leaf) 55%,transparent)}
.edu-plate svg{width:100%;height:auto;display:block}
.edu-plate__cap{font-family:var(--f-mono);font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;
  text-align:center;margin:.9rem 0 0;color:color-mix(in srgb,var(--bone) 60%,transparent)}

/* ---- table of contents ---- */
.edu-toc{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;
  border-top:3px solid var(--ink);max-width:var(--maxw);margin-inline:auto}
.edu-toc a{display:flex;gap:.7rem;align-items:baseline;text-decoration:none;
  padding:.85rem 1rem .85rem 0;border-bottom:1px solid color-mix(in srgb,var(--ink) 22%,transparent);
  border-right:1px solid color-mix(in srgb,var(--ink) 22%,transparent);font-size:.95rem;line-height:1.35}
.edu-toc a:hover{background:var(--leaf-bright)}
.edu-toc a:nth-child(4n){border-right:0}
.edu-toc b{font-family:var(--f-mono);font-size:.66rem;font-weight:700;letter-spacing:.1em;color:var(--chile);flex:none}
.edu-toc a:not(:first-child){padding-left:1rem}

/* ---- generic card grids ---- */
.edu-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1.1rem,2.6vw,2.2rem)}
.edu-cols--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.edu-cols--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.edu-cols--split{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:start}
.edu-card{border:2px solid var(--ink);border-radius:16px;padding:clamp(1.1rem,2.2vw,1.6rem);
  background:var(--bone-2);box-shadow:var(--sh-2);color:var(--ink)}
.edu-card--bone{background:var(--bone)}
.edu-card--leaf{background:var(--leaf-bright)}
.edu-card--sun{background:var(--sun)}
.edu-card--ink{background:var(--ink);color:var(--bone);border-color:var(--bone);box-shadow:6px 6px 0 color-mix(in srgb,var(--bone) 22%,transparent)}
.edu-card h3{font-family:var(--f-display);text-transform:uppercase;line-height:1.02;
  font-size:clamp(1.25rem,1rem + 1.1vw,1.85rem);margin-bottom:.6rem}
.edu-card p{font-size:.97rem}
.edu-card p:last-child{margin-bottom:0}
.edu-card ul{display:grid;gap:.45rem;margin-top:.7rem}
.edu-card ul li{position:relative;padding-left:1.1rem;font-size:.94rem;line-height:1.5}
.edu-card ul li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.6}
.edu-card__k{font-family:var(--f-mono);font-size:.6rem;letter-spacing:.17em;text-transform:uppercase;
  display:block;margin-bottom:.5rem;color:var(--chile)}
.edu-card--ink .edu-card__k{color:var(--sun)}
.edu-card--leaf .edu-card__k,.edu-card--sun .edu-card__k{color:var(--ink)}

/* ---- callouts ---- */
.edu-note{border-left:5px solid var(--chile);padding:.4rem 0 .4rem 1.2rem;max-width:76ch;
  margin:clamp(1.4rem,3vw,2.2rem) 0;font-size:1.02rem}
.edu-note--sun{border-left-color:var(--sun)}
.edu-note--leaf{border-left-color:var(--leaf-bright)}
.edu-note b{font-family:var(--f-mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;
  display:block;margin-bottom:.35rem}
.edu-fine{font-family:var(--f-mono);font-size:.7rem;line-height:1.75;letter-spacing:.06em;
  color:color-mix(in srgb,var(--ink) 62%,transparent);max-width:88ch}
.edu-sec--ink .edu-fine,.edu-sec--ink2 .edu-fine,.edu-sec--chile .edu-fine{color:color-mix(in srgb,var(--bone) 60%,transparent)}

/* ---- checklist ---- */
.edu-check{display:grid;gap:.1rem;border-top:2px solid var(--ink);max-width:70ch}
.edu-check li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.9rem;align-items:start;
  padding:.85rem 0;border-bottom:1px solid color-mix(in srgb,var(--ink) 25%,transparent);font-size:1rem}
.edu-check li::before{content:"";width:20px;height:20px;margin-top:.2rem;border:2px solid currentColor;
  border-radius:5px;flex:none;
  background-color:var(--leaf-bright);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4.5 12.6l5 5.2L19.5 6.6' fill='none' stroke='%2312150F' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size:78% 78%;background-position:center;background-repeat:no-repeat}
.edu-sec--ink .edu-check,.edu-sec--ink2 .edu-check{border-top-color:color-mix(in srgb,var(--bone) 40%,transparent)}
.edu-sec--ink .edu-check li,.edu-sec--ink2 .edu-check li{border-bottom-color:color-mix(in srgb,var(--bone) 16%,transparent)}
.edu-check b{font-weight:700}

/* ---- say this / not that ---- */
.edu-say{display:grid;gap:1rem}
.edu-say li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:1rem;align-items:start;
  border:2px solid var(--ink);border-radius:14px;padding:1rem 1.1rem;background:var(--bone)}
.edu-say__tag{font-family:var(--f-mono);font-size:.6rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  border-radius:999px;padding:.35rem .7rem;flex:none;white-space:nowrap;align-self:start}
.edu-say__tag--yes{background:var(--leaf-bright);color:var(--ink)}
.edu-say__tag--no{background:var(--chile);color:var(--bone)}
.edu-say q{font-size:1.06rem;font-weight:600;display:block;margin-bottom:.35rem}
.edu-say small{display:block;font-size:.9rem;line-height:1.5;color:color-mix(in srgb,var(--ink) 74%,transparent)}

/* ---- numbers panel (label maths) ---- */
.edu-maths{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border:3px solid var(--ink);
  border-radius:18px;overflow:hidden;background:var(--bone);box-shadow:var(--sh-3);color:var(--ink)}
.edu-maths > div{padding:clamp(1rem,2.2vw,1.5rem);border-right:2px solid var(--ink)}
.edu-maths > div:last-child{border-right:0}
.edu-maths dt{font-family:var(--f-mono);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--chile);margin-bottom:.5rem}
.edu-maths dd{margin:0}
.edu-maths__big{font-family:var(--f-display);font-size:clamp(1.9rem,1.2rem + 2.6vw,3.1rem);line-height:.95;margin-bottom:.5rem;display:block;overflow-wrap:break-word}
.edu-maths__qual{display:block;font-family:var(--f-mono);font-size:.62rem;letter-spacing:.16em;
  text-transform:uppercase;line-height:1.25;margin-top:.4rem;color:var(--chile)}
.edu-maths p{font-size:.92rem;margin:0;color:color-mix(in srgb,var(--ink) 80%,transparent)}

/* ---- onset ladder (qualitative — no clock numbers, on purpose) ---- */
.edu-ladder{display:grid;gap:.6rem;border-top:2px solid color-mix(in srgb,var(--bone) 40%,transparent);padding-top:1.2rem}
.edu-ladder li{display:grid;grid-template-columns:minmax(0,11rem) minmax(0,1fr);gap:.9rem;align-items:center}
.edu-ladder__n{font-family:var(--f-mono);font-size:.76rem;letter-spacing:.1em;text-transform:uppercase}
.edu-ladder__bar{height:22px;border:2px solid var(--bone);border-radius:999px;overflow:hidden;
  background:color-mix(in srgb,var(--bone) 14%,transparent);position:relative}
.edu-ladder__bar i{display:block;height:100%;background:linear-gradient(90deg,var(--sun),var(--chile))}
.edu-ladder__lab{font-family:var(--f-mono);font-size:.62rem;letter-spacing:.13em;text-transform:uppercase;
  display:flex;justify-content:space-between;gap:1rem;margin-top:.9rem;opacity:.62}

/* ---- myth vs fact ---- */
.edu-mf{display:grid;gap:0;border-top:3px solid var(--ink);max-width:var(--maxw);margin-inline:auto}
.edu-mf li{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:clamp(1rem,3vw,2.6rem);
  padding:clamp(1.2rem,2.4vw,1.8rem) 0;border-bottom:1px solid color-mix(in srgb,var(--ink) 25%,transparent)}
.edu-mf__m,.edu-mf__f{display:block}
.edu-mf__k{font-family:var(--f-mono);font-size:.6rem;font-weight:700;letter-spacing:.17em;text-transform:uppercase;
  display:inline-block;padding:.28rem .65rem;border-radius:999px;margin-bottom:.6rem}
.edu-mf__m .edu-mf__k{background:var(--chile);color:var(--bone)}
.edu-mf__f .edu-mf__k{background:var(--leaf-bright);color:var(--ink)}
.edu-mf__m strong{display:block;font-family:var(--f-display);text-transform:uppercase;line-height:1.05;
  font-size:clamp(1.15rem,.95rem + .9vw,1.65rem)}
.edu-mf__f p{font-size:.99rem;margin:0;max-width:60ch}

/* ---- terpene grid ---- */
.edu-terp{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.edu-terp li{border:2px solid var(--ink);border-radius:14px;padding:1rem 1.1rem;background:var(--bone);
  box-shadow:4px 4px 0 var(--ink);color:var(--ink)}
.edu-terp h3{font-family:var(--f-display);text-transform:uppercase;font-size:1.4rem;line-height:1;margin-bottom:.35rem}
.edu-terp__smell{font-family:var(--f-mono);font-size:.63rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--chile-deep);display:block;margin-bottom:.6rem}
.edu-terp p{font-size:.93rem;margin:0}

/* ---- glossary ---- */
.edu-glos{max-width:var(--maxw);margin-inline:auto;border-top:3px solid var(--ink);columns:2;column-gap:clamp(1.6rem,4vw,4rem)}
.edu-glos .qa__a p{max-width:52ch}

/* ---- closing CTA ---- */
.edu-end{background:var(--leaf);border-top:3px solid var(--ink);padding:clamp(3rem,6vw,5.5rem) var(--pad)}
.edu-end__h{font-family:var(--f-display);text-transform:uppercase;line-height:1;
  font-size:clamp(2.4rem,1.2rem + 6vw,5.6rem);margin-bottom:1.2rem}
.edu-end__cta{display:flex;flex-wrap:wrap;gap:.9rem;margin:1.8rem 0 1.4rem}

/* ---- education responsive ---- */
@media (max-width:1180px){
  .edu-mast__grid{grid-template-columns:minmax(0,1fr)}
  .edu-plate{max-width:460px;margin-inline:auto}
  .edu-toc{grid-template-columns:repeat(2,minmax(0,1fr))}
  .edu-toc a:nth-child(4n){border-right:1px solid color-mix(in srgb,var(--ink) 22%,transparent)}
  .edu-toc a:nth-child(2n){border-right:0}
  .edu-cols--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .edu-cols--split{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:820px){
  .edu-cols,.edu-cols--3,.edu-cols--4,.edu-terp{grid-template-columns:minmax(0,1fr)}
  .edu-glos{columns:1}
  .edu-maths{grid-template-columns:minmax(0,1fr)}
  .edu-maths > div{border-right:0;border-bottom:2px solid var(--ink)}
  .edu-maths > div:last-child{border-bottom:0}
  .edu-mf li{grid-template-columns:minmax(0,1fr);gap:.9rem}
  .edu-ladder li{grid-template-columns:minmax(0,1fr);gap:.3rem}
}
@media (max-width:560px){
  .edu-toc{grid-template-columns:minmax(0,1fr)}
  .edu-toc a{border-right:0 !important;padding-left:0 !important}
  .edu-say li{grid-template-columns:minmax(0,1fr);gap:.6rem}
  .edu-plate{padding:.7rem;box-shadow:6px 6px 0 color-mix(in srgb,var(--leaf) 55%,transparent)}
  .edu-check li{gap:.7rem}
  .edu-mast__cta .btn{width:100%}
}

/* ==========================================================================
   27. INTERIOR PAGES  (faq.html, contact.html)
   Same art direction as the landing page: bordered objects, hard shadows,
   Anton over mono, desert palette. Nothing here restyles the home page.
   ========================================================================== */

/* ---------- 27.1 Breadcrumbs ---------- */
.crumbs{
  max-width:var(--maxw);margin:0 auto;
  font-family:var(--f-mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;
  color:color-mix(in srgb,var(--ink) 58%,transparent);
  display:flex;flex-wrap:wrap;gap:.45rem;align-items:center;
}
.crumbs a{text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--ink) 35%,transparent)}
.crumbs a:hover{color:var(--chile-deep);border-color:var(--chile-deep)}
.crumbs span[aria-current]{color:var(--chile-deep)}

/* current-page marker in the shared nav */
.nav a[aria-current="page"]::after{right:0;background:var(--leaf-deep)}
.mobnav a[aria-current="page"]{color:var(--leaf-bright)}

/* ---------- 27.2 Page masthead ---------- */
.phead{
  position:relative;overflow:hidden;
  background:linear-gradient(175deg,#FBF4E6 0%,#F5EEE1 44%,#EFE2C9 100%);
  border-bottom:2px solid var(--ink);
  padding:clamp(1.8rem,3.6vw,3rem) var(--pad) clamp(2.4rem,5vw,4.2rem);
}
.phead__inner{position:relative;z-index:2;max-width:var(--maxw);margin:0 auto}
.phead__h{
  font-family:var(--f-display);text-transform:uppercase;
  font-size:clamp(2.9rem,1.1rem + 8.6vw,7.6rem);
  /* Anton's comma descends far enough that .9 collides with the next line */
  line-height:1.02;letter-spacing:-.02em;margin:0 0 1.2rem;max-width:16ch;
}
.phead__h span{color:var(--leaf-deep)}
.phead__h em{font-style:normal;color:transparent;-webkit-text-stroke:2px var(--ink)}
.phead__lede{max-width:54ch;font-size:clamp(1rem,.94rem + .32vw,1.16rem)}
.phead__lede strong{font-weight:700;box-shadow:inset 0 -.45em 0 color-mix(in srgb,var(--sun) 45%,transparent)}
.phead__cta{display:flex;flex-wrap:wrap;gap:.9rem;margin:1.7rem 0 .9rem}
.phead__note{
  font-family:var(--f-mono);font-size:.7rem;letter-spacing:.09em;text-transform:uppercase;
  color:color-mix(in srgb,var(--ink) 62%,transparent);max-width:54ch;margin:0 0 1.8rem;
}
/* display:block matters — as an inline span the width below is ignored the
   moment the mobile rule drops it out of absolute positioning. */
.phead__stamp{
  display:block;
  position:absolute;right:clamp(1rem,6vw,6rem);top:clamp(1.5rem,5vw,4rem);
  width:clamp(110px,14vw,190px);z-index:1;
}
.phead .stickers{margin-bottom:1.9rem}

/* ---------- 27.3 Generic interior section ---------- */
.sec{position:relative;padding:clamp(2.8rem,6.2vw,6.2rem) var(--pad)}
.sec__in{max-width:var(--maxw);margin-inline:auto}
.sec--ink{background:var(--ink);color:var(--bone);border-block:2px solid var(--ink)}
.sec--bone2{background:var(--bone-2);border-block:2px solid var(--ink)}
.sec--leaf{background:var(--leaf);border-block:2px solid var(--ink)}
.sec--sand{
  background:var(--sand);border-block:2px solid var(--ink);
  background-image:repeating-linear-gradient(45deg,transparent 0 22px,color-mix(in srgb,var(--clay) 9%,transparent) 22px 44px);
}
.sec--tight{padding-block:clamp(1.8rem,3.6vw,3.2rem)}
.sec__h{
  font-family:var(--f-display);text-transform:uppercase;line-height:1;
  font-size:clamp(2.1rem,1rem + 5vw,4.8rem);letter-spacing:-.01em;margin:0 0 1.1rem;
}
.sec__h--sm{font-size:clamp(1.7rem,1.1rem + 2.6vw,3.2rem)}
/* sub-heads inside a section body: still Anton, no longer shouting */
.sec__h--xs{font-size:clamp(1.22rem,1.05rem + .7vw,1.5rem);letter-spacing:0;margin-bottom:.7rem}
/* stacked sub-blocks + the two spacing utilities the interior pages need */
.subsec{margin-top:clamp(1.8rem,3.4vw,2.6rem)}
.mt-1{margin-top:1rem}
.mt-2{margin-top:1.8rem}
.fs-s{font-size:.94rem}
.sec__h span{color:var(--chile)}
.sec--ink .sec__h span{color:var(--sun)}
.sec__lede{max-width:62ch;font-size:1.06rem;margin:0 0 clamp(1.5rem,3vw,2.4rem)}
.sec--ink .sec__lede{color:color-mix(in srgb,var(--bone) 82%,transparent)}
.sec--ink a{color:var(--leaf-bright)}
.sec--ink .btn{color:var(--btn-fg)}

/* ---------- 27.4 Side/body split (FAQ groups + contact blocks) ---------- */
.split{
  display:grid;grid-template-columns:minmax(0,.4fr) minmax(0,1fr);
  gap:clamp(1.4rem,3.4vw,3.6rem);align-items:start;
}
.split__side{position:sticky;top:84px}
.split__side .sec__h{margin-bottom:.8rem}
.split__note{font-size:.95rem;max-width:34ch;color:color-mix(in srgb,var(--ink) 74%,transparent)}
.sec--ink .split__note{color:color-mix(in srgb,var(--bone) 72%,transparent)}
.split__n{
  display:inline-block;font-family:var(--f-mono);font-size:.66rem;font-weight:700;
  letter-spacing:.18em;text-transform:uppercase;color:var(--chile);margin-bottom:.7rem;
}
.sec--ink .split__n{color:var(--sun)}

/* ---------- 27.5 Jump index ---------- */
.jump{display:flex;flex-wrap:wrap;gap:.55rem;margin:0}
.jump li{display:block}
.jump a{
  display:inline-block;text-decoration:none;
  border:2px solid var(--ink);border-radius:999px;background:var(--bone);
  padding:.4rem .95rem;box-shadow:3px 3px 0 var(--ink);
  font-family:var(--f-mono);font-size:.68rem;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;
  transition:transform .15s ease,box-shadow .15s ease,background .18s ease;
}
.jump a:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink);background:var(--leaf-bright)}
.jump__t{
  font-family:var(--f-mono);font-size:.66rem;letter-spacing:.19em;text-transform:uppercase;
  color:color-mix(in srgb,var(--ink) 60%,transparent);margin:0 0 .9rem;
}

/* ---------- 27.6 FAQ list, single column + dark band ---------- */
.faq__list--one{columns:1;border-top-width:2px}
.sec--ink .faq__list{border-top-color:var(--bone)}
.sec--ink .qa{border-bottom-color:color-mix(in srgb,var(--bone) 22%,transparent)}
.sec--ink .qa__ico{border-color:var(--bone)}
.sec--ink .qa__ico::before,.sec--ink .qa__ico::after{background:var(--bone)}
.sec--ink .qa[open] .qa__ico{background:var(--sun)}
.sec--ink .qa[open] .qa__ico::before,.sec--ink .qa[open] .qa__ico::after{background:var(--ink)}
.sec--ink .qa summary:hover .qa__q{color:var(--sun)}
.sec--ink .qa__a p{color:color-mix(in srgb,var(--bone) 84%,transparent)}
.sec--ink .qa__a strong{background:var(--sun);color:var(--ink)}
.qa__a ul{margin:.6rem 0 0;display:grid;gap:.35rem}
.qa__a ul + p{margin-top:.85rem}
.qa__a li{position:relative;padding-left:1.15rem;font-size:.95rem}
.qa__a li::before{content:"\25B2";position:absolute;left:0;top:.15rem;font-size:.55rem;color:var(--chile)}
.sec--ink .qa__a li::before{color:var(--sun)}

/* ---------- 27.7 Pull-quote rule ---------- */
.prule{border-left:4px solid var(--chile);padding:.35rem 0 .35rem 1.1rem;max-width:70ch;font-weight:600;margin:1.4rem 0 0}
.prule--sun{border-left-color:var(--sun)}
.prule--ink{border-left-color:var(--ink)}
.prule--leaf{border-left-color:var(--leaf-deep)}

/* ---------- 27.8 Quick-action tiles (contact) ---------- */
.qact{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(.9rem,2vw,1.4rem);margin:0}
.qact li{display:block;min-width:0}
.qact a{
  display:flex;flex-direction:column;gap:.5rem;height:100%;
  border:2px solid var(--ink);border-radius:18px;background:var(--bone);
  padding:1.2rem 1.15rem 1.25rem;box-shadow:var(--sh-2);text-decoration:none;
  transition:transform .16s cubic-bezier(.2,.9,.3,1.2),box-shadow .16s ease,background .2s ease;
}
.qact a:hover{transform:translate(-3px,-3px);box-shadow:9px 9px 0 var(--ink);background:var(--leaf-bright)}
.qact__ico{width:32px;color:var(--leaf-deep);flex:none}
.qact a:hover .qact__ico{color:var(--ink)}
.qact__k{font-family:var(--f-mono);font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:color-mix(in srgb,var(--ink) 60%,transparent)}
.qact__v{
  font-family:var(--f-display);text-transform:uppercase;line-height:1;
  font-size:clamp(1.25rem,1rem + 1.1vw,1.85rem);overflow-wrap:anywhere;
}
.qact__d{font-size:.88rem;line-height:1.45;color:color-mix(in srgb,var(--ink) 78%,transparent);margin:0}
.qact a:hover .qact__d,.qact a:hover .qact__k{color:color-mix(in srgb,var(--ink) 80%,transparent)}

/* ---------- 27.9 Honest mailto form ---------- */
.cform{
  border:3px solid var(--ink);border-radius:6px;background:var(--bone-2);
  box-shadow:var(--sh-2);padding:clamp(1.1rem,2.6vw,1.7rem);
  display:grid;gap:1rem;max-width:760px;
}
.cform__row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.cform__field{display:block;min-width:0}
.cform__field label{display:block;font-family:var(--f-mono);font-size:.66rem;letter-spacing:.15em;text-transform:uppercase;margin-bottom:.45rem}
.cform__field label span{opacity:.6;text-transform:none;letter-spacing:.05em}
.cform input,.cform select,.cform textarea{
  width:100%;padding:.85rem 1rem;border:2px solid var(--ink);
  background:var(--bone);font-family:var(--f-body);font-size:1rem;color:var(--ink);
  border-radius:14px;
}
.cform input,.cform select{border-radius:999px}
.cform textarea{min-height:150px;resize:vertical;line-height:1.55}
.cform input::placeholder,.cform textarea::placeholder{color:color-mix(in srgb,var(--ink) 42%,transparent)}
.cform__honest{
  margin:0;border-top:2px solid var(--ink);padding-top:.9rem;
  font-size:.92rem;line-height:1.6;color:color-mix(in srgb,var(--ink) 84%,transparent);
}
.cform__honest b{font-family:var(--f-mono);font-size:.68rem;letter-spacing:.15em;text-transform:uppercase;display:block;margin-bottom:.3rem;color:var(--chile-deep)}
.cform__actions{display:flex;flex-wrap:wrap;gap:.9rem;align-items:center}
.cform__status{
  margin:0;font-family:var(--f-mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;
  min-height:1.2em;color:var(--chile-deep);
}

/* ---------- 27.10 Fact rows ---------- */
.frows{display:grid;gap:0;border-top:2px solid var(--ink);margin:0}
.frows>div{
  display:grid;grid-template-columns:minmax(0,.34fr) minmax(0,1fr);gap:.4rem 1.2rem;
  padding:.9rem 0;border-bottom:1px solid color-mix(in srgb,var(--ink) 22%,transparent);
}
.frows dt{font-family:var(--f-mono);font-size:.64rem;letter-spacing:.15em;text-transform:uppercase;color:color-mix(in srgb,var(--ink) 58%,transparent);padding-top:.15rem}
.frows dd{margin:0;font-size:1rem;overflow-wrap:anywhere}
.sec--ink .frows{border-top-color:var(--bone)}
.sec--ink .frows>div{border-bottom-color:color-mix(in srgb,var(--bone) 18%,transparent)}
.sec--ink .frows dt{color:color-mix(in srgb,var(--bone) 55%,transparent)}

/* ---------- 27.11 Closing CTA band ---------- */
.ctaband{background:var(--leaf);border-block:3px solid var(--ink);padding:clamp(2.6rem,5.4vw,4.6rem) var(--pad)}
.ctaband__in{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);gap:clamp(1.6rem,4vw,3.6rem);align-items:center}
.ctaband__h{font-family:var(--f-display);text-transform:uppercase;line-height:1;font-size:clamp(2.2rem,1.1rem + 5.4vw,5rem);margin:0 0 .9rem}
.ctaband__h span{color:var(--bone)}
.ctaband p{max-width:52ch;font-size:1.04rem}
.ctaband__row{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:1.5rem}

/* ---------- 27.12 Interior responsive ---------- */
@media (max-width:1023px){
  .split{grid-template-columns:minmax(0,1fr)}
  .split__side{position:static;top:auto}
  .split__note{max-width:60ch}
  .qact{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ctaband__in{grid-template-columns:minmax(0,1fr)}
  .phead__stamp{position:static;margin:0 0 1.4rem;width:clamp(92px,20vw,130px)}
  .phead__h{max-width:none}
}
@media (max-width:640px){
  .qact{grid-template-columns:minmax(0,1fr)}
  .cform__row{grid-template-columns:minmax(0,1fr)}
  .frows>div{grid-template-columns:minmax(0,1fr);gap:.15rem}
  .crumbs{font-size:.6rem}
}

/* ==========================================================================
   27. MENU + VISIT PAGES  (menu.html, visit.html)
   Reuses the interior-page system above (.phead, .crumbs, .sec, .split,
   .jump, .prule, .frows, .qact, .ctaband) and the landing-page components
   (.cat, .steps, .dt, .pay, .rcpt, .idcard, .comply, .qa, .chips, .sticker).
   Only the pieces neither system already provides live here, namespaced
   `lfx-` so nothing can reach back into the home page or the other
   interior pages.
   ========================================================================== */

/* ---------- 27.1 Format block: body + spec aside ---------- */
.lfx-two{
  display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);
  gap:clamp(1.4rem,3.6vw,3.4rem);align-items:start;
}
.lfx-two--wide{grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr)}
.lfx-fmt{border-top:3px solid var(--ink);padding-top:clamp(1.3rem,2.8vw,2.1rem)}
.sec--ink .lfx-fmt{border-top-color:var(--bone)}
.lfx-fmt + .lfx-fmt{margin-top:clamp(2.2rem,4.5vw,3.8rem)}
.lfx-fmt__k{display:flex;align-items:center;gap:.85rem;margin-bottom:.85rem}
.lfx-fmt__n{
  font-family:var(--f-mono);font-size:.72rem;font-weight:700;letter-spacing:.14em;
  color:var(--chile);flex:none;
}
.sec--ink .lfx-fmt__n{color:var(--sun)}
.lfx-fmt__ico{
  width:52px;height:52px;flex:none;padding:6px;
  border:2px solid var(--ink);border-radius:14px;background:var(--sun);color:var(--ink);
  box-shadow:3px 3px 0 var(--ink);
}
.lfx-fmt__h{
  font-family:var(--f-display);text-transform:uppercase;line-height:1;
  font-size:clamp(1.9rem,1.2rem + 2.8vw,3.6rem);letter-spacing:-.005em;margin:0 0 .8rem;
}
.lfx-fmt__body{max-width:66ch}
.lfx-fmt__body p{font-size:1.01rem;margin:0 0 .9rem}
.lfx-fmt__body p:last-child{margin-bottom:0}
.sec--ink .lfx-fmt__body p{color:color-mix(in srgb,var(--bone) 84%,transparent)}
.lfx-fmt__sub{
  font-family:var(--f-mono);font-size:.66rem;letter-spacing:.15em;text-transform:uppercase;
  color:var(--chile-deep);margin:1.3rem 0 .5rem;font-weight:700;
}
.sec--ink .lfx-fmt__sub{color:var(--sun)}

/* ---------- 27.2 Spec aside (a made object, like the receipt) ---------- */
.lfx-aside{
  border:3px solid var(--ink);background:var(--bone);color:var(--ink);
  box-shadow:var(--sh-2);padding:1.05rem 1.15rem 1.15rem;border-radius:6px;
}
.lfx-aside--tilt{transform:rotate(-1.1deg)}
.lfx-aside--sun{background:var(--sun)}
.lfx-aside--leaf{background:var(--leaf-bright)}
.lfx-aside__h{
  font-family:var(--f-display);text-transform:uppercase;line-height:1;
  font-size:1.35rem;margin:0 0 .2rem;
}
.lfx-aside__k{
  font-family:var(--f-mono);font-size:.56rem;letter-spacing:.18em;text-transform:uppercase;
  color:color-mix(in srgb,var(--ink) 58%,transparent);margin:0 0 .8rem;
}
.lfx-aside dl{margin:0;display:grid;gap:.45rem;border-top:2px solid var(--ink);padding-top:.75rem}
.lfx-aside dl>div{display:flex;justify-content:space-between;gap:1rem;align-items:baseline}
.lfx-aside dt{
  font-family:var(--f-mono);font-size:.56rem;letter-spacing:.15em;text-transform:uppercase;
  color:color-mix(in srgb,var(--ink) 60%,transparent);flex:none;
}
.lfx-aside dd{margin:0;font-family:var(--f-mono);font-size:.74rem;font-weight:700;text-align:right}
.lfx-aside__f{
  margin:.85rem 0 0;border-top:2px solid var(--ink);padding-top:.6rem;
  font-family:var(--f-mono);font-size:.62rem;letter-spacing:.06em;line-height:1.65;
  color:color-mix(in srgb,var(--ink) 74%,transparent);
}

/* ---------- 27.3 Qualitative scales — deliberately no minutes ----------
   Bodies differ and we have no lab data, so onset and duration are drawn
   as a relative position on a five-step scale with a word under it. Never
   a clock figure. Each scale carries its own text label for screen readers. */
.lfx-scale{display:grid;gap:.28rem;margin:0 0 .85rem}
.lfx-scale__k{
  font-family:var(--f-mono);font-size:.55rem;letter-spacing:.16em;text-transform:uppercase;
  color:color-mix(in srgb,var(--ink) 58%,transparent);
}
.lfx-scale__pips{display:flex;gap:4px}
.lfx-scale__pips i{
  display:block;flex:1 1 0;height:13px;border:2px solid var(--ink);border-radius:3px;
  background:transparent;
}
.lfx-scale__pips i.on{background:var(--chile)}
.lfx-aside--sun .lfx-scale__pips i.on{background:var(--ink)}
.lfx-scale__v{font-family:var(--f-mono);font-size:.72rem;font-weight:700;letter-spacing:.05em;margin:0}

/* ---------- 27.4 Comparison + matrix tables ---------- */
.lfx-tw{
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  border:3px solid var(--ink);border-radius:16px;background:var(--bone);
  box-shadow:var(--sh-2);
}
.lfx-tbl{width:100%;min-width:640px;border-collapse:collapse;font-size:.95rem;color:var(--ink)}
.lfx-tbl caption{
  text-align:left;padding:.9rem 1rem;border-bottom:2px solid var(--ink);
  font-family:var(--f-mono);font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;
  color:color-mix(in srgb,var(--ink) 62%,transparent);
}
.lfx-tbl th,.lfx-tbl td{
  text-align:left;padding:.75rem 1rem;vertical-align:top;
  border-bottom:1px solid color-mix(in srgb,var(--ink) 22%,transparent);
}
.lfx-tbl thead th{
  background:var(--ink);color:var(--bone);border-bottom:2px solid var(--ink);white-space:nowrap;
  font-family:var(--f-mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;
}
.lfx-tbl tbody th{
  font-family:var(--f-display);text-transform:uppercase;letter-spacing:.01em;
  font-size:1.15rem;line-height:1.05;white-space:nowrap;
}
.lfx-tbl tbody tr:nth-child(even){background:color-mix(in srgb,var(--bone-2) 65%,transparent)}
.lfx-tbl tbody tr:last-child th,.lfx-tbl tbody tr:last-child td{border-bottom:0}
.lfx-y,.lfx-n{font-family:var(--f-mono);font-size:.72rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase}
.lfx-y{color:var(--leaf-deep)}
.lfx-n{color:var(--chile-deep)}
.lfx-tnote{
  margin:.9rem 0 0;font-family:var(--f-mono);font-size:.66rem;line-height:1.75;letter-spacing:.06em;
  color:color-mix(in srgb,var(--ink) 62%,transparent);
}
.sec--ink .lfx-tnote{color:color-mix(in srgb,var(--bone) 62%,transparent)}

/* ---------- 27.5 Honest flag (the "there is no menu here" box) ---------- */
.lfx-flag{
  border:3px solid var(--ink);border-radius:18px;background:var(--sun);color:var(--ink);
  box-shadow:var(--sh-3);padding:clamp(1.2rem,3vw,2.1rem);
}
.lfx-flag--leaf{background:var(--leaf-bright)}
.lfx-flag--bone{background:var(--bone)}
.lfx-flag__k{
  font-family:var(--f-mono);font-size:.62rem;letter-spacing:.19em;text-transform:uppercase;
  font-weight:700;margin:0 0 .55rem;
}
.lfx-flag__h{
  font-family:var(--f-display);text-transform:uppercase;line-height:1;
  font-size:clamp(1.6rem,1.1rem + 2.2vw,2.9rem);margin:0 0 .8rem;
}
.lfx-flag p{max-width:70ch;font-size:1.02rem}
.lfx-flag__row{display:flex;flex-wrap:wrap;gap:.85rem;margin-top:1.3rem}

/* ---------- 27.6 Small helpers ---------- */
.lfx-3up{grid-template-columns:repeat(3,minmax(0,1fr))}
.lfx-mini{
  font-family:var(--f-mono);font-size:.68rem;line-height:1.8;letter-spacing:.06em;
  color:color-mix(in srgb,var(--ink) 62%,transparent);max-width:86ch;margin:1.2rem 0 0;
}
.sec--ink .lfx-mini{color:color-mix(in srgb,var(--bone) 62%,transparent)}
.lfx-stack{display:grid;gap:clamp(1rem,2.2vw,1.5rem)}

/* ---------- 27.7 Responsive ---------- */
@media (max-width:1023px){
  .lfx-two,.lfx-two--wide{grid-template-columns:minmax(0,1fr)}
  .lfx-aside--tilt{transform:none}
  .lfx-3up{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .lfx-3up{grid-template-columns:minmax(0,1fr)}
  .lfx-fmt__ico{width:44px;height:44px}
  .lfx-flag{border-radius:14px}
}

/* ---------- 27.8 Prose + spacing utilities used by menu.html / visit.html ---------- */
.lfx-body{max-width:74ch}
.lfx-body p{font-size:1.02rem;margin:0 0 1em}
.lfx-body p:last-child{margin-bottom:0}
.sec--ink .lfx-body p{color:color-mix(in srgb,var(--bone) 84%,transparent)}
.sec--ink .lfx-body strong{color:var(--bone)}
.sec--bone2 .lfx-body strong,.sec--sand .lfx-body strong,.sec .lfx-body strong{
  box-shadow:inset 0 -.4em 0 color-mix(in srgb,var(--sun) 42%,transparent);
}
.sec--ink .lfx-body strong{box-shadow:none;background:color-mix(in srgb,var(--sun) 82%,transparent);color:var(--ink);padding:.02em .28em}

.lfx-gap{margin-top:clamp(1.5rem,3vw,2.4rem)}
.lfx-gap-s{margin-top:1rem}
.lfx-fmt__h--sun{color:var(--sun)}
.lfx-nap-sm{font-size:1rem;margin:.6rem 0 0;line-height:1.5}

/* the breadcrumb sits directly above the page headline */
.phead .crumbs{margin-bottom:clamp(1rem,2.2vw,1.5rem)}

/* the payment matrix note must stay microtype inside the .pay column */
.pay__copy > .lfx-tnote{font-size:.66rem;line-height:1.75;max-width:70ch}

/* The rotated receipt is 340px wide plus its tilt, which is a few pixels more
   than the padded column at 375px. Clamp it so nothing is cut off on a phone. */
@media (max-width:560px){
  .rcpt{max-width:min(340px, 100% - 14px)}
}

/* Six nav items: never let a label break across two lines. */
.nav a{white-space:nowrap}
