:root { --navy:#071a38; --blue:#0a64d8; --sky:#dcecff; --pale:#f4f8ff; --ink:#12213c; --muted:#5a6880; --line:#d9e2ef; --white:#fff; --mono:"DM Mono",monospace; --sans:"DM Sans",sans-serif; --serif:"Playfair Display",serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:68px; }
body { margin:0; color:var(--ink); font:16px/1.65 var(--sans); background:var(--white); }
img,video { display:block; max-width:100%; }
a { color:inherit; text-decoration:none; }
.container { width:min(1140px,calc(100% - 48px)); margin:auto; }
.nav { position:sticky; top:0; z-index:20; display:flex; align-items:center; justify-content:space-between; min-height:68px; padding:0 max(24px,calc((100vw - 1140px)/2)); background:rgba(255,255,255,.9); border-bottom:1px solid rgba(217,226,239,.9); backdrop-filter:blur(14px); }
.brand { color:var(--navy); font:700 1.55rem/1 var(--serif); letter-spacing:-.06em; }.brand span,h1 span { color:#55a7ff; }
.nav-links { display:flex; gap:26px; font-size:.84rem; font-weight:700; }.nav-links a { color:#32435f; }.nav-links a:hover { color:var(--blue); }
.menu-button { display:none; background:none; border:0; color:var(--navy); font:600 .85rem var(--sans); }
.hero { position:relative; isolation:isolate; overflow:hidden; min-height:calc(100svh - 68px); display:grid; place-items:center; background:radial-gradient(circle at 74% 25%,#1268df 0,transparent 25%),radial-gradient(circle at 25% 95%,#0d3c86 0,transparent 38%),var(--navy); color:white; }
.hero:before { content:""; position:absolute; inset:0; z-index:-1; opacity:.55; background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px); background-size:54px 54px; mask-image:linear-gradient(to bottom,black,transparent 80%); }
.hero-content { padding:90px 0 96px; text-align:center; }.kicker { margin:0 0 13px; color:var(--blue); font:500 .72rem/1.35 var(--mono); letter-spacing:.1em; text-transform:uppercase; }.hero .kicker { color:#a8cfff; }
h1,h2,h3,p { margin-top:0; } h1,h2 { font-family:var(--serif); letter-spacing:-.045em; } h1 { margin-bottom:12px; font-size:clamp(4.7rem,10vw,8.5rem); line-height:.83; } h2 { max-width:720px; margin-bottom:18px; font-size:clamp(2.25rem,4.5vw,3.8rem); line-height:1.05; }.hero-title { max-width:820px; margin:0 auto 16px; font-size:clamp(1.35rem,2.7vw,2.18rem); font-weight:500; line-height:1.18; }.hero-title em { color:#a8d0ff; font-family:var(--serif); }.hero-summary { max-width:680px; margin:0 auto 23px; color:#d8e6fb; }.authors { margin-bottom:4px; font-size:.9rem; font-weight:600; }.affiliations { margin-bottom:25px; color:#b8cbeb; font-size:.78rem; }sup { color:#91c3ff; }
.hero-actions { display:flex; justify-content:center; flex-wrap:wrap; gap:10px; }.button { display:inline-flex; align-items:center; justify-content:center; gap:9px; min-height:40px; padding:0 16px; border:1px solid; border-radius:4px; font-size:.83rem; font-weight:700; transition:transform .2s,background .2s; }.button:hover { transform:translateY(-2px); }.button-light { color:var(--navy); border-color:white; background:white; }.button-ghost { color:white; border-color:rgba(255,255,255,.55); }.button-soon { opacity:.78; cursor:default; }.hero-metrics { display:flex; justify-content:center; gap:0; margin-top:48px; }.hero-metrics div { width:min(30vw,170px); padding:0 15px; border-left:1px solid rgba(255,255,255,.22); }.hero-metrics div:first-child { border:0; }.hero-metrics strong,.efficiency-stats strong { display:block; font:700 1.55rem/1 var(--serif); }.hero-metrics span,.efficiency-stats span { display:block; margin-top:6px; color:#bdcfec; font-size:.67rem; line-height:1.3; }
.road-lines { position:absolute; inset:auto 0 0; height:105px; z-index:-1; overflow:hidden; opacity:.55; }.road-lines i { position:absolute; bottom:-130px; width:2px; height:320px; background:linear-gradient(to bottom,transparent,#a7d5ff); transform-origin:bottom; }.road-lines i:nth-child(1){left:26%;transform:rotate(27deg)}.road-lines i:nth-child(2){left:50%;transform:rotate(0)}.road-lines i:nth-child(3){left:74%;transform:rotate(-27deg)}
.section { padding:108px 0; }.demo-section { background:var(--pale); }.section-head { margin-bottom:38px; max-width:760px; }.section-head.centered { margin-inline:auto; text-align:center; }.section-head p:not(.kicker),.two-column p { color:var(--muted); }.video-shell { overflow:hidden; border-radius:10px; box-shadow:0 28px 80px rgba(10,50,105,.16); background:#071222; }.video-shell video { width:100%; aspect-ratio:16/9; object-fit:contain; }
.overview { border-block:1px solid var(--line); }.motivation-copy { max-width:900px; }.motivation-copy p:not(.kicker) { color:var(--muted); font-size:1.05rem; }.motivation-equation { margin:28px 0 0!important; color:var(--blue)!important; }.motivation-figures { display:grid; grid-template-columns:.72fr 1.28fr; gap:24px; margin-top:50px; }.paper-card,.rl-card { margin:0; padding:14px; border:1px solid var(--line); border-radius:10px; background:#fff; box-shadow:0 18px 50px rgba(16,47,94,.09); }.paper-card img,.rl-card img { width:100%; }.paper-card figcaption,.plot-card figcaption { margin:10px 2px 0; color:var(--muted); font:.68rem/1.4 var(--mono); text-transform:uppercase; }.case-card { align-self:center; }.method { background:var(--navy); }.method h2,.method h3 { color:white; }.method .kicker { color:#a8cfff; }.method-intro { max-width:790px; }.method-intro > p:not(.kicker),.rl-focus p:not(.kicker) { color:#c6d4e9; }.method-components { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:52px; }.method-components article { padding:22px 20px; border:1px solid rgba(168,207,255,.28); border-radius:8px; background:rgba(255,255,255,.055); }.method-components span { color:#8fc6ff; font:.72rem var(--mono); }.method-components h3 { margin:12px 0 9px; font:600 1.18rem/1.2 var(--sans); }.method-components p { margin:0; color:#c6d4e9; font-size:.9rem; }.rl-focus { display:grid; align-items:center; grid-template-columns:minmax(360px,1.1fr) minmax(0,.9fr); gap:58px; margin-top:56px; padding-top:52px; border-top:1px solid rgba(168,207,255,.28); }.rl-card { background:#fff; }.rl-focus h3 { margin-bottom:14px; font-size:clamp(1.7rem,3vw,2.5rem); line-height:1.05; }.equation { margin:26px 0!important; color:#8dc5ff!important; font:500 clamp(.95rem,2vw,1.2rem) var(--mono); }
.results { background:#f8fbff; }.table-wrap { overflow:auto; border:1px solid var(--line); border-radius:8px; background:white; box-shadow:0 18px 45px rgba(18,49,94,.08); }table { width:100%; min-width:760px; border-collapse:collapse; font-size:.88rem; }th,td { padding:13px 16px; border-bottom:1px solid #e8eef6; text-align:right; white-space:nowrap; }th { color:#40516b; font-size:.72rem; letter-spacing:.02em; text-transform:uppercase; background:#f6f9fd; }th:first-child,td:first-child { text-align:left; font-weight:600; }.group td { padding:10px 16px; color:#68809e; font:500 .68rem var(--mono); text-transform:uppercase; background:#f8fbff; }.ours { background:#e9f3ff; }.ours td { color:#073e8e; font-weight:700!important; }.ours td:not(:first-child) { font-family:var(--mono); }.ablation { border-bottom:1px solid var(--line); }.efficiency { background:var(--pale); }.efficiency .container > div:first-child { max-width:760px; }.efficiency-stats { display:flex; gap:30px; margin-top:28px; }.efficiency-stats strong { color:var(--blue); }.efficiency-stats span { color:var(--muted); font-size:.7rem; }.efficiency-plots { display:grid; grid-template-columns:1fr 1fr; gap:22px; margin-top:44px; }.plot-card { margin:0; padding:13px; border-radius:10px; background:white; border:1px solid var(--line); box-shadow:0 18px 50px rgba(16,47,94,.09); }.plot-card img { width:100%; }.plot-card figcaption { margin:8px 2px 0; color:var(--muted); font:.68rem var(--mono); text-transform:uppercase; }
.cases { background:#071a38; color:white; }.cases h2 { color:white; }.cases .kicker { color:#9bcaff; }.cases .section-head p:not(.kicker) { color:#c3d2e9; }.case-group { margin-top:52px; padding-top:28px; border-top:1px solid rgba(173,205,244,.25); }.case-group-heading { display:flex; align-items:baseline; gap:22px; margin-bottom:20px; }.case-group-heading .kicker { flex:0 0 auto; margin:0; }.case-group-heading h3 { margin:0; color:#fff; font:600 clamp(1.35rem,2.5vw,2rem)/1.12 var(--serif); letter-spacing:-.02em; }.case-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:28px; }.case-grid figure { margin:0; }.case-grid video { width:100%; aspect-ratio:16/9; border-radius:7px; background:#020a16; object-fit:contain; }.case-grid figcaption { margin-top:10px; color:#dae5f6; font-size:.88rem; }.case-grid figcaption span { margin-right:7px; color:#79b5ff; font:500 .7rem var(--mono); }.citation { padding-block:86px; }.citation-inner { display:grid; grid-template-columns:.8fr 1.2fr; gap:70px; align-items:center; }.citation p:not(.kicker) { color:var(--muted); }.paper-link { color:var(--blue); font-weight:700; }.citation pre { overflow:auto; margin:0; padding:22px; border-radius:8px; background:#0b1f41; color:#dbe9fb; font:13px/1.6 var(--mono); }footer { padding:26px 0; color:#a9bad3; background:#06152e; font-size:.78rem; }
.reveal { opacity:0; transform:translateY(18px); transition:opacity .7s ease,transform .7s ease; }.reveal.visible { opacity:1; transform:none; }
@media (max-width:760px) { .container { width:min(100% - 36px,1140px); }.nav { min-height:58px; padding:0 18px; }.menu-button { display:block; }.nav-links { display:none; position:absolute; top:58px; left:0; right:0; padding:16px 18px 20px; gap:15px; flex-direction:column; background:white; border-bottom:1px solid var(--line); }.nav-links.open { display:flex; }.hero { min-height:calc(100svh - 58px); }.hero-content { padding:70px 0 76px; }.hero-metrics { margin-top:38px; }.hero-metrics div { padding-inline:8px; }.hero-metrics strong { font-size:1.28rem; }.section { padding:76px 0; }.motivation-figures,.method-components,.rl-focus,.efficiency-plots,.citation-inner { grid-template-columns:1fr; gap:24px; }.method-components { margin-top:36px; }.rl-focus { margin-top:40px; padding-top:38px; }.efficiency-stats { gap:18px; }.case-grid { grid-template-columns:1fr; }.case-group-heading { align-items:flex-start; flex-direction:column; gap:8px; }.section-head { margin-bottom:28px; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.reveal { opacity:1; transform:none; transition:none; } }
