/* ============================================================
   CFMOTO Aktion CFORCE — Snopex SA
   
   ============================================================ */

:root{
  /* CFMOTO Brand */
  --cf-blue:#0ab9d5;
  --cf-blue-dark:#0024b8;
  --cf-blue-light:#3d5ff5;
  --cf-cyan:#00d4ff;
  --cf-cyan-soft:rgba(0,212,255,0.12);

  /* Light Greys */
  --bg-0:#ffffff;
  --bg-1:#f4fbfc;
  --bg-2:#f5f6f8;
  --bg-3:#eef0f3;
  --bg-4:#e4e7ec;
  --bg-dark:#1a1f2e;

  --surface:rgba(255,255,255,0.7);
  --surface-strong:rgba(255,255,255,0.92);
  --surface-tint:rgba(0,50,239,0.04);

  --border:rgba(15,30,50,0.08);
  --border-mid:rgba(15,30,50,0.14);
  --border-strong:rgba(15,30,50,0.2);

  --text:#0a1929;
  --text-mid:rgba(10,25,41,0.75);
  --text-mute:rgba(10,25,41,0.55);
  --text-dim:rgba(10,25,41,0.4);

  --shadow-sm:0 2px 8px rgba(15,30,50,0.04);
  --shadow-md:0 12px 32px rgba(15,30,50,0.06);
  --shadow-lg:0 24px 60px rgba(15,30,50,0.1);
  --shadow-blue:0 12px 32px rgba(0,50,239,0.18);

--font: 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
	
	
	
	
  
  --r-sm:6px;
  --r-md:12px;
  --r-lg:18px;
  --r-xl:24px;
}

*{margin:0; padding:0; box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:var(--font);
  background:linear-gradient(180deg, var(--bg-2) 0%, var(--bg-2) 60%, var(--bg-3) 100%);
  color:var(--text);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  font-weight:400;
}

/* ============ BRAND WATERMARK (logo background fisso) ============ */
.brand-watermark{
  position:fixed;
  top:50%; left:50%;
  transform:translate(-50%, -50%) rotate(-0deg);
  width:100vmin; height:100vmin;
  z-index:0;
  pointer-events:none;
  opacity:0.045;
  display:flex; align-items:center; justify-content:center;
}
.brand-watermark img{
  width:100%; height:auto;
  filter:grayscale(100%);
}

/* ============ AMBIENT BLOBS ============ */
.ambient{
  position:fixed; inset:0;
  z-index:0;
  pointer-events:none;
  overflow:hidden;
}
.blob{
  position:absolute;
  border-radius:50%;
  filter:blur(120px);
  opacity:0.4;
  animation:float 28s ease-in-out infinite;
}
.blob-1{
  width:520px; height:520px;
  background:var(--bg-4);
  top:-120px; left:-80px;
  animation-delay:0s;
  opacity:0.18;
}
.blob-2{
  width:620px; height:620px;
  background:var(--bg-1);
  top:40%; right:-180px;
  animation-delay:-9s;
  opacity:0.1;
}
.blob-3{
  width:480px; height:480px;
  background:#a8b8d8;
  bottom:-100px; left:30%;
  animation-delay:-18s;
  opacity:0.25;
}
@keyframes float{
  0%,100%{ transform:translate(0,0) scale(1) }
  33%{ transform:translate(50px,-30px) scale(1.08) }
  66%{ transform:translate(-40px,40px) scale(0.95) }
}

main, nav, footer, section{
  position:relative;
  z-index:1;
}

/* ============ NAVBAR ============ */
.nav{
  position:fixed;
  top:16px; left:16px; right:16px;
  z-index:100;
  background:rgba(255,255,255,0.85);
  backdrop-filter:blur(28px) saturate(180%);
  -webkit-backdrop-filter:blur(28px) saturate(180%);
  border:1px solid var(--border);
  box-shadow:var(--shadow-md);
  border-radius:var(--r-lg);
  padding:12px 20px;
  transition:all .3s ease;
}
.nav.scrolled{
  top:8px;
  background:rgba(255,255,255,0.96);
  box-shadow:var(--shadow-lg);
}
.nav-inner{
  max-width:1320px; margin:0 auto;
  display:flex; align-items:center; justify-content:space-between;
  gap:24px;
}
.nav-brand{ display:flex; align-items:center; gap:14px; min-width:0 }
.nav-logo img{
  width:130px; height:auto; display:block;
}
.nav-snopex{
  font-size:11px; font-weight:500;
  letter-spacing:1.5px;
  color:var(--text-mute);
  text-transform:uppercase;
  padding-left:14px;
  border-left:1px solid var(--border-mid);
}
.nav-center{ display:flex; align-items:center; gap:4px }
.nav-link{
  color:var(--text-mid);
  text-decoration:none;
  font-size:14px;
  font-weight:500;
  padding:8px 14px;
  border-radius:100px;
  transition:all .2s;
  position:relative;
}
.nav-link:hover{
  color:var(--cf-blue);
  background:var(--surface-tint);
}

