:root{
  --paper:#f2ebdb;--paper-deep:#e8dfcc;--paper-soft:#fbf6ea;--ink:#0f2640;--ink-soft:#3a4f6b;--ink-faint:#738098;--rule:#1b3149;--terra:#a8442c;--terra-soft:#d38a6e;--ochre:#b68b3d;--ochre-deep:#8e6a28;--white:#fffaf0;--shadow:0 28px 80px rgba(15,38,64,.14);--radius:22px;--mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;--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);font-family:var(--sans);background:radial-gradient(circle at 12% 2%,rgba(168,68,44,.12),transparent 28%),radial-gradient(circle at 88% 10%,rgba(182,139,61,.16),transparent 32%),linear-gradient(180deg,var(--paper),var(--paper-deep));min-height:100vh}body:before{content:"";position:fixed;inset:0;z-index:-1;opacity:.18;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 220 220' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E")}.skip{position:absolute;left:-999px;top:auto}.skip:focus{left:16px;top:16px;background:var(--ink);color:var(--paper);padding:10px 14px;z-index:1000;border-radius:8px}a{color:inherit}.site-header{position:sticky;top:0;z-index:50;background:rgba(242,235,219,.88);backdrop-filter:blur(18px);border-bottom:1px solid rgba(27,49,73,.18)}.nav{width:min(1180px,calc(100% - 40px));margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:16px 0}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;font-weight:850;letter-spacing:-.03em}.brand-mark{width:42px;height:42px;display:inline-block;border-radius:14px;background:url("./assets/ai-augmented-ea-logo.svg") center/contain no-repeat;box-shadow:0 10px 28px rgba(15,38,64,.18)}.nav-links{display:flex;align-items:center;gap:20px;font-size:14px;color:var(--ink-soft)}.nav-links a{text-decoration:none;position:relative}.nav-links a:after{content:"";position:absolute;left:0;right:0;bottom:-7px;height:1px;background:var(--terra);transform:scaleX(0);transform-origin:left;transition:.18s}.nav-links a:hover:after{transform:scaleX(1)}.wrap,.hero,.page-hero,.article-shell{width:min(1180px,calc(100% - 40px));margin:0 auto}.hero{display:grid;grid-template-columns:1.05fr .95fr;gap:52px;align-items:center;padding:80px 0 56px}.frontispiece{position:relative;padding:34px;border:1px solid rgba(27,49,73,.24);background:linear-gradient(180deg,rgba(255,250,240,.62),rgba(232,223,204,.42));box-shadow:var(--shadow);border-radius:32px}.frontispiece:before,.frontispiece:after{content:"";position:absolute;inset:16px;border:1px solid rgba(168,68,44,.18);border-radius:24px;pointer-events:none}.frontispiece:after{inset:27px;border-color:rgba(27,49,73,.14)}.pill{display:inline-flex;align-items:center;width:max-content;border:1px solid rgba(168,68,44,.35);border-radius:999px;padding:8px 12px;color:var(--terra);background:rgba(255,250,240,.56);font:700 12px/1 var(--mono);text-transform:uppercase;letter-spacing:.08em;margin-bottom:18px}h1,h2,h3{letter-spacing:-.045em}h1{font-family:var(--serif);font-size:clamp(56px,8vw,104px);line-height:.9;margin:0;color:var(--ink)}.gradient{color:var(--terra)}.lead{font-size:20px;line-height:1.65;color:var(--ink-soft);max-width:760px;margin:26px 0 0}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.button{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:999px;padding:12px 18px;text-decoration:none;font-weight:800;background:var(--terra);color:var(--white);border:1px solid rgba(15,38,64,.18);box-shadow:0 10px 26px rgba(168,68,44,.18)}.button.secondary{background:rgba(255,250,240,.55);color:var(--ink);border-color:rgba(27,49,73,.28);box-shadow:none}.button:hover{filter:brightness(.98);transform:translateY(-1px)}.metric{display:flex;gap:14px;flex-wrap:wrap;margin-top:32px}.metric div{min-width:140px;padding:18px;border:1px solid rgba(27,49,73,.16);border-radius:18px;background:rgba(255,250,240,.45)}.metric strong{display:block;font:800 28px/1 var(--serif);color:var(--terra)}.metric span{font-size:13px;color:var(--ink-soft)}.portrait-card,.atlas-preview{position:relative;border-radius:32px;border:1px solid rgba(27,49,73,.25);background:rgba(255,250,240,.38);box-shadow:var(--shadow);overflow:hidden}.portrait-card img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;filter:saturate(.88) sepia(.08)}.portrait-overlay{position:absolute;left:20px;right:20px;bottom:20px;padding:18px;border-radius:18px;background:rgba(242,235,219,.86);border:1px solid rgba(27,49,73,.2)}.portrait-overlay strong{display:block}.portrait-overlay span{display:block;margin-top:6px;color:var(--ink-soft)}.atlas-preview{min-height:440px;padding:28px}.atlas-preview .map{position:absolute;inset:26px;border:1px solid rgba(27,49,73,.18);border-radius:24px;background-image:linear-gradient(rgba(15,38,64,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(15,38,64,.06) 1px,transparent 1px);background-size:34px 34px}.atlas-node{position:absolute;border:1px solid var(--terra);background:rgba(255,250,240,.8);color:var(--ink);border-radius:12px;padding:8px 10px;font:700 11px/1.15 var(--mono);box-shadow:0 8px 24px rgba(15,38,64,.08)}.atlas-line{position:absolute;height:1px;background:rgba(15,38,64,.26);transform-origin:left}.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin:32px 0 24px}.section-head h2{font-family:var(--serif);font-size:clamp(34px,4.8vw,58px);line-height:1;margin:0}.section-head p{max-width:540px;color:var(--ink-soft);line-height:1.6;margin:0}.one-line{white-space:normal}.grid{display:grid;gap:18px}.cols-2{grid-template-columns:repeat(2,1fr)}.cols-3{grid-template-columns:repeat(3,1fr)}.card,.chapter-card,.atlas-card{border:1px solid rgba(27,49,73,.22);background:linear-gradient(180deg,rgba(255,250,240,.62),rgba(232,223,204,.44));border-radius:24px;padding:26px;box-shadow:0 16px 50px rgba(15,38,64,.07)}.card h3,.chapter-card h3{font-family:var(--serif);font-size:27px;line-height:1.05;margin:0 0 12px}.card p,.chapter-card p{color:var(--ink-soft);line-height:1.65;margin:0 0 16px}.page-hero{padding:74px 0 30px}.page-title h1{font-size:clamp(48px,7vw,86px)}.page-title p{font-size:20px;max-width:760px;color:var(--ink-soft);line-height:1.6}.chapter-list{display:grid;gap:16px}.chapter-card{display:grid;grid-template-columns:70px 1fr;gap:18px}.chapter-index{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;font:800 19px var(--serif);color:var(--terra);border:1px solid rgba(168,68,44,.5);background:rgba(255,250,240,.6)}.chapter-card a{text-decoration:none}.article-shell{padding:42px 0 80px}.article-hero{border-bottom:1px solid rgba(27,49,73,.24);padding:40px 0 32px;margin-bottom:28px}.article-hero .chapter-kicker{font:800 12px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--terra)}.article-hero h1{font-size:clamp(42px,6vw,78px);max-width:980px}.article-body{max-width:820px;margin:0 auto;font-size:19px;line-height:1.78;color:var(--ink)}.article-body p{margin:0 0 1.2em}.article-body h2{font-family:var(--serif);font-size:clamp(30px,4vw,46px);line-height:1.08;margin:2em 0 .7em;color:var(--ink)}.article-body h3{font-family:var(--serif);font-size:28px;margin:1.6em 0 .6em}.article-body ul,.article-body ol{margin:1em 0 1.4em 1.25em;padding-left:1.1em;color:var(--ink)}.article-body li{margin:.45em 0;padding-left:.25em;line-height:1.7;color:var(--ink)}.article-body li p{margin:.2em 0;color:var(--ink);font:inherit;line-height:inherit}.article-body li::marker{color:var(--terra)}.article-body a{color:var(--terra);text-decoration-thickness:1px;text-underline-offset:3px}.article-body img{display:block;max-width:100%;height:auto;margin:2em auto;border-radius:18px;border:1px solid rgba(27,49,73,.18);background:var(--white);box-shadow:0 20px 60px rgba(15,38,64,.12);padding:12px}.article-body figure{margin:2.3em 0;text-align:center}.article-body figcaption{font:700 13px/1.4 var(--mono);color:var(--ink-soft);text-transform:uppercase;letter-spacing:.05em;margin-top:12px}.article-body pre{position:relative;margin:2em 0;padding:44px 22px 22px;border:1px solid rgba(27,49,73,.28);border-radius:18px;background:linear-gradient(180deg,#fffaf0,#efe3cf);color:var(--ink);overflow-x:auto;box-shadow:0 18px 50px rgba(15,38,64,.08)}.article-body pre:before{content:"Code listing";position:absolute;top:0;left:0;right:0;height:30px;padding:8px 14px;border-bottom:1px solid rgba(27,49,73,.18);font:800 11px/1 var(--mono);text-transform:uppercase;letter-spacing:.12em;color:var(--terra);background:rgba(168,68,44,.06)}.article-body pre code{font:14px/1.55 var(--mono);white-space:pre;color:var(--ink);background:transparent;padding:0;border:0}.article-body :not(pre)>code{font: .88em var(--mono);background:rgba(168,68,44,.08);border:1px solid rgba(168,68,44,.18);border-radius:6px;padding:.08em .32em;color:var(--terra)}.article-nav{max-width:820px;margin:48px auto 0;display:flex;justify-content:space-between;gap:16px}.article-nav a{flex:1;text-decoration:none;border:1px solid rgba(27,49,73,.22);border-radius:16px;padding:16px;background:rgba(255,250,240,.45);color:var(--ink)}.atlas-page{width:min(1400px,calc(100% - 36px));margin:0 auto;padding:50px 0 70px}.atlas-layout{display:grid;grid-template-columns:1fr 360px;gap:18px;align-items:start}.atlas-toolbar{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0}.atlas-toolbar input{flex:1;min-width:260px;border:1px solid rgba(27,49,73,.25);background:rgba(255,250,240,.6);padding:12px 14px;border-radius:999px;color:var(--ink);font:600 14px var(--sans)}.atlas-stage{border:1px solid rgba(27,49,73,.25);border-radius:26px;background:linear-gradient(180deg,rgba(255,250,240,.62),rgba(232,223,204,.42));box-shadow:var(--shadow);overflow:hidden}.atlas-svg{width:100%;height:auto;display:block}.zone-rect{fill:rgba(255,250,240,.35);stroke:rgba(15,38,64,.22);stroke-width:1}.zone-label{font:800 20px Georgia,serif;letter-spacing:.08em;fill:#0f2640}.edge{stroke:rgba(15,38,64,.28);stroke-width:2;fill:none}.node-rect{fill:#fffaf0;stroke:#a8442c;stroke-width:2;rx:14}.node-text{font:800 17px ui-monospace,monospace;fill:#0f2640}.node-sub{font:700 12px ui-monospace,monospace;fill:#a8442c}.node-group{cursor:pointer}.node-group.dim{opacity:.22}.node-group.active .node-rect{stroke:#0f2640;stroke-width:4;fill:#f7ead3}.atlas-side{position:sticky;top:86px;border:1px solid rgba(27,49,73,.25);background:linear-gradient(180deg,rgba(255,250,240,.72),rgba(232,223,204,.55));border-radius:24px;padding:22px;box-shadow:0 16px 50px rgba(15,38,64,.08)}.atlas-side h2{font-family:var(--serif);font-size:32px;line-height:1.05;margin:0 0 10px}.atlas-side p{color:var(--ink-soft);line-height:1.55}.atlas-side .meta{font:800 12px var(--mono);color:var(--terra);text-transform:uppercase;letter-spacing:.08em}.field-list{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0}.field-list span{font:700 11px var(--mono);border:1px solid rgba(27,49,73,.18);border-radius:999px;padding:6px 8px;background:rgba(255,250,240,.55)}footer{border-top:1px solid rgba(27,49,73,.18);margin-top:60px}.footer-inner{width:min(1180px,calc(100% - 40px));margin:0 auto;padding:30px 0;display:flex;justify-content:space-between;gap:24px;color:var(--ink-soft)}.footer-inner strong{color:var(--ink)}.footer-links{display:flex;gap:16px;align-items:center}.footer-links a{color:var(--terra);font-weight:800;text-decoration:none}@media(max-width:960px){.hero,.atlas-layout,.cols-2,.cols-3{grid-template-columns:1fr}.nav{align-items:flex-start}.nav-links{gap:12px;flex-wrap:wrap;justify-content:flex-end}.section-head{display:block}.atlas-side{position:relative;top:auto}.article-body{font-size:17px}.footer-inner{display:block}.footer-links{margin-top:12px}.chapter-card{grid-template-columns:1fr}.one-line{white-space:normal}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.book-hero{padding-top:58px}.book-preview{min-height:420px}.brand span:last-child{white-space:nowrap}.nav{gap:22px}.nav-links{flex-wrap:wrap}.cols-1{grid-template-columns:1fr}
@media(max-width:1040px){.brand span:last-child{white-space:normal}.nav{align-items:flex-start}}

/* v3 layout corrections */
.home-hero{padding:88px 0 42px;text-align:left;max-width:1100px}.home-kicker{font:800 13px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--terra);margin-bottom:18px}.home-hero h1{font-size:clamp(58px,9vw,116px);max-width:980px}.home-tagline{font-family:var(--serif);font-size:clamp(28px,4vw,48px);line-height:1.05;margin:18px 0 0;color:var(--ink)}.home-lead{font-size:20px;line-height:1.65;color:var(--ink-soft);max-width:820px;margin:24px 0 0}.home-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.dual-feature{display:grid;grid-template-columns:1fr 1fr;gap:22px;padding:28px 0 54px}.feature-plate{position:relative;min-height:360px;border:1px solid rgba(27,49,73,.24);background:linear-gradient(180deg,rgba(255,250,240,.68),rgba(232,223,204,.42));border-radius:32px;padding:34px;box-shadow:var(--shadow);overflow:hidden}.feature-plate:before{content:"";position:absolute;inset:18px;border:1px solid rgba(168,68,44,.16);border-radius:24px;pointer-events:none}.feature-plate h2{font-family:var(--serif);font-size:clamp(38px,4.8vw,62px);line-height:.96;margin:0 0 18px}.feature-plate p{font-size:18px;line-height:1.65;color:var(--ink-soft);max-width:640px}.feature-plate code{font-family:var(--mono);color:var(--terra);background:rgba(168,68,44,.08);border:1px solid rgba(168,68,44,.18);border-radius:6px;padding:.1em .35em}.plate-number{position:absolute;right:28px;top:18px;font:800 92px/1 var(--serif);color:rgba(168,68,44,.10)}.atlas-feature{background:radial-gradient(circle at 70% 25%,rgba(182,139,61,.18),transparent 35%),linear-gradient(180deg,rgba(255,250,240,.7),rgba(232,223,204,.45))}.method-chain{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}.method-chain>div{position:relative;border:1px solid rgba(27,49,73,.22);border-radius:24px;padding:24px;background:linear-gradient(180deg,rgba(255,250,240,.62),rgba(232,223,204,.44));min-height:240px}.method-chain span{font:800 12px var(--mono);color:var(--terra);letter-spacing:.12em}.method-chain h3{font-family:var(--serif);font-size:30px;margin:22px 0 10px}.method-chain p{color:var(--ink-soft);line-height:1.6}.book-page-head{padding-bottom:22px}.book-intro{max-width:900px}.about-layout{display:grid;grid-template-columns:minmax(280px,390px) 1fr;gap:28px;align-items:start}.about-portrait{position:sticky;top:96px}.bio-card{font-size:16.5px;line-height:1.72;max-width:780px}.bio-card p{font-size:16.5px;line-height:1.72;margin:0 0 1em;color:var(--ink-soft)}.bio-card .bio-opening{font-family:var(--serif);font-size:30px;line-height:1.12;color:var(--ink);margin-bottom:.7em}.atlas-shell{overflow:auto;background:#f2ebdb}.atlas-embedded{min-height:calc(100vh - 75px)}.atlas-embedded #root{min-height:calc(100vh - 75px)}.atlas-shell .site-header{position:sticky;top:0}.atlas-shell .nav{font-family:var(--sans)}.link{color:var(--terra);font-weight:800;text-decoration:none}.link:hover{text-decoration:underline;text-underline-offset:4px}@media(max-width:980px){.dual-feature,.about-layout,.method-chain{grid-template-columns:1fr}.about-portrait{position:relative;top:auto}.home-hero{padding-top:56px}.feature-plate{min-height:auto}}


/* v4 requested IA and fit-to-screen refinements */
.nav-group{position:relative;display:inline-flex;align-items:center}.nav-group>a{padding-right:14px}.nav-group>a:before{content:"⌄";position:absolute;right:0;top:0;color:var(--terra);font-size:12px}.nav-menu{position:absolute;top:28px;left:-14px;min-width:150px;padding:10px;border:1px solid rgba(27,49,73,.20);background:rgba(255,250,240,.96);box-shadow:0 18px 50px rgba(15,38,64,.12);border-radius:14px;display:none;z-index:80}.nav-group:hover .nav-menu,.nav-group:focus-within .nav-menu{display:grid;gap:6px}.nav-menu a{display:block;padding:9px 10px;border-radius:10px;color:var(--ink-soft)}.nav-menu a:hover{background:rgba(168,68,44,.08);color:var(--terra)}.nav-menu a:after{display:none}.home-fit{min-height:calc(100vh - 75px);display:flex;flex-direction:column;justify-content:center}.compact-home{padding:28px 0 12px}.compact-home h1{font-size:clamp(50px,7vw,92px)}.compact-home .home-tagline{font-size:clamp(26px,3.4vw,42px);margin-top:12px}.home-lead.compact{font-size:18px;line-height:1.48;max-width:900px;margin-top:16px}.compact-home .home-actions{margin-top:18px}.home-two-boxes{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:12px 0 28px}.compact-plate{min-height:245px;padding:26px}.compact-plate h2{font-size:clamp(34px,4vw,52px);margin-bottom:12px}.compact-plate p{font-size:16px;line-height:1.5;margin-bottom:18px}.compact-plate .pill{margin-bottom:12px}.compact-plate .plate-number{font-size:72px;right:22px}.home-footer{margin-top:0}.home-footer .footer-inner{padding:18px 0}.approach-fit{min-height:calc(100vh - 75px);display:flex;align-items:center}.approach-compact{padding:28px 0}.approach-compact .page-title h1{font-size:clamp(42px,5.8vw,72px);max-width:1100px}.approach-compact .page-title p{font-size:18px;line-height:1.5;max-width:980px}.approach-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:24px}.approach-grid .card{padding:22px}.approach-grid .card h3{font-size:25px}.approach-grid .card p{line-height:1.5}.compact-chain{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:18px}.compact-chain span{display:grid;place-items:center;min-height:58px;border:1px solid rgba(168,68,44,.32);border-radius:999px;background:rgba(255,250,240,.55);font:800 13px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--terra)}@media(max-height:760px){.compact-home h1{font-size:clamp(44px,6vw,76px)}.home-lead.compact{font-size:16.5px}.compact-plate{min-height:210px}.compact-plate h2{font-size:38px}.compact-plate p{font-size:15px}.approach-compact .page-title h1{font-size:52px}.approach-compact .page-title p{font-size:16.5px}.approach-grid .card{padding:18px}.compact-chain span{min-height:48px}.footer-inner p{margin:.25em 0}}@media(max-width:900px){.home-fit,.approach-fit{min-height:auto;display:block}.home-two-boxes,.approach-grid,.compact-chain{grid-template-columns:1fr}.compact-home{padding-top:44px}.nav-menu{position:static;display:grid;background:transparent;box-shadow:none;border:0;padding:0}.nav-group{display:grid}.nav-group>a:before{display:none}}

