/* Doctor reader — Claude lane. Still, light reader (a named person's page). Avenir Next. No external requests. */
:root{--navy:#2F4453;--steel:#4C7288;--orange:#ED873C;--ink:#203846;--mineral:#F5F7F7;--ink2:#51646F;--line:#DCE6ED;--ease:cubic-bezier(.25,.8,.25,1);--font:"Avenir Next","Avenir",Nunito Sans,system-ui,-apple-system,sans-serif}
*{box-sizing:border-box}
@media (prefers-reduced-motion:reduce){*{transition:none !important}}
body{margin:0;background:#fff;color:var(--navy);font:18px/1.6 var(--font);-webkit-font-smoothing:antialiased}
a{color:var(--steel);font-weight:600}
:focus-visible{outline:3px solid var(--ink);outline-offset:2px}
.wrap{width:min(100% - 48px,1180px);margin-inline:auto}
.narrow{width:min(100% - 48px,760px);margin-inline:auto}
.note{background:var(--mineral);border-bottom:1px solid #F0D9C2;font-size:13px;color:#5A4027;padding:8px 0}
.back{display:flex;flex-wrap:wrap;gap:4px 20px;align-items:center;min-height:48px}
.back a{min-height:48px;display:inline-flex;align-items:center;font-size:14px}
section.doc-head{background:var(--mineral);border-bottom:1px solid var(--line);padding:36px 0 30px}
.head-grid{display:grid;gap:24px;align-items:center}
@media (min-width:760px){.head-grid{grid-template-columns:200px 1fr}}
.portrait{aspect-ratio:4/5;width:100%;max-width:200px;background:#E2E8EB;display:grid;place-items:center;text-align:center;padding:12px;font-size:13px;color:var(--ink);border:1px dashed #B9C6CE}
.eyebrow{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--steel);margin:0 0 8px}
h1{font-size:clamp(28px,2vw + 20px,42px);line-height:1.15;font-weight:600;margin:0 0 8px}
.sub{color:var(--ink2);margin:0}
.facts{list-style:none;margin:28px 0 0;padding:0;border-top:1px solid var(--line)}
.facts li{border-bottom:1px solid var(--line);padding:14px 0;display:grid;grid-template-columns:140px 1fr;gap:12px}
@media (max-width:520px){.facts li{grid-template-columns:1fr;gap:2px}}
.facts dt,.facts .k{font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--steel)}
.bio{margin:32px 0 0}
.bio h2,.src h2,.where h2{font-size:22px;margin:0 0 10px}
.bio p{color:#33444F;margin:0 0 14px}
.src{background:var(--mineral);padding:18px 22px;margin:28px 0 0}
.src h2{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--steel)}
.src ul{list-style:none;margin:0;padding:0}.src li{padding:6px 0;font-size:15px}.src span{color:var(--ink2)}
.where{margin:32px 0 64px}
.where a{display:flex;min-height:48px;align-items:center}
.missing{padding:48px 0;color:var(--ink2)}

/* episode reader links (episode-link.js): exact public match only */
a.eplink{color:var(--steel,#4C7288);font-weight:600;display:inline-flex;align-items:center;min-height:48px}

/* adjacent qualifications (disclosures.js) */
.disc{font-size:14px;color:#51646F;border-left:2px solid #DCE6ED;padding-left:10px;margin:8px 0 12px}

/* quiet contextual back link (the shared header carries global navigation) */
.crumb{display:flex;min-height:48px;align-items:center}
.crumb a{display:inline-flex;align-items:center;min-height:48px;font-size:14px;font-weight:600;color:#4C7288}

/* Structure pass 2026-10-08: page-scoped additions to the shared components (structure-components.css). */
main:focus{outline:none}
section.doc-head{padding:32px 0 24px}
section.doc-head h1{margin-bottom:6px}
.facts{margin:24px 0 0}
.facts>div{border-bottom:1px solid var(--line);padding:14px 0;display:grid;grid-template-columns:140px 1fr;gap:12px;align-items:baseline}
.facts dd{margin:0}
.facts dd a{display:inline-flex;align-items:center;min-height:48px}
@media (max-width:520px){.facts>div{grid-template-columns:1fr;gap:2px}}
.src{background:none;padding:0;margin:32px 0 0}
.src h2{margin:0 0 4px}
.missing-wrap{padding:40px 0 8px}
.dio-cta-band{margin-top:40px}
.dio-cta-band h2{font-size:clamp(24px,2.2vw,32px)}
.all-doctors{margin:0 auto 48px}
.all-doctors a{display:inline-flex;align-items:center;min-height:48px;font-size:16px}
@media (max-width:599px){.narrow{width:min(100% - 32px,760px)}}
@media (max-width:1000px){.all-doctors{margin-bottom:96px}}

/* shared life layer: room for its 42px label line below the label */
.src h2[data-alive-label]{margin-bottom:14px}

/* Template v2 (Daniel 2026-10-12): navy graffiti header, two columns, office photo cards and the episode card in the side column. */
section.doc-head.hero{background:linear-gradient(165deg,#34505F,#2F4453 50%,#22333F);color:#fff;border-bottom:0;padding:44px 0 36px}
section.doc-head.hero h1{color:#fff}
section.doc-head.hero .sub{color:#c9d6dd}
.doc-wrap{width:min(100% - 48px,1180px);margin-inline:auto}
.doc-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:clamp(28px,4vw,56px);align-items:start;padding-top:32px}
.doc-side{display:grid;gap:22px}
.doc-side h2{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:#56737f;margin:0 0 12px}
.doc-side .bta-solo{max-width:none;margin:0}
.contact-office{display:grid;grid-template-columns:112px minmax(0,1fr);gap:14px;align-items:center;padding:10px;margin:0 0 12px;border-radius:14px;background:#f4f6f7;border:1px solid #e3e8eb;text-decoration:none;color:#1c3341}
.contact-office img{width:112px;height:84px;object-fit:cover;border-radius:10px;display:block}
.contact-office b{display:block;font-size:17px;font-weight:600}
.contact-office .co-go{display:block;margin-top:4px;font-size:14px;color:#4C7288;font-weight:600}
@media(max-width:900px){.doc-grid{grid-template-columns:1fr}}
@media(max-width:599px){.doc-wrap{width:min(100% - 32px,1180px)}}
/* 2026-10-12 portraits */
.doc-head.has-portrait .doc-wrap{display:grid;grid-template-columns:minmax(0,1fr) 200px;align-items:center;column-gap:36px}
.doc-head.has-portrait .doc-wrap>:not(.doc-portrait){grid-column:1}
.doc-portrait{grid-column:2;grid-row:1/span 3;margin:0}
.doc-portrait img{display:block;width:200px;aspect-ratio:4/5;height:auto;object-fit:cover;border-radius:10px;box-shadow:0 18px 30px -18px rgba(0,0,0,.6)}
@media(max-width:640px){.doc-head.has-portrait .doc-wrap{grid-template-columns:minmax(0,1fr) 110px;column-gap:18px}.doc-portrait img{width:110px}}
.doc-portrait video{display:block;width:200px;aspect-ratio:4/5;height:auto;object-fit:cover;border-radius:10px;box-shadow:0 18px 30px -18px rgba(0,0,0,.6)}
@media(max-width:640px){.doc-portrait video{width:110px}}
/* 2026-11-11 audit: a doctor with no facts row left a stray hairline (the empty list's top border) above the column */
.facts:empty{display:none}
.facts:empty + .bio{margin-top:0}
/* 2026-11-11 audit: a doctor with no biography and no facts row left the wide column blank (about 1,000px beside the podcast
   cards). With nothing to hold, the column is dropped and the office and podcast cards sit across the page. Layout only. */
.doc-grid:not(:has(.doc-main .bio,.doc-main .facts>div)){grid-template-columns:1fr}
.doc-grid:not(:has(.doc-main .bio,.doc-main .facts>div)) .doc-main{display:none}
@media(min-width:640px){
 .doc-grid:not(:has(.doc-main .bio,.doc-main .facts>div)) .src{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
 .doc-grid:not(:has(.doc-main .bio,.doc-main .facts>div)) .src h2{grid-column:1/-1;margin-bottom:0}
 .doc-grid:not(:has(.doc-main .bio,.doc-main .facts>div)) .doc-offices{max-width:360px}
}
@media(min-width:901px){
 .doc-grid:not(:has(.doc-main .bio,.doc-main .facts>div)) .doc-side{grid-template-columns:360px minmax(0,1fr);gap:clamp(28px,4vw,56px);align-items:start}
 .doc-grid:not(:has(.doc-main .bio,.doc-main .facts>div)) .src{margin-top:0}
}
/* 2026-11-11 audit: stacked podcast cards touched each other (Dr. Laks has four) */
.doc-side .bta-solo + .bta-solo{margin-top:14px}
@media(min-width:640px){.doc-grid:not(:has(.doc-main .bio,.doc-main .facts>div)) .src .bta-solo{margin-top:0}}
/* 2026-11-11 audit: "All doctors" started 260px in at 1280 and 4px left of the page on phones; it now shares the page column.
   Its arrow gets a space and the link drops the underline that ran under the arrow, like "Directions and hours" above it. */
.all-doctors.narrow{width:var(--dio-col,min(100% - 48px,1180px))}
.all-doctors a{display:inline-block;min-height:0;line-height:48px;text-decoration:none}
.all-doctors a:hover{text-decoration:underline;text-underline-offset:3px}
/* 2026-11-11 audit: the name and role sat at the top of the header band while the portrait filled its height; they now sit
   centred against the portrait */
.doc-head.has-portrait .doc-wrap{grid-template-rows:1fr auto auto 1fr}
.doc-head.has-portrait .doc-wrap>h1{grid-row:2}
.doc-head.has-portrait .doc-wrap>.sub{grid-row:3}
.doc-head.has-portrait .doc-portrait{grid-row:1/-1}
/* 2026-11-12 (Daniel, team review: "put all dr photos in the orange frame"): the portrait takes the Home hero's frame, as the Cost and
   Travel headers do (hero-field.css 41-42, home-hero-trust.css 26): the photo cut at two corners, a navy #2f4452 set-off and a 2px
   #ed873c orange line with matching cuts, 14px and 12px out as on Home. Home cuts 58px at a 560px frame; this 200px portrait takes the
   same proportion, 21px (outer cuts +8px and +7px by the 45-degree offset, as on Home). Phones (640px and under, a 110px portrait): Home's
   phone line widths (9px and 7px out) with the cut scaled the same way, 11px, since Home's 34px phone cut would take a third of the photo.
   Rounded corners and the drop shadow are gone, as on Home. The "Portrait needed" placeholder is left as it is. */
.doc-portrait:not(.media-needed){--cut:21px;--ocut:29px;--ncut:28px;--o:14px;--n:12px;position:relative;isolation:isolate}
.doc-portrait:not(.media-needed)::before,.doc-portrait:not(.media-needed)::after{content:'';position:absolute;pointer-events:none}
.doc-portrait:not(.media-needed)::before{inset:calc(var(--o) * -1);background:#ed873c;clip-path:polygon(var(--ocut) 0,100% 0,100% calc(100% - var(--ocut)),calc(100% - var(--ocut)) 100%,0 100%,0 var(--ocut))}
.doc-portrait:not(.media-needed)::after{inset:calc(var(--n) * -1);background:#2f4452;clip-path:polygon(var(--ncut) 0,100% 0,100% calc(100% - var(--ncut)),calc(100% - var(--ncut)) 100%,0 100%,0 var(--ncut))}
.doc-portrait:not(.media-needed)>img,.doc-portrait:not(.media-needed)>video{position:relative;z-index:1;border-radius:0;box-shadow:none;clip-path:polygon(var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut))}
@media(max-width:640px){.doc-portrait:not(.media-needed){--cut:11px;--ocut:16px;--ncut:15px;--o:9px;--n:7px}}