@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@500;600;700;800&display=swap");

/* ROOT – clean palette */
:root{
  --bg:#080a0e;
  --panel:#0f131b;
  --text:#eaecef;
  --muted:#a0a8b8;
  --accent:#7bb6ff;

  --navH:84px;

  --fs-xs: clamp(0.84rem, 2.6vw, 0.96rem);
  --fs-sm: clamp(0.96rem, 3.2vw, 1.08rem);
  --fs-md: clamp(1.08rem, 4vw, 1.22rem);
  --fs-lg: clamp(1.6rem, 6vw, 2.3rem);
  --fs-xl: clamp(2.6rem, 10vw, 6.4rem);
}

/* RESET + SMOOTH SCROLL */
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth; -webkit-text-size-adjust:100%}
html,body{width:100%;overflow-x:hidden}
body{font-family:"Manrope",system-ui,sans-serif;background:var(--bg);color:var(--text);font-size:var(--fs-md);line-height:1.72;-webkit-font-smoothing:antialiased}

/* Anchor offset */
section[id]{scroll-margin-top:calc(var(--navH) + 2rem)}

a{color:inherit;text-decoration:none;transition:opacity .3s ease}
a:hover{opacity:.88}

img{display:block;max-width:100%;height:auto}

/* CONTAINER */
.container{
  max-width:1200px;
  margin-inline:auto;
  padding-inline:clamp(1.6rem,7vw,4rem);
}

/* NAV – unchanged */
.nav{
  position:fixed;inset:0 0 auto 0;height:var(--navH);
  background:rgba(8,10,14,.97);backdrop-filter:blur(14px);
  z-index:1000;
}

.nav-inner{
  height:100%;max-width:1200px;margin:0 auto;
  padding-inline:clamp(1.6rem,7vw,4rem);
  display:flex;align-items:center;justify-content:space-between;
}

.logo{font-weight:800;letter-spacing:.26em;font-size:var(--fs-sm);opacity:.94}

.nav-links{display:flex;gap:2.2rem}
.nav-links a{font-size:var(--fs-sm);color:var(--muted);font-weight:600;padding:.5rem .7rem;border-radius:10px;transition:background .3s ease}
.nav-links a:hover{background:rgba(123,182,255,.08)}
.nav-links a.cta{color:var(--accent);font-weight:700}

.lang{background:none;border:none;font-size:.82rem;letter-spacing:.2em;cursor:pointer;opacity:.8;padding:.6rem;border-radius:10px;transition:background .3s}
.lang:hover{background:rgba(123,182,255,.08)}

.nav-controls{display:none;gap:1.2rem}
.menu{font-size:2.6rem;padding:.5rem;color:var(--text)}

/* MOBILE MENU – unchanged */
.mobile-menu{
  display:none;position:fixed;inset:0;background:rgba(8,10,14,.98);
  backdrop-filter:blur(18px);align-items:center;justify-content:center;
  flex-direction:column;gap:3rem;z-index:900;
}
.mobile-menu.show{display:flex}
.mobile-menu a{font-size:var(--fs-xl);letter-spacing:.08em;font-weight:600;padding:1rem 1.4rem;border-radius:14px;transition:background .3s}
.mobile-menu a:hover{background:rgba(123,182,255,.1)}

/* HERO VIDEO – perfect 16:9, full frame, no crop, clear */
.hero{
  position:relative;
  width:100%;
  background:#000; /* Black for letterbox */
  padding-top:calc(var(--navH)); /* Clear nav */
}

.hero-video-wrapper{
  position:relative;
  width:100%;
  padding-top:56.25%; /* Exact 16:9 (1080/1920) */
  background:#000;
}

.hero-bg-video{
  position:absolute;
  top:0; left:0;
  width:100%; height:100%;
  object-fit:contain; /* Shows ENTIRE video frame */
  background:#000;
}

/* No filter/overlay */
.hero::after{display:none;}

/* HERO DESCRIPTION – text below video */
.hero-description{
  padding:7rem 0 9rem;
  background:var(--bg);
}
.hero-description .kicker{
  margin-bottom:3rem;
}
.hero-description .hero-text{
  max-width:62ch;
  margin-inline:auto;
  margin-bottom:3rem;
  color:var(--text);
}
.hero-description .hero-proof{
  max-width:62ch;
  margin-inline:auto;
  margin-bottom:3.5rem;
  list-style:none;
  color:var(--text);
}
.hero-description .hero-proof li{
  margin-bottom:1rem;
  padding-left:1.8rem;
  position:relative;
}
.hero-description .hero-proof li::before{
  content:"✓";
  position:absolute;
  left:0;
  color:var(--accent);
  font-weight:700;
}
.hero-description .hero-actions{
  margin-bottom:3rem;
}
.hero-description .trust-strip{
  gap:2rem;
  font-size:var(--fs-xs);
  color:var(--muted);
}

/* BUTTONS */
.btn-primary,.btn-outline{
  padding:1.1rem 2.4rem;
  border-radius:16px;
  font-weight:600;
  font-size:var(--fs-sm);
  min-width:220px;
  text-align:center;
  transition:background .3s ease;
}
.btn-primary{background:var(--accent);color:#000}
.btn-primary:hover{background:#95c8ff}
.btn-outline{border:1px solid rgba(255,255,255,.5);color:var(--text)}
.btn-outline:hover{background:rgba(123,182,255,.08)}

/* SECTIONS – unchanged */
.section{padding:8rem 0}
.section.alternate{background:var(--panel)}
.section > .container > *{max-width:72ch;margin-inline:auto}
.section.center{text-align:center}
.section-title{font-size:var(--fs-lg);margin-bottom:2.4rem;font-weight:700}

/* GRIDS – unchanged */
.work-grid,.process-grid,.faq-grid,.case-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2.4rem;margin-top:2rem;
}
.case-grid,.faq-grid{grid-template-columns:repeat(auto-fit,minmax(340px,1fr))}

/* CARDS – unchanged */
.card{
  background:rgba(255,255,255,.04);
  border-radius:24px;
  padding:2rem;
}
.card h3{font-size:1.14rem;margin-bottom:.8rem;color:var(--text)}

/* CONTACT – unchanged */
.contact-actions{margin-top:4rem;display:flex;gap:1.4rem;justify-content:center;flex-wrap:wrap}
.link-pill{padding:.9rem 1.6rem;border-radius:999px;border:1px solid rgba(255,255,255,.18);
  font-size:var(--fs-xs);letter-spacing:.12em;opacity:.9;transition:background .3s ease}
.link-pill:hover{background:rgba(123,182,255,.08)}

/* FOOTER – unchanged */
footer .policy-links{margin:1.4rem 0;display:flex;gap:1.8rem;flex-wrap:wrap;font-size:var(--fs-xs)}
footer .policy-links a{color:var(--muted);transition:color .3s}
footer .policy-links a:hover{color:var(--text)}

/* REVEAL – unchanged */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .9s ease, transform .9s ease}
.reveal.show{opacity:1;transform:translateY(0)}
@media (prefers-reduced-motion:reduce){.reveal{transition:none;opacity:1;transform:none}}

/* MOBILE – video perfect fit */
@media (max-width:900px){
  :root{--muted:#b0b8c8}
  .nav-links{display:none}.nav-controls{display:flex}
  .hero-description{padding:6rem 0 8rem}
  .hero-actions{flex-direction:column}
  .btn-primary,.btn-outline{width:100%}
  .section{padding:6rem 0}
  .trust-strip{flex-direction:column;gap:1rem;text-align:center}
  .work-grid,.faq-grid,.case-grid{grid-template-columns:1fr}
}