.type-hero{min-height:610px;display:grid;grid-template-columns:.84fr 1.16fr;overflow:hidden;border-radius:30px;background:var(--black);color:white}
.type-hero-copy{display:flex;flex-direction:column;justify-content:center;padding:70px clamp(38px,5vw,78px)}
.type-hero .hero-eyebrow{color:var(--orange)}
.type-hero h1{margin:0;font-size:clamp(112px,12vw,190px)}
.type-hero-copy>p:last-child{max-width:550px;margin:28px 0 0;color:rgba(255,255,255,.72);font-size:20px;line-height:1.55}
.type-hero-stage{position:relative;display:flex;flex-direction:column;justify-content:center;overflow:hidden;padding:68px;background:var(--orange);color:var(--black)}
.type-hero-stage::before{content:'Aa';position:absolute;right:-35px;bottom:-120px;color:rgba(234,229,217,.18);font:800 440px/.7 var(--display)}
.type-stage-label{position:relative;z-index:1;margin-bottom:22px;font:10px ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:uppercase;letter-spacing:.1em}
.type-hero-stage strong{position:relative;z-index:1;font:800 clamp(88px,9vw,145px)/.76 var(--display)}
.type-hero-stage em{position:absolute;z-index:2;right:7%;top:43%;color:var(--eggshell);font:clamp(42px,4.6vw,72px)/1 var(--script);transform:rotate(-7deg)}
.type-hero-stage p{position:relative;z-index:1;align-self:flex-start;margin:28px 0 0;padding:9px 12px;border-radius:8px;background:var(--black);color:white;font-size:14px;font-weight:700}

.family-section{display:grid;gap:20px}.family-section>.section-heading{margin-bottom:28px}
.family-card{display:grid;grid-template-columns:.72fr 1.28fr;min-height:500px;overflow:hidden;border-radius:26px;background:white}
.family-intro{display:flex;flex-direction:column;padding:38px;background:var(--eggshell)}
.family-intro .font-role{color:var(--muted);font:10px ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:uppercase;letter-spacing:.08em}
.family-intro h3{margin:28px 0 14px;font:700 34px/1.1 var(--body)}
.family-intro p{margin:0;color:var(--muted);font-size:16px;line-height:1.55}
.font-source{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:22px;padding:13px 14px;border-radius:12px;background:white;transition:.2s}.font-source span{color:var(--muted);font:9px ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:uppercase}.font-source b{font-size:12px}.font-source:hover{background:var(--black);color:white;transform:translateY(-2px)}.font-source:hover span{color:rgba(255,255,255,.62)}
.family-intro ul{display:grid;gap:8px;margin:auto 0 0;padding:28px 0 0;list-style:none;border-top:1px solid rgba(42,37,37,.1)}
.family-intro li{font-size:14px;font-weight:700}.family-intro li::before{content:'•';margin-right:9px;color:var(--orange)}
.family-specimen{display:flex;flex-direction:column;justify-content:space-between;padding:38px}
.family-specimen>span{font:10px ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:uppercase;letter-spacing:.08em}
.family-specimen strong{margin:40px 0}
.family-specimen p{margin:0}
.family-zuume .family-specimen{background:var(--black);color:var(--eggshell)}.family-zuume .family-specimen strong{font:800 clamp(50px,5vw,78px)/.9 var(--display);letter-spacing:.04em}.family-zuume .family-specimen p{font:800 clamp(66px,7vw,108px)/.8 var(--display);text-transform:uppercase}
.family-quiroh .family-specimen{background:white;color:var(--black)}.family-quiroh .family-specimen strong{font:400 clamp(28px,3vw,44px)/1.45 var(--body)}.family-quiroh .family-specimen p{max-width:850px;font:400 clamp(30px,3.4vw,52px)/1.25 var(--body)}
.family-sandsea .family-specimen{background:var(--orange);color:var(--black)}.family-sandsea .family-specimen strong{font:clamp(29px,3vw,46px)/1.4 var(--script)}.family-sandsea .family-specimen p{font:clamp(68px,8vw,120px)/1 var(--script);transform:rotate(-3deg)}