/* v4b stricter homepage fit */
.compact-home{padding:18px 0 6px}.compact-home h1{font-size:clamp(42px,5.8vw,70px);line-height:.9}.compact-home .home-tagline{font-size:clamp(22px,2.7vw,32px);margin-top:8px}.home-lead.compact{font-size:16px;line-height:1.42;max-width:860px;margin-top:12px}.compact-home .home-actions{margin-top:14px}.home-two-boxes{padding:8px 0 16px}.compact-plate{min-height:178px;padding:20px 22px}.compact-plate h2{font-size:clamp(28px,3.2vw,40px);margin-bottom:8px}.compact-plate p{font-size:14.5px;line-height:1.42;margin-bottom:12px}.compact-plate .pill{margin-bottom:8px;padding:6px 10px}.compact-plate .button{padding:10px 15px}.compact-plate .plate-number{font-size:58px}.home-footer .footer-inner{padding:12px 0;font-size:14px}.home-footer .footer-inner p{margin:.2em 0}@media(max-height:720px){.site-header .nav{padding:12px 0}.home-fit{min-height:calc(100vh - 65px)}.compact-home h1{font-size:58px}.compact-home .home-tagline{font-size:26px}.home-lead.compact{font-size:15px}.compact-plate{min-height:160px}.compact-plate h2{font-size:32px}.compact-plate p{font-size:13.8px}.home-footer .footer-inner{padding:8px 0}}

/* v5 homepage restoration and EA Codex page */
.home-hero-v5{min-height:calc(100vh - 170px);display:grid;grid-template-columns:minmax(0,1.18fr) minmax(280px,.82fr);gap:42px;align-items:center;padding:48px 0 26px}.home-copy-v5 h1{font-size:clamp(54px,7.4vw,104px);line-height:.88;max-width:980px}.home-copy-v5 .home-tagline{font-size:clamp(28px,3.4vw,44px);max-width:1000px}.home-side-v5{position:relative;min-height:410px;border:1px solid rgba(27,49,73,.22);border-radius:34px;background:linear-gradient(180deg,rgba(255,250,240,.64),rgba(232,223,204,.40));box-shadow:var(--shadow);padding:28px;overflow:hidden}.home-side-v5:before{content:"";position:absolute;inset:20px;border:1px solid rgba(168,68,44,.15);border-radius:26px;pointer-events:none}.home-side-v5 p{position:absolute;left:28px;right:28px;bottom:24px;margin:0;color:var(--ink-soft);line-height:1.55;font-size:16px}.codex-mini-map{position:absolute;inset:28px 28px 88px 28px;border:1px solid rgba(27,49,73,.14);border-radius:24px;background-image:linear-gradient(rgba(15,38,64,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(15,38,64,.055) 1px,transparent 1px);background-size:32px 32px}.codex-mini-map span{position:absolute;transform:translate(-50%,-50%);border:1px solid rgba(168,68,44,.56);background:rgba(255,250,240,.74);border-radius:999px;padding:8px 11px;color:var(--ink);font:800 11px/1 var(--mono);box-shadow:0 12px 30px rgba(15,38,64,.08)}.home-strip-v5{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding:0 0 34px}.home-strip-v5 article{border:1px solid rgba(27,49,73,.18);background:rgba(255,250,240,.48);border-radius:22px;padding:20px}.home-strip-v5 strong{display:block;font-family:var(--serif);font-size:24px;letter-spacing:-.035em;margin-bottom:8px}.home-strip-v5 span{display:block;color:var(--ink-soft);line-height:1.5;font-size:15px}.codex-page-hero{padding-bottom:12px}.codex-dual{padding-top:4px}.codex-dual .feature-plate{min-height:320px}.codex-dual .feature-plate h2{font-size:clamp(40px,4.8vw,64px)}@media(max-width:980px){.home-hero-v5,.home-strip-v5{grid-template-columns:1fr}.home-hero-v5{min-height:auto;padding-top:42px}.home-side-v5{min-height:330px}.codex-dual{grid-template-columns:1fr}}@media(max-height:760px) and (min-width:981px){.home-hero-v5{min-height:auto;padding-top:34px}.home-copy-v5 h1{font-size:76px}.home-copy-v5 .home-tagline{font-size:32px}.home-side-v5{min-height:320px}.codex-mini-map{inset:24px 24px 78px 24px}.home-strip-v5{padding-bottom:20px}.home-strip-v5 article{padding:16px}.home-strip-v5 strong{font-size:21px}.home-strip-v5 span{font-size:14px}.home-footer .footer-inner{padding:12px 0}}

/* v6 editorial refinements: tighter rhythm, smaller titles, cleaner plates */
:root { --hero-top-tight: 34px; }
.hero, .page-hero { padding-top: 42px; }
.page-hero { padding-bottom: 18px; }
.page-title h1 { font-size: clamp(40px, 5.4vw, 68px); line-height: .96; }
.page-title p { font-size: 17px; line-height: 1.52; max-width: 820px; }
.home-hero-v5 { min-height: auto; padding: var(--hero-top-tight) 0 22px; gap: 36px; }
.home-copy-v5 h1 { font-size: clamp(46px, 6.2vw, 82px); line-height: .92; }
.home-copy-v5 .home-tagline { font-size: clamp(24px, 3vw, 36px); line-height: 1.08; margin-top: 12px; }
.home-kicker { margin-bottom: 12px; }
.home-lead { font-size: 17px; line-height: 1.52; margin-top: 16px; }
.home-actions { margin-top: 20px; }
.home-side-v5 { min-height: 330px; padding: 24px; }
.home-side-v5 p { font-size: 15px; line-height: 1.45; bottom: 20px; left: 24px; right: 24px; }
.codex-mini-map { inset: 24px 24px 80px 24px; background-size: 28px 28px; }
.home-strip-v5 { padding: 0 0 24px; gap: 14px; }
.home-strip-v5 article { padding: 18px; }
.home-strip-v5 strong { font-size: 21px; }
.home-strip-v5 span { font-size: 14px; line-height: 1.45; }
.section-head { margin: 22px 0 18px; }
.section-head h2 { font-size: clamp(30px, 3.8vw, 46px); }
.section-head p { font-size: 15.5px; line-height: 1.5; }
.frontispiece { padding: 28px; }
.book-hero, .book-page-head { padding-top: 38px; }
.book-intro { max-width: 820px; }
.book-intro h1 { font-size: clamp(42px, 5.2vw, 70px); line-height: .96; }
.book-intro .lead { font-size: 17px; line-height: 1.5; margin-top: 18px; }
.chapter-card h3 { font-size: 22px; line-height: 1.14; }
.chapter-card p { font-size: 14.5px; line-height: 1.5; margin-bottom: 10px; }
.chapter-card { padding: 22px; }
.codex-page-hero { padding-top: 40px; padding-bottom: 4px; }
.codex-dual { padding-top: 0; }
.codex-dual .feature-plate { min-height: 245px; padding: 28px; }
.codex-dual .feature-plate h2 { font-size: clamp(34px, 3.6vw, 48px); line-height: 1.02; }
.codex-dual .feature-plate p { font-size: 16px; line-height: 1.52; }
.codex-dual .plate-number { display: none; }
.feature-plate h2 { font-size: clamp(34px, 3.8vw, 50px); }
.approach-fit { min-height: auto; display: block; }
.approach-compact { padding: 40px 0 28px; }
.approach-compact .page-title h1 { font-size: clamp(38px, 5vw, 64px); }
.approach-compact .page-title p { font-size: 17px; line-height: 1.52; max-width: 920px; }
.approach-grid { gap: 14px; margin-top: 20px; }
.approach-grid .card { padding: 20px; }
.approach-grid .card h3 { font-size: 23px; }
.approach-grid .card p { font-size: 15px; line-height: 1.48; }
.compact-chain { gap: 8px; margin-top: 16px; }
.compact-chain span { min-height: 48px; font-size: 12px; }
.about-layout { margin-top: 8px; }
.bio-card { font-size: 15.5px; line-height: 1.66; }
.bio-card p { font-size: 15.5px; line-height: 1.66; }
.bio-card strong { color: var(--ink); font-weight: 850; }
.bio-card em { color: var(--terra); font-style: italic; }
.bio-card .bio-opening { font-size: 24px; line-height: 1.16; }
@media(max-width:980px){
  .home-hero-v5 { padding-top: 30px; }
  .home-copy-v5 h1 { font-size: clamp(42px, 12vw, 68px); }
  .home-side-v5 { min-height: 290px; }
  .codex-dual .feature-plate { min-height: auto; }
}

/* v7 layout fixes requested: Codex buttons, book intro, article pages, Atlas legend, Writing buttons */

/* Codex cards: equal vertical rhythm and aligned CTA buttons */
.codex-dual .feature-plate,
.dual-feature .feature-plate {
  display: flex;
  flex-direction: column;
}
.codex-dual .feature-plate .button,
.dual-feature .feature-plate .button {
  margin-top: auto;
  align-self: flex-start;
}
.codex-dual .feature-plate p,
.dual-feature .feature-plate p {
  margin-bottom: 20px;
}

/* Book landing: make the first book box visually consistent with chapter cards */
.book-page-head {
  padding-top: 28px !important;
  padding-bottom: 10px !important;
}
.book-intro.frontispiece {
  max-width: none !important;
  width: 100%;
  padding: 24px 26px !important;
  border-radius: 24px;
  box-shadow: 0 16px 50px rgba(15,38,64,.07);
}
.book-intro.frontispiece:before { inset: 14px; border-radius: 18px; }
.book-intro.frontispiece:after { inset: 24px; border-radius: 14px; }
.book-intro h1 {
  font-size: clamp(34px, 3.6vw, 52px) !important;
  line-height: 1.02 !important;
  max-width: 760px;
}
.book-intro .lead {
  font-size: 16px !important;
  line-height: 1.52 !important;
  max-width: 900px;
  margin-top: 12px !important;
}

/* Article pages: restore a proper editorial layout for generated .article markup */
.article {
  width: min(1040px, calc(100% - 44px));
  margin: 0 auto;
  padding: 30px 0 76px;
}
.article .breadcrumbs {
  display: flex;
  align-items: center;
  gap: 9px;
  flex-wrap: wrap;
  margin: 8px 0 22px;
  font: 800 12px/1 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ink-soft);
}
.article .breadcrumbs a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 8px 13px;
  border-radius: 999px;
  border: 1px solid rgba(168,68,44,.36);
  background: rgba(255,250,240,.62);
  color: var(--terra);
  text-decoration: none;
  box-shadow: 0 8px 20px rgba(15,38,64,.05);
}
.article .breadcrumbs a:before {
  content: "←";
  margin-right: 7px;
  font-family: var(--sans);
  font-weight: 900;
}
.article > h1 {
  font-size: clamp(38px, 5.4vw, 68px) !important;
  line-height: .98 !important;
  max-width: 980px;
  margin: 0 0 14px !important;
  letter-spacing: -.05em;
}
.article-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 0 30px;
  color: var(--ink-soft);
}
.article-meta span {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 7px 10px;
  border: 1px solid rgba(27,49,73,.16);
  border-radius: 999px;
  background: rgba(255,250,240,.45);
  font: 750 11px/1 var(--mono);
  letter-spacing: .07em;
  text-transform: uppercase;
}
.article-content {
  max-width: 820px;
  margin: 0 auto;
  padding: 34px 42px 44px;
  border: 1px solid rgba(27,49,73,.20);
  border-radius: 28px;
  background: linear-gradient(180deg, rgba(255,250,240,.58), rgba(232,223,204,.34));
  box-shadow: 0 18px 60px rgba(15,38,64,.06);
  font-size: 17px;
  line-height: 1.76;
  color: var(--ink);
}
.article-content p { margin: 0 0 1.15em; }
.article-content h2 {
  font-family: var(--serif);
  font-size: clamp(27px, 3.4vw, 40px);
  line-height: 1.12;
  margin: 1.85em 0 .7em;
  color: var(--ink);
  letter-spacing: -.04em;
}
.article-content h3 {
  font-family: var(--serif);
  font-size: 25px;
  line-height: 1.14;
  margin: 1.55em 0 .55em;
}
.article-content ul,
.article-content ol {
  margin: .9em 0 1.25em 1.15em;
  padding-left: 1.1em;
}
.article-content li {
  margin: .42em 0;
  padding-left: .22em;
  line-height: 1.64;
}
.article-content li p {
  margin: .16em 0;
  font: inherit;
  line-height: inherit;
  color: inherit;
}
.article-content li::marker { color: var(--terra); }
.article-content a {
  color: var(--terra);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
.article-content img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 2em auto;
  padding: 12px;
  border: 1px solid rgba(27,49,73,.18);
  border-radius: 18px;
  background: #fffaf0;
  box-shadow: 0 20px 60px rgba(15,38,64,.12);
}
.article-content figure { margin: 2.2em 0; text-align: center; }
.article-content figcaption {
  margin-top: 12px;
  color: var(--ink-soft);
  font: 800 12px/1.4 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}
.article-content pre {
  position: relative;
  margin: 1.9em 0;
  padding: 46px 20px 22px;
  overflow-x: auto;
  border: 1px solid rgba(27,49,73,.28);
  border-radius: 18px;
  background: linear-gradient(180deg, #fffaf0, #efe3cf);
  box-shadow: 0 18px 50px rgba(15,38,64,.08);
}
.article-content pre:before {
  content: "Code listing";
  position: absolute;
  top: 0; left: 0; right: 0;
  padding: 9px 14px;
  border-bottom: 1px solid rgba(27,49,73,.18);
  background: rgba(168,68,44,.06);
  color: var(--terra);
  font: 850 11px/1 var(--mono);
  letter-spacing: .12em;
  text-transform: uppercase;
}
.article-content pre code {
  display: block;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--ink);
  white-space: pre;
  tab-size: 2;
  font: 13.5px/1.55 var(--mono);
}

.article-content .table-wrap {
  margin: 1.8em 0;
  overflow-x: auto;
  border: 1px solid rgba(27,49,73,.22);
  border-radius: 18px;
  background: rgba(255,250,240,.55);
  box-shadow: 0 16px 42px rgba(15,38,64,.06);
}
.article-content .article-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14.5px;
  line-height: 1.45;
}
.article-content .article-table th,
.article-content .article-table td {
  padding: 12px 14px;
  border-bottom: 1px solid rgba(27,49,73,.14);
  text-align: left;
  vertical-align: top;
}
.article-content .article-table tr:last-child td { border-bottom: 0; }
.article-content .article-table th {
  color: var(--terra);
  font-weight: 850;
  background: rgba(168,68,44,.06);
}

.article-content :not(pre) > code {
  padding: .08em .32em;
  border: 1px solid rgba(168,68,44,.18);
  border-radius: 6px;
  background: rgba(168,68,44,.08);
  color: var(--terra);
  font: .88em var(--mono);
}
.article .article-nav,
.article-nav {
  max-width: 820px;
  margin: 32px auto 0;
  display: flex;
  gap: 14px;
  justify-content: space-between;
}
.article .article-nav a,
.article-nav a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  min-height: 44px;
  padding: 12px 16px;
  border-radius: 999px;
  border: 1px solid rgba(27,49,73,.24);
  background: rgba(255,250,240,.58);
  color: var(--ink);
  text-decoration: none;
  font-weight: 800;
}
.article .article-nav a:hover,
.article-nav a:hover { color: var(--terra); border-color: rgba(168,68,44,.38); }

/* Atlas: keep legend inside the canvas and away from the browser/header edge */
.atlas-shell .absolute.top-5.left-5 {
  top: 1.25rem !important;
  left: 1.25rem !important;
  max-width: 230px !important;
  border-radius: 10px;
  z-index: 20 !important;
}
.atlas-embedded #root { overflow: hidden; }

/* Writing page: align buttons across cards */
main .grid.cols-2 > .card {
  display: flex;
  flex-direction: column;
}
main .grid.cols-2 > .card .button {
  margin-top: auto;
  align-self: flex-start;
}

@media (max-width: 860px) {
  .article { width: min(100% - 28px, 1040px); padding-top: 22px; }
  .article > h1 { font-size: clamp(34px, 11vw, 52px) !important; }
  .article-content { padding: 26px 22px 34px; font-size: 16px; border-radius: 22px; }
  .article-nav { flex-direction: column; }
}
/* =============================================================================
   EA CODEX — modern editorial design
   Geist (sans) + Instrument Serif (display) + JetBrains Mono (technical)
   Warm neutrals, restrained accent, real depth.
   ============================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Geist:wght@300..800&family=Geist+Mono:wght@300..600&family=Instrument+Serif:ital@0;1&family=JetBrains+Mono:wght@400;500;600&display=swap');

:root {
  /* Palette — warm whites, deep ink, one terra accent */
  --bg: #FAF7F0;
  --bg-warm: #F4EFE3;
  --surface: #FFFFFF;
  --surface-2: #F0EBDC;
  --ink: #161310;
  --ink-2: #2B2722;
  --muted: #6B665C;
  --muted-2: #95908A;
  --line: #E8E1CF;
  --line-strong: #C9C0AB;
  --accent: #C44126;
  --accent-soft: #E8C4B6;

  /* Type */
  --serif: "Instrument Serif", "Times New Roman", Georgia, serif;
  --sans: "Geist", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --mono: "Geist Mono", "JetBrains Mono", ui-monospace, monospace;

  /* Layout */
  --page: 1280px;
  --gutter: 32px;
  --radius: 4px;
  --radius-lg: 12px;

  /* Motion */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
}

* { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  font-family: var(--sans);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.55;
  color: var(--ink);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

::selection { background: var(--ink); color: var(--bg); }

a { color: inherit; text-decoration: none; }

img, svg, video { display: block; max-width: 100%; }

.skip {
  position: absolute; left: -9999px; top: 8px;
  background: var(--ink); color: var(--bg);
  padding: 10px 16px;
  font-family: var(--mono); font-size: 12px;
  letter-spacing: 0.04em;
  z-index: 100;
}
.skip:focus { left: 8px; }

/* =============================================================================
   SITE HEADER — sticky, subtle
   ============================================================================ */
.site-header {
  position: sticky; top: 0; z-index: 30;
  background: rgba(250, 247, 240, 0.85);
  backdrop-filter: saturate(1.4) blur(14px);
  -webkit-backdrop-filter: saturate(1.4) blur(14px);
  border-bottom: 1px solid var(--line);
}

.nav {
  width: min(var(--page), calc(100% - var(--gutter)));
  margin: 0 auto;
  display: flex; justify-content: space-between; align-items: center;
  padding: 18px 0;
  gap: 32px;
}

.brand {
  display: inline-flex; align-items: baseline; gap: 4px;
  font-family: var(--serif);
  font-size: 24px;
  font-weight: 400;
  letter-spacing: -0.01em;
  color: var(--ink);
}

.brand .dot {
  display: inline-block;
  width: 6px; height: 6px;
  background: var(--accent);
  border-radius: 50%;
  margin: 0 6px 4px;
  vertical-align: middle;
}

.brand strong {
  font-weight: 400;
  font-style: italic;
}

.nav-links {
  display: flex; gap: 28px; align-items: center;
}

.nav-links a {
  font-family: var(--sans);
  font-size: 14px;
  font-weight: 450;
  color: var(--muted);
  letter-spacing: -0.005em;
  padding: 6px 0;
  position: relative;
  transition: color 0.18s var(--ease);
}

.nav-links a:hover { color: var(--ink); }

.nav-links a[aria-current="page"] {
  color: var(--ink);
  font-weight: 500;
}

.nav-links a[aria-current="page"]::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -2px;
  height: 1.5px;
  background: var(--accent);
}

/* =============================================================================
   CONTAINERS
   ============================================================================ */
.wrap, .page-hero {
  width: min(var(--page), calc(100% - var(--gutter)));
  margin: 0 auto;
}
.wrap { padding: 80px 0; }
.page-hero { padding: 96px 0 32px; }

/* =============================================================================
   HERO — photographic, asymmetric
   ============================================================================ */
.hero {
  width: min(var(--page), calc(100% - var(--gutter)));
  margin: 0 auto;
  padding: 56px 0 48px;
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: 56px;
  align-items: end;
  min-height: calc(100vh - 200px);
}

@media (max-width: 980px) {
  .hero {
    grid-template-columns: 1fr;
    gap: 40px;
    min-height: 0;
    padding-top: 32px;
    align-items: start;
  }
}

.hero h1, h1 {
  margin: 0;
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(48px, 6.5vw, 96px);
  line-height: 0.96;
  letter-spacing: -0.03em;
  color: var(--ink);
  max-width: 14ch;
}

.hero h1 em, h1 em {
  font-style: italic;
  color: var(--accent);
}

.gradient {
  /* legacy class — render as italic accent */
  font-style: italic;
  color: var(--accent);
  background: none;
  -webkit-text-fill-color: var(--accent);
}

.eyebrow, .pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--mono);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.04em;
  color: var(--muted);
  margin-bottom: 28px;
  text-transform: none;
}

.eyebrow::before, .pill::before {
  content: "";
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--accent);
  display: inline-block;
}

.pill {
  border: none;
  padding: 0;
  background: transparent;
}

.lead {
  font-family: var(--sans);
  font-size: clamp(17px, 1.4vw, 20px);
  font-weight: 400;
  line-height: 1.55;
  color: var(--ink-2);
  margin: 32px 0 0;
  max-width: 56ch;
  letter-spacing: -0.005em;
}

.actions {
  display: flex; gap: 12px; flex-wrap: wrap;
  margin-top: 36px;
}

/* =============================================================================
   BUTTONS — solid + ghost, real hover motion
   ============================================================================ */
.button, .nav-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: var(--sans);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: -0.005em;
  padding: 14px 22px;
  background: var(--ink);
  color: var(--bg);
  border: 1px solid var(--ink);
  border-radius: var(--radius-lg);
  text-decoration: none;
  cursor: pointer;
  transition: transform 0.2s var(--ease-out), background 0.2s var(--ease), color 0.2s var(--ease);
  text-transform: none;
}

.button::after {
  content: "→";
  font-size: 16px;
  margin-left: 4px;
  transition: transform 0.2s var(--ease-out);
}

.button:hover {
  transform: translateY(-1px);
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}
.button:hover::after { transform: translateX(2px); }

.button.secondary {
  background: transparent;
  color: var(--ink);
  border-color: var(--line-strong);
}
.button.secondary:hover {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--bg);
}
.button.secondary:hover::after { color: inherit; }

.button.ghost {
  background: transparent;
  color: var(--ink);
  border-color: transparent;
  padding: 14px 4px;
}
.button.ghost:hover {
  background: transparent;
  color: var(--accent);
  transform: none;
}
.button.ghost::after { content: "→"; }

/* =============================================================================
   PORTRAIT — real photographic presence
   ============================================================================ */
.portrait-card {
  position: relative;
  aspect-ratio: 4/5;
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--surface-2);
  box-shadow:
    0 1px 2px rgba(22, 19, 16, 0.06),
    0 24px 60px -20px rgba(22, 19, 16, 0.18);
  min-height: 0;
}
.portrait-card::before { display: none; }
.portrait-card::after { display: none; }

.portrait-card picture,
.portrait-card img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  filter: saturate(0.95) contrast(1.02);
  border-radius: 0;
}
.portrait-card picture::after { display: none; }

.portrait-overlay {
  position: absolute;
  left: 24px; right: 24px; bottom: 24px;
  z-index: 2;
  padding: 16px 18px;
  background: rgba(22, 19, 16, 0.78);
  color: #fff;
  border-radius: 8px;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: none;
}

.portrait-overlay strong {
  display: block;
  font-family: var(--sans);
  font-weight: 500;
  font-size: 15px;
  letter-spacing: -0.01em;
  color: #fff;
}

.portrait-overlay span {
  display: block;
  margin-top: 4px;
  font-family: var(--sans);
  color: rgba(255,255,255,0.72);
  font-size: 13px;
  font-style: normal;
  line-height: 1.4;
}

/* =============================================================================
   METRICS — minimal stat strip
   ============================================================================ */
.metric {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  margin-top: 56px;
  max-width: 640px;
  border-top: 1px solid var(--line);
}

.metric div {
  background: transparent;
  border: none;
  padding: 20px 0 0;
}

.metric div + div { padding-left: 24px; }

.metric strong {
  display: block;
  font-family: var(--serif);
  font-size: 32px;
  font-weight: 400;
  letter-spacing: -0.02em;
  color: var(--ink);
  font-style: italic;
}

.metric span {
  display: block;
  margin-top: 6px;
  font-family: var(--mono);
  color: var(--muted);
  font-size: 11.5px;
  letter-spacing: 0.02em;
  text-transform: none;
}

/* =============================================================================
   SECTION HEADERS
   ============================================================================ */
.section-head {
  display: flex; align-items: end;
  justify-content: space-between; gap: 32px;
  margin-bottom: 48px;
  padding-bottom: 0;
  border-bottom: none;
}

.section-head.stacked { display: block; max-width: 720px; }

.section-head h2 {
  margin: 0;
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(32px, 3.8vw, 52px);
  line-height: 1.05;
  letter-spacing: -0.025em;
  color: var(--ink);
  max-width: 18ch;
}

.section-head h2.one-line { white-space: normal; }

.section-head h2 em {
  font-style: italic;
  color: var(--accent);
}

.section-head p {
  font-family: var(--sans);
  color: var(--muted);
  max-width: 56ch;
  line-height: 1.55;
  margin: 0;
  font-size: 17px;
}

.section-head.stacked p {
  margin-top: 16px;
  max-width: 56ch;
}

.section-eyebrow {
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: 0.04em;
  color: var(--muted);
  margin-bottom: 16px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.section-eyebrow::before {
  content: "";
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--accent);
}

/* =============================================================================
   GRIDS + CARDS — depth, hover motion
   ============================================================================ */
.grid {
  display: grid;
  gap: 16px;
  border: none;
}
.cols-3 { grid-template-columns: repeat(3, 1fr); }
.cols-2 { grid-template-columns: repeat(2, 1fr); }

@media (max-width: 980px) {
  .cols-3, .cols-2 { grid-template-columns: 1fr; }
}

.card,
.resource-card,
.timeline-item,
.essay-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  transition:
    transform 0.25s var(--ease-out),
    border-color 0.25s var(--ease),
    box-shadow 0.25s var(--ease);
  text-decoration: none;
  color: inherit;
  position: relative;
  overflow: hidden;
}

/* Accent stripe that animates in on hover */
.card::before,
.resource-card::before,
.essay-card::before {
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  background: var(--accent);
  transform: scaleY(0);
  transform-origin: top center;
  transition: transform 0.32s var(--ease-out);
}

.card:hover::before,
.resource-card:hover::before,
.essay-card:hover::before {
  transform: scaleY(1);
}

.card:hover,
.resource-card:hover,
.essay-card:hover {
  transform: translateY(-2px);
  border-color: var(--line-strong);
  box-shadow:
    0 1px 2px rgba(22, 19, 16, 0.04),
    0 16px 36px -16px rgba(22, 19, 16, 0.18);
}

/* Card icon */
.card-icon {
  width: 40px; height: 40px;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 14px;
  color: var(--ink);
  background: var(--bg-warm);
  border-radius: 9px;
  transition: background 0.25s var(--ease), color 0.25s var(--ease);
}

.card:hover .card-icon {
  background: var(--ink);
  color: var(--bg);
}

.card-icon svg { width: 20px; height: 20px; stroke-width: 1.5; }

a.card,
.card[href] { cursor: pointer; }

a.card::after,
.card[href]::after {
  content: "→";
  position: absolute;
  top: 28px; right: 28px;
  font-size: 18px;
  color: var(--muted);
  opacity: 0;
  transform: translateX(-8px);
  transition: opacity 0.25s var(--ease), transform 0.25s var(--ease-out), color 0.25s var(--ease);
}

a.card:hover::after,
.card[href]:hover::after {
  opacity: 1;
  transform: translateX(0);
  color: var(--accent);
}

.card h3,
.resource-card h3,
.essay-card h3 {
  margin: 0;
  font-family: var(--serif);
  font-size: 28px;
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.1;
  color: var(--ink);
}

.card p,
.resource-card p,
.essay-card p,
.timeline-item p {
  font-family: var(--sans);
  color: var(--muted);
  line-height: 1.55;
  margin: 0;
  font-size: 15px;
}

.card .button,
.card .button.secondary {
  align-self: flex-start;
  margin-top: 8px;
}

.card.content-narrow {
  border: 1px solid var(--line);
  padding: clamp(36px, 5vw, 56px);
  background: var(--surface);
  border-radius: var(--radius-lg);
}

/* Cards with eyebrow */
.card .card-eyebrow {
  font-family: var(--mono);
  font-size: 11.5px;
  letter-spacing: 0.04em;
  color: var(--muted-2);
  margin-bottom: 4px;
}

/* =============================================================================
   ATLAS PREVIEW (home page teaser)
   ============================================================================ */
.atlas-preview {
  margin: 32px 0;
  padding: 0 16px;
}
.atlas-preview-inner {
  width: min(var(--page), calc(100% - var(--gutter)));
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1.6fr;
  gap: 56px;
  align-items: center;
  padding: 64px 56px;
  background: var(--ink);
  color: var(--bg);
  border-radius: var(--radius-lg);
  position: relative;
  overflow: hidden;
}

.atlas-preview-inner::before {
  content: "";
  position: absolute;
  top: -200px; right: -200px;
  width: 500px; height: 500px;
  background: radial-gradient(circle, rgba(196, 65, 38, 0.18) 0%, transparent 70%);
  pointer-events: none;
}

.atlas-preview-text { position: relative; }

.atlas-preview-text .section-eyebrow {
  color: var(--accent-soft);
  margin-bottom: 18px;
}
.atlas-preview-text .section-eyebrow::before { background: var(--accent); }

.atlas-preview-text h2 {
  margin: 0 0 18px;
  font-family: var(--serif);
  font-size: clamp(32px, 3.4vw, 44px);
  font-weight: 400;
  line-height: 1.05;
  letter-spacing: -0.025em;
  color: var(--bg);
  max-width: 14ch;
}
.atlas-preview-text h2 em {
  font-style: italic;
  color: var(--accent-soft);
}
.atlas-preview-text p {
  font-family: var(--sans);
  color: rgba(250, 247, 240, 0.72);
  font-size: 16px;
  line-height: 1.55;
  margin: 0 0 24px;
  max-width: 50ch;
}
.atlas-preview-text .link {
  color: var(--bg);
}
.atlas-preview-text .link:hover { color: var(--accent-soft); }

.atlas-preview-visual {
  position: relative;
  display: block;
  background: var(--surface);
  border-radius: var(--radius-lg);
  padding: 24px;
  text-decoration: none;
  color: inherit;
  overflow: hidden;
  transition: transform 0.32s var(--ease-out), box-shadow 0.32s var(--ease);
  box-shadow: 0 32px 80px -28px rgba(0, 0, 0, 0.4);
}
.atlas-preview-visual:hover {
  transform: translateY(-3px);
  box-shadow: 0 40px 90px -28px rgba(0, 0, 0, 0.5);
}
.atlas-preview-visual svg {
  width: 100%; height: auto; display: block;
}
.atlas-preview-cta {
  position: absolute;
  bottom: 24px; right: 24px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  background: var(--ink);
  color: var(--bg);
  border-radius: 8px;
  font-family: var(--sans);
  font-size: 13px;
  font-weight: 500;
  transition: background 0.2s var(--ease);
}
.atlas-preview-visual:hover .atlas-preview-cta {
  background: var(--accent);
}

@media (max-width: 980px) {
  .atlas-preview-inner {
    grid-template-columns: 1fr;
    gap: 32px;
    padding: 36px 28px;
  }
  .atlas-preview-visual { padding: 16px; }
  .atlas-preview-cta { bottom: 16px; right: 16px; padding: 8px 12px; font-size: 12px; }
}

/* =============================================================================
   BOOK PART BLOCKS
   ============================================================================ */
.part-block {
  margin-bottom: 64px;
  padding-top: 32px;
  border-top: 1px solid var(--line);
}

.part-block:first-of-type {
  border-top: none;
  padding-top: 0;
}

/* Part header — Part title on its own line, description paragraph stacked
   directly below. */
.part-header {
  display: block;
  margin-bottom: 32px;
}
.part-roman,
.part-title {
  display: block;
  font-family: var(--serif);
  font-size: clamp(28px, 3vw, 38px) !important;
  font-weight: 700 !important;
  letter-spacing: -.025em !important;
  line-height: 1.05 !important;
  color: #0f2640 !important;
  margin: 0 0 14px !important;
  font-style: normal !important;
}
.part-roman { padding-right: 4px; }
.part-lead {
  display: block;
  font-family: var(--sans);
  color: var(--muted);
  font-size: 16px;
  line-height: 1.55;
  margin: 14px 0 0;
  max-width: 76ch;
}

.chapter-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}

@media (max-width: 980px) { .chapter-list { grid-template-columns: 1fr; } }

.chapter-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 32px;
  display: grid; grid-template-columns: auto 1fr;
  gap: 24px;
  text-decoration: none;
  color: inherit;
  transition:
    transform 0.25s var(--ease-out),
    border-color 0.25s var(--ease),
    box-shadow 0.25s var(--ease);
  position: relative;
  overflow: hidden;
}

.chapter-card:hover {
  transform: translateY(-2px);
  border-color: var(--line-strong);
  box-shadow:
    0 1px 2px rgba(22, 19, 16, 0.04),
    0 12px 32px -16px rgba(22, 19, 16, 0.16);
}

.chapter-index {
  width: auto; height: auto;
  display: block;
  background: transparent; border: none;
  font-family: var(--serif);
  font-style: italic;
  font-weight: 400;
  font-size: 36px;
  color: var(--accent);
  letter-spacing: -0.02em;
  line-height: 1;
}

.chapter-card h3 {
  margin: 0 0 10px;
  font-family: var(--serif);
  font-size: 24px;
  font-weight: 400;
  line-height: 1.18;
  letter-spacing: -0.02em;
  color: var(--ink);
}

.chapter-card p {
  font-family: var(--sans);
  color: var(--muted);
  font-size: 15px;
  line-height: 1.55;
  margin: 0;
}

.chapter-card .link { margin-top: 14px; }

/* =============================================================================
   LINK
   ============================================================================ */
.link {
  display: inline-flex; align-items: center;
  gap: 6px;
  font-family: var(--sans);
  font-size: 14px;
  font-weight: 500;
  color: var(--ink);
  text-decoration: none;
  padding-bottom: 1px;
  transition: color 0.2s var(--ease);
}

.link::after {
  content: "→";
  transition: transform 0.2s var(--ease-out);
}

.link:hover { color: var(--accent); }
.link:hover::after { transform: translateX(2px); }

/* =============================================================================
   CTA
   ============================================================================ */
.cta {
  margin: 32px 0;
  padding: 56px;
  background: var(--ink);
  color: var(--bg);
  border-radius: var(--radius-lg);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  border: none;
}

.cta h2 {
  margin: 0 0 12px;
  font-family: var(--serif);
  font-size: clamp(28px, 3vw, 40px);
  font-weight: 400;
  letter-spacing: -0.02em;
  color: var(--bg);
  max-width: 18ch;
}

.cta p {
  font-family: var(--sans);
  color: rgba(250, 247, 240, 0.75);
  max-width: 56ch;
  line-height: 1.55;
  margin: 0;
  font-size: 16px;
}

