:root { --ink:#f5f5f2; --muted:#a9b1b8; --line:rgba(255,255,255,.14); --blue:#8fc9f1; --night:#030a13; --font-serif:Georgia,"Times New Roman",serif; --font-sans:Arial,Helvetica,sans-serif; --font-mono:"SFMono-Regular",Consolas,"Liberation Mono",monospace; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--night); }
body { margin:0; color:var(--ink); background:var(--night); font-family:var(--font-sans),sans-serif; }
a { color:inherit; text-decoration:none; }
.shell { width:min(1180px,calc(100% - 48px)); margin-inline:auto; }
.site-header { position:absolute; z-index:10; top:0; left:0; width:100%; padding:28px 4vw; display:flex; justify-content:space-between; align-items:flex-start; border-bottom:1px solid var(--line); }
.brand { font:500 12px/1.3 var(--font-mono); letter-spacing:.28em; }
.brand span { display:block; margin-top:7px; color:rgba(255,255,255,.55); font-size:9px; }
.site-header nav,.site-footer nav { display:flex; gap:28px; font:500 10px/1 var(--font-mono); letter-spacing:.14em; text-transform:uppercase; }
.site-header nav a,.site-footer nav a { opacity:.68; transition:opacity .2s; }
.site-header nav a:hover,.site-footer nav a:hover { opacity:1; }
.hero { min-height:100svh; position:relative; display:grid; align-items:center; overflow:hidden; }
.hero-image { position:absolute; inset:0; background:url('assets/civilisation.jpg') center/cover; transform:scale(1.02); }
.hero-wash { position:absolute; inset:0; background:linear-gradient(90deg,rgba(1,6,13,.88) 0%,rgba(1,6,13,.46) 52%,rgba(1,6,13,.24)),linear-gradient(0deg,rgba(1,6,13,.68),transparent 45%); }
.hero-copy { position:relative; z-index:1; padding-top:100px; }
.eyebrow { margin:0 0 20px; color:var(--blue); font:500 10px/1.4 var(--font-mono); letter-spacing:.28em; text-transform:uppercase; }
h1,h2 { font-family:var(--font-serif),serif; font-weight:400; letter-spacing:-.025em; margin:0; }
.hero h1 { font-size:clamp(28px,4.15vw,63px); line-height:.9; max-width:1000px; }
.lede { max-width:610px; color:rgba(255,255,255,.72); font:400 clamp(18px,2vw,24px)/1.55 var(--font-serif); margin:34px 0; }
.actions { display:flex; gap:12px; flex-wrap:wrap; }
.button { display:inline-flex; justify-content:center; align-items:center; min-height:50px; padding:0 24px; border:1px solid var(--line); border-radius:100px; font:500 10px/1 var(--font-mono); letter-spacing:.16em; text-transform:uppercase; }
.button.primary { color:#06111c; background:#eaf5fb; border-color:#eaf5fb; }
.button.ghost { background:rgba(0,0,0,.2); backdrop-filter:blur(12px); }
.scroll-note { position:absolute; right:4vw; bottom:36px; margin:0; font:500 9px/1 var(--font-mono); letter-spacing:.25em; opacity:.5; writing-mode:vertical-rl; }
.manifesto { padding:150px 0; display:grid; grid-template-columns:1fr 1.25fr; gap:8vw; align-items:start; }
.manifesto .eyebrow { grid-column:1; }
.manifesto h2 { grid-column:1; font-size:clamp(24px,3vw,43px); line-height:1; }
.manifesto>p:last-child { grid-column:2; grid-row:1/3; color:var(--muted); font:400 clamp(22px,2.6vw,36px)/1.45 var(--font-serif); margin:36px 0 0; }
.triptych { min-height:650px; display:grid; grid-template-columns:1fr 1.25fr 1fr; gap:2px; }
.scene { position:relative; background:center/cover; min-height:650px; filter:saturate(.72); }
.scene::after { content:""; position:absolute; inset:0; background:linear-gradient(transparent 55%,rgba(0,0,0,.76)); }
.scene span { position:absolute; z-index:1; left:28px; bottom:28px; font:500 9px/1 var(--font-mono); letter-spacing:.22em; }
.mountains { background-image:url('assets/mountains.jpg'); }.civilisation { background-image:url('assets/civilisation.jpg'); }.ocean { background-image:url('assets/ocean.jpg'); }
.library { padding:150px 0; }
.section-intro { max-width:700px; }
.section-intro h2,.sound-section h2,.closing h2 { font-size:clamp(24px,3.25vw,46px); line-height:1; }
.section-intro>p:last-child { color:var(--muted); font:400 21px/1.5 var(--font-serif); }
.metrics { display:grid; grid-template-columns:repeat(5,1fr); margin:70px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.metric { padding:36px 18px; border-right:1px solid var(--line); }
.metric:last-child { border:0; }.metric strong { display:block; font:400 55px/1 var(--font-serif); }.metric span { display:block; margin-top:10px; color:var(--muted); font:500 9px/1 var(--font-mono); letter-spacing:.16em; text-transform:uppercase; }
.thinkers { display:grid; grid-template-columns:200px 1fr; gap:20px; padding-top:20px; }
.thinkers>p:nth-child(2) { margin:0; color:rgba(255,255,255,.82); font:400 24px/1.7 var(--font-serif); }
.thinkers small { grid-column:2; max-width:720px; color:#737e88; line-height:1.6; }
.sound-section { padding:140px 0; background:radial-gradient(circle at 72% 45%,#16436a 0%,#061421 35%,#02070d 70%); border-block:1px solid var(--line); }
.sound-grid { display:grid; grid-template-columns:1.2fr 1fr; gap:8vw; align-items:end; }
.sound-list { display:grid; grid-template-columns:1fr 1fr; border-top:1px solid var(--line); }
.sound-list span { padding:24px 8px; border-bottom:1px solid var(--line); font:500 10px/1 var(--font-mono); letter-spacing:.18em; text-transform:uppercase; }
.other-apps { padding:140px 0; display:grid; grid-template-columns:1fr 1fr; gap:8vw; align-items:center; }
.app-placeholder { display:flex; align-items:center; gap:24px; padding:28px; border:1px solid var(--line); border-radius:26px; background:rgba(255,255,255,.025); }
.app-placeholder img { width:94px; height:94px; border-radius:22px; }.app-placeholder strong,.app-placeholder span { display:block; }.app-placeholder span { color:var(--muted); margin-top:8px; }
.closing { min-height:640px; padding:100px 24px; display:grid; place-content:center; justify-items:center; text-align:center; background:linear-gradient(rgba(2,9,17,.62),rgba(2,9,17,.9)),url('assets/ocean.jpg') center/cover; }
.closing .button { margin-top:38px; }
.site-footer { padding:52px 0; display:grid; grid-template-columns:1fr auto; gap:34px; align-items:center; border-top:1px solid var(--line); }
.site-footer div strong,.site-footer div span { display:block; font:500 10px/1.4 var(--font-mono); letter-spacing:.18em; }.site-footer div span { color:var(--muted); margin-top:6px; }.site-footer small { color:#68737c; grid-column:1/-1; }
.legal { padding:180px 0 120px; max-width:900px; }.legal h1 { font-size:clamp(28px,4vw,52px); line-height:1; }.updated { color:var(--muted); margin:22px 0 60px; }.legal-body { color:#c2c7cb; font-size:16px; line-height:1.75; }.legal-body h2 { color:white; font:400 17px/1.2 var(--font-serif); margin:48px 0 12px; }.legal-body a { color:var(--blue); }.legal-body ul { padding-left:20px; }.legal-body li { margin:8px 0; }.contact-card { padding:32px; border:1px solid var(--line); border-radius:22px; margin-top:35px; }.contact-email { display:block; color:var(--blue); font:400 clamp(22px,4vw,38px)/1.2 var(--font-serif); word-break:break-word; }
.faq-list details { border-top:1px solid var(--line); padding:22px 0; }.faq-list details:last-child { border-bottom:1px solid var(--line); }.faq-list summary { cursor:pointer; color:white; font:400 22px/1.3 var(--font-serif); }.faq-list details p { max-width:720px; }
@media(max-width:760px){.shell{width:min(100% - 30px,1180px)}.site-header{padding:22px 18px}.site-header nav a:not(:last-child){display:none}.hero h1{font-size:29px}.manifesto,.sound-grid,.other-apps{grid-template-columns:1fr}.manifesto{padding:100px 0}.manifesto>p:last-child{grid-column:1;grid-row:auto}.triptych{grid-template-columns:1fr;}.scene{min-height:70svh}.metrics{grid-template-columns:1fr 1fr}.metric:nth-child(2n){border-right:0}.thinkers{grid-template-columns:1fr}.thinkers small{grid-column:1}.library,.other-apps{padding:100px 0}.site-footer{grid-template-columns:1fr}.site-footer nav{flex-wrap:wrap;gap:18px}.site-footer small{grid-column:1}.legal{padding-top:150px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}