/* ============================================================
   GANV GROUP — style.css
   Theme: Signal Red / Near-Black / White
   Fonts: Anton (display), Manrope (body), Space Mono (accent)
   Mobile-first, responsive, accessible.
   ============================================================ */

:root{
  /* Brand palette */
  --red:        #E11420;
  --red-bright: #FF2A36;
  --red-deep:   #A20D16;
  --black:      #0C0C0E;
  --ink:        #16161A;
  --ink-soft:   #3A3A42;
  --white:      #FFFFFF;
  --paper:      #F6F5F4;
  --paper-2:    #ECEBEA;
  --gray:       #6E6E76;
  --gray-2:     #9A9AA2;
  --line:       #E4E3E2;
  --line-dark:  #26262C;

  /* Type */
  --f-display: "Anton", "Arial Narrow", sans-serif;
  --f-body:    "Manrope", system-ui, sans-serif;
  --f-mono:    "Space Mono", ui-monospace, monospace;

  /* Layout */
  --maxw: 1200px;
  --pad: clamp(1.1rem, 4vw, 2.5rem);
  --radius: 14px;
  --shadow: 0 18px 50px -20px rgba(12,12,14,.28);
  --shadow-red: 0 16px 40px -14px rgba(225,20,32,.5);

  --ease: cubic-bezier(.2,.7,.2,1);
}

/* ---------- Reset ---------- */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  font-family:var(--f-body);
  color:var(--ink);
  background:var(--white);
  line-height:1.6;
  font-size:clamp(1rem,.96rem + .2vw,1.06rem);
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; }
button{ font:inherit; cursor:pointer; border:none; background:none; color:inherit; }
:focus-visible{ outline:3px solid var(--red); outline-offset:3px; border-radius:4px; }

.container{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--pad); }

.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.skip-link{
  position:absolute; left:1rem; top:-3rem; z-index:200;
  background:var(--red); color:#fff; padding:.6rem 1rem; border-radius:8px; transition:top .2s;
}
.skip-link:focus{ top:1rem; }

