
  :root{
    --teal:#587b7f; --teal-dark:#46666a; --forest:#082d0f; --sage:#789ea3;
    --mint:#f0f7f4; --mint-deep:#e4efe9; --gold:#f3c98b; --gold-soft:#faecd6;
    --ink:#22302f; --ink-soft:#4c5a59; --line:#dde7e2; --white:#fff;
    --field-border:#76938c; --amber-note:#8a5a00; --radius:14px;
    --shadow:0 1px 2px rgba(8,45,15,.05),0 10px 30px -14px rgba(8,45,15,.18);
    --maxw:1140px;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{font-family:'Montserrat',sans-serif;font-size:17px;line-height:1.7;color:var(--ink);background:var(--white);-webkit-font-smoothing:antialiased;font-feature-settings:'kern' 1,'liga' 1,'calt' 1;text-wrap:pretty}
  /* Editorial display face for headings; Zilla Slab retained for sub-headings to stay close to brand.
     Fraunces SOFT axis (opsz + SOFT) warms the display cut so it reads as the soft paper-art idiom; text-wrap:balance evens headline rags. */
  h1,h2,h3{font-family:'Fraunces',serif;color:var(--forest);line-height:1.12;letter-spacing:-.015em;font-weight:500;font-optical-sizing:auto}
  h1{font-size:clamp(2.5rem,5.2vw,4rem);font-variation-settings:"opsz" 144,"SOFT" 26;letter-spacing:-.022em;text-wrap:balance}
  h2{font-size:clamp(1.7rem,3vw,2.35rem);margin-bottom:.5em;font-variation-settings:"opsz" 120,"SOFT" 26;text-wrap:balance}
  h3{font-family:'Zilla Slab',serif;font-weight:600;font-size:1.16rem;color:var(--forest);letter-spacing:0}
  p{margin-bottom:1em}
  a{color:var(--teal-dark)}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}
  .narrow{max-width:760px}
  a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--teal);outline-offset:3px;border-radius:4px}
  .skip{position:absolute;left:-999px;top:0;background:var(--forest);color:#fff;padding:.6rem 1rem;z-index:99}
  .skip:focus{left:0}
  .mockbar{background:var(--forest);color:#cfe3d4;font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;text-align:center;padding:.5rem .75rem}
  .mockbar strong{color:var(--gold);font-weight:600}

  /* header */
  header.site{background:rgba(255,255,255,.86);backdrop-filter:saturate(1.2) blur(8px);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50;transition:box-shadow .2s ease}
  header.site.is-scrolled{box-shadow:0 4px 16px -8px rgba(8,45,15,.15)}
  .nav{display:flex;align-items:center;gap:1.5rem;padding:.85rem 28px;max-width:var(--maxw);margin:0 auto}
  .logo{margin-right:auto;display:flex;position:relative}
  .logo img{height:48px;display:block}
  .logo .logo-default,.logo .logo-hover{transition:opacity .3s ease}
  .logo .logo-hover{position:absolute;left:0;top:0;opacity:0}
  .logo:hover .logo-hover,.logo:focus-visible .logo-hover{opacity:1}
  .logo:hover .logo-default,.logo:focus-visible .logo-default{opacity:0}
  nav.menu ul{display:flex;gap:1.5rem;list-style:none}
  nav.menu a{text-decoration:none;font-weight:500;font-size:.93rem;color:var(--ink-soft);white-space:nowrap}
  nav.menu a:hover,nav.menu a[aria-current]{color:var(--forest)}
  nav.menu a[aria-current]{border-bottom:2px solid var(--teal);padding-bottom:3px}
  .cta-pair{display:flex;gap:.6rem}
  .btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;font-weight:600;font-size:.92rem;text-decoration:none;border-radius:999px;padding:.66rem 1.4rem;border:2px solid transparent;white-space:nowrap;transition:.18s ease}
  .btn-solid{background:var(--teal);color:#fff}
  .btn-solid:hover{background:var(--teal-dark)}
  .btn-line{border-color:var(--teal);color:var(--teal-dark);background:transparent}
  .btn-line:hover{background:var(--mint)}
  .btn-forest{background:var(--forest);color:#fff}
  .btn-forest:hover{background:#0d3d16}
  .btn-gold{background:var(--gold);color:var(--forest)}
  .btn-gold:hover{background:#eebf73}
  .btn:active{transform:translateY(1px)}
  .btn:disabled{opacity:.65;cursor:not-allowed}
  input,select,textarea{transition:border-color .18s ease,box-shadow .18s ease}
  .finder-input{transition:border-color .18s ease,box-shadow .18s ease}
  .menu-toggle{display:none;background:none;border:2px solid var(--line);border-radius:9px;padding:.5rem .8rem;font:inherit;font-weight:600;color:var(--forest);min-height:46px}

  /* HERO - soft full-bleed art banner under a soft wash (matches current site idiom) */
  .hero{position:relative;background:
      linear-gradient(90deg, rgba(255,255,255,.95) 0%, rgba(255,255,255,.82) 33%, rgba(255,255,255,.42) 60%, rgba(255,255,255,.14) 100%),
      linear-gradient(0deg, var(--hero-wash, rgba(240,247,244,.50)), rgba(240,247,244,0) 42%),
      var(--hero-img, url('/assets/art-hero-mountains.jpg'));
      background-size:cover;background-position:center 42%;border-bottom:1px solid var(--line)}
  /* Mobile: text spans full width, so swap the left-to-right reveal for a top-down wash that keeps every line readable. */
  @media(max-width:880px){
    .hero{background:
      linear-gradient(180deg, rgba(255,255,255,.94) 0%, rgba(255,255,255,.88) 48%, rgba(255,255,255,.68) 78%, rgba(255,255,255,.48) 100%),
      var(--hero-img, url('/assets/art-hero-mountains.jpg'));
      background-size:cover;background-position:center 30%}
  }
  .hero .wrap{padding:6.5rem 28px 5rem}
  .hero .eyebrow{font-family:'Montserrat';font-size:.8rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--teal-dark);margin-bottom:1.1rem}
  .hero h1{max-width:15ch}
  /* One soft emphasis device, now a reusable system: true italic Fraunces in teal-dark, one phrase per headline.
     font-style:italic adds the ital axis while opsz/SOFT inherit from the heading (do not set font-variation-settings here, it would clobber them). */
  .hero h1 em,h2 em,.intro p.lead em,.band blockquote em,.feat p em{font-style:italic;color:var(--teal-dark);font-weight:500}
  .hero .sub{font-size:1.22rem;line-height:1.6;color:var(--ink-soft);max-width:46ch;margin:1.3rem 0 2rem;font-weight:400}
  .hero .hero-cta{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.7rem}
  .hero .lifespan + .hero-cta{margin-top:1.9rem}
  /* Stagger the hero's own children within the same heroIn arrival curve/duration, so the
     eyebrow leads and the CTA row trails slightly, reading as one graceful arrival rather than
     a new effect. Animation now lives on the direct children (not the .hero-fade wrapper
     itself) so each can carry its own delay; the wrapper stays a plain, un-animated container. */
  .hero-fade>*{opacity:0;transform:translateY(14px);animation:heroIn 1s cubic-bezier(.2,.7,.2,1) forwards}
  .hero-fade>.eyebrow{animation-delay:.05s}
  .hero-fade>h1,.hero-fade>.sub{animation-delay:.15s}
  .hero-fade>.hero-cta{animation-delay:.25s}
  .hero-fade>.hero-finder,.hero-fade>.hero-cta~*{animation-delay:.35s}
  @keyframes heroIn{to{opacity:1;transform:none}}
  /* AMBIENT HERO LIGHT: a slow, soft daylight wash that gently breathes over the hero, like
     sun moving behind cloud. Lives on .hero::after only (no image copy), above the art but
     behind the text, so the LCP image and layout never move (no LCP/CLS cost, no JS, ~0.5KB).
     Defaults to opacity:0 so prefers-reduced-motion users see nothing (the global reduced-motion
     block only zeroes duration, not opacity); motion is declared only under no-preference. */
  .hero{overflow:hidden}
  .hero > .wrap{position:relative;z-index:2}
  .hero::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:1;opacity:0;
    background:
      radial-gradient(120% 90% at 24% 16%, rgba(255,255,255,.20), rgba(255,255,255,0) 55%),
      linear-gradient(118deg, rgba(159,196,177,.12) 0%, rgba(255,255,255,0) 42%, rgba(94,140,124,.08) 100%);
    mix-blend-mode:soft-light;will-change:opacity,transform}
  @media (prefers-reduced-motion: no-preference){
    .hero::after{animation:heroLight 34s ease-in-out infinite alternate}
    @keyframes heroLight{
      0%{opacity:.42;transform:translate3d(-2%,-1%,0) scale(1.02)}
      50%{opacity:.60;transform:translate3d(1.5%,1%,0) scale(1.05)}
      100%{opacity:.42;transform:translate3d(-2%,-1%,0) scale(1.02)}
    }
  }

  /* ORIENTATION STRIP */
  .orient{background:var(--forest);color:#dce8e0}
  .orient .wrap{display:flex;flex-wrap:wrap;gap:1.4rem 2.4rem;padding:1rem 28px;justify-content:center;font-size:.9rem}
  .orient .oi{display:flex;align-items:center;gap:.55rem}
  .orient svg{flex:none;opacity:.85}
  .orient strong{color:#fff;font-weight:600}

  /* trust + intro */
  .intro{padding:4rem 0 1rem}
  .trust{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;font-size:.86rem;color:var(--teal-dark);font-weight:600;letter-spacing:.02em;margin-bottom:1.3rem}
  .trust .dot{width:5px;height:5px;border-radius:50%;background:var(--gold)}
  .intro p.lead{font-size:1.32rem;line-height:1.6;color:var(--ink);font-weight:400;max-width:40ch;font-family:'Fraunces',serif;font-variation-settings:"opsz" 40,"SOFT" 18;text-wrap:pretty}
  .intro .help{color:var(--ink-soft);max-width:62ch;margin-top:1rem}

  /* PILLARS */
  .pillar{padding:3.6rem 0}
  .pillar-soft{background:var(--mint)}
  .pillar-head{margin-bottom:1.8rem}
  .pillar-head .ph-eyebrow{display:inline-flex;align-items:center;gap:.6rem;font-size:.78rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--teal-dark);margin-bottom:.7rem}
  .pillar-head .ph-eyebrow::before{content:"";width:1.6rem;height:2px;background:var(--gold);flex:none}
  .pillar-head .lead-credit{font-size:.92rem;color:var(--ink-soft);margin-top:.5rem;font-style:italic}
  .pillar-head p.blurb{color:var(--ink-soft);max-width:64ch;margin-top:.7rem}

  .cardrow{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem;margin-top:.4rem}
  .cardrow.two{grid-template-columns:repeat(2,1fr)}
  a.scard{display:flex;flex-direction:column;gap:.5rem;text-decoration:none;color:inherit;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.4rem 1.4rem 1.3rem;position:relative;transition:.18s ease;border-left:3px solid var(--sage)}
  a.scard:hover{transform:translateY(-3px);box-shadow:0 14px 30px -16px rgba(8,45,15,.28);border-left-color:var(--teal);border-left-width:4px}
  a.scard:hover .arr{transform:translateX(3px)}
  .scard h3{margin:0}
  .scard p{font-size:.92rem;color:var(--ink-soft);margin:0;flex:1}
  .scard .arr{font-size:.85rem;color:var(--teal-dark);font-weight:600;margin-top:.4rem;transition:transform .18s ease}
  .scard.flag{border-left-color:var(--gold)}

  .linklist{list-style:none;padding:0;margin:.55rem 0 0}
  .linklist li{padding:.7rem 0;border-bottom:1px dashed var(--line)}
  .linklist li:last-child{border-bottom:0}
  .linklist a{font-weight:600;color:var(--teal-dark);text-decoration:none}
  .linklist a:hover{text-decoration:underline}
  .linklist a[target="_blank"]::after{content:" \2197";font-size:.78em;color:var(--ink-soft);font-weight:400}
  .linklist .ld{display:block;color:var(--ink-soft);font-size:.92rem;line-height:1.45;margin-top:.15rem}

  /* feature (therapy/child) - soft, art as gentle wash on one side */
  .feat{display:grid;grid-template-columns:1.05fr 1fr;gap:2.8rem;align-items:center;margin-top:.6rem}
  .feat.flip .feat-art{order:2}
  .feat-art{border-radius:var(--radius);overflow:hidden;position:relative;min-width:0;min-height:280px;box-shadow:var(--shadow)}
  .feat-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  .feat-art::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(8,45,15,.05),rgba(88,123,127,.12))}
  .feat .who{font-size:.9rem;color:var(--teal-dark);font-style:italic;margin-bottom:.3rem}
  .feat ul{list-style:none;margin:.6rem 0 1.2rem}
  .feat li{padding:.35rem 0 .35rem 1.5rem;position:relative;font-size:.96rem;color:var(--ink-soft)}
  .feat li::before{content:"";position:absolute;left:0;top:.85rem;width:7px;height:7px;border-radius:50%;background:var(--sage)}

  /* soft art divider band */
  .band{position:relative;min-height:230px;display:flex;align-items:center;justify-content:center;text-align:center;color:var(--forest);
      background:linear-gradient(rgba(240,247,244,.66),rgba(240,247,244,.66)),url('/assets/paperart-pastel-wide.jpg');background-size:cover;background-position:center 60%}
  .band blockquote{font-family:'Fraunces',serif;font-size:clamp(1.4rem,2.6vw,2rem);max-width:24ch;margin:0;font-weight:500;line-height:1.25;font-variation-settings:"opsz" 72,"SOFT" 26;letter-spacing:-.01em;text-wrap:balance;hanging-punctuation:first last}

  /* funding + cta band */
  .funding{padding:3.4rem 0}
  .funding .chips{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:1rem}
  .funding .chips span{background:var(--mint-deep);color:var(--forest);border-radius:999px;padding:.4rem 1rem;font-size:.85rem;font-weight:600}
  .ctaband{background:var(--forest);color:#dce8e0;text-align:center;padding:4rem 0}
  .ctaband h2{color:#fff}
  .ctaband p{max-width:50ch;margin:.4rem auto 1.6rem;color:#cfe0d4}

  /* crisis + footer */
  .crisis{background:#0d3d16;color:#e9f2ec;text-align:center;font-size:.9rem;padding:.7rem 1rem}
  .crisis a{color:var(--gold);font-weight:600;text-decoration:none}
  footer.site{background:var(--forest);color:#cfe0d4}
  .footgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2.5rem;padding:2.8rem 0 2rem}
  footer h3{color:#fff;font-family:'Zilla Slab';font-weight:600;font-size:1rem;margin-bottom:.6rem}
  footer ul{list-style:none}footer li{margin-bottom:.45rem;font-size:.92rem}
  footer a{color:#cfe0d4;text-decoration:none}footer a:hover{color:var(--gold)}
  .footnote{border-top:1px solid rgba(255,255,255,.15);padding:1.1rem 0 1.5rem;font-size:.8rem;color:#9db8a5;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}

  .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
  .reveal.in{opacity:1;transform:none}

  /* Mid widths (1025-1220px): compact the nav a little so the full menu stays visible on normal laptop
     windows instead of collapsing to the hamburger too early. The >=1221px look is unchanged. */
  @media(max-width:1220px){
    .nav{gap:1rem;padding:.85rem 20px}
    nav.menu ul{gap:.85rem}
    nav.menu a{font-size:.9rem}
    .cta-pair{gap:.4rem}
    .cta-pair .btn{padding:.5rem .85rem;font-size:.9rem}
  }
  /* Genuine tablet/phone widths: collapse the nav to the hamburger. */
  @media(max-width:1080px){
    nav.menu{display:none}
    .menu-toggle{display:inline-flex;margin-left:auto}
    .cta-pair{display:none}
  }
  @media(max-width:880px){
    .cardrow,.cardrow.two{grid-template-columns:1fr}
    .feat,.feat.flip .feat-art{grid-template-columns:1fr}
    .feat.flip .feat-art{order:0}
    .footgrid{grid-template-columns:1fr 1fr}
    .hero .wrap{padding:4.5rem 28px 3.5rem}
  }
  @media(max-width:560px){.footgrid{grid-template-columns:1fr}.cta-pair .btn-line{display:none}}
  @media (prefers-reduced-motion: reduce){
    *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
    .reveal{opacity:1!important;transform:none!important}.hero-fade>*{opacity:1!important;transform:none!important;animation:none!important}
  }
  @media print{
    .reveal,.reveal-child{opacity:1!important;transform:none!important}
    .mockbar,nav.menu,.cta-pair,.menu-toggle,.ctaband,.finder,.footgrid>:nth-child(2),.footgrid>:nth-child(3),.footgrid>:nth-child(4){display:none!important}
    .hero{background:none!important}
    a.scard,.feat,.proc li,.pillar-head{break-inside:avoid}
  }

  /* home route cards */
  .hcards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem;margin-top:1.2rem}
  a.hcard{display:flex;flex-direction:column;text-decoration:none;color:inherit;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);transition:.18s ease}
  a.hcard:hover{transform:translateY(-3px);box-shadow:0 16px 36px -16px rgba(8,45,15,.32)}
  a.hcard:hover .arr{transform:translateX(3px)}
  a.hcard .hc-img{height:150px;background-size:cover;background-position:center}
  .hcard .hc-body{padding:1.2rem 1.3rem 1.4rem;display:flex;flex-direction:column;gap:.5rem;flex:1}
  .hcard h3{margin:0}
  .hcard p{font-size:.95rem;color:var(--ink-soft);margin:0;flex:1}
  .hcard .arr{color:var(--teal-dark);font-weight:600;font-size:.86rem;margin-top:.3rem;transition:transform .18s ease}
  /* generic content */
  .prose{max-width:720px}
  .prose p{color:var(--ink-soft)}
  .reflist{list-style:none;max-width:74ch}
  .reflist li{padding:.45rem 0 .45rem 1.6rem;position:relative;border-bottom:1px dashed var(--line);color:var(--ink-soft)}
  .reflist li::before{content:"";position:absolute;left:0;top:.95rem;width:8px;height:8px;border-radius:50%;background:var(--sage)}
  .ask-note{background:var(--mint);border-left:4px solid var(--teal);border-radius:0 var(--radius) var(--radius) 0;padding:1.1rem 1.4rem;margin-top:1.6rem;color:var(--ink)}
  .lifespan{display:flex;gap:.5rem;flex-wrap:wrap;margin:1rem 0 0}
  .lifespan span{background:rgba(255,255,255,.7);border:1px solid var(--line);color:var(--forest);border-radius:999px;padding:.32rem .85rem;font-size:.8rem;font-weight:600}
  .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;counter-reset:s;margin-top:1.4rem}
  .steps.four{grid-template-columns:repeat(4,1fr)}
  /* the 4-column variant has the narrowest per-card real estate, so it needs an earlier 2x2 collapse
     than the 3-column .steps/.hcards/.team-grid pattern, which stays 3-across comfortably to 880px */
  @media(max-width:1100px){.steps.four{grid-template-columns:1fr 1fr}}
  .step{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.5rem 1.3rem 1.3rem;position:relative}
  .step::before{counter-increment:s;content:counter(s);position:absolute;top:-1rem;left:1.1rem;width:2rem;height:2rem;border-radius:50%;background:var(--gold);color:var(--forest);font-family:'Fraunces',serif;font-weight:600;display:grid;place-items:center}
  .step h3{margin:.2rem 0 .3rem}
  .step p{font-size:.92rem;color:var(--ink-soft);margin:0}
  .proc{list-style:none;counter-reset:p;max-width:760px;margin-top:1rem}
  .proc li{counter-increment:p;position:relative;padding:.7rem 0 .7rem 2.8rem;border-bottom:1px dashed var(--line)}
  .proc li::before{content:counter(p);position:absolute;left:0;top:.6rem;width:1.9rem;height:1.9rem;border-radius:50%;background:var(--gold);color:var(--forest);font-family:'Fraunces',serif;font-weight:600;display:grid;place-items:center;font-size:.95rem}
  .modality{border-bottom:1px dashed var(--line);padding:.85rem 0;max-width:780px}
  .modality h3{margin-bottom:.15rem}
  .modality p{margin:0;color:var(--ink-soft);font-size:.95rem}
  .note-soft{background:var(--gold-soft);border:1px solid #ecd9b4;border-radius:var(--radius);padding:1rem 1.3rem;margin-top:1.4rem;font-size:.95rem}
  .todo{background:var(--gold-soft);border-bottom:2px dashed #d9a93f;color:var(--amber-note);padding:0 .25em;border-radius:3px}
  .legend{font-size:.82rem;color:var(--ink-soft);margin-top:1.2rem;max-width:74ch}
  /* proof row (home credibility) */
  .proof{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem 2.2rem;margin-top:1.7rem}
  .proof>div{border-top:2px solid var(--gold);padding-top:.95rem}
  .proof h3{margin:0 0 .35rem}
  .proof p{margin:0;color:var(--ink-soft);font-size:.95rem;line-height:1.6}
  @media(max-width:700px){.proof{grid-template-columns:1fr;gap:1.3rem}}
  /* forms */
  .formwrap{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);background:#fff}
  .formhead{background:var(--mint);padding:1.1rem 1.5rem;border-bottom:1px solid var(--line)}
  .formhead h3{margin:0}.formhead span{font-size:.85rem;color:var(--ink-soft)}
  form.mock{padding:1.5rem;display:grid;grid-template-columns:1fr 1fr;gap:1.1rem 1.4rem}
  .field{display:flex;flex-direction:column;gap:.35rem}.field.s2{grid-column:1/-1}
  label{font-size:.85rem;font-weight:600;color:var(--forest)}.req{color:#a33}
  .field input[type=file]{padding:.5rem .6rem;background:#fff;cursor:pointer}
  .field input[type=file]::file-selector-button{margin-right:.7rem;border:1px solid var(--line);background:var(--mint);color:var(--forest);border-radius:8px;padding:.35rem .8rem;font:inherit;cursor:pointer}
  input,select,textarea{font:inherit;font-size:1rem;padding:.65rem .8rem;border:1.5px solid var(--field-border);border-radius:9px;min-height:46px;background:#fff}
  input:hover,select:hover,textarea:hover{border-color:var(--teal)}
  textarea{min-height:110px}
  /* keep mock form controls inside their grid columns: grid items default to min-width:auto and
     form controls carry an intrinsic preferred width, so without this the right-column fields
     overflow the card and run past the page edge. */
  .contact-grid>*{min-width:0}
  form.mock .field{min-width:0}
  form.mock input,form.mock select,form.mock textarea{width:100%;min-width:0;max-width:100%}
  .filehint{font-size:.8rem;color:var(--ink-soft)}
  .formfoot{grid-column:1/-1;display:flex;flex-direction:column;align-items:flex-start;gap:.85rem;margin-top:.5rem}
  .formfoot small{font-size:.8rem;color:var(--ink-soft);max-width:62ch;line-height:1.55}
  .contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:2.6rem;align-items:start}
  .clist{list-style:none}.clist li{padding:.55rem 0;border-bottom:1px dashed var(--line)}
  .clist strong{display:inline-block;min-width:5.5rem;color:var(--forest)}
  .reloc{background:var(--mint);border-left:4px solid var(--teal);border-radius:0 var(--radius) var(--radius) 0;padding:1rem 1.3rem;margin-bottom:1.5rem}
  .refer-aside{margin-top:1.7rem;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
  .refer-aside img{display:block;width:100%;height:440px;object-fit:cover}
  @media(max-width:880px){.refer-aside img{height:240px}}
  /* faq */
  .faq{max-width:820px}
  .faq details{border:1px solid var(--line);border-radius:var(--radius);margin-bottom:.7rem;background:#fff;overflow:hidden}
  .faq details[open]{box-shadow:var(--shadow)}
  .faq summary{list-style:none;cursor:pointer;padding:1.05rem 1.3rem;font-family:'Zilla Slab',serif;font-weight:600;font-size:1.08rem;color:var(--forest);display:flex;justify-content:space-between;align-items:center;gap:1rem}
  .faq summary::-webkit-details-marker{display:none}
  .faq summary::after{content:"";width:.6rem;height:.6rem;border-right:2px solid var(--teal);border-bottom:2px solid var(--teal);transform:rotate(45deg);transition:.2s;flex:none}
  .faq details[open] summary::after{transform:rotate(-135deg)}
  .faq .ans{padding:0 1.3rem 1.2rem;color:var(--ink-soft)}
  /* team */
  .team-tools{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:2rem}
  .chip{display:inline-flex;align-items:center;min-height:44px;border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:.42rem 1.05rem;font-size:.85rem;font-weight:600;color:var(--ink-soft);cursor:pointer}
  .chip.on{background:var(--teal);color:#fff;border-color:var(--teal)}
  .team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
  .member{border:1px solid var(--line);border-radius:var(--radius);background:#fff;overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column}
  .member>img{width:100%;aspect-ratio:1;object-fit:cover}
  .member .mb{padding:1.2rem 1.3rem 1.4rem;display:flex;flex-direction:column;gap:.4rem;flex:1}
  .member .role{font-size:.72rem;font-weight:700;letter-spacing:.07em;color:var(--teal-dark);text-transform:uppercase}
  .member h3{margin:0}.member .quals{font-size:.82rem;color:var(--ink-soft);font-style:italic}
  .member p{font-size:.9rem;color:var(--ink-soft);margin:0}
  .member .avail{margin-top:auto;padding-top:.6rem;font-size:.84rem;font-weight:600;color:#1f7a3d;display:inline-flex;align-items:center;gap:.45rem}
  .member .avail::before{content:"";width:.6rem;height:.6rem;border-radius:50%;background:#2e9e54}
  /* hover/focus cue on the one truly clickable element in the card ("Read full bio"), matching the
     existing a.hcard/.scard .arr nudge pattern, without lifting the whole (non-clickable) card */
  .member .arr{color:var(--teal-dark);font-weight:600;transition:transform .18s ease}
  .member:hover .arr,.member:focus-within .arr{transform:translateX(3px)}
  .member.ghost{border-style:dashed;background:var(--mint);box-shadow:none}
  @media(max-width:880px){.hcards,.steps,.steps.four,.team-grid{grid-template-columns:1fr 1fr}.contact-grid{grid-template-columns:1fr}form.mock{grid-template-columns:1fr}}
  @media(max-width:560px){.hcards,.steps,.steps.four,.team-grid{grid-template-columns:1fr}}
  /* print / save this page */
  .printbar{display:flex;justify-content:flex-end;margin:0 0 .2rem}
  .printbtn{display:inline-flex;align-items:center;gap:.45rem;background:#fff;border:1.5px solid var(--teal);color:var(--teal-dark);border-radius:999px;padding:.5rem 1.15rem;font:inherit;font-weight:600;font-size:.88rem;cursor:pointer;min-height:44px}
  .printbtn:hover{background:var(--mint)}
  .printbtn svg{flex:none}
  @media print{
    header.site,.mockbar,.orient,.crisis,footer.site,.ctaband,.hero-cta,.cta-pair,.menu-toggle,.printbar,.finder,.note-soft a[href^="tel"]{display:none!important}
    .reveal{opacity:1!important;transform:none!important}
    body{font-size:11.5pt;color:#000;background:#fff}
    a{color:#000;text-decoration:underline}
    .hero{background:none!important;border:0}
    .hero .wrap{padding:.2rem 0 .8rem}
    .pillar,.intro{padding:.8rem 0}
    .wrap,.narrow{max-width:100%!important;padding:0 4mm}
    .faq details{break-inside:avoid;border-color:#bbb}
    .faq details:not([open]) .ans{display:block}
    h1{font-size:20pt}h2{font-size:15pt}
  }
  /* service finder */
  .finder{background:var(--mint);padding:3.6rem 0}
  .finder .lead-q{color:var(--ink-soft);max-width:60ch;margin-top:.6rem}
  .finder-shell{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:1.6rem 1.6rem 1.7rem;margin-top:1.5rem;max-width:660px}
  .finder-q{font-family:'Fraunces',serif;font-weight:500;font-size:1.32rem;color:var(--forest);line-height:1.22;margin:0 0 1rem;padding:0;letter-spacing:0;font-variation-settings:'opsz' 40,'SOFT' 18;text-wrap:pretty}
  .finder fieldset{border:0;padding:0;margin:0}
  .finder-grid{display:grid;gap:.6rem}
  .finder-opt{display:flex;align-items:center;gap:.9rem;width:100%;text-align:left;background:#fff;border:1.5px solid var(--line);border-left:3px solid var(--sage);border-radius:var(--radius);padding:.92rem 1.1rem;font:inherit;font-size:1rem;color:var(--ink);cursor:pointer;transition:.16s ease}
  .finder-opt:hover{border-color:var(--teal);border-left-color:var(--teal);background:var(--mint);transform:translateY(-1px)}
  .finder-opt .fo-t{flex:1;font-weight:500}
  .finder-opt .fo-s{display:block;font-size:.84rem;color:var(--ink-soft);font-weight:400;margin-top:.12rem}
  .finder-opt .fo-c{color:var(--teal);font-weight:700;font-size:1.05rem;flex:none}
  .finder-meta{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem;font-size:.78rem;color:var(--ink-soft);font-weight:600;letter-spacing:.04em;text-transform:uppercase}
  .finder-back{background:none;border:0;color:var(--teal-dark);font:inherit;font-weight:600;font-size:.82rem;text-transform:none;letter-spacing:0;cursor:pointer;padding:.2rem 0}
  .finder-back:hover{text-decoration:underline}
  .finder-result{border:1px solid var(--line);border-left:4px solid var(--teal);border-radius:var(--radius);background:var(--mint);padding:1.3rem 1.4rem}
  .finder-result .fr-k{font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--teal-dark);margin-bottom:.45rem}
  .finder-result h3{margin:0 0 .5rem;font-size:1.3rem;font-family:'Fraunces',serif;font-weight:500}
  .finder-result p{color:var(--ink-soft);margin:0 0 1.1rem;max-width:56ch}
  .finder-actions{display:flex;flex-wrap:wrap;gap:.5rem 1.1rem;align-items:center}
  .finder-talk{margin:1.1rem 0 0;font-size:.92rem;color:var(--ink-soft)}
  /* always-available crisis affordance under the chat */
  .finder-safe-wrap{margin:1rem 0 0}
  .finder-safe{display:inline-flex;align-items:center;gap:.4rem;min-height:44px;background:#fff;border:1.5px solid var(--gold);color:var(--forest);border-radius:999px;padding:.5rem 1.15rem;font:inherit;font-size:.9rem;cursor:pointer}
  .finder-safe strong{color:var(--amber-note);font-weight:700}
  .finder-safe:hover{background:var(--gold-soft);border-color:#e0b96a}
  .finder-safe:focus-visible{outline:3px solid var(--teal);outline-offset:3px}
  .finder-fallback>p{color:var(--ink-soft)}
  .finder-fallback h3{margin:1.3rem 0 .5rem;font-size:1rem}
  .finder-fallback ul{list-style:none;display:grid;gap:.4rem}
  .finder-fallback li{padding-left:1.1rem;position:relative}
  .finder-fallback li::before{content:"";position:absolute;left:0;top:.62rem;width:6px;height:6px;border-radius:50%;background:var(--sage)}
  .finder-fallback a{color:var(--teal-dark);font-weight:600;text-decoration:none}
  .finder-fallback a:hover{text-decoration:underline}
  @media(max-width:560px){.finder-actions{align-items:flex-start}}
  /* services nav dropdown */
  .has-sub{position:relative}
  .sub-toggle{display:inline-flex;align-items:center;justify-content:center;width:1.4rem;height:1.4rem;margin-left:.05rem;padding:0;background:none;border:0;cursor:pointer;vertical-align:middle}
  .sub-toggle::after{content:"";width:.4rem;height:.4rem;border-right:2px solid var(--ink-soft);border-bottom:2px solid var(--ink-soft);transform:rotate(45deg);transition:transform .2s;margin-top:-.16rem}
  .has-sub:hover .sub-toggle::after,.has-sub.open .sub-toggle::after{transform:rotate(225deg);margin-top:.05rem;border-color:var(--forest)}
  .submenu{list-style:none;position:absolute;top:calc(100% + .55rem);left:-.7rem;min-width:238px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:.4rem;margin:0;opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .16s ease,transform .16s ease;z-index:60}
  .has-sub:hover .submenu,.has-sub:focus-within .submenu,.has-sub.open .submenu{opacity:1;visibility:visible;transform:none}
  .has-sub .submenu{display:block}
  .submenu::before{content:"";position:absolute;left:0;right:0;top:-.7rem;height:.7rem}
  .submenu li{margin:0;width:100%}
  .submenu a{display:block;padding:.55rem .8rem;border-radius:9px;font-size:.9rem;font-weight:500;color:var(--ink-soft);text-decoration:none;white-space:nowrap}
  .submenu a:hover,.submenu a:focus-visible{background:var(--mint);color:var(--forest)}
  .m-cta{display:none}
  /* Nav switches to the hamburger below 1080px; from 1081-1220px it stays a horizontal menu but compacted (see services-v2.html) so it fits. */
  /* gentle open-only entrance for the mobile drawer (closing remains an instant display:none cut,
     same forward-only pattern as the FAQ open animation above); disabled under reduced motion below. */
  @keyframes navOpen{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
  @media(max-width:1080px){
    html.menu-open,html.menu-open body{overflow:hidden}
    nav.menu.open{display:block;position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--line);box-shadow:var(--shadow);padding:.25rem 28px 1.1rem;max-height:calc(100dvh - 100%);overflow-y:auto;-webkit-overflow-scrolling:touch;animation:navOpen .22s var(--ease-out)}
    nav.menu.open ul{flex-direction:column;gap:0;align-items:stretch}
    nav.menu.open li{width:100%;border-bottom:1px solid var(--mint-deep)}
    nav.menu.open ul>li>a{display:block;padding:.95rem 0;font-size:1.02rem}
    /* Services is a tap-to-expand accordion: collapsed by default so the top-level items and CTAs stay in view */
    .has-sub{position:static;display:flex;flex-wrap:wrap;align-items:center}
    .has-sub>a{flex:1 1 auto}
    .sub-toggle{display:flex;align-self:stretch;width:54px;height:auto;min-height:52px;margin:0;border-left:1px solid var(--mint-deep);border-radius:0}
    .sub-toggle::after{width:.55rem;height:.55rem;margin-top:-.2rem;border-color:var(--forest)}
    .submenu{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;min-width:0;width:100%;flex-basis:100%;margin:0;padding:0;max-height:0;overflow:hidden;transition:max-height .28s ease}
    .has-sub.open .submenu{max-height:2400px;padding:.1rem 0 .5rem .9rem}
    nav.menu.open .submenu a{padding:.6rem 0;font-size:.95rem}
    nav.menu.open .m-cta{display:block;border:0;margin-top:.9rem}
    nav.menu.open .m-cta:first-of-type{margin-top:1.1rem}
    nav.menu.open .m-cta a{display:flex;width:100%;padding:.8rem 1.2rem;font-size:.98rem}
  }
  /* finder v2 free-text */
  .finder-form{display:flex;gap:.6rem;flex-wrap:wrap;align-items:stretch}
  .finder-input{flex:1;min-width:230px;font:inherit;font-size:1rem;padding:.8rem 1rem;border:1.5px solid var(--field-border);border-radius:var(--radius);min-height:52px;background:#fff;color:var(--ink)}
  .finder-input:focus-visible{outline:2px solid var(--teal);outline-offset:1px;border-color:var(--teal);box-shadow:0 0 0 3px var(--mint)}
  .finder-submit{background:var(--forest);color:#fff;border:0;border-radius:999px;padding:.7rem 1.5rem;font:inherit;font-weight:600;font-size:.95rem;cursor:pointer;min-height:52px}
  .finder-submit:hover{background:#0d3d16}
  .finder-egs{margin:.9rem 0 0;font-size:.86rem;color:var(--ink-soft)}
  .finder-eg{display:inline-flex;align-items:center;min-height:44px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:.4rem 1.05rem;margin:.3rem .35rem 0 0;font:inherit;font-size:.85rem;color:var(--teal-dark);cursor:pointer}
  /* Primary hand-off chip: the one clear next action when the chat concludes (visitor feedback: the
     submit choice was not obvious among equal-weight chips). Matches the solid .btn treatment. */
  .finder-eg.finder-eg-primary{background:var(--forest);border-color:var(--forest);color:#fff;font-weight:600;font-size:.92rem;padding:.55rem 1.35rem;box-shadow:var(--shadow)}
  .finder-eg.finder-eg-primary:hover,.finder-eg.finder-eg-primary:focus-visible{background:var(--teal-dark);border-color:var(--teal-dark);color:#fff}
  .finder-eg:hover{background:var(--mint);border-color:var(--teal)}
  .finder-eg:active{transform:translateY(1px)}
  .finder-hint{margin:.2rem 0 1rem;color:var(--ink-soft)}
  .finder-textarea{min-height:120px;resize:vertical;width:100%}
  .finder-readback{background:var(--mint-deep);border:1px solid var(--line);border-radius:var(--radius);padding:1rem 1.1rem;margin:0 0 1.1rem;font-size:.95rem;color:var(--ink);line-height:1.55;white-space:normal}
  .finder-crisis-list{list-style:none;margin:.4rem 0 1rem;display:grid;gap:.55rem}
  .finder-crisis-list li{padding-left:1.25rem;position:relative;color:var(--ink)}
  .finder-crisis-list li::before{content:"";position:absolute;left:0;top:.62rem;width:7px;height:7px;border-radius:50%;background:var(--teal)}
  .finder-crisis-list a{font-weight:600}
  .finder-ack{background:var(--mint);border-left:3px solid var(--sage);border-radius:0 10px 10px 0;padding:.6rem .9rem;margin:0 0 1rem;color:var(--ink);font-size:.95rem}
  /* find us: schematic area map + getting-here directory (contact page) */
  .findus{display:grid;grid-template-columns:1.3fr 1fr;gap:2rem;align-items:start;margin-top:1.2rem}
  .mapcard{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:1rem 1rem .8rem}
  .mapcard svg{display:block;width:100%;height:auto}
  .mapcap{font-size:.85rem;color:var(--ink-soft);margin:.65rem .2rem 0}
  .findus h3{font-family:'Zilla Slab',serif;font-weight:600;color:var(--forest);font-size:1.08rem;margin:1.15rem 0 .3rem}
  .findus h3:first-of-type{margin-top:0}
  .mp-t{font-size:12.5px;fill:var(--ink-soft)}
  .mp-ts{font-size:12.5px;font-weight:600;fill:var(--forest)}
  .mp-road{fill:var(--mint)}
  .mp-badge{font-size:11px;font-weight:700;fill:#fff}
  @media(max-width:880px){.findus{grid-template-columns:1fr}}
  /* chat receptionist */
  .chat-log{display:flex;flex-direction:column;gap:.6rem;max-height:400px;overflow-y:auto;padding:.2rem .1rem .5rem;margin-bottom:.9rem}
  .chat-msg{max-width:88%;padding:.7rem .95rem;border-radius:15px;font-size:.96rem;line-height:1.5}
  .chat-msg p{margin:0 0 .5rem}.chat-msg p:last-child{margin:0}
  .chat-msg.bot{background:var(--mint);color:var(--ink);border-bottom-left-radius:5px;align-self:flex-start}
  .chat-msg.user{background:var(--forest);color:#eaf3ec;border-bottom-right-radius:5px;align-self:flex-end}
  .chat-msg.care{background:var(--gold-soft);border:1px solid #ecd9b4;color:var(--ink);align-self:stretch;max-width:100%}
  .chat-msg a{color:var(--teal-dark);font-weight:600}
  .chat-msg.user a{color:#fff}
  .chat-msg .finder-crisis-list{margin:.5rem 0 .2rem}
  .chat-msg ul{margin:.35rem 0 .15rem;padding-left:1.15rem}
  .chat-msg li{margin:.22rem 0}
  .chat-msg .kb-more{display:block;margin-top:.55rem;color:var(--ink-soft)}
  .chat-typing{align-self:flex-start;display:inline-flex;gap:.28rem;padding:.78rem .95rem;background:var(--mint);border-radius:15px;border-bottom-left-radius:5px}
  .chat-typing span{width:7px;height:7px;border-radius:50%;background:var(--teal);animation:ctdot 1s infinite ease-in-out}
  .chat-typing span:nth-child(2){animation-delay:.16s}
  .chat-typing span:nth-child(3){animation-delay:.32s}
  @keyframes ctdot{0%,70%,100%{opacity:.3;transform:translateY(0)}35%{opacity:1;transform:translateY(-3px)}}
  .chat-chips{display:flex;flex-wrap:wrap;gap:.4rem;margin:.1rem 0 .9rem}
  .chat-input{display:flex;gap:.5rem;align-items:stretch}
  /* Mobile: the input must be allowed to shrink, else its 230px min-width pushes the Send button past the card edge. */
  @media(max-width:560px){
    .finder-shell{padding:1.2rem 1.1rem 1.35rem}
    .finder-input{min-width:0}
    .finder-submit{padding:.7rem 1.1rem}
  }
  @media(prefers-reduced-motion:reduce){.chat-typing span{animation:none}}

  /* ---- audit-finding upgrades (June 2026): motion tokens, accessibility (WCAG 2.2), trust/conversion, mobile, IA. Within signed-off direction. ---- */
  :root{--ease-out:cubic-bezier(.2,.7,.2,1);--reveal-dur:.6s}
  /* screen-reader-only utility + modernised skip link (clip pattern) */
  .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
  .skip{left:-9999px}
  /* WCAG 2.2 2.4.11 Focus Not Obscured: keep the sticky header off jumped-to targets */
  :target{scroll-margin-top:6rem}
  main:focus{outline:none}
  /* reserve gold to its signal roles: demote the trust dot to sage */
  .trust .dot{background:var(--sage)}
  /* WCAG 2.2 2.5.8 Target Size: Services sub-toggle to 24px */
  .sub-toggle{width:24px;height:24px}
  /* staggered scroll reveal for grouped children */
  .reveal-child{opacity:0;transform:translateY(14px);transition:opacity var(--reveal-dur) var(--ease-out),transform var(--reveal-dur) var(--ease-out);transition-delay:calc(var(--i,0)*70ms)}
  .reveal.in .reveal-child{opacity:1;transform:none}
  /* concern strip under home service cards */
  .card-concerns{font-size:.85rem;color:var(--ink-soft);line-height:1.5}
  /* hero "not sure where to start" link */
  .hero-finder{margin:1.1rem 0 0;font-size:.95rem}
  .hero-finder a{color:var(--teal-dark);font-weight:600;text-decoration:none}
  .hero-finder a:hover{text-decoration:underline}
  /* mega-menu footer link (full width, spanning both columns) */
  .submenu.mega .mega-foot{grid-column:1/-1;display:block;margin-top:.2rem;padding:.6rem .8rem;border-top:1px solid var(--line);font-size:.85rem;font-weight:700;color:var(--teal-dark);text-decoration:none}
  .submenu.mega .mega-foot:hover{background:var(--mint);color:var(--forest)}
  /* footer as a wider eligibility directory (gated above the mobile breakpoint so the template's <=560px single-column stack still wins on phones) */
  /* Footer columns (2026-09-05): five groups only when each link column can be at least 200px, so the
     contact column holds the email address on one line; below 1180px the template's three-column
     footer applies and the five groups flow over two rows. The earlier auto-fit rule produced 169px
     columns at laptop widths, which broke the address on every page. */
  @media(min-width:1180px){.footgrid{grid-template-columns:minmax(196px,1.4fr) repeat(4,minmax(200px,1fr))}}
  /* sticky mobile action bar (thumb zone) */
  .mobile-actionbar{display:none}
  @media(max-width:880px){
    .mobile-actionbar{display:grid;grid-template-columns:auto 1fr;gap:.6rem;position:fixed;left:0;right:0;bottom:0;z-index:55;padding:.6rem 16px calc(.6rem + env(safe-area-inset-bottom));background:rgba(255,255,255,.94);backdrop-filter:saturate(1.2) blur(8px);border-top:1px solid var(--line)}
    .mobile-actionbar .btn{min-height:50px;min-width:0;white-space:normal;padding-left:.85rem;padding-right:.85rem;font-size:.88rem;line-height:1.15;text-align:center}
    .mobile-actionbar .mab-call{border:2px solid var(--teal);color:var(--teal-dark);background:#fff}
    body{padding-bottom:calc(86px + env(safe-area-inset-bottom))}
  }
  @media print{.mobile-actionbar{display:none!important}}
  @media (prefers-reduced-motion: reduce){.reveal-child{opacity:1!important;transform:none!important}}
  /* Services mega-menu: interactive (service areas left, the active area's sub-topics right) */
  .submenu.mega{display:grid;grid-template-columns:minmax(220px,1fr) 1.25fr;gap:0 .6rem;width:600px;max-width:calc(100vw - 32px)}
  .submenu.mega .mega-cats ul,.submenu.mega .mega-panel ul{display:block;list-style:none;margin:0;padding:0}
  .submenu.mega .mega-cats li{width:100%}
  .submenu.mega .mega-cats{border-right:1px solid var(--line);padding-right:.5rem}
  .submenu.mega .mega-cat{display:block;padding:.6rem .8rem;border-radius:9px;font-weight:600;color:var(--forest);text-decoration:none;white-space:normal}
  .submenu.mega .mega-cat.active,.submenu.mega .mega-cat:hover,.submenu.mega .mega-cat:focus-visible{background:var(--mint);color:var(--forest)}
  .submenu.mega .mega-panels{min-width:0}
  .submenu.mega .mega-panel{display:none}
  .submenu.mega .mega-panel.active{display:block}
  .submenu.mega .mega-panel a{white-space:normal}
  .submenu.mega .mega-panel-head{display:none}
  .submenu.mega .mega-blurb{font-size:.78rem;color:var(--ink-soft);margin:.2rem .8rem .5rem;padding-bottom:.4rem;border-bottom:1px solid var(--line)}
  @media(max-width:1080px){
    /* matches the nav-collapse breakpoint: in the hamburger menu, drop the interactive split and show every area with its sub-topics */
    .submenu.mega{grid-template-columns:1fr;width:auto}
    .submenu.mega .mega-cats{display:none}
    .submenu.mega .mega-panel{display:block}
    .submenu.mega .mega-panel-head{display:block;padding:.7rem 0 .2rem;font-weight:700;color:var(--forest);text-decoration:none}
    .submenu.mega .mega-blurb{margin-left:0;margin-right:0}
  }
  /* form validation + inline confirmation */
  .field-error{color:#9a2b3f;font-size:.8rem;font-weight:600;margin-top:.1rem}
  input[aria-invalid="true"],select[aria-invalid="true"],textarea[aria-invalid="true"]{border-color:#9a2b3f}
  /* honeypot: kept in the DOM (so bots fill it) but hidden from people and assistive tech */
  .hp-field{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
  /* consent checkbox row */
  .consent{flex-direction:row;align-items:flex-start;gap:.55rem}
  .consent input[type="checkbox"]{min-height:auto;width:auto;margin-top:.2rem;flex:0 0 auto}
  .consent label{font-weight:400;color:var(--ink);font-size:.9rem;line-height:1.45}
  .consent .req{font-weight:600}
  .form-success{padding:1.6rem 1.5rem}
  .form-success h3{margin:0 0 .5rem}
  .form-success p{margin:0 0 .6rem;color:var(--ink-soft)}
  .form-success :last-child{margin-bottom:0}
  /* finder skip-to-book link */
  .finder-skip{margin:1rem 0 0;font-size:.92rem;color:var(--ink-soft)}
  .finder-skip a{color:var(--teal-dark);font-weight:600}
  /* gentle FAQ open animation (opening only; closing remains instant) */
  @keyframes faqOpen{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
  .faq details[open] .ans{animation:faqOpen .28s var(--ease-out)}
  @media(prefers-reduced-motion:reduce){.faq details[open] .ans{animation:none}}
  @media(prefers-reduced-motion:reduce){nav.menu.open{animation:none}}
  /* FAQ category labels */
  .faq-cat{display:flex;align-items:center;gap:.6rem;font-family:'Montserrat',sans-serif;font-size:.76rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--teal-dark);margin:1.8rem 0 .7rem}
  .faq-cat::before{content:"";width:1.6rem;height:2px;background:var(--gold);flex:none}
  .faq-cat:first-child{margin-top:0}
  /* related-reads block on topic/condition pages */
  .related{margin-top:2.4rem}
  /* motion character (June 2026): ONE per-page scalar, set on <body data-motion>, gently scales the
     existing accessibility-safe scroll-reveal and nothing else. Default 1; calm pages sit stiller,
     child pages a touch warmer. The reduced-motion rule above still forces the static end-state, so
     this adds no new motion for people who have asked for less. No parallax, autoplay or new animation. */
  :root{--motion:1}
  body[data-motion="calm"]{--motion:.72}
  body[data-motion="warm"]{--motion:1.16}
  .reveal{transition-duration:calc(.7s*var(--motion));transform:translateY(calc(22px*var(--motion)))}
  .reveal-child{transform:translateY(calc(14px*var(--motion)))}
  @media(prefers-reduced-motion:reduce){:root{--motion:0}}
  /* Child section (Sept 2026 QA): the same design system, a shade warmer, set on <body data-theme="child">.
     Cream replaces mint for soft bands and notes, cards carry a gold accent, corners are a little softer and the
     hero wash is cream. Type, header, footer, the orient strip and all text colours are unchanged, so contrast
     ratios are the same as on the adult pages. */
  body[data-theme="child"]{--mint:#f8f4ec;--mint-deep:#f1eadb;--radius:18px;--hero-wash:rgba(248,243,232,.62)}
  body[data-theme="child"] .scard{border-left-color:#dcb36c}
  body[data-theme="child"] .scard:hover{border-left-color:#c9962e}
  body[data-theme="child"] .ask-note,body[data-theme="child"] .reloc{border-left-color:#c9962e}
  body[data-theme="child"] .facts div{border-top-color:#dcb36c}
  body[data-theme="child"] .lifespan span{background:rgba(255,255,255,.82)}
  /* ---- mobile polish (audit 2026-06-24): tap targets, graceful wrapping, legibility ---- */
  a.arr{display:inline-flex;align-items:center;min-height:44px}
  .finder-back{min-height:44px;display:inline-flex;align-items:center;padding:.3rem .5rem;margin:-.3rem -.5rem -.3rem 0}
  .chat-input{flex-wrap:wrap}
  body{overflow-wrap:break-word}
  .eml,.footgrid a,.linklist a{overflow-wrap:anywhere}
  @media(max-width:560px){
    footer a{display:inline-block;padding:.5rem 0}
    footer li{margin-bottom:.1rem}
    .legend{font-size:.9rem}
    /* long-label CTAs (e.g. "Explore neuropsychological assessment") must wrap rather than blow out their grid track */
    .btn{white-space:normal}
  }
  /* ---- topic figures (e.g. Cogmed): self-contained, on-brand visualisations. Additive; no behaviour change. ---- */
  .viz{margin:1.5rem 0 0}
  .viz svg{display:block;width:100%;height:auto;border:1px solid var(--line);border-radius:var(--radius);background:#fff}
  .viz-cap{font-size:.85rem;color:var(--ink-soft);margin:.7rem 0 0;max-width:74ch;line-height:1.6}
  .viz-twocol{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;margin-top:1.4rem}
  .viz-panel{border:1px solid var(--line);border-radius:var(--radius);padding:1.2rem 1.3rem 1.3rem;background:#fff;box-shadow:var(--shadow)}
  .viz-panel.vp-is{border-top:3px solid var(--teal)}
  .viz-panel.vp-isnot{border-top:3px solid var(--gold)}
  .viz-panel h3{margin:.1rem 0 .7rem}
  .viz-panel ul{list-style:none;display:grid;gap:.55rem;margin:0}
  .viz-panel li{padding-left:1.6rem;position:relative;color:var(--ink-soft);font-size:.95rem;line-height:1.55}
  .viz-panel.vp-is li::before{content:"";position:absolute;left:.1rem;top:.42rem;width:.7rem;height:.7rem;border-radius:50%;background:var(--teal)}
  .viz-panel.vp-isnot li::before{content:"";position:absolute;left:.1rem;top:.7rem;width:.85rem;height:2px;background:var(--amber-note)}
  @media(max-width:700px){.viz-twocol{grid-template-columns:1fr}}
  /* Hero heading (SEO/hierarchy): the hero eyebrow label is folded INTO the h1 at build time (see the
     hero-kicker transform in build()), so the page's single h1 leads with the real service label, not just
     the display tagline. These rules render the in-h1 kicker exactly like the old standalone .hero .eyebrow,
     and keep the 15ch display measure on the tagline line only (the label spans the full hero width). */
  .hero h1{max-width:none}
  .hero h1 .hero-kicker{display:block;font-family:'Montserrat';font-size:.8rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--teal-dark);margin-bottom:1.1rem;line-height:1.3}
  .hero h1 .hero-lede{display:block;max-width:15ch}

  /* ---- website review 2026-08-15, Brief H: homepage flow + reusable layout components ---- */
  /* Compact hero (home only): the base hero pads 6.5rem/5rem at desktop, which pushes the three
     service route cards below a 1280x800 first viewport. Roughly a third off the vertical padding
     brings them into view without touching type scale or the art. Gated to >=881px so the existing
     mobile hero padding (4.5rem/3.5rem, set in the base template's <=880px block) is untouched. */
  /* Post-implementation review 2026-08-16 (audit P2): a further ~8% off both figures (4.3->3.96rem,
     3.3->3.04rem), and the class now also carries the services hero, which previously ran the full
     base padding and filled almost the whole first viewport. Mobile still untouched. */
  @media(min-width:881px){.hero-compact .wrap{padding:3.96rem 28px 3.04rem}}
  /* The chips row moved out of the .funding section into the merged home proof pillar, so promote
     the two chip declarations from .funding .chips to the class itself. Identical values; the
     more specific .funding .chips rules above still win wherever a .funding section carries them. */
  .chips{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:1rem}
  .chips span{background:var(--mint-deep);color:var(--forest);border-radius:999px;padding:.4rem 1rem;font-size:.85rem;font-weight:600}
  /* One-line audience routes inside the dark final CTA band (replaces the standalone
     third orientation section that the home page used to carry above the steps). */
  .ctaband .band-routes{max-width:84ch;margin:-.5rem auto 1.6rem;font-size:.93rem;color:#cfe0d4;text-wrap:pretty}
  .ctaband .band-routes a{color:var(--gold);font-weight:600;text-decoration:none}
  .ctaband .band-routes a:hover,.ctaband .band-routes a:focus-visible{text-decoration:underline}
  /* In-page contents ("On this page"), injected after the hero on long pages (see TOC_PAGES).
     Quiet: a mint strip carrying the page's own h2 headings, no card, no shadow. */
  .toc{background:var(--mint);border-bottom:1px solid var(--line)}
  .toc>.wrap{padding:1.1rem 28px 1.2rem}
  .toc .toc-label{font-size:.74rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--teal-dark);margin:0 0 .35rem}
  .toc ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:0 1.9rem}
  .toc li{margin:0;position:relative}
  .toc li+li::before{content:"\00B7";position:absolute;left:-1.05rem;top:50%;transform:translateY(-50%);color:var(--sage);font-weight:700}
  .toc a{display:inline-flex;align-items:center;min-height:44px;color:var(--teal-dark);font-weight:600;font-size:.92rem;line-height:1.35;text-decoration:none}
  .toc a:hover,.toc a:focus-visible{color:var(--forest);text-decoration:underline}
  @media(max-width:560px){
    .toc ul{display:block}
    .toc li+li::before{display:none}
    .toc li+li{border-top:1px dashed var(--line)}
    .toc a{width:100%}
  }
  @media print{.toc{display:none!important}}
  /* Jump targets for the contents nav. The global :target{scroll-margin-top:6rem} clears the sticky
     header on a cold load, but a contents jump made mid-page lands ~22px higher: the section is
     still pre-reveal (translateY) when the browser computes the scroll, then settles. 8rem absorbs
     that and keeps the heading's eyebrow visible above it. WCAG 2.2 2.4.11 Focus Not Obscured. */
  h2[id]{scroll-margin-top:8rem}
  /* Key facts grid (service pages, 2026-09-03): the five first-screen facts as a scannable grid of
     labelled cells instead of a run-on line, following the information-box pattern of the leading
     metro neuropsychology sites. Gold hairlines keep it in the trust palette. */
  .facts{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem 1.4rem;margin:0;padding:1.5rem 0 .3rem;list-style:none}
  .facts div{border-top:2px solid var(--gold);padding-top:.7rem;min-width:0}
  .facts dt{font-family:'Montserrat',sans-serif;font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--teal-dark);margin:0 0 .35rem}
  .facts dd{margin:0;font-size:.9rem;line-height:1.55;color:var(--ink-soft)}
  @media(max-width:1100px){.facts{grid-template-columns:repeat(3,1fr)}}
  @media(max-width:700px){.facts{grid-template-columns:1fr 1fr}}
  @media(max-width:480px){.facts{grid-template-columns:1fr}}
  @media print{.facts{grid-template-columns:1fr 1fr}}
  /* Four-card rows (2026-09-04): the base .cardrow is a fixed three-column grid, so a fourth card
     lands alone on a second row. .four makes it a balanced 2x2 that collapses with the others. */
  .cardrow.four{grid-template-columns:repeat(2,1fr)}
  @media(max-width:880px){.cardrow.four{grid-template-columns:1fr}}
  /* Footer contact column (operator, 2026-09-05): at laptop widths the column is about 170px and the
     assembled email address measured 168px at 17px, so it broke across two lines on every page.
     Keep it on one line at a slightly smaller size; the column has ample room at every other width. */
  #fg-contact .eml{white-space:nowrap;font-size:.85em;letter-spacing:-.01em}
  /* Guide provenance line: who prepared the page and when it was last reviewed. */
  .guide-meta{max-width:var(--maxw);margin:1.1rem auto 0;padding:0 28px;font-size:.86rem;color:var(--ink-soft)}
  /* Compact crisis line for purely administrative pages (see CRISIS_COMPACT): the full dark strip
     dominates a task that has nothing to do with distress, but the route must never disappear. */
  .crisis-compact{background:var(--mint-deep);color:var(--forest);font-size:.85rem;padding:.6rem 1rem}
  .crisis-compact a{color:var(--teal-dark);font-weight:600;text-decoration:underline}
  /* Footer disclosure groups: desktop is unchanged (headings render as headings, lists always open);
     below 880px each group heading becomes a button that toggles its own list, so the five-group
     directory stops running to several screens on a phone. Links stay in the DOM either way.
     The collapse rule is gated on .footgrid.acc, which the inline script adds only after it has
     wired the buttons, so a no-JS visitor still gets the full, open footer. No animation. */
  .foot-toggle{display:block;width:100%;text-align:left;background:none;border:0;padding:0;margin:0;font:inherit;color:inherit;cursor:default}
  @media(max-width:880px){
    .footgrid.acc{gap:0 2.5rem;padding:1.8rem 0 1.4rem}
    .footgrid.acc .foot-toggle{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:48px;cursor:pointer}
    .footgrid.acc .foot-toggle::after{content:"";flex:none;width:.5rem;height:.5rem;border-right:2px solid #9db8a5;border-bottom:2px solid #9db8a5;transform:rotate(45deg);margin-top:-.2rem}
    .footgrid.acc .foot-toggle[aria-expanded="true"]::after{transform:rotate(-135deg);margin-top:.15rem}
    .footgrid.acc h3{margin-bottom:0;border-bottom:1px solid rgba(255,255,255,.12)}
    .footgrid.acc>div>ul{display:none}
    .footgrid.acc>div.open>ul{display:block;padding:.55rem 0 .7rem}
  }
