/* ============================================================
   BRAND TOKENS  —  ⚠️ CONFIRM / REPLACE WITH EXACT CLIENT VALUES
   The site is on Squarespace so exact hex/fonts couldn't be
   pulled from CSS. These are inferred from the "Sunlife / Sunny /
   morning sun" identity. Change these 6 values + 2 font names and
   the whole site re-skins instantly.
   ============================================================ */
:root{
  /* Exact brand palette sampled from the Sunlife logo */
  --sun:        #F6D25B;   /* golden — primary "sunlight" (logo "n"/"e") */
  --sun-deep:   #E9BE3F;   /* hover / depth */
  --coral:      #E8967E;   /* terracotta coral (logo "i") */
  --coral-deep: #D67A60;   /* readable coral for accent text */
  --sky:        #3B8B7E;   /* deep teal accent (readable sibling of the mint) */
  --mint:       #AEE0D6;   /* soft mint (logo "u") */
  --sage:       #B0B87C;   /* muted sage green (logo "l"/"f") */
  --blush:      #F6B7AE;   /* soft blush pink (logo "S") */
  --cream:      #FBF7EF;   /* warm page background */
  --ink:        #204850;   /* deep slate-navy — brand text (logo "CHIROPRACTIC") */
  --ink-soft:   #55707A;   /* secondary text */
  --white:      #ffffff;
  --line:       #ECE4D6;   /* hairline borders on cream */

  --display: "Fraunces", Georgia, serif;
  --body:    "Nunito Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --wrap: 1180px;
  --radius: 18px;
  --shadow-sm: 0 2px 10px rgba(44,42,38,.06);
  --shadow-md: 0 14px 40px rgba(44,42,38,.10);
  --shadow-lg: 0 30px 70px rgba(44,42,38,.16);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--body);
  color:var(--ink);
  background:var(--cream);
  line-height:1.62;
  font-size:17px;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}

h1,h2,h3,h4{font-family:var(--display);font-weight:600;line-height:1.12;letter-spacing:-.01em;color:var(--ink);text-transform:capitalize}
h1{font-size:clamp(2.5rem,5.2vw,4rem);font-weight:500}
h2{font-size:clamp(1.9rem,3.6vw,2.9rem)}
h3{font-size:1.35rem}
p{color:var(--ink-soft)}

.eyebrow{
  font-family:var(--body);font-weight:800;font-size:.78rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--sky);display:inline-flex;align-items:center;gap:.5rem;
}
.eyebrow::before{content:"";width:26px;height:2px;background:var(--sun);display:inline-block;border-radius:2px}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:.55rem;font-family:var(--body);font-weight:800;
  font-size:.98rem;padding:.95rem 1.7rem;border-radius:999px;cursor:pointer;border:2px solid transparent;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease;white-space:nowrap;
}
.btn-primary{background:var(--sun);color:var(--ink);box-shadow:0 8px 22px rgba(233,190,63,.42)}
.btn-primary:hover{background:var(--sun-deep);transform:translateY(-2px);box-shadow:0 12px 28px rgba(214,168,48,.5)}
.btn-ghost{background:transparent;border-color:var(--ink);color:var(--ink)}
.btn-ghost:hover{background:var(--ink);color:var(--cream);transform:translateY(-2px)}
.btn-white{background:var(--white);color:var(--ink);box-shadow:var(--shadow-sm)}
.btn-white:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}

/* ============================================================
   HEADER
   ============================================================ */