.nav-right{ display:flex; align-items:center; gap:12px }

.lang-switch{
  display:flex;
  background:rgba(15,30,50,0.04);
  padding:3px;
  border-radius:100px;
}
.lang-switch button{
  background:transparent; border:none; cursor:pointer;
  font-family:var(--font);
  font-size:11px; font-weight:600; letter-spacing:0.5px;
  color:var(--text-mute);
  padding:5px 10px;
  border-radius:100px;
  transition:all .2s;
}
.lang-switch button:hover{ color:var(--text) }
.lang-switch button.is-active{
  background:#fff;
  color:var(--cf-blue);
  box-shadow:0 1px 3px rgba(15,30,50,0.12);
}

.nav-cta{
  display:inline-flex; align-items:center; gap:8px;
  background:linear-gradient(135deg, var(--cf-blue) 0%, var(--cf-cyan) 100%);
  color:#fff;
  padding:11px 18px;
  border-radius:100px;
  font-size:13px; font-weight:600;
  text-decoration:none;
  box-shadow:var(--shadow-blue);
  transition:all .25s;
}
.nav-cta:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 40px rgba(0,50,239,0.32);
}
.nav-cta svg{ width:14px; height:14px }

.nav-toggle{
  display:none;
  background:rgba(15,30,50,0.05);
  border:none;
  width:40px; height:40px;
  border-radius:50%;
  cursor:pointer;
  align-items:center; justify-content:center;
  color:var(--text);
}
.nav-toggle svg{ width:20px; height:20px }