.cta .button {
  background: var(--bg);
  color: var(--ink);
  border-color: var(--bg);
}
.cta .button:hover {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

@media (max-width: 980px) {
  .cta { flex-direction: column; align-items: flex-start; padding: 36px; }
}

/* =============================================================================
   PAGE HERO + PROSE
   ============================================================================ */
.page-hero h1 {
  font-size: clamp(40px, 5.5vw, 72px);
  max-width: 22ch;
}

.page-hero p {
  font-family: var(--sans);
  color: var(--muted);
  font-size: clamp(17px, 1.4vw, 20px);
  line-height: 1.55;
  max-width: 56ch;
  margin: 28px 0 0;
}

.page-title { display: block; }

.prose {
  width: min(720px, calc(100% - var(--gutter)));
  margin: 0 auto;
  padding: 32px 0 96px;
  color: var(--ink);
  font-family: var(--sans);
  font-size: 17.5px;
  line-height: 1.65;
}

.prose h1, .prose h2, .prose h3 {
  color: var(--ink);
  font-family: var(--serif);
  font-weight: 400;
  letter-spacing: -0.02em;
}

.prose h1 { font-size: clamp(40px, 5.5vw, 64px); line-height: 1.05; }
.prose h2 { font-size: 32px; margin-top: 56px; }
.prose p, .prose li { line-height: 1.65; color: var(--ink-2); font-size: 17.5px; }

/* =============================================================================
   CONTENT NARROW + BIO
   ============================================================================ */
.content-narrow {
  max-width: 720px;
  margin: 0 auto;
}

.bio-opening {
  font-family: var(--serif);
  font-style: italic;
  font-size: clamp(28px, 3.5vw, 40px);
  line-height: 1.18;
  letter-spacing: -0.02em;
  color: var(--ink);
  font-weight: 400;
  margin: 0 0 28px;
}

.content-narrow.card {
  border: 1px solid var(--line);
  padding: clamp(40px, 5vw, 64px);
  background: var(--surface);
  border-radius: var(--radius-lg);
}

.content-narrow.card p {
  font-family: var(--sans);
  color: var(--ink-2);
  font-size: 17px;
  line-height: 1.7;
  margin: 0 0 20px;
}
.content-narrow.card p:last-child { margin-bottom: 0; }

/* =============================================================================
   FOOTER
   ============================================================================ */
footer {
  margin-top: 80px;
  border-top: 1px solid var(--line);
  padding: 48px 0 64px;
  color: var(--muted);
  background: var(--bg);
}

.footer-inner {
  width: min(var(--page), calc(100% - var(--gutter)));
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  gap: 32px;
  flex-wrap: wrap;
}

.footer-inner strong {
  display: block;
  font-family: var(--serif);
  font-size: 22px;
  font-weight: 400;
  font-style: italic;
  color: var(--ink);
  margin-bottom: 4px;
  letter-spacing: -0.01em;
}

.footer-inner p {
  font-family: var(--sans);
  margin: 0;
  font-size: 14.5px;
  color: var(--muted);
  max-width: 40ch;
}

.footer-links {
  display: flex; gap: 28px; align-items: center;
}

.footer-links a {
  font-family: var(--sans);
  font-size: 14px;
  font-weight: 500;
  color: var(--muted);
  transition: color 0.2s var(--ease);
}

.footer-links a:hover { color: var(--accent); }

/* =============================================================================
   ARTICLE — chapter pages (long-form reading)
   ============================================================================ */
.article {
  width: min(880px, calc(100% - var(--gutter)));
  margin: 0 auto;
  padding: 56px 0 96px;
}

.article .breadcrumbs,
.breadcrumbs {
  width: auto;
  margin: 0 0 32px;
  color: var(--muted);
  font-family: var(--mono);
  font-size: 12.5px;
  letter-spacing: 0.02em;
}
.breadcrumbs a { color: var(--ink); transition: color 0.2s var(--ease); }
.breadcrumbs a:hover { color: var(--accent); }

.article h1 {
  font-family: var(--serif);
  font-size: clamp(44px, 6vw, 80px);
  line-height: 1.0;
  letter-spacing: -0.03em;
  font-weight: 400;
  max-width: 22ch;
  margin: 0 0 24px;
  color: var(--ink);
  background: none;
  -webkit-text-fill-color: var(--ink);
}

.article-meta {
  display: flex; flex-wrap: wrap; gap: 14px;
  align-items: center;
  color: var(--muted);
  font-family: var(--mono);
  font-size: 12.5px;
  letter-spacing: 0.02em;
  margin: 0 0 56px;
  padding-bottom: 28px;
  border-bottom: 1px solid var(--line);
}

.article-meta a {
  color: var(--ink);
  border: 1px solid var(--line);
  background: var(--surface);
  border-radius: 999px;
  padding: 6px 12px;
  font-weight: 500;
  transition: all 0.2s var(--ease);
}
.article-meta a:hover {
  background: var(--ink);
  color: var(--bg);
  border-color: var(--ink);
}

.article-content {
  position: relative;
  max-width: 720px;
  margin: 0 auto;
  padding: 0;
  border: none;
  background: none;
  box-shadow: none;
  border-radius: 0;
  overflow: visible;
  font-family: var(--sans);
}
.article-content::before { display: none; }

.article-content > p:first-of-type,
.article-content p:first-child {
  font-family: var(--sans);
  font-size: 18px;
  font-style: normal;
  line-height: 1.7;
  color: var(--ink-2);
  margin: 0 0 24px;
  font-weight: 400;
  letter-spacing: 0;
}

.article-content p {
  margin: 0 0 24px;
  font-family: var(--sans);
  color: var(--ink-2);
  font-size: 18px;
  line-height: 1.65;
  letter-spacing: -0.005em;
}

.article-content h2 {
  margin: 64px 0 20px;
  font-family: var(--serif);
  color: var(--ink);
  font-size: clamp(28px, 3vw, 38px);
  line-height: 1.12;
  letter-spacing: -0.025em;
  font-weight: 400;
}
.article-content h2::before { display: none; }

.article-content h3 {
  margin: 40px 0 14px;
  font-family: var(--serif);
  color: var(--ink);
  font-size: 24px;
  line-height: 1.2;
  letter-spacing: -0.015em;
  font-weight: 400;
  font-style: italic;
}

.article-content ul,
.article-content ol {
  margin: 20px 0 32px;
  padding-left: 22px;
  color: var(--ink-2);
}

.article-content li {
  margin: 12px 0;
  padding-left: 6px;
  font-family: var(--sans);
  color: var(--ink-2);
  font-size: 18px;
  line-height: 1.65;
  letter-spacing: -0.005em;
}

.article-content li::marker { color: var(--accent); }
.article-content ol li::marker { color: var(--accent); font-weight: 600; }

.article-content li > p,
.article-content li p:first-child,
.article-content li p:first-of-type,
.article-content li p:last-child {
  display: inline;
  margin: 0;
  padding: 0;
  font: inherit;
  color: inherit;
  line-height: inherit;
  letter-spacing: inherit;
}

.article-content blockquote {
  margin: 36px 0;
  padding: 0 0 0 32px;
  border-left: 2px solid var(--accent);
  color: var(--ink);
  font-style: italic;
  background: none;
  border-radius: 0;
}
.article-content blockquote p {
  font-family: var(--serif);
  font-size: 22px;
  line-height: 1.4;
  color: var(--ink);
  margin: 0;
  font-style: italic;
  font-weight: 400;
}

/* Code listings */
.article-content pre {
  position: relative;
  width: 100%;
  margin: 36px 0;
  padding: 0;
  background: var(--ink);
  border: none;
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: 0 12px 32px -16px rgba(22, 19, 16, 0.32);
}

.article-content pre::before {
  content: "Listing";
  display: block;
  padding: 12px 18px;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  background: transparent;
  color: rgba(250, 247, 240, 0.6);
  font-family: var(--mono);
  font-size: 11.5px;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.article-content pre code {
  display: block;
  overflow-x: auto;
  padding: 22px 24px;
  color: rgba(250, 247, 240, 0.92);
  background: transparent;
  font-family: var(--mono);
  font-size: 13.5px;
  font-weight: 400;
  line-height: 1.65;
  white-space: pre;
  tab-size: 2;
  border: none;
}


.article-content .table-wrap {
  margin: 1.8em 0;
  overflow-x: auto;
  border: 1px solid rgba(27,49,73,.22);
  border-radius: 18px;
  background: rgba(255,250,240,.55);
  box-shadow: 0 16px 42px rgba(15,38,64,.06);
}
.article-content .article-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14.5px;
  line-height: 1.45;
}
.article-content .article-table th,
.article-content .article-table td {
  padding: 12px 14px;
  border-bottom: 1px solid rgba(27,49,73,.14);
  text-align: left;
  vertical-align: top;
}
.article-content .article-table tr:last-child td { border-bottom: 0; }
.article-content .article-table th {
  color: var(--terra);
  font-weight: 850;
  background: rgba(168,68,44,.06);
}

.article-content :not(pre) > code {
  white-space: normal;
  padding: 2px 6px;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: var(--surface-2);
  color: var(--ink);
  font-family: var(--mono);
  font-size: 0.86em;
}

/* Figures */
.article-content figure,
.chapter-figure {
  margin: 56px auto;
  padding: 0;
  border: 1px solid var(--line);
  background: var(--surface);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(22, 19, 16, 0.04);
}

.article-content figure img,
.chapter-figure img,
.article-content > img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0;
  border-radius: 0;
  background: var(--surface);
}

/* Article figures (article-figure) host images that came from the Word
   source. They break out of the 820px article-content column to extend up
   to the wider .article container (1040px), giving complex diagrams more
   space without forcing the body text to widen. */
.article-content .article-figure {
  margin: 2em auto;
  text-align: center;
  /* Break out of the .article-content column. The content has 42px
     horizontal padding inside an 820px max-width box, sitting inside an
     .article container of 1040px. Negative margin extends the figure
     toward the .article edges. */
  margin-left: calc(50% - min(50vw - 24px, 580px));
  margin-right: calc(50% - min(50vw - 24px, 580px));
  width: min(100vw - 48px, 1160px);
  max-width: none;
}
@media (max-width: 920px) {
  /* On narrow viewports, fall back to in-column figures (no negative margin). */
  .article-content .article-figure {
    margin-left: 0;
    margin-right: 0;
    width: 100%;
  }
}
.article-content .article-figure img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  margin: 0 auto;
  padding: 8px;
  border: 1px solid rgba(27,49,73,.18);
  border-radius: 14px;
  background: #fffaf0;
  box-shadow: 0 14px 42px rgba(15,38,64,.08);
  image-rendering: -webkit-optimize-contrast;
}

.article-content figcaption,
.article-content .figcaption,
.chapter-figure figcaption {
  margin: 0;
  padding: 16px 24px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-family: var(--sans);
  font-style: normal;
  font-size: 14px;
  line-height: 1.5;
  text-align: left;
  background: var(--bg-warm);
}

.article-content strong { font-weight: 600; color: var(--ink); }
.article-content em { font-style: italic; color: var(--ink-2); }

.download-list { display: none !important; }

/* =============================================================================
   CHAPTER NAV
   ============================================================================ */
.chapter-nav,
.nextprev {
  max-width: 720px;
  margin: 64px auto 0;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding-top: 32px;
  border-top: 1px solid var(--line);
}

.chapter-nav a,
.nextprev .link {
  font-family: var(--sans);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: -0.005em;
  color: var(--ink);
  text-decoration: none;
  border: 1px solid var(--line);
  padding: 12px 18px;
  background: var(--surface);
  border-radius: var(--radius-lg);
  margin-top: 0;
  transition: all 0.2s var(--ease);
}

.chapter-nav a:hover,
.nextprev .link:hover {
  background: var(--ink);
  color: var(--bg);
  border-color: var(--ink);
  transform: translateY(-1px);
}

/* =============================================================================
   FADE-IN ON LOAD (subtle)
   ============================================================================ */
