/* CDA typography roles — authoritative type rules, loaded after page layouts.
   Arizona: hero and section headings. Whyte: supporting headings and all reading/UI text.
   Five responsive sizes live in design-system.css; icon glyphs and spatial transforms are not text roles. */
body{font-family:var(--font-body);font-size:var(--type-body);font-weight:var(--weight-body);line-height:var(--leading-body)}
button,input,select,textarea{font-family:var(--font-body)}
body :is(h1,h2,h3,h4,p){font-synthesis:none}
body h1,body h2,body .type-section{font-family:var(--font-display);font-size:var(--type-section);font-weight:var(--weight-heading);line-height:var(--leading-heading);letter-spacing:-.025em}
body h3,body h4,body .type-subtitle{font-family:var(--font-body);font-size:var(--type-subtitle);font-weight:var(--weight-heading);line-height:var(--leading-subtitle);letter-spacing:-.015em}
body .hero-content h1,body .type-hero{font-family:var(--font-display);font-size:var(--type-hero);font-weight:var(--weight-heading);line-height:var(--leading-hero);letter-spacing:-.025em}
body :is(.intro-band h2,.join h2,.about-intro h2,.why h2,.alliance h2,.vision h2,.focus-copy h2,.map-copy h2){font-family:var(--font-display);font-size:var(--type-section);font-weight:var(--weight-heading);line-height:var(--leading-heading);letter-spacing:-.025em}
/* These are statements and supporting titles, not another oversized heading tier. */
body :is(.about-intro h2,.focus-band h2,.priority-card h3,.member-feature h3,.vision-texts h3,.projector-copy h2,.lightbox-bottom h2,.sitemap-list h2){font-family:var(--font-body);font-size:var(--type-subtitle);font-weight:var(--weight-heading);line-height:var(--leading-subtitle);letter-spacing:-.015em}
body :is(.intro-band p,.priority-card p,.section-heading p:not(.eyebrow),.members .section-heading p:not(.eyebrow),.about-intro p:not(.eyebrow),.why-text,.why-text p,.alliance-copy p:not(.eyebrow),.vision-texts p,.focus-copy p:not(.eyebrow),.map-copy p,.join-details,.join-details p,.projector-copy p,.lightbox-bottom p,.sitemap-description,.sitemap-list a),body .type-body{font-family:var(--font-body);font-size:var(--type-body);font-weight:var(--weight-body);line-height:var(--leading-body);letter-spacing:0}
body :is(.eyebrow,.about-intro>.eyebrow,.priorities-heading h2,.section-label),body .type-label{font-family:var(--font-body);font-size:var(--type-small);font-weight:var(--weight-label);line-height:var(--leading-small);letter-spacing:.08em;text-transform:uppercase}
body :is(.button,.join .button,.text-link,.member-feature .text-link,.priority-more,.nav-link,.nav-placeholder,.explore-mode,.explore-exit,.explore-story-link,.explore-sitemap-link,.sitemap-go,.sitemap-close,.sitemap-list-toggle){font-family:var(--font-body);font-size:var(--type-small);font-weight:var(--weight-label);line-height:var(--leading-small);letter-spacing:0}
body :is(.footer-nav,.footer-nav .nav-placeholder,.footer-bottom,.footer-bottom p,.gallery-pagination,.hero-bottom,.hero-video-toggle,.scroll-cue,.sitemap-meta,.sitemap-bottom,.sitemap-bottom>p,.sitemap-bottom>p span,.sitemap-controls,.sitemap-credits,.spoke-number,.explore-bottom,.explore-instructions,.explore-instructions small,.explore-viewpoint,.explore-viewpoint select,.explore-controls>span,.lightbox-controls>span,.zoom-tools output,.projector-enlarge,.lightbox-top,.lightbox-top>p),body .type-small{font-family:var(--font-body);font-size:var(--type-small);font-weight:var(--weight-body);line-height:var(--leading-small);letter-spacing:0}
body .lightbox-top #lightbox-fit{font-family:var(--font-body);font-size:var(--type-small);font-weight:var(--weight-label);line-height:var(--leading-small);letter-spacing:0}
body .sitemap-header h1{font-family:var(--font-body);font-size:var(--type-small);font-weight:var(--weight-label);line-height:var(--leading-small);letter-spacing:.08em}
body .sitemap-spoke{font-family:var(--font-body);font-size:var(--type-section);font-weight:var(--weight-heading)}
/* Keep body text on one scale even inside compact feature layouts. */
body .about-intro p:not(.eyebrow){max-width:60ch;margin-top:24px}
body .vision-texts p{max-width:60ch}
body .priority-card h3{min-height:2.6em}
body .focus-band .shell{align-items:start}
body .focus-band .shell>.eyebrow{padding-top:5px}
/* Explore is a utility page: its page title uses the section tier, not the hero tier. */
body .explore-intro h1{font-size:var(--type-section);font-family:var(--font-display);font-weight:var(--weight-heading);line-height:var(--leading-heading)}
body .explore-intro .eyebrow{font-size:var(--type-small);font-weight:var(--weight-label);line-height:var(--leading-small);letter-spacing:.08em}
@media(min-width:701px){
 .explore-page .explore-scene{min-height:700px}
 .explore-page .explore-projector{top:48px;transform:none}
 .explore-page .explore-viewport{top:115px}
 .explore-page .explore-bottom{min-height:110px}
}
@media(max-width:700px){
 .explore-page .explore-intro{display:block;padding-top:12px}
 .explore-page .explore-intro .eyebrow{max-width:none;margin-bottom:12px}
 .explore-page .explore-intro h1{text-align:left}
 .explore-page .explore-header .explore-mode a,.explore-page .explore-header .explore-mode span{padding-inline:12px}
 .explore-page .lightbox-top>p{max-width:110px}
 .explore-page .lightbox-top{align-items:flex-start}
 .explore-page .lightbox-top-actions{gap:6px}
 .explore-page .lightbox-top #lightbox-fit{max-width:120px;white-space:normal}
 .sitemap-page .sitemap-bottom{gap:12px}
}
/* The 3D map is a separate document, using the same fonts and small-text role. */
body.district-map-page{font-family:var(--font-body);font-size:var(--type-small)}
body.district-map-page :is(.stage-kicker,.small-button,.explore-button,.bearing,.map-tools button,.zoom-value,.map-hint,.map-label,.loading,.fallback p,.no-script){font-family:var(--font-body);font-size:var(--type-small);font-weight:var(--weight-body);line-height:var(--leading-small);letter-spacing:0}
body.district-map-page :is(.stage-kicker,.map-label){font-weight:var(--weight-label)}
body.district-map-page .map-label{padding:6px 8px}
body.district-map-page .map-tools :is(#rotate-left,#reset,#zoom-in,#zoom-out){font-size:24px;line-height:1}
@media(max-width:700px){
 body.district-map-page .map-tools{max-width:calc(100% - 20px);gap:0}
 body.district-map-page .map-tools button{padding-inline:6px}
 body.district-map-page .map-tools :is(#reset,#zoom-in,#zoom-out){padding-inline:6px}
 body.district-map-page .map-tools .tool-divider{margin-inline:2px}
 body.district-map-page .map-hint{font-size:var(--type-small)}
}

/* Supporting credits use the same reading and card-title roles. */
body.credits-page .credit h2{font-family:var(--font-body);font-size:var(--type-subtitle);font-weight:var(--weight-heading);line-height:var(--leading-subtitle)}
body.credits-page .illustrations h2{font-size:var(--type-section)}
body.credits-page .credit p{font-size:var(--type-body);line-height:var(--leading-body)}
body.credits-page header{font-size:var(--type-small);line-height:var(--leading-small)}
body.credits-page .credit>div{min-width:0;overflow-wrap:anywhere}

@media(max-width:700px){
 .explore-page .explore-viewpoint{flex-wrap:wrap;gap:8px 18px;align-items:center}
 .explore-page .explore-viewpoint .explore-tools{position:static;inset:auto;width:auto;gap:4px}
}

/* The two gold bands share a quiet editorial lead and a comfortable reading measure. */
body[data-page="home"] :is(.intro-band,.focus-band){--band-lead-size:clamp(28px,2.4vw,40px);padding-block:clamp(64px,5.6vw,96px)}
body[data-page="home"] .band-copy{max-width:100%}
body[data-page="home"] :is(.intro-band,.focus-band) .band-copy .band-lead{font-family:var(--font-display);font-size:var(--band-lead-size);font-weight:400;line-height:1.2;letter-spacing:-.02em;max-width:33ch;margin:0;text-wrap:pretty}
body[data-page="home"] :is(.intro-band,.focus-band) .band-copy .band-support{font-family:var(--font-body);font-size:var(--type-body);font-weight:var(--weight-body);line-height:1.6;letter-spacing:0;max-width:62ch;margin:24px 0 0;text-wrap:pretty}
body[data-page="home"] .focus-band .button{margin-top:32px}
body[data-page="home"] .focus-band .shell>.eyebrow{padding-top:7px}
@media(max-width:700px){
 body[data-page="home"] :is(.intro-band,.focus-band){padding-block:56px}
 body[data-page="home"] :is(.intro-band,.focus-band) .band-copy .band-lead{max-width:none;line-height:1.22}
 body[data-page="home"] :is(.intro-band,.focus-band) .band-copy .band-support{margin-top:20px;max-width:none}
 body[data-page="home"] .focus-band .shell>.eyebrow{padding-top:0}
 body[data-page="home"] .focus-band .button{margin-top:28px}
}