.topbar{background:var(--ink);color:#f3ede1;font-size:.85rem;font-weight:600}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-top:.5rem;padding-bottom:.5rem}
.topbar a{color:#f3ede1;display:inline-flex;align-items:center;gap:.4rem}
.topbar a:hover{color:var(--sun)}
.topbar .tb-hours{color:#c9c1b3}

header{position:sticky;top:0;z-index:100;background:rgba(252,247,238,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);transition:padding .25s ease, box-shadow .25s ease}
header.shrink{box-shadow:var(--shadow-sm)}
/* The header row needs more than the sitewide 1180px content width once every
   nav item (8, plus Blog) and both CTAs sit on one line -- scoped to the
   header only so body content elsewhere keeps its normal reading width. */
header .wrap.nav{max-width:1320px}
.nav{position:relative;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:.95rem 0;transition:padding .25s ease}
header.shrink .nav{padding:.55rem 0}
/* flex-shrink:0 -- an <img> with height-only sizing and the browser's default
   overflow:clip has an automatic min-width of 0 as a flex item, so when the
   nav row (8 links + 2 CTAs) doesn't fit its 1180px cap, flexbox shrinks the
   logo to literally 0px before touching anything else. The logo must never
   be the thing that disappears to make room. */
.brand{display:flex;align-items:center;gap:.7rem;font-family:var(--display);font-weight:600;font-size:1.35rem;color:var(--ink);flex-shrink:0}
.brand .mark{width:38px;height:38px;flex:none;border-radius:50%;background:
   radial-gradient(circle at 50% 55%,var(--sun) 0 42%,transparent 43%),
   conic-gradient(from 0deg,var(--sun),var(--sun-deep),var(--sun));
   position:relative}
.brand .mark::after{content:"";position:absolute;inset:0;border-radius:50%;
   background:repeating-conic-gradient(from 0deg,transparent 0 24deg,rgba(255,255,255,.5) 24deg 26deg)}
.brand small{display:block;font-family:var(--body);font-weight:700;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--sky);margin-top:-2px}
.brand-logo{height:50px;width:auto;display:block;transition:height .25s ease}
header.shrink .brand-logo{height:40px}
.nav-links{display:flex;align-items:center;gap:.2rem;list-style:none;flex-wrap:nowrap}
.nav-links > li{position:relative;flex-shrink:0}
/* The mega-menu centres on the whole nav bar, not on its own narrow trigger, so
   this item opts out of being a positioning context and .megamenu's left:50%
   resolves against .nav instead. */
.nav-links > li.has-mega{position:static}
.nav-links > li > a,
.nav-links > li > details > summary{display:flex;align-items:center;gap:.35rem;padding:.65rem .55rem;border-radius:8px;color:var(--ink);font-weight:700;font-size:.95rem;cursor:pointer;list-style:none;user-select:none;white-space:nowrap}
.nav-links > li > details > summary::-webkit-details-marker{display:none}
.nav-links > li > a:hover,
.nav-links > li > details > summary:hover,
.nav-links > li > details[open] > summary{background:var(--cream)}
.nav-links > li.is-current > a{background:var(--cream)}
.chev{width:9px;height:9px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform .15s ease;margin-top:-3px}
details[open] > summary .chev{transform:rotate(225deg);margin-top:3px}

/* Level 2: flat dropdown (Services) */
.nav-links .dropdown{position:absolute;top:calc(100% + 8px);left:0;min-width:280px;background:var(--white);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-md);padding:.5rem;z-index:110}
.nav-links .dropdown a{display:block;padding:.6rem .8rem;border-radius:9px;color:var(--ink);font-weight:600;font-size:.92rem}
.nav-links .dropdown a:hover{background:var(--cream);color:var(--coral-deep)}
.nav-links .dropdown-all{margin-top:.25rem;border-top:1px solid var(--line);border-radius:0 0 9px 9px;font-weight:700;color:var(--sky)}

/* Mega menu (Conditions): five category columns in one panel */
.nav-links .megamenu{position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%);width:min(920px,92vw);background:var(--white);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow-md);padding:1.6rem;z-index:110}
.mega-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1.4rem}
.mega-col h4{margin:0 0 .6rem;font-family:var(--body);font-size:.78rem;letter-spacing:.03em;text-transform:uppercase;color:var(--coral-deep);font-weight:800}
.mega-col h4 a{color:inherit}
.mega-col h4 a:hover{text-decoration:underline}
.mega-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.35rem}
.mega-col a.cond-link{display:block;padding:.15rem 0;color:var(--ink);font-size:.88rem;font-weight:600;line-height:1.35}
.mega-col a.cond-link:hover{color:var(--coral-deep)}
.mega-foot{margin-top:1.2rem;padding-top:1rem;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}
.mega-foot p{margin:0;font-size:.85rem}
.mega-foot p a{font-weight:700;color:var(--sky);text-decoration:underline}
.nav-cta{display:flex;align-items:center;gap:.8rem}
.burger{display:none;background:none;border:none;cursor:pointer;flex-direction:column;gap:5px;padding:8px}
.burger span{width:24px;height:2px;background:var(--ink);border-radius:2px;transition:.25s}

/* ============================================================
   HERO
   ============================================================ */
.hero{position:relative;padding:clamp(3rem,7vw,5.5rem) 0 clamp(3.5rem,7vw,6rem);overflow:hidden}
.hero::before{content:"";position:absolute;top:-28%;right:-8%;width:640px;height:640px;border-radius:50%;
  background:radial-gradient(circle,rgba(246,210,91,.42) 0%,rgba(246,210,91,.14) 42%,transparent 68%);
  z-index:0;animation:sunbreathe 9s ease-in-out infinite}
@keyframes sunbreathe{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,4rem);align-items:center}
.hero h1 span{color:var(--sun-deep)}
.hero .lede{font-size:1.18rem;margin:1.4rem 0 2rem;max-width:34ch}
.hero-actions{display:flex;flex-wrap:wrap;gap:.9rem;margin-bottom:2rem}
.hero-trust{display:flex;align-items:center;gap:1.1rem;flex-wrap:wrap;font-size:.82rem;font-weight:700;color:var(--ink-soft)}
.hero-trust .press{display:flex;gap:.5rem;flex-wrap:wrap}
.hero-trust .press b{background:var(--white);border:1px solid var(--line);padding:.3rem .7rem;border-radius:999px;font-size:.72rem;letter-spacing:.02em;color:var(--ink);box-shadow:var(--shadow-sm)}

.hero-media{position:relative}
.hero-media .photo{border-radius:26px;box-shadow:var(--shadow-lg);aspect-ratio:4/5;object-fit:cover;width:100%;display:block;background:var(--mint)}
.hero-media .badge{position:absolute;background:var(--white);border-radius:16px;box-shadow:var(--shadow-md);padding:.8rem 1rem;display:flex;align-items:center;gap:.6rem;font-weight:800;font-size:.9rem}
.hero-media .badge .dot{width:34px;height:34px;border-radius:50%;background:var(--blush);display:grid;place-items:center;font-size:1.1rem}
.hero-media .badge.b1{top:20px;left:-22px}
.hero-media .badge.b2{bottom:96px;right:-24px}
/* hero video play button */
.play-hero{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);display:inline-flex;align-items:center;gap:.6rem;
  background:rgba(32,72,80,.82);color:#fff;padding:.6rem 1.1rem .6rem .7rem;border-radius:999px;font-weight:800;font-size:.85rem;backdrop-filter:blur(4px);border:none;cursor:pointer;transition:.2s}
.play-hero:hover{background:var(--ink)}
.play-hero .tri{width:30px;height:30px;border-radius:50%;background:var(--sun);display:grid;place-items:center;color:var(--ink);font-size:.8rem}

/* ============================================================
   PRESS STRIP
   ============================================================ */