@keyframes fade-in-up {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

.hero > div,
.hero > aside,
.section-head,
.grid > *,
.chapter-list > * {
  animation: fade-in-up 0.6s var(--ease-out) backwards;
}

.hero > div { animation-delay: 0.05s; }
.hero > aside { animation-delay: 0.15s; }
.grid > *:nth-child(1), .chapter-list > *:nth-child(1) { animation-delay: 0.05s; }
.grid > *:nth-child(2), .chapter-list > *:nth-child(2) { animation-delay: 0.1s; }
.grid > *:nth-child(3), .chapter-list > *:nth-child(3) { animation-delay: 0.15s; }
.grid > *:nth-child(4), .chapter-list > *:nth-child(4) { animation-delay: 0.2s; }
.grid > *:nth-child(n+5), .chapter-list > *:nth-child(n+5) { animation-delay: 0.25s; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}

/* =============================================================================
   RESPONSIVE
   ============================================================================ */
@media (max-width: 980px) {
  .nav-links { gap: 14px; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .nav-links::-webkit-scrollbar { display: none; }
  .nav-links a { font-size: 12.5px; flex-shrink: 0; }
  .nav { padding: 14px 0; gap: 16px; }
  .brand { font-size: 20px; flex-shrink: 0; }
  .wrap { padding: 56px 0; }
  .hero { padding: 32px 0 48px; }
  .section-head { flex-direction: column; align-items: flex-start; gap: 16px; }
  .footer-inner { flex-direction: column; align-items: flex-start; }
  .metric { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .metric div + div { padding-left: 0; }
  .article { padding: 32px 0 64px; }
  .article-content > p:first-of-type { font-size: 17px; }
  .article-content p { font-size: 17px; line-height: 1.6; }
  .article-content li { font-size: 17px; line-height: 1.6; }
  .article-content pre code { font-size: 12.5px; padding: 18px; }
  .chapter-card { padding: 24px; gap: 18px; }
  .chapter-index { font-size: 28px; }
}
/* v10 integration fixes */
.brand-mark{width:42px;height:42px;display:inline-block;border-radius:14px;background:url("./assets/ai-augmented-ea-logo.svg") center/contain no-repeat;box-shadow:0 10px 28px rgba(15,38,64,.18)}
.nav-group{position:relative;display:inline-flex;align-items:center}.nav-group>a{padding-right:14px}.nav-group>a:before{content:"⌄";position:absolute;right:0;top:0;color:var(--accent);font-size:12px}.nav-menu{position:absolute;top:28px;left:-14px;min-width:150px;padding:10px;border:1px solid rgba(27,49,73,.20);background:rgba(255,250,240,.96);box-shadow:0 18px 50px rgba(15,38,64,.12);border-radius:14px;display:none;z-index:80}.nav-group:hover .nav-menu,.nav-group:focus-within .nav-menu{display:grid;gap:6px}.nav-menu a{display:block;padding:9px 10px;border-radius:10px;color:var(--ink-soft)}.nav-menu a:hover{background:rgba(168,68,44,.08);color:var(--accent)}.nav-menu a:after{display:none}
footer{border-top:1px solid rgba(27,49,73,.18);background:rgba(242,235,219,.55)}
.footer-inner{width:min(1180px,calc(100% - 40px));margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 0;color:var(--muted)}
.footer-inner strong{display:block;color:var(--ink);font-weight:850}.footer-inner p{margin:.35em 0 0;color:var(--muted);line-height:1.45}.footer-links{display:flex;gap:18px;flex-wrap:wrap}.footer-links a{color:var(--accent);text-decoration:none;font-weight:800}.footer-links a:hover{text-decoration:underline;text-underline-offset:4px}
.atlas-figure,.atlas-map-panel,.atlas-canvas,.atlas-stage,.atlas-shell .atlas-main,.atlas-visual{position:relative}.atlas-legend{top:18px!important;left:18px!important;right:auto!important;max-width:260px!important;transform:none!important}
.article-content pre code{white-space:pre!important;display:block!important}.article-content pre{overflow-x:auto!important}.article-content{max-width:880px}.article h1{font-size:clamp(44px,5.8vw,82px)}
@media(max-width:900px){.nav-menu{position:static;display:grid;background:transparent;box-shadow:none;border:0;padding:0}.nav-group{display:grid}.nav-group>a:before{display:none}.footer-inner{flex-direction:column;align-items:flex-start}}

/* v12 compact spacing + one-line footer descriptor */
.wrap { padding-top: 46px !important; padding-bottom: 46px !important; }
.page-hero { padding-top: 52px !important; padding-bottom: 18px !important; }
section.wrap + section.wrap { padding-top: 12px !important; }
.section-head { margin-top: 14px !important; margin-bottom: 14px !important; }
.grid { gap: 14px !important; }
.cols-2, .cols-3 { gap: 14px !important; }
.card, .resource-card, .essay-card, .chapter-card { padding: 22px !important; }
.chapter-list { gap: 12px !important; }
.page-title h1 { margin-bottom: 12px !important; }
.page-title p { margin-top: 0 !important; margin-bottom: 0 !important; }
.home-strip-v5 { padding-bottom: 22px !important; }
.home-footer .footer-inner, .footer-inner { padding-top: 18px !important; padding-bottom: 18px !important; }
.footer-inner > div:first-child { min-width: 0; flex: 1 1 auto; }
.footer-inner p { white-space: nowrap; overflow: visible; }
.footer-links { flex: 0 0 auto; }

@media (max-width: 980px) {
  .wrap { padding-top: 34px !important; padding-bottom: 34px !important; }
  .page-hero { padding-top: 38px !important; }
  .footer-inner p { white-space: normal; }
}


/* v13 list and code integrity fixes */
.article-content ul {
  list-style: disc outside;
  margin: 1.05rem 0 1.35rem 1.45rem;
  padding-left: 1.15rem;
}
.article-content li {
  display: list-item;
  margin: .55rem 0;
  padding-left: .25rem;
  font: inherit;
  color: var(--ink-soft);
  line-height: 1.72;
}
.article-content li::marker {
  color: var(--accent);
  font-size: .82em;
}
.article-content pre,
.article-content pre code {
  white-space: pre !important;
  tab-size: 2;
  -moz-tab-size: 2;
}

/* v14 homepage refinement: codex preview and begins section */
.home-hero-v14{min-height:calc(100vh - 340px);display:grid;grid-template-columns:minmax(0,1.12fr) minmax(360px,.88fr);gap:54px;align-items:center;padding:44px 0 26px}.home-copy-v14 h1{font-size:clamp(54px,7.2vw,96px);line-height:.88;max-width:920px;margin:0}.home-copy-v14 .home-tagline{font-family:var(--serif);font-size:clamp(28px,3.2vw,42px);line-height:1.05;margin:10px 0 0;color:var(--ink)}.home-side-v14{position:relative;min-height:352px;border:1px solid rgba(27,49,73,.24);border-radius:32px;background:linear-gradient(180deg,rgba(255,250,240,.68),rgba(232,223,204,.46));box-shadow:0 18px 58px rgba(15,38,64,.10);padding:24px;overflow:hidden}.home-side-v14:before,.home-side-v14:after{content:"";position:absolute;inset:14px;border:1px solid rgba(168,68,44,.17);border-radius:25px;pointer-events:none}.home-side-v14:after{inset:25px;border-color:rgba(27,49,73,.13)}.codex-mini-map-v14{position:relative;z-index:1;height:230px;border:1px solid rgba(27,49,73,.15);border-radius:22px;background-image:linear-gradient(rgba(15,38,64,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(15,38,64,.055) 1px,transparent 1px);background-size:30px 30px;margin-bottom:18px}.codex-mini-map-v14 span{position:absolute;transform:translate(-50%,-50%);border:1px solid rgba(168,68,44,.58);background:rgba(255,250,240,.82);border-radius:999px;padding:8px 12px;color:var(--ink);font:800 11px/1 var(--mono);box-shadow:0 10px 28px rgba(15,38,64,.08)}.home-side-v14 p{position:relative;z-index:1;margin:0 0 2px;color:var(--ink-soft);line-height:1.48;font-size:16px}.home-begins{display:grid;grid-template-columns:minmax(270px,.85fr) minmax(0,1.35fr);gap:42px;align-items:start;padding:24px 0 44px}.home-begins-head h2{font-family:var(--serif);font-size:clamp(35px,4.5vw,58px);line-height:.96;letter-spacing:-.045em;margin:0;color:var(--ink)}.home-begins-head h2 em{color:var(--terra);font-style:italic;font-weight:500}.home-begins-head p{margin:14px 0 0;color:var(--ink-soft);line-height:1.54;max-width:470px;font-size:15.5px}.home-begins-cards{display:grid;grid-template-columns:1fr 1fr;gap:22px}.begin-card{min-height:240px;display:flex;flex-direction:column;text-decoration:none;border:1px solid rgba(27,49,73,.13);border-radius:9px;background:rgba(255,250,240,.72);padding:27px 30px;box-shadow:0 12px 38px rgba(15,38,64,.06);color:var(--ink);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.begin-card:hover{transform:translateY(-2px);box-shadow:0 18px 50px rgba(15,38,64,.10);border-color:rgba(168,68,44,.26)}.begin-icon{width:31px;height:31px;border-radius:8px;display:grid;place-items:center;background:rgba(232,223,204,.70);color:var(--terra);margin-bottom:22px;font:700 14px var(--mono)}.begin-card span{color:rgba(58,79,107,.82);font:700 11px var(--mono);letter-spacing:.035em;margin-bottom:7px}.begin-card h3{font-family:var(--serif);font-size:28px;line-height:1.08;margin:0 0 14px;letter-spacing:-.035em}.begin-card p{color:var(--ink-soft);line-height:1.55;font-size:14.5px;margin:0}@media(max-width:980px){.home-hero-v14,.home-begins{grid-template-columns:1fr}.home-hero-v14{padding-top:34px}.home-side-v14{min-height:320px}.home-begins-cards{grid-template-columns:1fr}}@media(max-height:820px) and (min-width:981px){.home-hero-v14{padding-top:28px;gap:42px}.home-copy-v14 h1{font-size:76px}.home-copy-v14 .home-tagline{font-size:34px}.home-lead.compact{font-size:16px;line-height:1.42;max-width:820px}.home-side-v14{min-height:310px}.codex-mini-map-v14{height:195px;margin-bottom:15px}.home-side-v14 p{font-size:15px}.home-begins{padding-top:10px;gap:34px}.home-begins-head h2{font-size:42px}.home-begins-head p{font-size:14px}.begin-card{min-height:205px;padding:22px 24px}.begin-icon{margin-bottom:15px}.begin-card h3{font-size:25px}.begin-card p{font-size:13.5px;line-height:1.48}}

/* v15 footer line + codex presentation */
.footer-signature{display:flex;align-items:baseline;gap:12px;min-width:0;flex:1 1 auto;white-space:nowrap;}
.footer-signature strong{display:inline;color:var(--ink);font-weight:850;}
.footer-signature span{display:inline;color:var(--muted);line-height:1.35;}
.footer-inner{align-items:center;}
@media(max-width:780px){.footer-signature{display:block;white-space:normal}.footer-signature span{display:block;margin-top:4px}}
.codex-intro-v15{padding:58px 0 64px;display:grid;grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr);gap:42px;align-items:start;}
.codex-intro-v15 h1{font-size:clamp(40px,5.2vw,68px);line-height:.96;margin:0 0 18px;}
.codex-begins-head p{font-size:16px;line-height:1.58;max-width:500px;}
.codex-cards-v15{grid-template-columns:1fr 1fr;align-items:stretch;}
.codex-cards-v15 .begin-card{min-height:270px;}
.codex-cards-v15 .begin-card h3{font-size:clamp(28px,3vw,38px);}
.card-cta{margin-top:auto;display:inline-flex;align-self:flex-start;border-radius:999px;padding:10px 15px;background:var(--terra);color:#fff;font-weight:850;box-shadow:0 10px 26px rgba(168,68,44,.16);}
.begin-card:hover .card-cta{filter:brightness(.98)}
@media(max-width:980px){.codex-intro-v15{grid-template-columns:1fr;padding-top:38px}.codex-cards-v15{grid-template-columns:1fr}.codex-cards-v15 .begin-card{min-height:auto}}


/* v16 homepage visual refinement */
.home-side-v14{
  min-height:0;
  padding:26px;
  display:flex;
  flex-direction:column;
  gap:18px;
  border-radius:34px;
  background:
    radial-gradient(circle at 22% 18%, rgba(168,68,44,.075), transparent 30%),
    linear-gradient(180deg,rgba(255,250,240,.74),rgba(232,223,204,.48));
  box-shadow:0 20px 58px rgba(15,38,64,.09);
}
.home-side-v14:before{inset:14px;border-radius:27px;border-color:rgba(168,68,44,.18)}
.home-side-v14:after{inset:25px;border-radius:22px;border-color:rgba(27,49,73,.13)}
.codex-mini-map-v14{
  height:250px;
  margin:0;
  border-radius:25px;
  border:1px solid rgba(27,49,73,.18);
  background-color:rgba(255,250,240,.35);
  background-image:
    linear-gradient(rgba(15,38,64,.06) 1px,transparent 1px),
    linear-gradient(90deg,rgba(15,38,64,.06) 1px,transparent 1px);
  background-size:28px 28px;
  box-shadow:inset 0 0 0 1px rgba(255,250,240,.65);
}
.codex-mini-map-v14 span{
  padding:8px 13px;
  background:rgba(255,250,240,.94);
  border-color:rgba(168,68,44,.62);
  box-shadow:0 7px 22px rgba(15,38,64,.07);
}
.home-side-v14 p{
  margin:0;
  padding:16px 3px 1px;
  border-top:1px solid rgba(27,49,73,.15);
  color:var(--ink-soft);
  font-size:16px;
  line-height:1.46;
  letter-spacing:-.01em;
}
.home-side-v14 p strong{
  color:var(--ink);
  font-weight:650;
}
.home-side-v14 p span{
  color:var(--ink-soft);
}
@media(max-height:820px) and (min-width:981px){
  .home-side-v14{padding:22px;gap:14px;}
  .codex-mini-map-v14{height:208px;}
  .home-side-v14 p{font-size:14.5px;line-height:1.42;padding-top:13px;}
}
@media(max-width:980px){
  .codex-mini-map-v14{height:220px;}
}

/* v17 definitive vertical rhythm fix
   Remove artificial vertical space and normalize page/section/footer spacing site-wide. */
:root { --section-y: 30px; --section-y-tight: 18px; }
main { display: block; }
.wrap,
.page-hero,
.article-shell,
.hero,
.codex-intro-v15,
.home-hero-v14,
.home-begins,
section.wrap {
  padding-top: var(--section-y) !important;
  padding-bottom: var(--section-y) !important;
}
section.wrap + section.wrap,
.home-hero-v14 + .home-begins,
.page-hero + .wrap,
.page-hero + section,
.article-shell + .wrap {
  padding-top: var(--section-y-tight) !important;
}
.home-hero-v14 {
  min-height: 0 !important;
  padding-top: 34px !important;
  padding-bottom: 16px !important;
  margin-bottom: 0 !important;
  align-items: center !important;
}
.home-begins {
  padding-top: 18px !important;
  padding-bottom: 26px !important;
  margin-top: 0 !important;
  gap: 28px !important;
  align-items: center !important;
}
.home-begins-head h2 { margin-bottom: 0 !important; }
.home-begins-head p { margin-top: 10px !important; }
.home-begins-cards { gap: 18px !important; }
.begin-card { min-height: 190px !important; }
.home-side-v14 { align-self: center; }
.home-actions { margin-bottom: 0 !important; }
.home-footer,
footer {
  margin-top: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
.footer-inner,
.home-footer .footer-inner {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
  min-height: 0 !important;
}
.footer-signature {
  line-height: 1.15 !important;
}
.footer-signature span { line-height: 1.15 !important; }
.footer-links { line-height: 1.15 !important; }
/* Interior page compacting without damaging article readability */
.page-title,
.page-hero .page-title,
.codex-intro-v15,
.book-hero,
.atlas-hero,
.writing-hero,
.expertise-hero,
.about-hero {
  margin-top: 0 !important;
  margin-bottom: 14px !important;
}
.page-title h1,
.codex-intro-v15 h1,
.book-hero h1,
.article h1 {
  margin-top: 0 !important;
  margin-bottom: 12px !important;
}
.grid,
.cols-2,
.cols-3,
.codex-cards-v15,
.chapter-list,
.writing-grid,
.expertise-grid {
  row-gap: 16px !important;
}
.article-shell { padding-top: 24px !important; }
.article-body,
.article-content {
  margin-top: 0 !important;
}
@media (min-width: 981px) and (max-height: 840px) {
  .home-hero-v14 { padding-top: 26px !important; padding-bottom: 12px !important; }
  .home-begins { padding-top: 12px !important; padding-bottom: 18px !important; }
  .home-copy-v14 h1 { font-size: 68px !important; }
  .home-copy-v14 .home-tagline { font-size: 30px !important; }
  .home-lead.compact { font-size: 15px !important; line-height: 1.38 !important; }
  .codex-mini-map-v14 { height: 190px !important; }
  .home-side-v14 { padding: 20px !important; gap: 12px !important; }
  .home-begins-head h2 { font-size: 38px !important; }
  .begin-card { min-height: 172px !important; padding: 20px 22px !important; }
  .begin-icon { margin-bottom: 12px !important; }
}
@media (max-width: 980px) {
  .wrap,
  .page-hero,
  .article-shell,
  .hero,
  .codex-intro-v15,
  .home-hero-v14,
  .home-begins,
  section.wrap {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
  }
  .home-begins { padding-top: 8px !important; }
  .footer-inner,
  .home-footer .footer-inner { padding-top: 12px !important; padding-bottom: 12px !important; }
}


/* v19: consistent EA Codex dropdown on every page */
.nav { overflow: visible; }
.nav-links { overflow: visible; }
.nav-group { position: relative; display: inline-flex; align-items: center; padding: 0 0 10px 0; margin-bottom: -10px; }
.nav-group > a { padding-right: 16px; text-decoration: none; }
.nav-group > a::before { content: "⌄"; position: absolute; right: 0; top: 0; color: var(--terra, #A8442C); font-size: 12px; }
.nav-menu { position: absolute; top: calc(100% + 4px); left: -16px; min-width: 168px; padding: 10px; border: 1px solid rgba(27,49,73,.20); background: rgba(255,250,240,.98); box-shadow: 0 18px 50px rgba(15,38,64,.12); border-radius: 14px; display: none; z-index: 200; }
.nav-group:hover .nav-menu, .nav-group:focus-within .nav-menu { display: grid; gap: 6px; }
.nav-menu a { display: block; padding: 10px 12px; border-radius: 10px; color: var(--ink-soft, #3A4F6B); text-decoration: none; white-space: nowrap; }
.nav-menu a:hover, .nav-menu a:focus { background: rgba(168,68,44,.08); color: var(--terra, #A8442C); outline: none; }
.nav-menu a::after { display: none !important; }
@media(max-width:900px){ .nav-group { display: grid; padding-bottom: 0; margin-bottom: 0; } .nav-group > a::before { display: none; } .nav-menu { position: static; display: grid; background: transparent; box-shadow: none; border: 0; padding: 2px 0 0 12px; min-width: 0; } }


/* v20: robust chapter code, captions, and Codex dropdown */
.nav-group{position:relative;display:inline-flex;align-items:center;padding:8px 0;}
.nav-group>a{padding-right:16px;}
.nav-menu{
  position:absolute;
  top:100%;
  left:-14px;
  min-width:154px;
  padding:10px;
  border:1px solid rgba(27,49,73,.20);
  background:rgba(255,250,240,.98);
  box-shadow:0 18px 50px rgba(15,38,64,.12);
  border-radius:14px;
  display:grid;
  gap:6px;
  opacity:0;
  visibility:hidden;
  transform:translateY(4px);
  pointer-events:none;
  z-index:1000;
  transition:opacity .14s ease, transform .14s ease, visibility .14s ease;
}
.nav-group:hover .nav-menu,
.nav-group:focus-within .nav-menu{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
  pointer-events:auto;
}
.nav-menu a{display:block;padding:9px 10px;border-radius:10px;color:var(--ink-soft);text-decoration:none;}
.nav-menu a:hover{background:rgba(168,68,44,.08);color:var(--terra);}
.article-content pre,
.article-body pre,
.code-plate pre{
  overflow-x:auto !important;
  white-space:pre !important;
}
.article-content pre code,
.article-body pre code,
.code-plate pre code{
  display:block !important;
  white-space:pre !important;
  tab-size:2 !important;
  font-family:var(--mono) !important;
  font-size:13.5px !important;
  line-height:1.55 !important;
}
.article-content .figure-caption,
.article-body .figure-caption,
p.figure-caption,
.article-content figcaption,
.article-body figcaption{
  font-size:12.5px !important;
  line-height:1.45 !important;
  color:var(--muted, var(--ink-soft)) !important;
  font-family:var(--sans) !important;
  font-weight:500 !important;
  letter-spacing:0 !important;
  text-transform:none !important;
  margin:10px 0 28px !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  text-align:left !important;
}
.article-content .figure-caption::first-letter,
.article-body .figure-caption::first-letter,
p.figure-caption::first-letter{
  font-weight:700;
}


/* v23 landing cleanup + simple footer identity */
.home-hero-clean {
  display: block;
  padding: clamp(48px, 7vh, 76px) 0 clamp(24px, 4vh, 38px) !important;
}
.home-copy-clean { max-width: 980px; }
.home-copy-clean h1 {
  font-family: var(--serif);
  font-size: clamp(58px, 8.4vw, 112px);
  line-height: .88;
  letter-spacing: -.055em;
  color: var(--ink);
  margin: 0;
}
.home-copy-clean .home-tagline {
  font-family: var(--serif);
  font-size: clamp(30px, 3.6vw, 48px);
  line-height: 1.04;
  margin: 10px 0 0;
  color: var(--ink);
  max-width: 920px;
}
.home-copy-clean .home-lead {
  margin: 18px 0 0;
  max-width: 880px;
  color: var(--ink-soft);
  font-size: clamp(16px, 1.5vw, 19px);
  line-height: 1.55;
}
.home-begins-clean {
  display: grid;
  grid-template-columns: minmax(280px,.82fr) minmax(0,1.38fr);
  gap: clamp(30px, 5vw, 58px);
  align-items: start;
  padding: clamp(18px, 3vh, 32px) 0 clamp(36px, 5vh, 60px) !important;
}
.home-begins-intro h2 {
  font-family: var(--serif);
  font-size: clamp(38px, 4.5vw, 62px);
  line-height: .95;
  letter-spacing: -.045em;
  margin: 0;
  color: var(--ink);
}
.home-begins-intro h2 em { color: var(--terra); font-style: italic; font-weight: 500; }
.home-begins-intro p {
  margin: 16px 0 0;
  color: var(--ink-soft);
  line-height: 1.55;
  font-size: 15.5px;
  max-width: 520px;
}
.clean-cards { align-items: stretch; }
.clean-cards .begin-card { min-height: 260px; }
.footer-signature { display:flex; align-items:center; gap:0; white-space:nowrap; }
.footer-signature strong { font-family: var(--serif); font-style: italic; font-size: 18px; letter-spacing: -.015em; }
.footer-inner { padding-top: 14px !important; padding-bottom: 14px !important; }
@media (max-width:980px) {
  .home-begins-clean { grid-template-columns: 1fr; }
  .home-begins-cards.clean-cards { grid-template-columns: 1fr; }
}
@media (max-height:760px) and (min-width:981px) {
  .home-hero-clean { padding-top: 40px !important; padding-bottom: 20px !important; }
  .home-copy-clean h1 { font-size: 82px; }
  .home-copy-clean .home-tagline { font-size: 36px; }
  .home-copy-clean .home-lead { font-size: 16px; line-height: 1.42; }
  .home-begins-clean { padding-top: 12px !important; padding-bottom: 32px !important; }
  .home-begins-intro h2 { font-size: 46px; }
  .clean-cards .begin-card { min-height: 218px; }
}

/* v24: final landing structure, header alignment, compact parallel intro */
.site-header{
  min-height:72px !important;
  display:flex !important;
  align-items:center !important;
}
.site-header .nav,
.nav{
  width:min(1180px, calc(100% - 40px)) !important;
  min-height:72px !important;
  padding:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:28px !important;
  overflow:visible !important;
}
.brand{
  display:inline-flex !important;
  align-items:center !important;
  gap:11px !important;
  line-height:1 !important;
  white-space:nowrap !important;
  font-family:var(--serif) !important;
  font-size:24px !important;
  font-weight:500 !important;
  letter-spacing:-.035em !important;
}
.brand-mark{
  width:38px !important;
  height:38px !important;
  flex:0 0 38px !important;
  border-radius:12px !important;
  margin:0 !important;
}
.nav-links{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:28px !important;
  line-height:1 !important;
  font-size:14px !important;
}
.nav-links > a,
.nav-group > a{
  display:inline-flex !important;
  align-items:center !important;
  height:72px !important;
  line-height:1 !important;
}
.nav-group{
  display:inline-flex !important;
  align-items:center !important;
  height:72px !important;
  padding:0 !important;
  margin:0 !important;
  line-height:1 !important;
}
.nav-group > a{
  position:relative !important;
  padding-right:16px !important;
}
.nav-group > a::before{
  top:50% !important;
  transform:translateY(-50%) !important;
  line-height:1 !important;
}
.nav-menu{ top:calc(100% - 4px) !important; }
.home-hero-clean{
  padding:clamp(38px, 6vh, 62px) 0 clamp(8px, 2vh, 18px) !important;
}
.home-copy-clean{ max-width:1100px !important; }
.home-copy-clean h1{
  font-size:clamp(64px, 10vw, 132px) !important;
  max-width:1120px !important;
}
.home-copy-clean .home-tagline,
.home-copy-clean .home-lead{ display:none !important; }
.home-begins-clean{
  grid-template-columns:minmax(320px,.78fr) minmax(0,1.22fr) !important;
  gap:clamp(34px, 5vw, 72px) !important;
  align-items:center !important;
  padding:clamp(12px, 2.4vh, 28px) 0 clamp(26px, 4vh, 48px) !important;
}
.home-begins-intro h2{ font-size:clamp(38px, 4.6vw, 62px) !important; }
.home-begins-intro p{
  max-width:560px !important;
  font-size:16px !important;
  line-height:1.55 !important;
}
.home-begins-cards.clean-cards{
  display:grid !important;
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  gap:22px !important;
}
.clean-cards .begin-card{ min-height:230px !important; }
.footer-inner,
.home-footer .footer-inner{
  min-height:56px !important;
  padding-top:10px !important;
  padding-bottom:10px !important;
  align-items:center !important;
}
@media(max-width:980px){
  .site-header .nav,.nav{min-height:auto !important;padding:14px 0 !important;align-items:flex-start !important;}
  .brand{font-size:21px !important;}
  .brand-mark{width:34px !important;height:34px !important;flex-basis:34px !important;}
  .nav-links{gap:14px !important;flex-wrap:wrap;justify-content:flex-start !important;}
  .nav-links > a,.nav-group,.nav-group > a{height:auto !important;}
  .home-copy-clean h1{font-size:clamp(52px, 16vw, 82px) !important;}
  .home-begins-clean{grid-template-columns:1fr !important;align-items:start !important;}
  .home-begins-cards.clean-cards{grid-template-columns:1fr !important;}
}

/* v27: Codex page layout fix - text first, Book/Atlas cards below */
.codex-intro-v15{
  display:block !important;
  padding:clamp(32px, 5vh, 54px) 0 clamp(34px, 5vh, 60px) !important;
}
.codex-intro-v15 .codex-begins-head{
  max-width:900px !important;
  margin:0 0 28px 0 !important;
}
.codex-intro-v15 .codex-begins-head h1{
  font-size:clamp(42px, 5.8vw, 72px) !important;
  line-height:.96 !important;
  margin:0 0 12px 0 !important;
}
.codex-intro-v15 .codex-begins-head p{
  max-width:820px !important;
  font-size:17px !important;
  line-height:1.55 !important;
  margin:0 !important;
}
.codex-cards-v15{
  display:grid !important;
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  gap:24px !important;
  align-items:stretch !important;
  width:100% !important;
}
.codex-cards-v15 .begin-card{
  min-height:260px !important;
  padding:30px 34px !important;
}
.codex-cards-v15 .begin-card h3{
  font-size:clamp(32px, 3.6vw, 46px) !important;
  line-height:1 !important;
  margin:8px 0 16px !important;
}
.codex-cards-v15 .begin-card p{
  max-width:560px !important;
  font-size:16px !important;
  line-height:1.52 !important;
}
.codex-cards-v15 .card-cta{
  margin-top:auto !important;
  display:inline-flex !important;
  align-items:center !important;
  align-self:flex-start !important;
  border-radius:999px !important;
  padding:11px 17px !important;
  background:var(--terra) !important;
  color:var(--white) !important;
  font-weight:800 !important;
  box-shadow:0 10px 26px rgba(168,68,44,.16) !important;
}
@media(max-width:980px){
  .codex-cards-v15{grid-template-columns:1fr !important;}
  .codex-cards-v15 .begin-card{min-height:auto !important;}
}

/* v27: final header vertical alignment */
.site-header .nav,
.nav{ align-items:center !important; }
.brand,
.nav-links,
.nav-group,
.nav-links > a,
.nav-group > a{ align-items:center !important; }


/* v28: schema link, card consistency, header/footer refinement */
.site-header .nav,
.nav {
  height: 72px !important;
  min-height: 72px !important;
  padding: 0 !important;
  align-items: center !important;
}
.brand {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  line-height: 1 !important;
}
.brand-mark {
  width: 34px !important;
  height: 34px !important;
  flex: 0 0 34px !important;
}
.brand span:not(.brand-mark) {
  display: inline-flex !important;
  align-items: center !important;
  line-height: 1 !important;
}
.nav-links,
.nav-group,
.nav-links > a,
.nav-group > a {
  align-items: center !important;
  line-height: 1 !important;
}
.nav-links { gap: 26px !important; }
.nav-menu { z-index: 500 !important; }

.codex-overview { padding-top: 10px !important; }
.codex-overview-grid { align-items: stretch !important; }
.codex-overview-grid .card {
  min-height: 270px;
  display: flex;
  flex-direction: column;
}
.codex-overview-grid .card h3 { font-size: clamp(28px, 3.1vw, 40px); }
.codex-overview-grid .card p { margin-bottom: 22px; }
.codex-overview-grid .card .button { margin-top: auto; align-self: flex-start; }
.codex-overview-grid .card code {
  padding: .08em .32em;
  border: 1px solid rgba(196,65,38,.16);
  border-radius: 6px;
  background: rgba(196,65,38,.07);
  color: var(--accent);
  font-family: var(--mono);
  font-size: .9em;
}

.footer-inner,
.home-footer .footer-inner {
  min-height: 54px !important;
  padding-top: 8px !important;
  padding-bottom: 8px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
}
.footer-signature strong {
  font-family: var(--serif) !important;
  font-style: italic !important;
  font-weight: 400 !important;
  font-size: 25px !important;
  line-height: 1 !important;
  color: var(--accent) !important;
  letter-spacing: -.025em !important;
}
.footer-links {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
}
.footer-links a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  line-height: 1 !important;
  color: var(--accent) !important;
  font-weight: 650 !important;
  text-decoration: none !important;
}
.social-mark {
  width: 24px;
  height: 24px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 700;
  color: var(--accent);
  background: rgba(255,255,255,.45);
}
.footer-links a:hover .social-mark { background: var(--accent); color: #fff; border-color: var(--accent); }
.atlas-github { text-decoration: none !important; }

@media (max-width: 980px) {
  .site-header .nav, .nav { height: auto !important; min-height: 0 !important; padding: 12px 0 !important; }
  .nav-links { gap: 14px !important; }
  .cols-3.codex-overview-grid { grid-template-columns: 1fr !important; }
  .footer-inner, .home-footer .footer-inner { flex-direction: column !important; align-items: flex-start !important; }
  .footer-links { flex-wrap: wrap !important; }
}

/* v29 requested layout and footer corrections */
.home-begins-clean.home-begins-stacked { display:block !important; max-width:1040px !important; padding-top:22px !important; padding-bottom:34px !important; }
.home-begins-stacked .home-begins-intro { max-width:760px !important; margin:0 0 22px 0 !important; }
.home-begins-stacked .home-begins-intro h2 { max-width:680px !important; margin:0 !important; }
.home-begins-stacked .home-begins-intro p { max-width:760px !important; margin-top:12px !important; }
.home-begins-stacked .home-begins-cards.clean-cards { display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:20px !important; width:100% !important; }
.home-begins-stacked .begin-card { min-height:210px !important; }
.footer-inner,.home-footer .footer-inner { align-items:center !important; padding-top:12px !important; padding-bottom:12px !important; }
.footer-signature { display:inline-flex !important; align-items:center !important; gap:6px !important; white-space:nowrap !important; flex:0 0 auto !important; }
.footer-signature .copyright-mark,.footer-signature strong { font-family:var(--sans) !important; font-style:normal !important; font-size:14px !important; line-height:1 !important; letter-spacing:0 !important; color:var(--terra) !important; font-weight:800 !important; }
.footer-links { display:flex !important; align-items:center !important; gap:16px !important; }
.footer-links a { display:inline-flex !important; align-items:center !important; gap:7px !important; font-size:14px !important; line-height:1 !important; color:var(--terra) !important; text-decoration:none !important; font-weight:800 !important; }
.social-mark { width:17px !important; height:17px !important; display:inline-grid !important; place-items:center !important; border:1px solid rgba(168,68,44,.35) !important; border-radius:4px !important; background:rgba(255,250,240,.58) !important; color:var(--terra) !important; flex:0 0 17px !important; font-family:var(--mono) !important; font-weight:900 !important; letter-spacing:-.02em !important; }
.social-linkedin::before { content:"in"; font-size:9px; line-height:1; }
.social-blog::before { content:"B"; font-size:10px; line-height:1; font-family:var(--serif); font-style:italic; }
.social-speakerdeck::before { content:"SD"; font-size:7px; line-height:1; }
.footer-links a:hover .social-mark { background:var(--terra) !important; color:var(--paper) !important; }
.footer-links a:hover { color:var(--ink) !important; }
.atlas-canvas-wrap .atlas-legend { position:relative !important; top:auto !important; left:auto !important; right:auto !important; transform:none !important; width:calc(100% - 32px) !important; max-width:none !important; min-height:auto !important; margin:16px !important; padding:12px 16px !important; box-sizing:border-box !important; display:flex !important; flex-wrap:wrap !important; align-items:center !important; gap:10px 18px !important; overflow:visible !important; }
.atlas-canvas-wrap .atlas-legend-title,.atlas-canvas-wrap .atlas-legend-item { flex:0 0 auto !important; }
@media(max-width:780px){ .home-begins-stacked .home-begins-cards.clean-cards{grid-template-columns:1fr !important;} .footer-inner,.home-footer .footer-inner{align-items:flex-start !important;} .footer-links{flex-wrap:wrap !important;} }

/* v31: book introduction, page breadcrumbs, and SVG footer icons */
.page-kicker{display:inline-flex;align-items:center;gap:.35rem;margin:0 0 16px;color:var(--terra);font:800 12px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase}.page-kicker a{color:inherit;text-decoration:none}.page-kicker a:hover{text-decoration:underline;text-underline-offset:3px}.book-introduction{padding-top:20px!important;padding-bottom:18px!important}.compact-head{margin-bottom:16px!important}.intro-panel{max-width:940px;border:1px solid rgba(27,49,73,.18);border-radius:24px;background:linear-gradient(180deg,rgba(255,250,240,.66),rgba(232,223,204,.42));padding:28px 32px;box-shadow:0 16px 48px rgba(15,38,64,.06)}.intro-panel p{margin:0 0 1em;color:var(--ink-soft);font-size:17px;line-height:1.68}.intro-panel p:first-child{color:var(--ink);font-weight:750}.intro-panel p:last-child{margin-bottom:0}.footer-signature strong{font-size:14px!important;color:var(--terra)!important;font-family:var(--sans)!important;font-style:normal!important;font-weight:800!important}.footer-links a{display:inline-flex!important;align-items:center!important;gap:7px!important;color:var(--terra)!important;text-decoration:none!important;font-weight:800!important;font-size:14px!important}.social-icon-img{width:17px;height:17px;display:inline-block;flex:0 0 17px}.footer-links a:hover .social-label{color:var(--ink)!important}@media(max-width:780px){.intro-panel{padding:22px}.page-kicker{line-height:1.35}}


/* v32: unified page kicker, compact book intro, part-role descriptions */
.page-kicker,
.article .page-kicker {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  margin: 0 0 16px;
  color: rgba(15, 38, 64, 0.68);
  font: 500 13px/1.2 var(--mono);
  letter-spacing: 0.02em;
  text-transform: none;
}
.page-kicker::before,
.article .page-kicker::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: var(--terra);
  flex: 0 0 7px;
}
.page-kicker a { color: inherit; text-decoration: none; }
.page-kicker a:hover { color: var(--terra); }
.book-introduction .section-head,
.book-introduction .compact-head { display: block !important; margin-bottom: 14px !important; }
.book-introduction .section-head p,
.book-introduction .compact-head p { display: none !important; }
.book-introduction h2 { margin-bottom: 0 !important; }
.part-lead { max-width: 920px !important; color: rgba(15, 38, 64, 0.74) !important; font-size: 16px !important; line-height: 1.62 !important; }
.part-block { margin-bottom: 34px !important; }
.part-block-future { margin-top: 18px !important; }
.future-card { opacity: 0.88; }
.future-card .muted-link { color: rgba(168, 68, 44, 0.72); }
@media (max-width: 780px) { .page-kicker { font-size: 12px; margin-bottom: 12px; } .part-lead { font-size: 15px !important; } }


/* v36: Atlas UX fixes for schema v1.1.0 */
.atlas-canvas-wrap { overflow: auto !important; }
.atlas-canvas-wrap #atlas-svg { min-width: 1260px !important; }
.atlas-node-method-badge { pointer-events: none; }
.atlas-node-method-badge-bg { fill: rgba(255,250,240,.94); stroke: rgba(168,68,44,.38); stroke-width: 1; }
.atlas-node-method-badge-text { font: 700 8.5px var(--mono); fill: var(--accent); letter-spacing: .015em; }
.atlas-node-name { font-size: 13px !important; }
.atlas-node-chapter { font-size: 9px !important; }
.atlas-zone rect { vector-effect: non-scaling-stroke; }
.atlas-canvas-wrap .atlas-legend { width: max-content !important; min-width: min(100% - 32px, 720px) !important; max-width: calc(100% - 32px) !important; }
@media (max-width: 980px) { .atlas-canvas-wrap .atlas-legend { display: flex !important; } }

/* Final Atlas node readability and overlay badge placement */
.atlas-node-name{font-size:12.8px!important;line-height:1.16;font-weight:650!important;letter-spacing:-.01em!important}.atlas-node-chapter{font-size:8.2px!important;letter-spacing:.035em}.atlas-node-method-badge{pointer-events:none}.atlas-node-method-badge-bg{fill:rgba(255,250,240,.98);stroke:rgba(168,68,44,.38);stroke-width:1}.atlas-node-method-badge-text{font:800 8px var(--mono);fill:var(--accent);letter-spacing:.005em}.atlas-node.atlas-node-selected .atlas-node-method-badge-text,.atlas-node.atlas-node-case-active .atlas-node-method-badge-text{fill:var(--accent)}.atlas-node.atlas-node-selected .atlas-node-method-badge-bg,.atlas-node.atlas-node-case-active .atlas-node-method-badge-bg{fill:rgba(255,250,240,.98);stroke:rgba(168,68,44,.42)}
/* v40: corrective patch after UX review */
.page-title > .pill { display: none !important; }
.page-hero { padding-top: 58px !important; }
.page-title .page-kicker { margin-bottom: 18px !important; }
.atlas-shell { width: min(1460px, calc(100% - 28px)) !important; margin: 18px auto 36px !important; }
.atlas-bar { padding: 12px 16px !important; margin-bottom: 10px !important; gap: 12px !important; }
.atlas-concept-bar { padding: 9px 12px !important; margin-bottom: 10px !important; gap: 8px !important; }
.atlas-concept-btn { padding: 6px 10px !important; font-size: 12px !important; }
.atlas-case-strip { padding: 10px 16px !important; margin-bottom: 10px !important; }
.atlas-canvas-wrap { overflow: hidden !important; border-radius: 18px !important; }
.atlas-canvas-wrap #atlas-svg { min-width: 0 !important; width: 100% !important; height: auto !important; max-height: calc(100vh - 270px) !important; display: block !important; }
.atlas-canvas-wrap .atlas-legend { position:absolute !important; top:12px !important; left:12px !important; right:auto !important; width:auto !important; min-width:0 !important; max-width:min(420px, calc(100% - 24px)) !important; margin:0 !important; padding:8px 10px !important; gap:8px 12px !important; background:rgba(255,250,240,.92) !important; backdrop-filter:blur(8px) !important; z-index:2 !important; }
.atlas-node-name{font-size:12.2px!important;line-height:1.12!important;font-weight:680!important;letter-spacing:-.018em!important}.atlas-node-chapter{font-size:8px!important;}
@media (max-height: 820px) and (min-width: 981px) { .atlas-shell { margin-top: 12px !important; } .atlas-bar { padding: 10px 14px !important; } .atlas-concept-bar { padding: 8px 10px !important; } .atlas-canvas-wrap #atlas-svg { max-height: calc(100vh - 235px) !important; } }
@media (max-width: 980px) { .atlas-canvas-wrap { overflow:auto !important; } .atlas-canvas-wrap #atlas-svg { min-width: 980px !important; max-height: none !important; } .atlas-canvas-wrap .atlas-legend { position:relative !important; top:auto !important; left:auto !important; margin:12px !important; max-width:calc(100% - 24px) !important; } }

/* v41: top-left page-title and local-file navigation fix */
.page-title > .eyebrow { display: none !important; }
.page-title > .eyebrow + .page-kicker { margin-top: 0 !important; }
.page-title > .page-kicker + .page-kicker { display: none !important; }
.schema-wrap .brand span:not(.brand-mark) { font-family: var(--serif); font-size: 24px; letter-spacing: -0.035em; }

/* v43 Atlas readability and viewport validation fixes */
.atlas-hero-compact{padding:22px 0 4px!important}
.atlas-hero-compact .page-kicker{font-size:11px!important;margin-bottom:6px!important}
.atlas-hero-compact h1{font-size:clamp(30px,3.5vw,44px)!important;max-width:36ch!important;line-height:.95!important;margin:0!important}
.atlas-hero-compact h1 em{color:var(--terra);font-style:italic}
.atlas-hero-compact p{font-family:var(--sans)!important;font-size:14px!important;line-height:1.42!important;color:var(--muted)!important;max-width:76ch!important;margin:10px 0 0!important}
.atlas-shell{width:min(1460px,calc(100% - 40px))!important;margin:12px auto 28px!important;padding-top:0!important}
.atlas-bar{padding:10px 14px!important;margin-bottom:8px!important;gap:10px!important}
.atlas-bar-stats{gap:14px!important}.atlas-bar-eyebrow{font-size:11px!important}.atlas-stat-label{font-size:10px!important}.atlas-stat-value{font-size:15px!important}
.atlas-bar-controls{gap:8px!important}.atlas-btn{padding:8px 12px!important;font-size:12px!important}.atlas-search{min-width:220px!important;padding:8px 10px!important}
.atlas-concept-bar{padding:8px 12px!important;margin-bottom:8px!important;gap:8px!important}.atlas-concept-btn{padding:6px 10px!important;font-size:12px!important}
.atlas-canvas-wrap{overflow:hidden!important;border-radius:18px!important;padding:0!important;background:rgba(255,250,240,.72)!important}
.atlas-canvas-wrap #atlas-svg{display:block!important;width:100%!important;height:auto!important;max-height:calc(100vh - 230px)!important;min-width:0!important}
.atlas-zone-label{font-size:10.5px!important;font-weight:850!important;letter-spacing:.08em!important;fill:var(--accent)!important}
.atlas-node-name{font-size:12.8px!important;line-height:1.15!important;font-weight:750!important;letter-spacing:-.015em!important}.atlas-node-chapter{font-size:8.2px!important;letter-spacing:.035em!important}
.atlas-node-bg{stroke-width:1.2!important}
.atlas-edge{opacity:.28!important;stroke-width:1!important}.atlas-edge-active{opacity:.88!important;stroke-width:1.7!important}.atlas-edge-dim{opacity:.08!important}
.atlas-case-edge{stroke-width:2!important}.atlas-case-edge-active{stroke-width:2.6!important}
.atlas-node-method-badge-bg{fill:rgba(255,250,240,.99)!important;stroke:rgba(168,68,44,.55)!important;stroke-width:1.15!important}.atlas-node-method-badge-text{font:850 9.6px var(--mono)!important;fill:var(--accent)!important;letter-spacing:.01em!important}
.atlas-canvas-wrap .atlas-legend{position:absolute!important;top:10px!important;left:10px!important;max-width:min(420px,calc(100% - 20px))!important;padding:7px 10px!important;margin:0!important;background:rgba(255,250,240,.92)!important;backdrop-filter:blur(8px)!important;gap:7px 12px!important;font-size:12px!important}
@media(max-height:820px) and (min-width:981px){.atlas-hero-compact{padding-top:14px!important}.atlas-hero-compact p{display:none!important}.atlas-shell{margin-top:8px!important}.atlas-canvas-wrap #atlas-svg{max-height:calc(100vh - 190px)!important}}
@media(max-width:980px){.atlas-hero-compact p{display:block!important}.atlas-canvas-wrap{overflow:auto!important}.atlas-canvas-wrap #atlas-svg{min-width:980px!important;max-height:none!important}.atlas-canvas-wrap .atlas-legend{position:relative!important;top:auto!important;left:auto!important;margin:10px!important}}

/* v57: previous footer design with smaller platform logos */
.footer-links a { align-items: center !important; }
.social-icon-img { width: 14px !important; height: 14px !important; display: inline-block !important; flex: 0 0 14px !important; object-fit: contain !important; opacity: .86; transform: translateY(-.5px); }
.footer-links a:hover .social-icon-img { opacity: 1; }

/* v58: refined footer social media module */
footer {
  position: relative !important;
  border-top: 1px solid rgba(27,49,73,.14) !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(168,68,44,.075), transparent 32%),
    linear-gradient(180deg, rgba(255,250,240,.84), rgba(242,235,219,.72)) !important;
}
footer::before {
  content: "";
  position: absolute;
  left: max(20px, calc((100% - 1180px) / 2));
  right: max(20px, calc((100% - 1180px) / 2));
  top: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(168,68,44,.42), rgba(27,49,73,.22), transparent);
  pointer-events: none;
}
.footer-inner {
  align-items: center !important;
  gap: 28px !important;
}
.footer-links {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 7px !important;
  border: 1px solid rgba(27,49,73,.12) !important;
  border-radius: 999px !important;
  background: rgba(255,250,240,.62) !important;
  box-shadow: 0 14px 34px rgba(27,49,73,.06), inset 0 1px 0 rgba(255,255,255,.66) !important;
  flex-wrap: nowrap !important;
}
.footer-links::before {
  content: "Follow";
  display: inline-flex;
  align-items: center;
  height: 32px;
  padding: 0 8px 0 10px;
  color: rgba(27,49,73,.58);
  font: 750 10px/1 var(--mono);
  letter-spacing: .11em;
  text-transform: uppercase;
}
.footer-links a {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  min-height: 34px !important;
  padding: 0 12px 0 8px !important;
  border: 1px solid transparent !important;
  border-radius: 999px !important;
  color: var(--ink-soft) !important;
  background: transparent !important;
  text-decoration: none !important;
  font: 750 13px/1 var(--sans) !important;
  transition: background .18s var(--ease), border-color .18s var(--ease), color .18s var(--ease), transform .18s var(--ease), box-shadow .18s var(--ease) !important;
}
.footer-links a:hover,
.footer-links a:focus-visible {
  color: var(--terra) !important;
  background: rgba(255,255,255,.72) !important;
  border-color: rgba(168,68,44,.20) !important;
  box-shadow: 0 10px 22px rgba(27,49,73,.07) !important;
  transform: translateY(-1px) !important;
  outline: none !important;
}
.social-icon-img {
  width: 15px !important;
  height: 15px !important;
  object-fit: contain !important;
  display: block !important;
  color: currentColor !important;
  opacity: .82 !important;
  flex: 0 0 auto !important;
}
.footer-links a:hover .social-icon-img,
.footer-links a:focus-visible .social-icon-img { opacity: 1 !important; }
.social-label {
  display: inline !important;
  white-space: nowrap !important;
}
@media (max-width: 720px) {
  .footer-links {
    width: 100% !important;
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
    border-radius: 24px !important;
  }
  .footer-links::before { width: 100%; height: auto; padding: 4px 8px 2px; }
}

/* v59: boxed copyright signature, aligned with refined social module */
.footer-signature {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 48px !important;
  padding: 7px 16px 7px 10px !important;
  border: 1px solid rgba(27,49,73,.12) !important;
  border-radius: 999px !important;
  background: rgba(255,250,240,.62) !important;
  box-shadow: 0 14px 34px rgba(27,49,73,.06), inset 0 1px 0 rgba(255,255,255,.66) !important;
  color: var(--ink-soft) !important;
  white-space: nowrap !important;
}
.footer-signature::before {
  content: "";
  width: 30px;
  height: 30px;
  border-radius: 999px;
  border: 1px solid rgba(168,68,44,.18);
  background: radial-gradient(circle at 36% 28%, rgba(168,68,44,.16), rgba(168,68,44,.055) 62%, rgba(255,250,240,.72));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.72);
  flex: 0 0 30px;
}
.footer-signature .copyright-mark {
  position: absolute !important;
  left: 19px !important;
  top: 50% !important;
  transform: translateY(-51%) !important;
  width: 12px !important;
  text-align: center !important;
  color: var(--terra) !important;
  font: 850 12px/1 var(--sans) !important;
}
.footer-signature .copyright-year {
  color: rgba(27,49,73,.58) !important;
  font: 750 10px/1 var(--mono) !important;
  letter-spacing: .08em !important;
}
.footer-signature strong {
  color: var(--ink) !important;
  font: 800 13px/1 var(--sans) !important;
  letter-spacing: -.01em !important;
}
@media (max-width: 720px) {
  .footer-signature {
    width: 100% !important;
    justify-content: flex-start !important;
    border-radius: 24px !important;
  }
}

/* v60: refined author copyright as minimal editorial footer text, not a pill */
.footer-signature {
  position: relative !important;
  display: inline-flex !important;
  align-items: baseline !important;
  gap: 7px !important;
  min-height: auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: rgba(27,49,73,.62) !important;
  white-space: nowrap !important;
  flex: 0 1 auto !important;
}
.footer-signature::before { content: none !important; display: none !important; }
.footer-signature .copyright-mark {
  position: static !important;
  transform: none !important;
  width: auto !important;
  text-align: left !important;
  color: var(--terra) !important;
  font: 700 13px/1 var(--sans) !important;
}
.footer-signature .copyright-year {
  color: rgba(27,49,73,.56) !important;
  font: 650 12px/1 var(--mono) !important;
  letter-spacing: .06em !important;
}
.footer-signature strong {
  color: var(--ink) !important;
  font: 760 13px/1 var(--sans) !important;
  letter-spacing: -.005em !important;
}
.footer-signature strong::before {
  content: "";
  display: inline-block;
  width: 18px;
  height: 1px;
  margin: 0 10px 3px 3px;
  background: linear-gradient(90deg, rgba(168,68,44,.55), rgba(27,49,73,.18));
}
.footer-inner,
.home-footer .footer-inner {
  padding-top: 16px !important;
  padding-bottom: 16px !important;
}
@media (max-width: 720px) {
  .footer-signature {
    width: auto !important;
    white-space: normal !important;
    line-height: 1.4 !important;
  }
  .footer-signature strong::before { width: 14px; margin-left: 2px; margin-right: 8px; }
}

/* v61: minimal editorial footer social links, no enclosing module */
.footer-links {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 20px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  flex-wrap: nowrap !important;
}
.footer-links::before {
  content: none !important;
  display: none !important;
}
.footer-links a {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  min-height: auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: rgba(27,49,73,.78) !important;
  text-decoration: none !important;
  font: 750 13px/1 var(--sans) !important;
  transition: color .18s var(--ease), opacity .18s var(--ease), transform .18s var(--ease) !important;
}
.footer-links a + a::before {
  content: "";
  position: absolute;
  left: -10px;
  top: 50%;
  width: 1px;
  height: 14px;
  transform: translateY(-50%);
  background: rgba(27,49,73,.16);
}
.footer-links a:hover,
.footer-links a:focus-visible {
  color: var(--terra) !important;
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  transform: translateY(-1px) !important;
  outline: none !important;
}
.footer-links a::after {
  content: "";
  position: absolute;
  left: 22px;
  right: 0;
  bottom: -6px;
  height: 1px;
  background: currentColor;
  opacity: 0;
  transform: scaleX(.65);
  transform-origin: left center;
  transition: opacity .18s var(--ease), transform .18s var(--ease);
}
.footer-links a:hover::after,
.footer-links a:focus-visible::after {
  opacity: .55;
  transform: scaleX(1);
}
.social-icon-img {
  width: 14px !important;
  height: 14px !important;
  object-fit: contain !important;
  display: block !important;
  color: currentColor !important;
  opacity: .9 !important;
  flex: 0 0 auto !important;
  transform: translateY(-.5px) !important;
}
.footer-links a:hover .social-icon-img,
.footer-links a:focus-visible .social-icon-img { opacity: 1 !important; }
.social-label {
  display: inline !important;
  white-space: nowrap !important;
}
@media (max-width: 720px) {
  .footer-inner { align-items: flex-start !important; }
  .footer-links {
    width: auto !important;
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
    gap: 14px 18px !important;
  }
  .footer-links a + a::before { display: none !important; }
}

/* v63: public schema release links and final minimal footer copyright */
.footer-signature {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--terra) !important;
  white-space: nowrap !important;
}
.footer-signature::before,
.footer-signature::after { content: none !important; display: none !important; }
.footer-signature em {
  font-family: var(--sans) !important;
  font-size: 14px !important;
  font-style: italic !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
  line-height: 1.2 !important;
  color: var(--terra) !important;
}
@media(max-width:780px){
  .footer-signature { white-space: normal !important; }
}


/* v66 book refresh from DOCX sources */
.article-content table{width:100%;border-collapse:collapse;margin:2em 0;border:1px solid rgba(27,49,73,.24);background:rgba(255,250,240,.44);font-size:15.5px;line-height:1.45;display:table;table-layout:auto}.article-content th,.article-content td{border:1px solid rgba(27,49,73,.18);padding:10px 12px;vertical-align:top}.article-content th{font-weight:800;color:var(--ink);background:rgba(168,68,44,.08)}.article-content blockquote{margin:1.8em 0;padding:18px 22px;border-left:4px solid var(--terra);background:rgba(168,68,44,.06);border-radius:0 16px 16px 0;color:var(--ink)}.article-content blockquote p{margin:.4em 0}.article-content figure img{margin-bottom:.6em}.article-content figcaption{font:700 13px/1.4 var(--mono);color:var(--ink-soft);text-transform:uppercase;letter-spacing:.05em}.future-card{opacity:.78}.muted-link{color:var(--ink-soft)!important}
@media(max-width:780px){.article-content table{display:block;overflow-x:auto;white-space:nowrap}}


/* v67 book typography and code-integrity repair */
.article-content ul,
.article-content ol,
.article-body ul,
.article-body ol {
  color: var(--ink) !important;
}
.article-content li,
.article-content li p,
.article-body li,
.article-body li p {
  color: var(--ink) !important;
}
.article-content blockquote:not(.pullquote),
.article-body blockquote:not(.pullquote) {
  color: var(--ink) !important;
}
.article-content pre,
.article-body pre,
.article-content pre.code-listing {
  overflow-x: auto !important;
  white-space: pre !important;
}
.article-content pre code,
.article-body pre code,
.article-content pre.code-listing code {
  display: block !important;
  white-space: pre !important;
  tab-size: 2 !important;
  -moz-tab-size: 2 !important;
  font-family: var(--mono) !important;
  font-size: 13.5px !important;
  line-height: 1.58 !important;
}

/* v68: ACME Pharma card added to existing landing layout without changing visual language */
.home-begins-stacked .home-begins-cards.clean-cards { grid-template-columns: repeat(3,minmax(0,1fr)) !important; }
@media(max-width:980px){ .home-begins-stacked .home-begins-cards.clean-cards { grid-template-columns: 1fr !important; } }

/* v68 logo restoration: refined home card pictograms, scoped to landing cards only */
.begin-icon.begin-icon-svg {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: linear-gradient(180deg, rgba(255,250,240,.92), rgba(232,223,204,.78));
  border: 1px solid rgba(168,68,44,.18);
  color: var(--terra);
  box-shadow: 0 8px 20px rgba(15,38,64,.055);
}
.begin-icon.begin-icon-svg svg {
  width: 20px;
  height: 20px;
  display: block;
}
.begin-card:hover .begin-icon.begin-icon-svg {
  border-color: rgba(168,68,44,.32);
  box-shadow: 0 10px 24px rgba(15,38,64,.08);
}


/* V68 requested corrections: normalize Approach card title form and remove footer shaded background. */
footer,
.home-footer {
  background: var(--paper) !important;
  background-image: none !important;
}
.approach-grid .card h3 {
  min-height: 2.1em;
}

/* V68 footer and cross-page card hover correction */
footer,
.home-footer {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}
footer::before,
.home-footer::before {
  content: none !important;
  display: none !important;
  background: none !important;
}

/* Apply the same red left hover accent used on Approach cards to text/card boxes site-wide. */
.card,
.resource-card,
.essay-card,
.chapter-card,
.begin-card,
.atlas-card,
.feature-plate,
.intro-panel,
.content-narrow.card,
.bio-card,
.acme-detail,
.acme-steps button,
.nextprev .link,
.chapter-nav a {
  position: relative !important;
  overflow: hidden !important;
}
.card::before,
.resource-card::before,
.essay-card::before,
.chapter-card::before,
.begin-card::before,
.atlas-card::before,
.feature-plate::before,
.intro-panel::before,
.content-narrow.card::before,
.bio-card::before,
.acme-detail::before,
.acme-steps button::before,
.nextprev .link::before,
.chapter-nav a::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 3px !important;
  background: var(--accent, var(--terra)) !important;
  transform: scaleY(0) !important;
  transform-origin: top center !important;
  transition: transform .24s var(--ease-out, ease) !important;
  pointer-events: none !important;
  z-index: 1 !important;
}
.card:hover::before,
.card:focus-within::before,
.resource-card:hover::before,
.resource-card:focus-within::before,
.essay-card:hover::before,
.essay-card:focus-within::before,
.chapter-card:hover::before,
.chapter-card:focus-within::before,
.begin-card:hover::before,
.begin-card:focus-within::before,
.atlas-card:hover::before,
.atlas-card:focus-within::before,
.feature-plate:hover::before,
.feature-plate:focus-within::before,
.intro-panel:hover::before,
.intro-panel:focus-within::before,
.content-narrow.card:hover::before,
.content-narrow.card:focus-within::before,
.bio-card:hover::before,
.bio-card:focus-within::before,
.acme-detail:hover::before,
.acme-detail:focus-within::before,
.acme-steps button:hover::before,
.acme-steps button:focus-visible::before,
.nextprev .link:hover::before,
.nextprev .link:focus-visible::before,
.chapter-nav a:hover::before,
.chapter-nav a:focus-visible::before {
  transform: scaleY(1) !important;
}

/* V68 latest final adjustments */
.codex-overview-grid.cols-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
@media (max-width: 980px) {
  .codex-overview-grid.cols-2 { grid-template-columns: 1fr !important; }
}

/* === V69: Unified heading typography across the site ============================
   Goal: every page renders headings with the same family (Georgia serif), the
   same weight, and a consistent type scale. Inline <em> inside any heading
   gets the terra (red) accent so the "red + black" emphasis pattern works on
   any page.
   ============================================================================ */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--serif) !important;
  font-weight: 800;
  letter-spacing: -.04em;
  line-height: 1.05;
  color: var(--ink);
}
h1 em, h2 em, h3 em, h4 em, h5 em, h6 em {
  color: var(--terra);
  font-style: italic;
  font-weight: 700;
}

/* Page-hero h1 (about, expertise, approach, codex, schema, atlas, acme-pharma):
   one canonical size scale. */
.page-title h1 {
  font-size: clamp(44px, 6vw, 76px) !important;
  line-height: .98 !important;
}

/* Article (chapter) h1 stays slightly larger to anchor the chapter. */
.article > h1 {
  font-size: clamp(42px, 6vw, 78px) !important;
  line-height: 1 !important;
}

/* Article body sections — same scale across all chapter pages. */
.article-content h2 {
  font-family: var(--serif) !important;
  font-size: clamp(28px, 3.4vw, 40px) !important;
  line-height: 1.1 !important;
  margin: 1.6em 0 .55em !important;
  color: var(--ink) !important;
}
.article-content h3 {
  font-family: var(--serif) !important;
  font-size: clamp(22px, 2.4vw, 28px) !important;
  line-height: 1.15 !important;
  margin: 1.4em 0 .5em !important;
  color: var(--ink) !important;
}
.article-content h4 {
  font-family: var(--serif) !important;
  font-size: clamp(18px, 2vw, 22px) !important;
  line-height: 1.2 !important;
  margin: 1.2em 0 .45em !important;
  color: var(--ink) !important;
}

/* Card / chapter-card / acme-side h3 — consistent across pages. */
.card h3, .chapter-card h3 {
  font-family: var(--serif) !important;
  font-size: 26px !important;
  line-height: 1.1 !important;
  margin: 0 0 12px !important;
}

/* Section headings for non-article pages (used by the Atlas page etc.). */
.section-heading h2 {
  font-family: var(--serif) !important;
  font-size: clamp(30px, 4vw, 46px) !important;
  line-height: 1.05 !important;
  margin: 0 !important;
}

/* Expertise page: lift the red emphasis pattern.
   Card titles get a thin terra rule; the "Advisory domains" kicker stays
   uppercase mono in terra; <em> phrases inside paragraphs read in italic terra. */
.expertise-page .card { position: relative; padding-top: 28px; }
.expertise-page .card h3::before {
  content: "";
  display: block;
  width: 36px;
  height: 3px;
  background: var(--terra);
  border-radius: 999px;
  margin-bottom: 12px;
}
.expertise-page .card p em,
.expertise-page .card li em,
.expertise-page p em {
  color: var(--terra);
  font-style: italic;
  font-weight: 600;
}
.expertise-page .card h3 em {
  color: var(--terra);
  font-style: italic;
  font-weight: 700;
}

/* About column with stacked portrait + cards — keep card heading consistent. */
.about-side-column .card h3 { font-size: 22px !important; }

/* Generic red-accent treatment for emphasized phrases inside cards on every page. */
.card p em,
.card li em {
  color: var(--terra);
  font-style: italic;
  font-weight: 600;
}

/* === Codex page tweaks ======================================================
   - h1 sized like the landing-page hero title (compact-home reference scale).
   - Tighter card spacing between body copy and button.
   - Larger, more prominent button text.
   ============================================================================ */
.codex-overview-grid .card h3 em {
  color: var(--terra);
  font-style: italic;
  font-weight: 700;
}
h1.codex-title {
  font-size: clamp(38px, 5vw, 64px) !important;
  line-height: 1 !important;
}
.codex-overview-grid .card p {
  margin: 0 0 8px !important;
}
.codex-overview-grid .card .button {
  margin-top: 4px;
  padding: 14px 22px;
  font-size: 16px;
  letter-spacing: .01em;
}

/* === Unified level-1 menu page heading scale ================================
   Approach, EA Codex, Expertise, About all match the home hero scale used by
   .home-begins-intro h2 (clamp(38px, 4.6vw, 62px)).
   ============================================================================ */
.page-title h1,
h1.codex-title {
  font-size: clamp(38px, 4.6vw, 62px) !important;
  line-height: 1 !important;
  letter-spacing: -.045em;
}
.article > h1 { font-size: clamp(38px, 4.6vw, 62px) !important; line-height: 1 !important; }

/* === Home page overview grid (matches codex/index.html card pattern) ======= */
.home-overview-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 36px;
}
.home-overview-grid .card {
  display: flex;
  flex-direction: column;
}
.home-overview-grid .card p {
  margin: 0 0 8px !important;
  flex: 1;
}
.home-overview-grid .card h3 em {
  color: var(--terra);
  font-style: italic;
  font-weight: 700;
}
.home-overview-grid .card .button {
  margin-top: 4px;
  padding: 14px 22px;
  font-size: 16px;
  letter-spacing: .01em;
  align-self: flex-start;
}
@media(max-width:980px) {
  .home-overview-grid { grid-template-columns: 1fr; }
}

/* === Force level-1 and level-2 page titles to the home-hero scale ==========
   The home uses .home-begins-intro h2 = clamp(38px, 4.6vw, 62px). All level-1
   menu pages (Approach, EA Codex, Expertise, About) and level-2 menu pages
   (Book index, Atlas, Schema, ACME Pharma) align to that scale.
   ============================================================================ */
.page-title h1,
h1.codex-title,
.page-hero h1,
.atlas-hero-compact h1,
.schema-hero h1,
.article > h1 {
  font-size: clamp(38px, 4.6vw, 62px) !important;
  line-height: 1 !important;
  letter-spacing: -.045em !important;
  max-width: none !important;
}

/* Render an explicit two-line break in any level-1 / level-2 page title. */
.page-title h1 br,
h1.codex-title br,
.page-hero h1 br,
.atlas-hero-compact h1 br,
.schema-hero h1 br,
.article > h1 br {
  display: block;
}

/* === Page-title lead paragraph stretches to the full content column ========
   Previously the .page-title p had max-width:760px which made the line stop
   short of the page edge under the h1 (the issue called out for the
   Expertise page hero). Allow it to flow to the same right edge as the
   .wrap container so it visually matches the heading column.
   ============================================================================ */
.page-title p {
  max-width: none !important;
}
.page-title {
  max-width: none;
}
/* Also widen the schema-hero / atlas-hero compact paragraphs so they share
   the same right edge as the heading. */
.schema-hero p,
.atlas-hero-compact p,
.codex-overview p,
.page-hero > p {
  max-width: none !important;
}

/* === Tighten vertical gap between the page hero (h1 + lead paragraph) and
       the first content section (cards / boxes) on every level-1 / level-2
       landing page. The default rule (.page-hero{padding:74px 0 30px}) plus
       any padding on the next section was leaving 60–80px of empty space
       under the lead paragraph. Compress to roughly 24px total.
   ============================================================================ */
.page-hero { padding-bottom: 10px !important; }
.page-hero + section.wrap,
.page-hero + section { padding-top: 14px !important; }

/* The codex overview grid / acme-browser / about-layout sit right after the
   page-hero — pull them up. */
.codex-overview { padding-top: 14px !important; }
.acme-browser { padding-top: 14px !important; }
.about-layout { padding-top: 14px !important; }
.expertise-page section.wrap:nth-of-type(2) { padding-top: 14px !important; }

/* Approach already uses approach-compact spacing — no change there. */

/* === About page: bottom-align the Presentations card with the bio article ===
   The right-column bio is much taller than the portrait + Blog + Presentations
   stack on the left. Stretch the left column to the full grid row height and
   let the last card (Presentations) grow to fill the remaining space, so its
   bottom edge lines up with the bottom of the bio.
   ============================================================================ */
.about-layout { align-items: stretch !important; }
.about-side-column { height: 100%; }
.about-side-column .card:last-child {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}

/* === Even tighter gap on codex / acme / about / expertise hero → cards =====
   Override anywhere a residual padding/margin slips in: the hero has zero
   bottom padding, the next section has zero top padding, and the lead
   paragraph has zero bottom margin.
   ============================================================================ */
.page-hero { padding-bottom: 0 !important; }
.page-title p { margin-bottom: 0 !important; }
.page-hero + section.wrap,
.page-hero + section { padding-top: 4px !important; }
.codex-overview, .acme-browser, .about-layout { padding-top: 4px !important; }
.expertise-page section.wrap:nth-of-type(2) { padding-top: 4px !important; }

/* === Home page: lift the intro/paragraph max-width caps so the lead text
       under the h2 spans the full content column (same right edge as the
       three cards below it).
   ============================================================================ */
.home-begins-stacked .home-begins-intro,
.home-begins-stacked .home-begins-intro p,
.home-begins-stacked .home-begins-intro h2 {
  max-width: none !important;
}

/* === Card body bullet list — keep the same font and size as the description
       paragraph so the typography is consistent inside every card.
   ============================================================================ */
.card ul,
.card ol {
  margin: 0 0 14px 1.05em;
  padding-left: 0.75em;
  color: var(--ink-soft);
  font-family: var(--sans);
}
.card ul li,
.card ol li {
  font-family: var(--sans);
  font-size: 15.5px;
  line-height: 1.55;
  color: var(--ink-soft);
  margin: .25em 0;
}
.card ul li::marker,
.card ol li::marker {
  color: var(--terra);
}

/* === Final tightening (overrides all earlier !important rules) ============
   The screenshot still showed ~80px between the lead paragraph and the
   cards. Several earlier rules pushed padding-top/bottom back up. Force a
   collapse here, last in the file so cascading order ensures these win.
   ============================================================================ */
section.wrap.page-hero,
.page-hero {
  padding-top: 36px !important;
  padding-bottom: 0 !important;
}
.page-hero + section.wrap,
.page-hero + section,
.codex-overview,
.acme-browser,
.about-layout,
section.wrap.codex-overview,
section.wrap.acme-browser {
  padding-top: 0 !important;
  margin-top: 0 !important;
}
.codex-overview-grid,
.home-overview-grid,
.approach-grid,
.codex-overview .grid {
  margin-top: 12px !important;
}
.page-title p { margin: 12px 0 0 !important; }

/* === Red accent bar above every card title (except Atlas-related cards) ====
   Apply the small terra-coloured rule above the h3 of every text card so the
   look stays consistent across Home, EA Codex, Approach, Expertise, About,
   ACME Pharma. Skip .atlas-card / .atlas-side because the Atlas page uses
   its own visual language.
   ============================================================================ */
.card { position: relative; padding-top: 28px; }
.card h3::before {
  content: "";
  display: block;
  width: 36px;
  height: 3px;
  background: var(--terra);
  border-radius: 999px;
  margin-bottom: 12px;
}
/* Atlas page exemptions — keep the existing look unchanged. */
.atlas-card,
.atlas-side,
.atlas-card.card,
.atlas-page .card { padding-top: 26px; }
.atlas-card h3::before,
.atlas-side h2::before,
.atlas-card.card h3::before,
.atlas-page .card h3::before { display: none !important; content: none !important; }

/* Card list items — same colour as the description paragraph above. */
.card ul li,
.card ol li {
  color: var(--ink-soft) !important;
}

/* Force the bullet text colour to match the lead paragraph above it.
   Cover both the li itself and any direct children, so any post-<em> tail
   text also picks up the soft-ink colour rather than reverting to ink. */
.card ul li,
.card ol li,
.card ul li > *,
.card ol li > * {
  color: var(--ink-soft) !important;
}
/* Keep the <em> emphasis terra red even with the rule above. */
.card ul li em,
.card ol li em,
.card p em {
  color: var(--terra) !important;
}

/* === Approach page · The argument section ====================================
   Wraps the book introduction in a styled card matching the look of the
   three cards above. The h2 carries the same small red top bar as the other
   card titles for visual consistency.
   ============================================================================ */
.approach-argument {
  padding: 32px 0 64px !important;
}
.approach-argument-card {
  position: relative;
  padding: 32px 36px 36px;
  display: grid;
  gap: 16px;
  max-width: none;
}
.approach-argument-card h2 {
  position: relative;
  font-family: var(--serif) !important;
  font-size: clamp(28px, 3.4vw, 44px) !important;
  line-height: 1.06 !important;
  letter-spacing: -.045em !important;
  margin: 0 0 6px !important;
  padding-top: 18px;
  color: var(--ink);
  max-width: none !important;
}
.approach-argument-card h2::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 36px; height: 3px;
  background: var(--terra);
  border-radius: 999px;
}
.approach-argument-card h2 em {
  color: var(--terra);
  font-style: italic;
  font-weight: 700;
}
.approach-argument-card p {
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.65;
  color: var(--ink-soft);
  margin: 0;
  max-width: 78ch;
}
.approach-argument-card p strong {
  color: var(--ink);
  font-weight: 800;
}
.approach-argument-card p em {
  color: var(--terra);
  font-style: italic;
  font-weight: 600;
}
.approach-argument-cta {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 14px;
}
.approach-argument-cta .button {
  padding: 14px 22px;
  font-size: 16px;
}
@media (max-width: 720px) {
  .approach-argument { padding: 24px 0 48px !important; }
  .approach-argument-card { padding: 26px 22px 28px; }
  .approach-argument-card h2 { font-size: clamp(26px, 6vw, 36px) !important; }
}

/* Bridge kicker: small terra label that explicitly ties the second h2 back to
   the hero narrative ("From static to continuous architecture"). Sits above
   the red bar / h2 inside the argument card. */
.approach-argument-kicker {
  font: 800 12px/1 var(--mono);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--terra);
  margin: 0 0 18px;
}

/* ============================================================================
   UNIFIED CARD TYPOGRAPHY (V70 — final pass)
   One single rule set for every text card across the site:
   Home, EA Codex, Approach (3 cards + argument card), Expertise, About
   (Blog/Presentations + bio), ACME Pharma.
   ============================================================================ */

/* --- Body text inside any card: paragraphs, lists, list items, post-em tails. */
.card p,
.card ul,
.card ol,
.card ul li,
.card ol li,
.card ul li > *,
.card ol li > *,
.bio-card p,
.approach-argument-card p,
.approach-argument-card ul,
.approach-argument-card ol,
.codex-overview-grid .card p,
.home-overview-grid .card p,
.about-side-column .card p,
.expertise-page .card p,
.expertise-page .card ul li,
.expertise-page .card ul li > * {
  color: #5d5347 !important;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
}

/* --- Strong stays in deep ink so it reads as a real emphasis. */
.card p strong,
.bio-card p strong,
.approach-argument-card p strong,
.expertise-page .card p strong,
.expertise-page .card ul li strong {
  color: #0f2640 !important;
  font-weight: 800 !important;
}

/* --- <em> stays terra red italic — it's the site's emphasis colour. */
.card p em,
.card ul li em,
.card ol li em,
.bio-card p em,
.approach-argument-card p em,
.expertise-page .card p em,
.expertise-page .card ul li em {
  color: #a8442c !important;
  font-style: italic !important;
  font-weight: 600 !important;
}

/* --- Bullet markers in terra. */
.card ul li::marker,
.card ol li::marker,
.expertise-page .card ul li::marker {
  color: #a8442c !important;
}

/* --- Card titles: deep ink, Georgia serif, weight 700, terra italic em. */
.card h3,
.codex-overview-grid .card h3,
.home-overview-grid .card h3,
.about-side-column .card h3,
.expertise-page .card h3,
.approach-grid .card h3 {
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 26px !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  color: #0f2640 !important;
  letter-spacing: -.025em !important;
}
.approach-argument-card h2 {
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: clamp(28px, 3vw, 36px) !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  color: #0f2640 !important;
  letter-spacing: -.03em !important;
}
.card h3 em,
.approach-argument-card h2 em {
  color: #a8442c !important;
  font-style: italic !important;
  font-weight: 700 !important;
}

/* --- Bio opening (about page) keeps its serif character, but bigger and warmer
       for emphasis. */
.bio-card .bio-opening {
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 22px !important;
  line-height: 1.25 !important;
  color: #0f2640 !important;
  font-weight: 600 !important;
}

/* === Book index — Part headers in red italic ===============================
   "Part I: Foundations" rendered as a single h2 in terra italic, matching
   the site's emphasis style. Same treatment for Part II / III / IV.
   ============================================================================ */
.part-title em,
.part-title {
  font-family: var(--serif) !important;
  font-style: italic !important;
  font-weight: 700 !important;
  font-size: clamp(28px, 3vw, 40px) !important;
  line-height: 1.05 !important;
  letter-spacing: -.025em !important;
  color: #a8442c !important;
  margin: 0 !important;
}
.part-title em { font-weight: 700; }

/* ============================================================================
   Approach argument card — editorial 2-column layout
   Left = sticky-feeling sidebar (kicker, h2, CTAs)
   Right = flowing prose, max ~62ch for readability
   ============================================================================ */
.approach-argument-card {
  display: grid !important;
  grid-template-columns: minmax(260px, 0.85fr) minmax(0, 1.4fr) !important;
  gap: 44px !important;
  padding: 42px 40px 40px !important;
  align-items: start;
}
.approach-argument-side {
  position: relative;
  padding-top: 18px;
}
.approach-argument-side::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 36px; height: 3px;
  background: var(--terra);
  border-radius: 999px;
}
.approach-argument-card h2 {
  margin: 0 0 26px !important;
}
.approach-argument-prose {
  display: grid;
  gap: 18px;
  max-width: 62ch;
  padding-top: 4px;
  border-left: 1px solid rgba(168,68,44,.18);
  padding-left: 32px;
}
.approach-argument-prose .approach-argument-lead {
  font-size: 17px !important;
  line-height: 1.55 !important;
}
.approach-argument-cta {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin: 0 !important;
}
@media (max-width: 880px) {
  .approach-argument-card {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
    padding: 28px 22px !important;
  }
  .approach-argument-prose {
    border-left: 0;
    padding-left: 0;
    border-top: 1px solid rgba(168,68,44,.18);
    padding-top: 22px;
  }
}

/* ============================================================================
   About bio card — rhythmic editorial layout
   Three thematic sections (manifesto / background / focus) separated by
   subtle terra hairlines and small mono uppercase eyebrows.
   ============================================================================ */
.bio-card {
  padding: 36px 40px 32px !important;
  display: grid;
  gap: 26px;
}
.bio-section {
  position: relative;
  display: grid;
  gap: 14px;
}
.bio-section + .bio-section {
  padding-top: 26px;
  border-top: 1px solid rgba(168,68,44,.18);
}
.bio-eyebrow {
  font: 800 11px/1 var(--mono) !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  color: var(--terra) !important;
  margin: 0 !important;
}
.bio-card .bio-opening {
  font-family: var(--serif) !important;
  font-style: italic !important;
  font-size: clamp(22px, 2.2vw, 28px) !important;
  line-height: 1.18 !important;
  color: #0f2640 !important;
  font-weight: 500 !important;
  margin: 0 !important;
  padding-left: 18px;
  border-left: 3px solid var(--terra);
}
.bio-card .bio-opening em {
  color: var(--terra) !important;
  font-style: italic !important;
  font-weight: 600 !important;
}
.bio-pivot {
  font-family: var(--serif) !important;
  font-size: 19px !important;
  line-height: 1.4 !important;
  color: #0f2640 !important;
  font-weight: 600 !important;
  margin-top: 6px !important;
}
.bio-pivot em {
  color: var(--terra) !important;
  font-style: italic !important;
  font-weight: 600 !important;
}
.bio-meta {
  display: grid;
  gap: 6px;
  margin-top: 8px;
  padding-top: 18px;
  border-top: 1px solid rgba(168,68,44,.18);
  font: 500 13.5px/1.55 var(--sans);
  color: var(--ink-soft);
}
.bio-meta span strong {
  color: var(--terra);
  font: 800 11px/1 var(--mono);
  letter-spacing: .14em;
  text-transform: uppercase;
  margin-right: 8px;
}
@media (max-width: 720px) {
  .bio-card { padding: 28px 22px !important; }
  .bio-card .bio-opening { padding-left: 14px; }
}

/* ============================================================================
   Book index — header stats strip + part-block separation
   Replaces the old .metric blocks. Clean editorial row with vertical
   terra dividers between each stat. Part-blocks get more breathing room.
   ============================================================================ */
.book-stats {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 0;
  margin: 32px 0 8px;
  padding: 18px 0;
  border-top: 1px solid rgba(168,68,44,.22);
  border-bottom: 1px solid rgba(168,68,44,.22);
}
.book-stats > div {
  flex: 1 1 0;
  min-width: 110px;
  padding: 6px 24px;
  border-right: 1px solid rgba(168,68,44,.18);
  display: grid;
  gap: 4px;
}
.book-stats > div:last-child { border-right: 0; }
.book-stats dt {
  font: 800 11px/1 var(--mono);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--terra);
  margin: 0;
}
.book-stats dd {
  font-family: var(--serif);
  font-size: clamp(34px, 4vw, 48px);
  font-weight: 700;
  font-style: normal;
  line-height: 1;
  color: #0f2640;
  margin: 0;
  letter-spacing: -.025em;
}
@media (max-width: 720px) {
  .book-stats > div {
    flex: 1 1 45%;
    border-right: 0;
    border-bottom: 1px solid rgba(168,68,44,.14);
    padding: 14px 12px;
  }
  .book-stats > div:nth-last-child(-n+2) { border-bottom: 0; }
}

/* Give part-blocks proper breathing room from each other and from the hero */
.part-block { margin-top: 56px; }
.part-block:first-of-type { margin-top: 28px; }

/* ============================================================================
   About bio card — same editorial 2-column pattern as the Approach argument
   card. Left = sidebar (eyebrow + headline + meta). Right = flowing prose
   with a thin terra rule as visual divider.
   ============================================================================ */
.bio-card {
  display: grid !important;
  grid-template-columns: minmax(260px, 0.8fr) minmax(0, 1.4fr) !important;
  gap: 44px !important;
  padding: 40px 40px 40px !important;
  align-items: center;
  max-width: none !important;
}
.bio-side {
  position: relative;
  padding-top: 0;
  display: grid;
  gap: 22px;
}
.bio-side::before {
  content: none;
}
.bio-side .bio-eyebrow {
  font: 800 11px/1 var(--mono) !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  color: var(--terra) !important;
  margin: 0 !important;
}
.bio-headline {
  font-family: var(--serif) !important;
  font-size: clamp(26px, 2.6vw, 34px) !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  letter-spacing: -.025em !important;
  color: #0f2640 !important;
  margin: 0 !important;
}
.bio-headline em {
  color: var(--terra) !important;
  font-style: italic !important;
  font-weight: 700 !important;
}
.bio-meta {
  display: grid;
  gap: 10px;
  margin: 6px 0 0 !important;
  padding: 18px 0 0 !important;
  border-top: 1px solid rgba(168,68,44,.18);
  font: 500 14px/1.55 var(--sans);
  color: var(--ink-soft);
}
.bio-meta span strong {
  display: block;
  color: var(--terra);
  font: 800 11px/1 var(--mono);
  letter-spacing: .14em;
  text-transform: uppercase;
  margin-bottom: 4px;
}
.bio-prose {
  display: grid;
  gap: 16px;
  max-width: 62ch;
  padding-top: 0;
  padding-left: 32px;
  border-left: 1px solid rgba(168,68,44,.18);
  align-self: center;
}
.bio-prose p {
  font-family: var(--sans) !important;
  font-size: 16px !important;
  line-height: 1.65 !important;
  color: #5d5347 !important;
  margin: 0 !important;
  font-weight: 400 !important;
}
.bio-prose .bio-lead {
  font-family: var(--serif) !important;
  font-size: clamp(20px, 2vw, 24px) !important;
  font-style: italic !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
  color: #0f2640 !important;
  padding-bottom: 8px;
}
.bio-prose .bio-lead strong {
  font-weight: 600 !important;
  color: #0f2640 !important;
}
.bio-prose .bio-lead em {
  color: var(--terra) !important;
  font-style: italic !important;
}
.bio-prose p strong { color: #0f2640 !important; font-weight: 700 !important; }
.bio-prose p em { color: var(--terra) !important; font-style: italic !important; font-weight: 600 !important; }
@media (max-width: 880px) {
  .bio-card {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
    padding: 28px 22px !important;
  }
  .bio-prose {
    border-left: 0;
    padding-left: 0;
    border-top: 1px solid rgba(168,68,44,.18);
    padding-top: 22px;
  }
}

/* Tight gap between the 3 cards row and the argument card */
.approach-argument {
  padding-top: 8px !important;
  padding-bottom: 48px !important;
  margin-top: 0 !important;
}
.approach-grid {
  margin-bottom: 8px !important;
}

/* About bio-side now hosts the portrait inside the card. */
.bio-portrait {
  margin: 0;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(27,49,73,.16);
  box-shadow: 0 14px 36px rgba(15,38,64,.10);
  background: var(--paper-soft);
}
.bio-portrait picture,
.bio-portrait img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4/5;
  object-fit: cover;
}