:root { --navy:#081e38; --white:#fff; --line:rgba(255,255,255,.16); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:76px; }
body { margin:0; color:#fff; background:var(--navy); font-family:Arial, Helvetica, sans-serif; }
.topbar { position:sticky; z-index:3; top:0; display:flex; justify-content:space-between; gap:28px; align-items:center; min-height:68px; padding:12px max(24px, calc((100vw - 1440px)/2)); background:rgba(4,22,42,.96); border-bottom:1px solid var(--line); backdrop-filter:blur(12px); }
.brand { color:var(--white); font-weight:700; text-decoration:none; white-space:nowrap; }
nav { display:flex; align-items:center; justify-content:flex-end; gap:20px; overflow:auto; }
nav a { color:rgba(255,255,255,.8); text-decoration:none; white-space:nowrap; font-size:14px; transition:color .2s ease; }
nav a:hover, nav a:focus-visible { color:#fff; outline:none; }
main { overflow:hidden; }
.web-section { position:relative; width:min(100%, 1920px); margin:0 auto; scroll-margin-top:68px; }
.web-section + .web-section { margin-top:-1px; }
.web-section img { display:block; width:100%; height:auto; }
.cover { min-height:calc(100svh - 68px); display:grid; place-items:center; background:#113f85; }
.cover img { min-height:calc(100svh - 68px); object-fit:cover; }
.group { background:#fff; }
.reveal { overflow:hidden; }
.reveal img { opacity:0; transform:translateY(28px) scale(1.012); transition:opacity .75s ease-out, transform .9s cubic-bezier(.2,.75,.25,1); will-change:opacity,transform; }
.reveal img.is-visible { opacity:1; transform:translateY(0) scale(1); }
.cover.reveal img { opacity:1; transform:none; animation:hero-in 1s ease-out both; }
@keyframes hero-in { from { opacity:0; transform:scale(1.025); } to { opacity:1; transform:scale(1); } }
.scroll-controls { position:fixed; z-index:2; right:24px; bottom:24px; display:grid; gap:9px; }
.scroll-controls button { display:grid; place-items:center; width:44px; height:44px; padding:0; color:#fff; background:rgba(6,31,58,.82); border:1px solid rgba(255,255,255,.55); border-radius:50%; box-shadow:0 6px 22px rgba(0,0,0,.25); cursor:pointer; font-size:22px; }
.scroll-controls button:hover, .scroll-controls button:focus-visible { color:#0b3159; background:#fff; outline:none; }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .reveal img,.cover.reveal img { opacity:1; transform:none; transition:none; animation:none; } }
@media (max-width:720px) { .topbar { min-height:54px; gap:15px; padding:9px 14px; } .brand { font-size:14px; } nav { gap:13px; } nav a { font-size:12px; } html { scroll-padding-top:54px; } .web-section { scroll-margin-top:54px; } .cover { min-height:0; } .cover img { min-height:0; } .scroll-controls { right:14px; bottom:14px; } .scroll-controls button { width:40px; height:40px; } }