/* MOBILE MENU */
.mobile-menu{
  position:fixed; inset:0; z-index:200;
  background:rgba(250,251,252,0.98);
  backdrop-filter:blur(40px);
  display:flex; flex-direction:column;
  padding:24px;
  transform:translateY(-100%);
  transition:transform .4s cubic-bezier(.7,0,.3,1);
}
.mobile-menu.is-open{ transform:translateY(0) }
.mobile-menu-head{
  display:flex; justify-content:space-between; align-items:center;
  margin-bottom:48px;
}
.mobile-menu-head .nav-logo img{ width:140px }
.mobile-menu-close{
  background:rgba(15,30,50,0.06); border:none;
  width:44px; height:44px;
  border-radius:50%;
  cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
.mobile-menu-close svg{ width:22px; height:22px }
.mobile-menu-nav{
  display:flex; flex-direction:column; gap:4px;
  flex:1;
}
.mobile-menu-nav a{
  font-size:28px; font-weight:700; letter-spacing:-0.5px;
  color:var(--text);
  text-decoration:none;
  padding:18px 0;
  border-bottom:1px solid var(--border);
  display:flex; justify-content:space-between; align-items:center;
}
.mobile-menu-nav a svg{ width:24px; height:24px; opacity:.4 }
.mobile-menu-foot{
  padding-top:24px;
  border-top:1px solid var(--border);
}
.mobile-menu-foot .lang-switch{
  justify-content:center;
  margin-bottom:16px;
}

/* ============ BUTTONS ============ */
.btn-primary{
  display:inline-flex; align-items:center; gap:10px;
  background:linear-gradient(135deg, var(--cf-blue) 0%, var(--cf-cyan) 100%);
  color:#fff;
  padding:16px 28px;
  border-radius:100px;
  font-size:14px; font-weight:600;
  text-decoration:none;
  border:none; cursor:pointer;
  box-shadow:var(--shadow-blue);
  transition:all .25s;
  font-family:var(--font);
}
.btn-primary:hover{
  transform:translateY(-3px);
  box-shadow:0 24px 50px rgba(0,50,239,0.32);
}
.btn-primary svg{ width:16px; height:16px }

.btn-ghost{
  display:inline-flex; align-items:center; gap:10px;
  background:var(--surface);
  color:var(--text);
  padding:16px 28px;
  border-radius:100px;
  font-size:14px; font-weight:600;
  text-decoration:none;
  border:1px solid var(--border-mid);
  backdrop-filter:blur(20px);
  transition:all .25s;
}
.btn-ghost:hover{
  background:var(--surface-strong);
  transform:translateY(-2px);
  box-shadow:var(--shadow-sm);
  border-color:var(--cf-blue);
  color:var(--cf-blue);
}
.btn-ghost svg{ width:16px; height:16px }

.btn-row{ display:flex; gap:14px; flex-wrap:wrap }

/* ============ HERO ============ */
.hero{
  min-height:100vh;
  padding:140px 24px 80px;
  display:flex; align-items:center;
}
.hero-inner{
  max-width:1320px; margin:0 auto; width:100%;
  display:grid; grid-template-columns:1.1fr 1fr;
  gap:60px; align-items:center;
}

.hero-badge{
  display:inline-flex; align-items:center; gap:10px;
  background:rgba(0,50,239,0.06);
  backdrop-filter:blur(10px);
  border:1px solid rgba(0,50,239,0.15);
  padding:8px 16px;
  border-radius:100px;
  font-size:12px; font-weight:600;
  color: black;
  margin-bottom:28px;
  box-shadow:var(--shadow-sm);
}
.hero-badge::before{
  content:'';
  width:8px; height:8px;
  border-radius:50%;
  background:var(--cf-blue);
  box-shadow:0 0 12px var(--cf-blue);
  animation:pulse 2s infinite;
}
@keyframes pulse{
  0%,100%{ opacity:1; transform:scale(1) }
  50%{ opacity:.5; transform:scale(1.4) }
}

.hero h1{
  font-size:clamp(44px, 6.5vw, 88px);
  font-weight:800; line-height:.98;
  letter-spacing:-2.5px;
  margin-bottom:24px;
}
.hero h1 .grad{
  background-color: #11b7e9;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  display:inline-block;
}

.hero-sub{
  font-size:16px;
  color:var(--text-mid);
  max-width:540px;
  margin-bottom:36px;
  line-height:1.65;
	font-weight: 500;
}

.hero-price-card{
  background:var(--surface-strong);
  backdrop-filter:blur(24px);
  border:1px solid var(--border);
  border-radius:var(--r-lg);
  padding:24px;
  margin-bottom:32px;
  box-shadow:var(--shadow-md);
  position:relative;
  overflow:hidden;
}
.hero-price-card::before{
  content:'';
  position:absolute; top:0; left:0; bottom:0; width:4px;
  background:linear-gradient(180deg, var(--cf-blue), var(--cf-cyan));
}
.hero-price-meta{ }
.hero-price-label{
  font-size:11px;
  letter-spacing:2px;
  text-transform:uppercase;
  color:var(--text-mute);
  font-weight:600;
  margin-bottom:6px;
}
.hero-price-value{
  font-size:clamp(44px, 5.5vw, 64px);
  font-weight:800;
  line-height:1;
  letter-spacing:-1.5px;
  background:linear-gradient(135deg, var(--cf-blue) 0%, var(--cf-cyan) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  margin-bottom:8px;
}
.hero-price-value sup{ font-size:0.45em; vertical-align:super }
.hero-price-note{
  font-size:13px;
  color:var(--text-mid);
}
.hero-price-note strong{ color:var(--text); font-weight:600 }

.hero-warranty-tag{
  display:flex; align-items:center; gap:12px;
  margin-top:18px;
  padding-top:18px;
  border-top:1px dashed var(--border-mid);
}
.hero-warranty-tag svg{
  width:32px; height:32px;
  color:var(--cf-blue);
  flex-shrink:0;
}
.hero-warranty-tag strong{
  display:block;
  font-size:14px;
  color:var(--text);
  font-weight:700;
  margin-bottom:2px;
}
.hero-warranty-tag span{
  font-size:12px;
  color:var(--text-mute);
}

/* HERO VISUAL */
.hero-visual{
  position:relative;
  aspect-ratio:1/1;

  display:flex; align-items:center; justify-content:center;
}
.hero-visual::before{
  content:'';
  position:absolute; inset:0;
;
}
.hero-visual > img{
  position:relative;
  width:88%; height:88%;
  object-fit:contain;
  object-position:center;
  z-index:1;
  filter:drop-shadow(0 30px 50px rgba(15,30,50,0.15));
  transition:transform 1s ease;
}
.hero-visual:hover > img{ transform:scale(1.03) }

.hero-stat{
  position:absolute; z-index:3;
  background:var(--surface-strong);
  backdrop-filter:blur(20px);
  border:1px solid rgba(255,255,255,0.7);
  border-radius:var(--r-md);
  padding:12px 16px;
  box-shadow:var(--shadow-md);
  display:flex; flex-direction:column; gap:2px;
  min-width:96px;
  animation:floatStat 4s ease-in-out infinite;
}
.hero-stat .num{
  font-size:22px;
  font-weight:800;
  line-height:1;
  letter-spacing:-0.8px;
  color:var(--text);
}
.hero-stat .num sup{
  font-size:0.55em;
  color:var(--cf-blue);
  vertical-align:super;
}
.hero-stat .lbl{
  font-size:10px;
  letter-spacing:1px;
  text-transform:uppercase;
  color:var(--text-mute);
  font-weight:600;
}
.hero-stat-1{ top:24px; right:24px }
.hero-stat-2{ bottom:24px; left:24px; animation-delay:-1.5s }
.hero-stat-3{ top:50%; right:-16px; transform:translateY(-50%); animation-delay:-3s }
@keyframes floatStat{
  0%,100%{ transform:translateY(0) }
  50%{ transform:translateY(-8px) }
}
.hero-stat-3{ animation:floatStat3 4s ease-in-out infinite }
@keyframes floatStat3{
  0%,100%{ transform:translateY(-50%) }
  50%{ transform:translateY(calc(-50% - 8px)) }
}

/* ============ WARRANTY STAR BADGE (hero) ============ */
.warranty-star{
  position:absolute; z-index:4;
  top:24px; left:24px;
  width:110px; height:110px;
  border-radius:50%;
  background:linear-gradient(135deg, var(--cf-blue) 0%, var(--cf-cyan) 100%);
  display:flex; align-items:center; justify-content:center;
  box-shadow:
    0 12px 30px rgba(0,50,239,0.4),
    inset 0 -4px 12px rgba(0,0,0,0.15),
    inset 0 4px 12px rgba(255,255,255,0.25);
  animation:starSpin 16s linear infinite;
  overflow:hidden;
}
@keyframes starSpin{
  from{ transform:rotate(0) }
  to{ transform:rotate(360deg) }
}
.warranty-star-inner{
  position:relative; z-index:2;
  text-align:center;
  color:#fff;
  animation:starSpinInverse 16s linear infinite;
}
@keyframes starSpinInverse{
  from{ transform:rotate(0) }
  to{ transform:rotate(-360deg) }
}
.warranty-star-num{
  font-size:36px; font-weight:800; line-height:1;
}
.warranty-star-lbl{
  font-size:10px; letter-spacing:1.5px; font-weight:700;
  margin-top:2px;
}
.warranty-star-warranty{
  font-size:8px; letter-spacing:1px; font-weight:600;
  opacity:.9;
}
.warranty-star-shine{
  position:absolute; inset:-50%;
  background:linear-gradient(
    115deg,
    transparent 30%,
    rgba(255,255,255,0.5) 50%,
    transparent 70%
  );
  animation:shine 3s ease-in-out infinite;
  pointer-events:none;
}
@keyframes shine{
  0%{ transform:translateX(-100%) rotate(0deg) }
  50%{ transform:translateX(100%) rotate(0deg) }
  100%{ transform:translateX(100%) rotate(0deg) }
}

/* ============ TICKER ============ */
.ticker{
  background:linear-gradient(90deg, var(--cf-blue) 0%, var(--cf-cyan) 100%);
  padding:16px 0;
  overflow:hidden;
  border-top:1px solid rgba(255,255,255,0.4);
  border-bottom:1px solid rgba(255,255,255,0.4);
}
.ticker-track{
  display:flex; gap:60px; white-space:nowrap;
  animation:scroll 35s linear infinite;
  font-size:14px; font-weight:700; letter-spacing:2px;
  text-transform:uppercase;
  color:#fff;
}
@keyframes scroll{
  0%{ transform:translateX(0) }
  100%{ transform:translateX(-50%) }
}

/* ============ SECTION BASE ============ */
section{ padding:100px 24px }
.container{ max-width:1320px; margin:0 auto }
.section-head{ margin-bottom:60px; max-width:760px }
.section-label{
  display:inline-block;
  font-size:11px; letter-spacing:2.5px; text-transform:uppercase;
  font-weight:700;
  color:var(--cf-blue);
  padding:6px 14px;
  border-radius:100px;
  background:rgba(0,50,239,0.08);
  margin-bottom:20px;
}
.section-title{
  font-size:clamp(36px, 5vw, 60px);

  line-height:1.05;
  letter-spacing:-1.5px;
  margin-bottom:20px;
	text-transform: uppercase;
}
.section-title .grad{
  background:linear-gradient(135deg, var(--cf-blue) 0%, var(--cf-cyan) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}
.section-intro{
  font-size:17px;
  color:var(--text-mid);
  line-height:1.7;
}

/* ============ MODELS ============ */
.models{ background:transparent }
.models-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:28px;
}
.model-card{
  background:var(--surface-strong);
  backdrop-filter:blur(24px) saturate(180%);
  border:1px solid var(--border);
  border-radius:var(--r-xl);
  overflow:hidden;
  box-shadow:var(--shadow-sm);
  transition:all .4s cubic-bezier(.4,0,.2,1);
}
.model-card:hover{
  transform:translateY(-10px);
  box-shadow:var(--shadow-lg);
  border-color:var(--cf-blue);
}
.model-img{
  height:300px;
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg, #ffffff 0%, #eef2f9 100%);
}
.model-img img{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:contain;
  padding:30px;
  transition:transform .8s ease;
  filter:drop-shadow(0 20px 30px rgba(15,30,50,0.12));
}
.model-card:hover .model-img img{ transform:scale(1.06) }
.model-img::after{
  content:'';
  position:absolute; inset:0;
  background:linear-gradient(180deg, transparent 70%, rgba(255,255,255,0.2) 100%);
  pointer-events:none;
}
.model-badge{
  position:absolute; top:20px; left:20px;
  background:var(--surface-strong);
  backdrop-filter:blur(20px);
  border:1px solid rgba(255,255,255,0.6);
  color:var(--cf-blue);
  font-size:11px; font-weight:700; letter-spacing:1.5px;
  padding:6px 12px;
  border-radius:100px;
  text-transform:uppercase;
  box-shadow:var(--shadow-sm);
  z-index:2;
}

.model-info{ padding:32px }
.model-sub{
  font-size:12px; letter-spacing:1.5px; text-transform:uppercase;
  color:var(--cf-blue); font-weight:600;
  margin-bottom:8px;
}
.model-name{
  font-size:32px; font-weight:800; line-height:1;
  letter-spacing:-1px;
  margin-bottom:18px;
}
.model-badges-row{
  display:flex; gap:8px; flex-wrap:wrap;
  margin-bottom:24px;
}
.model-homol{
  display:inline-flex; align-items:center; gap:6px;
  background:rgba(0,50,239,0.08);
  border:1px solid rgba(0,50,239,0.15);
  color:var(--cf-blue);
  font-size:10px; font-weight:700; letter-spacing:1.2px;
  padding:5px 10px;
  border-radius:100px;
  text-transform:uppercase;
}
.model-homol::before{
  content:'';
  width:6px; height:6px;
  border-radius:50%;
  background:var(--cf-blue);
  box-shadow:0 0 8px var(--cf-blue);
}
.model-warranty{
  display:inline-flex; align-items:center; gap:6px;
  background:linear-gradient(135deg, var(--cf-blue), var(--cf-cyan));
  color:#fff;
  font-size:10px; font-weight:700; letter-spacing:1.2px;
  padding:5px 10px;
  border-radius:100px;
  text-transform:uppercase;
  box-shadow:0 4px 12px rgba(0,50,239,0.2);
}
.model-warranty::before{
  content:'';
  font-size:11px;
}

.model-specs{
  display:grid; grid-template-columns:repeat(3, 1fr);
  gap:12px;
  padding:20px 0;
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  margin-bottom:20px;
}
.spec{ text-align:left }
.spec-val{
  font-size:22px; font-weight:800;
  color:var(--text); line-height:1;
  letter-spacing:-0.5px;
}
.spec-val sub{
  font-size:0.55em; color:var(--text-mute); font-weight:500;
}
.spec-lbl{
  font-size:10px; letter-spacing:1.2px; text-transform:uppercase;
  color:var(--text-mute); margin-top:6px; font-weight:600;
}

.model-price-block{
  display:flex; flex-direction:column; gap:8px;
  margin-bottom:20px;
}
.model-price-row,
.model-discount{
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 16px;
  border-radius:var(--r-md);
}
.model-price-row{
  background:rgba(15,30,50,0.04);
  border:1px solid var(--border);
}
.model-price-lbl{
  font-size:12px; letter-spacing:1px; text-transform:uppercase;
  color:var(--text-mute); font-weight:600;
}
.model-price-val{
  font-size:18px; font-weight:700; color:var(--text);
}
.model-discount{

  border:1px solid rgba(0,50,239,0.18);
}
.model-discount-lbl{
  font-size:12px; letter-spacing:1px; text-transform:uppercase;
  color:var(--text-mute); font-weight:600;
}
.model-discount-val{
  font-size:20px; font-weight:800;
  background:linear-gradient(135deg, var(--cf-blue) 0%, var(--cf-cyan) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  letter-spacing:-0.3px;
}


.model-total{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 18px;
  border-radius:var(--r-md);
  background: black;
  box-shadow:0 8px 20px rgba(0,50,239,0.22);
  margin-top:4px;
}
.model-total-lbl{
  font-size:12px; letter-spacing:1px; text-transform:uppercase;
  color:#fff; font-weight:700;
}
.model-total-val{
  font-size:24px; font-weight:800;
  color:#fff; letter-spacing:-0.5px;
}



.model-cta-row{ display:flex; gap:10px }
.model-cta{
  flex:1.4;
  display:flex; align-items:center; justify-content:center; gap:8px;
  background:linear-gradient(135deg, var(--cf-blue) 0%, var(--cf-cyan) 100%);
  color:#fff;
  padding:14px;
  border-radius:100px;
  font-size:13px; font-weight:600;
  text-decoration:none;
  transition:all .25s;
  box-shadow:var(--shadow-blue);margin-top: 50px;
}
.model-cta:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 36px rgba(0,50,239,0.28);
}
.model-cta svg{ width:14px; height:14px }
.model-cta-pdf{
  flex:1;
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  background:var(--surface);
  color:var(--text);
  padding:14px;
  border:1px solid var(--border-mid);
  border-radius:100px;
  font-size:13px; font-weight:600;
  text-decoration:none;
  transition:all .2s;
}
.model-cta-pdf:hover{
  background:var(--surface-strong);
  border-color:var(--cf-blue);
  color:var(--cf-blue);
}
.model-cta-pdf svg{ width:14px; height:14px }

/* ============ WARRANTY SECTION ============ */
.warranty{
  background:linear-gradient(180deg, transparent 0%, rgba(0,50,239,0.03) 50%, transparent 100%);
}
.warranty-grid{
  display:grid; grid-template-columns:1.3fr 1fr;
  gap:80px; align-items:center;
}
.warranty-list{
  list-style:none;
  margin:32px 0;
  display:flex; flex-direction:column; gap:14px;
}
.warranty-list li{
  display:flex; align-items:center; gap:14px;
  font-size:16px;
  color:var(--text);
  font-weight:500;
}
.warranty-list svg{
  width:24px; height:24px;
  padding:5px;
  background:linear-gradient(135deg, var(--cf-blue), var(--cf-cyan));
  color:#fff;
  border-radius:50%;
  box-shadow:0 4px 12px rgba(0,50,239,0.2);
  flex-shrink:0;
}
.warranty-disclaimer{
  font-size:13px;
  color:var(--text-mute);
  line-height:1.6;
  padding:16px;
  background:rgba(15,30,50,0.03);
  border-left:3px solid var(--cf-blue);
  border-radius:var(--r-sm);
  margin-top:20px;
}
.warranty-disclaimer strong{
  color:var(--cf-blue);
  font-weight:700;
}

.warranty-visual{
  display:flex; align-items:center; justify-content:center;
}
.warranty-badge-big{
  position:relative;
  width:340px; height:340px;
  display:flex; align-items:center; justify-content:center;
}
.warranty-badge-ring{
  position:absolute; inset:0;
  width:100%; height:100%;
}
.warranty-badge-content{
  position:relative; z-index:2;
  width:260px; height:260px;
  border-radius:50%;
  background:linear-gradient(135deg, var(--cf-blue) 0%, var(--cf-cyan) 100%);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  color:#fff;
  text-align:center;
  box-shadow:
    0 20px 50px rgba(0,50,239,0.35),
    inset 0 -8px 20px rgba(0,0,0,0.15),
    inset 0 8px 20px rgba(255,255,255,0.25);
  overflow:hidden;
}
.warranty-badge-content::before{
  content:'';
  position:absolute; inset:-50%;
  background:linear-gradient(115deg, transparent 35%, rgba(255,255,255,0.4) 50%, transparent 65%);
  animation:shine 4s ease-in-out infinite;
  pointer-events:none;
}
.warranty-badge-num{
  font-size:96px; font-weight:800; line-height:1;
  letter-spacing:-4px;
}
.warranty-badge-yrs{
  font-size:18px; font-weight:700; letter-spacing:3px;
  margin-top:-4px;
}
.warranty-badge-text{
  font-size:13px; letter-spacing:2px; font-weight:600;
  margin-top:6px;
  opacity:.95;
}

/* ============ DEALERS ============ */
.dealers-head{
  display:grid; grid-template-columns:1.5fr 1fr;
  gap:60px; align-items:end;
  margin-bottom:40px;
}
.dealers-aside{
  text-align:right;
  font-size:14px;
  color:var(--text-mid);
}
.dealers-aside a{
  display:inline-block; margin-top:8px;
  color:var(--cf-blue); text-decoration:none;
  font-weight:600;
  border-bottom:2px solid var(--cf-cyan);
  padding-bottom:2px;
  transition:all .2s;
}
.dealers-aside a:hover{ color:var(--cf-blue-dark) }

.iframe-wrap{
  background:var(--surface-strong);
  backdrop-filter:blur(24px);
  border:1px solid var(--border);
  border-radius:var(--r-xl);
  overflow:hidden;
  box-shadow:var(--shadow-lg);
  position:relative;
}
.iframe-wrap::before{
  content:'';
  position:absolute; top:0; left:0; right:0; height:4px;
  background:linear-gradient(90deg, var(--cf-blue) 0%, var(--cf-cyan) 100%);
  z-index:2;
}
.iframe-header{
  padding:14px 20px;
  border-bottom:1px solid var(--border);
  display:flex; align-items:center; justify-content:space-between;
  font-size:13px;
  background:rgba(255,255,255,0.5);
}
.iframe-header-left{
  display:flex; align-items:center; gap:10px;
  color:var(--text-mid); font-weight:500;
}
.iframe-header-left .dot{
  width:8px; height:8px;
  border-radius:50%;
  background:#22c55e;
  box-shadow:0 0 10px rgba(34,197,94,0.6);
  animation:pulse 2s infinite;
}
.iframe-header-url{
  font-family:'SF Mono', Menlo, monospace;
  font-size:11px;
  color:var(--text-mute);
  background:rgba(15,30,50,0.04);
  padding:5px 10px;
  border-radius:6px;
}
.iframe-dealers{
  width:100%;
  height:720px;
  border:none;
  display:block;
  background:#fff;
}

/* ============ CONTACT FORM ============ */
.contact{
  background:linear-gradient(180deg, transparent 0%, rgba(15,30,50,0.02) 100%);
}
.contact-grid{
  display:grid; grid-template-columns:1fr 1.2fr;
  gap:80px;
  align-items:flex-start;
}
.contact-info{}

.contact-features{
  display:flex; flex-direction:column; gap:20px;
  margin-top:36px;
}
.contact-feature{
  display:flex; align-items:flex-start; gap:14px;
}
.contact-feature svg{
  width:40px; height:40px;
  padding:8px;
  background:linear-gradient(135deg, var(--cf-blue), var(--cf-cyan));
  color:#fff;
  border-radius:var(--r-md);
  box-shadow:0 8px 20px rgba(0,50,239,0.2);
  flex-shrink:0;
}
.contact-feature strong{
  display:block;
  font-size:15px;
  color:var(--text);
  font-weight:700;
  margin-bottom:2px;
}
.contact-feature span{
  font-size:13px;
  color:var(--text-mute);
}

.contact-form-wrap{
  position:relative;
}
.contact-form{
  background:var(--surface-strong);
  backdrop-filter:blur(28px) saturate(180%);
  border:1px solid var(--border);
  border-radius:var(--r-xl);
  padding:40px;
  box-shadow:var(--shadow-lg);
  position:relative;
  overflow:hidden;
}
.contact-form::before{
  content:'';
  position:absolute; top:0; left:0; right:0; height:4px;
  background:linear-gradient(90deg, var(--cf-blue) 0%, var(--cf-cyan) 100%);
}
.form-row{
  display:grid; grid-template-columns:1fr 1fr;
  gap:14px;
}
.form-field{ margin-bottom:18px }
.form-field label{
  display:block;
  font-size:12px;
  font-weight:600;
  color:var(--text-mid);
  margin-bottom:8px;
  letter-spacing:0.3px;
}
.form-field input,
.form-field select,
.form-field textarea{
  width:100%;
  background:#fff;
  border:1px solid var(--border-mid);
  border-radius:var(--r-md);
  padding:14px 16px;
  font-size:15px;
  font-family:var(--font);
  color:var(--text);
  transition:all .2s;
  outline:none;
}
.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus{
  border-color:var(--cf-blue);
  box-shadow:0 0 0 4px rgba(0,50,239,0.08);
}
.form-field textarea{
  resize:vertical;
  min-height:100px;
}
.form-field select{
  cursor:pointer;
  appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230a1929' stroke-width='2'><path d='M6 9l6 6 6-6'/></svg>");
  background-repeat:no-repeat;
  background-position:right 14px center;
  background-size:18px;
  padding-right:42px;
}

.form-check{
  display:flex; align-items:flex-start; gap:10px;
  margin-bottom:20px;
  font-size:13px;
  color:var(--text-mid);
  line-height:1.55;
}
.form-check input[type="checkbox"]{
  width:18px; height:18px;
  margin-top:2px;
  accent-color:var(--cf-blue);
  cursor:pointer;
  flex-shrink:0;
}
.form-check a{
  color:var(--cf-blue);
  text-decoration:underline;
}

.form-submit{
  width:100%;
  justify-content:center;
  padding:18px;
  font-size:15px;
}

.form-feedback{
  margin-top:16px;
  padding:14px 18px;
  border-radius:var(--r-md);
  font-size:14px;
  display:none;
}
.form-feedback.is-success{
  display:block;
  background:rgba(34,197,94,0.08);
  border:1px solid rgba(34,197,94,0.25);
  color:#15803d;
}
.form-feedback.is-error{
  display:block;
  background:rgba(239,68,68,0.08);
  border:1px solid rgba(239,68,68,0.25);
  color:#b91c1c;
}

/* ============ CTA FINAL ============ */
.cta-final{
  padding:140px 24px;
  text-align:center;
}
.cta-card{
  max-width:1080px; margin:0 auto;
  
  backdrop-filter:blur(30px);
  
  padding:80px 40px;
  box-shadow:var(--shadow-lg);
  position:relative; overflow:hidden;
}
.cta-card::before{
  content:'';
  position:absolute;
  top:-100px; left:50%; transform:translateX(-50%);
  width:600px; height:600px;
  border-radius:50%;
  background:radial-gradient(circle, var(--cf-cyan) 0%, transparent 70%);
  opacity:0.15;
  pointer-events:none;
}
.cta-card > *{ position:relative; z-index:1 }
.cta-card .section-label{ margin-bottom:24px }
.cta-card h2{
  font-size:clamp(40px, 6vw, 72px);
  font-weight:800;
  line-height:1;
  letter-spacing:-2px;
  margin-bottom:20px;
}
.cta-card h2 .grad{
  background:linear-gradient(135deg, var(--cf-blue) 0%, var(--cf-cyan) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}
.cta-card p{
  font-size:30px;
  color:var(--text-mid);
  max-width:580px;
  margin:0 auto 40px;
	font-weight: 600;
}

.countdown{
  display:flex; gap:14px; justify-content:center;
  margin-bottom:40px;
  flex-wrap:wrap;
}
.cd-box{
  background:var(--surface-strong);
  backdrop-filter:blur(20px);
  border:1px solid rgba(255,255,255,0.7);
  padding:18px 24px;
  border-radius:var(--r-md);
  min-width:96px;
  box-shadow:var(--shadow-sm);
}
.cd-num{
  font-size:40px; font-weight:800; line-height:1;
  letter-spacing:-1.5px;
  background-color: black;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}
.cd-lbl{
  font-size:10px; letter-spacing:1.5px; text-transform:uppercase;
  color:var(--text-mute); margin-top:6px; font-weight:600;
}

.cta-btn-row{
  display:flex; gap:14px; justify-content:center; flex-wrap:wrap;
}

/* ============ FOOTER ============ */
.footer{
  background:linear-gradient(180deg, var(--bg-3) 0%, var(--bg-4) 100%);
  padding:80px 24px 32px;
  border-top:1px solid var(--border);
}
.footer-inner{ max-width:1320px; margin:0 auto }
.footer-top{
  display:grid; grid-template-columns:2fr 1fr 1fr 1fr;
  gap:48px;
  padding-bottom:48px;
  border-bottom:1px solid var(--border);
}
.footer-logo img{ width:160px; height:auto; margin-bottom:18px }
.footer-desc{
  font-size:14px; color:var(--text-mute);
  line-height:1.7;
  max-width:380px;
  margin-bottom:20px;
}
.footer-contact{
  font-size:14px; color:var(--text-mute); line-height:1.8;
}
.footer-contact a{ color:var(--text); text-decoration:none; font-weight:500 }
.footer-col h4{
  font-size:11px; letter-spacing:1.5px; text-transform:uppercase;
  color:var(--cf-blue); font-weight:700;
  margin-bottom:18px;
}
.footer-col a{
  display:block;
  color:var(--text-mute); text-decoration:none;
  font-size:14px; padding:6px 0;
  transition:color .2s;
}
.footer-col a:hover{ color:var(--cf-blue) }
.footer-bottom{
  display:flex; justify-content:space-between; align-items:center;
  padding-top:28px;
  font-size:13px; color:var(--text-dim);
}
.footer-social{ display:flex; gap:10px }
.footer-social a{
  width:38px; height:38px;
  background:#fff;
  border:1px solid var(--border);
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  color:var(--text-mute);
  transition:all .2s;
}
.footer-social a:hover{
  background:var(--cf-blue);
  color:#fff;
  border-color:var(--cf-blue);
  transform:translateY(-2px);
}
.footer-social svg{ width:16px; height:16px }

/* ============ REVEAL ANIMATIONS ============ */
[data-reveal]{
  opacity:0;
  transform:translateY(30px);
  transition:opacity .8s ease, transform .8s ease;
}
[data-reveal].is-visible{
  opacity:1;
  transform:translateY(0);
}

/* ============ RESPONSIVE ============ */
@media (max-width:1100px){
  .hero-inner{ gap:40px }
  .warranty-grid{ gap:60px }
}
@media (max-width:980px){
  .nav-center{ display:none }
  .nav-cta{ display:none }
  .nav-toggle{ display:flex }
  .nav .lang-switch{ display:none }
  .nav-snopex{ display:none }
  
  .hero{ padding:120px 20px 60px; min-height:auto }
  .hero-inner{ grid-template-columns:1fr; gap:40px }
  .hero-visual{ aspect-ratio:4/3; order:-1 }
  .hero-stat-3{ display:none }
  .warranty-star{ width:90px; height:90px; top:16px; left:16px }
  .warranty-star-num{ font-size:30px }
  
  .models-grid{ grid-template-columns:1fr }
  
  .warranty-grid{ grid-template-columns:1fr; gap:40px }
  .warranty-visual{ order:-1 }
  .warranty-badge-big{ width:260px; height:260px }
  .warranty-badge-content{ width:200px; height:200px }
  .warranty-badge-num{ font-size:72px }
  
  .dealers-head{ grid-template-columns:1fr; gap:24px }
  .dealers-aside{ text-align:left }
  
  .contact-grid{ grid-template-columns:1fr; gap:50px }
  
  .footer-top{ grid-template-columns:1fr 1fr; gap:32px }
  .footer-brand{ grid-column:1/-1 }
  
  .iframe-dealers{ height:560px }
  .cta-card{ padding:60px 28px }
}
@media (max-width:600px){
  section{ padding:70px 18px }
  .nav{ top:8px; left:8px; right:8px; padding:10px 14px }
  .nav-logo img{ width:110px }
  
  .models-grid{ gap:20px }
  .model-info{ padding:24px }
  .model-cta-row{ flex-direction:column }
  
  .form-row{ grid-template-columns:1fr }
  .contact-form{ padding:28px 22px }
  
  .footer-top{ grid-template-columns:1fr }
  .footer-bottom{ flex-direction:column; gap:18px; text-align:center }
  
  .iframe-dealers{ height:500px }
  .cd-box{ min-width:74px; padding:14px 16px }
  .cd-num{ font-size:30px }
  
  .btn-row{ flex-direction:column }
  .btn-primary, .btn-ghost{ justify-content:center }
}
