:root{
  --bg:#0d3b4f; --deep:#0a2d3d; --card:#ffffff; --ink:#12303d; --muted:#5d7380;
  --accent:#f26a21; --line:#dfe6ea; --radius:24px; --gap:14px;
  --ease:cubic-bezier(.22,.61,.36,1);
}
*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;color:var(--ink);font-family:'Sora',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
p,h1,h2,h3{margin:0}
:focus-visible{outline:3px solid #ffb27d;outline-offset:3px}
.wrap{max-width:1160px;margin:0 auto;padding:20px 16px 40px}

.top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:var(--gap)}
.brand{color:#fff;font-weight:600;font-size:1.05rem}
.top nav{display:flex;gap:6px;flex-wrap:wrap}
.top nav a{color:#d6e4ea;font-size:.85rem;padding:7px 14px;border-radius:999px;transition:background .4s var(--ease),color .4s var(--ease)}
.top nav a:hover,.top nav a[aria-current]{background:#fff;color:var(--ink)}

footer{color:#9fb8c4;font-size:.82rem;margin-top:24px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:center}
.motion{font:inherit;color:#d6e4ea;background:none;border:1px solid #2c5a6e;border-radius:999px;padding:6px 14px;cursor:pointer;transition:background .4s var(--ease)}
.motion:hover{background:#14506a}

@media (max-width:900px){.top{flex-direction:column;align-items:flex-start}}