:root{
  --bg:#0f1216;
  --fg:#f5f7fb;
  --muted:#a8b0bd;
  --primary:#e74c3c;
  --primary-dark:#c0392b;
  --card:#171b21;
  --border:#252b34;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:system-ui,Segoe UI,Roboto,Arial,sans-serif;color:var(--fg);background:#0b0e12}
a{color:var(--fg);text-decoration:none}
img{max-width:100%;display:block;border-radius:10px}
.container{width:min(1100px,92%);margin-inline:auto}
.site-header{position:sticky;top:0;background:rgba(11,14,18,.85);backdrop-filter:blur(6px);border-bottom:1px solid var(--border);z-index:10}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:.8rem 0}
.brand{display:flex;align-items:center;gap:.6rem;font-weight:700}
.brand img{width:28px;height:28px}
nav a{margin-left:1rem;color:var(--muted)}
nav a:hover{color:var(--fg)}
.btn{display:inline-block;background:var(--primary);color:#fff;padding:.85rem 1.2rem;border-radius:10px;font-weight:700;transition:.2s}
.btn:hover{background:var(--primary-dark)}
.btn.small{padding:.5rem .8rem;border-radius:8px}
.hero{min-height:68vh;background-size:cover;background-position:center;border-bottom:1px solid var(--border)}
.hero .overlay{background:linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.75));min-height:inherit;display:flex;align-items:center}
.hero h1{font-size:clamp(1.8rem,3.2vw,3rem);margin:0 0 .6rem}
.hero p{color:var(--muted);margin:0 0 1.2rem}
.features{padding:3rem 0}
.features h2,.gallery h2,.cta h2{margin:0 0 1rem}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.grid-3 li, .gallery figure{list-style:none;background:var(--card);padding:1.2rem;border:1px solid var(--border);border-radius:14px}
.gallery{padding-bottom:3rem}
.gallery figcaption{color:var(--muted);margin-top:.6rem}
.cta{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:2rem;margin-bottom:3rem;text-align:center}
.cta .note{color:var(--muted);margin-top:.5rem}
.site-footer{border-top:1px solid var(--border);background:#0b0e12}
.footer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;padding:2rem 0}
.footer-grid h4{margin:.2rem 0 1rem}
.footer-grid ul{padding:0;margin:0;list-style:none}
.footer-grid li+li{margin-top:.4rem}
.copy{border-top:1px solid var(--border);text-align:center;color:var(--muted);padding:1rem}
@media (max-width:900px){.grid-3{grid-template-columns:1fr}nav a{margin-left:.7rem}}