:root {
  --void: #05090f;
  --surface: #0b1422;
  --elevated: #111e31;
  --border: #1e2d44;
  --accent: #55d8ff;
  --accent-bright: #8ae7ff;
  --accent-dim: #30b9e0;
  --text: #f4fbff;
  --muted: #9db0c5;
  --font-display: "Oxanium", "Segoe UI", sans-serif;
  --font-body: "Sora", "Segoe UI", sans-serif;
  --topbar-h: 3.5rem;
}
* { box-sizing: border-box; }
body { margin: 0; color: var(--text); background: var(--void); font-family: var(--font-body); }
a { color: var(--accent); }
.wrap { width: min(1080px, calc(100% - 2rem)); margin-inline: auto; }
.topbar { position: absolute; inset: 0 0 auto; z-index: 20; min-height: var(--topbar-h); padding: .85rem 0; }
.topbar-inner { display:flex; justify-content:space-between; align-items:center; gap:1rem; }
.topbar-brand { display:inline-flex; gap:.55rem; color:var(--text); text-decoration:none; font-family:var(--font-display); letter-spacing:.06em; }
.topbar-brand img { width: 28px; height: 28px; border-radius: 50%; }
.nav-links { display:flex; gap:1.25rem; list-style:none; margin:0; padding:0; }
.nav-links a { color: rgba(255,255,255,.8); text-decoration: none; }
.nav-links a[aria-current="page"] { color:#fff; border-bottom:2px solid var(--accent); }
.hero,.page-hero { position:relative; overflow:hidden; }
.hero { min-height:100svh; display:grid; align-content:end; padding: calc(var(--topbar-h) + 2.25rem) 0 3.25rem; }
.page-hero { min-height:14rem; padding:0 0 2.25rem; }
.hero-bg { position:absolute; inset:0; z-index:0; background: linear-gradient(180deg, rgba(0,0,0,.35) 0%, rgba(0,0,0,.8) 75%, #000 100%), radial-gradient(ellipse 70% 55% at 18% 70%, rgba(85,216,255,.2), transparent 55%), url("/brand/default.jpg") center / cover no-repeat; }
.hero .wrap,.page-hero .wrap { position:relative; z-index:1; }
.wordmark { margin:0 0 .65rem; font-family:var(--font-display); font-weight:700; font-size:clamp(2.1rem, 8vw, 5rem); letter-spacing:.06em; color:var(--accent); }
.page-title { margin:0 0 .5rem; font-family:var(--font-display); font-size:clamp(1.75rem, 4.5vw, 2.75rem); color:var(--accent); }
.hero-lead,.page-lead { max-width:42rem; color:#d9efff; }
.ctas { display:flex; flex-wrap:wrap; gap:.65rem; }
.cta { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:.75rem 1.2rem; border:1px solid var(--accent); text-decoration:none; font-family:var(--font-display); }
.cta.primary { background:var(--accent); color:#04131c; }
main .section { padding:2.75rem 0; border-top:1px solid var(--border); }
.cat-grid { display:grid; gap:.75rem; grid-template-columns:repeat(3,minmax(0,1fr)); grid-auto-rows:1fr; margin:0; padding:0; list-style:none; }
.cat-grid > li { display:grid; min-width:0; height:100%; }
.cat-grid a { display:flex; flex-direction:column; height:100%; min-height:6.75rem; padding:1rem 1.1rem; border:1px solid var(--border); background:var(--surface); color:#e8f5ff; text-decoration:none; }
.cat-grid strong { color:var(--accent); margin-bottom:.35rem; font-family:var(--font-display); }
.cat-grid span { color:var(--muted); flex:1 1 auto; font-size:.88rem; }
.table-scroll { overflow-x:auto; border:1px solid var(--border); }
.tool-table { width:100%; border-collapse:collapse; }
.tool-table th,.tool-table td { text-align:left; padding:.55rem .75rem; border-bottom:1px solid var(--border); }
.gallery-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.75rem; }
.gallery-grid img { width:100%; height:100%; object-fit:cover; border:1px solid var(--border); background:#000; }
footer { padding:2rem 0 2.75rem; border-top:1px solid var(--border); color:var(--muted); font-size:.9rem; }
footer .wrap { display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
@media (max-width:900px){ .cat-grid,.gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:540px){ .cat-grid,.gallery-grid{grid-template-columns:minmax(0,1fr);} .nav-links{gap:.8rem;} }