/* Shared readable type scale. Component breakpoints must not shrink UI text. */
:root{--muted:#67586b;--text-body:19px;--text-control:16px;--text-small:15px;--header-height:108px}
html{scroll-padding-top:calc(var(--header-height) + 20px)}
body{font-size:var(--text-body);line-height:1.7}
.site-header{height:var(--header-height);gap:24px}
.practice-degree,.site-footer .practice-degree{font-size:var(--text-small);line-height:1.3;color:#655569}
.practice-name{font-size:29px}
.practice-description,.site-footer .practice-description{font-size:14px;line-height:1.4;letter-spacing:0;color:#6c5c70}
.desktop-nav{font-size:var(--text-control);gap:22px;line-height:1.45}
.desktop-nav a:last-child{display:block}
.header-booking{font-size:var(--text-control);min-height:48px;padding:14px 20px;gap:16px}
.button{font-size:17px;min-height:48px;line-height:1.5}
.text-link,.faq-list .text-link,.booking-practical>.text-link{font-size:var(--text-control);line-height:1.5;min-height:44px}
.section-kicker,.treatment-content .section-kicker{font-size:var(--text-control);line-height:1.5}
.anatomy-eyebrow,.anatomy-intro>.anatomy-eyebrow{font-size:var(--text-control);line-height:1.5;letter-spacing:.02em;color:#66556b}
.anatomy-summary .anatomy-intro-text,.intro-copy,.treatment-panels p,.concerns-intro>p,
.concern-body,.doctor-story>p:not(.section-kicker):not(.doctor-name),.section-heading>p,
.journey-steps p,.faq-intro,.faq-list details>div,.booking-content>p:not(.section-kicker),
.booking-practical p,dialog p{font-size:var(--text-body);line-height:1.7}
.anatomy-summary .anatomy-intro-text,.intro-copy,.treatment-panels p,.concerns-intro>p,
.concern-body,.doctor-story>p:not(.section-kicker):not(.doctor-name),.section-heading>p,
.journey-steps p,.faq-intro,.faq-list details>div,dialog p{color:var(--muted)}
.anatomy-intro .hero-link{font-size:17px;line-height:1.5;gap:18px}
.anatomy-intro .hero-link>span{width:44px;height:44px;flex-shrink:0}
.anatomy-summary .anatomy-intro-text{max-width:34em}
.quick-paths small{font-size:var(--text-control);line-height:1.55;letter-spacing:0}
.quick-paths a>span:not(.path-number){line-height:1.35}
.quick-paths a{padding-block:30px;align-items:center}

/* Anatomy controls and annotations remain legible at ordinary laptop scale. */
.anatomy-toolbar{gap:20px;min-height:48px;flex-wrap:wrap}
.anatomy-view-actions{gap:20px}
.anatomy-expand,.anatomy-toolbar .animation-toggle{font-size:var(--text-control);line-height:1.5;min-height:44px}
.anatomy-expand svg,.animation-toggle svg{width:19px;height:19px}
.anatomy-panel:not(.is-expanded)>.anatomy-controls,.is-expanded .anatomy-controls{width:min(1060px,100%);max-width:1060px}
.anatomy-panel .region-buttons button{font-size:var(--text-control);line-height:1.4;min-height:52px;padding:10px 12px;white-space:normal;color:#68566d}
.anatomy-panel .layer-legend button{font-size:var(--text-control);line-height:1.45;min-height:44px;padding:8px 12px;color:#68566d}
.anatomy-panel .layer-legend{gap:5px 8px}
.layer-legend i{width:7px;height:7px;flex-shrink:0}
.animation-caption{font-size:var(--text-control);line-height:1.5;color:#67556b}
.animation-indicator{flex-shrink:0}
.needle-replay{font-size:var(--text-control);line-height:1.5;min-height:46px;padding:9px 15px}
.needle-replay svg{width:16px;height:16px}
.needle-label{font-size:var(--text-small);line-height:1.3;padding:5px 7px;color:#433747}
.anatomy-scene .model-status{font-size:var(--text-control);line-height:1.5}
.point-toggle{font-size:17px;line-height:1.5}
.point-summary,.point-select-wrap,.point-help{font-size:var(--text-control);line-height:1.55;color:#67556b}
.point-select-wrap select{font-size:var(--text-control);line-height:1.5;padding:11px 32px 11px 12px;min-height:48px}
.point-select-wrap{flex:1;min-width:0}
.point-toolbar{gap:12px 20px}
.point-title{font-size:20px;line-height:1.5}
.point-reset{font-size:var(--text-control);line-height:1.5}
.point-list button,.is-expanded .point-list button{font-size:var(--text-control);width:44px;min-height:44px}
.point-callouts text{font:15px "Helvetica Neue",Arial,sans-serif}

/* Explanatory illustrations and clinical content use the same hierarchy. */
.treatment-tabs{flex-wrap:wrap;gap:6px 24px}
.treatment-tabs button{font-size:var(--text-control);line-height:1.5;white-space:normal;text-align:left;min-height:48px}
.treatment-panels h3{font-size:26px;line-height:1.3;margin-bottom:20px}
.procedure-header .visual-state{font-size:28px;line-height:1.25}
.procedure-index{font-size:var(--text-small);color:#6e5a72;letter-spacing:.06em}
.procedure-toggle{font-size:var(--text-control);line-height:1.5;gap:9px;min-height:44px;color:#66516c}
.procedure-toggle svg{width:18px;height:18px}
.procedure-caption{font-size:17px;line-height:1.6;color:#66516c}
.procedure-diagram text{font-size:var(--diagram-label-size,22px);letter-spacing:0;fill:#66516c}
.procedure-art{min-height:380px}
.procedure-header{gap:14px}
.concern-list summary>span{font-size:26px;line-height:1.35}
.concern-list summary small{font-size:var(--text-control);line-height:1.55;color:var(--muted)}
.body-caption,.body-point span,.tags span,.fine-print{font-size:var(--text-small);line-height:1.5}
.body-point span{width:32px;height:32px}
.tags{gap:8px}
.tags span{padding:6px 10px}
.doctor-name{font-size:20px;line-height:1.55}
.doctor-photo-caption,.doctor-credentials span{font-size:var(--text-control);line-height:1.55}
.step-number{font-size:var(--text-control)}
.journey-steps h3{font-size:28px;line-height:1.25;letter-spacing:-.025em}
.faq-list summary{font-size:19px;line-height:1.5;gap:20px}
.booking-content>small{font-size:var(--text-control);line-height:1.7;color:#e3d9e5}
.booking-practical strong{font-size:19px;line-height:1.5}
.booking-practical>div>span{font-size:var(--text-control)}
.booking-content .button{font-size:17px}
.site-footer>p,.site-footer>div{font-size:var(--text-control);line-height:1.6}
.site-footer>.anatomy-credit{font-size:var(--text-small)!important;color:#6b5970!important;line-height:1.7}
.site-footer .practice-name{font-size:29px}
dialog{max-width:720px}
dialog h3{font-size:22px;line-height:1.4}

@media(min-width:901px){
 .anatomy-panel.is-expanded{grid-template-columns:minmax(0,1fr) 350px;column-gap:26px}
}
@media(max-width:1100px){
 :root{--header-height:100px}
 .desktop-nav{display:none}
 .menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:6px;width:44px;height:44px;padding:11px;background:transparent;flex-shrink:0}
 .menu-toggle span{width:22px;height:1px;background:currentColor;transition:transform .25s}
 .menu-toggle[aria-expanded=true] span:first-child{transform:translateY(3.5px) rotate(45deg)}
 .menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
 .mobile-nav{position:fixed;inset:var(--header-height) 0 0;z-index:25;padding:32px var(--gutter);overflow:auto;background:var(--paper);display:flex;flex-direction:column;gap:20px}
 .mobile-nav a{font-size:30px;line-height:1.4;padding-block:8px;letter-spacing:-.03em}
 .anatomy-panel .region-buttons{grid-template-columns:repeat(3,minmax(0,1fr))}
 .treatment-content{padding:36px 28px}
 .procedure-header{padding-inline:24px;flex-wrap:wrap}
 .procedure-toggle{align-self:center}
 .journey-steps{gap:30px}
}
@media(max-width:850px){
 .treatment.section{display:grid;grid-template-columns:minmax(0,1fr);gap:0}
 .treatment-content{display:contents}
 .treatment-content>.section-kicker{grid-row:1;margin:36px 28px 16px;padding:0}
 .treatment-content>h2{grid-row:2;margin:0 28px}
 .treatment-content>.treatment-tabs{grid-row:3;margin:24px 28px 0}
 .treatment-visual.procedure-study{grid-row:4;min-height:0;height:500px;margin-top:24px}
 .procedure-art{display:block;min-height:0;padding:0}
 .procedure-diagram{height:100%;max-height:none}
 .treatment-content>.treatment-panels{grid-row:5;padding:32px 28px 0;margin:0}
 .treatment-content>.text-link{grid-row:6;margin:24px 28px 36px;justify-self:start}
 .quick-paths{grid-template-columns:1fr}
 .quick-paths a{padding:22px 0;border-right:0;border-bottom:1px solid var(--line);min-height:0}
 .quick-paths a:last-child{border-bottom:0}
 .quick-paths svg{display:block}
 .introduction{grid-template-columns:1fr;row-gap:24px}
 .intro-copy{max-width:38em}
 .faq,.booking-section{grid-template-columns:1fr;gap:36px}
 .doctor-section{grid-template-columns:1fr}
 .doctor-photo{min-height:550px}
 .doctor-story{padding:42px 28px}
 .journey-steps{grid-template-columns:1fr;gap:38px}
 .journey-steps p{max-width:38em}
 .step-number{margin-bottom:18px}
 .anatomy-panel.is-expanded{overflow-y:auto;overscroll-behavior:contain;padding:16px 20px}
 .is-expanded .anatomy-toolbar{position:sticky;top:0;z-index:8;background:#f2edf0;padding-block:6px;flex-shrink:0}
 .is-expanded .anatomy-controls,.is-expanded .anatomy-playback,.is-expanded .layer-legend{flex-shrink:0}
 .is-expanded .anatomy-scene{flex:1 0 320px;min-height:320px}
 .is-expanded .point-explorer{max-height:none;overflow:visible}
}
@media(max-width:600px){
 :root{--text-body:18px;--header-height:104px;--gutter:24px}
 .site-header{padding-inline:18px;gap:12px}
 .practice-name{font-size:24px}
 .practice-degree{font-size:14px}
 .practice-description{font-size:13px}
 .header-booking{font-size:var(--text-control);min-height:46px;padding:11px 15px}
 .header-booking svg{display:none}
 .mobile-nav{top:var(--header-height)}
 .anatomy-intro .hero-link{font-size:var(--text-control)}
 .anatomy-toolbar>.anatomy-eyebrow{max-width:none}
 .anatomy-toolbar{gap:6px 16px}
 .anatomy-view-actions{margin-left:auto;gap:14px}
 .anatomy-panel .region-buttons button{font-size:var(--text-control);min-height:56px;padding:9px 6px}
 .anatomy-panel .layer-legend button{font-size:var(--text-control);min-height:44px;padding:8px 10px}
 .animation-caption{font-size:var(--text-control)}
 .needle-replay{font-size:var(--text-control)}
 .point-explorer{padding:16px}
 .point-select-wrap{display:block;flex-basis:100%}
 .point-select-wrap>span{display:block;margin-bottom:7px}
 .point-help{font-size:var(--text-control);margin-top:12px}
 .point-summary{font-size:var(--text-control)}
 .point-select-wrap select{max-width:100%;width:100%}
 .point-title{font-size:20px}
 .treatment-content>.treatment-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-inline:24px}
 .treatment-tabs button{font-size:var(--text-control);line-height:1.35;white-space:normal;min-height:58px;align-self:stretch}
 .treatment-content>.section-kicker{font-size:var(--text-control)}
 .treatment-panels h3{font-size:25px}
 .procedure-art{min-height:0}
 .treatment-visual.procedure-study{height:460px}
 .procedure-header .visual-state{font-size:25px}
 .procedure-caption{font-size:17px}
 .procedure-footer{padding-top:18px}
 .concern-list summary>span{font-size:24px}
 .concern-list summary small{font-size:var(--text-control)}
 .doctor-name{font-size:19px}
 .booking-content .button{font-size:17px}
 .site-footer>div{font-size:var(--text-control);gap:18px}
 .site-footer .practice-description{font-size:14px}
 dialog{padding:28px 24px}
 .dialog-heading h2{font-size:30px;line-height:1.15}
}
@media(max-width:380px){
 .anatomy-panel .region-buttons{grid-template-columns:repeat(2,minmax(0,1fr))}
 .treatment-content>.treatment-tabs{display:flex;flex-wrap:wrap;gap:0 20px}
 .treatment-tabs button{font-size:var(--text-control);white-space:nowrap;min-height:48px;overflow-wrap:normal}
 .procedure-header{padding-inline:24px;flex-wrap:nowrap;align-items:flex-start}
 .procedure-header .visual-state{font-size:24px}
 .procedure-toggle span{display:none}
 .procedure-toggle{min-width:44px;justify-content:center}
}
@media(min-width:901px){
 .is-expanded .point-toolbar{gap:10px 12px}
 .is-expanded .point-summary{flex-basis:100%;margin:0}
 .is-expanded .point-select-wrap{flex:0 0 100%;width:100%;margin-top:6px}
 .is-expanded .point-select-wrap select{width:100%;max-width:none}
}