
:root{
  --bg:#0b0f14; --card:#10161d; --muted:#93a1b0; --text:#e8eef5; --brand:#2b82ff; --brand-2:#1a5adf; --ok:#37b24d;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; line-height:1.5}
a{color:var(--brand); text-decoration:none}
a:hover{text-decoration:underline}
.container{width:min(1100px, 92vw); margin:0 auto}
.site-header{position:sticky;top:0;z-index:50;background:rgba(11,15,20,.9);backdrop-filter: blur(6px); border-bottom:1px solid #111}
.header-inner{display:flex;align-items:center;gap:16px;padding:12px 0}
.brand{display:flex;align-items:center;gap:12px;color:var(--text);text-decoration:none}
.brand .brand-text{font-weight:700;letter-spacing:.2px}
.logo{width:40px;height:40px;object-fit:contain;border-radius:8px;background:#0e1420}
.main-nav ul{display:flex;list-style:none;margin:0;padding:0;gap:14px}
.nav-link{display:block;padding:8px 10px;border-radius:10px;color:var(--text)}
.nav-link.active, .nav-link:hover{background: #0f1622}
.btn{display:inline-block;padding:10px 14px;border-radius:12px;font-weight:600;border:1px solid transparent}
.btn-primary{background:var(--brand); color:white}
.btn-ghost{border-color:#203149;color:var(--text)}
.call-btn{display:none}
.nav-toggle{display:none;margin-left:auto;background:#0f1622;color:#bcd1e7;border:1px solid #1a2433;border-radius:10px;padding:8px 10px;cursor:pointer}

.hero{padding:64px 0 32px;background: radial-gradient(1200px 400px at 50% -50px, #1a2440 0%, transparent 70%);}
.hero h1{font-size: clamp(28px, 4vw, 40px);margin:0 0 8px 0}
.tagline{color:var(--muted); margin:0 0 16px 0}
.cta-row{display:flex;gap:10px;flex-wrap:wrap}
.subtle{color:#9bb0c5}
.section{padding:36px 0}
.cards{display:grid;grid-template-columns: repeat(2,1fr); gap:16px}
.card{background:var(--card); padding:20px;border:1px solid #0f1a28;border-radius:16px}
.card h2{margin-top:0}
.tick{padding-left:18px}
.tick li{margin:6px 0}
.arrow{display:inline-block;margin-top:8px}

.brands{text-align:center}
.two-col{display:grid;grid-template-columns:1.2fr .8fr; gap:16px}
.panel{background:#0e1420; padding:18px;border:1px solid #0f1a28;border-radius:14px}
.small{font-size:.95rem}

.page-hero{padding:42px 0 16px;background:#0b1119;border-bottom:1px solid #101826}
.page-hero h1{margin:0 0 8px 0}
.contact-cards{display:grid;grid-template-columns: repeat(2,1fr); gap:16px}

.gallery-grid{display:grid; grid-template-columns: repeat(2,1fr); gap:10px}
.gallery-item{background:#0e1420;border:1px solid #0f1a28;border-radius:12px;overflow:hidden}
.gallery-item img{display:block;width:100%;height:260px;object-fit:cover}

.site-footer{border-top:1px solid #111; padding:24px 0 40px; margin-top:20px}
.footer-grid{display:grid; grid-template-columns: repeat(4, 1fr); gap:16px}
.tiny{font-size:.9rem; color:#8ea3ba}
.sticky-call{position: fixed; right: 14px; bottom: 14px; background: var(--brand); color:white; padding:12px 14px; border-radius:999px; box-shadow: 0 12px 28px rgba(0,0,0,.35); font-weight:700}

.skip-link{position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden}
.skip-link:focus{left:10px; top:10px; width:auto; height:auto; padding:8px 10px; background:#111; border-radius:10px}

@media (max-width: 900px){
  .main-nav{display:none}
  .nav-toggle{display:block}
  .call-btn{display:inline-block}
  .cards{grid-template-columns:1fr}
  .two-col{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
  .contact-cards{grid-template-columns:1fr}
  .gallery-grid{grid-template-columns:1fr 1fr}
}
@media (max-width: 560px){
  .gallery-item img{height:200px}
  .footer-grid{grid-template-columns:1fr}
}
