/* Dr Noah Losa — shared styles. Tokens on :root; components below in page order. */
/* Fonts: ABC Diatype (Edu/Trial licences — local preview only, buy a web licence before launch) and Classroom JNL */
@font-face{font-family:"ABC Diatype";src:url("fonts/ABCDiatype-Regular.otf") format("opentype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"ABC Diatype";src:url("fonts/ABCDiatype-Medium.otf") format("opentype");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"ABC Diatype";src:url("fonts/ABCDiatype-Bold.otf") format("opentype");font-weight:600 800;font-style:normal;font-display:swap}
@font-face{font-family:"Quadrant Text";src:url("fonts/QuadrantText-Regular.otf") format("opentype");font-weight:400 800;font-style:normal;font-display:swap}
@font-face{font-family:"Quadrant Text";src:url("fonts/QuadrantText-Italic.otf") format("opentype");font-weight:400 800;font-style:italic;font-display:swap}
@font-face{font-family:"FK Screamer";src:url("fonts/FKScreamer-Bold.otf") format("opentype");font-weight:400 900;font-style:normal;font-display:swap}
@font-face{font-family:"Classroom JNL";src:url("fonts/ClassroomJNL.otf") format("opentype");font-weight:400 800;font-style:normal;font-display:swap}
:root{
  --bg:#f6f6f3;
  --surface:#ffffff;
  --ink:#111111;
  --ink-soft:#4b4b48;
  --rule:#dcdcd6;
  --pink:#e580b3;
  --accent:var(--pink);
  --teal:#7ccbc3;
  --yellow:#f2c230;
  --green:#23a55a;
  --blue:#3770b5;
  --blue-ink:#1f4f8c;
  --red:#e2513f;
  --lilac:#9d90c9;
  --paper-yellow:#fbf0c8;
  --night:#111111;
  --night-soft:#c9c9c4;
  --error:#c0291a;
  --display:"FK Screamer", "Classroom JNL", "ABC Diatype", sans-serif;
  --hero:"FK Screamer", "Classroom JNL", Impact, sans-serif;
  --sans:"Quadrant Text", "ABC Diatype", system-ui, -apple-system, "Segoe UI", sans-serif;
  --gut:clamp(16px, 4vw, 56px);
  --max:1320px;
  --r-lg:clamp(20px, 2.4vw, 32px);
  --r-md:18px;
  --t-xs:.6875rem;
  --t-s:.8125rem;
  --t-body:.875rem;
  --t-lead:clamp(.9375rem, .88rem + .35vw, 1.125rem);
  --t-h3:clamp(1.375rem, 1.1rem + 1vw, 1.875rem);
  --t-h2:clamp(2.125rem, 1.4rem + 3vw, 4rem);
  --t-h1:clamp(2.75rem, 1.5rem + 5.4vw, 6rem);
  --ease:cubic-bezier(.16,1,.3,1);
  --shadow:0 18px 40px -18px rgba(17,17,17,.28), 0 2px 6px rgba(17,17,17,.06);
  color-scheme:light;
}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:clip}
html.lenis, html.lenis body{height:auto}
.lenis-smooth{scroll-behavior:auto !important}
.lenis-stopped{overflow:hidden}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:var(--t-body);line-height:1.6;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
p{margin:0 0 1em}
h1,h2,h3,h4{font-family:var(--display);font-weight:700;line-height:.9;letter-spacing:0;margin:0;text-wrap:balance;text-transform:uppercase}
h3,h4{line-height:.95}
button,input,select,textarea{font:inherit;color:inherit}
::selection{background:var(--yellow);color:var(--ink)}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:6px}
input,textarea{caret-color:var(--blue)}
html{scrollbar-color:var(--ink) var(--bg)}
::-webkit-scrollbar{width:11px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:var(--ink);border-radius:99px;border:3px solid var(--bg)}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--ink);color:#fff;padding:10px 16px;border-radius:99px;text-decoration:none;transition:top .2s}
.skip:focus{top:12px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.wrap{width:100%;max-width:calc(var(--max) + var(--gut) * 2);margin-inline:auto;padding-inline:var(--gut)}
.section{padding-block:clamp(72px, 10vw, 152px)}
.section-tight{padding-block:clamp(56px, 7vw, 104px)}
.lead{font-size:var(--t-lead);line-height:1.45;color:var(--ink);max-width:36ch;letter-spacing:-.005em}
.muted{color:var(--ink-soft)}
.measure{max-width:66ch}
.prose p{max-width:66ch}
.prose h2{font-size:var(--t-h3);margin:1.8em 0 .55em}
.prose ul{padding-left:1.1em;max-width:62ch}
.prose li{margin-bottom:.4em}
.prose a:not(.btn){color:var(--blue);text-underline-offset:3px}

/* placeholder text Noah or the clinic still needs to supply */
.ph{background:repeating-linear-gradient(-45deg, var(--yellow) 0 6px, var(--paper-yellow) 6px 12px);border-radius:6px;padding:.05em .4em;
  box-decoration-break:clone;-webkit-box-decoration-break:clone;color:var(--ink);font-style:normal}

/* ---------- buttons & links ---------- */
.btn{--bh:52px;display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:var(--bh);padding:0 1.5em;border-radius:0;
  font-weight:500;font-size:1rem;text-decoration:none;border:1.5px solid transparent;cursor:pointer;white-space:nowrap;
  transition:background-color .35s var(--ease), color .35s var(--ease), border-color .35s var(--ease), transform .35s var(--ease), box-shadow .35s var(--ease)}
.btn svg{width:18px;height:18px;flex:none;transition:transform .45s var(--ease)}
.btn:hover svg{transform:translateX(3px)}
.btn:active{transform:scale(.97)}
.btn-primary{background:var(--accent);color:var(--ink);box-shadow:0 10px 24px -12px rgba(229,128,179,.8)}
.btn-primary:hover{background:var(--ink);color:#fff}
.btn-ghost{border-color:currentColor;color:var(--ink)}
.btn-ghost:hover{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.btn-light{background:#fff;color:var(--ink)}
.btn-light:hover{background:var(--yellow)}
.btn-sm{--bh:42px;padding:0 1.15em;font-size:.9375rem}
.btn[aria-disabled="true"],.btn:disabled{opacity:.5;pointer-events:none}
.link{display:inline-flex;align-items:center;gap:.45em;font-weight:600;color:var(--ink);text-decoration:none;
  background:linear-gradient(currentColor,currentColor) 0 100%/100% 1.5px no-repeat;padding-bottom:2px;transition:background-size .45s var(--ease), color .3s}
.link:hover{background-size:0 1.5px;color:var(--blue)}
.link svg{width:16px;height:16px;transition:transform .45s var(--ease)}
.link:hover svg{transform:translateX(3px)}

/* ---------- header ---------- */
.site-header{position:fixed;inset:0 0 auto;z-index:50;transition:transform .5s var(--ease), background-color .4s, box-shadow .4s}
.site-header.is-hidden{transform:translateY(-110%)}
.site-header.is-solid{background:rgba(246,246,243,.88);-webkit-backdrop-filter:saturate(1.4) blur(14px);backdrop-filter:saturate(1.4) blur(14px);box-shadow:0 1px 0 var(--rule)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:24px;height:76px}
.brand{display:flex;flex-direction:column;text-decoration:none;line-height:1.1}
.brand b{font-family:var(--display);font-weight:600;font-size:1.25rem;letter-spacing:-.02em}
.brand span{font-size:var(--t-xs);color:var(--ink-soft);letter-spacing:.01em}
.brand img{display:block;height:clamp(25px, 1.84vw, 32px);width:auto}
.nav-links{display:flex;align-items:center;gap:clamp(14px, 2vw, 30px);list-style:none;margin:0;padding:0}
.nav-links a{text-decoration:none;font-weight:500;font-size:.96875rem;position:relative;padding:6px 0}
.nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1.5px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .45s var(--ease)}
.nav-links a:hover::after,.nav-links a[aria-current="page"]::after{transform:scaleX(1);transform-origin:left}
.nav-links a[aria-current="page"]{color:var(--blue)}
.nav-cta{display:flex;align-items:center;gap:10px}
.menu-btn{display:none;width:46px;height:46px;border-radius:0;border:1.5px solid var(--ink);background:transparent;cursor:pointer;position:relative}
.menu-btn span{position:absolute;left:13px;right:13px;height:1.5px;background:var(--ink);transition:transform .45s var(--ease), top .45s var(--ease)}
.menu-btn span:first-child{top:18px}
.menu-btn span:last-child{top:26px}
.menu-open .menu-btn span:first-child{top:22px;transform:rotate(45deg)}
.menu-open .menu-btn span:last-child{top:22px;transform:rotate(-45deg)}
.mobile-menu{position:fixed;inset:0;z-index:45;background:var(--yellow);padding:108px var(--gut) 32px;display:flex;flex-direction:column;justify-content:space-between;
  clip-path:inset(0 0 100% 0);visibility:hidden;transition:clip-path .7s var(--ease), visibility 0s .7s}
.menu-open .mobile-menu{clip-path:inset(0 0 0 0);visibility:visible;transition:clip-path .7s var(--ease), visibility 0s}
.mobile-menu ul{list-style:none;margin:0;padding:0}
.mobile-menu li a{display:block;font-family:var(--display);font-size:clamp(2.25rem, 9vw, 3.25rem);font-weight:600;letter-spacing:-.03em;text-decoration:none;padding:4px 0;line-height:1.15}
.mobile-menu li a[aria-current="page"]{color:var(--blue)}
.mobile-menu .btn{width:100%}

/* ---------- hero (home) ---------- */
.hero{padding-top:clamp(116px, 14vw, 160px);padding-bottom:clamp(56px, 7vw, 96px)}
.hero-grid{display:grid;grid-template-columns:repeat(12, minmax(0,1fr));gap:clamp(24px, 3vw, 48px);align-items:start}
.hero-copy{grid-column:1 / 8;padding-bottom:clamp(0px, 2vw, 24px)}
.hero h1{font-size:var(--t-h1);margin-bottom:.22em}
.line{display:block;overflow:hidden;padding-bottom:.06em;margin-bottom:-.06em}
.line > span{display:inline-block}
.hero h1 em{font-style:normal;color:var(--accent)}
.hero .lead{margin-bottom:1.6em}
.actions{display:flex;flex-wrap:wrap;gap:12px}
.chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:clamp(28px, 4vw, 44px) 0 0}
.chip{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:99px;background:var(--surface);font-size:var(--t-s);font-weight:500;border:1px solid var(--rule)}
.chip i{width:8px;height:8px;border-radius:50%;background:var(--c, var(--lilac))}

.portrait{grid-column:8 / 13;position:relative;margin-top:clamp(8px, 1.5vw, 24px)}
.portrait-frame{position:relative;aspect-ratio:4/5;border-radius:var(--r-lg);overflow:hidden;background:var(--teal)}
.portrait-frame img{width:100%;height:100%;object-fit:cover}
.portrait-ph{position:absolute;inset:0;display:grid;place-items:center;text-align:center;color:var(--ink)}
.portrait-ph svg{position:absolute;inset:0;width:100%;height:100%}
.portrait-ph small{position:absolute;left:0;right:0;bottom:22px;font-size:var(--t-xs);letter-spacing:.02em;color:var(--ink-soft)}
.float-card{position:absolute;left:clamp(-40px, -3vw, -16px);bottom:clamp(20px, 4vw, 48px);background:var(--surface);border-radius:var(--r-md);padding:16px 20px;box-shadow:var(--shadow);
  display:flex;gap:14px;align-items:center;max-width:300px}
.float-card .dot{width:10px;height:10px;border-radius:50%;background:var(--green);box-shadow:0 0 0 5px rgba(35,165,90,.2);flex:none}
.float-card b{display:block;font-size:.9375rem;line-height:1.3}
.float-card span{font-size:var(--t-xs);color:var(--ink-soft)}

/* ---------- page hero (inner pages) ---------- */
.page-hero{padding-top:clamp(132px, 16vw, 200px);padding-bottom:clamp(40px, 6vw, 80px)}
.page-hero h1{font-size:var(--t-h1);max-width:14ch;margin-bottom:.35em}
.page-hero .lead{max-width:44ch}
.crumb{display:inline-flex;gap:8px;font-size:var(--t-s);color:var(--ink-soft);margin-bottom:22px;text-decoration:none}
.crumb:hover{color:var(--blue)}

/* ---------- statement ---------- */
.statement{display:grid;grid-template-columns:repeat(12, minmax(0,1fr));gap:clamp(24px, 3vw, 48px)}
.statement h2{grid-column:1 / 10;font-size:clamp(1.875rem, 1.2rem + 2.8vw, 3.5rem);line-height:1.12;letter-spacing:-.03em;font-weight:500}
.statement h2 span{color:var(--ink)}
.statement .side{grid-column:10 / 13;align-self:end}

/* ---------- care rows ---------- */
.sec-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:clamp(36px, 5vw, 64px);flex-wrap:wrap}
.sec-head h2{font-size:var(--t-h2);max-width:16ch}
.care-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.care-row{position:relative;border-bottom:1px solid var(--rule)}
.care-row a{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr) auto;gap:clamp(16px, 3vw, 48px);align-items:center;padding:clamp(24px, 3.2vw, 40px) 0;text-decoration:none;position:relative;z-index:1}
.care-row::before{content:"";position:absolute;inset:0;background:var(--c);transform:scaleY(0);transform-origin:bottom;transition:transform .6s var(--ease);border-radius:0}
.care-row:hover::before,.care-row:focus-within::before{transform:scaleY(1)}
.care-row h3{font-size:clamp(1.625rem, 1.1rem + 2vw, 2.75rem);letter-spacing:-.03em;display:flex;align-items:center;gap:.5em;padding-left:clamp(0px, 1vw, 12px)}
.care-row h3 i{width:.42em;height:.42em;border-radius:50%;background:var(--dot, var(--c));flex:none;transition:transform .5s var(--ease)}
.care-row:hover h3 i{transform:scale(1.4);background:var(--ink)}
.care-row p{margin:0;color:var(--ink-soft);max-width:48ch}
.care-row:hover p{color:var(--ink)}
.care-row .arrow{width:52px;height:52px;border-radius:0;border:1.5px solid var(--ink);display:grid;place-items:center;margin-right:clamp(0px, 1vw, 12px);transition:background .4s var(--ease), color .4s}
.care-row .arrow svg{width:20px;height:20px;transition:transform .5s var(--ease)}
.care-row:hover .arrow{background:var(--ink);color:#fff}
.care-row:hover .arrow svg{transform:rotate(-45deg)}

/* ---------- split media ---------- */
.split{display:grid;grid-template-columns:repeat(12, minmax(0,1fr));gap:clamp(24px, 4vw, 64px);align-items:center}
.split .media{grid-column:1 / 6;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4/5;position:relative}
.split .media img{width:100%;height:118%;object-fit:cover;position:absolute;top:-9%}
.split .body{grid-column:7 / 13}
.split.flip .media{grid-column:8 / 13;order:2}
.split.flip .body{grid-column:1 / 7;order:1}
.split h2{font-size:var(--t-h2);margin-bottom:.45em}

/* steps (booking is a real sequence) */
.steps{list-style:none;margin:28px 0 32px;padding:0;counter-reset:s;display:grid;gap:0}
.steps li{counter-increment:s;display:grid;grid-template-columns:44px 1fr;gap:16px;padding:18px 0;border-top:1px solid var(--rule)}
.steps li:last-child{border-bottom:1px solid var(--rule)}
.steps li::before{content:counter(s);width:36px;height:36px;border-radius:50%;background:var(--yellow);display:grid;place-items:center;font-weight:600;font-size:.9375rem}
.steps b{display:block;font-size:.9375rem;margin-bottom:2px}
.steps span{color:var(--ink-soft);font-size:var(--t-s)}

/* ---------- writing ---------- */
.posts{display:grid;grid-template-columns:repeat(3, minmax(0,1fr));gap:clamp(16px, 2vw, 28px)}
.post{display:flex;flex-direction:column;text-decoration:none;border-radius:var(--r-lg);overflow:hidden;background:var(--surface);transition:transform .6s var(--ease), box-shadow .6s var(--ease)}
.post:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.post-cover{aspect-ratio:5/4;background:var(--c);position:relative;overflow:hidden;display:flex;align-items:flex-end;padding:22px}
.post-cover svg{position:absolute;inset:0;width:100%;height:100%;transition:transform 1s var(--ease)}
.post:hover .post-cover svg{transform:scale(1.06) rotate(-2deg)}
.post-cover .tag{position:relative;background:rgba(255,255,255,.75);border-radius:99px;padding:5px 12px;font-size:var(--t-xs);font-weight:600}
.post-body{padding:22px 24px 26px;display:flex;flex-direction:column;gap:10px;flex:1}
.post-body h3{font-size:1.4375rem;line-height:1.18}
.post-body p{margin:0;color:var(--ink-soft);font-size:var(--t-s)}
.post-meta{margin-top:auto;padding-top:10px;font-size:var(--t-xs);color:var(--ink-soft);display:flex;gap:12px}
.badge{display:inline-flex;align-items:center;padding:3px 10px;border-radius:99px;background:var(--yellow);font-size:var(--t-xs);font-weight:600;color:var(--ink)}

/* ---------- dark band (speaking) ---------- */
.band{background:var(--blue);color:#fff;border-radius:var(--r-lg);overflow:hidden;display:grid;grid-template-columns:repeat(12, minmax(0,1fr));position:relative}
.band .band-copy{grid-column:1 / 7;padding:clamp(36px, 6vw, 88px)}
.band h2{font-size:var(--t-h2);margin-bottom:.45em}
.band p{color:#e6eef8;max-width:44ch}
.band .band-media{grid-column:7 / 13;position:relative;min-height:340px;overflow:hidden}
.band .band-media img{position:absolute;inset:-8% 0;width:100%;height:116%;object-fit:cover}
.band ul{list-style:none;padding:0;margin:0 0 32px;display:flex;flex-wrap:wrap;gap:8px}
.band li{border:1px solid rgba(255,255,255,.45);border-radius:99px;padding:6px 14px;font-size:var(--t-s);color:#fff}

/* ---------- CTA panel ---------- */
.cta{background:var(--red);border-radius:var(--r-lg);padding:clamp(40px, 7vw, 104px) clamp(24px, 6vw, 88px);position:relative;overflow:hidden;
  display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:32px;align-items:end}
.cta h2{font-size:var(--t-h2);max-width:13ch;position:relative}
.cta .cta-side{position:relative}
.cta .cta-side p{max-width:38ch}
.cta .blob{position:absolute;right:-6%;top:-34%;width:min(520px, 58vw);aspect-ratio:1;border-radius:50%;background:var(--yellow)}

/* ---------- footer ---------- */
.site-footer{padding:clamp(64px, 8vw, 112px) 0 32px;margin-top:clamp(40px, 6vw, 80px);border-top:1px solid var(--rule)}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.4fr;gap:clamp(24px, 4vw, 56px)}
.foot-grid .foot-h{font-family:var(--sans);font-size:var(--t-xs);font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:14px}
.foot-grid ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.foot-grid a{text-decoration:none}
.foot-grid a:not(.btn):hover{color:var(--blue)}
.foot-grid strong{white-space:nowrap}
.foot-big{font-family:var(--display);font-size:clamp(1.75rem, 1.2rem + 2vw, 2.75rem);font-weight:600;letter-spacing:-.03em;line-height:1.05;margin-bottom:16px}
.ack{margin-top:clamp(48px, 6vw, 80px);padding:24px;border-radius:var(--r-md);background:var(--surface);display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start;font-size:var(--t-s)}
.ack svg{width:44px;height:28px}
.ack p{margin:0;max-width:90ch;color:var(--ink-soft)}
.foot-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:28px;font-size:var(--t-xs);color:var(--ink-soft)}
.foot-bottom strong{color:var(--ink)}

/* ---------- sticky booking pill ---------- */
.book-pill{position:fixed;right:clamp(16px, 2.5vw, 32px);bottom:clamp(16px, 2.5vw, 32px);z-index:40;transform:translateY(160%);transition:transform .7s var(--ease)}
.book-pill.is-on{transform:none}
.book-pill .btn{box-shadow:0 18px 36px -14px rgba(229,128,179,.75)}

/* ---------- about ---------- */
.timeline{list-style:none;margin:0;padding:0;border-left:1.5px solid var(--rule);margin-left:6px}
.timeline li{position:relative;padding:0 0 clamp(28px, 3vw, 40px) clamp(24px, 3vw, 40px)}
.timeline li::before{content:"";position:absolute;left:-7.5px;top:7px;width:13px;height:13px;border-radius:50%;background:var(--bg);border:2px solid var(--blue)}
.timeline time{display:block;font-size:var(--t-s);font-weight:600}
.timeline h3{font-size:var(--t-h3);margin-bottom:6px}
.timeline p{color:var(--ink-soft);margin:0;max-width:56ch}
.quote{font-family:var(--display);font-size:clamp(1.75rem, 1.1rem + 2.6vw, 3.25rem);line-height:1.12;letter-spacing:-.03em;font-weight:500;max-width:24ch;margin:0}

/* ---------- care page ---------- */
.care-nav{position:sticky;top:88px;display:grid;gap:4px;align-self:start}
.care-nav a{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:12px;text-decoration:none;font-weight:500;color:var(--ink-soft);transition:background .3s, color .3s}
.care-nav a i{width:9px;height:9px;border-radius:50%;background:var(--c)}
.care-nav a:hover,.care-nav a.is-active{background:var(--surface);color:var(--ink)}
.care-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:clamp(32px, 5vw, 80px)}
.care-block{padding-bottom:clamp(56px, 7vw, 96px);scroll-margin-top:110px}
.care-block + .care-block{padding-top:clamp(56px, 7vw, 96px);border-top:1px solid var(--rule)}
.care-block .swatch{width:56px;height:56px;border-radius:50%;background:var(--c);margin-bottom:22px}
.care-block h2{font-size:var(--t-h2);margin-bottom:.4em}
.care-block .lead{max-width:44ch;margin-bottom:1.4em}
.helps{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:10px 28px;list-style:none;padding:0;margin:0 0 28px}
.helps li{display:flex;gap:10px;align-items:flex-start;padding:12px 0;border-bottom:1px solid var(--rule)}
.helps svg{width:20px;height:20px;flex:none;margin-top:3px;color:var(--blue)}

/* accordion */
.faq{border-top:1px solid var(--rule)}
.faq details{border-bottom:1px solid var(--rule)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:20px 0;font-weight:600;font-size:.9375rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary .pm{width:30px;height:30px;border-radius:0;background:var(--surface);position:relative;flex:none;transition:background .3s}
.faq summary .pm::before,.faq summary .pm::after{content:"";position:absolute;left:9px;right:9px;top:14px;height:1.5px;background:var(--ink);transition:transform .45s var(--ease)}
.faq summary .pm::after{transform:rotate(90deg)}
.faq details[open] summary .pm::after{transform:rotate(0)}
.faq details[open] summary .pm{background:var(--yellow)}
.faq .answer{overflow:hidden}
.faq .answer > div{padding:0 0 22px;color:var(--ink-soft);max-width:64ch}

/* ---------- resources ---------- */
.notice{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start;padding:clamp(20px, 2.6vw, 30px);border-radius:var(--r-lg);background:var(--red)}
.notice svg{width:26px;height:26px;color:var(--ink);margin-top:2px}
.notice h2{font-size:1.375rem;margin-bottom:6px}
.notice p{margin:0}
.notice a{font-weight:600}
.filters{display:flex;flex-wrap:wrap;gap:8px;margin:clamp(40px, 5vw, 64px) 0 28px}
.filter{border:1.5px solid var(--rule);background:var(--surface);border-radius:0;padding:9px 16px;font-weight:500;font-size:var(--t-s);cursor:pointer;transition:background .3s, border-color .3s, color .3s}
.filter:hover{border-color:var(--ink)}
.filter[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.res-grid{display:grid;grid-template-columns:repeat(3, minmax(0,1fr));gap:clamp(12px, 1.6vw, 20px)}
.res{display:flex;flex-direction:column;gap:10px;padding:24px;border-radius:var(--r-md);background:var(--surface);text-decoration:none;border:1px solid transparent;transition:border-color .35s, transform .5s var(--ease)}
.res:hover{border-color:var(--ink);transform:translateY(-3px)}
.res[hidden]{display:none}
.res .kind{display:inline-flex;align-self:flex-start;align-items:center;gap:7px;font-size:var(--t-xs);font-weight:600;color:var(--ink-soft)}
.res .kind i{width:8px;height:8px;border-radius:50%;background:var(--c)}
.res h3{font-size:1.25rem;font-family:var(--display)}
.res p{margin:0;font-size:var(--t-s);color:var(--ink-soft)}
.res .go{margin-top:auto;padding-top:8px;font-size:var(--t-s);font-weight:600;display:flex;gap:6px;align-items:center}
.res .go svg{width:15px;height:15px;transition:transform .45s var(--ease)}
.res:hover .go svg{transform:translate(2px,-2px)}
.res .phone{font-variant-numeric:tabular-nums;font-weight:600;color:var(--ink)}

/* ---------- writing index & article ---------- */
.post-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.post-list li{border-bottom:1px solid var(--rule)}
.post-list a{display:grid;grid-template-columns:140px minmax(0,1fr) auto;gap:clamp(16px, 3vw, 40px);align-items:center;padding:clamp(20px, 2.6vw, 32px) 0;text-decoration:none}
.post-list .thumb{aspect-ratio:1;border-radius:16px;background:var(--c);position:relative;overflow:hidden}
.post-list .thumb svg{position:absolute;inset:0;width:100%;height:100%;transition:transform .9s var(--ease)}
.post-list a:hover .thumb svg{transform:scale(1.1) rotate(4deg)}
.post-list h2{font-size:clamp(1.5rem, 1.1rem + 1.4vw, 2.25rem);margin-bottom:8px;transition:color .3s}
.post-list a:hover h2{color:var(--blue)}
.post-list p{margin:0;color:var(--ink-soft);max-width:60ch}
.post-list .meta{font-size:var(--t-s);color:var(--ink-soft);text-align:right;white-space:nowrap}
.article-head{padding-top:clamp(132px, 16vw, 200px);padding-bottom:clamp(32px, 4vw, 56px)}
.article-head h1{font-size:clamp(2.5rem, 1.5rem + 4vw, 4.75rem);max-width:18ch;margin:.3em 0 .4em}
.article-cover{aspect-ratio:21/9;border-radius:var(--r-lg);background:var(--c);position:relative;overflow:hidden}
.article-cover svg{position:absolute;inset:0;width:100%;height:100%}
.article{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,66ch) minmax(0,1fr);padding-top:clamp(40px, 5vw, 72px)}
.article > *{grid-column:2}
.article .prose{font-size:.9375rem;line-height:1.7}
.article .prose > p:first-child{font-size:var(--t-lead);line-height:1.45}
.callout{background:var(--teal);border-radius:var(--r-md);padding:22px 24px;margin:2em 0}
.callout p:last-child{margin:0}

/* ---------- speaking ---------- */
.formats{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:0}
.formats li{padding:8px 14px;border-radius:99px;border:1px solid var(--rule);background:var(--surface);font-size:var(--t-s);font-weight:500}

/* form */
.form{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:18px 20px}
.field{display:flex;flex-direction:column;gap:7px}
.field.full{grid-column:1 / -1}
.field label{font-weight:600;font-size:var(--t-s)}
.field label small{font-weight:400;color:var(--ink-soft)}
.field input,.field select,.field textarea{width:100%;min-height:52px;padding:13px 16px;border-radius:14px;border:1.5px solid var(--rule);background:var(--surface);
  transition:border-color .3s, box-shadow .3s;appearance:none;-webkit-appearance:none}
.field textarea{min-height:150px;resize:vertical}
.field select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%23111111' stroke-width='1.8' viewBox='0 0 24 24'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;padding-right:44px}
.field input::placeholder,.field textarea::placeholder{color:#76766f}
.field input:hover,.field select:hover,.field textarea:hover{border-color:#b5b5ad}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 4px rgba(47,106,179,.14)}
.field[data-error] input,.field[data-error] textarea,.field[data-error] select{border-color:var(--error)}
.field .err{display:none;font-size:var(--t-xs);color:var(--error);font-weight:500}
.field[data-error] .err{display:block}
.form-foot{grid-column:1 / -1;display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px;margin-top:6px}
.form-foot p{margin:0;font-size:var(--t-xs);color:var(--ink-soft);max-width:48ch}
.form-status{grid-column:1 / -1;border-radius:14px;padding:16px 18px;background:var(--teal);font-weight:500}
.form-status[hidden]{display:none}
.form-card{background:var(--surface);border-radius:var(--r-lg);padding:clamp(24px, 4vw, 52px)}

/* ---------- book page ---------- */
.book-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(20px, 3vw, 40px);align-items:start}
.clinic-card{background:var(--night);color:#fff;border-radius:var(--r-lg);padding:clamp(28px, 4vw, 52px);position:sticky;top:100px}
.clinic-card h2{font-size:clamp(1.75rem, 1.2rem + 2vw, 2.75rem);margin-bottom:.5em}
.clinic-card dl{display:grid;grid-template-columns:auto 1fr;gap:14px 20px;margin:0 0 30px}
.clinic-card dt{color:var(--night-soft);font-size:var(--t-s)}
.clinic-card dd{margin:0;font-weight:500}
.clinic-card .ph{color:var(--ink)}
.clinic-card .actions .btn-ghost{color:#fff}
.clinic-card .actions .btn-ghost:hover{background:#fff;color:var(--ink);border-color:#fff}
.clinic-card .fine{font-size:var(--t-xs);color:var(--night-soft);margin:22px 0 0}
.expect{display:grid;gap:clamp(12px, 1.6vw, 18px)}
.expect article{background:var(--surface);border-radius:var(--r-md);padding:24px 26px}
.expect h3{font-size:1.25rem;margin-bottom:6px}
.expect p{margin:0;color:var(--ink-soft)}

/* ---------- reveal defaults (content always visible without JS) ---------- */
.js-motion [data-reveal]{will-change:transform, opacity}

/* ---------- responsive ---------- */
@media (max-width:1080px){
  .nav-links{display:none}
  .menu-btn{display:block}
  .foot-grid{grid-template-columns:1fr 1fr}
  .posts{grid-template-columns:repeat(2, minmax(0,1fr))}
  .posts .post:nth-child(3){display:none}
  .res-grid{grid-template-columns:repeat(2, minmax(0,1fr))}
  .care-layout{grid-template-columns:1fr}
  .care-nav{position:static;display:flex;flex-wrap:wrap;gap:6px}
  .care-nav a{background:var(--surface)}
}
@media (max-width:860px){
  .nav .nav-cta .btn{display:none}
  .hero-grid,.split,.statement,.band{grid-template-columns:1fr}
  .hero-copy,.portrait,.split .media,.split .body,.split.flip .media,.split.flip .body,.statement h2,.statement .side,.band .band-copy,.band .band-media{grid-column:1 / -1}
  .split.flip .media{order:0}
  .portrait{max-width:none}
  .portrait-frame{aspect-ratio:5/4}
  .portrait-frame:has(img){aspect-ratio:4/5}
  .float-card{left:12px;right:12px;bottom:12px;max-width:none}
  .split .media{aspect-ratio:4/3}
  .band .band-media{min-height:260px}
  .care-row a{grid-template-columns:1fr auto;padding-right:0}
  .care-row p{grid-column:1 / -1;grid-row:2}
  .care-row .arrow{grid-row:1;grid-column:2;width:44px;height:44px}
  .cta{grid-template-columns:1fr}
  
  .helps{grid-template-columns:1fr}
  .book-grid{grid-template-columns:1fr}
  .clinic-card{position:static}
  .post-list a{grid-template-columns:84px minmax(0,1fr)}
  .post-list .meta{grid-column:2;text-align:left}
  .form{grid-template-columns:1fr}
}
@media (max-width:620px){
  .posts,.res-grid{grid-template-columns:1fr}
  .posts .post:nth-child(3){display:flex}
  .post-cover{aspect-ratio:16/9}
  .foot-grid{grid-template-columns:1fr}
  .actions .btn{flex:1 1 auto}
  .book-pill{left:16px;right:16px}
  .book-pill .btn{width:100%}
  .ack{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms !important;animation-duration:.01ms !important}
}

/* ---------- typographic covers (condensed display on a colour field) ---------- */
.post-cover{flex-direction:column;align-items:flex-start;justify-content:space-between;gap:16px}
.cover-type{font-family:var(--display);font-weight:400;text-transform:uppercase;
  font-size:clamp(1.75rem, 1rem + 2.2vw, 2.75rem);line-height:.92;letter-spacing:-.01em;color:var(--ink);transform:rotate(-4deg);transform-origin:left top;
  max-width:11ch;transition:transform .9s var(--ease)}
.post:hover .cover-type{transform:rotate(0) scale(1.03)}
.post-cover .tag{order:-1}
.post-list .thumb{display:grid;place-items:center}
.post-list .thumb span{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(1.25rem, .9rem + 1vw, 1.75rem);transform:rotate(-8deg);transition:transform .9s var(--ease)}
.post-list a:hover .thumb span{transform:rotate(0) scale(1.08)}

/* ---------- ruled rows (values, speaking topics) ---------- */
.rows{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.rows li{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(12px, 3vw, 48px);align-items:baseline;padding:clamp(22px, 2.8vw, 34px) 0;border-bottom:1px solid var(--rule)}
.rows h3{font-size:var(--t-h3);display:flex;align-items:center;gap:.5em}
.rows h3 i{width:.5em;height:.5em;border-radius:50%;background:var(--c);flex:none}
.rows p{margin:0;color:var(--ink-soft);max-width:52ch}

/* timeline: date column */
.timeline li{display:grid;grid-template-columns:130px minmax(0,1fr);gap:20px;align-items:baseline}
.timeline time{margin:0;color:var(--ink);font-variant-numeric:tabular-nums}
@media (max-width:860px){
  .rows li{grid-template-columns:1fr}
  .timeline li{grid-template-columns:1fr;gap:4px}
}
@media (max-width:620px){ .cover-type{font-size:2.75rem} }

/* ---------- hero headlines: FK Screamer, all caps (trial licence — preview only) ---------- */
.hero h1,.page-hero h1,.article-head h1{font-family:var(--hero);font-weight:700;text-transform:uppercase;line-height:.86;letter-spacing:0}
.hero h1{font-size:clamp(4rem, 2rem + 8vw, 10rem)}
.page-hero h1{font-size:clamp(3.75rem, 2rem + 7vw, 9rem);max-width:none}
.article-head h1{font-size:clamp(3rem, 1.6rem + 5vw, 6.5rem)}

/* FK Screamer is very condensed: give section headings more size, and set every display use in caps */
:root{--t-h2:clamp(2.75rem, 1.6rem + 4.4vw, 5.75rem);--t-h3:clamp(1.75rem, 1.3rem + 1.4vw, 2.5rem)}
.quote,.statement h2,.foot-big,.mobile-menu li a,.res h3,.cover-type,.post-list .thumb span,.opt-label b,.opt-jump a,.oa-n{font-family:var(--display);font-weight:700;text-transform:uppercase;line-height:.92}
.statement h2{font-size:clamp(2.5rem, 1.4rem + 4vw, 5rem)}
.quote{font-size:clamp(2.5rem, 1.4rem + 4vw, 5rem)}
.foot-big{font-size:clamp(2.5rem, 1.6rem + 2.6vw, 3.75rem)}
.care-row h3{font-size:clamp(2.25rem, 1.4rem + 2.6vw, 3.75rem)}
.post-body h3{font-size:1.875rem}
.res h3{font-size:1.75rem}
.expect h3,.clinic-card h2{line-height:.95}
.expect h3{font-size:1.625rem}
.faq summary{font-family:var(--sans)}

/* Rotating hero line: a clipped box one line tall. The outgoing phrase slides up and fades out inside it, never over "A GP for"; the next rises in from below. */
.hc-rot{display:grid;overflow:hidden;padding-block:.06em;margin-block:-.06em;transition:height .7s var(--ease)}
.hc-rot > span{grid-area:1 / 1;align-self:start;color:var(--c);opacity:0;transform:translateY(105%);pointer-events:none;
  transition:opacity .5s ease, transform .75s var(--ease)}
.hc-rot > span.on{opacity:1;transform:none;transition-delay:.12s}
.hc-rot > span.out{opacity:0;transform:translateY(-105%);transition:opacity .55s ease, transform .7s var(--ease)}
@media (prefers-reduced-motion:reduce){.hc-rot > span{transition:none}}

/* Section 2 statement: Screamer sets very tight, so open the tracking and word spacing */
.statement h2{letter-spacing:.025em;word-spacing:.12em;line-height:.98}
.quote{letter-spacing:.02em;word-spacing:.1em;line-height:.98}

/* ---------- Buttons: display caps (Option E). FK Screamer, all caps, square blocks. ---------- */
.btn{--bh:56px;font-family:var(--display);font-weight:700;text-transform:uppercase;font-size:1.75rem;letter-spacing:.02em;line-height:1;padding:0 22px;gap:12px}
.btn svg{width:22px;height:22px}
.btn:hover svg{transform:translateX(5px)}
.btn-sm{--bh:44px;font-size:1.375rem;padding:0 16px}
.btn-sm svg{width:18px;height:18px}
.btn-ghost{border-width:2px}
.btn-ghost:hover{background:var(--ink);color:var(--pink);border-color:var(--ink)}
.clinic-card .actions .btn-ghost:hover{color:var(--ink)}
@media (max-width:620px){ .btn{font-size:1.5rem;--bh:52px} }

/* No black-filled buttons: hovers move to the palette instead */
.btn-primary:hover{background:var(--yellow);color:var(--ink)}
.btn-ghost:hover{background:var(--pink);color:var(--ink);border-color:var(--pink)}
.cta .btn-primary:hover{background:#fff}
.cta .btn-ghost:hover{background:#fff;border-color:#fff}
.clinic-card .actions .btn-ghost:hover{background:var(--pink);border-color:var(--pink);color:var(--ink)}

/* ---------- What I can help with: flip tiles (Option J) ----------
   Deliberately asymmetric: tiles flip over slowly with a little overshoot and lift,
   and fall back faster after a short pause, so moving between tiles never looks mirrored. */
.care-flip{display:grid;grid-template-columns:1fr 1fr;perspective:1800px}
.care-flip a{aspect-ratio:16/10;text-decoration:none;color:var(--ink);position:relative;z-index:0}
.care-flip a:hover,.care-flip a:focus-visible{z-index:2}
.cf-in{position:relative;height:100%;transform-style:preserve-3d;
  transition:transform .55s cubic-bezier(.55,0,.75,.4) .08s, scale .5s var(--ease) .05s}
.care-flip a:hover .cf-in,.care-flip a:focus-visible .cf-in{transform:rotateY(180deg);scale:1.025;
  transition:transform 1.05s cubic-bezier(.2,1.35,.45,1), scale .7s var(--ease)}
.care-flip a:nth-child(even):hover .cf-in,.care-flip a:nth-child(even):focus-visible .cf-in{transform:rotateY(-180deg)}
.cf-front,.cf-back{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:var(--c);padding:clamp(22px, 3vw, 44px);display:flex;flex-direction:column;justify-content:space-between}
.cf-front h3{font-size:clamp(2.75rem, 1.4rem + 4vw, 6rem);max-width:9ch}
.cf-front span{font-size:var(--t-xs);display:flex;align-items:center;gap:8px}
.cf-back{transform:rotateY(180deg)}
.care-flip a:nth-child(even) .cf-back{transform:rotateY(-180deg)}
.cf-back h4{font-size:clamp(1.5rem, 1rem + 1vw, 2.25rem)}
.cf-back p{max-width:42ch;margin:0}
.cf-back ul{list-style:none;padding:0;margin:0;display:grid;gap:6px}
.cf-back li{padding-top:6px;border-top:1px solid rgba(17,17,17,.25);font-size:var(--t-s)}
.cf-go{display:inline-flex;align-items:center;gap:8px;font-family:var(--display);font-weight:700;text-transform:uppercase;font-size:1.375rem}
.cf-go svg{width:20px;height:20px}
/* Touch screens: no flip, show the details under the title */
@media (hover:none), (max-width:860px){
  .care-flip{grid-template-columns:1fr}
  .care-flip a{aspect-ratio:auto}
  .cf-in,.care-flip a:hover .cf-in{transform:none !important;scale:1 !important}
  .cf-front,.cf-back{position:relative;inset:auto;backface-visibility:visible;transform:none !important}
  .cf-front{padding-bottom:0}
  .cf-front span,.cf-back h4{display:none}
  .cf-back{gap:14px}
}
@media (prefers-reduced-motion:reduce){ .cf-in{transition:none !important} }
.cf-front span svg{width:16px;height:16px;flex:none}
.cf-front span{font-size:var(--t-s)}

/* Section 2 statement: Quadrant Text, sentence case, same size as before */
.statement h2{font-family:var(--sans);font-weight:400;text-transform:none;letter-spacing:-.015em;word-spacing:normal;line-height:1.12}
.statement h2{font-size:clamp(1.625rem, 1.1rem + 1.9vw, 2.75rem);line-height:1.18;grid-column:1 / 11}
@media (max-width:860px){ .statement h2{grid-column:1 / -1} }
.statement h2{font-size:clamp(1.875rem, 1.2rem + 2.5vw, 3.5rem);line-height:1.15}

/* ---------- Booking your first visit: sticky counter ----------
   Heading, a giant step number and the button stay pinned on the left;
   the number swaps (and recolours) as each step passes on the right. */
.fv{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px, 4vw, 64px);align-items:start}
.fv-left{position:sticky;top:100px;display:grid;gap:12px;justify-items:start}
.fv-left h2{font-size:var(--t-h2)}
.fv-num{display:grid;margin:4px 0 16px}
.fv-num span{grid-area:1/1;font-family:var(--hero);font-weight:700;font-size:clamp(9rem, 6rem + 9vw, 16rem);line-height:.8;color:var(--c);opacity:0;transform:translateY(24px);transition:opacity .4s, transform .7s var(--ease)}
.fv-num span.on{opacity:1;transform:none}
.fv-steps{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.fv-steps li{min-height:52vh;border-top:6px solid var(--c);background:var(--surface);padding:clamp(24px, 3vw, 44px);display:flex;flex-direction:column;justify-content:center;gap:10px}
.fv-n{font-size:var(--t-xs);color:var(--ink-soft)}
.fv-steps h3{font-size:clamp(2.25rem, 1.4rem + 2.6vw, 4rem)}
.fv-steps p{max-width:42ch;margin:0}
@media (max-width:860px){
  .fv{grid-template-columns:1fr}
  .fv-left{position:static}
  .fv-num{display:none}
  .fv-steps li{min-height:0}
}

/* ---------- Writing on home: zine covers (tilted, straighten and lift on hover) ---------- */
.zines{display:grid;grid-template-columns:repeat(3, minmax(0,1fr));gap:clamp(16px, 2.4vw, 40px);padding:20px clamp(8px, 2vw, 24px)}
.zine{background:var(--c);aspect-ratio:3/4;padding:clamp(18px, 2vw, 28px);display:flex;flex-direction:column;gap:14px;text-decoration:none;color:var(--ink);
  transform:rotate(var(--r));box-shadow:0 26px 40px -24px rgba(17,17,17,.5);transition:transform .7s var(--ease), box-shadow .7s var(--ease)}
.zine:hover,.zine:focus-visible{transform:rotate(0) translateY(-12px);box-shadow:0 36px 60px -26px rgba(17,17,17,.55)}
.zine .tag{align-self:flex-start;background:rgba(255,255,255,.75);padding:5px 12px;font-size:var(--t-xs);font-weight:600}
.zine-t{font-family:var(--display);font-weight:700;text-transform:uppercase;font-size:clamp(3rem, 1.6rem + 3.6vw, 6rem);line-height:.86;margin-top:auto}
.zine-foot{font-size:var(--t-xs);border-top:1.5px solid var(--ink);padding-top:10px}
.zine[aria-disabled="true"]{cursor:default}
@media (max-width:860px){ .zines{grid-template-columns:1fr} .zine{aspect-ratio:4/3} }

/* Header: always solid white, no see-through blur */
.site-header,.site-header.is-solid{background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none}
.site-header.is-solid{box-shadow:0 1px 0 var(--rule)}
.brand img{height:clamp(30px, 2.3vw, 40px)}
.site-header{background:transparent}.site-header.is-solid{background:var(--bg)}

/* ---------- Home closing CTA: two doors (book / support). Each whole block is the link. ---------- */
.doors-h{font-size:var(--t-h2);margin-bottom:clamp(20px, 3vw, 36px)}
.doors{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.door{background:var(--c);min-height:clamp(260px, 30vw, 380px);padding:clamp(22px, 3vw, 40px);display:flex;flex-direction:column;justify-content:space-between;text-decoration:none;color:var(--ink);position:relative;overflow:hidden}
.door small{font-size:var(--t-s)}
.door span{font-family:var(--display);font-weight:700;text-transform:uppercase;font-size:clamp(3rem, 1.6rem + 4vw, 6.5rem);line-height:.86}
.door svg{position:absolute;right:clamp(22px, 3vw, 40px);bottom:clamp(22px, 3vw, 40px);width:clamp(40px, 5vw, 72px);height:auto;transition:transform .6s var(--ease)}
.door:hover svg,.door:focus-visible svg{transform:translateX(12px)}
.door::after{content:"";position:absolute;inset:0;background:var(--ink);opacity:0;transition:opacity .4s}
.door:hover::after{opacity:.05}
@media (max-width:620px){ .doors{grid-template-columns:1fr} .door{min-height:200px} }

/* Footer line: Screamer needs open tracking at this size */
.foot-big{letter-spacing:.025em;word-spacing:.12em;line-height:.95}
.foot-grid a[href^="tel"]{font-variant-numeric:tabular-nums}
.clinic-card dd a{color:#fff;text-underline-offset:3px}
.foot-big{line-height:1.02;margin-bottom:clamp(24px, 2.6vw, 36px)}
/* Footer line: tight tracking (Screamer default), original line height */
.foot-big{letter-spacing:.005em;word-spacing:normal;line-height:.95}

/* ---------- Footer: plain acknowledgement ---------- */
.ack{background:none;padding:0;border-radius:0;display:block}

/* Text on the blue field must be white (black on #3770b5 is under 4.5:1) */
.door-blue{color:#fff}
.door-blue::after{background:#fff}

/* ---------- Care page: tiles up top, then plain sections (no colour bars) ---------- */
.area-tiles{display:grid;grid-template-columns:repeat(4, minmax(0,1fr));gap:8px;margin-bottom:clamp(64px, 8vw, 120px)}
.area-tile{background:var(--c);aspect-ratio:1;padding:clamp(16px, 1.8vw, 24px);display:flex;flex-direction:column;justify-content:space-between;text-decoration:none;color:var(--ink);transition:transform .6s var(--ease)}
.area-tile:hover,.area-tile:focus-visible{transform:translateY(-8px)}
.at-h{font-size:clamp(1.75rem, 1rem + 2vw, 3rem)}
.area-tile span{display:flex;align-items:center;gap:8px;font-size:var(--t-s)}
.area-tile svg{width:16px;height:16px;flex:none;transform:rotate(90deg);transition:transform .5s var(--ease)}
.area-tile:hover svg{transform:rotate(90deg) translateX(4px)}
.area{padding-block:clamp(48px, 6vw, 88px);border-top:1.5px solid var(--ink);scroll-margin-top:90px}
.area-head{display:flex;align-items:center;gap:clamp(14px, 1.6vw, 22px);margin-bottom:clamp(24px, 3vw, 40px)}
.area-sq{width:clamp(36px, 3.4vw, 56px);aspect-ratio:1;background:var(--c);flex:none}
.area-head h2{font-family:var(--hero);font-size:clamp(3rem, 1.6rem + 4.4vw, 7rem);line-height:.84}
.area-body{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px, 5vw, 80px);align-items:start}
.area-body .lead{max-width:44ch}
.area-helps{list-style:none;margin:20px 0 0;padding:0}
.area-helps li{display:flex;gap:10px;align-items:flex-start;padding:11px 0;border-bottom:1px solid var(--rule)}
.area-helps svg{width:18px;height:18px;flex:none;margin-top:3px;color:var(--ink)}
.area-helps li svg{background:var(--c);padding:2px}
.area-q{font-size:1.75rem;margin-bottom:12px}
.area-book{background:var(--surface);padding:24px;display:grid;gap:16px;justify-items:start}
.area-book p{margin:0}
@media (max-width:860px){
  .area-tiles{grid-template-columns:1fr 1fr}
  .area-body{grid-template-columns:1fr}
}

/* Care page spacing (Option D): title + colour square in a sticky left column, content right with a wide gutter */
.area-tiles{gap:16px;margin-bottom:clamp(96px, 12vw, 180px)}
.area{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(32px, 6vw, 120px);padding-block:clamp(72px, 8vw, 128px)}
.area-head{flex-direction:column;align-items:flex-start;gap:20px;margin:0;position:sticky;top:100px;align-self:start}
.area-head h2{font-size:clamp(2.75rem, 1.6rem + 3vw, 5rem)}
.area-body{grid-template-columns:1fr;gap:clamp(40px, 5vw, 64px)}
.area-helps{display:grid;grid-template-columns:1fr 1fr;column-gap:32px}
.area-helps li{padding:15px 0}
.area .faq summary{padding:24px 0}
@media (max-width:860px){
  .area{grid-template-columns:1fr}
  .area-head{position:static}
  .area-helps{grid-template-columns:1fr}
}

/* ---------- Page transition: four colour stripes, rotating through the palette each page load ---------- */
html.tx-in body::after{content:"";position:fixed;inset:0;z-index:199;
  background:linear-gradient(90deg, var(--tx0) 0 25%, var(--tx1) 25% 50%, var(--tx2) 50% 75%, var(--tx3) 75% 100%)}
.tx-stripes{position:fixed;inset:0;z-index:201;display:grid;grid-template-columns:repeat(4, 1fr);pointer-events:none;visibility:hidden}
.tx-stripes.on{visibility:visible;pointer-events:auto}
.tx-stripes.cover{background:var(--bg)} /* opaque while the stripes rise on a fresh load */
.tx-stripes i{display:block;height:100%;margin-right:-1px;will-change:transform;transform:translateY(100%)}
/* Safety net: if scripts fail to load, never leave the page covered */
html.tx-in body::after{animation:txSafe 0s linear 6s forwards}
html.tx-in.tx-intro body::after{animation-delay:9s}
/* first-load mascot: sits on the plain cover, under the stripes */
.tx-mascot{position:fixed;left:45%;bottom:0;width:min(96vw,97vh);z-index:200;pointer-events:none;transform:translate(-50%,115%);transition:transform .9s cubic-bezier(.22,1.1,.36,1)}
.tx-mascot.in{transform:translate(-50%,0)}
.tx-mascot svg{display:block;width:100%;height:auto;overflow:visible}
@keyframes txSafe{to{visibility:hidden}}

/* Fresh load (typed URL / refresh): hold a plain cover so the stripes can rise before they fall */
html.tx-in.tx-fresh body::after{background:var(--bg)}

/* ---------- Resources: cards on the topic colours (crisis red, trans pink, community teal, sexual yellow, young lilac) ---------- */
.res{position:relative;background:var(--c);color:var(--ink);border:0;padding:clamp(20px, 2vw, 28px);min-height:280px;gap:12px;transition:transform .55s var(--ease)}
.res:hover,.res:focus-within{transform:translateY(-6px);border-color:transparent}
.res .kind{font-size:var(--t-xs);font-weight:600;color:var(--ink);background:rgba(255,255,255,.7);padding:4px 10px}
.res .kind i{display:none}
.res h3{font-family:var(--display);font-weight:700;text-transform:uppercase;font-size:clamp(1.875rem, 1.3rem + 1.2vw, 2.5rem);line-height:.92}
.res h3 a{text-decoration:none;color:inherit}
.res h3 a::after{content:"";position:absolute;inset:0;z-index:1}
.res p{color:var(--ink);opacity:.85}
.res-phone{position:relative;z-index:2;align-self:flex-start;font-family:var(--hero);font-weight:700;font-size:clamp(2rem, 1.5rem + 1.2vw, 2.75rem);line-height:1;color:var(--ink);text-decoration:none;font-variant-numeric:tabular-nums;
  background:linear-gradient(currentColor,currentColor) 0 100%/0 2px no-repeat;transition:background-size .4s var(--ease)}
.res-phone:hover{background-size:100% 2px}
.res .go{color:var(--ink);font-family:var(--display);font-weight:700;text-transform:uppercase;font-size:1.25rem;border-top:1.5px solid rgba(17,17,17,.35);padding-top:12px;width:100%}
.res h3 a:focus-visible{outline:none}
.res:focus-within{outline:2px solid var(--ink);outline-offset:3px}
/* filters as colour chips */
.filter{border:2px solid var(--c);background:transparent;font-family:var(--display);font-weight:700;text-transform:uppercase;font-size:1.25rem;line-height:1;padding:10px 16px}
.filter:hover{background:var(--c);border-color:var(--c)}
.filter[aria-pressed="true"]{background:var(--c);border-color:var(--c);color:var(--ink)}
.filter[data-filter="all"][aria-pressed="true"],.filter[data-filter="all"]:hover{color:#fff}
.res,.notice{border-radius:0}

/* Resources cards (Option B): white card, thick topic-colour band on top, colour tag */
.res{background:var(--surface);border-top:12px solid var(--c);padding-top:22px}
.res .kind{background:var(--c)}
.res .go{border-top-color:var(--rule)}
.res:hover,.res:focus-within{transform:translateY(-6px);box-shadow:0 20px 34px -24px rgba(17,17,17,.4)}
/* Smooth card hover: lift and shadow ease together */
.res{transition:transform .55s var(--ease), box-shadow .55s var(--ease);will-change:transform}
.res:hover,.res:focus-within{transform:translateY(-6px);box-shadow:0 22px 36px -24px rgba(17,17,17,.38)}
/* Resource card hover: keep the colour band, and flood the whole card with its colour */
.res,.res:hover,.res:focus-within{border-top-color:var(--c)}
.res{transition:background-color .45s var(--ease), transform .55s var(--ease), box-shadow .55s var(--ease)}
.res:hover,.res:focus-within{background:var(--c)}
.res:hover .kind,.res:focus-within .kind{background:rgba(255,255,255,.75)}
.res:hover .go,.res:focus-within .go{border-top-color:rgba(17,17,17,.35)}

/* ---------- Book page: two big doors, key facts, "before you come" as full-width cards ---------- */
.book-doors{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.book-doors .door span{font-size:clamp(3rem, 1.6rem + 4vw, 6.5rem)}
.book-doors .door small{font-variant-numeric:tabular-nums}
.book-ask{font-size:var(--t-lead);margin:clamp(28px, 3.4vw, 44px) 0}
.book-facts{display:grid;grid-template-columns:repeat(3, minmax(0,1fr));margin:0;border-top:2px solid var(--ink)}
.book-facts div{padding:18px 24px 18px 0;border-bottom:1px solid var(--rule)}
.book-facts dt{font-size:var(--t-xs);color:var(--ink-soft);margin-bottom:4px}
.book-facts dd{margin:0;line-height:1.6}
.book-sh{font-size:var(--t-h2);margin:clamp(64px, 8vw, 112px) 0 clamp(20px, 2.4vw, 32px)}
.book-tips{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.book-tips li{display:grid;grid-template-columns:clamp(64px, 7vw, 110px) minmax(0,4fr) minmax(0,6fr);gap:clamp(16px, 3vw, 48px);align-items:center;
  background:var(--surface);border-top:8px solid var(--c);padding:clamp(18px, 2.2vw, 30px) clamp(20px, 2.6vw, 36px)}
.bt-n{font-family:var(--hero);font-weight:700;font-size:clamp(4rem, 2.6rem + 3vw, 6.5rem);line-height:.8;color:var(--c)}
.book-tips h3{font-size:clamp(1.75rem, 1.2rem + 1.4vw, 2.75rem)}
.book-tips p{margin:0;max-width:56ch}
.book-em{margin-top:clamp(40px, 5vw, 64px);background:var(--red);padding:clamp(20px, 2.4vw, 30px)}
.book-em h3{font-size:1.75rem;margin-bottom:6px}
.book-em p{margin:0;max-width:72ch}
@media (max-width:860px){
  .book-doors,.book-facts{grid-template-columns:1fr}
  .book-tips li{grid-template-columns:auto 1fr}
  .book-tips p{grid-column:1 / -1}
}
/* Small labels match the footer column headings: caps, tracked, soft ink */
.book-facts dt,.clinic-card dt{font-family:var(--sans);font-size:var(--t-xs);font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-soft)}
/* Logo: serif wordmark (2000 x 298), sized by height */
.brand img{width:auto;height:clamp(27px, 2.2vw, 36px)}

/* ---------- Mobile / iPad menu: Book first (Option F) ----------
   A big pink Book block (with the clinic phone) drops down first; the page links sit underneath as rows. */
.mobile-menu{background:var(--bg);padding:76px 0 0;justify-content:flex-start;gap:0;opacity:1;clip-path:inset(0 0 100% 0);visibility:hidden;
  transition:clip-path .6s var(--ease), visibility 0s .6s}
.menu-open .mobile-menu{clip-path:inset(0 0 0 0);visibility:visible;transition:clip-path .7s var(--ease), visibility 0s}
.mm-top{background:var(--pink);padding:22px var(--gut) 24px;display:grid;gap:10px}
.mm-top small{font-size:var(--t-xs)}
.mm-book{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;font-family:var(--hero);font-weight:700;text-transform:uppercase;
  font-size:clamp(3.25rem, 2rem + 6vw, 5rem);line-height:.86;color:var(--ink);text-decoration:none}
.mm-book svg{width:clamp(28px, 6vw, 40px);height:auto;flex:none;transition:transform .45s var(--ease)}
.mm-book:hover svg{transform:translateX(6px)}
.mm-call{font-size:var(--t-s);color:var(--ink);text-underline-offset:3px}
.mobile-menu ul{margin:8px var(--gut) 0;display:block}
.mobile-menu li{border-bottom:1px solid var(--rule);transform:none;background:none;box-shadow:none;opacity:0;translate:0 12px;transition:opacity .3s, translate .5s var(--ease)}
.mobile-menu li:nth-child(1){--c:var(--lilac)} .mobile-menu li:nth-child(2){--c:var(--pink)} .mobile-menu li:nth-child(3){--c:var(--teal)}
.mobile-menu li:nth-child(4){--c:var(--yellow)} .mobile-menu li:nth-child(5){--c:var(--green)}
.menu-open .mobile-menu li{opacity:1;translate:0 0}
.menu-open .mobile-menu li:nth-child(1){transition-delay:.22s} .menu-open .mobile-menu li:nth-child(2){transition-delay:.27s}
.menu-open .mobile-menu li:nth-child(3){transition-delay:.32s} .menu-open .mobile-menu li:nth-child(4){transition-delay:.37s}
.menu-open .mobile-menu li:nth-child(5){transition-delay:.42s}
.mobile-menu li a{display:flex;align-items:center;gap:14px;padding:14px 4px;font-size:clamp(2rem, 1.4rem + 3vw, 2.75rem);line-height:1;color:var(--ink);text-decoration:none;letter-spacing:0}
.mobile-menu li a::before{content:"";width:16px;height:16px;background:var(--c);flex:none}
.mobile-menu li a svg{margin-left:auto;width:20px;height:20px}
.mobile-menu li a[aria-current="page"]{background:var(--c);padding-left:12px;padding-right:12px;text-decoration:none}
@media (prefers-reduced-motion:reduce){ .mobile-menu,.mobile-menu li{transition:none !important} }
.mobile-menu li a[aria-current="page"]{color:var(--ink)}

/* ---------- Statement + photo strip (homepage section 2) ----------
   Desktop: three staggered photos in a row under the statement.
   Phones/tablets: a swipeable row (each photo ~78% wide, snaps) so all three stay. */
.statement{row-gap:0}
.statement .side{grid-row:3;grid-column:1 / -1;margin-top:clamp(24px, 3vw, 40px)}
.st-photos{grid-column:1 / -1;grid-row:2;display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:12px;margin-top:clamp(56px, 7vw, 104px)}
.st-photo{margin:0}
.st-photo:nth-child(2){margin-top:clamp(32px, 4vw, 56px)}
.st-photo img,.st-ph{width:100%;aspect-ratio:4/5;object-fit:cover;display:block}
/* placeholder until real photos arrive: a colour field with a fine stripe and a label */
.st-ph{position:relative;background:var(--c);background-image:repeating-linear-gradient(-45deg, rgba(255,255,255,.18) 0 10px, transparent 10px 20px);display:flex;align-items:flex-end;padding:14px}
.st-ph span{background:rgba(255,255,255,.85);padding:4px 10px;font-size:var(--t-xs);font-weight:600}
@media (max-width:860px){
  .st-photos{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:calc(var(--gut) * -1);padding-inline:var(--gut);scroll-padding-inline:var(--gut);scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .st-photos::-webkit-scrollbar{display:none}
  .st-photo{flex:0 0 78%;scroll-snap-align:start}
  .st-photo:nth-child(2){margin-top:0}
}

/* Colour cover that slides off images as they reveal (added by site.js) */
[data-photo]{position:relative;overflow:hidden}
.photo-cover{position:absolute;inset:0;z-index:2;transform-origin:top;pointer-events:none}

/* ---------- Squiggle background (drawn by site.js) ----------
   Sits behind everything; content and footer stack above it. */
body{position:relative}
.squiggle{position:absolute;left:0;top:0;width:100%;z-index:0;pointer-events:none;overflow:hidden}
.squiggle svg{display:block}
.squiggle path{fill:none;stroke-linecap:round;stroke-linejoin:round}
main,.site-footer{position:relative;z-index:1}

/* Resource card colour reveal (site.js): a full-card block of the topic colour that slides up into the band */
.res{overflow:hidden}
.card-cover{position:absolute;inset:0;z-index:3;background:var(--c);transform-origin:top;pointer-events:none}

/* Resources page sections */
.res-head{margin-bottom:clamp(20px, 2.6vw, 32px)}
.res-head p{margin:0}
#numbers .notice{margin-bottom:clamp(40px, 5vw, 64px)}
.zines-all{grid-template-columns:repeat(3, minmax(0,1fr));row-gap:clamp(28px, 3.4vw, 48px)}
#services .filters{margin-top:0}
@media (max-width:860px){ .zines-all{grid-template-columns:1fr} }
/* Guide covers sit straight (no tilt); they still lift slightly on hover */
.zine{transform:none}
.zine:hover,.zine:focus-visible{transform:translateY(-8px)}

/* Guide covers (Option A2): solid colour, title in Quadrant Text, Title Case */
.zine-t{font-family:var(--sans);font-weight:400;text-transform:capitalize;letter-spacing:-.02em;line-height:1.02;font-size:clamp(2.25rem, 1.4rem + 2.2vw, 3.75rem)}

/* ---------- Highlighter (nav Option D) ----------
   Desktop nav: the current page, and any link on hover, gets a thick marker stripe in its
   care colour behind the lower half of the word (About pink, Care teal, Resources yellow).
   Quadrant text links (Read my story, More resources, Open in Maps…) use the same marker:
   a thin stripe at rest that fills up behind the word on hover. */
.nav-links li:nth-child(1) a{--c:var(--pink)}
.nav-links li:nth-child(2) a{--c:var(--teal)}
.nav-links li:nth-child(3) a{--c:var(--yellow)}
.nav-links a::after{display:none}
.nav-links a{padding:2px 4px;color:var(--ink);background:linear-gradient(var(--c),var(--c)) 0 88%/0 48% no-repeat;transition:background-size .45s var(--ease)}
.nav-links a:hover,.nav-links a[aria-current="page"]{background-size:100% 48%;color:var(--ink)}
.link{--hl:var(--pink);padding:0 3px 1px;color:var(--ink);background:linear-gradient(var(--hl),var(--hl)) 0 100%/100% 3px no-repeat;transition:background-size .45s var(--ease)}
.link:hover,.link:focus-visible{background-size:100% 52%;color:var(--ink)}
/* Mobile menu: leave out the page you're already on */
.mobile-menu li:has(> a[aria-current="page"]){display:none}
/* Text links: no stripe at rest; the marker draws in behind the words on hover, like the nav */
.link{background:linear-gradient(var(--hl),var(--hl)) 0 88%/0 48% no-repeat;padding:2px 4px}
.link:hover,.link:focus-visible{background-size:100% 48%}
/* Same hover highlighter on the back link on guide pages and the footer's text links */
.crumb,.foot-grid ul a:not(.btn):not(.link){--hl:var(--pink);color:var(--ink-soft);padding:2px 4px;margin-left:-4px;background:linear-gradient(var(--hl),var(--hl)) 0 88%/0 48% no-repeat;transition:background-size .45s var(--ease), color .3s}
.crumb:hover,.crumb:focus-visible,.foot-grid ul a:not(.btn):not(.link):hover{background-size:100% 48%;color:var(--ink)}
/* Guide pages: all body text at the larger intro size */
.article .prose,.article .prose p,.article .prose li,.article .prose .callout p{font-size:var(--t-lead);line-height:1.5}
.article .prose li{margin-bottom:.5em}

/* Square everywhere: no rounded panels, cards, callouts, fields or frames */
:root{--r-lg:0px;--r-md:0px}
.callout,.cta,.band,.clinic-card,.expect article,.float-card,.split .media,.portrait-frame,.ack,.form-card,.notice,.post,.post-cover,.post-list .thumb,
.article-cover,.value,.topic,.chip,.badge,.ph,.field input,.field select,.field textarea,.form-status,.care-nav a,.res,.filter,.tag,.kind{border-radius:0 !important}

/* About: five true things (Option J) */
.facts-intro{font-size:var(--t-lead);max-width:46ch;margin:0 0 clamp(24px, 3vw, 40px)}
.facts{list-style:none;margin:0;padding:0;border-top:1.5px solid var(--ink)}
.facts li{display:grid;grid-template-columns:auto minmax(0,1.5fr) minmax(0,1fr);gap:clamp(16px, 3vw, 48px);align-items:center;padding:clamp(18px, 2.4vw, 32px) clamp(0px, 1vw, 16px);border-bottom:1.5px solid var(--ink);background:linear-gradient(var(--c),var(--c)) 0 100%/100% 0 no-repeat;transition:background-size .5s var(--ease)}
.facts li:hover{background-size:100% 100%}
.facts i{width:clamp(28px, 3vw, 48px);aspect-ratio:1;background:var(--c);display:block;transition:background-color .5s}
.facts h2{margin:0;font-size:clamp(2.8rem, 1.4rem + 4.4vw, 6.5rem);line-height:.88}
.facts p{margin:0;font-size:var(--t-s);max-width:36ch}
@media (max-width:860px){.facts li{grid-template-columns:auto 1fr}.facts p{grid-column:2}}
.facts-sec{padding-top:0}
.hero .lead + .hero-more{margin-top:-.6em}
.hero-more{font-size:var(--t-lead);line-height:1.45;letter-spacing:-.005em;max-width:36ch;margin:0 0 1em}
.hero-more:last-of-type{margin-bottom:1.8em}

/* Help box: white with a red band on top, like the number cards (Option B, picked 14 Oct 2026) */
.notice{background:var(--surface);border-top:12px solid var(--red)}
.notice svg{color:var(--red)}

/* Phones: the transition is one solid colour panel instead of four stripes */
@media (max-width:700px){
  .tx-stripes{grid-template-columns:1fr}
  .tx-stripes i:nth-child(n+2){display:none}
  html.tx-in body::after{background:var(--tx0)}
  html.tx-in.tx-fresh body::after{background:var(--bg)}
}

/* 404: going in circles (Option D, picked 14 Oct 2026) */
.nf{position:relative;min-height:100svh;display:grid;place-items:center;text-align:center;overflow:hidden;padding:clamp(120px, 14vw, 160px) var(--gutter, 20px) clamp(56px, 7vw, 96px)}
.nf .loops{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.nf .loops ellipse{stroke-dasharray:var(--len);stroke-dashoffset:var(--len);animation:nfDraw 1.6s cubic-bezier(.65,0,.35,1) forwards}
.nf .loops ellipse:nth-child(2){animation-delay:.18s}.nf .loops ellipse:nth-child(3){animation-delay:.36s}
@keyframes nfDraw{to{stroke-dashoffset:0}}
@media (prefers-reduced-motion: reduce){.nf .loops ellipse{animation:none;stroke-dashoffset:0}}
.nf-in{position:relative;max-width:640px}
.nf-tag{display:inline-block;font-size:var(--t-xs);font-weight:600;background:var(--surface);padding:4px 10px;margin-bottom:18px}
.nf h1{font-family:var(--display);font-weight:700;text-transform:uppercase;line-height:.85;font-size:clamp(3.6rem, 2rem + 6vw, 8.5rem);margin:0 0 .3em}
.nf p{font-size:var(--t-lead);line-height:1.45;max-width:36ch;margin:0 auto 1.4em}
.nf .actions{justify-content:center}

/* Hide "check with Noah" notes site-wide (kept in the markup for review; delete these rules to show them again) */
.badge{display:none}
details:has(.answer .ph){display:none}
.book-facts div:has(> dd .ph){display:none}