:root {
  --navy-950: #10253e;
  --navy-900: #122b49;
  --navy-800: #294a6c;
  --blue: #7d9fcd;
  --blue-bright: #8db0df;
  --cyan: #73aebe;
  --orange: #e9a07d;
  --ink: #10223c;
  --muted: #5b6a7f;
  --soft: #f3f7fb;
  --line: #dce4ed;
  --white: #fff;
  --shadow: 0 12px 34px rgba(9, 43, 80, .08);
  --shadow-lg: 0 22px 65px rgba(9, 43, 80, .13);
  --serif: Georgia, "Times New Roman", serif;
  --sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--white); font-family: var(--sans); font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
img, svg { max-width: 100%; }
code { padding: .12em .4em; border: 1px solid #e2eaf1; border-radius: 5px; color: #174b76; background: #f4f8fb; font: .88em ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
:focus-visible { outline: 3px solid var(--cyan); outline-offset: 4px; }
.shell { width: min(100% - 48px, 1190px); margin-inline: auto; }
.skip-link:not(:focus) { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link:focus { position: fixed; z-index: 1000; top: 12px; left: 12px; padding: 9px 14px; border-radius: 7px; color: var(--white); background: var(--navy-900); }

.site-header { position: absolute; z-index: 30; inset: 0 0 auto; padding: 14px 0; }
.nav-wrap { display: flex; min-height: 66px; align-items: center; justify-content: space-between; gap: 24px; padding: 0 15px 0 20px; border: 1px solid rgba(208, 222, 235, .92); border-radius: 13px; background: rgba(255, 255, 255, .92); box-shadow: 0 11px 30px rgba(9, 43, 80, .065); backdrop-filter: blur(16px); }
.brand { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 9px; color: var(--navy-900); }
.brand-mark { display: inline-grid; width: 33px; height: 35px; place-items: center; color: var(--navy-900); }
.brand-mark svg { width: 33px; fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.brand-mark svg path:first-child { fill: #e9f5fb; }
.brand-name { font-size: 19px; font-weight: 850; letter-spacing: -.065em; }
.brand-name span { color: var(--blue); font-weight: 700; }
.primary-nav { display: flex; align-items: center; gap: clamp(20px, 3vw, 37px); color: #344e6a; font-size: 12px; font-weight: 730; }
.primary-nav a { transition: color .18s ease; }
.primary-nav a:hover, .primary-nav .active-link { color: var(--blue); }
.primary-nav .nav-cta { display: inline-flex; min-height: 39px; align-items: center; gap: 8px; padding: 0 14px; border: 1px solid #cdddea; border-radius: 7px; color: var(--navy-900); background: #f9fcff; }
.primary-nav .nav-cta:hover { border-color: var(--blue); color: var(--blue); background: white; }
.nav-cta span { font-size: 16px; line-height: 1; }
.menu-toggle { display: none; width: 40px; height: 40px; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--white); }
.menu-toggle span { display: block; width: 17px; height: 2px; margin: 3px auto; border-radius: 2px; background: var(--navy-900); transition: transform .18s ease, opacity .18s ease; }

.hero { position: relative; min-height: 685px; overflow: hidden; padding: 136px 0 79px; background: linear-gradient(115deg, #f8fbfe 0%, #edf5fb 62%, #eaf4f7 100%); }
.hero::before { position: absolute; top: -195px; right: -78px; width: 620px; height: 620px; border: 1px solid rgba(32, 139, 195, .09); border-radius: 50%; box-shadow: 0 0 0 37px rgba(32, 139, 195, .025), 0 0 0 85px rgba(32, 139, 195, .018); content: ""; }
.hero::after { position: absolute; right: 0; bottom: 0; left: 0; height: 7px; background: linear-gradient(90deg, var(--navy-900) 0 28%, var(--blue) 28% 54%, var(--cyan) 54% 78%, var(--orange) 78% 100%); opacity: .85; content: ""; }
.hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, .95fr) minmax(400px, 1.05fr); gap: clamp(50px, 7vw, 98px); align-items: center; }
.hero-copy { padding: 21px 0; }
.eyebrow, .section-kicker { display: inline-flex; align-items: center; gap: 9px; margin: 0 0 16px; color: var(--blue); font-size: 10px; font-weight: 850; letter-spacing: .105em; text-transform: uppercase; }
.eyebrow { padding: 8px 12px 8px 10px; border: 1px solid #c5e3ee; border-radius: 999px; color: #355370; background: rgba(255, 255, 255, .68); letter-spacing: .035em; text-transform: none; }
.eyebrow-dot, .pulse-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 0 5px rgba(25, 184, 200, .13); }
h1, h2, h3, p { margin-top: 0; }
h1, h2 { font-family: var(--sans); font-weight: 820; letter-spacing: -.05em; }
h1 { max-width: 630px; margin-bottom: 21px; color: var(--navy-900); font-size: clamp(48px, 5.8vw, 76px); line-height: .99; }
h1 em { color: var(--blue); font-style: normal; }
.hero-lede { max-width: 570px; margin-bottom: 28px; color: #506880; font-size: 16px; line-height: 1.7; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 11px; }
.button { display: inline-flex; min-height: 50px; align-items: center; justify-content: center; gap: 10px; padding: 0 20px; border: 1px solid transparent; border-radius: 8px; font-size: 12px; font-weight: 800; transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease; }
.button:hover { transform: translateY(-2px); }
.button-primary { color: var(--white); background: var(--navy-900); box-shadow: 0 9px 20px rgba(9, 43, 80, .17); }
.button-primary:hover { background: #104675; box-shadow: 0 13px 27px rgba(9, 43, 80, .22); }
.button-secondary { border-color: #c5d5e3; color: var(--navy-900); background: rgba(255, 255, 255, .6); }
.button-secondary:hover { border-color: var(--blue); background: var(--white); }
.button-light { border-color: rgba(255, 255, 255, .35); color: var(--white); background: rgba(255, 255, 255, .09); }
.button-light:hover { background: rgba(255, 255, 255, .16); }
.button-white { color: var(--navy-900); background: var(--white); }
.button-white:hover { background: #f0f8fc; }
.hero-proof { display: flex; align-items: center; gap: 13px; margin-top: 28px; color: #526b84; font-size: 10px; font-weight: 750; }
.hero-proof i { width: 3px; height: 3px; border-radius: 50%; background: #8ca0b6; }
.hero-art { position: relative; min-height: 424px; padding: 31px 37px 24px; border: 1px solid rgba(202, 220, 235, .9); border-radius: 20px; background: rgba(255, 255, 255, .7); box-shadow: var(--shadow-lg); }
.hero-art::before { position: absolute; inset: 13px; border: 1px solid rgba(217, 230, 239, .75); border-radius: 13px; content: ""; pointer-events: none; }
.art-topline { position: relative; z-index: 1; display: flex; align-items: center; gap: 9px; margin-bottom: 20px; color: #71859a; font-size: 9px; font-weight: 850; letter-spacing: .11em; text-transform: uppercase; }
.art-topline .pulse-dot { width: 6px; height: 6px; background: #37b97c; box-shadow: 0 0 0 4px rgba(55, 185, 124, .12); }
.flow-card { position: relative; z-index: 1; display: flex; min-height: 65px; align-items: center; gap: 12px; padding: 10px 14px; border: 1px solid #dbe6ef; border-radius: 11px; background: rgba(255, 255, 255, .95); box-shadow: 0 6px 17px rgba(15, 50, 83, .05); }
.flow-card > span:nth-child(2) { display: grid; gap: 2px; }
.flow-card strong { color: var(--navy-900); font-size: 12px; }
.flow-card small { color: #74869a; font-size: 9px; }
.flow-card > b { margin-left: auto; color: #9aabba; font-size: 9px; }
.flow-icon { display: grid; width: 35px; height: 35px; place-items: center; border-radius: 9px; font: 800 12px ui-monospace, monospace; }
.code-icon { color: var(--blue); background: #eaf4ff; }
.lite-icon { color: #048594; background: #e6f9fa; font-size: 17px; }
.legacy-icon { color: #bc582c; background: #fff0e8; }
.flow-card-top, .flow-card-middle { width: 86%; }
.flow-card-middle { margin-left: auto; }
.flow-connector { position: absolute; top: 99px; left: 29%; width: 45%; height: 142px; border-right: 1px dashed #99b8cc; border-bottom: 1px dashed #99b8cc; border-left: 1px dashed #99b8cc; border-radius: 0 0 16px 16px; opacity: .68; }
.flow-connector::before, .flow-connector::after { position: absolute; top: -8px; width: 7px; height: 7px; border: 1px solid #91b5ca; border-radius: 50%; background: var(--white); content: ""; }
.flow-connector::before { left: -4px; }
.flow-connector::after { right: -4px; }
.flow-connector span { position: absolute; bottom: -4px; width: 7px; height: 7px; border-radius: 50%; background: var(--cyan); }
.flow-connector span:first-child { left: -4px; }
.flow-connector span:last-child { right: -4px; background: var(--blue); }
.flow-core { position: relative; z-index: 2; display: flex; min-height: 72px; align-items: center; gap: 12px; margin: 16px 0 20px 17%; padding: 10px 14px; border: 1px solid #badce8; border-radius: 12px; background: linear-gradient(110deg, #f0fbfc, #fff); box-shadow: 0 9px 22px rgba(15, 123, 151, .09); }
.core-mark { display: grid; width: 38px; height: 38px; place-items: center; border-radius: 10px; color: var(--white); background: linear-gradient(145deg, var(--navy-900), var(--blue)); font-family: var(--serif); font-size: 19px; font-weight: 700; }
.flow-core strong, .flow-core small { display: block; }
.flow-core strong { color: var(--navy-900); font-size: 11px; }
.flow-core small { margin-top: 2px; color: #778b9c; font-size: 8px; }
.core-arrow { margin-left: auto; color: var(--cyan); font-size: 18px; }
.flow-card-bottom { width: 74%; margin-left: auto; }
.art-footnote { display: flex; align-items: center; gap: 7px; margin: 16px 0 0 4px; color: #8a9aab; font-size: 8px; }
.mini-line { width: 14px; height: 1px; background: var(--cyan); }

.section { padding: 88px 0; }
.projects-section { background: var(--white); }
.section-heading { max-width: 720px; margin-bottom: 36px; }
.split-heading { display: flex; max-width: none; align-items: end; justify-content: space-between; gap: 40px; }
.section-kicker { margin-bottom: 8px; }
h2 { margin-bottom: 13px; color: var(--navy-900); font-size: clamp(34px, 4vw, 51px); line-height: 1.04; }
.section-heading > p, .split-heading > p { max-width: 330px; margin: 0 0 7px; color: var(--muted); font-size: 13px; line-height: 1.7; }
.project-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; }
.project-card { position: relative; min-height: 315px; padding: 23px 24px 21px; border: 1px solid var(--line); border-radius: 13px; background: var(--white); box-shadow: 0 5px 20px rgba(12, 48, 84, .035); transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.project-card:hover { transform: translateY(-4px); border-color: #bad4e7; box-shadow: var(--shadow); }
.project-card-featured { border-top: 3px solid var(--blue); }
.project-card-top, .directory-meta { display: flex; align-items: center; justify-content: space-between; }
.project-index { color: #8da1b4; font-size: 10px; font-weight: 850; letter-spacing: .08em; }
.project-kind { padding: 5px 8px; border: 1px solid #e0e9f0; border-radius: 999px; color: #5c738b; background: #f9fbfd; font-size: 8px; font-weight: 800; letter-spacing: .035em; text-transform: uppercase; }
.project-glyph { display: grid; width: 46px; height: 46px; margin: 25px 0 16px; place-items: center; border-radius: 12px; font: 800 17px ui-monospace, monospace; }
.glyph-blue { color: var(--blue); background: #eaf4ff; }
.glyph-cyan { color: #098b99; background: #e6f8fa; }
.glyph-orange { color: #bd5b30; background: #fff0e8; font-size: 13px; }
.project-card h3, .directory-card h2 { margin-bottom: 8px; color: var(--navy-900); font-family: var(--serif); font-size: 23px; letter-spacing: -.035em; }
.project-card p, .directory-card p { min-height: 74px; margin-bottom: 17px; color: var(--muted); font-size: 11px; line-height: 1.65; }
.card-link, .text-link { display: inline-flex; align-items: center; gap: 7px; color: var(--blue); font-size: 10px; font-weight: 850; }
.card-link span, .text-link span { font-size: 16px; transition: transform .18s ease; }
.card-link:hover span, .text-link:hover span { transform: translateX(3px); }

.schema-section { background: #f2f7fb; }
.schema-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(45px, 8vw, 110px); align-items: center; }
.schema-copy > p:not(.section-kicker) { max-width: 485px; margin-bottom: 22px; color: var(--muted); font-size: 13px; line-height: 1.75; }
.schema-path { position: relative; padding: 25px 27px 20px; border: 1px solid #d6e3ee; border-radius: 16px; background: rgba(255, 255, 255, .78); box-shadow: var(--shadow); }
.schema-node { position: relative; z-index: 1; display: flex; min-height: 66px; align-items: center; gap: 12px; padding: 10px 13px; border: 1px solid var(--line); border-radius: 10px; background: var(--white); }
.schema-node > div { display: grid; gap: 2px; }
.node-number { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 8px; color: var(--blue); background: #eff6fc; font-size: 9px; font-weight: 850; }
.schema-node strong { color: var(--navy-900); font-size: 11px; }
.schema-node small { color: #788b9d; font-size: 9px; }
.schema-node .node-tag { margin-left: auto; padding: 4px 7px; border-radius: 999px; color: #57738c; background: #f3f7fa; font-size: 7px; font-weight: 800; }
.schema-node-cyan .node-number { color: #087e8b; background: #e8f9fa; }
.schema-node-orange .node-number { color: #bf5a2e; background: #fff0e9; }
.schema-line { display: flex; height: 24px; justify-content: center; }
.schema-line span { width: 1px; background: #adc4d5; }
.schema-note { margin: 15px 1px 0; color: #899bac; font-size: 8px; line-height: 1.55; }
.docs-section { padding-top: 30px; }
.docs-panel { display: flex; align-items: center; justify-content: space-between; gap: 35px; padding: 41px 47px; border-radius: 17px; color: var(--white); background: linear-gradient(117deg, var(--navy-900), #104f7a 72%, #0e7182); box-shadow: var(--shadow-lg); }
.docs-panel h2 { max-width: 550px; margin-bottom: 10px; color: var(--white); font-size: clamp(30px, 4vw, 42px); }
.docs-panel .section-kicker { color: #77d8df; }
.docs-panel-copy > p:last-child { max-width: 600px; margin-bottom: 0; color: #c5d8e8; font-size: 11px; line-height: 1.7; }
.docs-panel-actions { display: flex; flex: 0 0 auto; flex-direction: column; gap: 9px; }

.page-hero { position: relative; overflow: hidden; padding: 151px 0 36px; background: linear-gradient(112deg, #f7fbfe, #edf5fb); }
.page-hero::after { position: absolute; right: 0; bottom: 0; left: 0; height: 4px; background: linear-gradient(90deg, var(--blue), var(--cyan), var(--orange)); opacity: .8; content: ""; }
.page-hero h1 { max-width: 820px; font-size: clamp(42px, 5vw, 63px); }
.page-hero .hero-lede { max-width: 680px; margin-bottom: 22px; }
.breadcrumbs { display: flex; align-items: center; gap: 9px; color: #8495a7; font-size: 9px; font-weight: 650; }
.breadcrumbs a:hover { color: var(--blue); }
.project-hero { padding-bottom: 40px; }
.project-hero-blue { background: linear-gradient(112deg, #f7fbfe, #eaf4fd); }
.project-hero-cyan { background: linear-gradient(112deg, #f7fbfe, #e8f8f8); }
.project-hero-orange { background: linear-gradient(112deg, #f7fbfe, #fcf1e9); }
.project-hero-blue .eyebrow-dot { background: var(--blue); box-shadow: 0 0 0 5px rgba(20, 121, 203, .12); }
.project-hero-cyan .eyebrow-dot { background: var(--cyan); }
.project-hero-orange .eyebrow-dot { background: var(--orange); box-shadow: 0 0 0 5px rgba(242, 117, 59, .12); }
.detail-section { padding-top: 58px; }
.detail-layout { display: grid; grid-template-columns: minmax(0, 1fr) 255px; gap: 62px; align-items: start; }
.detail-content { min-width: 0; }
.content-block { padding: 0 0 34px; margin-bottom: 35px; border-bottom: 1px solid var(--line); }
.content-block:last-child { margin-bottom: 0; border: 0; }
.content-block .section-kicker { margin-bottom: 7px; }
.content-block h2 { margin-bottom: 13px; font-size: clamp(27px, 3vw, 36px); }
.content-block > p:not(.section-kicker):not(.caption) { max-width: 760px; color: var(--muted); font-size: 12px; line-height: 1.8; }
.detail-aside { position: sticky; top: 24px; }
.aside-card { display: grid; gap: 10px; padding: 20px; border: 1px solid var(--line); border-radius: 12px; background: #fbfdff; box-shadow: 0 8px 24px rgba(12, 48, 84, .045); }
.aside-label { margin-top: 7px; color: #8699aa; font-size: 8px; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; }
.aside-card strong { color: var(--navy-900); font-size: 11px; }
.aside-card code { width: fit-content; font-size: 9px; }
.aside-card > a:not(.aside-back) { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--blue); font-size: 9px; font-weight: 800; }
.aside-value { color: #536d84; font-size: 10px; line-height: 1.6; }
.aside-back { padding-top: 12px; margin-top: 8px; border-top: 1px solid var(--line); color: #71869a; font-size: 9px; font-weight: 750; }
.status-panel, .source-note, .schema-alert { display: flex; align-items: flex-start; gap: 12px; padding: 14px 16px; border: 1px solid #f3dfbc; border-radius: 10px; background: #fffbf4; }
.content-block > .status-panel { margin-top: 14px; }
.content-block > .status-panel + .status-panel { margin-top: 9px; }
.status-panel p, .source-note p, .schema-alert p { margin: 0; color: #6d6759; font-size: 10px; line-height: 1.65; }
.status-panel strong, .source-note strong, .schema-alert strong { color: #574a31; }
.status-mark, .note-icon { display: grid; flex: 0 0 21px; width: 21px; height: 21px; place-items: center; border-radius: 50%; color: #9c6b24; background: #fff0d3; font-size: 11px; font-weight: 850; }
.field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 18px; }
.field-grid > div { display: grid; gap: 5px; padding: 12px; border: 1px solid var(--line); border-radius: 8px; background: #fbfdff; }
.field-grid strong { color: var(--navy-900); font-size: 9px; }
.field-grid span { color: #73869a; font-size: 8px; line-height: 1.5; }
.check-list { display: grid; gap: 10px; padding: 0; margin: 16px 0 0; color: #536d84; font-size: 11px; list-style: none; }
.check-list li { position: relative; padding-left: 21px; }
.check-list li::before { position: absolute; top: 1px; left: 0; display: grid; width: 14px; height: 14px; place-items: center; border-radius: 50%; color: #168a71; background: #e3f7f0; content: "✓"; font-size: 9px; font-weight: 900; }
.legacy-link-list { display: grid; gap: 8px; margin-top: 18px; }
.legacy-link-list a { display: flex; align-items: center; gap: 11px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 9px; background: var(--white); transition: border .18s ease, box-shadow .18s ease; }
.legacy-link-list a:hover { border-color: #aacfe0; box-shadow: var(--shadow); }
.legacy-link-icon { display: grid; flex: 0 0 28px; width: 28px; height: 28px; place-items: center; border-radius: 7px; color: #087e8b; background: #e8f9fa; font-size: 8px; font-weight: 850; }
.legacy-link-list a > span:nth-child(2) { display: grid; gap: 2px; }
.legacy-link-list strong { color: var(--navy-900); font-size: 10px; }
.legacy-link-list small { color: #8a9aa9; font-size: 8px; }
.legacy-link-list b { margin-left: auto; color: var(--blue); font-size: 14px; }
.taxonomy-pills, .tag-list, .route-chips { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 16px; }
.taxonomy-pills span, .tag-list span, .route-chips span { padding: 5px 9px; border: 1px solid #dce7ef; border-radius: 999px; color: #587087; background: #f8fbfd; font-size: 8px; font-weight: 750; }
.route-chips span { color: #315b7c; background: #eff7fc; }
.entity-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; margin-top: 17px; }
.entity-grid article { padding: 15px 16px; border: 1px solid var(--line); border-radius: 9px; background: #fbfdff; }
.entity-index { color: var(--blue); font-size: 8px; font-weight: 850; letter-spacing: .08em; }
.entity-grid h3 { margin: 6px 0 5px; color: var(--navy-900); font-family: var(--serif); font-size: 17px; }
.entity-grid p { margin: 0; color: var(--muted); font-size: 9px; line-height: 1.6; }
.relationship-map { display: grid; justify-items: center; padding: 19px 13px; border: 1px solid var(--line); border-radius: 11px; background: #f9fcfe; }
.relationship-top, .relationship-bottom { display: grid; width: 100%; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.relationship-top span, .relationship-bottom span { display: grid; min-height: 37px; place-items: center; padding: 5px; border: 1px solid #d4e1eb; border-radius: 7px; color: #47637c; background: var(--white); font-size: 8px; font-weight: 750; text-align: center; }
.relationship-center { display: grid; min-width: 185px; min-height: 58px; place-content: center; margin: 1px 0; border: 1px solid #b8dbea; border-radius: 9px; color: var(--navy-900); background: #eff9fc; text-align: center; }
.relationship-center strong { font-size: 11px; }
.relationship-center small { color: #6b8499; font-size: 8px; }
.relationship-lines { display: flex; width: 66%; height: 24px; justify-content: space-around; border-top: 1px solid #bed0dc; }
.relationship-lines i { display: block; width: 1px; height: 100%; background: #bed0dc; }
.relationship-lines-down { transform: rotate(180deg); }
.caption { margin: 9px 0 0; color: #8a9aaa; font-size: 8px; line-height: 1.6; }
.route-list { display: grid; gap: 1px; margin: 14px 0 18px; border: 1px solid var(--line); border-radius: 9px; overflow: hidden; }
.route-list div { display: grid; grid-template-columns: 150px 1fr; gap: 15px; padding: 11px 13px; background: #fbfdff; }
.route-list div + div { border-top: 1px solid var(--line); }
.route-list strong { color: var(--navy-900); font-size: 9px; }
.route-list span { color: var(--muted); font-size: 9px; }

.directory-section { padding-top: 55px; }
.directory-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.directory-card { display: flex; min-height: 395px; flex-direction: column; align-items: flex-start; padding: 22px; border: 1px solid var(--line); border-radius: 12px; background: var(--white); box-shadow: 0 5px 20px rgba(12, 48, 84, .035); }
.directory-card h2 { margin-bottom: 9px; }
.directory-card p { min-height: 95px; margin-bottom: 11px; }
.directory-card .button { min-height: 42px; margin-top: auto; font-size: 10px; }
.source-note { margin-top: 21px; border-color: #d9e8f0; background: #f7fbfd; }
.source-note p { color: #63788c; }
.source-note strong { color: var(--navy-900); }
.source-note .note-icon, .schema-alert .note-icon { color: #167a89; background: #e2f7f8; }

.schemas-main { padding-top: 45px; }
.schema-alert { max-width: 860px; margin-bottom: 31px; border-color: #cce7ed; background: #f3fbfc; }
.schema-alert p { color: #526e7c; }
.schema-alert strong { color: #214e60; }
.schema-doc-block { padding: 30px 0 37px; border-top: 1px solid var(--line); }
.schema-doc-block > p:not(.caption) { max-width: 940px; color: var(--muted); font-size: 11px; line-height: 1.75; }
.schema-block-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 12px; }
.schema-block-heading .section-kicker { margin-bottom: 4px; }
.schema-block-heading h2 { margin: 0; font-size: clamp(28px, 3.3vw, 38px); }
.reference-status { flex: 0 0 auto; padding: 6px 9px; border-radius: 999px; font-size: 8px; font-weight: 800; }
.status-pending { color: #9c6524; background: #fff4df; }
.status-current { color: #177b64; background: #e8f8f1; }
.status-legacy { color: #596f84; background: #edf3f7; }
.schema-link-row { display: flex; flex-wrap: wrap; gap: 19px; margin-top: 17px; }
.schema-link-row a { color: var(--blue); font-size: 10px; font-weight: 800; }
.schema-link-row a span { margin-left: 4px; font-size: 15px; }
.table-wrap { margin-top: 16px; overflow-x: auto; border: 1px solid var(--line); border-radius: 9px; }
table { width: 100%; border-collapse: collapse; background: var(--white); font-size: 9px; }
th, td { padding: 10px 12px; border-bottom: 1px solid #e6edf3; text-align: left; vertical-align: top; }
th { color: #49637c; background: #f4f8fb; font-size: 8px; font-weight: 850; letter-spacing: .045em; text-transform: uppercase; }
td { color: #62778b; }
td:first-child { color: var(--navy-900); font-weight: 750; }
tbody tr:last-child td { border-bottom: 0; }
.schema-details { margin-top: 18px; border: 1px solid var(--line); border-radius: 9px; background: #fbfdff; }
.schema-details summary { padding: 13px 15px; color: var(--navy-900); cursor: pointer; font-size: 10px; font-weight: 800; }
.schema-details[open] { padding-bottom: 14px; }
.schema-details[open] .table-wrap { margin: 0 14px; }
.code-block { max-height: 560px; overflow: auto; padding: 18px; margin: 15px 0; border: 1px solid #d9e6ef; border-radius: 10px; color: #deedf6; background: #092b50; font: 10px/1.7 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; tab-size: 2; }
.code-block code { padding: 0; border: 0; color: inherit; background: transparent; font: inherit; white-space: pre; }

.site-footer { padding: 41px 0 17px; color: #dce8f2; background: var(--navy-950); }
.footer-main { display: flex; justify-content: space-between; gap: 40px; padding-bottom: 28px; }
.brand-footer { color: var(--white); }
.brand-footer .brand-name span { color: #6bd3db; }
.brand-footer .brand-mark { color: var(--white); }
.brand-footer .brand-mark svg path:first-child { fill: rgba(255, 255, 255, .12); }
.footer-main > div:first-child p { margin: 9px 0 0 42px; color: #a8bed1; font-size: 9px; }
.footer-links { display: flex; gap: clamp(36px, 6vw, 80px); }
.footer-links > div { display: grid; align-content: start; gap: 7px; }
.footer-links strong { margin-bottom: 2px; color: var(--white); font-size: 9px; }
.footer-links a { color: #b3c6d7; font-size: 9px; }
.footer-links a:hover, .footer-bottom a:hover { color: #83dce1; }
.footer-bottom { display: flex; justify-content: space-between; gap: 20px; padding-top: 13px; border-top: 1px solid rgba(255, 255, 255, .13); color: #91a8bc; font-size: 8px; }
.not-found { min-height: 71vh; padding: 185px 0 90px; background: linear-gradient(120deg, #f7fbfe, #edf5fb); }
.not-found h1 { font-size: clamp(46px, 6vw, 72px); }
.not-found .hero-lede { max-width: 500px; }

@media (max-width: 900px) {
  .hero { min-height: 0; padding-top: 128px; }
  .hero-grid { grid-template-columns: 1fr; gap: 29px; }
  .hero-copy { max-width: 720px; }
  .hero-art { width: min(100%, 600px); margin-inline: auto; }
  .project-grid, .directory-grid { grid-template-columns: 1fr 1fr; }
  .project-card:last-child, .directory-card:last-child { grid-column: 1 / -1; }
  .schema-grid { grid-template-columns: 1fr; gap: 32px; }
  .schema-copy { max-width: 660px; }
  .detail-layout { grid-template-columns: minmax(0, 1fr) 215px; gap: 30px; }
  .docs-panel { align-items: flex-start; flex-direction: column; }
  .docs-panel-actions { flex-direction: row; }
}

@media (max-width: 640px) {
  .shell { width: min(100% - 34px, 1190px); }
  .site-header { padding-top: 10px; }
  .nav-wrap { min-height: 58px; padding-inline: 12px; }
  .brand-name { font-size: 17px; }
  .brand-mark, .brand-mark svg { width: 29px; height: 29px; }
  .menu-toggle { display: block; }
  .primary-nav { position: absolute; top: calc(100% + 7px); right: 17px; left: 17px; display: none; align-items: stretch; flex-direction: column; gap: 0; padding: 8px; border: 1px solid var(--line); border-radius: 11px; background: var(--white); box-shadow: var(--shadow-lg); }
  .primary-nav.is-open { display: flex; }
  .primary-nav a { padding: 12px 10px; }
  .primary-nav .nav-cta { justify-content: center; margin-top: 5px; }
  .menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(5px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-5px) rotate(-45deg); }
  body.menu-open { overflow: hidden; }
  .hero { padding: 112px 0 48px; }
  .hero::before { top: -210px; right: -300px; }
  .hero-grid { gap: 20px; }
  .eyebrow { max-width: 100%; font-size: 8px; }
  h1 { font-size: clamp(43px, 12vw, 62px); }
  .hero-lede { font-size: 13px; }
  .hero-actions { align-items: stretch; flex-direction: column; }
  .hero-actions .button { width: 100%; }
  .hero-proof { gap: 8px; font-size: 8px; }
  .hero-art { min-height: 365px; padding: 27px 18px 18px; }
  .flow-card { min-height: 58px; padding: 8px 10px; }
  .flow-card-top, .flow-card-middle { width: 93%; }
  .flow-connector { top: 95px; left: 25%; width: 50%; height: 117px; }
  .flow-core { min-height: 63px; margin: 12px 0 15px 5%; padding: 8px 10px; }
  .core-mark { width: 33px; height: 33px; }
  .flow-card-bottom { width: 83%; }
  .art-footnote { font-size: 7px; }
  .section { padding: 58px 0; }
  .split-heading { align-items: flex-start; flex-direction: column; gap: 5px; }
  .section-heading { margin-bottom: 24px; }
  h2 { font-size: 35px; }
  .project-grid, .directory-grid, .entity-grid, .field-grid { grid-template-columns: 1fr; }
  .project-card, .directory-card { min-height: 0; }
  .project-card:last-child, .directory-card:last-child { grid-column: auto; }
  .project-card p, .directory-card p { min-height: 0; }
  .schema-path { padding: 17px 13px; }
  .schema-node .node-tag { display: none; }
  .docs-section { padding-top: 0; }
  .docs-panel { padding: 27px 22px; }
  .docs-panel-actions { width: 100%; flex-direction: column; }
  .page-hero { padding: 120px 0 27px; }
  .page-hero h1 { font-size: 43px; }
  .page-hero .hero-lede { font-size: 12px; }
  .detail-section { padding-top: 39px; }
  .detail-layout { grid-template-columns: 1fr; gap: 28px; }
  .detail-aside { position: static; grid-row: 1; }
  .aside-card { grid-template-columns: 1fr 1fr; align-items: center; gap: 8px 12px; }
  .aside-label { margin: 4px 0; }
  .aside-card > a:not(.aside-back), .aside-back { grid-column: 1 / -1; }
  .route-list div { grid-template-columns: 1fr; gap: 3px; }
  .relationship-top, .relationship-bottom { gap: 5px; }
  .relationship-top span, .relationship-bottom span { font-size: 7px; }
  .schema-block-heading { align-items: flex-start; flex-direction: column; }
  .table-wrap { margin-inline: -4px; }
  th, td { min-width: 105px; padding: 9px; }
  .footer-main { flex-direction: column; gap: 26px; }
  .footer-links { justify-content: space-between; }
  .footer-bottom { flex-direction: column; gap: 5px; }
  .not-found { padding-top: 150px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}

/* PropBot.com companion site components */
.brand-name { letter-spacing: -.055em; }
.property-art { min-height: 420px; padding: 28px 30px 20px; }
.property-preview-card { position: relative; z-index: 1; overflow: hidden; border: 1px solid #d7e3ed; border-radius: 14px; background: var(--white); box-shadow: 0 15px 34px rgba(9, 43, 80, .12); }
.property-visual { position: relative; display: grid; min-height: 218px; place-items: center; overflow: hidden; background: linear-gradient(145deg, #dbeaf2, #b5d0dc 55%, #84aeba); }
.property-visual::before, .property-visual::after { position: absolute; right: -24px; bottom: 23px; width: 150px; height: 91px; border: 1px solid rgba(255, 255, 255, .42); border-radius: 55% 55% 0 0; background: rgba(255, 255, 255, .12); content: ""; }
.property-visual::after { right: auto; bottom: -36px; left: -13px; width: 180px; height: 123px; }
.visual-label, .visual-coordinate { position: absolute; z-index: 2; padding: 6px 9px; border: 1px solid rgba(255, 255, 255, .65); border-radius: 999px; color: #fff; background: rgba(7, 39, 67, .4); font-size: 7px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; backdrop-filter: blur(8px); }
.visual-label { top: 13px; left: 14px; }
.visual-coordinate { right: 13px; bottom: 13px; font-size: 6px; }
.illustrated-house { position: relative; z-index: 1; width: 156px; height: 134px; margin-top: 19px; filter: drop-shadow(0 12px 9px rgba(26, 69, 82, .17)); }
.house-roof { position: absolute; top: 3px; left: 11px; width: 134px; height: 91px; transform: rotate(45deg) skew(-5deg, -5deg) scale(.72); border-radius: 4px 0 0; background: #f4f7f8; }
.house-body { position: absolute; right: 20px; bottom: 4px; left: 20px; height: 86px; border: 1px solid rgba(27, 69, 82, .18); background: #fff; }
.house-body i { position: absolute; top: 13px; width: 24px; height: 24px; border: 3px solid #82b8c7; background: #d8edf2; }
.house-body i:first-child { left: 13px; }
.house-body i:nth-child(2) { right: 13px; }
.house-body b { position: absolute; bottom: 0; left: 61px; width: 24px; height: 46px; border: 2px solid #e2b898; border-bottom: 0; background: #f9eee5; }
.house-ground { position: absolute; right: -25px; bottom: 0; left: -25px; height: 2px; background: rgba(255, 255, 255, .75); }
.property-details { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 16px 17px 13px; }
.property-details > div { display: grid; gap: 2px; }
.property-details small { color: #8b9bad; font-size: 7px; font-weight: 850; letter-spacing: .11em; }
.property-details strong { color: var(--navy-900); font-family: var(--serif); font-size: 17px; letter-spacing: -.035em; }
.property-details span:not(.record-pin) { color: #6e8296; font-size: 9px; }
.record-pin { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid #f4d7c9; border-radius: 50%; color: var(--orange); background: #fff6f1; font-size: 20px; }
.record-connections { padding: 11px 17px 14px; border-top: 1px solid #edf1f4; }
.record-connections > span { display: block; margin-bottom: 7px; color: #8395a6; font-size: 7px; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; }
.record-connections div { display: flex; flex-wrap: wrap; gap: 6px; }
.record-connections b { padding: 4px 7px; border: 1px solid #e0e8ef; border-radius: 999px; color: #48637b; background: #fbfdff; font-size: 7px; }
.address-section { background: #f2f7fb; }
.address-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(42px, 8vw, 100px); align-items: center; }
.address-copy > p:not(.section-kicker) { max-width: 490px; margin-bottom: 18px; color: var(--muted); font-size: 12px; line-height: 1.8; }
.connection-card { padding: 24px; border: 1px solid #d6e3ee; border-radius: 15px; background: var(--white); box-shadow: var(--shadow); }
.connection-heading { display: flex; align-items: center; gap: 9px; margin-bottom: 15px; color: #74899c; font-size: 8px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.connection-dot { width: 6px; height: 6px; border-radius: 50%; background: #40b57d; box-shadow: 0 0 0 4px rgba(64, 181, 125, .12); }
.connection-row { display: flex; min-height: 60px; align-items: center; gap: 11px; padding: 9px 11px; border: 1px solid #e2eaf0; border-radius: 9px; background: #fbfdff; }
.connection-row + .connection-row { margin-top: 7px; }
.connection-row > div, .connection-target > div { display: grid; gap: 2px; }
.connection-symbol, .target-symbol { display: grid; flex: 0 0 32px; width: 32px; height: 32px; place-items: center; border-radius: 8px; font: 800 13px ui-monospace, monospace; }
.symbol-blue { color: var(--blue); background: #eaf4ff; }
.symbol-cyan { color: #087f8c; background: #e8f9fa; }
.connection-row strong, .connection-target strong { color: var(--navy-900); font-size: 10px; }
.connection-row small, .connection-target small { color: #8293a3; font-size: 8px; }
.connection-arrow { margin-left: auto; color: #9aabba; font-size: 15px; }
.connection-target { display: flex; align-items: center; gap: 11px; padding: 13px 11px; margin-top: 12px; border: 1px solid #badce8; border-radius: 10px; background: linear-gradient(110deg, #f1fafc, #fff); }
.target-symbol { color: white; background: var(--navy-900); font-family: var(--serif); font-size: 18px; }
.connection-note { margin: 13px 2px 0; color: #8999a8; font-size: 8px; line-height: 1.6; }
.cta-section { padding-top: 24px; }
.cta-panel { display: flex; align-items: center; justify-content: space-between; gap: 28px; padding: 37px 43px; border-radius: 16px; color: white; background: linear-gradient(115deg, #092b50, #10517c 70%, #117382); box-shadow: var(--shadow-lg); }
.cta-panel h2 { max-width: 570px; margin-bottom: 9px; color: white; font-size: clamp(29px, 3.5vw, 40px); }
.cta-panel .section-kicker { color: #82d6dc; }
.cta-panel p:last-child { max-width: 600px; margin: 0; color: #c2d6e6; font-size: 10px; }
.section-kicker-light { color: #82d6dc; }
.schema-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.schema-project-card { min-height: 300px; padding: 21px; border: 1px solid var(--line); border-radius: 12px; background: white; box-shadow: 0 5px 18px rgba(12, 48, 84, .035); }
.schema-project-card .project-glyph { margin-top: 20px; margin-bottom: 12px; }
.schema-project-card .section-kicker { margin-bottom: 3px; font-size: 8px; }
.schema-project-card h2 { margin-bottom: 8px; font-size: 22px; }
.schema-project-card > p:not(.section-kicker) { min-height: 72px; color: var(--muted); font-size: 10px; line-height: 1.65; }
.schema-project-card .project-card-top { align-items: flex-start; }
.schema-project-card .reference-status { padding: 5px 7px; font-size: 7px; }
.legacy-source-link, .related-projects a { display: flex; align-items: center; gap: 11px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 9px; background: #fbfdff; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.legacy-source-link { max-width: 560px; margin-top: 15px; }
.legacy-source-link:hover, .related-projects a:hover { transform: translateY(-2px); border-color: #b7d3e4; box-shadow: var(--shadow); }
.legacy-source-link > span:nth-child(2), .related-projects a > span:nth-child(2) { display: grid; gap: 2px; }
.legacy-source-link strong, .related-projects strong { color: var(--navy-900); font-size: 10px; }
.legacy-source-link small, .related-projects small { color: #8495a4; font-size: 8px; }
.legacy-source-link > b, .related-projects > a > b { margin-left: auto; color: var(--blue); font-size: 14px; }
.related-projects { display: grid; max-width: 600px; gap: 8px; margin-top: 15px; }
.related-mark { display: grid; flex: 0 0 30px; width: 30px; height: 30px; place-items: center; border-radius: 8px; font: 800 12px ui-monospace, monospace; }
.related-blue { color: var(--blue); background: #eaf4ff; }
.related-cyan { color: #087f8c; background: #e8f9fa; }
.related-orange { color: #bd5b30; background: #fff0e8; }
@media (max-width: 900px) {
  .address-grid { grid-template-columns: 1fr; gap: 30px; }
  .schema-card-grid { grid-template-columns: 1fr 1fr; }
  .schema-project-card:last-child { grid-column: 1 / -1; }
  .cta-panel { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 640px) {
  .property-art { min-height: 0; padding: 24px 16px 18px; }
  .property-visual { min-height: 175px; }
  .illustrated-house { transform: scale(.86); }
  .property-details { padding: 12px; }
  .property-details strong { font-size: 14px; }
  .record-connections { padding: 10px 12px 12px; }
  .connection-card { padding: 17px; }
  .cta-panel { padding: 27px 22px; }
  .cta-panel .button { width: 100%; }
  .schema-card-grid { grid-template-columns: 1fr; }
  .schema-project-card:last-child { grid-column: auto; }
  .schema-project-card { min-height: 0; }
  .schema-project-card > p:not(.section-kicker) { min-height: 0; }
}

/* Open community theme */
:root {
  --blue-soft: #e8f1fb;
  --peach-soft: #fff0e7;
  --sage-soft: #e5f0eb;
  --violet-soft: #eeebfa;
}

body { color: var(--ink); background: #fff; }
.site-header { position: relative; padding: 8px 0 0; }
.nav-wrap { position: relative; min-height: 66px; padding: 0 2px; border: 0; border-radius: 0; background: transparent; box-shadow: none; backdrop-filter: none; }
.site-header .brand-mark { display: none; }
.brand-name { color: var(--blue); font-size: 27px; font-weight: 850; letter-spacing: -.065em; }
.brand-name span { color: #8ca9cf; font-weight: 800; }
.primary-nav { gap: clamp(20px, 3vw, 40px); color: #17283f; font-size: 14px; font-weight: 650; }
.primary-nav a:hover, .primary-nav .active-link { color: #6089bf; }
.primary-nav .nav-cta { min-height: 44px; padding: 0 17px; border: 0; border-radius: 11px; color: #17304d; background: #e5eff9; font-weight: 750; }
.primary-nav .nav-cta:hover { color: #17304d; background: #d8e8f6; }
.menu-toggle { border-color: #d8e2ed; }

h1, h2, h3 { font-family: var(--sans); }
h1 { color: var(--ink); font-weight: 850; }
h1 em { color: #83a8d5; font-style: normal; }
h2 { color: var(--ink); font-weight: 800; }
.section-kicker { color: #648aba; font-size: 11px; letter-spacing: .08em; }
.button { min-height: 52px; padding-inline: 21px; border-radius: 10px; font-size: 14px; font-weight: 750; }
.button-primary { color: #fff; background: #789bc8; box-shadow: 0 8px 18px rgba(67, 104, 151, .16); }
.button-primary:hover { background: #688cb9; }
.button-secondary { border-color: #d2dae4; color: #152a46; background: #fff; }
.button-secondary:hover { border-color: #92add0; }
.text-link, .card-link { color: #547da9; font-size: 13px; }
.text-link:hover, .card-link:hover { color: #315f94; }

.home-page .shell { width: min(100% - 64px, 1200px); }
.home-page .site-header { position: relative; z-index: 30; padding: 0; background: #fff; }
.home-page .nav-wrap { min-height: 72px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; backdrop-filter: none; }
.home-page .brand { gap: 0; }
.home-page .brand-mark { display: none; }
.home-page .brand-name { color: #7598c5; font-size: 34px; font-weight: 800; letter-spacing: -.04em; }
.home-page .brand-name span { color: #7598c5; font-weight: 800; }
.home-page .primary-nav { gap: clamp(25px, 3.4vw, 45px); color: #122a47; font-size: 14px; font-weight: 650; }
.home-page .primary-nav a:hover { color: #7598c5; }
.home-page .primary-nav .nav-github { min-height: 44px; gap: 9px; padding: 0 17px; border: 0; border-radius: 13px; color: #122a47; background: #e4f0fa; font-size: 14px; }
.home-page .primary-nav .nav-github { margin-left: 100px; }
.home-page .nav-github svg { width: 20px; height: 20px; fill: currentColor; }
.home-page .nav-github span { font-size: 14px; }

.home-page .home-hero { padding: 0; overflow: hidden; background: #fff; }
.home-page .home-hero-grid { display: grid; min-height: 430px; grid-template-columns: minmax(400px, .78fr) minmax(0, 1.22fr); align-items: center; gap: 0; }
.home-page .home-hero-copy { position: relative; z-index: 1; padding: 4px 0 10px; transform: translateY(15px); }
.home-page .home-hero h1 { max-width: 510px; margin: 0 0 26px; font-size: clamp(62px, 6.25vw, 84px); line-height: .91; letter-spacing: -.067em; }
.home-page .home-hero h1 em { color: #82a8d6; }
.home-page .home-lede { max-width: 460px; margin: 0 0 33px; color: #142b49; font-size: 18px; line-height: 1.55; }
.home-page .home-hero .hero-actions { gap: 18px; }
.home-page .home-hero .button-primary { color: #fff; background: #7a9fcf; box-shadow: none; }
.home-page .home-hero .button-primary:hover { background: #688dbf; }
.home-page .home-hero .button-secondary { border-color: #cbd4df; background: #fff; }
.home-page .home-illustration-wrap { display: grid; height: 430px; min-width: 0; margin: 0 -60px 0 -18px; overflow: hidden; place-items: center; }
.home-page .home-illustration { display: block; width: 110%; max-width: none; height: 100%; object-fit: cover; object-position: center top; -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 15%, #000 100%); mask-image: linear-gradient(90deg, transparent 0%, #000 15%, #000 100%); }

.home-page .pathways { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 38px; margin-bottom: 28px; border-top: 1px solid #e2e7ed; border-bottom: 0; }
.home-page .pathway { position: relative; display: flex; min-height: 112px; align-items: center; gap: 18px; padding: 18px 23px 18px 5px; transform: translateY(14px); }
.home-page .pathway + .pathway { padding-left: 27px; border-left: 1px solid #e2e7ed; }
.pathway-icon { display: grid; flex: 0 0 66px; width: 66px; height: 66px; place-items: center; border-radius: 50%; color: #17314e; }
.pathway-icon svg { width: 31px; height: 31px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.icon-blue { color: #17314e; background: #ddecf9; }
.icon-peach { color: #17314e; background: #ffe2d1; }
.icon-sage { color: #17314e; background: #deeee7; }
.icon-violet { color: #514b7b; background: var(--violet-soft); }
.icon-gray { color: #5e6c7c; background: #e9eef3; }
.home-page .pathway-copy { display: grid; max-width: 250px; gap: 4px; }
.home-page .pathway-copy strong { display: flex; align-items: center; gap: 13px; color: #152943; font-size: 17px; letter-spacing: -.025em; }
.home-page .pathway-copy > span { color: #657287; font-size: 14px; line-height: 1.45; }
.home-page .pathway-arrow { margin: 0; color: #648cbd; font-size: 22px; font-weight: 400; line-height: 1; transition: transform .18s ease; }
.pathway:hover .pathway-arrow { transform: translateX(4px); }

.home-page .home-projects { margin: 0 16px; padding: 28px 0 15px; border-radius: 14px; background: #f0f7fb; }
.home-page .home-projects > .shell { padding: 0; background: transparent; }
.home-page .home-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 35px; margin-bottom: 14px; }
.home-page .home-section-heading h2 { margin: 0; color: #102641; font-size: clamp(28px, 3.1vw, 36px); line-height: 1.05; }
.home-page .home-section-heading > p { max-width: 480px; margin: 0 0 2px; color: #52657e; font-size: 15px; line-height: 1.5; }
.home-page .home-project-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; }
.home-page .home-project-card { position: relative; display: flex; min-height: 238px; flex-direction: column; align-items: flex-start; padding: 21px 24px 18px; border: 1px solid #edf0f3; border-radius: 14px; background: #fff; box-shadow: none; transition: transform .2s ease, box-shadow .2s ease; }
.home-project-card:hover { transform: translateY(-3px); box-shadow: 0 13px 30px rgba(28, 48, 73, .09); }
.home-project-icon, .documentation-card-icon { display: grid; width: 55px; height: 55px; place-items: center; border-radius: 12px; color: #1c3756; font-size: 12px; font-weight: 800; }
.home-project-icon svg { width: 30px; height: 30px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.project-badge { display: inline-flex; align-items: center; min-height: 25px; padding: 4px 10px; border-radius: 999px; color: #395776; background: #e7f0f9; font-size: 11px; font-weight: 700; }
.home-project-card > .project-badge { position: absolute; top: 22px; right: 21px; }
.badge-current { color: #365975; background: #e5eff8; }
.badge-history { color: #875f47; background: #fff0e7; }
.badge-archive { color: #536b62; background: #e5f0eb; }
.badge-next { color: #5a5483; background: #efedf9; }
.home-page .home-project-card h3 { margin: 10px 0 6px; color: #152944; font-size: 21px; font-weight: 800; letter-spacing: -.04em; }
.home-page .home-project-card p { margin: 0 0 12px; color: #5e6c81; font-size: 14px; line-height: 1.5; }
.home-page .home-project-card .card-link { display: inline-flex; width: 24px; height: 24px; align-items: center; margin-top: auto; color: #315f94; font-size: 23px; line-height: 1; }
.home-page .home-project-card .card-link:hover { transform: translateX(3px); }

.home-page .home-community { margin-top: 10px; padding: 0 14px 10px; }
.home-page .home-community-panel { position: relative; display: grid; width: 100%; max-width: none; min-height: 130px; grid-template-columns: .54fr 1fr; align-items: center; gap: 58px; overflow: hidden; padding: 17px 42px; border-radius: 14px; color: #fff; background: linear-gradient(112deg, #1b3553, #132b48); }
.home-page .home-community-heading { display: flex; min-height: 86px; align-items: center; border-right: 1px solid rgba(179, 204, 231, .45); }
.home-page .home-community-panel h2 { max-width: 385px; margin: 0; color: #fff; font-size: clamp(28px, 3.2vw, 35px); line-height: 1.02; letter-spacing: -.04em; }
.home-page .home-community-panel h2 em { color: #8db5e5; font-style: normal; }
.home-page .home-community-copy { position: relative; z-index: 1; max-width: 465px; }
.home-page .home-community-copy p { margin: 0 0 8px; color: #e2eaf3; font-size: 12px; line-height: 1.45; }
.home-page .home-community-copy .button { min-height: 34px; padding-inline: 16px; border-radius: 8px; color: #18314d; font-size: 12px; }
.home-page .community-line-art { position: absolute; right: 0; bottom: 0; width: 330px; height: 120px; stroke: #85a9cf; stroke-width: 1.25; opacity: .55; }
.home-page .home-footer { padding: 0 0 5px; color: #64748b; background: #fff; text-align: center; }
.home-page .home-footer p { margin: 0; font-size: 12px; }
.home-page .home-footer a { color: #557da9; }

.file-hero, .file-project-hero { padding: 46px 0 62px; background: linear-gradient(108deg, #f8fbff 0%, #f1f6fb 100%); }
.file-hero-grid, .file-project-grid { display: grid; grid-template-columns: minmax(320px, .83fr) minmax(0, 1.17fr); align-items: center; gap: clamp(40px, 6vw, 78px); }
.file-hero-copy h1, .file-project-copy h1 { font-size: clamp(48px, 5vw, 66px); line-height: .98; letter-spacing: -.06em; }
.file-hero-copy h1 em, .file-project-copy h1 em { display: inline-block; }
.file-hero .hero-lede, .file-project-hero .hero-lede, .page-hero .hero-lede { max-width: 570px; margin-bottom: 23px; color: #596b81; font-size: 16px; line-height: 1.65; }
.file-hero .hero-actions, .file-project-hero .hero-actions { margin-bottom: 24px; }
.file-hero .breadcrumbs, .file-project-hero .breadcrumbs { font-size: 12px; }
.code-window { overflow: hidden; border: 1px solid #31516d; border-radius: 16px; color: #d9e5f1; background: #10253d; box-shadow: 0 20px 45px rgba(17, 39, 63, .2); }
.code-window-top { display: flex; min-height: 46px; align-items: center; gap: 13px; padding: 0 15px; border-bottom: 1px solid #314962; background: #112a44; }
.window-controls { display: flex; gap: 6px; }
.window-controls i { width: 9px; height: 9px; border-radius: 50%; background: #7088a2; }
.window-controls i:first-child { background: #d78e79; }
.window-controls i:nth-child(2) { background: #d8bd7a; }
.window-controls i:nth-child(3) { background: #7dad93; }
.window-title { overflow: hidden; color: #d7e2ee; font-size: 11px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.window-status { display: inline-flex; align-items: center; gap: 7px; margin-left: auto; color: #9db1c6; font-size: 10px; white-space: nowrap; }
.code-window-body { display: grid; min-height: 260px; grid-template-columns: minmax(145px, .68fr) minmax(0, 1.32fr); }
.file-tree { padding: 15px 11px; border-right: 1px solid #304862; color: #b4c5d7; background: #122b45; font: 11px/1.8 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.file-tree p { overflow: hidden; margin: 0; padding: 3px 6px; text-overflow: ellipsis; white-space: nowrap; }
.tree-root { color: #e2ebf4; font-weight: 750; }
.tree-root span, .tree-folder span { margin-right: 5px; color: #8fa9c1; }
.tree-folder { margin-top: 7px !important; color: #c8d5e2; }
.tree-file { padding-left: 24px !important; color: #a4b6c9; }
.tree-current, .tree-selected { border-radius: 5px; color: #f1f5fa; background: #213d59; }
.tree-icon { display: inline-grid; min-width: 22px; color: #c2d4e5; font-size: 10px; font-weight: 800; text-align: center; }
.tree-blue { color: #80b5df; }
.tree-purple { color: #b4a8e4; }
.tree-orange { color: #e8a782; }
.tree-green { color: #91c4a4; }
.code-editor { display: flex; min-width: 0; flex-direction: column; }
.editor-tab { display: flex; min-height: 41px; align-items: center; gap: 8px; padding: 0 14px; border-bottom: 1px solid #304862; color: #dce6ef; font-size: 11px; }
.code-editor pre { overflow: auto; flex: 1; margin: 0; padding: 17px 14px; color: #dce6ef; font: 10px/1.9 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; tab-size: 2; }
.code-editor code { padding: 0; border: 0; color: inherit; background: transparent; font: inherit; white-space: pre; }
.code-tag { color: #92c4e5; }
.code-value { color: #d9c293; }
.code-muted { color: #8ba1b7; }
.editor-footer { display: flex; gap: 15px; padding: 8px 14px; border-top: 1px solid #304862; color: #8ca2b8; font-size: 9px; }
.file-project-hero { padding-top: 43px; }
.code-window-project .code-window-body { min-height: 286px; }

.page-hero { padding: 56px 0 39px; background: linear-gradient(108deg, #fbfdff, #f1f6fb); }
.page-hero h1 { max-width: 780px; font-size: clamp(46px, 5vw, 64px); line-height: .98; }
.page-hero .eyebrow { color: #55759b; }
.page-hero::after { height: 2px; background: linear-gradient(90deg, #9cb9dc, #d9e6f2, #edc1a9); }
.directory-hero { padding: 54px 0 36px; }
.directory-hero .hero-lede, .community-hero .hero-lede, .about-hero .hero-lede { max-width: 680px; }
.directory-intro { display: flex; align-items: end; justify-content: space-between; gap: 35px; margin-bottom: 26px; }
.directory-intro h2 { margin: 0; font-size: clamp(31px, 4vw, 43px); }
.directory-intro > p { max-width: 390px; margin: 0 0 4px; color: #5d6c80; font-size: 15px; line-height: 1.6; }
.directory-section { padding-top: 48px; }
.project-directory-card { min-height: 365px; border-radius: 16px; box-shadow: 0 8px 24px rgba(28, 48, 73, .04); }
.project-directory-card h2 { margin-top: 10px; font-size: 24px; }
.project-directory-card p { min-height: 82px; font-size: 14px; line-height: 1.55; }
.project-directory-card .project-glyph { margin: 17px 0 9px; }
.project-directory-card .project-badge { margin-bottom: 2px; }
.project-directory-card .button { margin-top: auto; }
.tag-list { display: flex; flex-wrap: wrap; gap: 7px; margin: 0 0 18px; }
.tag-list span { padding: 5px 9px; border: 1px solid #e2e8ee; border-radius: 999px; color: #617084; background: #fbfcfd; font-size: 11px; }
.directory-next { padding: 0 0 62px; }
.directory-next-panel { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 28px 32px; border: 1px solid #dfe7ef; border-radius: 16px; background: #f7fafe; }
.directory-next-panel h2 { margin: 0 0 7px; font-size: 25px; }
.directory-next-panel p:last-child { margin: 0; color: #69788c; font-size: 14px; }

.documentation-library { padding-top: 62px; }
.documentation-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; }
.documentation-card { display: flex; min-height: 276px; flex-direction: column; align-items: flex-start; padding: 22px; border: 1px solid #e0e7ee; border-radius: 15px; background: #fff; box-shadow: 0 5px 20px rgba(12, 48, 84, .035); }
.documentation-card-featured { border-color: #c9d9eb; background: linear-gradient(148deg, #fff, #f5f9fd); }
.documentation-card .project-badge { margin-bottom: 16px; }
.documentation-card-icon { width: 48px; height: 48px; margin-bottom: 13px; font: 800 11px ui-monospace, SFMono-Regular, Menlo, monospace; }
.documentation-card h3 { margin: 0 0 8px; color: #152944; font-size: 20px; font-weight: 800; letter-spacing: -.04em; }
.documentation-card p { margin: 0 0 16px; color: #5f6e82; font-size: 14px; line-height: 1.55; }
.documentation-card .card-link { margin-top: auto; }

.community-hero, .about-hero { padding: 54px 0 40px; }
.community-paths { padding-top: 54px; }
.community-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.community-card { display: flex; min-height: 297px; flex-direction: column; align-items: flex-start; padding: 26px; border: 1px solid #e0e7ee; border-radius: 16px; background: #fff; }
.community-card .pathway-icon { flex-basis: 58px; width: 58px; height: 58px; margin-bottom: 19px; }
.community-card .section-kicker { margin-bottom: 5px; font-size: 10px; }
.community-card h3 { margin: 0 0 8px; color: #152944; font-size: 23px; font-weight: 800; letter-spacing: -.04em; }
.community-card p:not(.section-kicker) { margin: 0 0 15px; color: #5f6e82; font-size: 14px; line-height: 1.6; }
.community-card .text-link { margin-top: auto; }
.community-next { padding: 0 0 64px; }
.community-next-panel { display: flex; min-height: 185px; align-items: center; justify-content: space-between; gap: 32px; padding: 33px 39px; border-radius: 18px; color: #fff; background: linear-gradient(110deg, #152e4b, #1c4467); }
.community-next-panel h2 { max-width: 690px; margin: 0; color: #fff; font-size: clamp(30px, 4vw, 43px); line-height: 1.08; }
.community-next-panel .button { flex: 0 0 auto; }

.about-content { padding-top: 57px; }
.about-grid { display: grid; grid-template-columns: 1fr .82fr; gap: clamp(48px, 9vw, 115px); align-items: start; }
.about-copy h2 { max-width: 630px; margin: 0 0 17px; font-size: clamp(34px, 4.1vw, 48px); line-height: 1.06; }
.about-copy > p:not(.section-kicker) { max-width: 650px; color: #5d6c80; font-size: 16px; line-height: 1.75; }
.about-facts { overflow: hidden; border: 1px solid #e0e7ee; border-radius: 16px; background: #fff; }
.about-facts > div { display: grid; grid-template-columns: 39px 1fr; gap: 3px 12px; padding: 17px 19px; }
.about-facts > div + div { border-top: 1px solid #e7edf2; }
.fact-number { grid-row: span 2; color: #7f9fc5; font-size: 12px; font-weight: 800; }
.about-facts strong { color: #20354e; font-size: 15px; }
.about-facts small { color: #738195; font-size: 13px; line-height: 1.45; }
.about-sponsor { padding: 0 0 66px; }
.about-sponsor-panel { display: flex; align-items: center; justify-content: space-between; gap: 35px; padding: 29px 33px; border: 1px solid #e1e8ef; border-radius: 16px; background: #f6f9fc; }
.about-sponsor-panel h2 { margin: 0 0 8px; font-size: 27px; }
.about-sponsor-panel p:last-child { max-width: 680px; margin: 0; color: #647287; font-size: 14px; line-height: 1.6; }

.detail-section { padding-top: 49px; }
.detail-layout { gap: 48px; }
.content-block { padding-bottom: 31px; margin-bottom: 31px; }
.content-block h2 { font-size: clamp(27px, 3vw, 36px); }
.content-block > p:not(.section-kicker):not(.caption) { color: #596a80; font-size: 15px; line-height: 1.75; }
.detail-aside { top: 22px; }
.aside-card { border-radius: 15px; background: #f8fafc; }
.aside-card strong { font-size: 14px; }
.aside-card > a:not(.aside-back) { font-size: 12px; }
.aside-label { font-size: 10px; }
.aside-value { font-size: 13px; }
.table-wrap { border-radius: 11px; }
table { font-size: 13px; }
th, td { padding: 10px 12px; }
th { font-size: 11px; }
td { color: #56677c; }
.code-block { font-size: 12px; }
.not-found { min-height: 65vh; padding: 84px 0; background: #f6f9fc; }

.site-footer { padding: 39px 0 17px; background: #132b47; }
.brand-footer .brand-name { color: #c8dcf2; }
.brand-footer .brand-name span { color: #8fb2dc; }
.footer-main > div:first-child p { font-size: 12px; }
.footer-links strong { font-size: 12px; }
.footer-links a { font-size: 12px; }
.footer-bottom { align-items: center; font-size: 11px; }
.footer-bottom a { color: #b5c8da; }
.footer-links a:hover, .footer-bottom a:hover { color: #b4d2f2; }

@media (max-width: 960px) {
  .home-hero-grid { grid-template-columns: minmax(280px, .85fr) minmax(0, 1.15fr); }
  .home-hero h1 { font-size: clamp(54px, 7.2vw, 72px); }
  .pathway { gap: 12px; padding-right: 13px; }
  .pathway + .pathway { padding-left: 15px; }
  .pathway-icon { flex-basis: 54px; width: 54px; height: 54px; }
  .pathway-copy strong { font-size: 15px; }
  .pathway-copy > span { font-size: 12px; }
  .file-hero-grid, .file-project-grid { grid-template-columns: minmax(270px, .85fr) minmax(0, 1.15fr); gap: 28px; }
  .documentation-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-docs { gap: 38px; }
}

@media (max-width: 720px) {
  .shell { width: min(100% - 36px, 1190px); }
  .site-header { padding-top: 5px; }
  .nav-wrap { min-height: 62px; }
  .brand-name { font-size: 24px; }
  .menu-toggle { display: block; }
  .primary-nav { position: absolute; top: calc(100% + 5px); right: 0; left: 0; display: none; align-items: stretch; flex-direction: column; gap: 0; padding: 8px; border: 1px solid #dce4ed; border-radius: 13px; background: #fff; box-shadow: 0 14px 35px rgba(22, 43, 68, .14); }
  .primary-nav.is-open { display: flex; }
  .primary-nav a { padding: 12px 11px; }
  .primary-nav .nav-cta { justify-content: center; margin-top: 4px; }
  .home-hero { padding: 30px 0 20px; }
  .home-hero-grid, .file-hero-grid, .file-project-grid, .home-docs, .about-grid { grid-template-columns: 1fr; }
  .home-hero-grid { gap: 10px; }
  .home-hero h1, .file-hero h1, .file-project-hero h1, .directory-hero h1, .community-hero h1, .about-hero h1 { max-width: 580px; font-size: clamp(48px, 12vw, 66px); }
  .home-lede { max-width: 560px; font-size: 16px; }
  .home-hero .hero-actions { flex-direction: row; }
  .home-hero .hero-actions .button { width: auto; }
  .home-illustration-wrap { margin: 0 -18px; }
  .home-illustration { max-width: 620px; }
  .pathways { grid-template-columns: 1fr; margin-bottom: 17px; }
  .pathway { min-height: 93px; padding: 12px 4px; }
  .pathway + .pathway { padding-left: 4px; border-top: 1px solid #e2e7ed; border-left: 0; }
  .pathway-icon { flex-basis: 58px; width: 58px; height: 58px; }
  .pathway-copy { max-width: none; }
  .pathway-copy strong { font-size: 16px; }
  .pathway-copy > span { font-size: 13px; }
  .home-projects { padding-top: 30px; }
  .home-projects > .shell { padding: 27px 18px 20px; border-radius: 16px; }
  .home-section-heading, .directory-intro { align-items: flex-start; flex-direction: column; gap: 10px; }
  .home-section-heading > p, .directory-intro > p { max-width: 560px; }
  .home-project-grid, .documentation-grid, .community-grid, .directory-grid { grid-template-columns: 1fr; }
  .home-project-card, .project-directory-card, .documentation-card, .community-card { min-height: 0; }
  .home-project-card p, .project-directory-card p { min-height: 0; }
  .home-docs { gap: 29px; padding-top: 58px; padding-bottom: 59px; }
  .home-docs-copy h2 { font-size: 39px; }
  .docs-file-list > a { min-height: 62px; padding-inline: 12px; }
  .docs-file-list strong { font-size: 13px; }
  .docs-file-list small { font-size: 11px; }
  .home-community-panel { grid-template-columns: 1fr; gap: 20px; padding: 26px 23px; }
  .home-community-panel h2 { max-width: 460px; font-size: 34px; }
  .home-community-copy { max-width: 480px; }
  .community-line-art { right: -35px; width: 205px; opacity: .28; }
  .home-community-copy .button { position: relative; z-index: 1; }
  .file-hero, .file-project-hero { padding: 30px 0 43px; }
  .file-hero-grid, .file-project-grid { gap: 27px; }
  .file-hero-copy h1, .file-project-copy h1 { font-size: 50px; }
  .code-window-body { grid-template-columns: minmax(130px, .63fr) minmax(0, 1.37fr); }
  .file-tree { padding: 12px 7px; font-size: 9px; }
  .code-editor pre { padding: 13px 9px; font-size: 8px; }
  .editor-tab { padding-inline: 9px; font-size: 9px; }
  .editor-footer { gap: 9px; padding-inline: 9px; font-size: 8px; }
  .directory-hero, .community-hero, .about-hero { padding: 31px 0 28px; }
  .directory-section, .documentation-library, .community-paths, .about-content { padding-top: 38px; }
  .project-directory-card .button { width: 100%; }
  .directory-next-panel, .community-next-panel, .about-sponsor-panel { align-items: flex-start; flex-direction: column; padding: 24px 22px; }
  .community-next-panel h2 { font-size: 34px; }
  .about-grid { gap: 28px; }
  .about-sponsor-panel .button { width: 100%; }
  .detail-layout { grid-template-columns: 1fr; gap: 24px; }
  .detail-aside { position: static; grid-row: auto; }
  .aside-card { grid-template-columns: 1fr 1fr; }
  .footer-main { flex-direction: column; gap: 27px; }
  .footer-links { flex-wrap: wrap; justify-content: space-between; gap: 20px 28px; }
  .footer-links > div { min-width: 115px; }
  .footer-bottom { align-items: flex-start; flex-direction: column; gap: 7px; }
}

@media (max-width: 480px) {
  .home-hero .hero-actions { align-items: stretch; flex-direction: column; }
  .home-hero .hero-actions .button { width: 100%; }
  .home-hero h1 { font-size: 48px; }
  .pathway-icon { flex-basis: 51px; width: 51px; height: 51px; }
  .pathway-arrow { font-size: 19px; }
  .docs-file-heading { padding-inline: 12px; }
  .file-heading-label { font-size: 8px; }
  .file-tree { display: none; }
  .code-window-body, .code-window-project .code-window-body { grid-template-columns: 1fr; }
  .code-editor pre { min-height: 155px; font-size: 10px; }
  .window-title { font-size: 10px; }
  .window-status { font-size: 9px; }
  .page-hero h1 { font-size: 45px; }
  .aside-card { grid-template-columns: 1fr 1fr; }
  .table-wrap { margin-inline: -6px; }
  th, td { min-width: 96px; padding: 8px; }
}

@media (max-width: 960px) {
  .home-page .home-hero-grid { min-height: 400px; grid-template-columns: minmax(290px, .92fr) minmax(0, 1.08fr); }
  .home-page .home-hero h1 { font-size: clamp(56px, 7vw, 68px); }
  .home-page .home-illustration-wrap { height: 400px; margin-right: -48px; }
  .home-page .pathway { gap: 12px; padding-right: 13px; }
  .home-page .pathway + .pathway { padding-left: 15px; }
  .home-page .pathway-icon { flex-basis: 54px; width: 54px; height: 54px; }
  .home-page .pathway-copy strong { font-size: 15px; }
  .home-page .pathway-copy > span { font-size: 12px; }
  .home-page .home-project-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-page .home-project-card:last-child { grid-column: 1 / -1; }
  .home-page .primary-nav .nav-github { margin-left: 0; }
  .home-page .home-community-panel { gap: 35px; padding-inline: 30px; }
}

@media (max-width: 720px) {
  .home-page .shell { width: min(100% - 36px, 1200px); }
  .home-page .nav-wrap { min-height: 64px; position: relative; }
  .home-page .brand-name { font-size: 27px; }
  .home-page .primary-nav { position: absolute; top: calc(100% + 5px); right: 0; left: 0; display: none; align-items: stretch; flex-direction: column; gap: 0; padding: 8px; border: 1px solid #dce4ed; border-radius: 13px; background: #fff; box-shadow: 0 14px 35px rgba(22, 43, 68, .14); }
  .home-page .primary-nav.is-open { display: flex; }
  .home-page .primary-nav a { padding: 12px 11px; }
  .home-page .primary-nav .nav-github { justify-content: center; margin-top: 4px; margin-left: 0; }
  .home-page .home-hero { padding: 22px 0 0; }
  .home-page .home-hero-grid { min-height: 0; grid-template-columns: 1fr; gap: 6px; }
  .home-page .home-hero-copy { padding: 0; transform: none; }
  .home-page .home-hero h1 { max-width: 560px; margin-bottom: 15px; font-size: clamp(49px, 11vw, 67px); }
  .home-page .home-lede { max-width: 540px; margin-bottom: 18px; font-size: 16px; }
  .home-page .home-hero .hero-actions { gap: 10px; }
  .home-page .home-hero .hero-actions .button { min-height: 46px; padding-inline: 14px; font-size: 12px; }
  .home-page .home-illustration-wrap { height: auto; max-height: 335px; margin: 0 -18px; overflow: hidden; }
  .home-page .home-illustration { width: 100%; height: auto; max-width: 620px; object-fit: contain; -webkit-mask-image: none; mask-image: none; }
  .home-page .pathways { grid-template-columns: 1fr; margin-top: 22px; margin-bottom: 17px; }
  .home-page .pathway { min-height: 88px; gap: 14px; padding: 12px 4px; transform: none; }
  .home-page .pathway + .pathway { padding-left: 4px; border-top: 1px solid #e2e7ed; border-left: 0; }
  .home-page .pathway-icon { flex-basis: 56px; width: 56px; height: 56px; }
  .home-page .pathway-copy { max-width: none; }
  .home-page .pathway-copy strong { font-size: 16px; }
  .home-page .pathway-copy > span { font-size: 13px; }
  .home-page .home-projects { margin-inline: 8px; padding: 25px 0 20px; }
  .home-page .home-section-heading { align-items: flex-start; flex-direction: column; gap: 8px; margin-bottom: 17px; }
  .home-page .home-section-heading h2 { font-size: 30px; }
  .home-page .home-section-heading > p { font-size: 14px; }
  .home-page .home-project-grid { grid-template-columns: 1fr; }
  .home-page .home-project-card:last-child { grid-column: auto; }
  .home-page .home-project-card { min-height: 220px; }
  .home-page .home-community { margin-top: 18px; padding: 0 8px 7px; }
  .home-page .home-community-panel { min-height: 0; grid-template-columns: 1fr; gap: 16px; padding: 24px 22px; }
  .home-page .home-community-heading { min-height: 0; padding-bottom: 15px; border-right: 0; border-bottom: 1px solid rgba(179, 204, 231, .45); }
  .home-page .home-community-panel h2 { max-width: 460px; font-size: 32px; }
  .home-page .home-community-copy { max-width: 490px; }
  .home-page .home-community-copy p { font-size: 13px; }
  .home-page .community-line-art { right: -42px; width: 205px; opacity: .24; }
  .home-page .home-footer { padding: 0 0 8px; }
}

@media (max-width: 480px) {
  .home-page .home-hero h1 { font-size: 48px; }
  .home-page .home-hero .hero-actions { align-items: stretch; flex-direction: column; }
  .home-page .home-hero .hero-actions .button { width: 100%; }
  .home-page .home-illustration-wrap { max-height: 255px; }
  .home-page .home-projects > .shell { width: min(100% - 28px, 1200px); }
}

.validator-panel { display: grid; gap: 14px; max-width: 760px; margin-top: 22px; }
.validator-dropzone { display: grid; min-height: 205px; justify-items: center; align-content: center; gap: 7px; padding: 26px; border: 1px dashed #9fb7d0; border-radius: 14px; color: var(--navy-900); background: linear-gradient(135deg, #f8fbfe, #f1f7fc); text-align: center; cursor: pointer; transition: border-color .18s ease, background .18s ease, box-shadow .18s ease; }
.validator-dropzone:hover, .validator-dropzone:focus-within, .validator-dropzone.is-dragover { border-color: var(--blue); background: #edf5fc; box-shadow: 0 0 0 4px rgba(125, 159, 205, .11); }
.validator-drop-icon { display: grid; width: 48px; height: 48px; place-items: center; margin-bottom: 4px; border-radius: 12px; color: #25496d; background: #dcebf7; font-size: 12px; font-weight: 850; letter-spacing: .06em; }
.validator-dropzone strong { font-size: 16px; }
.validator-dropzone > span:last-child { color: var(--muted); font-size: 12px; }
.validator-file-input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; }
.validator-file-name { margin: 0; color: var(--navy-900); font-size: 13px; font-weight: 700; overflow-wrap: anywhere; }
.validator-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.validator-actions .button { cursor: pointer; }
.validator-actions .button:disabled { opacity: .45; cursor: not-allowed; transform: none; box-shadow: none; }
.validator-privacy { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.65; }
.validator-status { padding: 13px 15px; border: 1px solid var(--line); border-radius: 9px; color: #536d84; background: #f8fbfe; font-size: 13px; line-height: 1.6; }
.validator-status[data-state="working"] { border-color: #cddff1; color: #315879; background: #f0f7fd; }
.validator-status[data-state="success"] { border-color: #c4e4d5; color: #276349; background: #f0faf5; }
.validator-status[data-state="error"] { border-color: #edcaca; color: #8a3535; background: #fff6f6; }
.validator-findings { display: grid; gap: 9px; padding: 0; margin: 0; list-style: none; }
.validator-finding { display: grid; gap: 4px; padding: 12px 14px; border: 1px solid #edcaca; border-radius: 9px; color: #724141; background: #fffafa; font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
.validator-finding strong { color: #792e2e; font-size: 11px; }
.validator-finding-schematron { border-color: #ecdab7; color: #6d5a34; background: #fffcf5; }
.validator-finding-schematron strong { color: #725315; }
.validator-finding-error { border-color: #e8c2c2; }
@media (max-width: 640px) {
  .validator-dropzone { min-height: 175px; padding: 22px 16px; }
  .validator-actions { align-items: stretch; flex-direction: column; }
  .validator-actions .button { width: 100%; }
}