.press-strip{background:var(--ink);color:#e9e2d5;padding:1.5rem 0}
.press-strip .wrap{display:flex;align-items:center;gap:2rem;flex-wrap:wrap;justify-content:center}
.press-strip .label{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;font-weight:800;color:var(--sun)}
.press-strip .logos{display:flex;gap:2rem;flex-wrap:wrap;align-items:center;justify-content:center}
.press-strip .logos span{font-family:var(--display);font-size:1.15rem;font-weight:600;opacity:.9}

/* ============================================================
   SECTION SHELL
   ============================================================ */
section{padding:clamp(3.5rem,7vw,6rem) 0}
.section-head{max-width:640px;margin-bottom:2.6rem}
.section-head.center{margin-inline:auto;text-align:center}
.section-head p{margin-top:.9rem;font-size:1.05rem}
.sun-divider{width:100%;height:34px;background:
  radial-gradient(circle at 50% 100%,var(--sun) 0 8px,transparent 9px) 0 0/44px 34px repeat-x;
  opacity:.35}

/* ---------- Problem / empathy ---------- */
.problem{background:linear-gradient(180deg,var(--cream),#fff)}
.two-symptoms{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;margin-top:1rem}
/* GoHighLevel/LeadConnector form embed on the contact page -- the iframe
   ships with an inline height (data-height) from the form builder itself,
   this just gives it a card frame that matches the rest of the site. */
.form-embed{max-width:640px;margin:0 auto;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:1.6rem;box-shadow:var(--shadow-sm)}
.form-embed iframe{width:100%;border:none;display:block}
.symptom-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:1.8rem;box-shadow:var(--shadow-sm)}
.symptom-card h3{display:flex;align-items:center;gap:.6rem;margin-bottom:1rem}
.symptom-card h3 .ic{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-size:1.2rem}
.symptom-card.kids h3 .ic{background:var(--blush)}
.symptom-card.moms h3 .ic{background:#dff0ee}
.chips{display:flex;flex-wrap:wrap;gap:.5rem}
.chips span{background:var(--cream);border:1px solid var(--line);border-radius:999px;padding:.4rem .85rem;font-size:.85rem;font-weight:600;color:var(--ink)}
.problem-note{margin-top:1.8rem;font-size:1.1rem;font-family:var(--display);color:var(--ink);max-width:52ch}

/* ---------- Services ---------- */
.services{background:var(--white)}
.cards-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.svc{border:1px solid var(--line);border-radius:var(--radius);padding:2rem 1.7rem;background:var(--cream);transition:transform .22s ease, box-shadow .22s ease;position:relative;overflow:hidden}
.svc:hover{transform:translateY(-6px);box-shadow:var(--shadow-md)}
.svc .ic{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;font-size:1.6rem;margin-bottom:1.1rem;background:var(--white);box-shadow:var(--shadow-sm)}
.svc h3{margin-bottom:.6rem}
.svc p{font-size:.96rem}
.svc .more{margin-top:1.1rem;font-weight:800;font-size:.9rem;color:var(--coral-deep);display:inline-flex;gap:.35rem}
.svc::after{content:"";position:absolute;top:0;left:0;height:4px;width:100%;background:var(--sun);transform:scaleX(0);transform-origin:left;transition:transform .25s ease}
.svc:hover::after{transform:scaleX(1)}
.svc.nutrition .ic{background:#eaf1e9}

/* ---------- Method (numbered — a real sequence) ---------- */
.method{background:linear-gradient(180deg,#fff,var(--cream))}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;margin-top:1rem;counter-reset:step}
.step{background:var(--white);border-radius:var(--radius);padding:2rem 1.6rem;border:1px solid var(--line);position:relative;box-shadow:var(--shadow-sm)}
.step .num{font-family:var(--display);font-size:2.4rem;color:var(--coral);font-weight:700;line-height:1}
.step h3{margin:.5rem 0 .7rem}
.step p{font-size:.95rem}
.step ul{margin:.8rem 0 0;padding-left:1.1rem}
.step li{font-size:.9rem;color:var(--ink-soft);margin-bottom:.3rem}

/* ============================================================
   VIDEO SECTION  (client priority)
   ============================================================ */
.video{background:var(--ink);color:#f3ede1}
.video .section-head h2,.video .section-head p{color:#f3ede1}
.video .section-head p{opacity:.8}
.video-feature{display:grid;grid-template-columns:1.4fr .9fr;gap:2rem;align-items:center;margin-bottom:2.4rem}
.player{position:relative;border-radius:20px;overflow:hidden;box-shadow:var(--shadow-lg);aspect-ratio:16/9;background:#000;cursor:pointer}
.player img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.player:hover img{transform:scale(1.04)}
.player .pbtn{position:absolute;inset:0;display:grid;place-items:center}
.player .pbtn i{width:76px;height:76px;border-radius:50%;background:var(--sun);display:grid;place-items:center;color:var(--ink);font-size:1.5rem;box-shadow:0 10px 30px rgba(0,0,0,.4);transition:.2s}
.player:hover .pbtn i{transform:scale(1.08)}
.player .cap{position:absolute;left:0;bottom:0;right:0;padding:1.4rem;background:linear-gradient(0deg,rgba(0,0,0,.7),transparent);font-weight:700;font-size:.95rem}
.video-feature .fcopy h3{color:#fff;margin-bottom:.8rem}
.video-feature .fcopy p{color:#cfc7b8;font-size:.98rem}
.video-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.vcard{position:relative;border-radius:16px;overflow:hidden;aspect-ratio:16/10;cursor:pointer;display:block;
  background:linear-gradient(135deg,var(--sky),var(--sage))}
.vcard:nth-child(2){background:linear-gradient(135deg,var(--sun),var(--coral))}
.vcard:nth-child(3){background:linear-gradient(135deg,var(--coral),var(--sky))}
.vcard .vc-inner{position:absolute;inset:0;padding:1.1rem;display:flex;flex-direction:column;justify-content:space-between;color:#fff}
.vcard .vc-play{width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.22);display:grid;place-items:center;backdrop-filter:blur(2px)}
.vcard h4{font-family:var(--display);font-size:1.05rem;color:#fff;font-weight:600}
.vcard .vtag{font-size:.7rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;opacity:.85}
.vcard:hover .vc-play{background:rgba(255,255,255,.35)}
.video-note{margin-top:1.6rem;font-size:.82rem;color:#9a9284;text-align:center}

/* ---------- Testimonials ---------- */
.testi{background:var(--white)}
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.quote{background:var(--cream);border-radius:var(--radius);padding:2rem 1.7rem;border:1px solid var(--line);position:relative}
.quote .stars{color:var(--sun);letter-spacing:2px;margin-bottom:.8rem}
.quote p{color:var(--ink);font-size:1rem;font-style:italic}
.quote .who{margin-top:1.2rem;font-weight:800;font-size:.9rem;color:var(--ink-soft)}
.quote .who span{color:var(--sky)}

/* ---------- Team ---------- */
.team{background:linear-gradient(180deg,var(--cream),#fff)}
.team-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem}
.member{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm);display:grid;grid-template-columns:150px 1fr}
.member img{height:100%;width:150px;object-fit:cover}
.member .m-body{padding:1.5rem}
.member .role{font-size:.72rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--sun-deep)}
.member h3{margin:.2rem 0 .5rem}
.member p{font-size:.9rem}

/* ---------- Getting started ---------- */
.start{background:var(--white)}
.start-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.start .step .num{color:var(--sky)}

/* ---------- Community CTA band ---------- */
.band{background:linear-gradient(120deg,var(--sun),var(--coral));color:var(--ink);border-radius:26px;padding:clamp(2.2rem,5vw,3.4rem);text-align:center;box-shadow:var(--shadow-md)}
.band h2{color:var(--ink);max-width:20ch;margin:0 auto 1rem}
.band p{color:var(--ink);max-width:52ch;margin:0 auto 1.6rem;font-weight:600}

/* ---------- Location ---------- */
.location{background:linear-gradient(180deg,#fff,var(--cream))}
.loc-grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:stretch}
.loc-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:2rem;box-shadow:var(--shadow-sm)}
.loc-card h3{margin-bottom:1rem}
.loc-row{display:flex;gap:.8rem;padding:.7rem 0;border-bottom:1px dashed var(--line);align-items:flex-start}
.loc-row:last-child{border:none}
.loc-row .ic{font-size:1.1rem}
.loc-row b{display:block;color:var(--ink)}
.map-wrap{border-radius:var(--radius);overflow:hidden;min-height:340px;border:1px solid var(--line);box-shadow:var(--shadow-sm)}
.map-wrap iframe{width:100%;height:100%;min-height:340px;border:0;display:block}

/* ============================================================
   FOOTER
   ============================================================ */
footer{background:var(--ink);color:#c9c1b3;padding:3.5rem 0 2rem}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:2rem}
footer h4{color:#fff;font-family:var(--body);font-weight:800;font-size:.9rem;letter-spacing:.06em;text-transform:uppercase;margin-bottom:1rem}
footer a{color:#c9c1b3;display:block;padding:.25rem 0;font-size:.92rem}
footer a:hover{color:var(--sun)}
.foot-brand p{color:#a49c8d;font-size:.9rem;margin-top:.8rem;max-width:34ch}
.socials{display:flex;gap:.6rem;margin-top:1rem}
.socials a{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.08);display:grid;place-items:center;color:#fff;padding:0}
.socials a:hover{background:var(--sun);color:var(--ink)}
.socials svg{width:18px;height:18px;display:block}
.verse{text-align:center;font-family:var(--display);font-style:italic;color:#8f8779;margin-top:2.6rem;padding-top:1.6rem;border-top:1px solid rgba(255,255,255,.08);font-size:.95rem}
.copyright{text-align:center;color:#6f685c;font-size:.8rem;margin-top:1rem}
/* Footer map + credit line. Uses the theme palette, not the standalone
   component's own :root vars, so it stays in step with the rest of the site. */
.foot-map{border-radius:12px;overflow:hidden;line-height:0;border:1px solid rgba(255,255,255,.14);margin-bottom:2.25rem}
.foot-map iframe{filter:grayscale(.15) contrast(1.05);display:block;width:100%;border:0}
.foot-map p{margin:0;padding:.75rem 1rem;background:rgba(255,255,255,.05);line-height:1.4}
.foot-map p a{font-size:.88rem;font-weight:600;text-decoration:underline;color:var(--sun)}
.visit-address a{display:block;color:rgba(255,255,255,.75);text-decoration:none;font-size:.92rem;line-height:1.4;padding:.4rem 0}
.visit-address a:hover{color:var(--sun)}
/* The niche-doubled credit line ("X Website and X Marketing with...") is
   noticeably longer than a plain "Made with..." credit and wraps by default
   on anything narrower than ~1150px. white-space:nowrap plus a fluid
   font-size keeps it one line at every viewport instead of just desktop. */
.credit{text-align:center;margin-top:.5rem;font-size:clamp(.56rem,2vw,.82rem);color:#6f685c;white-space:nowrap}
/* `footer a{display:block}` (for the stacked Care/Explore/Visit columns)
   also matches this link and forces it onto its own line no matter what
   white-space:nowrap says on the parent -- block-level boxes always start a
   new line regardless of white-space, which only governs text wrapping
   within a line. Override back to inline so it flows with the sentence. */
.credit a{display:inline;text-decoration:underline;font-weight:600;color:rgba(255,255,255,.8)}
.credit a:hover{color:var(--sun)}

/* ============================================================
   VIDEO MODAL
   ============================================================ */
.modal{position:fixed;inset:0;background:rgba(20,18,15,.86);display:none;place-items:center;z-index:2000;padding:24px;backdrop-filter:blur(4px)}
.modal.open{display:grid}
.modal-inner{width:min(920px,100%);aspect-ratio:16/9;position:relative}
.modal-inner iframe{width:100%;height:100%;border:0;border-radius:16px}
.modal-close{position:absolute;top:-46px;right:0;background:none;border:none;color:#fff;font-size:1.8rem;cursor:pointer;font-family:var(--body)}

/* ============================================================
   REVEAL ANIMATION
   ============================================================ */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .6s ease, transform .6s ease}
.reveal.in{opacity:1;transform:none}

/* ============================================================
   RESPONSIVE
   ============================================================ */
/* Nav switches to the hamburger drawer on its own threshold, separate from the
   page-grid breakpoint below: 8 top-level items + 2 CTAs plus a logo that must
   never shrink (see .brand flex-shrink:0 above) no longer fit a "desktop" row
   until roughly 1180px, well above the 960px grids reflow at. */
@media(max-width:1400px){
  .nav-links,.nav-cta .btn-ghost{display:none}
  .burger{display:flex}
  .mobile-open{display:flex !important;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:var(--cream);border-bottom:1px solid var(--line);padding:1rem 24px 1.4rem;gap:.4rem;box-shadow:var(--shadow-md)}
  .mobile-open > li > a,.mobile-open > li > details > summary{padding:.8rem 0;border-bottom:1px solid var(--line)}
  /* Mobile: the floating panels become inline accordions in the drawer */
  .mobile-open .dropdown,.mobile-open .megamenu{position:static;transform:none;width:100%;min-width:0;margin-left:.6rem;background:none;border:none;border-left:2px solid var(--line);border-radius:0;box-shadow:none;padding:.4rem 0 .4rem .8rem}
  .mobile-open .mega-grid{grid-template-columns:1fr;gap:1rem}
  .mobile-open .mega-foot{margin-top:.8rem;padding-top:.8rem}
}
@media(max-width:960px){
  .hero-grid,.video-feature,.team-grid,.loc-grid{grid-template-columns:1fr}
  .hero-media{order:-1;max-width:420px;margin:0 auto}
  .cards-3,.steps,.start-grid,.testi-grid,.video-grid,.two-symptoms,.check-grid{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr 1fr}
  .hero-media .badge{display:none}
}
@media(max-width:560px){
  .foot-grid{grid-template-columns:1fr}
  .topbar .tb-hours{display:none}
  .member{grid-template-columns:1fr}
  .member img{width:100%;height:220px}
  /* At phone widths the header still has to fit the logo (never shrinks,
     see .brand flex-shrink:0) plus the primary CTA plus the burger -- three
     rigid items that don't have 1400px-breakpoint's room to spread out in. */
  .nav{gap:10px}
  .nav-cta{gap:.35rem}
  .nav-cta .btn-primary{padding:.55rem .7rem;font-size:.72rem}
  .burger{padding:6px}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none !important;scroll-behavior:auto}
  .reveal{opacity:1;transform:none;transition:none}
}

/* ============================================================
   WORDPRESS ADDITIONS — everything above this banner is the
   approved prototype stylesheet, byte-for-byte. Only append here.
   ============================================================ */

/* Admin bar must not hide the sticky header */
body.admin-bar header#header{top:32px}
@media screen and (max-width:782px){body.admin-bar header#header{top:46px}}

/* Menus rendered by wp_nav_menu() reuse the prototype anchor styling */
.nav-links{list-style:none}
footer ul.foot-menu{list-style:none;margin:0;padding:0}
footer ul.foot-menu li{margin:0}

/* Inner-page content shell */
.page-hero{padding:3.2rem 0 1.4rem;background:var(--cream);border-bottom:1px solid var(--line)}
.page-hero h1{margin:.2rem 0 .6rem}
.page-hero p{max-width:62ch;color:var(--ink-soft)}
.content{padding:2.6rem 0 3.4rem}
.content .prose{max-width:74ch}
.prose h2{margin:2rem 0 .6rem}
.prose h3{margin:1.5rem 0 .5rem}
.prose p,.prose li{color:var(--ink-soft);line-height:1.75}
.prose ul,.prose ol{margin:0 0 1.1rem 1.2rem}
.prose li{margin:.35rem 0}
.prose a{color:var(--sky);text-decoration:underline;text-underline-offset:3px}
.prose blockquote{margin:1.4rem 0;padding:1rem 1.2rem;border-left:4px solid var(--sun);background:var(--cream);border-radius:0 var(--radius) var(--radius) 0}
.prose img{border-radius:var(--radius)}
.prose figure{margin:1.4rem 0}
.prose figcaption{font-size:.85rem;color:var(--ink-soft)}
.prose table{width:100%;border-collapse:collapse;margin:1.2rem 0}
.prose th,.prose td{border:1px solid var(--line);padding:.55rem .7rem;text-align:left}

/* Gutenberg gutters + wide alignments */
.prose>*{margin-left:auto;margin-right:auto}
.alignwide{max-width:min(100%,calc(var(--wrap) - 4rem))}
.alignfull{max-width:none;width:100%}
.alignleft{float:left;margin:.3rem 1.2rem 1rem 0}
.alignright{float:right;margin:.3rem 0 1rem 1.2rem}
.aligncenter{display:block;margin-left:auto;margin-right:auto}
.wp-caption{max-width:100%}
.wp-block-image,.wp-block-embed,.wp-block-quote,.wp-block-table{margin:1.4rem 0}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
.skip-link:focus{position:static;width:auto;height:auto;clip:auto;padding:.6rem 1rem;background:var(--white)}

/* Breadcrumbs */
.breadcrumbs{font-size:.85rem;color:var(--ink-soft);margin:0 0 .4rem}
.breadcrumbs a{color:var(--ink-soft);text-decoration:none}
.breadcrumbs a:hover{color:var(--sky)}
.breadcrumbs .sep{margin:0 .4rem;opacity:.6}

/* Post / archive lists reuse the .svc card */
.post-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.4rem}
.post-card h2{font-size:1.25rem;margin:.2rem 0 .5rem}
.post-card .meta{font-size:.8rem;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.08em}
.post-card img{width:100%;height:180px;object-fit:cover;border-radius:calc(var(--radius) - 6px);margin-bottom:.8rem}

/* Pagination */
.pagination{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center;margin-top:2rem}
.pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:2.4rem;height:2.4rem;padding:0 .6rem;border:1px solid var(--line);border-radius:999px;background:var(--white);color:var(--ink);text-decoration:none;font-weight:700}
.pagination .page-numbers:hover{border-color:var(--sun)}
.pagination .page-numbers.current{background:var(--sun);border-color:var(--sun-deep)}

/* FAQ / red flags / disclaimer blocks used by the service + condition templates */
.faq{margin:2rem 0}
.faq details{border:1px solid var(--line);border-radius:var(--radius);background:var(--white);padding:.9rem 1.1rem;margin:.6rem 0}
.faq details[open]{box-shadow:var(--shadow-sm)}
.faq summary{cursor:pointer;font-family:var(--display);font-weight:600;color:var(--ink)}
.faq summary::-webkit-details-marker{display:none}
/* Authored sections ship as .sec-card groups (scripts/wp_import.py render_blocks)
   so a page reads as a stack of panels, not one continuous column of prose. */
.prose .sec-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:1.7rem 1.8rem;margin:0 0 1.3rem;box-shadow:var(--shadow-sm)}
.prose .sec-card>*:first-child{margin-top:0}
.prose .sec-card>*:last-child{margin-bottom:0}
.prose .sec-card h2{font-size:1.32rem;margin:0 0 .7rem;color:var(--ink)}
.prose .sec-card h3{font-size:1.08rem;margin:1.1rem 0 .5rem}
.prose .sec-card p{margin:0 0 .85rem}
.prose .sec-card ul{list-style:none;margin:.2rem 0 0;padding:0}
.prose .sec-card li{position:relative;padding-left:1.6rem;margin:.5rem 0;color:var(--ink-soft);line-height:1.6}
.prose .sec-card li::before{content:"";position:absolute;left:.35rem;top:.62em;width:6px;height:6px;border-radius:50%;background:var(--sun)}
.prose .sec-card strong{color:var(--ink)}
/* Wider viewports: panels sit two-up so the page scans like a service page. */
@media(min-width:900px){
  .content .prose{max-width:none}
  .prose{display:grid;grid-template-columns:1fr 1fr;gap:1.3rem;align-items:start}
  .prose>*{grid-column:1/-1;max-width:74ch}
  .prose>.sec-card{grid-column:auto;max-width:none;margin:0}
}
.review-cta{margin:2rem 0 0;padding:1.6rem 1.8rem;background:var(--cream);border:1px solid var(--line);border-radius:var(--radius);text-align:center}
.review-cta h2{margin:0 0 .5rem}
.review-cta p{margin:0 0 1rem;color:var(--ink-soft)}
.check-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;margin:1.6rem 0}
.checklist{list-style:none;margin:0;padding:0}
.checklist li{position:relative;padding-left:1.7rem;margin:.45rem 0;color:var(--ink-soft)}
.checklist li::before{content:"✓";position:absolute;left:0;color:var(--sky);font-weight:800}
.redflags{border:1px solid var(--blush);background:#fff6f4;border-radius:var(--radius);padding:1rem 1.2rem;margin:1.6rem 0}
.redflags h3{margin:0 0 .4rem}
.disclaimer{border:1px solid var(--line);background:var(--cream);border-radius:var(--radius);padding:1rem 1.2rem;margin:2rem 0;font-size:.86rem;color:var(--ink-soft)}
.related{margin:2rem 0}
.related ul{list-style:none;display:flex;flex-wrap:wrap;gap:.6rem;margin:0;padding:0}
.related a{display:inline-block;padding:.45rem .9rem;border:1px solid var(--line);border-radius:999px;background:var(--white);color:var(--ink);text-decoration:none;font-size:.9rem;font-weight:600}
.related a:hover{border-color:var(--sun)}

/* Search form */
.searchform{display:flex;gap:.5rem;max-width:420px}
.searchform input[type=search]{flex:1;padding:.7rem 1rem;border:1px solid var(--line);border-radius:999px;font:inherit;background:var(--white)}

/* Comments */
.comments{margin-top:2.6rem;border-top:1px solid var(--line);padding-top:1.6rem}
.comment-list{list-style:none;margin:0;padding:0}
.comment-list ul.children{list-style:none;margin:0 0 0 1.4rem;padding:0}
.comment-list li.comment{border:1px solid var(--line);border-radius:var(--radius);background:var(--white);padding:1rem 1.2rem;margin:.8rem 0}
.comment-list .comment-meta{font-size:.8rem;color:var(--ink-soft);margin-bottom:.4rem}
.comment-list .avatar{border-radius:50%;vertical-align:middle;margin-right:.5rem}
.comment-respond input[type=text],.comment-respond input[type=email],.comment-respond input[type=url],.comment-respond textarea{width:100%;max-width:520px;padding:.6rem .8rem;border:1px solid var(--line);border-radius:12px;font:inherit;background:var(--white)}
.comment-respond .submit{cursor:pointer}

/* 404 / empty states */
.notfound{text-align:center;padding:4rem 0}
.notfound .btn{margin:.3rem}

/* ============================================================
   HUB INDEX  (/services/, /conditions/)
   Reuses .svc cards; adds grouping, a jump nav, and the
   anchor-as-card treatment the prototype never needed.
   ============================================================ */
.hub-jump{margin:2.2rem 0 .5rem;padding:1rem 1.2rem;background:var(--cream);border:1px solid var(--line);border-radius:var(--radius)}
.hub-jump ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem .9rem}
.hub-jump a{font-weight:700;font-size:.92rem;color:var(--ink-soft);text-decoration:none;padding:.35rem .8rem;border-radius:999px;background:var(--white);border:1px solid var(--line);transition:color .2s ease,border-color .2s ease}
.hub-jump a:hover,.hub-jump a:focus-visible{color:var(--coral-deep);border-color:var(--coral)}

.hub-group{margin-top:3.2rem;scroll-margin-top:6rem} /* clears the sticky header on anchor jumps */
.hub-group>h2{margin-bottom:.5rem}
.hub-group .group-intro{color:var(--ink-soft);max-width:60ch;margin-bottom:.4rem}
.hub-group .group-parent{font-size:.9rem;margin-bottom:1.4rem}
.hub-group .group-parent a{color:var(--coral-deep);font-weight:700}
.hub-group .cards-3{margin-top:1.2rem}

a.hub-card{display:block;color:inherit;text-decoration:none}
a.hub-card h3{color:var(--ink)}
a.hub-card:focus-visible{outline:3px solid var(--coral);outline-offset:3px}

@media (max-width:640px){
  .hub-group{margin-top:2.4rem}
  .hub-jump{padding:.8rem}
}


/* PRODUCT + EVENT ------------------------------------------------- */
.product-price{font-family:var(--font-display,inherit);font-size:1.9rem;font-weight:700;color:var(--coral);margin:.6rem 0 .2rem}
.product-sizes{list-style:none;display:flex;flex-wrap:wrap;gap:.5rem;padding:0;margin:.8rem 0 1.4rem}
.product-sizes li{border:1px solid var(--line,#ddd);border-radius:999px;padding:.32rem .9rem;font-size:.9rem;background:#fff}
.event-meta{display:grid;grid-template-columns:auto 1fr;gap:.35rem 1.1rem;margin:1.1rem 0 1.2rem;max-width:46rem}
.event-meta dt{font-weight:700;font-size:.86rem;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-soft,#666)}
.event-meta dd{margin:0}
.event-past-note{background:var(--cream,#faf6f0);border-left:4px solid var(--sage,#9bb0a0);padding:.9rem 1.1rem;border-radius:.4rem;margin:0 0 1.4rem;max-width:46rem}

@media (max-width:640px){
  .event-meta{grid-template-columns:1fr;gap:.1rem 0}
  .event-meta dd{margin-bottom:.6rem}
}


/* ===================================================================
   Team + profile page styles.
   Lifted from the authored page exports (morepages_add/*.html), which
   shipped them as inline <style> blocks. They live here so the markup in
   `custom_html` is not the only thing holding the design together.
   =================================================================== */

/* --- sunlife-team-inline-css --- */
/* Display type: Lora (Fraunces is never used on this build) */
h1, h2, h3, .band h2, .brand, .glance h2 { font-family: 'Lora', Georgia, 'Times New Roman', serif; }

/* ---------- Hero answer box ---------- */
.glance{margin:28px 0 8px;padding:22px 24px;border:1px solid #F0E2C8;border-left:5px solid #F2B233;
  border-radius:14px;background:#FFFBF2;max-width:760px}
.glance h2{font-size:1.05rem;margin:0 0 10px;letter-spacing:.01em}
.glance p{margin:0 0 10px;font-size:1rem;line-height:1.65}
.glance ul{margin:0;padding-left:20px}
.glance li{margin:4px 0;line-height:1.55}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:22px}

/* ---------- Shared card chrome ---------- */
.tm-card{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid #EDE5D7;
  border-radius:18px;overflow:hidden;box-shadow:0 10px 28px rgba(31,92,99,.07);
  transition:transform .22s ease, box-shadow .22s ease}
.tm-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(31,92,99,.12)}
.tm-photo{display:block;position:relative;overflow:hidden;background:#F3EEE4}
.tm-photo img{width:100%;height:100%;display:block;object-fit:cover;object-position:50% 22%}
.tm-body{padding:24px 26px 26px;display:flex;flex-direction:column;flex:1}
.tm-role{font-size:.74rem;font-weight:800;letter-spacing:.11em;text-transform:uppercase;
  color:#C58A15;margin:0 0 8px}
.tm-card h3{margin:0 0 4px;font-size:1.35rem;line-height:1.25}
.staff-grid .tm-card h3{font-size:1.12rem;line-height:1.3}
.tm-sub{margin:0 0 12px;font-size:.9rem;color:#6B6257;font-style:italic}
.tm-creds{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 14px;padding:0;list-style:none}
.tm-creds li{font-size:.72rem;line-height:1;letter-spacing:.02em;text-transform:uppercase;
  font-weight:700;color:#1F5C63;background:#EAF5F6;border:1px solid #CFE7E9;
  border-radius:999px;padding:6px 10px}
.tm-body p{margin:0 0 16px;line-height:1.68;font-size:.99rem}
.tm-actions{margin-top:auto;padding-top:16px;border-top:1px solid #F1EADD;
  display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.tm-link{display:inline-flex;align-items:center;gap:7px;font-weight:700;font-size:.95rem;
  text-decoration:none;color:#1F5C63}
.tm-link:hover{color:#124146;text-decoration:underline}
.tm-link .arw{transition:transform .18s ease}
.tm-link:hover .arw{transform:translateX(3px)}
.tm-actions .btn{margin:0}
/* whole card is clickable via one link, so screen readers hear it once */
.tm-link::after{content:"";position:absolute;inset:0;z-index:1;border-radius:18px}
.tm-body p a, .tm-actions .btn{position:relative;z-index:2}
.tm-card:focus-within{outline:3px solid #6FBEC2;outline-offset:3px}

/* ---------- Featured doctor cards (2-up) ---------- */
.doctors-feature{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px;margin:0}
.doctors-feature .tm-photo{aspect-ratio:4/5}
.doctors-feature .tm-body{padding:28px 30px 30px}
.doctors-feature h3{font-size:1.5rem}
@media (max-width:900px){.doctors-feature{grid-template-columns:1fr;gap:24px}
  .doctors-feature .tm-photo{aspect-ratio:1/1}}

/* ---------- Support team cards (grid) ---------- */
.staff-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:24px;margin:0}
.staff-grid .tm-photo{aspect-ratio:1/1}
.staff-grid .tm-body{padding:20px 22px 22px}
.team-subhead{margin:64px 0 26px}

/* ---------- Doctor comparison table ---------- */
.doc-compare{margin:0;overflow-x:auto;-webkit-overflow-scrolling:touch}
.doc-compare table{width:100%;border-collapse:collapse;font-size:.97rem;min-width:640px;background:#fff}
.doc-compare caption{text-align:left;font-size:.9rem;color:#6B6257;padding:0 0 12px}
.doc-compare th,.doc-compare td{padding:14px 16px;border:1px solid #EDE5D7;vertical-align:top;line-height:1.55}
.doc-compare thead th{background:#1F5C63;color:#fff;font-size:.95rem;text-align:left}
.doc-compare tbody th{background:#FBF7EF;font-weight:700;width:22%;text-align:left}
.doc-compare tbody tr:nth-child(even) td{background:#FDFCF9}
@media (max-width:640px){.doc-compare table{font-size:.92rem}}

/* ---------- NAP, disclaimer, footer credit ---------- */
.bio-actions{display:flex;flex-wrap:wrap;gap:14px;margin:18px 0 0;align-items:center}
.bio-actions .btn{margin:0}
.nap{list-style:none;padding:0;margin:14px 0 0}
.nap li{margin:6px 0}
.nap a{font-weight:600}
.disclaimer{margin:26px auto 0;max-width:820px;font-size:.85rem;line-height:1.6;color:#6B6257}
.foot-credit{margin:14px 0 0;font-size:.85rem;text-align:center}
.foot-credit a{color:inherit;text-decoration:none;opacity:.85}
.foot-credit a:hover{text-decoration:underline;opacity:1}

/* --- sunlife-profile-inline-css --- */
/* ---------- Profile hero ---------- */
.pf-head{display:grid;grid-template-columns:minmax(0,330px) minmax(0,1fr);gap:38px;align-items:start;margin-top:8px}
@media (max-width:860px){.pf-head{grid-template-columns:1fr;gap:24px}}
.pf-photo{border-radius:20px;overflow:hidden;background:#F3EEE4;aspect-ratio:4/5;
  box-shadow:0 14px 34px rgba(31,92,99,.10)}
.pf-photo img{width:100%;height:100%;display:block;object-fit:cover;object-position:50% 20%}
.pf-intro h1{margin:8px 0 14px;font-size:clamp(1.9rem,4vw,2.6rem);line-height:1.15}
.pf-intro .lede{margin:0 0 16px}
.pf-intro .tm-creds{margin:0 0 18px}
@media (max-width:860px){.pf-photo{aspect-ratio:1/1;max-width:420px}}

/* ---------- Quick facts table ---------- */
.facts{margin:0;display:grid;grid-template-columns:190px minmax(0,1fr)}
.facts dt{font-weight:700;font-size:.92rem;padding:13px 14px;background:#FBF7EF;border-top:1px solid #EDE5D7}
.facts dd{margin:0;font-size:.97rem;line-height:1.62;padding:13px 16px;border-top:1px solid #EDE5D7}
.facts dt:first-of-type,.facts dd:first-of-type{border-top:0}
@media (max-width:640px){
  .facts{grid-template-columns:1fr}
  .facts dt{border-top:1px solid #EDE5D7;padding-bottom:4px;background:transparent}
  .facts dd{border-top:0;padding-top:0}
}

/* ---------- Focus areas ---------- */
.focus-list{list-style:none;padding:0;margin:0;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(235px,1fr));gap:14px}
.focus-list li{border:1px solid #EDE5D7;border-radius:14px;padding:16px 18px;background:#fff}
.focus-list a{font-weight:700;text-decoration:none;font-size:1.02rem}
.focus-list a:hover{text-decoration:underline}
.focus-list p{margin:6px 0 0;font-size:.92rem;line-height:1.55;color:#5C5449}

/* ---------- Rest of the team strip ---------- */
.others-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:18px}
.o-card{display:block;text-decoration:none;text-align:center}
.o-card img{width:100%;aspect-ratio:1/1;object-fit:cover;object-position:50% 20%;
  border-radius:14px;display:block;margin-bottom:10px;
  transition:transform .2s ease,box-shadow .2s ease}
.o-card:hover img{transform:translateY(-3px);box-shadow:0 12px 26px rgba(31,92,99,.14)}
.o-name{display:block;font-weight:700;font-size:.96rem;line-height:1.3}
.o-role{display:block;font-size:.79rem;color:#6B6257;margin-top:3px;line-height:1.3}

/* Accordion bodies sit flush with their <summary>. The generic .prose rules centre
   every child in a 74ch column (and lay them out two-up above 900px), which pushed
   FAQ and bio answers far to the right of the question they belong to. */
details > .prose{display:block;max-width:none}
details > .prose > *{margin-left:0;margin-right:0;max-width:74ch}