/*
Theme Name:   Blocksy Child - Katelynn Leisher
Theme URI:    https://katelynnleisher.com
Description:  Child theme for Blocksy carrying the custom design system —
              lavender/plum tokens, Gambetta/Karla typography, dark mode,
              and all custom section styles (services, approach, safety,
              FAQ, loop diagram) from the approved mockup.
Author:       Built for Katelynn Leisher, LCSW-C
Template:     blocksy
Version:      1.0.0
Text Domain:  blocksy-child
*/

/* ==========================================================================
   NOTE ON SCOPE
   This stylesheet is enqueued AFTER Blocksy's own stylesheet (see
   functions.php), so everything below can override Blocksy defaults where
   class names match. The `*{margin:0;padding:0;box-sizing:border-box}`
   reset a few lines down is a full-page reset carried over from the
   original mockup — if it visibly disrupts a Blocksy-native element (an
   unstyled widget, WooCommerce output, etc.) outside the custom page
   templates, scope it to `.site-content *` instead of the bare `*`
   selector rather than removing it outright, so the custom sections keep
   their exact spacing.
   ========================================================================== */

  :root{
    --surface-base:#F4F1F7;
    --surface-warm:#F7F3EC;      /* new: warm ivory, breaks the all-lavender read */
    --surface-raised:#FBFAFC;
    --surface-recessed:#EBE5F1;
    --surface-inverse:#322A3D;

    --ink-primary:#2A2333;
    --ink-secondary:#564C63;
    --ink-muted:#635868;          /* darkened for AA on warm ivory */
    --ink-inverse:#F7F4FA;
    --ink-inverse-soft:#CFC4DB;

    --accent:#5F4480;             /* darkened: 8.1:1 on base, 7.6:1 on warm */
    --accent-solid:#5F4480;       /* dedicated token for solid fills (buttons) — kept dark enough for white text in both themes */
    --accent-solid-hover:#4B3466;
    --accent-hover:#4B3466;
    --accent-soft:#C9B8DD;
    --accent-wash:#DFD5EA;
    --support-moss:#5E6E54;       /* supporting accent only, never a CTA */
    --support-sand:#C8B49B;

    --line:#DCD3E4;
    --line-warm:#E4DACD;
    --line-strong:#C3B7CE;
    --focus-ring:#3D2A55;

    --font-display:'Gambetta',Georgia,serif;
    --font-body:'Karla',system-ui,sans-serif;
    --space-section:clamp(4.5rem,9vw,8rem);
    --radius-pill:100px;
    --ease-out:cubic-bezier(.22,1,.36,1);
  }

  /* ---------- dark mode: brand-aligned, not an auto-invert ----------
     Same lavender/plum family as light mode, re-tuned for dark-surface
     contrast rather than inverted. Opt-in only via the toggle below —
     the OS/browser dark-mode preference is deliberately ignored, so
     light stays the true default regardless of system setting. */
  :root[data-theme="dark"]{
    --surface-base:#1E1826;
    --surface-warm:#241C29;
    --surface-raised:#2A2231;
    --surface-recessed:#28202D;
    --surface-inverse:#4A3760;      /* deep violet accent band — distinct from the page base, same light-text pairing as light mode */

    --ink-primary:#F3EEF8;
    --ink-secondary:#CBBFD8;
    --ink-muted:#A497B3;            /* 4.6:1 on base */
    --ink-inverse:#F7F4FA;
    --ink-inverse-soft:#D6C9E5;

    --accent:#C9AEEA;                /* 9.4:1 on base */
    --accent-solid:#7B5AA6;          /* stays dark enough for white button text even in dark mode */
    --accent-solid-hover:#6B4B92;
    --accent-hover:#DAC5F2;
    --accent-soft:#D2C0E8;           /* same job as light mode: legible text/links on the --surface-inverse band */
    --accent-wash:#3A2E46;
    --support-moss:#9FB491;
    --support-sand:#D9C6A8;

    --line:#3A2F44;
    --line-warm:#3A3038;
    --line-strong:#4C3F5A;
    --focus-ring:#DAC5F2;
  }

  :root{ color-scheme: light; }
  :root[data-theme="dark"]{ color-scheme: dark; }

  body,.masthead,.mobile-panel,.svc,.cred,.post-thumb,.faq-item,.btn,.safety-box,
  .nav-list a::after,.link-more .arrow{
    transition: background-color .35s ease, color .35s ease, border-color .35s ease;
  }

  *{margin:0;padding:0;box-sizing:border-box}
  body{background:var(--surface-base);color:var(--ink-primary);font-family:var(--font-body);
       font-size:17px;line-height:1.68;-webkit-font-smoothing:antialiased}
  .shell{width:100%;max-width:1140px;margin:0 auto;padding-inline:clamp(1.25rem,4vw,2.75rem)}
  .measure{max-width:44rem}
  h1,h2,h3{font-family:var(--font-display);font-weight:400;letter-spacing:-.015em}
  a{color:inherit}
  img{max-width:100%;display:block}
  :focus-visible{outline:2px solid var(--focus-ring);outline-offset:3px;border-radius:2px}

  .skip{position:absolute;left:-9999px;top:0;background:var(--accent-solid);color:#fff;
        padding:.75rem 1.25rem;z-index:300;border-radius:0 0 4px 0}
  .skip:focus{left:0}

  .eyebrow{font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;font-weight:500;color:var(--accent)}

  /* ---------- motion primitives ---------- */
  .word{display:inline-block;will-change:transform,opacity}
  .fade-up{opacity:0}
  @media (prefers-reduced-motion:reduce){ .fade-up,.word{opacity:1!important;transform:none!important} }

  /* ---------- header ---------- */
  .masthead{position:sticky;top:0;z-index:80;background:rgba(244,241,247,.9);
            backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
  :root[data-theme="dark"] .masthead{background:rgba(30,24,38,.86)}
  .masthead .shell{display:flex;align-items:center;justify-content:space-between;min-height:80px;gap:1.25rem}
  .wordmark{font-family:var(--font-display);font-size:1.22rem;text-decoration:none;line-height:1.2;white-space:nowrap}
  .wordmark span{display:block;font-family:var(--font-body);font-size:.64rem;letter-spacing:.16em;
                 text-transform:uppercase;color:var(--ink-muted);margin-top:3px}
  .nav-list{display:flex;gap:clamp(1.25rem,2.6vw,2.25rem);list-style:none;align-items:center}
  .nav-list a{text-decoration:none;font-size:.94rem;color:var(--ink-secondary);position:relative;
              padding-block:6px;transition:color .3s ease}
  .nav-list a::after{content:'';position:absolute;left:0;bottom:0;height:1px;width:0;
                     background:var(--accent);transition:width .4s var(--ease-out)}
  .nav-list a:hover{color:var(--ink-primary)}
  .nav-list a:hover::after{width:100%}
  .header-actions{display:flex;align-items:center;gap:.75rem}

  .menu-toggle{display:none;background:none;border:1px solid var(--line-strong);border-radius:var(--radius-pill);
               padding:.55rem .95rem;font-family:var(--font-body);font-size:.88rem;cursor:pointer;
               color:var(--ink-primary);align-items:center;gap:.5rem}
  .menu-toggle .bars{display:inline-flex;flex-direction:column;gap:3px}
  .menu-toggle .bars i{display:block;width:15px;height:1.5px;background:var(--ink-primary);transition:transform .3s var(--ease-out),opacity .2s}
  .menu-toggle[aria-expanded="true"] .bars i:nth-child(1){transform:translateY(4.5px) rotate(45deg)}
  .menu-toggle[aria-expanded="true"] .bars i:nth-child(2){opacity:0}
  .menu-toggle[aria-expanded="true"] .bars i:nth-child(3){transform:translateY(-4.5px) rotate(-45deg)}

  .theme-toggle{
    display:inline-flex; align-items:center; justify-content:center;
    width:38px; height:38px; border-radius:50%; border:1px solid var(--line-strong);
    background:none; cursor:pointer; color:var(--ink-primary); flex-shrink:0;
    transition:border-color .3s ease, background-color .3s ease;
  }
  .theme-toggle:hover{border-color:var(--accent)}
  .theme-toggle svg{width:17px;height:17px}
  .theme-toggle .icon-moon{display:none}
  :root[data-theme="dark"] .theme-toggle .icon-sun{display:none}
  :root[data-theme="dark"] .theme-toggle .icon-moon{display:block}
  .theme-toggle-mobile{
    display:flex; align-items:center; gap:.6rem; margin-top:1.5rem;
    background:none; border:1px solid var(--line-strong); border-radius:var(--radius-pill);
    padding:.6rem 1.1rem; font-family:var(--font-body); font-size:.88rem; color:var(--ink-primary); cursor:pointer;
  }
  .theme-toggle-mobile svg{width:16px;height:16px}
  .theme-toggle-mobile .icon-moon{display:none}
  :root[data-theme="dark"] .theme-toggle-mobile .icon-sun{display:none}
  :root[data-theme="dark"] .theme-toggle-mobile .icon-moon{display:block}

  .mobile-panel{
    position:fixed;inset:80px 0 0;z-index:70;background:var(--surface-base);
    padding:2rem clamp(1.25rem,5vw,2rem) 3rem;
    transform:translateY(-8px);opacity:0;visibility:hidden;
    transition:opacity .35s var(--ease-out),transform .35s var(--ease-out),visibility .35s;
    overflow-y:auto;
  }
  .mobile-panel.open{opacity:1;visibility:visible;transform:none}
  .mobile-panel ul{list-style:none;display:grid;gap:.25rem;margin-bottom:2rem}
  .mobile-panel a{display:block;text-decoration:none;font-family:var(--font-display);font-size:1.65rem;
                  padding-block:.85rem;border-bottom:1px solid var(--line)}
  .mobile-panel .panel-meta{font-size:.9rem;color:var(--ink-secondary);margin-top:1.5rem}

  /* ---------- buttons ---------- */
  .btn{display:inline-flex;align-items:center;gap:.5rem;font-size:.95rem;font-weight:500;
       text-decoration:none;border-radius:var(--radius-pill);padding:.92rem 1.75rem;
       border:1px solid transparent;cursor:pointer;font-family:var(--font-body);
       transition:background .3s ease,color .3s ease,border-color .3s ease}
  .btn .arrow{display:inline-block;transition:transform .35s var(--ease-out)}
  .btn:hover .arrow{transform:translateX(4px)}
  .btn-primary{background:var(--accent-solid);color:#FFF}
  .btn-primary:hover{background:var(--accent-solid-hover)}
  .btn-secondary{background:transparent;color:var(--ink-primary);border-color:var(--line-strong)}
  .btn-secondary:hover{border-color:var(--accent);color:var(--accent)}
  .btn-inverse{background:var(--ink-inverse);color:var(--surface-inverse)}
  .btn-inverse:hover{background:#fff}
  .btn-sm{padding:.6rem 1.3rem;font-size:.88rem}
  .link-more{display:inline-flex;align-items:center;gap:.4rem;text-decoration:none;font-size:.92rem;
             font-weight:500;color:var(--accent);border-bottom:1px solid transparent;padding-bottom:2px;
             transition:border-color .3s ease}
  .link-more:hover{border-color:var(--accent)}
  .link-more .arrow{transition:transform .35s var(--ease-out)}
  .link-more:hover .arrow{transform:translateX(4px)}

  /* ---------- hero ---------- */
  .hero{position:relative;padding-block:clamp(3.5rem,7vw,6rem) clamp(3rem,6vw,5rem);overflow:hidden}
  .hero-grid{display:grid;grid-template-columns:1.06fr .94fr;gap:clamp(2.5rem,6vw,4.5rem);align-items:center}
  .hero h1{font-size:clamp(2.35rem,4.9vw,3.65rem);line-height:1.12;margin-block:1.25rem 1.4rem}
  .hero h1 em{font-style:italic;color:var(--accent)}
  .hero-sub{font-size:clamp(1.02rem,1.4vw,1.1rem);color:var(--ink-secondary);max-width:37rem}
  .hero-actions{display:flex;flex-wrap:wrap;gap:.85rem;margin-top:2rem}

  .portrait-field{position:relative;width:100%;max-width:430px;margin-inline:auto;display:grid;place-items:center}
  .calm-canvas{position:absolute;inset:-6%;width:112%;height:112%;pointer-events:none}
  .portrait{position:relative;z-index:2;width:74%;aspect-ratio:4/5;
            border-radius:190px 190px 6px 6px;overflow:hidden;
            background:linear-gradient(165deg,#D6CAE4,#BFB0D2);
            display:grid;place-items:center;text-align:center;padding:1rem;
            color:rgba(42,35,51,.5);font-size:.78rem;letter-spacing:.05em;line-height:1.5}
  :root[data-theme="dark"] .portrait{background:linear-gradient(165deg,#5A4A72,#463A56); color:rgba(243,238,248,.55)}

  /* ---------- trust bar ---------- */
  .trustbar{background:var(--surface-warm);border-block:1px solid var(--line-warm);padding-block:1.35rem}
  .trustbar ul{list-style:none;display:flex;flex-wrap:wrap;gap:.6rem 2rem;justify-content:center;align-items:center}
  .trustbar li{display:flex;align-items:center;gap:.55rem;font-size:.92rem;color:var(--ink-secondary)}
  .trustbar li::before{content:'';width:4px;height:4px;border-radius:50%;background:var(--support-moss);flex-shrink:0}

  /* ---------- recognition ---------- */
  .recognition{padding-block:var(--space-section)}
  .recog-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(2rem,5vw,4rem);align-items:start}
  .recognition h2{font-size:clamp(1.85rem,3.2vw,2.45rem);line-height:1.22;margin-top:.8rem}
  .recog-list{list-style:none;display:grid;gap:0;border-top:1px solid var(--line)}
  .recog-list li{padding-block:1.15rem;border-bottom:1px solid var(--line);display:grid;
                 grid-template-columns:1.5rem 1fr;gap:.9rem;align-items:start;font-size:1.02rem;color:var(--ink-secondary)}
  .recog-list li::before{content:'';width:7px;height:7px;border:1px solid var(--accent);border-radius:50%;margin-top:.6rem}
  .recog-foot{margin-top:1.75rem;font-size:1rem;color:var(--ink-primary);font-family:var(--font-display);font-size:1.15rem}

  /* ---------- primary services ---------- */
  .services{padding-block:var(--space-section);background:var(--surface-warm);border-block:1px solid var(--line-warm)}
  .section-head{max-width:40rem;margin-bottom:clamp(2.25rem,4.5vw,3.5rem)}
  .section-head h2{font-size:clamp(1.85rem,3.2vw,2.45rem);margin-top:.8rem;line-height:1.22}
  .section-head p{color:var(--ink-secondary);margin-top:.9rem}

  .svc-list{display:grid;gap:0;border-top:1px solid var(--line-warm)}
  .svc{display:grid;grid-template-columns:3rem 1fr;gap:clamp(1rem,3vw,1.75rem);
       align-items:start;padding-block:clamp(2rem,4vw,2.75rem);border-bottom:1px solid var(--line-warm);
       transition:background .45s var(--ease-out),padding-inline .45s var(--ease-out)}
  .svc:hover{background:#FBF8F2;padding-inline:1.15rem}
  :root[data-theme="dark"] .svc:hover{background:#2E2536}
  .svc-idx{font-family:var(--font-display);font-style:italic;color:var(--accent);font-size:1rem;padding-top:.25rem}
  .svc h3{font-size:clamp(1.22rem,2vw,1.44rem);line-height:1.3;margin-bottom:1.1rem}
  .svc-detail{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,3vw,2.5rem)}
  .svc-block{border-left:2px solid var(--line-warm);padding-left:1.1rem}
  .svc-block:last-child{border-left-color:var(--accent-wash)}
  .svc-label{display:block;font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;
             font-weight:500;color:var(--ink-muted);margin-bottom:.5rem}
  .svc-block:last-child .svc-label{color:var(--accent)}
  .svc-block p{color:var(--ink-secondary);font-size:.96rem;line-height:1.6}
  @media (max-width:700px){
    .svc-detail{grid-template-columns:1fr;gap:1.25rem}
  }

  /* ---------- approach ---------- */
  .approach{background:var(--surface-inverse);color:var(--ink-inverse);
            padding-block:var(--space-section);position:relative;overflow:hidden}
  .approach .eyebrow{color:var(--accent-soft)}
  .approach-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:clamp(2.5rem,6vw,4.5rem);
                 align-items:center;position:relative;z-index:2}
  .approach h2{font-size:clamp(1.9rem,3.4vw,2.55rem);line-height:1.22;margin-top:.8rem}
  .approach .subhead{font-family:var(--font-display);font-style:italic;color:var(--accent-soft);
                     font-size:1.08rem;margin-top:.85rem}
  .approach p{color:var(--ink-inverse-soft);margin-top:1.15rem}
  .modalities{list-style:none;display:flex;flex-wrap:wrap;gap:.55rem;margin-top:1.9rem}
  .modalities li{border:1px solid rgba(207,196,219,.34);color:var(--ink-inverse-soft);
                 border-radius:var(--radius-pill);padding:.42rem 1rem;font-size:.86rem}
  .halo{position:absolute;border:1px solid rgba(201,184,221,.13);border-radius:50%;will-change:transform}
  .halo-a{width:540px;height:540px;top:-180px;right:-160px}
  .halo-b{width:390px;height:390px;bottom:-180px;left:-120px}

  /* ---------- about preview ---------- */
  .about-prev{padding-block:var(--space-section)}
  .about-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(2rem,5vw,4rem);align-items:center}
  .about-photo{aspect-ratio:4/5;border-radius:4px;background:linear-gradient(160deg,#E0D6C6,#CDBFAC);
               display:grid;place-items:center;color:rgba(42,35,51,.5);font-size:.78rem;
               letter-spacing:.05em;text-align:center;padding:1rem;line-height:1.5}
  :root[data-theme="dark"] .about-photo{background:linear-gradient(160deg,#4A4234,#3A3428); color:rgba(243,238,248,.55)}
  .about-prev h2{font-size:clamp(1.85rem,3.2vw,2.45rem);line-height:1.22;margin-top:.8rem}
  .about-prev p{color:var(--ink-secondary);margin-top:1.1rem}
  .about-prev .link-more{margin-top:1.6rem}
  .approach .link-more{margin-top:1.5rem;color:var(--accent-soft)}
  .approach .link-more:hover{border-color:var(--accent-soft)}

  /* ---------- credentials ---------- */
  .creds{padding-block:clamp(3rem,6vw,4.5rem);background:var(--surface-recessed);border-block:1px solid var(--line)}
  .cred-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:1.5rem 2rem}
  .cred{border-left:2px solid var(--accent-wash);padding-left:1.05rem}
  .cred strong{display:block;font-weight:500;font-size:.97rem}
  .cred span{font-size:.87rem;color:var(--ink-muted)}

  /* ---------- blog preview ---------- */
  .blog{padding-block:var(--space-section)}
  .blog-head{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:end;
             margin-bottom:clamp(2rem,4vw,3rem)}
  .blog-head h2{font-size:clamp(1.85rem,3.2vw,2.45rem);margin-top:.8rem;line-height:1.22}
  .post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.25rem,3vw,2rem)}
  .post{text-decoration:none;display:flex;flex-direction:column;gap:.85rem;
        transition:transform .4s var(--ease-out)}
  .post:hover{transform:translateY(-4px)}
  .post-thumb{aspect-ratio:16/10;border-radius:4px;background:var(--surface-recessed);
              border:1px solid var(--line);overflow:hidden;position:relative}
  .post-thumb::after{content:'';position:absolute;inset:0;
    background:radial-gradient(120% 90% at 30% 20%,rgba(201,184,221,.55),transparent 60%),
               radial-gradient(90% 80% at 80% 90%,rgba(200,180,155,.4),transparent 60%)}
  .post .cat{font-size:.75rem;letter-spacing:.13em;text-transform:uppercase;color:var(--accent);font-weight:500}
  .post h3{font-size:1.14rem;line-height:1.32}
  .post p{font-size:.94rem;color:var(--ink-secondary)}
  .post .meta{font-size:.83rem;color:var(--ink-muted);margin-top:auto;padding-top:.35rem}

  /* ---------- faq ---------- */
  .faq{padding-block:var(--space-section);background:var(--surface-recessed);border-block:1px solid var(--line)}
  .faq-grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:clamp(2rem,5vw,4rem);align-items:start}
  .faq-grid h2{font-size:clamp(1.85rem,3.2vw,2.45rem);margin-top:.8rem;line-height:1.22}
  .faq-grid .section-head{margin-bottom:0;position:sticky;top:100px}
  .faq-grid .section-head p{margin-top:.9rem}
  .faq-list{border-top:1px solid var(--line-strong)}
  .faq-item{border-bottom:1px solid var(--line-strong)}
  .faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:1.5rem;
         background:none;border:none;text-align:left;cursor:pointer;padding-block:1.4rem;
         font-family:var(--font-body);color:var(--ink-primary)}
  .faq-q h3{font-family:var(--font-display);font-weight:400;font-size:1.14rem;line-height:1.4}
  .faq-plus{position:relative;flex-shrink:0;width:20px;height:20px}
  .faq-plus::before,.faq-plus::after{content:'';position:absolute;background:var(--accent);
    top:50%;left:50%;transform:translate(-50%,-50%);transition:transform .35s var(--ease-out),opacity .35s}
  .faq-plus::before{width:14px;height:1.5px}
  .faq-plus::after{width:1.5px;height:14px}
  .faq-item[data-open="true"] .faq-plus::after{transform:translate(-50%,-50%) rotate(90deg);opacity:0}
  .faq-item[data-open="true"] .faq-q h3{color:var(--accent)}
  .faq-a{overflow:hidden;height:0;transition:height .45s var(--ease-out)}
  .faq-a-inner{padding-bottom:1.5rem;padding-right:2.5rem;color:var(--ink-secondary);font-size:.98rem}
  .faq-a-inner p{margin-bottom:.85rem}
  .faq-a-inner p:last-child{margin-bottom:0}
  @media (max-width:900px){
    .faq-grid{grid-template-columns:1fr}
    .faq-grid .section-head{position:static}
  }

  /* ---------- medical safety ---------- */
  .safety{padding-block:clamp(2.5rem,5vw,3.5rem)}
  .safety-box{
    background:var(--surface-recessed); border:1px solid var(--line);
    border-left:4px solid var(--accent); border-radius:6px;
    padding:clamp(1.75rem,4vw,2.5rem) clamp(1.75rem,4vw,2.75rem);
    display:grid; grid-template-columns:auto 1fr; gap:clamp(1.25rem,3vw,2.5rem); align-items:start;
  }
  .safety-box h2{font-family:var(--font-display);font-weight:500;font-size:1.3rem;line-height:1.4;
                 color:var(--ink-primary); max-width:14rem}
  .safety-box p{color:var(--ink-secondary); font-size:.98rem; margin-bottom:.75rem}
  .safety-box p:last-of-type{margin-bottom:0}
  .safety-box p.safety-callout{
    display:block; font-family:var(--font-display); font-weight:600; font-style:italic;
    font-size:1.15rem; line-height:1.4; color:var(--ink-primary);
    margin-bottom:1rem;
  }
  .safety-box .link-more{margin-top:.4rem}
  @media (max-width:700px){ .safety-box{grid-template-columns:1fr} }

  /* ---------- closing ---------- */
  .closing{padding-block:var(--space-section);background:var(--surface-warm);border-top:1px solid var(--line-warm)}
  .closing-inner{max-width:44rem;margin-inline:auto;text-align:center}
  .closing h2{font-size:clamp(1.95rem,3.7vw,2.7rem);line-height:1.22;margin-block:.9rem 1.2rem}
  .closing h2 em{font-style:italic;color:var(--accent)}
  .closing>.shell>.closing-inner>p{color:var(--ink-secondary)}
  .consult-steps{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;
                 margin:2.25rem 0;text-align:left}
  .consult-steps li{border-top:1px solid var(--line-strong);padding-top:.9rem}
  .consult-steps strong{display:block;font-family:var(--font-display);font-size:1.05rem;margin-bottom:.3rem}
  .consult-steps span{font-size:.9rem;color:var(--ink-secondary)}
  .closing-actions{display:flex;gap:.85rem;justify-content:center;flex-wrap:wrap}

  /* ---------- footer ---------- */
  .site-foot{background:var(--surface-inverse);color:var(--ink-inverse-soft);padding-block:clamp(3rem,6vw,4rem) 2rem}
  .foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2.5rem;padding-bottom:2.5rem;
             border-bottom:1px solid rgba(207,196,219,.18)}
  .foot-grid h4{font-family:var(--font-body);font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;
                color:var(--accent-soft);font-weight:500;margin-bottom:1rem}
  .foot-brand .name{font-family:var(--font-display);font-size:1.3rem;color:var(--ink-inverse);margin-bottom:.4rem}
  .foot-grid ul{list-style:none;display:grid;gap:.55rem}
  .foot-grid a{color:var(--ink-inverse-soft);text-decoration:none;font-size:.92rem;
               border-bottom:1px solid transparent;transition:color .3s,border-color .3s}
  .foot-grid a:hover{color:var(--ink-inverse);border-color:var(--accent-soft)}
  .foot-grid p{font-size:.92rem}
  .crisis{margin-top:2rem;padding:1.15rem 1.35rem;border:1px solid rgba(207,196,219,.28);border-radius:4px;
          font-size:.88rem;line-height:1.6}
  .crisis strong{color:var(--ink-inverse);font-weight:500}
  .foot-base{display:flex;flex-wrap:wrap;gap:.75rem 2rem;justify-content:space-between;
             margin-top:1.75rem;font-size:.82rem;color:rgba(207,196,219,.72)}

  /* ---------- responsive ---------- */
  @media (max-width:960px){
    .hero-grid,.approach-grid,.recog-grid,.about-grid{grid-template-columns:1fr}
    .portrait-field{max-width:320px;order:-1;margin-bottom:.5rem}
    .about-photo{max-width:300px}
    .post-grid{grid-template-columns:1fr 1fr}
    .foot-grid{grid-template-columns:1fr 1fr}
    .svc{grid-template-columns:2.5rem 1fr}
  }
  @media (max-width:700px){
    body{font-size:16px}
    .nav-list{display:none}
    .header-actions .btn-sm{display:none}
    .menu-toggle{display:inline-flex}
    .post-grid{grid-template-columns:1fr}
    .consult-steps{grid-template-columns:1fr}
    .foot-grid{grid-template-columns:1fr}
    .hero-actions .btn{width:100%;justify-content:center}
    .svc:hover{padding-inline:0}
    .trustbar ul{justify-content:flex-start;gap:.5rem 1.25rem}
  }

  /* ---------- subpage hero (simpler than homepage hero — no canvas) ---------- */
  .page-hero{padding-block:clamp(3.5rem,7vw,5.5rem) clamp(2.5rem,5vw,3.5rem)}
  .page-hero .measure{max-width:46rem}
  .page-hero h1{font-size:clamp(2.1rem,4.2vw,3.1rem);line-height:1.14;margin-block:1.1rem 1.3rem}
  .page-hero h1 em{font-style:italic;color:var(--accent)}
  .page-hero .lede{font-size:clamp(1.02rem,1.4vw,1.12rem);color:var(--ink-secondary)}

  /* ---------- alternating prose bands ---------- */
  .prose-section{padding-block:var(--space-section)}
  .prose-section.warm{background:var(--surface-warm);border-block:1px solid var(--line-warm)}
  .prose-section.dark{background:var(--surface-inverse);color:var(--ink-inverse)}
  .prose-section.dark .eyebrow{color:var(--accent-soft)}
  .prose-section.dark h2{color:var(--ink-inverse)}
  .prose-section.dark p{color:var(--ink-inverse-soft)}
  .prose-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:clamp(2rem,5vw,4rem);align-items:start}
  .prose-grid .section-head{margin-bottom:0;position:sticky;top:100px}
  .prose h2{font-size:clamp(1.7rem,2.8vw,2.15rem);line-height:1.28}
  .prose p{color:var(--ink-secondary);font-size:1.02rem;line-height:1.75;margin-bottom:1.15rem}
  .prose p:last-child{margin-bottom:0}
  @media (max-width:900px){
    .prose-grid{grid-template-columns:1fr}
    .prose-grid .section-head{position:static}
  }

  /* ---------- pull-quote band ---------- */
  .quote-band{background:var(--surface-warm);border-block:1px solid var(--line-warm);
              padding-block:clamp(3rem,6vw,4.5rem)}
  .quote-band .measure{max-width:46rem}
  .quote-band blockquote{font-family:var(--font-display);font-style:italic;font-weight:400;
                          font-size:clamp(1.3rem,2.6vw,1.75rem);line-height:1.5;color:var(--ink-primary)}
  .quote-band cite{display:block;margin-top:1rem;font-style:normal;font-size:.85rem;
                    color:var(--ink-muted);letter-spacing:.04em}

  /* ---------- generic bordered image block (portrait / office / etc placeholders) ---------- */
  .art-block{aspect-ratio:4/5;border-radius:4px;background:linear-gradient(160deg,#D6CAE4,#BFB0D2);
             display:grid;place-items:center;color:rgba(42,35,51,.5);font-size:.78rem;
             letter-spacing:.05em;text-align:center;padding:1rem;line-height:1.5}
  :root[data-theme="dark"] .art-block{background:linear-gradient(160deg,#5A4A72,#463A56);color:rgba(243,238,248,.55)}
  .art-block.arch{border-radius:170px 170px 4px 4px}

  /* ---------- eligibility / protocol lists (reuses recog-list bullet pattern) ---------- */
  .recog-list strong{color:var(--ink-primary);font-weight:500}
  .prose-section.dark .recog-list{border-top-color:rgba(207,196,219,.25)}
  .prose-section.dark .recog-list li{border-bottom-color:rgba(207,196,219,.25);color:var(--ink-inverse-soft)}
  .prose-section.dark .recog-list li strong{color:var(--ink-inverse)}
  .prose-section.dark .recog-list li::before{border-color:var(--accent-soft)}

  /* ---------- therapy loop diagram (approach page) ---------- */
  .loop-diagram{padding-block:clamp(3rem,6vw,4.5rem);background:var(--surface-warm);border-block:1px solid var(--line-warm)}
  .loop-wrap{position:relative;max-width:40rem;margin-inline:auto}
  .loop-wrap::before{content:'';position:absolute;left:1.375rem;top:2.75rem;bottom:2.75rem;
                      width:2px;background:var(--line-strong);z-index:1}
  .loop-node{display:grid;grid-template-columns:2.75rem 1fr;gap:1.5rem;align-items:center;
             position:relative;padding-block:1.3rem}
  .loop-dot{width:2.75rem;height:2.75rem;border-radius:50%;background:var(--surface-raised);
            border:1.5px solid var(--accent);display:grid;place-items:center;position:relative;z-index:2;
            font-family:var(--font-display);font-style:italic;font-size:.82rem;color:var(--accent);flex-shrink:0}
  .loop-content h3{font-size:1.14rem;line-height:1.3;margin-bottom:.35rem}
  .loop-content p{font-size:.94rem;color:var(--ink-secondary)}
  .loop-back{display:flex;align-items:center;gap:.75rem;justify-content:center;margin-top:1.5rem;
             padding-top:1.5rem;border-top:1px dashed var(--line-strong);
             font-size:.85rem;color:var(--ink-muted);font-style:italic;font-family:var(--font-display)}
  .loop-back svg{width:20px;height:20px;color:var(--accent);flex-shrink:0}
  @media (max-width:640px){
    .loop-wrap::before{left:1.2rem}
    .loop-node{grid-template-columns:2.4rem 1fr;gap:1rem}
    .loop-dot{width:2.4rem;height:2.4rem;font-size:.72rem}
  }