/* Quiet editorial hierarchy: imagery carries weight; text stays measured.
   References studied: Loro Piana (image/text restraint), Heron AI (grid and spacing).
   Original Shadow OS artwork, content and semantic structure are retained. */
:root{--sos-reading-ink:#302d28;--sos-hairline:rgba(38,35,31,.19);--sos-reading-width:720px;--sos-space-section:clamp(48px,6vw,88px)}
body[data-design-family]{background:var(--sos-canvas)!important;color:var(--sos-ink)!important}
body[data-design-family] :is(h1,h2,h3,h4){font-weight:400;letter-spacing:-.025em;text-wrap:pretty}
body[data-design-family] :is(.eyebrow,.module-label,.kicker,.section-kicker,.sheet-kicker,.example-label){font-size:11px;letter-spacing:.14em;font-weight:400}
body[data-design-family] :is(.source-note,.article-meta,.breadcrumbs,.matrix-caption,.fine){font-family:var(--sos-ui)!important;font-size:12px;line-height:1.6}
body[data-design-family] :is(.sos-shell,.site-header){backdrop-filter:none!important}
body[data-design-family] .sos-shell{max-width:none;padding:0;border-bottom-color:var(--sos-hairline)!important}
body[data-design-family] .sos-shell-row{max-width:1600px;margin:auto}
body[data-design-family] .sos-shell-ask{background:transparent!important;color:var(--sos-ink)!important;border:1px solid var(--sos-hairline)!important}
body[data-design-family] .sos-menu-nav a{font-size:clamp(36px,4vw,56px);line-height:1.24}
body[data-design-family] :is(button,input,textarea,select){font-family:var(--sos-ui);font-size:16px}
body[data-design-family] button{min-height:44px}
/* The homepage keeps two strong image pairs; secondary explanation has a quieter scale. */
body[data-design-family="home"] .maze-home .section-lead :is(h2,h3){font-size:clamp(32px,3.1vw,46px);line-height:1.12}
body[data-design-family="home"] .art-intro h3{font-size:clamp(34px,3.5vw,54px);line-height:1.1}
body[data-design-family="home"] .section-lead p{font-size:17px;line-height:1.7}
body[data-design-family="home"] .meaning-bridge h3{font-size:27px}
body[data-design-family="home"] .meaning-bridge p:not(.eyebrow){font-size:16px;line-height:1.7}
body[data-design-family="home"] .record-step h3{font-size:30px}
body[data-design-family="home"] .record-step>p{font-size:16px}
body[data-design-family="home"] .editorial-section{margin-top:var(--sos-space-section)}
body[data-design-family="home"] .reading-sheet{background:transparent;border:1px solid var(--sos-hairline)}
body[data-design-family="home"] .reading-sheet h3{font-size:36px}
body[data-design-family="home"] .closing h2{font-size:clamp(42px,5vw,68px)}
/* Decisions directory: a catalog of real questions, rather than a wall of loud cards. */
body[data-design-family="directory"] .decisions{max-width:1240px;padding-bottom:80px}
body[data-design-family="directory"] .hero{padding:var(--sos-space-section) 0 48px;max-width:820px}
body[data-design-family="directory"] h1{font-size:clamp(42px,4.7vw,66px);line-height:1.04;max-width:20ch}
body[data-design-family="directory"] .hero p{font-size:22px;line-height:1.55;max-width:58ch}
body[data-design-family="directory"] .door{min-height:180px;padding:26px 28px 22px 0;border:0;border-top:1px solid var(--sos-hairline)!important;background:transparent!important;transform:none}
body[data-design-family="directory"] .door::before{display:none}
body[data-design-family="directory"] .door-label{font-family:var(--sos-display)!important;font-size:30px;font-weight:400;text-transform:none;letter-spacing:-.02em;color:var(--sos-ink)!important;margin-bottom:16px}
body[data-design-family="directory"] .door strong{font-size:20px}
body[data-design-family="directory"] .door span:last-child{font-size:13px;line-height:1.6}
body[data-design-family="directory"] .guide-list{background:transparent;gap:0 32px}
body[data-design-family="directory"] .guide-link{padding:24px 0;min-height:0;border-bottom:1px solid var(--sos-hairline)}
body[data-design-family="directory"] .guide-link strong{font-size:25px}
body[data-design-family="directory"] .guide-link span{font-family:var(--sos-ui);font-size:14px;line-height:1.65}
/* Long-form decisions and references: calm reading column, visible facts and sources. */
body[data-design-family="guide"] main{max-width:1080px}
body[data-design-family="guide"] .hero{padding:var(--sos-space-section) 0 46px}
body[data-design-family="guide"] h1{font-size:clamp(42px,4.8vw,66px);line-height:1.06;max-width:22ch}
body[data-design-family="guide"] h2{font-size:clamp(30px,3.2vw,42px);line-height:1.14}
body[data-design-family="guide"] .lede{font-size:23px;line-height:1.55}
body[data-design-family="guide"] .section{padding:56px 0}
body[data-design-family="guide"] .narrow{max-width:var(--sos-reading-width)}
body[data-design-family="guide"] :is(.guide-card,.path-card){background:transparent!important;border:0!important;border-top:1px solid var(--sos-hairline)!important;padding:24px 18px 24px 0}
body[data-design-family="guide"] :is(.guide-card,.path-card,.experiment-step) p{font-size:19px;line-height:1.65}
body[data-design-family="guide"] :is(.quick-answer,.fact-card,.math-box,.experiment-card){border:1px solid var(--sos-hairline)!important;background:transparent!important;box-shadow:none!important;padding:26px}
body[data-design-family="guide"] .source-list{font-size:17px;line-height:1.65}
/* Blog directory and articles: titles vary in scale by their role, not by legacy template. */
body[data-design-family="blog-index"] .index-hero{padding:var(--sos-space-section) 0 48px}
body[data-design-family="blog-index"] h1{font-size:clamp(44px,5vw,68px);line-height:1.04}
body[data-design-family="blog-index"] .article-link{background:transparent!important;box-shadow:none!important;border-radius:0!important}
body[data-design-family="blog-index"] .article-link h3{font-size:28px;line-height:1.16}
body[data-design-family="blog-article"] .article{max-width:var(--sos-reading-width);font-size:21px;line-height:1.7}
body[data-design-family="blog-article"] .article h1{font-size:clamp(40px,4.5vw,60px);line-height:1.08;margin-bottom:28px}
body[data-design-family="blog-article"] .article h2{font-size:34px;line-height:1.2;margin-top:54px;margin-bottom:20px}
body[data-design-family="blog-article"] .article h3{font-size:27px;line-height:1.25}
body[data-design-family="blog-article"] .article p{margin-bottom:22px}
/* Learn maintains its illustrations and explanations; navigation and type become shared. */
body[data-design-family^="learn"] h1{font-size:clamp(42px,4.8vw,66px)!important;line-height:1.07!important;font-weight:400!important}
body[data-design-family^="learn"] :is(h2,.sec-title){font-size:clamp(30px,3.2vw,42px)!important;line-height:1.16!important}
body[data-design-family^="learn"] :is(.card-t,.card h3){font-size:27px!important;line-height:1.2!important}
body[data-design-family^="learn"] :is(.card-d,.sec-intro,.hero-p,.hero-p2){font-size:19px!important;line-height:1.65!important}
body[data-design-family^="learn"] .card{background:transparent!important;box-shadow:none!important;border-color:var(--sos-hairline)!important}
/* Legal pages use a dedicated reading frame; their old body width no longer constrains the header. */
body[data-design-family="legal"]{max-width:none;margin:0;padding:0;font-family:var(--sos-ui)!important}
.legal-copy{max-width:760px;margin:auto;padding:64px 24px 88px;font:400 16px/1.8 var(--sos-ui);color:var(--sos-reading-ink)}
.legal-copy h1{font:400 clamp(36px,4vw,52px)/1.12 var(--sos-display);margin:0 0 26px}
.legal-copy h2{font:400 28px/1.25 var(--sos-display);margin:42px 0 18px}
.legal-copy h3{font:400 23px/1.3 var(--sos-display);margin-top:28px}
.legal-copy a{text-underline-offset:3px;overflow-wrap:anywhere}
body[data-design-family="company"] h1,body[data-design-family="product"] h1{font-size:clamp(40px,4.8vw,64px)!important;line-height:1.08!important}
body[data-design-family="company"] :is(h2,.sec-title),body[data-design-family="product"] :is(h2,.sec-title){font-size:clamp(30px,3vw,40px)!important;line-height:1.15!important}
@media(max-width:760px){
 body[data-design-family] .sos-shell-row{padding:0 18px;gap:12px}
 body[data-design-family] .sos-shell-brand{font-size:12px;letter-spacing:.18em}
 body[data-design-family] .sos-shell-right{gap:12px}
 body[data-design-family] .sos-shell-btn{font-size:11px}
 body[data-design-family] .sos-overlay-body{padding:32px 22px 44px}
 body[data-design-family] .sos-search-results{grid-template-columns:1fr}
 body[data-design-family="guide"] .hero,body[data-design-family="directory"] .hero{padding-top:46px}
 body[data-design-family="guide"] :is(.lede,.hero-note){font-size:21px}
 body[data-design-family="guide"] .section{padding:38px 0}
 body[data-design-family="guide"] :is(.quick-answer,.fact-card,.math-box,.experiment-card){padding:20px}
 body[data-design-family="blog-article"] .article{font-size:20px;line-height:1.65}
 body[data-design-family="blog-article"] .article h2{font-size:29px;margin-top:40px}
 body[data-design-family^="learn"] :is(.card-d,.sec-intro,.hero-p,.hero-p2){font-size:18px!important}
 .legal-copy{padding:42px 22px 64px;font-size:16px}
 body[data-design-family="home"] .reading-sheet h3{font-size:31px}
}
/* Quiet accents still need readable contrast at small sizes. */
body[data-design-family] :is(.eyebrow,.module-label,.kicker,.section-kicker,.sheet-kicker,.example-label,.source-list a,.reading-example,.signal-reading-sheet dt,.discovery-links span){color:#795537!important}
body[data-design-family] :is(.sos-button,.btn:not(.secondary)){background:#302d28!important;color:#F7EFE3!important}
body[data-design-family] :is(.sos-button-outline,.sos-button-cream){background:transparent!important}