.hierarchy-board{display:grid;grid-template-columns:1.25fr .75fr;overflow:hidden;border-radius:28px;background:var(--black);color:white}
.hierarchy-example{padding:58px clamp(36px,5vw,74px);background:var(--orange);color:var(--black)}
.hierarchy-kicker{display:inline-block;margin-bottom:26px;padding:7px 10px;border-radius:999px;background:var(--black);color:white;font:9px ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:uppercase}
.hierarchy-example h3{margin:0;font:800 clamp(78px,8vw,126px)/.78 var(--display);text-transform:uppercase}
.hierarchy-subhead{margin:30px 0 8px;font-size:24px;font-weight:700}.hierarchy-body{max-width:660px;margin:0;font-size:17px;line-height:1.55}
.hierarchy-example a{display:inline-block;margin-top:36px;padding-bottom:4px;border-bottom:2px solid var(--black);font-size:13px;font-weight:700}
.hierarchy-key{display:flex;flex-direction:column;justify-content:center;margin:0;padding:36px;list-style:none}
.hierarchy-key li{display:grid;grid-template-columns:42px 1fr;gap:15px;padding:24px 0;border-bottom:1px solid rgba(255,255,255,.12)}.hierarchy-key li:last-child{border-bottom:0}
.hierarchy-key li>span{color:var(--orange);font:10px ui-monospace,SFMono-Regular,Menlo,monospace}.hierarchy-key b{font-size:16px}.hierarchy-key p{margin:4px 0 0;color:rgba(255,255,255,.62);font-size:13px;line-height:1.4}

.type-pair-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.pair-poster{position:relative;min-height:510px;display:flex;flex-direction:column;justify-content:center;overflow:hidden;padding:46px;border-radius:26px}
.pair-poster>span{position:relative;z-index:2;align-self:center;margin:0 0 -5px;font:clamp(54px,6vw,92px)/.8 var(--script);transform:rotate(-5deg)}
.pair-poster strong{position:relative;z-index:1;font:800 clamp(75px,8vw,125px)/.78 var(--display);text-align:center}
.pair-poster p{position:absolute;left:26px;bottom:24px;margin:0;font:10px ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:uppercase}
.pair-poster-light{background:var(--eggshell);color:var(--orange)}.pair-poster-light p{color:var(--muted)}
.pair-poster-orange{background:var(--orange);color:var(--eggshell)}.pair-poster-orange>span{color:var(--black)}.pair-poster-orange p{padding:6px 8px;border-radius:7px;background:var(--black);color:white}
.pair-rule{display:grid;grid-template-columns:130px 1fr;gap:26px;margin-top:18px;padding:25px 28px;border-radius:18px;background:white}.pair-rule b{font:10px ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:uppercase}.pair-rule p{margin:0;color:var(--muted);font-size:15px;line-height:1.55}

.type-rule-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.type-rule-grid article{padding:32px;border-radius:24px}.type-do{background:var(--eggshell)}.type-dont{background:white}
.type-rule-grid article>span{display:inline-block;padding:7px 10px;border-radius:999px;color:white;font:9px ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:uppercase}.type-do>span{background:var(--status-green)}.type-do>span::before{content:'✓ ';font-weight:800}.type-dont>span{background:var(--status-red)}.type-dont>span::before{content:'× ';font-weight:800}
.type-rule-grid h3{margin:24px 0 18px;font:700 25px/1.2 var(--body)}.type-rule-grid ul{display:grid;gap:0;margin:0;padding:0;list-style:none}.type-rule-grid li{position:relative;padding:12px 0 12px 20px;border-top:1px solid rgba(42,37,37,.08);font-size:15px}.type-rule-grid li::before{content:'•';position:absolute;left:0;color:var(--orange)}
.wordmark-note{display:grid;grid-template-columns:1fr .8fr auto;align-items:center;gap:40px;margin-top:18px;padding:34px;border-radius:24px;background:var(--black);color:white}.wordmark-note>div>span{color:var(--orange);font:10px ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:uppercase}.wordmark-note h3{margin:10px 0 7px;font:700 25px var(--body)}.wordmark-note p{max-width:560px;margin:0;color:rgba(255,255,255,.65);font-size:14px}.wordmark-note img{width:240px;filter:brightness(0) invert(1)}.wordmark-note a{padding:12px 14px;border-radius:11px;background:var(--orange);color:var(--black);font-size:12px;font-weight:700;white-space:nowrap}
.font-help{display:flex;align-items:center;justify-content:space-between;margin-top:18px;padding:23px 26px;border-radius:18px;background:var(--gold);color:white}.font-help span{font-size:15px;font-weight:700}.font-help small{display:block;color:rgba(255,255,255,.72);font:9px ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:uppercase}.font-help b{font-size:22px}

