:root{
  --ink:#0b0f15;
  --bg:#0f1520;
  --muted:#121a28;
  --edge:#1b273a;
  --text:#e8eef7;
  --soft:#c4cfdd;
  --accent:#ffcc00;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
body{font-family:system-ui,-apple-system,Segoe UI,Inter,Roboto,Arial,sans-serif;background:var(--ink);color:var(--text);line-height:1.65;-webkit-font-smoothing:antialiased}

/* Layout helpers */
.wrap{width:min(1120px,92%);margin-inline:auto}
.section{padding:72px 0}
.section.muted{background:var(--muted)}
.grid-2{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:center}
@media (max-width:900px){.grid-2{grid-template-columns:1fr;gap:18px}}

/* Header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(12,16,24,.8);backdrop-filter:saturate(120%) blur(6px);border-bottom:1px solid var(--edge)}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:10px 0}
.brand{display:flex;align-items:center;gap:10px}
.brand img{width:56px;height:56px;border-radius:50%;object-fit:cover;border:1px solid var(--edge);background:#0a0d12}
.brand-text{font-weight:700;letter-spacing:.2px;opacity:.95}
.nav a{margin-left:18px;opacity:.9}
.nav .cta{padding:10px 14px;border:1px solid var(--edge);border-radius:10px}
.nav a:hover{opacity:1}

/* Mobile burger (checkbox hack) */
.nav{display:flex;align-items:center}
.nav-toggle{display:none}
.burger{display:none;cursor:pointer}
.burger span,.burger span:before,.burger span:after{content:"";display:block;width:26px;height:2px;background:var(--text);margin:6px 0;transition:.2s}
@media (max-width:760px){
  .burger{display:block}
  .nav{position:fixed;inset:58px 0 auto 0;background:rgba(10,14,20,.98);display:none;flex-direction:column;padding:14px;border-bottom:1px solid var(--edge)}
  .nav a{margin:10px 0;padding:10px 2px}
  .nav-toggle:checked ~ .burger span{transform:rotate(45deg)}
  .nav-toggle:checked ~ .burger span:after{transform:translateY(-8px) rotate(-90deg)}
  .nav-toggle:checked ~ .burger span:before{opacity:0}
  .nav-toggle:checked ~ .nav{display:flex}
}

/* Hero */
.hero{padding:96px 0;background:
  radial-gradient(900px 480px at 0% -10%, #243552, transparent),
  linear-gradient(0deg, var(--bg), var(--ink));border-bottom:1px solid var(--edge)}
.hero h1{font-size:clamp(26px,6vw,44px);margin:0 0 10px}
.hero p{opacity:.9;margin:0 0 22px;font-size:clamp(16px,2.4vw,18px)}
.hero-actions .btn{margin-right:10px}

/* Buttons */
.btn{display:inline-block;padding:12px 18px;border:1px solid var(--edge);border-radius:12px;background:linear-gradient(180deg,#111827,#0c121c);box-shadow:0 6px 18px rgba(0,0,0,.25)}
.btn:hover{transform:translateY(-1px)}
.btn.primary{background:linear-gradient(180deg,#2a2f17,#171a0b);border-color:#3a3d1b;color:var(--accent)}

/* Cards / visuals */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:16px}
@media (max-width:900px){.cards{grid-template-columns:1fr}}
.card{border:1px solid var(--edge);border-radius:14px;background:linear-gradient(180deg,#0e1522,#0b1019);overflow:hidden}
.card h3{margin:14px 14px 6px;font-size:18px}
.card p{margin:0 14px 16px;color:var(--soft)}
.card img{width:100%; aspect-ratio: 16 / 10; object-fit: cover}
.shadow{box-shadow:0 12px 34px rgba(0,0,0,.35)}

/* Lists */
.ticks{padding-left:18px}
.ticks li{margin-bottom:8px}

/* References grid */
.ref-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:10px}
@media (max-width:900px){.ref-grid{grid-template-columns:1fr}}
.ref-grid img{width:100%;aspect-ratio: 4 / 3; object-fit: cover; border-radius:12px;border:1px solid var(--edge)}

/* Contact */
.contact-cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}

/* Footer */
.site-footer{border-top:1px solid var(--edge);background:linear-gradient(180deg,#0c121b,#0a0d14)}
.footer-inner{display:flex;align-items:center;justify-content:space-between;padding:20px 0}
.footer-inner .top{opacity:.9}
.footer-inner .top:hover{opacity:1}

/* Motion reduce */
@media (prefers-reduced-motion: reduce){
  *{scroll-behavior:auto !important;animation:none !important;transition:none !important}
}


/* Social icons */
.social-icon svg{vertical-align:middle;fill:currentColor}
.nav .social-icon{margin-left:12px;opacity:.9}
.nav .social-icon:hover{opacity:1}
.footer-inner .socials{display:flex;gap:12px}
.footer-inner .socials .social-icon{opacity:.85}
.footer-inner .socials .social-icon:hover{opacity:1}


/* Colored social icons */
.social-icon[aria-label="Facebook"] svg { fill: #1877F2; }
.social-icon[aria-label="Instagram"] svg { 
  fill: url(#ig-gradient);
}

/* Define Instagram gradient */
svg defs linearGradient#ig-gradient {
  stop:nth-child(1) { stop-color:#f58529; }
  stop:nth-child(2) { stop-color:#dd2a7b; }
  stop:nth-child(3) { stop-color:#8134af; }
  stop:nth-child(4) { stop-color:#515bd4; }
}

.social-icon[aria-label="Instagram"] svg {
  fill: #E4405F; /* Instagram pink */
}