:root { --ink:#14213d; --paper:#f7f5ef; --white:#fffdf8; --purple:#6b539b; --purple-deep:#4d3979; --green:#507f4d; --blue:#4d83c3; --line:rgba(20,33,61,.16); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Arial,Helvetica,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
button { font:inherit; }
.section-shell { width:min(1180px,calc(100% - 48px)); margin:0 auto; }

.nav-shell { position:sticky; top:14px; z-index:20; width:min(1180px,calc(100% - 32px)); height:62px; margin:14px auto 0; padding:0 10px 0 18px; display:flex; align-items:center; justify-content:space-between; border:1px solid rgba(20,33,61,.12); border-radius:18px; background:rgba(255,253,248,.86); box-shadow:0 12px 36px rgba(29,29,45,.08); backdrop-filter:blur(16px); }
.wordmark { display:flex; align-items:center; gap:10px; font-size:14px; font-weight:800; letter-spacing:.16em; }
.wordmark-mark { width:30px; height:30px; display:grid; place-items:center; border-radius:9px; background:var(--ink); color:white; font-family:Georgia,serif; font-size:18px; letter-spacing:0; }
.nav-links { display:flex; gap:30px; color:#536078; font-size:13px; }
.nav-links a { transition:color .2s ease; }
.nav-links a:hover { color:var(--purple); }
.nav-cta { padding:12px 20px; border-radius:12px; background:var(--ink); color:white; font-size:13px; font-weight:700; }

.hero { min-height:760px; padding:110px 0 74px; display:grid; grid-template-columns:.92fr 1.08fr; gap:56px; align-items:center; }
.eyebrow,.section-kicker { display:flex; align-items:center; gap:10px; color:var(--purple); font-size:12px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
.eyebrow span { width:26px; height:2px; background:var(--purple); }
.hero h1,h2 { margin:0; font-family:Georgia,"Times New Roman",serif; font-weight:500; letter-spacing:-.035em; }
.hero h1 { margin-top:25px; font-size:clamp(48px,5.2vw,76px); line-height:.99; }
.hero h1 em { color:var(--purple); font-weight:500; }
.hero-deck { max-width:650px; margin:28px 0 0; color:#566176; font-size:18px; line-height:1.7; }
.hero-deck strong { color:var(--ink); }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:34px; }
.button { display:inline-flex; align-items:center; gap:18px; padding:15px 20px; border-radius:13px; font-size:14px; font-weight:700; transition:transform .2s ease,box-shadow .2s ease; }
.button:hover { transform:translateY(-2px); }
.button-primary { background:var(--purple); color:white; box-shadow:0 12px 26px rgba(107,83,155,.2); }
.button-primary span { font-size:18px; }
.button-secondary { border:1px solid var(--line); background:rgba(255,255,255,.55); }
.authors { margin-top:38px; padding-top:20px; border-top:1px solid var(--line); color:#38455c; font-size:13px; line-height:1.7; }
.authors p { margin:0; }
.authors sup { color:var(--purple); font-weight:800; }
.affiliations { margin-top:4px!important; color:#788093; font-size:11px; }
.hero-visual { position:relative; padding:14px; border:1px solid var(--line); border-radius:28px; background:var(--white); box-shadow:0 30px 70px rgba(32,39,66,.12); transform:rotate(1deg); }
.hero-visual::before { content:""; position:absolute; inset:-24px 24px 20px -24px; z-index:-1; border-radius:32px; background:#e9e5f2; transform:rotate(-3deg); }
.visual-label { display:flex; justify-content:space-between; padding:4px 6px 14px; color:#6f7786; font-size:10px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; }
.hero-visual img { width:100%; border-radius:17px; }

.metric-strip { display:grid; grid-template-columns:repeat(4,1fr); border-block:1px solid var(--line); background:rgba(255,255,255,.48); }
.metric-strip div { min-height:150px; padding:34px; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; border-right:1px solid var(--line); }
.metric-strip div:last-child { border-right:0; }
.metric-strip strong { font-family:Georgia,serif; color:var(--purple-deep); font-size:43px; font-weight:500; }
.metric-strip span { margin-top:7px; color:#737d8e; font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }

.statement { padding:130px 0; }
.statement-grid,.split-heading { display:grid; grid-template-columns:1fr .72fr; gap:90px; align-items:end; }
.statement h2,.split-heading h2,.analysis-title h2,.citation-section h2 { margin-top:18px; font-size:clamp(42px,5vw,68px); line-height:1.03; }
.statement-grid>p,.split-heading>p { margin:0; color:#5e687a; font-size:18px; line-height:1.7; }
.method-cards { margin-top:70px; display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.method-cards article { min-height:290px; padding:28px; display:flex; flex-direction:column; border:1px solid var(--line); border-radius:22px; background:rgba(255,255,255,.52); transition:transform .25s ease,background .25s ease; }
.method-cards article:hover { transform:translateY(-6px); background:var(--white); }
.card-number { color:var(--purple); font-size:12px; font-weight:800; letter-spacing:.14em; }
.method-cards h3 { margin:auto 0 12px; font-family:Georgia,serif; font-size:31px; font-weight:500; }
.method-cards p { margin:0; color:#667084; line-height:1.65; }

.method-section { padding:130px 0; background:var(--ink); color:white; }
.section-kicker.light { color:#bcaee1; }
.method-section .split-heading>p,.analysis-section .analysis-title p,.citation-section p { color:#b8c0cf; }
.pipeline-frame { margin-top:70px; padding:18px; border:1px solid rgba(255,255,255,.16); border-radius:26px; background:#fdfcf8; box-shadow:0 30px 80px rgba(0,0,0,.28); }
.pipeline-frame img { width:100%; border-radius:14px; }
.stage-list { margin:28px 0 0; padding:0; display:grid; grid-template-columns:repeat(3,1fr); gap:12px; list-style:none; }
.stage-list li { padding:22px; border:1px solid rgba(255,255,255,.13); border-radius:17px; background:rgba(255,255,255,.04); }
.stage-list span { display:block; margin-bottom:22px; color:#a99bd0; font-size:11px; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.stage-list strong { display:block; font-family:Georgia,serif; font-size:21px; font-weight:500; }
.stage-list small { display:block; margin-top:7px; color:#aab4c5; font-size:13px; line-height:1.5; }

.results-section { padding:130px 0; }
.result-grid { margin-top:68px; display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.result-card { padding:34px; border:1px solid var(--line); border-radius:24px; background:var(--white); }
.result-card.alfred { box-shadow:inset 0 4px 0 var(--purple); }
.result-card.habitat { box-shadow:inset 0 4px 0 var(--green); }
.result-head { margin-bottom:34px; display:flex; justify-content:space-between; align-items:start; }
.result-head span { font-size:12px; font-weight:800; letter-spacing:.14em; }
.result-head strong { font-family:Georgia,serif; font-size:48px; font-weight:500; }
.bar-row { display:grid; grid-template-columns:96px 1fr 38px; gap:12px; align-items:center; margin-top:15px; color:#3d485d; font-size:12px; font-weight:700; }
.bar-row>div { height:9px; overflow:hidden; border-radius:99px; background:#e7e4ed; }
.bar-row i { display:block; height:100%; border-radius:inherit; background:var(--purple); }
.habitat .bar-row i { background:var(--green); }
.bar-row.muted { color:#8c93a0; }
.bar-row.muted i { background:#c7c3ce; }
.result-card>p { margin:30px 0 0; padding-top:22px; border-top:1px solid var(--line); color:#6c7586; line-height:1.6; }
.result-card>p strong { color:var(--ink); }
.benchmark-notes { margin-top:30px; display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.benchmark-notes article { padding:24px 0; display:flex; gap:14px; border-top:1px solid var(--line); }
.dot { flex:0 0 10px; width:10px; height:10px; margin-top:7px; border-radius:50%; }
.dot.purple { background:var(--purple); }.dot.green { background:var(--green); }.dot.blue { background:var(--blue); }
.benchmark-notes h3 { margin:0 0 8px; font-family:Georgia,serif; font-size:21px; font-weight:500; }
.benchmark-notes p { margin:0; color:#6f7889; font-size:14px; line-height:1.6; }

.analysis-section { padding:130px 0; overflow:hidden; background:#242138; color:white; }
.analysis-title { margin-top:18px; display:grid; grid-template-columns:1fr .55fr; gap:90px; align-items:end; }
.analysis-title p { margin:0; font-size:17px; line-height:1.65; }
.outcome-grid { margin-top:65px; display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.outcome-grid figure { margin:0; padding:14px; border:1px solid rgba(255,255,255,.14); border-radius:22px; background:#fff; }
.outcome-grid img { width:100%; border-radius:12px; }
.outcome-grid figcaption { padding:18px 8px 7px; display:flex; justify-content:space-between; color:var(--ink); font-size:13px; }
.outcome-grid figcaption span { color:#727b8c; }
.finding-grid { margin-top:32px; display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(255,255,255,.14); }
.finding-grid article { padding:34px; background:#242138; }
.finding-grid span { color:#9d8dc9; font-size:11px; font-weight:800; letter-spacing:.13em; }
.finding-grid h3 { margin:35px 0 12px; font-family:Georgia,serif; font-size:25px; font-weight:500; }
.finding-grid p { margin:0; color:#aeb5c4; line-height:1.65; }

.qualitative-section { padding:130px 0; }
.split-heading.compact { align-items:start; }
.case-frame { margin:65px 0 0; padding:16px; border:1px solid var(--line); border-radius:24px; background:var(--white); box-shadow:0 24px 65px rgba(31,38,64,.1); }
.case-frame img { width:100%; border-radius:14px; }
.case-frame figcaption { padding:17px 7px 5px; color:#657083; font-size:13px; line-height:1.5; }
.case-frame figcaption span { margin-right:12px; color:var(--purple); font-weight:800; letter-spacing:.08em; text-transform:uppercase; }

.citation-section { padding:110px 0; background:var(--purple-deep); color:white; }
.citation-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:70px; align-items:center; }
.citation-section h2 { margin-top:18px; font-size:48px; }
.citation-section p { line-height:1.7; }
.code-card { position:relative; padding:26px; border:1px solid rgba(255,255,255,.16); border-radius:18px; background:rgba(20,15,36,.35); }
.code-card pre { margin:0; overflow-x:auto; color:#e8e1f8; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:12px; line-height:1.65; white-space:pre-wrap; }
.code-card button { position:absolute; right:12px; top:12px; padding:9px 12px; border:0; border-radius:9px; background:white; color:var(--purple-deep); font-size:11px; font-weight:800; cursor:pointer; }
.footer { min-height:120px; display:grid; grid-template-columns:auto 1fr auto; gap:30px; align-items:center; color:#6b7485; font-size:12px; }
.footer p { text-align:center; }
.footer>a { font-weight:700; }

.reveal { animation:rise .75s ease both; }
.delay-1 { animation-delay:.12s; }
@keyframes rise { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:translateY(0); } }

@media (max-width:900px) {
  .nav-links { display:none; }
  .hero { min-height:auto; padding-top:90px; grid-template-columns:1fr; }
  .hero-visual { margin-top:22px; transform:none; }
  .metric-strip { grid-template-columns:1fr 1fr; }
  .metric-strip div:nth-child(2) { border-right:0; }
  .metric-strip div:nth-child(-n+2) { border-bottom:1px solid var(--line); }
  .statement-grid,.split-heading,.analysis-title,.citation-grid { grid-template-columns:1fr; gap:30px; }
  .method-cards,.stage-list,.benchmark-notes,.finding-grid { grid-template-columns:1fr; }
  .method-cards article { min-height:220px; }
  .result-grid,.outcome-grid { grid-template-columns:1fr; }
  .footer { grid-template-columns:1fr; padding:35px 0; text-align:center; }
  .footer .wordmark { justify-content:center; }
}

@media (max-width:560px) {
  .section-shell { width:min(100% - 28px,1180px); }
  .nav-shell { width:calc(100% - 20px); top:10px; margin-top:10px; }
  .hero { padding:74px 0 56px; gap:35px; }
  .hero h1 { font-size:46px; }
  .hero-deck { font-size:16px; }
  .hero-visual { padding:9px; border-radius:18px; }
  .hero-visual::before { display:none; }
  .visual-label { padding-bottom:9px; }
  .metric-strip div { min-height:125px; padding:20px 12px; }
  .metric-strip strong { font-size:34px; }
  .statement,.method-section,.results-section,.analysis-section,.qualitative-section { padding:88px 0; }
  .statement h2,.split-heading h2,.analysis-title h2 { font-size:42px; }
  .method-cards { margin-top:45px; }
  .pipeline-frame { margin-top:45px; padding:8px; border-radius:16px; overflow-x:auto; }
  .pipeline-frame img { min-width:760px; }
  .result-card { padding:24px; }
  .result-head strong { font-size:40px; }
  .bar-row { grid-template-columns:82px 1fr 34px; }
  .outcome-grid figcaption { flex-direction:column; gap:5px; }
  .citation-section { padding:80px 0; }
  .citation-section h2 { font-size:40px; }
  .code-card { padding:60px 18px 18px; }
}

@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .reveal { animation:none; } * { transition:none!important; } }
