:root{
  --bg:#0b0f14; --elev:#121924; --card:#0f1620; --edge:#2a3b52;
  --text:#e7eef8; --muted:#9db0c9; --accent:#67bfff;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,sans-serif;line-height:1.6}
.wrap{max-width:1100px;margin:auto;padding:28px 18px}
h1{font-size:46px;margin:0 0 6px}
.tagline{opacity:.85;margin:0 0 16px}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}

.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card{background:var(--card);border:1px solid var(--edge);border-radius:14px;padding:18px;box-shadow:0 6px 18px rgba(0,0,0,.25)}
.card h2{margin:0 0 10px}
.bullets{padding-left:18px;margin:0}
.bullets li{margin:3px 0}

.gallery h2{margin:0 0 10px}
.thumbs{list-style:none;display:grid;grid-template-columns:repeat(5,1fr);gap:10px;padding:0;margin:10px 0 0}
.thumbs img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:10px;border:1px dashed var(--edge);background:
  radial-gradient(100% 100% at 50% 0, #1b2736 0, #141d29 100%)}
.hint{opacity:.7;font-size:12px;margin-top:8px}

.foot{opacity:.8}
small{font-size:13px}

/* responsive */
@media (max-width:900px){
  .grid{grid-template-columns:1fr 1fr}
  .thumbs{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:600px){
  h1{font-size:36px}
  .grid{grid-template-columns:1fr}
  .thumbs{grid-template-columns:repeat(2,1fr)}
}