/* ---------- Typography helpers ---------- */
.eyebrow{
  font-family:var(--f-mono); font-size:.72rem; letter-spacing:.22em;
  text-transform:uppercase; color:var(--red); font-weight:700; margin-bottom:1rem;
}
.eyebrow-light{ color:var(--red-bright); }
.section-title{
  font-family:var(--f-display); font-weight:400; line-height:.98;
  letter-spacing:.01em; text-transform:uppercase;
  font-size:clamp(1.9rem,1.2rem + 3.6vw,3.6rem);
}
.section-lead{ color:var(--gray); max-width:54ch; margin-top:1rem; font-size:1.05rem; }
.section-dark .section-lead{ color:var(--gray-2); }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.55rem;
  font-weight:700; font-size:.92rem; letter-spacing:.01em;
  padding:.78rem 1.5rem; border-radius:50px; transition:.25s var(--ease);
  white-space:nowrap;
}
.btn-lg{ padding:1rem 1.9rem; font-size:1rem; }
.btn-primary{ background:var(--red); color:#fff; box-shadow:var(--shadow-red); }
.btn-primary:hover{ background:var(--red-deep); transform:translateY(-2px); }
.btn-outline{ border:2px solid currentColor; color:#fff; }
.btn-outline:hover{ background:#fff; color:var(--black); transform:translateY(-2px); }
.btn-ghost{ color:var(--ink); border:2px solid var(--line); }
.btn-ghost:hover{ border-color:var(--red); color:var(--red); }
.btn-light{ background:#fff; color:var(--black); }
.btn-light:hover{ transform:translateY(-2px); box-shadow:0 14px 30px -12px rgba(0,0,0,.5); }

/* ============================================================
   HEADER
   ============================================================ */
.site-header{
  position:fixed; inset:0 0 auto 0; z-index:100;
  transition:background .3s, box-shadow .3s, padding .3s;
  padding:.5rem 0;
}
.site-header.scrolled{
  background:rgba(255,255,255,.92);
  backdrop-filter:saturate(160%) blur(10px);
  box-shadow:0 1px 0 var(--line);
}
.header-inner{ display:flex; align-items:center; justify-content:space-between; gap:1rem; min-height:64px; }

.brand{ display:flex; align-items:center; gap:.6rem; font-family:var(--f-display); }
.brand-mark{
  display:grid; place-items:center; width:38px; height:38px; border-radius:9px;
  background:var(--red); color:#fff; font-size:1.4rem; line-height:1;
  box-shadow:var(--shadow-red);
}
.brand-text{ font-size:1.35rem; letter-spacing:.02em; color:var(--ink); }
.site-header:not(.scrolled) .brand-text{ color:#fff; }
.brand-accent{ color:var(--red); margin-left:.18em; }

.nav{ display:flex; align-items:center; gap:2rem; }
.nav-list{ display:flex; gap:1.6rem; }
.nav-list a{ font-weight:600; font-size:.94rem; color:var(--ink); position:relative; padding:.3rem 0; }
.site-header:not(.scrolled) .nav-list a{ color:rgba(255,255,255,.9); }
.nav-list a::after{ content:""; position:absolute; left:0; bottom:-2px; width:0; height:2px; background:var(--red); transition:width .25s var(--ease); }
.nav-list a:hover::after{ width:100%; }
.nav-actions{ display:flex; align-items:center; gap:.7rem; }
.lang-toggle{ font-family:var(--f-mono); font-size:.78rem; font-weight:700; letter-spacing:.06em; color:var(--ink); }
.site-header:not(.scrolled) .lang-toggle{ color:#fff; }
.lang-toggle .ar{ font-family:var(--f-body); }

.hamburger{ display:none; flex-direction:column; gap:5px; padding:8px; }
.hamburger span{ width:26px; height:2px; background:var(--ink); transition:.3s var(--ease); }
.site-header:not(.scrolled) .hamburger span{ background:#fff; }

/* ============================================================
   HERO SLIDER
   ============================================================ */
.hero{ position:relative; background:var(--black); color:#fff; }
.hero-slider{ position:relative; height:min(86vh,760px); min-height:540px; overflow:hidden; }
.hero-slide{ position:absolute; inset:0; display:flex; align-items:center; opacity:0; visibility:hidden; transition:opacity .8s var(--ease); }
.hero-slide.is-active{ opacity:1; visibility:visible; }
.hero-slide[hidden]{ display:flex; } /* keep flex; JS toggles is-active */

.slide-media{ position:absolute; inset:0; z-index:0; background:#0C0C0E center/cover no-repeat; transform:scale(1.06); transition:transform 7s linear; }
.hero-slide.is-active .slide-media{ transform:scale(1); }
.slide-video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.slide-scrim{ position:absolute; inset:0; background:linear-gradient(90deg, rgba(12,12,14,.92) 0%, rgba(12,12,14,.7) 42%, rgba(12,12,14,.25) 100%); }
.slide-content{ position:relative; z-index:1; padding-top:5rem; }

.hero-title{
  font-family:var(--f-display); font-weight:400; text-transform:uppercase;
  line-height:.92; letter-spacing:.005em;
  font-size:clamp(2.6rem,1.5rem + 7vw,6.2rem); margin:.4rem 0 1.1rem;
}
.hero-title .hl{ color:var(--red-bright); }
.hero-sub{ color:rgba(255,255,255,.85); max-width:44ch; font-size:1.1rem; }
.hero-cta{ display:flex; flex-wrap:wrap; gap:.9rem; margin-top:1.9rem; }

/* arrows + dots */
.slider-arrow{
  position:absolute; top:50%; transform:translateY(-50%); z-index:3;
  width:52px; height:52px; border-radius:50%; display:grid; place-items:center;
  background:rgba(255,255,255,.1); color:#fff; backdrop-filter:blur(6px);
  border:1px solid rgba(255,255,255,.25); transition:.25s var(--ease);
}
.slider-arrow:hover{ background:var(--red); border-color:var(--red); }
.slider-arrow.prev{ left:clamp(.6rem,2vw,1.6rem); }
.slider-arrow.next{ right:clamp(.6rem,2vw,1.6rem); }
.slider-dots{ position:absolute; left:0; right:0; bottom:1.4rem; z-index:3; display:flex; gap:.5rem; justify-content:center; }
.slider-dots button{ width:34px; height:4px; border-radius:4px; background:rgba(255,255,255,.35); transition:.3s; }
.slider-dots button.is-active{ background:var(--red); width:48px; }

/* overlapping action bar */
.hero-actions{ position:relative; z-index:5; margin-top:-44px; }
.actions-card{ background:#fff; color:var(--ink); border-radius:16px; box-shadow:0 30px 60px -28px rgba(0,0,0,.45); padding:1.4rem 1.6rem; }
.actions-tabs{ display:flex; flex-wrap:wrap; gap:1.6rem; border-bottom:1px solid var(--line); margin-bottom:1.1rem; }
.atab{ font-weight:700; font-size:1rem; color:var(--ink); padding:0 0 .8rem; position:relative; background:none; }
.atab.is-active{ color:var(--red); }
.atab.is-active::after{ content:""; position:absolute; left:0; bottom:-1px; width:100%; height:3px; background:var(--red); }
.actions-track{ display:flex; gap:.6rem; }
.actions-track .track-input{ flex:1; }
.actions-track .btn{ border-radius:12px; }

/* ============================================================
   STATS STRIP
   ============================================================ */
.stats-strip{ background:var(--black); color:#fff; }
.stats-inner{ display:grid; grid-template-columns:1fr 1fr; gap:1px; padding:0; }
.stat-item{ padding:2rem 1rem; text-align:center; position:relative; }
.stat-item::after{ content:""; position:absolute; right:0; top:22%; height:56%; width:1px; background:rgba(255,255,255,.12); }
.stat-item:nth-child(2)::after{ display:none; }
.stat-num,.stat-suffix{ font-family:var(--f-display); font-size:clamp(2rem,1.4rem + 2.4vw,3.2rem); color:#fff; line-height:1; display:inline; }
.stat-suffix{ color:var(--red-bright); }
.stat-label{ display:block; font-family:var(--f-mono); font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:var(--gray-2); margin-top:.6rem; }

/* ---------- Marquee ---------- */
.marquee{ background:var(--red); color:#fff; overflow:hidden; padding:.85rem 0; white-space:nowrap; }
.marquee-track{ display:inline-flex; gap:1.6rem; align-items:center; animation:marq 26s linear infinite; font-family:var(--f-display); letter-spacing:.08em; font-size:1.05rem; }
.marquee .dot{ font-size:.6rem; opacity:.7; }
@keyframes marq{ to{ transform:translateX(-50%); } }

/* ============================================================
   SECTIONS
   ============================================================ */
.section{ padding:clamp(3.5rem,2rem + 7vw,7rem) 0; }
.section-head{ max-width:720px; margin-bottom:3rem; }
.section-dark{ background:var(--black); color:#fff; }
.section-dark .section-title{ color:#fff; }

/* Services — image overlay cards */
.solutions-grid{ display:grid; gap:1.1rem; grid-template-columns:1fr; }
.sol-card{
  position:relative; display:block; min-height:380px; border-radius:var(--radius); overflow:hidden;
  background:#0C0C0E center/cover no-repeat; color:#fff; isolation:isolate;
}
.sol-card::after{ /* zoom layer handled via background on inner? use transform on scrim image */ }
.sol-scrim{ position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(12,12,14,0) 30%, rgba(12,12,14,.55) 62%, rgba(12,12,14,.92) 100%); transition:.4s var(--ease); }
.sol-card{ transition:transform .45s var(--ease), box-shadow .45s var(--ease); background-size:cover; }
.sol-card::before{ content:""; position:absolute; inset:0; background:inherit; background-size:cover; background-position:center; z-index:0; transition:transform .6s var(--ease); }
.sol-card:hover{ box-shadow:var(--shadow); }
.sol-card:hover::before{ transform:scale(1.07); }
.sol-card:hover .sol-scrim{ background:linear-gradient(180deg, rgba(162,13,22,.2) 0%, rgba(12,12,14,.55) 60%, rgba(12,12,14,.95) 100%); }
.sol-tag{ position:absolute; top:1rem; left:1.1rem; z-index:2; font-family:var(--f-mono); font-size:.78rem; letter-spacing:.1em; color:rgba(255,255,255,.7); }
.sol-body{ position:absolute; left:0; right:0; bottom:0; z-index:2; padding:1.5rem; }
.sol-body h3{ font-family:var(--f-body); font-weight:800; font-size:1.4rem; line-height:1.1; }
.sol-body .rule{ display:block; width:46px; height:4px; background:var(--red); border-radius:4px; margin:.7rem 0; transition:width .4s var(--ease); }
.sol-card:hover .sol-body .rule{ width:84px; }
.sol-body p{ font-size:.95rem; color:rgba(255,255,255,.82); max-width:42ch; }

/* Why */
.why-grid{ display:grid; gap:3rem; grid-template-columns:1fr; }
.check-list{ margin-top:1.8rem; display:grid; gap:1rem; }
.check-list li{ position:relative; padding-left:2rem; color:var(--gray-2); }
.check-list li strong{ color:#fff; }
.check-list li::before{
  content:""; position:absolute; left:0; top:.3rem; width:18px; height:18px; border-radius:50%;
  background:var(--red); box-shadow:0 0 0 4px rgba(225,20,32,.18);
}
.why-stats{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line-dark); border:1px solid var(--line-dark); border-radius:var(--radius); overflow:hidden; }
.big-stat{ background:var(--black); padding:1.8rem 1.4rem; }
.big-stat .stat-num,.big-stat .stat-suffix{ font-size:clamp(2.2rem,1.5rem + 3vw,3.4rem); }
.big-stat p{ font-family:var(--f-mono); font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; color:var(--gray-2); margin-top:.6rem; }

/* Industries — image tiles */
.industries{ background:var(--paper); }
.ind-grid{ display:grid; grid-template-columns:1fr 1fr; gap:.9rem; }
.ind-tile{
  position:relative; aspect-ratio:1/1; border-radius:var(--radius); overflow:hidden;
  background:#0C0C0E center/cover no-repeat; cursor:pointer;
}
.ind-tile::before{ content:""; position:absolute; inset:0; background:inherit; background-size:cover; background-position:center; transition:transform .55s var(--ease); }
.ind-tile:hover::before{ transform:scale(1.08); }
.ind-scrim{ position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(12,12,14,.1), rgba(12,12,14,.82)); transition:.35s var(--ease); }
.ind-tile:hover .ind-scrim{ background:linear-gradient(180deg, rgba(162,13,22,.35), rgba(12,12,14,.85)); }
.ind-label{
  position:absolute; left:0; right:0; bottom:0; z-index:2; padding:1.1rem;
  color:#fff; font-weight:700; font-size:1.02rem; line-height:1.2;
}
.ind-label::before{ content:""; display:block; width:34px; height:3px; background:var(--red); border-radius:3px; margin-bottom:.6rem; transition:width .4s var(--ease); }
.ind-tile:hover .ind-label::before{ width:60px; }

/* Track band */
.track-band{ background:linear-gradient(120deg,var(--red-deep),var(--red)); color:#fff; padding:clamp(3rem,2rem + 5vw,5rem) 0; position:relative; overflow:hidden; }
.track-band::before{ content:""; position:absolute; inset:0; background-image:repeating-linear-gradient(115deg,transparent 0 50px,rgba(255,255,255,.05) 50px 51px); }
.track-inner{ position:relative; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:2rem; }
.track-band .section-title{ color:#fff; }
.track-band .section-lead{ color:rgba(255,255,255,.85); }

/* About */
.about-grid{ display:grid; gap:3rem; grid-template-columns:1fr; align-items:center; }
.about-media{ position:relative; }
.about-img{
  aspect-ratio:4/5; border-radius:var(--radius); background:
    linear-gradient(160deg, rgba(225,20,32,.15), rgba(12,12,14,.05)),
    linear-gradient(45deg,var(--paper-2),var(--paper)),
    url("../images/about.jpg") center/cover no-repeat;
  border:1px solid var(--line); box-shadow:var(--shadow);
}
.about-badge{ position:absolute; left:-10px; bottom:24px; background:var(--black); color:#fff; padding:.8rem 1.2rem; border-radius:10px; font-family:var(--f-mono); font-size:.8rem; letter-spacing:.08em; }
.about-badge span{ color:var(--red-bright); font-weight:700; }
.about-copy p{ color:var(--gray); margin-bottom:1rem; }
.about-copy .btn{ margin-top:1rem; }

/* CTA */
.section-cta{ background:var(--black); color:#fff; text-align:center; }
.cta-title{ font-family:var(--f-display); text-transform:uppercase; line-height:1; font-size:clamp(2.2rem,1.4rem + 5vw,5rem); }
.section-cta .section-lead{ margin:1rem auto 2rem; color:var(--gray-2); }
.cta-actions{ display:flex; flex-wrap:wrap; gap:.9rem; justify-content:center; }

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer{ background:#070708; color:var(--gray-2); padding:4rem 0 1.5rem; }
.footer-grid{ display:grid; gap:2.4rem; grid-template-columns:1fr; }
.footer-brand .brand-text{ color:#fff; }
.footer-brand p{ margin:1rem 0 1.3rem; max-width:34ch; font-size:.95rem; }
.social{ display:flex; gap:.6rem; }
.social a{ display:grid; place-items:center; width:40px; height:40px; border-radius:10px; background:#15151a; color:#fff; transition:.25s var(--ease); }
.social a svg{ fill:currentColor; }
.social a:hover{ background:var(--red); transform:translateY(-3px); }
.footer-col h3{ color:#fff; font-size:1rem; margin-bottom:1rem; font-weight:800; }
.footer-col ul{ display:grid; gap:.6rem; }
.footer-col a:hover{ color:#fff; }
.footer-bottom{ display:flex; flex-wrap:wrap; gap:.6rem; justify-content:space-between; margin-top:3rem; padding-top:1.5rem; border-top:1px solid #1a1a20; font-size:.85rem; }
.credit{ color:var(--gray); }

/* ============================================================
   FLOATING TRACK BUTTON (FAB)
   ============================================================ */
.track-fab{
  position:fixed; right:clamp(1rem,3vw,2rem); bottom:clamp(1rem,3vw,2rem); z-index:90;
  display:flex; align-items:center; gap:.55rem;
  background:var(--red); color:#fff; padding:.9rem 1.3rem; border-radius:50px;
  font-weight:700; box-shadow:var(--shadow-red); transition:.3s var(--ease);
}
.track-fab:hover{ background:var(--red-deep); transform:translateY(-3px) scale(1.03); }
.track-fab svg{ position:relative; z-index:1; }
.fab-label{ position:relative; z-index:1; }
.fab-pulse{ position:absolute; inset:0; border-radius:50px; background:var(--red); z-index:0; animation:pulse 2.4s ease-out infinite; }
@keyframes pulse{ 0%{ transform:scale(1); opacity:.6; } 70%{ transform:scale(1.5); opacity:0; } 100%{ opacity:0; } }

/* ============================================================
   TRACKING MODAL
   ============================================================ */
.modal-overlay{
  position:fixed; inset:0; z-index:150; display:grid; place-items:center; padding:1.2rem;
  background:rgba(8,8,10,.6); backdrop-filter:blur(6px);
  opacity:0; transition:opacity .3s var(--ease);
}
.modal-overlay[hidden]{ display:none; }
.modal-overlay.open{ opacity:1; }
.modal-card{
  position:relative; width:100%; max-width:480px; background:#fff; color:var(--ink);
  border-radius:20px; padding:clamp(1.6rem,1rem + 3vw,2.6rem); box-shadow:0 30px 80px -20px rgba(0,0,0,.6);
  transform:translateY(24px) scale(.96); opacity:0; transition:transform .4s var(--ease), opacity .35s var(--ease);
}
.modal-overlay.open .modal-card{ transform:translateY(0) scale(1); opacity:1; }
.modal-close{ position:absolute; right:1rem; top:1rem; width:40px; height:40px; border-radius:50%; display:grid; place-items:center; color:var(--ink); transition:.2s; }
.modal-close:hover{ background:var(--paper-2); color:var(--red); transform:rotate(90deg); }
.modal-title{ font-family:var(--f-display); text-transform:uppercase; font-size:1.8rem; line-height:1; margin-bottom:.5rem; }
.modal-sub{ color:var(--gray); margin-bottom:1.4rem; font-size:.95rem; }
.track-form{ display:flex; gap:.6rem; }
.track-input{
  flex:1; font-family:var(--f-mono); font-size:.95rem; letter-spacing:.04em;
  padding:.85rem 1rem; border:2px solid var(--line); border-radius:12px; transition:.2s;
}
.track-input:focus{ border-color:var(--red); outline:none; }
.track-form .btn{ border-radius:12px; }
.modal-hint{ margin-top:1rem; font-size:.82rem; color:var(--gray); }
.linklike{ color:var(--red); font-family:var(--f-mono); font-weight:700; text-decoration:underline; }

/* Track result timeline */
.track-result{ margin-top:1.4rem; border-top:1px solid var(--line); padding-top:1.2rem; }
.track-result[hidden]{ display:none; }
.tr-ref{ font-family:var(--f-mono); font-weight:700; font-size:.95rem; }
.tr-status{ display:inline-block; margin:.4rem 0 1rem; background:rgba(225,20,32,.1); color:var(--red); font-weight:700; font-size:.78rem; letter-spacing:.06em; text-transform:uppercase; padding:.3rem .7rem; border-radius:50px; }
.timeline{ display:grid; gap:0; }
.tl-step{ position:relative; padding:0 0 1.1rem 1.7rem; border-left:2px solid var(--line); }
.tl-step:last-child{ border-color:transparent; padding-bottom:0; }
.tl-step::before{ content:""; position:absolute; left:-7px; top:2px; width:12px; height:12px; border-radius:50%; background:var(--line); }
.tl-step.done::before{ background:var(--red); box-shadow:0 0 0 4px rgba(225,20,32,.15); }
.tl-step.current::before{ background:var(--red); animation:blink 1.4s infinite; }
@keyframes blink{ 50%{ box-shadow:0 0 0 6px rgba(225,20,32,.28); } }
.tl-step b{ display:block; font-size:.92rem; }
.tl-step span{ font-family:var(--f-mono); font-size:.72rem; color:var(--gray); letter-spacing:.04em; }
.tr-loading{ font-family:var(--f-mono); font-size:.85rem; color:var(--gray); }

/* ============================================================
   SCROLL REVEAL
   ============================================================ */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.in{ opacity:1; transform:none; }
.reveal:nth-child(2){ transition-delay:.06s; }
.reveal:nth-child(3){ transition-delay:.12s; }
.reveal:nth-child(4){ transition-delay:.18s; }

/* Body scroll lock when modal/menu open */
body.no-scroll{ overflow:hidden; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (min-width:600px){
  .solutions-grid{ grid-template-columns:1fr 1fr; }
  .ind-grid{ grid-template-columns:repeat(3,1fr); }
  .stats-inner{ grid-template-columns:repeat(4,1fr); }
  .stat-item:nth-child(2)::after{ display:block; }
}
@media (min-width:768px){
  .footer-grid{ grid-template-columns:2fr 1fr 1fr 1.3fr; }
}
@media (min-width:900px){
  .solutions-grid{ grid-template-columns:repeat(3,1fr); }
  .ind-grid{ grid-template-columns:repeat(4,1fr); }
  .why-grid{ grid-template-columns:1.1fr .9fr; align-items:start; }
  .about-grid{ grid-template-columns:.9fr 1.1fr; }
}

/* ---------- Mobile nav ---------- */
@media (max-width:860px){
  .hamburger{ display:flex; }
  .nav{
    position:fixed; inset:0 0 0 auto; width:min(82vw,360px); flex-direction:column;
    align-items:flex-start; justify-content:flex-start; gap:2rem;
    background:var(--black); padding:6rem 2rem 2rem; transform:translateX(100%);
    transition:transform .4s var(--ease); box-shadow:-20px 0 60px -20px rgba(0,0,0,.6);
  }
  .nav.open{ transform:translateX(0); }
  .nav-list{ flex-direction:column; gap:1.2rem; width:100%; }
  .nav-list a{ color:#fff !important; font-size:1.2rem; }
  .nav-actions{ flex-direction:column; align-items:stretch; gap:.8rem; width:100%; }
  .nav-actions .btn{ justify-content:center; }
  .lang-toggle{ color:#fff !important; }
  .hamburger.active span:nth-child(1){ transform:translateY(7px) rotate(45deg); background:#fff; }
  .hamburger.active span:nth-child(2){ opacity:0; }
  .hamburger.active span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); background:#fff; }
}

@media (max-width:480px){
  .hero-stats{ gap:1.4rem; }
  .fab-label{ display:none; }
  .track-fab{ padding:1rem; }
  .footer-bottom{ flex-direction:column; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; transition:none !important; scroll-behavior:auto !important; }
  .reveal{ opacity:1; transform:none; }
}