@media(max-width:1180px){.type-hero-stage{padding:46px}.type-hero-stage strong{font-size:108px}.family-card{grid-template-columns:.85fr 1.15fr}.family-specimen{padding:30px}.family-zuume .family-specimen p{font-size:80px}.role-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:900px){.type-hero{position:relative;grid-template-columns:1fr;min-height:780px}.type-hero-copy{position:relative;z-index:3;align-self:end;grid-row:1;padding:340px 30px 58px;background:linear-gradient(0deg,var(--black) 16%,rgba(42,37,37,.97) 62%,transparent 100%)}.type-hero-stage{position:absolute;inset:0;justify-content:flex-start;min-height:780px;padding:92px 40px}.type-hero-stage strong{font-size:94px}.type-hero-stage em{top:23%;right:7%}.type-hero-stage p,.type-stage-label{display:none}.family-card{grid-template-columns:1fr}.family-intro{min-height:390px}.family-specimen{min-height:440px}.hierarchy-board{grid-template-columns:1fr}.hierarchy-key{padding:28px 36px}.type-pair-grid{grid-template-columns:1fr}.wordmark-note{grid-template-columns:1fr auto}.wordmark-note img{grid-row:1/3;grid-column:2}.wordmark-note a{grid-column:1/-1;justify-self:start}}
@media(max-width:640px){.type-hero{min-height:700px;border-radius:22px}.type-hero-copy{padding:300px 22px 44px}.type-hero h1{font-size:104px}.type-hero-copy>p:last-child{font-size:17px}.type-hero-stage{min-height:700px;padding:78px 22px}.type-hero-stage strong{font-size:75px}.type-hero-stage em{font-size:40px}.family-intro,.family-specimen{padding:25px}.family-intro{min-height:420px}.family-specimen{min-height:390px}.family-zuume .family-specimen p{font-size:65px}.family-quiroh .family-specimen strong{font-size:26px}.family-quiroh .family-specimen p{font-size:31px}.family-sandsea .family-specimen strong{font-size:27px}.family-sandsea .family-specimen p{font-size:65px}.hierarchy-example{padding:42px 24px}.hierarchy-example h3{font-size:78px}.hierarchy-key{padding:22px}.pair-poster{min-height:400px;padding:24px}.pair-poster strong{font-size:72px}.pair-poster>span{font-size:55px}.pair-rule{grid-template-columns:1fr;gap:9px}.type-rule-grid{grid-template-columns:1fr}.wordmark-note{grid-template-columns:1fr;gap:24px;padding:26px}.wordmark-note img{grid-row:auto;grid-column:auto;width:210px}.wordmark-note a{grid-column:auto}.font-help{align-items:flex-start;gap:20px}}

@media(min-width:901px){.type-hero{min-height:590px}}

/* Quiroh specimens demonstrate restrained, real weights rather than faux-heavy UI. */
.family-intro h3,.hierarchy-subhead,.type-rule-grid h3,.wordmark-note h3{font-weight:500}
.family-intro li,.font-help span{font-weight:500}
.type-hero-stage p,.hierarchy-example a,.wordmark-note a{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:600;text-transform:uppercase;letter-spacing:.04em}