
:root{
  --bg:#0b0b0c;
  --bg-alt:#121316;
  --text:#e9eef2;
  --muted:#b8c0c7;
  --brand:#d9a73a;
  --primary:#00c853;
  --shadow:rgba(0,0,0,.35);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:#0e0f12;color:var(--text);font-family:Poppins,Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;scroll-behavior:smooth;overflow-x:hidden}
img{max-width:100%;display:block}
.container{width:min(1200px,92%);margin:0 auto}
.center{text-align:center}
.mt-24{margin-top:24px}

/* Header */
.site-header{position:sticky;top:0;z-index:50;background:#000;box-shadow:0 4px 16px var(--shadow)}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:10px 0}
.brand img{height:44px;width:auto;display:block;filter:drop-shadow(0 2px 6px var(--shadow))}
.nav ul{display:flex;gap:18px;align-items:center;list-style:none;margin:0;padding:0;max-width:90vw}
.nav a{color:#fff;text-decoration:none;font-weight:600;opacity:.9}
.nav a:hover{opacity:1}
.nav .cta{background:var(--primary);padding:10px 14px;border-radius:10px;color:#04110a}
#hamburger{display:none;background:#181818;color:#fff;border:1px solid #333;border-radius:8px;padding:6px 10px}
.nav a.social{display:flex;align-items:center;gap:6px;background:#111;padding:8px;border-radius:10px;border:1px solid #2a2a2a}

/* Mobile nav */
@media (max-width: 880px){
  #hamburger{display:block}
  .nav ul{position:fixed;right:8px;top:64px;background:#000;border:1px solid #222;border-radius:12px;padding:12px 16px;flex-direction:column;gap:10px;display:none}
  .nav ul.open{display:flex}
}

/* Hero */
.hero{position:relative;min-height:78vh;display:grid;place-items:center;overflow:hidden}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.65))}
.hero-content{position:relative;text-align:center;padding:60px 0}
.hero h1{font-size:clamp(32px,6vw,56px);margin:0 0 12px;font-weight:800;letter-spacing:.5px}
.hero .sub{font-size:clamp(15px,2.5vw,20px);color:var(--muted);margin:0 auto 14px;max-width:900px}
.badges{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin:10px 0 18px;padding:0;list-style:none}
.badges li{background:#1b1c1f;border:1px solid #2a2c30;padding:8px 12px;border-radius:999px;font-weight:600;color:#d6dadd}
.cta-row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.btn{display:inline-block;padding:12px 18px;border-radius:12px;text-decoration:none;font-weight:700;border:1px solid #2b2b2b;background:#16171a;color:var(--text)}
.btn.primary{background:var(--primary);border-color:#009a40;color:#03130a}
.btn.ghost{background:transparent}
.btn.whatsapp{background:#25D366;color:#06210f}
.phone{margin-top:14px;color:#eaeef4;font-weight:600}

/* Sections */
.section{padding:60px 0;background:var(--bg)}
.section.alt{background:var(--bg-alt)}
.section-title{text-align:center;font-size:clamp(26px,3.4vw,34px);margin:0 0 22px}

/* Cards */
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.card{background:#14161a;border:1px solid #262a30;border-radius:16px;overflow:hidden;box-shadow:0 10px 24px var(--shadow)}
.card h3{margin:12px 14px 4px;font-size:20px}
.card p{margin:0 14px 16px;color:#c8ced6;line-height:1.55}
.card img{height:170px;object-fit:cover;width:100%}
@media (max-width: 1000px){.cards{grid-template-columns:repeat(2,1fr)}}
@media (max-width: 560px){.cards{grid-template-columns:1fr}}

/* Why */
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.why-item{background:#14161a;border:1px solid #262a30;border-radius:16px;padding:14px;text-align:center}
.why-item img{height:160px;object-fit:cover;border-radius:12px;margin-bottom:8px}
.why-item h3{margin:6px 0 8px}
.why-item p{margin:0;color:#c8ced6}
@media (max-width: 900px){.why-grid{grid-template-columns:1fr}}

/* Metrics */
.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:22px}
.metric{background:#101114;border:1px solid #24262c;padding:16px;border-radius:14px;text-align:center}
.metric .num{font-size:38px;font-weight:800;color:var(--brand)}
.metric small{display:block;color:#cbd3da}
@media (max-width: 700px){.metrics{grid-template-columns:1fr}}

/* Equip */
.equip{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.equip figure{background:#14161a;border:1px solid #262a30;border-radius:16px;overflow:hidden;margin:0}
.equip figcaption{padding:12px 14px;color:#c8ced6}
.equip img{height:200px;object-fit:cover;width:100%}
@media (max-width: 900px){.equip{grid-template-columns:1fr}}

/* Form */
.form .grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.form label{display:flex;flex-direction:column;gap:6px;font-weight:600;color:#e8edf3}
.form input,.form select,.form textarea{padding:12px;border-radius:12px;border:1px solid #2a2e36;background:#0f1115;color:#e9eef2}
.form-actions{display:flex;gap:12px;margin-top:12px;flex-wrap:wrap}

/* Ticker */
.ticker{background:#0b0c0f;border-top:1px solid #191b20;border-bottom:1px solid #191b20;overflow:hidden}
.ticker-track{display:inline-block;white-space:nowrap;animation:scroll 70s linear infinite}
.ticker .item{display:inline-block;padding:14px 28px;color:#dfe5ea;opacity:.95}
@keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* Footer */
.footer{background:#000;padding:26px 0;color:#cdd3d8}
.footer-inner{display:flex;justify-content:space-between;gap:24px;align-items:center}
.footer a{color:#dfe5ea;text-decoration:none}
.socials{display:flex;gap:10px;align-items:center}
@media (max-width: 800px){.footer-inner{flex-direction:column}}

/* Mobile Instagram next to logo */
.ig-mobile{display:none;margin-left:8px}
@media (max-width:880px){
  .header-inner{align-items:center}
  .brand{display:flex;align-items:center}
  .ig-mobile{display:inline-flex;padding:6px;border-radius:10px;border:1px solid #2a2a2a;background:#111}
  .ig-mobile svg{display:block}
  .nav{margin-left:auto}
}
