:root {
  --void:#050814; --ink:#0a1020; --panel:#121a30; --line:#2a3a62;
  --ice:#8eb6ff; --ice2:#d6e4ff; --aurora:#b7a6ff; --star:#eef2ff; --mute:#8ea0c4;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; background:var(--void); color:var(--star); font-family:"IBM Plex Sans",system-ui,sans-serif; line-height:1.6; }
a { color:inherit; text-decoration:none; }
h1,h2,h3 { font-family:"IBM Plex Serif",Georgia,serif; font-weight:400; letter-spacing:-0.02em; margin:0; }
p { margin:0; }
.wrap { max-width:72rem; margin:0 auto; padding:0 1.25rem; }
.nav { position:sticky; top:0; z-index:40; background:rgba(5,8,20,.8); backdrop-filter:blur(12px); border-bottom:1px solid rgba(42,58,98,.7); }
.bar { height:5rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.brand { display:flex; align-items:center; gap:.75rem; letter-spacing:.18em; font-size:.75rem; text-transform:uppercase; }
.mark { width:2.25rem; height:2.25rem; }
.desk { display:none; gap:1.5rem; font-size:.75rem; letter-spacing:.14em; text-transform:uppercase; color:var(--mute); }
.desk a:hover, .desk a.on { color:var(--ice2); }
.mob { display:flex; gap:1rem; overflow:auto; border-top:1px solid rgba(42,58,98,.5); padding:.5rem 1.25rem; font-size:.75rem; letter-spacing:.12em; text-transform:uppercase; color:var(--mute); }
.engage { border:1px solid var(--ice); color:var(--ice2); padding:.5rem 1rem; font-size:.75rem; letter-spacing:.16em; text-transform:uppercase; }
.engage:hover { background:var(--ice); color:var(--void); }
.kicker { margin-bottom:1rem; font-size:.75rem; letter-spacing:.28em; text-transform:uppercase; color:var(--ice); }
.hero { text-align:center; padding:6rem 0; border-bottom:1px solid rgba(42,58,98,.6);
  background:
    radial-gradient(900px 420px at 70% 10%, color-mix(in srgb, var(--aurora) 22%, transparent), transparent 60%),
    radial-gradient(700px 380px at 15% 30%, color-mix(in srgb, var(--ice) 14%, transparent), transparent 55%),
    var(--void); }
.hero h1 { font-size:clamp(3rem,8vw,4.5rem); }
.motto-hero { margin-top:1.25rem; letter-spacing:.42em; font-size:.75rem; text-transform:uppercase; color:var(--ice); }
.lead { margin:1.5rem auto 0; max-width:42rem; font-size:1.125rem; color:var(--mute); }
.actions { margin-top:2rem; display:flex; flex-wrap:wrap; gap:.75rem; justify-content:center; }
.btn { background:var(--ice); color:var(--void); padding:.75rem 1.25rem; font-size:.75rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; border:0; cursor:pointer; }
.btn-line { border:1px solid var(--ice); color:var(--ice2); padding:.75rem 1.25rem; font-size:.75rem; letter-spacing:.16em; text-transform:uppercase; }
.chips { margin-top:3.5rem; display:flex; flex-wrap:wrap; gap:1.5rem; justify-content:center; font-size:.75rem; letter-spacing:.16em; text-transform:uppercase; color:var(--mute); }
.section { padding:5rem 0; }
.section h2 { font-size:2.25rem; max-width:36rem; }
.sub { margin-top:1rem; max-width:42rem; color:var(--mute); }
.gallery { margin-top:2.5rem; display:grid; gap:.75rem; }
.gallery figure { position:relative; overflow:hidden; border:1px solid var(--line); margin:0; min-height:10rem; }
.gallery img, .shot { width:100%; height:100%; object-fit:cover; display:block; }
.gallery figcaption { position:absolute; inset:auto 0 0 0; padding:.75rem 1rem; font-size:.75rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ice2); background:linear-gradient(to top, var(--void), transparent); }
.cards, .grid3 { display:grid; gap:1rem; }
.cards { margin-top:1.5rem; }
.card, .post, .fact { border:1px solid var(--line); background:var(--panel); padding:1.5rem; }
.card h3, .post h2, .post h3 { font-size:1.5rem; }
.card p, .post p, .mute { color:var(--mute); margin-top:.5rem; }
.post { display:block; }
.post:hover { border-color:var(--ice); }
.band { border-top:1px solid rgba(42,58,98,.7); border-bottom:1px solid rgba(42,58,98,.7); background:var(--ink); }
.split { display:grid; gap:2.5rem; }
.facts { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; }
.fact .k { font-size:.75rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ice); }
.page { padding:4rem 0 6rem; }
.page h1 { font-size:clamp(2.25rem,5vw,3rem); }
table { width:100%; border-collapse:collapse; margin-top:2.5rem; min-width:36rem; }
th { text-align:left; font-weight:500; font-size:.75rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ice); border-bottom:1px solid var(--line); padding:.75rem .75rem .75rem 0; }
td { border-bottom:1px solid var(--line); padding:1rem .75rem 1rem 0; vertical-align:top; }
td.m { color:var(--mute); }
.shot { height:18rem; border:1px solid var(--line); margin-top:2rem; object-fit:cover; }
form { display:grid; gap:.75rem; }
input, select, textarea { border:1px solid var(--line); background:var(--ink); color:var(--star); padding:.75rem; font:inherit; }
input:focus, select:focus, textarea:focus { outline:none; border-color:var(--ice); }
.form-status { margin:0; min-height:1.2em; color:var(--ice2); font-size:.85rem; }
.back { display:inline-block; margin-top:2.5rem; color:var(--ice); }
footer { border-top:1px solid rgba(42,58,98,.7); }
.foot { display:flex; flex-wrap:wrap; justify-content:space-between; gap:.75rem; padding:2rem 1.25rem; color:var(--mute); font-size:.9rem; }
.foot .motto { letter-spacing:.28em; text-transform:uppercase; color:var(--ice); }
.scroll { overflow-x:auto; }
@media (min-width:768px) {
  .desk { display:flex; }
  .mob { display:none; }
  .gallery { grid-template-columns:3fr 2fr; grid-template-rows:1fr 1fr; }
  .gallery .big { grid-row:span 2; min-height:22rem; }
  .cards, .grid3 { grid-template-columns:repeat(3,1fr); }
  .split { grid-template-columns:1fr 1fr; align-items:start; }
}