/* ═══ discover.css — public marketing/catalog page (extracted from inline styles) ═══ */
* , *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: 'Inter', sans-serif; overflow-x: hidden; }
a { text-decoration: none; color: inherit; }
.dsc-root { background: #0f1a17; color: #fff; }

/* reveal-on-scroll */
.reveal { opacity: 0; transform: translateY(36px); transition: opacity .7s cubic-bezier(.22,.61,.36,1), transform .7s cubic-bezier(.22,.61,.36,1); }
.reveal.is-visible { opacity: 1; transform: none; }
.reveal-group > * { opacity: 0; transform: translateY(34px) scale(.98); transition: opacity .6s cubic-bezier(.22,.61,.36,1), transform .6s cubic-bezier(.22,.61,.36,1); }
.reveal-group.is-visible > * { opacity: 1; transform: none; }
.reveal-group.is-visible > *:nth-child(1){transition-delay:.04s}
.reveal-group.is-visible > *:nth-child(2){transition-delay:.12s}
.reveal-group.is-visible > *:nth-child(3){transition-delay:.20s}
.reveal-group.is-visible > *:nth-child(4){transition-delay:.28s}
.reveal-group.is-visible > *:nth-child(5){transition-delay:.36s}
@media (prefers-reduced-motion: reduce){ .reveal, .reveal-group > * { opacity:1!important; transform:none!important; transition:none; } }

/* ── HERO ── */
.dsc-hero { position: relative; min-height: 100dvh; overflow: hidden; }
.dsc-hero-bg { position: absolute; inset: 0; background-image: url(/assets/car-2.jpg); background-size: cover; background-position: center 55%; }
.dsc-hero-veil-1 { position: absolute; inset: 0; background: linear-gradient(to right, rgba(15,26,23,0.92) 0%, rgba(15,26,23,0.62) 52%, rgba(15,26,23,0.22) 100%); }
.dsc-hero-veil-2 { position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(15,26,23,0.35) 0%, transparent 30%, transparent 60%, rgba(15,26,23,0.90) 100%); }
.dsc-hero-svg { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }

.dsc-nav { position: relative; z-index: 10; display: flex; align-items: center; justify-content: space-between; padding: 22px 32px 0; max-width: 1200px; margin: 0 auto; }
.dsc-logo { display: flex; align-items: center; gap: 10px; }
.dsc-logo-tile { width: 34px; height: 34px; border-radius: 10px; background: #31BCAB; display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 800; font-family: 'Sora', sans-serif; color: #fff; letter-spacing: -0.5px; }
.dsc-logo-word { font-family: 'Sora', sans-serif; font-weight: 700; font-size: 16px; letter-spacing: -0.3px; }
.dsc-logo-word span { color: #31BCAB; }
.dsc-pillnav { display: flex; align-items: center; gap: 1px; background: rgba(255,255,255,0.08); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border: 1px solid rgba(255,255,255,0.12); border-radius: 50px; padding: 5px; }
.dsc-pillnav span { padding: 6px 15px; border-radius: 50px; font-size: 12.5px; font-weight: 500; color: rgba(255,255,255,0.75); cursor: pointer; }
.dsc-nav-cta { display: flex; gap: 8px; }
.dsc-btn-ghost { padding: 8px 18px; border-radius: 50px; font-size: 13px; font-weight: 600; color: #fff; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.16); backdrop-filter: blur(8px); }
.dsc-btn-teal { padding: 8px 20px; border-radius: 50px; font-size: 13px; font-weight: 700; color: #fff; background: #31BCAB; box-shadow: 0 6px 22px rgba(49,188,171,0.35); }

.dsc-hero-grid { position: relative; z-index: 3; display: grid; grid-template-columns: 1fr auto; align-items: center; min-height: calc(100dvh - 84px); padding: 0 32px 40px; max-width: 1200px; margin: 0 auto; gap: 32px; }
.dsc-hero-copy { max-width: 560px; }
.dsc-badge { display: inline-flex; align-items: center; gap: 8px; background: rgba(49,188,171,0.14); border: 1px solid rgba(49,188,171,0.28); border-radius: 50px; padding: 5px 14px; margin-bottom: 24px; }
.dsc-badge-dot { width: 6px; height: 6px; border-radius: 50%; background: #31BCAB; flex-shrink: 0; }
.dsc-badge-text { font-size: 11px; font-weight: 600; color: #31BCAB; letter-spacing: 0.10em; text-transform: uppercase; }
.dsc-h1 { font-family: 'Sora', sans-serif; font-weight: 700; line-height: 1.06; letter-spacing: -2px; margin-bottom: 22px; font-size: clamp(40px,5.5vw,72px); color: #fff; }
.dsc-h1-light { font-weight: 400; }
.dsc-lead { font-size: clamp(14px,1.6vw,17px); color: rgba(255,255,255,0.56); line-height: 1.72; max-width: 440px; margin-bottom: 36px; }
.dsc-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.dsc-btn-primary { display: flex; align-items: center; gap: 10px; background: #31BCAB; color: #fff; border-radius: 50px; padding: 14px 28px; font-size: 15px; font-weight: 700; font-family: 'Sora', sans-serif; box-shadow: 0 10px 32px rgba(49,188,171,0.38); letter-spacing: -0.2px; }
.dsc-btn-outline { display: flex; align-items: center; gap: 8px; background: rgba(255,255,255,0.08); backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,0.16); color: #fff; border-radius: 50px; padding: 14px 28px; font-size: 15px; font-weight: 600; }
.dsc-trust { margin-top: 32px; display: flex; align-items: center; gap: 14px; }
.dsc-avatars { display: flex; }
.dsc-av { width: 28px; height: 28px; border-radius: 50%; border: 2px solid rgba(15,26,23,0.85); display: flex; align-items: center; justify-content: center; font-size: 10.5px; font-weight: 800; color: #fff; }
.dsc-av + .dsc-av { margin-left: -7px; }
.dsc-av-1 { background: #31BCAB; } .dsc-av-2 { background: #F9C86F; } .dsc-av-3 { background: #6587A5; } .dsc-av-4 { background: #F3849B; }
.dsc-trust-name { font-size: 13px; font-weight: 600; }
.dsc-trust-sub { font-size: 11px; color: rgba(255,255,255,0.38); margin-top: 1px; }

.dsc-stat-cards { display: none; position: relative; width: 260px; height: 380px; flex-shrink: 0; }
@media (min-width: 1024px) { .dsc-stat-cards { display: block; } }
.dsc-glass { background: rgba(255,255,255,0.07); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border: 1px solid rgba(255,255,255,0.12); border-radius: 22px; box-shadow: 0 8px 32px rgba(0,0,0,0.40); position: absolute; }
.dsc-card-pay { top: 0; right: 0; padding: 18px; width: 220px; }
.dsc-pay-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.dsc-pay-head span:first-child { font-size: 11px; color: rgba(255,255,255,0.55); }
.dsc-pay-allin { font-size: 11px; font-weight: 700; color: #31BCAB; }
.dsc-pay-num { font-family: 'Sora', sans-serif; font-size: 28px; font-weight: 700; color: #fff; letter-spacing: -1px; line-height: 1; }
.dsc-pay-num span { font-size: 14px; font-weight: 400; color: rgba(255,255,255,0.38); }
.dsc-pay-sub { font-size: 10.5px; color: rgba(255,255,255,0.38); margin-top: 7px; }
.dsc-card-batt { top: 158px; right: 174px; padding: 18px; width: 172px; }
.dsc-batt-lbl { font-size: 11px; color: rgba(255,255,255,0.55); margin-bottom: 12px; text-align: center; }
.dsc-batt-gauge { position: relative; width: 64px; height: 64px; margin: 0 auto; }
.dsc-batt-gauge svg { transform: rotate(-90deg); }
.dsc-batt-pct { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-family: 'Sora', sans-serif; font-size: 14px; font-weight: 700; color: #31BCAB; }
.dsc-batt-sub { font-size: 10px; color: rgba(255,255,255,0.38); text-align: center; margin-top: 8px; }
.dsc-card-aviloo { top: 294px; right: 0; padding: 13px 16px; width: 210px; }
.dsc-aviloo-row { display: flex; align-items: center; gap: 10px; }
.dsc-aviloo-ico { width: 34px; height: 34px; border-radius: 10px; background: #F9C86F; display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: #1A1A1A; }
.dsc-aviloo-title { font-size: 12.5px; font-weight: 600; }
.dsc-aviloo-sub { font-size: 10.5px; color: rgba(255,255,255,0.42); margin-top: 1px; }

/* ── generic section ── */
.dsc-sec { padding: clamp(56px,8vw,100px) clamp(24px,6vw,80px); }
.dsc-sec-white { background: #fff; color: #111; }
.dsc-sec-stone { background: #F5F5F0; padding: clamp(48px,8vw,80px) clamp(24px,6vw,80px); }
.dsc-sec-dark { background: #1A1A1A; padding: clamp(56px,8vw,80px) clamp(24px,6vw,80px); }
.dsc-wrap { max-width: 1200px; margin: 0 auto; }
.dsc-center { text-align: center; }
.dsc-eyebrow { font-size: 11px; font-weight: 600; color: rgba(0,0,0,0.42); letter-spacing: 0.10em; text-transform: uppercase; }
.dsc-eyebrow-dim { color: rgba(0,0,0,0.38); }
.dsc-hiw-head { text-align: right; padding-right: 6%; }
.dsc-eyebrow-hiw { font-size: 18px; color: rgba(0,0,0,0.85); letter-spacing: 0.14em; }
.mb-56 { margin-bottom: 56px; } .mb-40 { margin-bottom: 40px; }

/* how it works */
.dsc-2col { display: grid; grid-template-columns: repeat(auto-fit,minmax(300px,1fr)); gap: 60px; align-items: center; }
.dsc-portrait { border-radius: 32px; overflow: hidden; aspect-ratio: 4/5; max-width: 400px; margin: 0 auto; box-shadow: 0 24px 64px rgba(0,0,0,0.12); }
.dsc-portrait img { width: 100%; height: 100%; object-fit: cover; object-position: center 60%; }
.dsc-h2 { font-family: 'Sora', sans-serif; font-weight: 700; font-size: clamp(26px,3.2vw,40px); line-height: 1.14; letter-spacing: -1px; color: #111; margin-bottom: 18px; }
.dsc-h2 span { color: #31BCAB; }
.dsc-body { font-size: 14px; color: rgba(0,0,0,0.48); line-height: 1.75; max-width: 480px; margin-bottom: 40px; }
.dsc-feat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.dsc-feat { display: flex; flex-direction: column; gap: 10px; }
.dsc-feat-ico { width: 42px; height: 42px; border-radius: 50%; background: rgba(49,188,171,0.10); display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: #31BCAB; }
.dsc-feat-title { font-family: 'Sora', sans-serif; font-weight: 600; font-size: 14px; color: #111; }
.dsc-feat-desc { font-size: 12.5px; color: rgba(0,0,0,0.46); line-height: 1.65; }

/* stats */
.dsc-stats-head-h2 { font-family: 'Sora', sans-serif; font-weight: 700; font-size: clamp(20px,2.5vw,30px); color: #111; margin-top: 8px; max-width: 380px; line-height: 1.25; }
.dsc-stats-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(200px,1fr)); gap: 18px; }
.dsc-stat-card { background: #fff; border-radius: 28px; padding: 22px 20px; }
.dsc-stat-top { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 16px; }
.dsc-stat-photo { width: 58px; height: 58px; border-radius: 50%; overflow: hidden; border: 2.5px solid rgba(49,188,171,0.25); flex-shrink: 0; }
.dsc-stat-photo img { width: 100%; height: 100%; object-fit: cover; }
.dsc-stat-n { font-size: 11px; font-weight: 600; color: rgba(0,0,0,0.20); letter-spacing: 0.04em; }
.dsc-stat-label { font-family: 'Sora', sans-serif; font-size: 13px; font-weight: 600; color: #111; margin-bottom: 6px; }
.dsc-stat-desc { font-size: 11.5px; color: rgba(0,0,0,0.43); line-height: 1.58; margin-bottom: 10px; }
.dsc-stat-val { font-family: 'Sora', sans-serif; font-size: 28px; font-weight: 700; color: #111; letter-spacing: -0.5px; line-height: 1; }

/* models */
.dsc-models-h2 { font-family: 'Sora', sans-serif; font-weight: 700; font-size: clamp(22px,3vw,36px); color: #fff; letter-spacing: -0.5px; margin-bottom: 14px; line-height: 1.2; }
.dsc-models-h2 span { font-weight: 400; }
.dsc-models-sub { font-size: 13.5px; color: rgba(255,255,255,0.48); max-width: 440px; margin: 0 auto 22px; }
.dsc-btn-teal-inline { background: #31BCAB; color: #fff; border-radius: 50px; padding: 12px 26px; font-size: 13.5px; font-weight: 700; font-family: 'Sora', sans-serif; display: inline-flex; align-items: center; gap: 8px; box-shadow: 0 8px 24px rgba(49,188,171,0.32); }
.dsc-models-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(175px,1fr)); gap: 14px; }
.dsc-model-card { position: relative; border-radius: 28px; overflow: hidden; aspect-ratio: 3/4; display: block; transition: transform .5s cubic-bezier(.2,.8,.2,1); }
.dsc-model-card:hover { transform: translateY(-8px); }
.dsc-model-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.2,.8,.2,1); }
.dsc-model-card:hover img { transform: scale(1.10); }
.dsc-model-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.92) 0%, rgba(0,0,0,0.38) 45%, transparent 100%); }
.dsc-model-n { position: absolute; top: 14px; left: 16px; font-size: 12px; font-weight: 600; color: rgba(255,255,255,0.48); letter-spacing: 0.06em; }
.dsc-model-info { position: absolute; bottom: 0; left: 0; right: 0; padding: 0 16px 18px; }
.dsc-model-make { font-size: 10px; font-weight: 700; letter-spacing: 0.10em; text-transform: uppercase; color: rgba(255,255,255,0.48); margin-bottom: 4px; }
.dsc-model-name { font-family: 'Sora', sans-serif; font-size: 16px; font-weight: 700; color: #fff; letter-spacing: -0.3px; line-height: 1.1; }

/* included */
.dsc-2col-56 { display: grid; grid-template-columns: repeat(auto-fit,minmax(300px,1fr)); gap: 56px; align-items: center; }
.dsc-img-43 { border-radius: 28px; overflow: hidden; aspect-ratio: 4/3; box-shadow: 0 24px 64px rgba(0,0,0,0.10); }
.dsc-img-43 img { width: 100%; height: 100%; object-fit: cover; object-position: center 55%; }
.dsc-inc-h2 { font-family: 'Sora', sans-serif; font-weight: 700; font-size: clamp(24px,3vw,36px); color: #111; line-height: 1.15; letter-spacing: -0.8px; margin-bottom: 14px; }
.dsc-inc-body { font-size: 14px; color: rgba(0,0,0,0.48); line-height: 1.72; max-width: 440px; margin-bottom: 26px; }
.dsc-feature-rows { display: flex; flex-direction: column; gap: 10px; margin-bottom: 28px; }
.dsc-feature-row { display: flex; align-items: center; gap: 14px; padding: 13px 16px; border-radius: 20px; background: #F8F8F6; cursor: pointer; transition: background .15s; }
.dsc-feature-row:hover { background: #F0F0EA; }
.dsc-feature-row-ico { width: 38px; height: 38px; border-radius: 50%; background: rgba(49,188,171,0.12); display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: #31BCAB; }
.dsc-feature-row-title { flex: 1; font-family: 'Sora', sans-serif; font-weight: 600; font-size: 13.5px; color: #111; }
.dsc-feature-row-chev { color: rgba(0,0,0,0.22); flex-shrink: 0; }
.dsc-inc-foot { display: flex; align-items: center; gap: 16px; }
.dsc-inc-thumb { flex: 1; border-radius: 20px; overflow: hidden; aspect-ratio: 16/9; max-width: 200px; }
.dsc-inc-thumb img { width: 100%; height: 100%; object-fit: cover; }
.dsc-btn-teal-cta { display: flex; align-items: center; gap: 8px; background: #31BCAB; color: #fff; border-radius: 50px; padding: 13px 22px; font-size: 14px; font-weight: 700; font-family: 'Sora', sans-serif; white-space: nowrap; box-shadow: 0 8px 24px rgba(49,188,171,0.28); }

/* CTA + footer */
.dsc-cta { background: #0D1A18; position: relative; overflow: hidden; padding: clamp(56px,10vw,100px) clamp(24px,6vw,80px); }
.dsc-cta-glow { position: absolute; top: -140px; right: -140px; width: 520px; height: 520px; border-radius: 50%; background: radial-gradient(circle, rgba(49,188,171,0.16) 0%, transparent 70%); pointer-events: none; }
.dsc-cta-inner { position: relative; z-index: 1; max-width: 600px; margin: 0 auto; text-align: center; }
.dsc-cta-eyebrow { font-size: 18px; font-weight: 600; color: #31BCAB; letter-spacing: 0.14em; text-transform: uppercase; display: block; margin-bottom: 18px; }
.dsc-cta-h2 { font-family: 'Sora', sans-serif; font-weight: 700; font-size: clamp(28px,5vw,54px); letter-spacing: -1.5px; line-height: 1.08; margin-bottom: 18px; color: #fff; }
.dsc-cta-body { font-size: clamp(13px,1.6vw,16px); color: rgba(255,255,255,0.46); line-height: 1.72; max-width: 420px; margin: 0 auto 36px; }
.dsc-cta-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: center; }
.dsc-btn-primary-lg { display: flex; align-items: center; gap: 10px; background: #31BCAB; color: #fff; border-radius: 50px; padding: 15px 32px; font-size: 15px; font-weight: 700; font-family: 'Sora', sans-serif; box-shadow: 0 12px 36px rgba(49,188,171,0.38); letter-spacing: -0.2px; }
.dsc-cta-signin { font-size: 14px; font-weight: 600; color: rgba(255,255,255,0.40); display: flex; align-items: center; gap: 6px; }
.dsc-footer { background: #0D1A18; border-top: 1px solid rgba(255,255,255,0.06); padding: 16px clamp(24px,6vw,80px); display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; }
.dsc-footer-copy { font-size: 12px; color: rgba(255,255,255,0.28); font-weight: 500; }
.dsc-footer-links { display: flex; gap: 20px; }
.dsc-footer-links span { font-size: 12px; color: rgba(255,255,255,0.34); font-weight: 600; cursor: pointer; }
@media (max-width: 600px) { .dsc-sec, .dsc-sec-stone, .dsc-sec-dark, .dsc-cta { padding-left: 18px; padding-right: 18px; } }

/* ══════════════════════════════════════════════════════════════════════
   WOW effects (landing page only) — each recreated from a reference site.
   Cursor+grain: asolfilm.no · aurora+parallax: vision.avatr.com
   word reveal+card reveal: maserati MC20 · marquee: couroazul.com + antoni.de
   magnetic buttons: antoni.de · 3D tilt + stat count-up: massimomotor.com
   ══════════════════════════════════════════════════════════════════════ */

/* — Custom cursor (asolfilm.no / antoni.de) — */
.dsc-cursor, .dsc-cursor-dot { position: fixed; top: 0; left: 0; z-index: 10000; pointer-events: none; border-radius: 50%; mix-blend-mode: difference; will-change: transform; }
.dsc-cursor { width: 40px; height: 40px; border: 1.5px solid #fff; margin: -20px 0 0 -20px; transition: width .28s cubic-bezier(.2,.8,.2,1), height .28s cubic-bezier(.2,.8,.2,1), background .28s; }
.dsc-cursor-dot { width: 6px; height: 6px; margin: -3px 0 0 -3px; background: #fff; }
.dsc-cursor.grow { width: 76px; height: 76px; background: rgba(255,255,255,.14); border-color: transparent; }
body.dsc-cursor-on { cursor: none; }
body.dsc-cursor-on a, body.dsc-cursor-on span[onclick], body.dsc-cursor-on [data-magnetic] { cursor: none; }
@media (hover: none), (pointer: coarse) { .dsc-cursor, .dsc-cursor-dot { display: none; } body.dsc-cursor-on { cursor: auto; } }

/* — Film grain + vignette (asolfilm.no) — */
.dsc-grain { position: fixed; inset: -50%; z-index: 9998; pointer-events: none; opacity: .045; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation: dsc-grain .7s steps(3) infinite; }
@keyframes dsc-grain { 0%{transform:translate(0,0)} 33%{transform:translate(-4%,3%)} 66%{transform:translate(3%,-2%)} 100%{transform:translate(0,0)} }

/* — Hero ambient aurora (vision.avatr.com) — */
.dsc-hero { position: relative; overflow: hidden; }
.dsc-aurora { position: absolute; inset: -25%; z-index: 0; pointer-events: none; filter: blur(70px); opacity: .55; will-change: transform;
  background: radial-gradient(38% 42% at 22% 32%, rgba(49,188,171,.45), transparent 68%),
              radial-gradient(34% 38% at 82% 58%, rgba(72,130,255,.28), transparent 70%),
              radial-gradient(30% 30% at 60% 15%, rgba(127,230,218,.30), transparent 72%);
  animation: dsc-aurora 20s ease-in-out infinite alternate; }
@keyframes dsc-aurora { to { transform: translate3d(5%,-4%,0) scale(1.12) rotate(6deg); } }
.dsc-hero > .dsc-nav, .dsc-hero > .dsc-hero-grid { position: relative; z-index: 3; }

/* — Hero kinetic word reveal (maserati MC20) — */
.dsc-reveal-words .ln { display: block; }
.dsc-reveal-words .w { display: inline-block; overflow: hidden; vertical-align: top; line-height: 1.05; padding-right: .18em; }
.dsc-reveal-words .w > i { display: inline-block; font-style: inherit; transform: translateY(112%); animation: dsc-wordup 1s cubic-bezier(.16,1,.3,1) both; animation-delay: var(--d, 0s); }
@keyframes dsc-wordup { to { transform: translateY(0); } }

/* — Infinite marquee band (couroazul.com / antoni.de) — */
.dsc-marquee { overflow: hidden; background: #0b0b0d; color: #fff; padding: 22px 0; border-top: 1px solid rgba(255,255,255,.08); border-bottom: 1px solid rgba(255,255,255,.08); }
.dsc-marquee-track { display: inline-flex; align-items: center; white-space: nowrap; animation: dsc-marq 30s linear infinite; will-change: transform; }
.dsc-marquee:hover .dsc-marquee-track { animation-play-state: paused; }
.dsc-marq-item { font-family: 'Sora', sans-serif; font-weight: 800; font-size: clamp(26px, 4.6vw, 54px); letter-spacing: -.02em; text-transform: uppercase; padding: 0 34px; display: inline-flex; align-items: center; }
.dsc-marq-item.out { color: transparent; -webkit-text-stroke: 1px rgba(255,255,255,.55); }
.dsc-marq-dot { color: #31BCAB; font-size: 18px; padding: 0 4px; }
@keyframes dsc-marq { to { transform: translateX(-50%); } }

/* — 3D tilt + glare on model cards (massimomotor.com) — */
.dsc-model-card[data-tilt] { transform: perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)); transform-style: preserve-3d; transition: transform .3s cubic-bezier(.2,.8,.2,1); will-change: transform; }
.dsc-model-card[data-tilt]:hover { transform: perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)); } /* beats the base :hover lift so tilt shows */
.dsc-model-card img { transition: transform .6s cubic-bezier(.2,.8,.2,1); }
.dsc-model-glare { position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; transition: opacity .3s; z-index: 4;
  background: radial-gradient(140px 140px at var(--mx,50%) var(--my,50%), rgba(255,255,255,.28), transparent 60%); }
.dsc-model-card:hover .dsc-model-glare { opacity: 1; }

/* — Magnetic buttons (antoni.de) — */
[data-magnetic] { transition: transform .3s cubic-bezier(.2,.8,.2,1); will-change: transform; }

/* — Respect reduced motion: freeze the flourishes, keep everything readable — */
@media (prefers-reduced-motion: reduce) {
  .dsc-grain, .dsc-aurora, .dsc-marquee-track { animation: none; }
  .dsc-reveal-words .w > i { transform: none; animation: none; }
  .dsc-cursor, .dsc-cursor-dot { display: none; }
  body.dsc-cursor-on { cursor: auto; }
}

/* ══ Cinematic hero: pinned video → image reveal (couroazul.com) ══ */
.dsc-hero.dsc-cine { min-height: 0; height: 230vh; overflow: visible; }
.dsc-hero-pin { position: sticky; top: 0; height: 100dvh; overflow: hidden; }
.dsc-hero-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; will-change: transform; }
.dsc-cine .dsc-hero-veil-1, .dsc-cine .dsc-hero-veil-2 { z-index: 1; }
.dsc-hero-dark { position: absolute; inset: 0; z-index: 1; background: #0a1512; opacity: 0; }
.dsc-cine .dsc-aurora { z-index: 1; }
.dsc-cine .dsc-hero-svg { z-index: 2; }
.dsc-hero-pin > .dsc-hero-grid { position: relative; z-index: 5; }
/* Nav must sit ABOVE .dsc-hero-lead (z-index 5, covers the whole hero) or the
   overlay swallows the menu's clicks. */
.dsc-hero-pin > .dsc-nav { position: relative; z-index: 8; }
.dsc-hero-pin > .dsc-hero-grid { will-change: transform, opacity; }
.dsc-scroll-hint { position: absolute; left: 50%; bottom: 26px; transform: translateX(-50%); z-index: 6; display: flex; flex-direction: column; align-items: center; gap: 8px; color: rgba(255,255,255,.72); font-size: 11px; letter-spacing: .22em; text-transform: uppercase; pointer-events: none; }
.dsc-scroll-hint i { width: 1px; height: 34px; background: linear-gradient(rgba(255,255,255,.85), transparent); transform-origin: top; animation: dsc-scrollhint 1.6s ease-in-out infinite; }
@keyframes dsc-scrollhint { 0%,100% { opacity: .25; transform: scaleY(.5); } 50% { opacity: 1; transform: scaleY(1); } }
.dsc-hero-reveal { position: absolute; inset: 0; z-index: 6; display: flex; align-items: center; justify-content: center; gap: clamp(10px,1.6vw,22px); opacity: 0; pointer-events: none; padding: 0 24px; }
.dsc-hero-reveal figure { margin: 0; width: clamp(150px, 21vw, 300px); aspect-ratio: 3/4; border-radius: 18px; overflow: hidden; box-shadow: 0 34px 90px rgba(0,0,0,.55); will-change: transform; }
.dsc-hero-reveal figure:nth-child(even) { margin-top: 13vh; }
.dsc-hero-reveal img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ══ Scroll-driven text illumination (maserati.com MC20) ══ */
[data-scroll-text] .st-w { opacity: .16; transition: opacity .12s linear; }

@media (prefers-reduced-motion: reduce) {
  .dsc-hero.dsc-cine { height: 100dvh !important; }
  .dsc-hero-reveal { display: none; }
  .dsc-hero-pin > .dsc-hero-grid { opacity: 1 !important; transform: none !important; }
  .dsc-hero-video { transform: none !important; }
  [data-scroll-text] .st-w { opacity: 1 !important; }
}

/* ══ Hero v2 — car slideshow (left) + copy that slides right on scroll ══ */
.dsc-hero.dsc-cine { height: 200vh; }
.dsc-hero-stage { position: relative; z-index: 5; display: grid; grid-template-columns: minmax(0,1.04fr) minmax(0,1fr); align-items: center; gap: clamp(24px,4vw,64px); min-height: calc(100dvh - 84px); padding: 0 clamp(24px,5vw,64px) 40px; max-width: 1240px; margin: 0 auto; }
.dsc-hero-show { position: relative; will-change: transform; }
.dsc-show-stage { position: relative; width: 100%; aspect-ratio: 5/6; max-height: 76vh; border-radius: 26px; overflow: hidden; box-shadow: 0 40px 110px rgba(0,0,0,.55); border: 1px solid rgba(255,255,255,.10); }
.dsc-slide { position: absolute; inset: 0; margin: 0; opacity: 0; transform: scale(1.09); transition: opacity 1.1s ease, transform 5.2s ease; }
.dsc-slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.dsc-slide.is-active { opacity: 1; transform: scale(1); }
.dsc-show-grad { position: absolute; inset: 0; background: linear-gradient(to top, rgba(8,14,12,.60), transparent 46%); pointer-events: none; }
.dsc-show-price { position: absolute; top: 18px; left: 18px; padding: 14px 16px; width: 202px; }
.dsc-show-pill { position: absolute; bottom: 18px; right: 18px; display: inline-flex; align-items: center; gap: 7px; padding: 8px 13px; border-radius: 50px; font-size: 12px; font-weight: 600; color: #fff; }
.dsc-show-pill svg { color: #F9C86F; }
.dsc-show-dots { position: absolute; bottom: 20px; left: 18px; display: flex; gap: 7px; }
.dsc-show-dots i { width: 7px; height: 7px; border-radius: 50%; background: rgba(255,255,255,.4); transition: width .45s ease, background .45s ease, border-radius .45s ease; }
.dsc-show-dots i.is-active { width: 22px; border-radius: 4px; background: #31BCAB; }
.dsc-hero-copy { will-change: transform, opacity; }
@media (max-width: 900px) { .dsc-hero.dsc-cine { height: 100dvh; } .dsc-hero-stage { grid-template-columns: 1fr; } .dsc-hero-show { display: none; } }
@media (prefers-reduced-motion: reduce) { .dsc-hero-copy { transform: none !important; opacity: 1 !important; } .dsc-slide { transition: none; } }

/* ══ Section transitions — stacked rounded panels that slide up into the stack on scroll ══ */
#how-it-works, #videos, .dsc-sec-stone, #included, .dsc-cta {
  position: relative;
  border-top-left-radius: 44px;
  border-top-right-radius: 44px;
  margin-top: -44px;
  opacity: 1;
  transform: translateY(90px);
  transition: transform .9s cubic-bezier(.22,.61,.36,1), box-shadow .9s ease;
  will-change: transform;
}
/* sequential stacking by document order */
#how-it-works { z-index: 2; }
#about { z-index: 3; }
#reviews { z-index: 5; }
#videos { z-index: 6; }
#included { z-index: 7; }
#faq { z-index: 8; }
.dsc-cta { z-index: 9; }
/* settle into place — the panel slides up and its lift shadow deepens */
#how-it-works.is-visible, #videos.is-visible, .dsc-sec-stone.is-visible, #included.is-visible, .dsc-cta.is-visible { transform: translateY(0); }
#how-it-works.is-visible, #included.is-visible { box-shadow: 0 -26px 50px rgba(0,0,0,.20); }
#videos.is-visible, .dsc-cta.is-visible { box-shadow: 0 -26px 50px rgba(0,0,0,.30); }
.dsc-sec-stone.is-visible                      { box-shadow: 0 -18px 36px rgba(0,0,0,.07); }
/* room under the logo slideshow so the first panel overlaps its padding, not the logos */
.dsc-marquee { padding-bottom: 66px; }
@media (prefers-reduced-motion: reduce) {
  #how-it-works, #videos, .dsc-sec-stone, #included, .dsc-cta { transform: none; transition: none; }
}

/* ══ Hero v3 — video + copy together; scroll reveals the real-car slideshow ══ */
.dsc-hero-video { z-index: 0; }
.dsc-hero-lead { position: absolute; inset: 0; z-index: 5; display: flex; align-items: center; padding: 88px clamp(24px,5vw,64px) 60px; }
.dsc-hero-lead-inner { width: 100%; max-width: 1240px; margin: 0 auto; }
.dsc-hero-copy { max-width: 480px; will-change: transform, opacity; }

.dsc-hero-show { position: absolute; inset: 0; z-index: 6; display: flex; align-items: center; padding: 88px clamp(24px,5vw,64px) 60px; opacity: 0; pointer-events: none; will-change: opacity; }
.dsc-hero-show-inner { width: 100%; max-width: 1240px; margin: 0 auto; display: flex; justify-content: flex-start; }
.dsc-show-stage { position: relative; width: min(600px, 100%); aspect-ratio: 4 / 3; max-height: none; border-radius: 24px; overflow: hidden; background: radial-gradient(120% 120% at 50% 28%, #1d2c29 0%, #0b1513 72%); border: 1px solid rgba(255,255,255,.10); box-shadow: 0 44px 110px rgba(0,0,0,.6); will-change: transform; }
.dsc-show-spot { position: absolute; inset: 0; background: radial-gradient(58% 52% at 50% 42%, rgba(49,188,171,.20), transparent 70%); pointer-events: none; }
.dsc-slide { position: absolute; inset: 0; margin: 0; display: flex; align-items: center; justify-content: center; opacity: 0; transform: scale(1.06); transition: opacity 1s ease, transform 5s ease; }
.dsc-slide img { width: 90%; height: 76%; object-fit: contain; filter: drop-shadow(0 26px 34px rgba(0,0,0,.5)); }
.dsc-slide.is-active { opacity: 1; transform: scale(1); }
.dsc-slide figcaption { position: absolute; left: 20px; bottom: 18px; font-family: 'Sora', sans-serif; font-weight: 600; font-size: 15px; color: #fff; letter-spacing: -.2px; text-shadow: 0 2px 12px rgba(0,0,0,.6); }
.dsc-show-pill { top: 16px; left: 16px; right: auto; bottom: auto; }
.dsc-show-dots { left: auto; right: 18px; bottom: 18px; }
@media (max-width: 900px) { .dsc-hero-show { display: none; } .dsc-hero-copy { max-width: none; } }
@media (prefers-reduced-motion: reduce) { .dsc-hero-video { transform: none !important; } }

/* ══ Hero — stat boxes on the right at rest (fade out on scroll) ══ */
.dsc-hero-cards { position: absolute; inset: 0; z-index: 4; display: flex; align-items: center; padding: 88px clamp(24px,5vw,64px) 60px; pointer-events: none; will-change: opacity, transform; }
.dsc-hero-cards-in { width: 100%; max-width: 1240px; margin: 0 auto; display: flex; justify-content: flex-end; }

/* ══ Slideshow boxes — nicer framing ══ */
.dsc-show-stage { background: radial-gradient(130% 120% at 50% 22%, #21332f 0%, #0b1513 68%); box-shadow: 0 44px 120px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.06); }
.dsc-slide img { width: 88%; height: 68%; object-fit: contain; margin-bottom: 7%; filter: drop-shadow(0 30px 30px rgba(0,0,0,.55)); }
.dsc-slide-floor { position: absolute; left: 50%; bottom: 15%; width: 54%; height: 26px; transform: translateX(-50%); background: radial-gradient(closest-side, rgba(0,0,0,.6), transparent); filter: blur(3px); pointer-events: none; }
.dsc-slide .dsc-slide-info { position: absolute; left: 16px; bottom: 16px; display: flex; flex-direction: column; gap: 2px; padding: 10px 14px; border-radius: 14px; background: rgba(9,16,14,.5); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border: 1px solid rgba(255,255,255,.12); text-shadow: none; }
.dsc-slide-name { font-family: 'Sora', sans-serif; font-weight: 700; font-size: 15px; color: #fff; letter-spacing: -.2px; }
.dsc-slide-meta { font-size: 11.5px; color: rgba(255,255,255,.72); }

/* ══ Brands strip (dark) ══ */
.dsc-brands-h2 { font-family: 'Sora', sans-serif; font-weight: 700; letter-spacing: -1.5px; font-size: clamp(28px,4vw,46px); line-height: 1.08; color: #fff; margin: 12px 0 14px; }
.dsc-brands-sub { color: rgba(255,255,255,.5); font-size: clamp(14px,1.6vw,16px); max-width: 560px; margin: 0 auto; line-height: 1.65; }
.dsc-brands-grid { display: grid; grid-template-columns: repeat(6,1fr); gap: 1px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.08); border-radius: 18px; overflow: hidden; margin-top: 40px; }
@media (max-width: 820px) { .dsc-brands-grid { grid-template-columns: repeat(3,1fr); } }
.dsc-brand { background: #1A1A1A; display: flex; align-items: center; justify-content: center; padding: 26px 12px; font-family: 'Sora', sans-serif; font-weight: 700; font-size: 15px; letter-spacing: .4px; color: rgba(255,255,255,.5); transition: color .3s, background .3s; }
.dsc-brand:hover { color: #31BCAB; background: #171717; }

/* ══ Testimonials (stone) ══ */
.dsc-reviews-h2 { font-family: 'Sora', sans-serif; font-weight: 700; letter-spacing: -1.2px; font-size: clamp(26px,3.4vw,42px); line-height: 1.1; color: #111; margin-top: 10px; max-width: 640px; }
.dsc-reviews-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
@media (max-width: 820px) { .dsc-reviews-grid { grid-template-columns: 1fr; } }
.dsc-review { background: #fff; border: 1px solid #eceae4; border-radius: 20px; padding: 26px; margin: 0; display: flex; flex-direction: column; gap: 16px; box-shadow: 0 12px 32px rgba(0,0,0,.05); }
.dsc-review-stars { color: #F9C86F; font-size: 15px; letter-spacing: 3px; }
.dsc-review-quote { font-size: 15px; line-height: 1.65; color: #333; margin: 0; }
.dsc-review-by { display: flex; align-items: center; gap: 12px; margin-top: auto; }
.dsc-review-av { width: 40px; height: 40px; border-radius: 50%; background: #31BCAB; color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 800; font-family: 'Sora', sans-serif; flex-shrink: 0; }
.dsc-review-name { font-weight: 700; font-size: 14px; color: #111; }
.dsc-review-role { font-size: 12px; color: #888; }

/* ══ FAQ (stone) — native <details> accordion ══ */
.dsc-faq-h2 { font-family: 'Sora', sans-serif; font-weight: 700; letter-spacing: -1.2px; font-size: clamp(26px,3.4vw,42px); line-height: 1.1; color: #111; margin-top: 10px; }
.dsc-faq { max-width: 820px; margin: 36px auto 0; }
.dsc-faq details { border-bottom: 1px solid #e2e0d8; }
.dsc-faq summary { list-style: none; cursor: pointer; padding: 20px 2px; font-family: 'Sora', sans-serif; font-weight: 600; font-size: clamp(15px,2vw,18px); color: #111; display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.dsc-faq summary::-webkit-details-marker { display: none; }
.dsc-faq summary::after { content: '+'; font-size: 24px; font-weight: 400; color: #31BCAB; line-height: 1; flex-shrink: 0; transition: transform .3s ease; }
.dsc-faq details[open] summary::after { content: '\2212'; }
.dsc-faq-a { padding: 0 2px 22px; color: #555; font-size: 15px; line-height: 1.7; max-width: 70ch; }

/* ══ Brand-logo slideshow chips (below hero) ══ */
.dsc-logos { padding-top: 30px; }
.dsc-logo-chip { display: inline-flex; align-items: center; justify-content: center; height: 72px; padding: 0 28px; margin: 0 9px; border-radius: 14px; background: #fff; box-shadow: 0 8px 24px rgba(0,0,0,.28); vertical-align: middle; transition: transform .3s ease; }
.dsc-logo-chip:hover { transform: translateY(-3px); }
.dsc-logo-chip img { height: 40px; width: auto; max-width: 150px; object-fit: contain; display: block; }        /* monochrome-white; remove filter for full-colour logos */
.dsc-logo-chip img + .dsc-logo-word2 { display: none; }                                                                 /* real logo present → hide the wordmark fallback */
.dsc-logo-word2 { font-family: 'Sora', sans-serif; font-weight: 700; font-size: 16px; letter-spacing: .6px; color: rgba(255,255,255,.72); }

/* ══ YouTube videos ══ */
.dsc-videos-h2 { font-family: 'Sora', sans-serif; font-weight: 700; letter-spacing: -1.2px; font-size: clamp(26px,3.6vw,44px); line-height: 1.1; color: #fff; margin: 10px 0 12px; }
.dsc-videos-sub { color: rgba(255,255,255,.5); font-size: clamp(14px,1.6vw,16px); max-width: 520px; margin: 0 auto; line-height: 1.6; }
.dsc-videos-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; text-align: left; }
.dsc-videos-head .dsc-videos-sub { margin-left: 0; margin-right: 0; max-width: 460px; }
.dsc-videos-nav { display: flex; gap: 10px; flex-shrink: 0; }
.dsc-vnav { width: 46px; height: 46px; border-radius: 50%; border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.06); color: #fff; font-size: 24px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background .25s, border-color .25s, transform .2s; }
.dsc-vnav:hover { background: #31BCAB; border-color: #31BCAB; transform: translateY(-2px); }
.dsc-videos-viewport { position: relative; margin-top: 30px; -webkit-mask-image: linear-gradient(90deg, transparent, #000 2.5%, #000 97.5%, transparent); mask-image: linear-gradient(90deg, transparent, #000 2.5%, #000 97.5%, transparent); }
.dsc-videos-track { display: flex; gap: 18px; overflow: hidden; padding: 6px 2px 16px; scrollbar-width: none; }
.dsc-videos-track::-webkit-scrollbar { display: none; }
.dsc-videos-track .dsc-video { flex: 0 0 calc((100% - 36px) / 3); }   /* 3 in view (2 gaps × 18px) */
@media (max-width: 900px) { .dsc-videos-track .dsc-video { flex-basis: calc((100% - 18px) / 2); } }
@media (max-width: 600px) { .dsc-videos-track .dsc-video { flex-basis: 86%; } }
.dsc-video-badge { position: absolute; top: 12px; left: 12px; z-index: 2; font-family: 'Sora', sans-serif; font-weight: 700; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: #fff; background: rgba(230,33,23,.92); padding: 4px 8px; border-radius: 6px; }
@media (max-width: 700px) { .dsc-videos-head { flex-direction: column; align-items: flex-start; } }
.dsc-video { position: relative; display: block; aspect-ratio: 16/9; border-radius: 16px; overflow: hidden; border: 1px solid rgba(255,255,255,.1); background: radial-gradient(120% 120% at 50% 0%, #26312e, #0e1614); }
.dsc-video img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .72; transition: opacity .4s, transform .6s; }
.dsc-video:hover img { opacity: .92; transform: scale(1.05); }
.dsc-video-play { position: absolute; top: 50%; left: 50%; width: 58px; height: 58px; transform: translate(-50%,-50%); border-radius: 50%; background: #31BCAB; box-shadow: 0 10px 30px rgba(49,188,171,.45); transition: transform .3s; }
.dsc-video-play::after { content: ''; position: absolute; top: 50%; left: 54%; transform: translate(-50%,-50%); border-style: solid; border-width: 9px 0 9px 15px; border-color: transparent transparent transparent #fff; }
.dsc-video:hover .dsc-video-play { transform: translate(-50%,-50%) scale(1.12); }
.dsc-video-title { position: absolute; left: 0; right: 0; bottom: 0; padding: 30px 16px 14px; font-family: 'Sora', sans-serif; font-weight: 600; font-size: 13.5px; line-height: 1.3; color: #fff; background: linear-gradient(to top, rgba(6,10,9,.94), transparent); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* ══ Cinematic flagship story (+ hear-the-electric) ══ */
.dsc-story { position: relative; background: radial-gradient(120% 90% at 18% 8%, #14201d, #0b1210); color: #fff; padding: clamp(70px,10vw,120px) clamp(24px,6vw,80px); overflow: hidden; }
.dsc-story-aurora { position: absolute; inset: 0; background: radial-gradient(50% 55% at 78% 42%, rgba(49,188,171,.18), transparent 70%); pointer-events: none; }
.dsc-story-grid { position: relative; display: grid; grid-template-columns: 1.1fr 1fr; align-items: center; gap: clamp(24px,5vw,64px); }
@media (max-width: 860px) { .dsc-story-grid { grid-template-columns: 1fr; } }
.dsc-story-visual { position: relative; }
.dsc-story-glow { position: absolute; inset: 8% 10%; background: radial-gradient(closest-side, rgba(49,188,171,.30), transparent 72%); filter: blur(24px); }
.dsc-story-car { position: relative; width: 100%; height: auto; object-fit: contain; filter: drop-shadow(0 40px 50px rgba(0,0,0,.55)); animation: dsc-float 7s ease-in-out infinite; }
@keyframes dsc-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-14px); } }
.dsc-story-h2 { font-family: 'Sora', sans-serif; font-weight: 700; font-size: clamp(30px,4.4vw,54px); line-height: 1.08; letter-spacing: -1.5px; margin: 10px 0 14px; }
.dsc-story-hero-line { font-size: clamp(15px,2vw,19px); color: rgba(255,255,255,.6); margin-bottom: 26px; }
.dsc-story-hero-line b { color: #31BCAB; font-weight: 700; }
.dsc-story-specs { display: grid; grid-template-columns: repeat(4, auto); gap: clamp(18px,3vw,42px); margin-bottom: 30px; justify-content: start; }
@media (max-width: 520px) { .dsc-story-specs { grid-template-columns: repeat(2, auto); } }
.dsc-spec-n { display: block; font-family: 'Sora', sans-serif; font-weight: 800; font-size: clamp(26px,3.2vw,40px); color: #fff; line-height: 1; }
.dsc-spec-l { font-size: 12px; color: rgba(255,255,255,.5); }
.dsc-story-actions { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
.dsc-sound-btn { display: inline-flex; align-items: center; gap: 11px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.18); color: #fff; border-radius: 50px; padding: 12px 22px; font-family: 'Sora', sans-serif; font-weight: 600; font-size: 14px; cursor: pointer; transition: background .25s, border-color .25s; }
.dsc-sound-btn:hover { background: rgba(49,188,171,.18); border-color: #31BCAB; }
.dsc-sound-ico { width: 0; height: 0; border-style: solid; border-width: 6px 0 6px 10px; border-color: transparent transparent transparent #31BCAB; }
.dsc-sound-btn.playing { background: #31BCAB; border-color: #31BCAB; }
.dsc-sound-btn.playing .dsc-sound-ico { border-color: transparent transparent transparent #fff; animation: dsc-soundpulse .5s ease-in-out infinite; }
@keyframes dsc-soundpulse { 0%,100% { transform: scale(1); } 50% { transform: scale(1.5); } }

/* ══ Fleet filmstrip — pinned horizontal scroll ══ */
.dsc-strip { position: relative; height: 340vh; background: #0c1512; }
.dsc-strip-pin { position: sticky; top: 0; height: 100dvh; overflow: hidden; display: flex; align-items: center; }
.dsc-strip-track { display: flex; align-items: center; gap: clamp(16px,2vw,28px); padding: 0 6vw; will-change: transform; }
.dsc-strip-intro { flex: 0 0 auto; width: 34vw; min-width: 240px; color: #fff; }
.dsc-strip-h2 { font-family: 'Sora', sans-serif; font-weight: 700; font-size: clamp(34px,5vw,64px); line-height: 1.02; letter-spacing: -2px; margin: 12px 0 14px; }
.dsc-strip-intro p { color: #31BCAB; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; font-size: 12px; }
.dsc-strip-card { position: relative; flex: 0 0 auto; width: clamp(300px, 40vw, 560px); height: 66vh; border-radius: 24px; overflow: hidden; background: radial-gradient(120% 100% at 50% 0%, #223029, #0b1210); border: 1px solid rgba(255,255,255,.1); display: block; }
.dsc-strip-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; padding: 8% 8% 20%; filter: drop-shadow(0 30px 40px rgba(0,0,0,.5)); transition: transform .6s ease; }
.dsc-strip-card:hover img { transform: scale(1.05); }
.dsc-strip-info { position: absolute; left: 0; right: 0; bottom: 0; padding: 30px 26px 24px; background: linear-gradient(to top, rgba(6,10,9,.93), transparent); }
.dsc-strip-make { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: #31BCAB; font-weight: 700; }
.dsc-strip-name { font-family: 'Sora', sans-serif; font-weight: 700; font-size: clamp(22px,2.6vw,32px); margin: 2px 0 6px; color: #fff; }
.dsc-strip-meta { font-size: 13px; color: rgba(255,255,255,.62); }
@media (max-width: 860px) { .dsc-strip { height: auto; } .dsc-strip-pin { position: static; height: auto; padding: 56px 0; } .dsc-strip-track { overflow-x: auto; transform: none !important; scrollbar-width: none; } .dsc-strip-track::-webkit-scrollbar { display: none; } .dsc-strip-card { height: 58vh; } .dsc-strip-intro { width: auto; } }
@media (prefers-reduced-motion: reduce) { .dsc-story-car { animation: none; } }

/* Models-as-filmstrip: round over the previous panel + accents + reduced-motion fallback */
.dsc-strip { border-top-left-radius: 44px; border-top-right-radius: 44px; margin-top: -44px; z-index: 4; }
.dsc-strip-sub { color: rgba(255,255,255,.55); font-size: 15px; line-height: 1.6; margin: 6px 0 22px; max-width: 340px; }
.dsc-strip-h2 span { color: #31BCAB; }
@media (prefers-reduced-motion: reduce) {
  .dsc-strip { height: auto; }
  .dsc-strip-pin { position: static; height: auto; padding: 56px 0; }
  .dsc-strip-track { overflow-x: auto; transform: none !important; }
}

/* ══ Impact numbers (About EV.Renting) — big & bold ══ */
.dsc-impact-head { margin-bottom: clamp(30px,5vw,56px); }
.dsc-impact-h2 { font-family: 'Sora', sans-serif; font-weight: 700; font-size: clamp(26px,3.6vw,44px); color: #111; margin-top: 10px; letter-spacing: -1px; line-height: 1.1; }
.dsc-impact { display: grid; grid-template-columns: repeat(4,1fr); gap: clamp(18px,3vw,44px); }
@media (max-width: 820px) { .dsc-impact { grid-template-columns: repeat(2,1fr); row-gap: 40px; } }
.dsc-impact-item { border-top: 2px solid rgba(49,188,171,.55); padding-top: 18px; }
.dsc-impact-n { font-family: 'Sora', sans-serif; font-weight: 800; font-size: clamp(52px,8vw,108px); line-height: .9; letter-spacing: -3px; color: #111; }
.dsc-impact-l { margin-top: 12px; font-size: 13px; font-weight: 600; color: #555; text-transform: uppercase; letter-spacing: .06em; }

/* videos eyebrow reads white on the dark band */
#videos .dsc-eyebrow, #videos .dsc-eyebrow-hiw { color: #fff; }

/* ══ Impact stat cards — creative (index · count-up · label · desc · accent bar) ══ */
.dsc-impact-card { position: relative; background: #fff; border-radius: 22px; padding: 26px 24px 24px; box-shadow: 0 12px 32px rgba(0,0,0,.05); overflow: hidden; transition: transform .3s ease, box-shadow .3s ease; }
.dsc-impact-card:hover { transform: translateY(-5px); box-shadow: 0 20px 44px rgba(0,0,0,.10); }
.dsc-impact-idx { position: absolute; top: 18px; right: 20px; font-family: 'Sora', sans-serif; font-weight: 700; font-size: 12px; color: rgba(49,188,171,.6); letter-spacing: .1em; }
.dsc-impact-n { font-family: 'Sora', sans-serif; font-weight: 800; font-size: clamp(40px,4.6vw,62px); line-height: 1; letter-spacing: -2px; color: #111; }
.dsc-impact-l { margin-top: 10px; font-family: 'Sora', sans-serif; font-weight: 600; font-size: 14px; color: #111; text-transform: none; letter-spacing: 0; }
.dsc-impact-d { margin-top: 6px; font-size: 12.5px; color: rgba(0,0,0,.45); line-height: 1.55; }
.dsc-impact-bar { display: block; height: 3px; width: 0; background: #31BCAB; border-radius: 3px; margin-top: 16px; transition: width 1.1s cubic-bezier(.22,.61,.36,1) .25s; }
.dsc-impact.is-visible .dsc-impact-bar { width: 46px; }

/* ══ Models strip → 2-row gallery of smaller cards ══ */
.dsc-strip { height: 220vh; }
.dsc-strip-track { display: grid; grid-template-rows: repeat(2, minmax(0,1fr)); grid-auto-flow: column; grid-auto-columns: clamp(200px,20vw,282px); align-content: center; gap: clamp(12px,1.4vw,20px); height: 78vh; }
.dsc-strip-intro { grid-row: 1 / span 2; align-self: center; width: clamp(220px,24vw,360px); }
.dsc-strip-card { flex: none; width: auto; height: auto; border-radius: 18px; }
.dsc-strip-card img { padding: 12% 10% 24%; }
.dsc-strip-info { padding: 16px 16px 14px; }
.dsc-strip-make { font-size: 10.5px; }
.dsc-strip-name { font-size: clamp(16px,1.5vw,21px); margin: 2px 0 4px; }
.dsc-strip-meta { font-size: 11.5px; }
@media (max-width: 860px) { .dsc-strip-track { height: auto; } }

/* Models strip cards — clearly visible surface (was blending into the dark band) */
.dsc-strip-card { background: linear-gradient(180deg, #1e2a25, #0f1d1a); border: 1px solid rgba(255,255,255,.14); box-shadow: 0 18px 46px rgba(0,0,0,.42); }
.dsc-strip-card img { padding: 12% 10% 26%; }

/* Fix: strip cards must fill their grid cell (content is absolutely-positioned → 0 intrinsic height) */
.dsc-strip-track .dsc-strip-card { width: 100%; height: 100%; min-height: 0; }

/* Models strip — wider cards (image is the focus) + vertical breathing room between the 2 rows */
.dsc-strip-track { grid-auto-columns: clamp(320px, 30vw, 470px); column-gap: clamp(16px,1.8vw,26px); row-gap: clamp(30px,4.5vh,60px); }
.dsc-strip-card img { padding: 9% 5% 20%; }

/* Models strip — staggered 2 rows (row 2 offset by half a card, brick layout) */
.dsc-strip-track { --card-w: clamp(320px,30vw,470px); --card-gap: clamp(16px,1.8vw,26px); display: flex; align-items: center; gap: clamp(28px,3vw,52px); height: auto; }
.dsc-strip-rows { display: flex; flex-direction: column; gap: clamp(26px,4vh,52px); }
.dsc-strip-row { display: flex; gap: var(--card-gap); }
.dsc-strip-row2 { margin-left: calc((var(--card-w) + var(--card-gap)) / 2); }   /* centre row-2 cards over row-1 gaps */
.dsc-strip-track .dsc-strip-card { flex: 0 0 var(--card-w); width: var(--card-w); height: clamp(190px,32vh,320px); }

/* Restore taller cards (staggering only changed position, not size) */
.dsc-strip-track .dsc-strip-card { height: clamp(250px, 39vh, 372px); }

/* ══ Hero reveal — real cars + motion (ken-burns float + light sweep per car) ══ */
.dsc-slide img { will-change: transform; }
.dsc-slide.is-active img { animation: dsc-carfloat 7s ease-in-out infinite; }
@keyframes dsc-carfloat { 0%,100% { transform: translateY(0) scale(1); } 50% { transform: translateY(-9px) scale(1.04); } }
.dsc-slide::after { content: ''; position: absolute; inset: 0; z-index: 3; pointer-events: none; transform: translateX(-130%); background: linear-gradient(115deg, transparent 34%, rgba(255,255,255,.16) 49%, transparent 64%); }
.dsc-slide.is-active::after { animation: dsc-shine 1.5s cubic-bezier(.2,.7,.3,1) .3s; }
@keyframes dsc-shine { to { transform: translateX(130%); } }
@media (prefers-reduced-motion: reduce) { .dsc-slide.is-active img { animation: none; } .dsc-slide.is-active::after { animation: none; } }

/* ══ Models strip — authoritative MOBILE override (no pin / no scroll-jack) ══ */
/* Comes last on purpose: earlier plain `.dsc-strip{height:220vh}` + track rules
   were overriding the mobile media queries, leaving the pinned horizontal-scroll
   active on phones (broken on touch). On ≤860px we drop the pin entirely and
   present the cards as two horizontally-swipeable rows. */
@media (max-width: 860px) {
  .dsc-strip { height: auto !important; }
  .dsc-strip-pin { position: static !important; height: auto !important; overflow: visible !important; display: block !important; padding: 48px 0; }
  .dsc-strip-track { display: flex !important; flex-direction: column !important; align-items: stretch !important; transform: none !important; height: auto !important; gap: 26px; padding: 0 18px; overflow: visible !important; }
  .dsc-strip-intro { width: auto !important; min-width: 0 !important; }
  .dsc-strip-rows { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 16px; }
  .dsc-strip-row, .dsc-strip-row2 { display: flex !important; margin-left: 0 !important; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding-bottom: 4px; }
  .dsc-strip-row::-webkit-scrollbar, .dsc-strip-row2::-webkit-scrollbar { display: none; }
  .dsc-strip-track .dsc-strip-card,
  .dsc-strip-card { flex: 0 0 80% !important; width: 80% !important; height: 300px !important; min-height: 0 !important; scroll-snap-align: start; }
}

/* ══ Trustpilot rating badge (reviews section header) ══ */
.dsc-trustpilot { display: inline-flex; align-items: center; gap: 10px; margin-top: 14px; text-decoration: none; }
.dsc-tp-stars { background: #00b67a; color: #fff; padding: 4px 8px; border-radius: 5px; font-size: 15px; letter-spacing: 2px; line-height: 1; }
.dsc-tp-score { font-size: 14px; color: rgba(255,255,255,.72); }
.dsc-tp-score strong { color: #fff; font-weight: 700; }
.dsc-sec-stone .dsc-tp-score { color: rgba(20,28,26,.7); }
.dsc-sec-stone .dsc-tp-score strong { color: #141c1a; }
.dsc-trustpilot:hover .dsc-tp-score { text-decoration: underline; }

/* ══ Landing nav — mobile layout (wrap instead of cram) ══ */
@media (max-width: 760px) {
  .dsc-nav { flex-wrap: wrap; row-gap: 12px; padding: 16px 18px 0; }
  .dsc-logo { flex: 1 1 auto; }
  .dsc-nav-cta { flex: 0 0 auto; gap: 8px; }
  .dsc-nav-cta .dsc-btn-ghost { display: none; }          /* keep the primary "Get started"; login lives on /login */
  .dsc-pillnav { order: 3; flex: 0 0 100%; width: 100%; justify-content: center; overflow-x: auto; scrollbar-width: none; }
  .dsc-pillnav::-webkit-scrollbar { display: none; }
  .dsc-pillnav span { white-space: nowrap; padding: 8px 14px; font-size: 13px; }
}

/* ══ "Your electric journey starts here" — mobile-friendly ══ */
.dsc-portrait picture { display: block; width: 100%; height: 100%; }
@media (max-width: 760px) {
  .dsc-2col { gap: 30px; }
  .dsc-portrait { aspect-ratio: 16 / 10; max-width: none; border-radius: 22px; }
  .dsc-portrait img { object-position: center; }
  .dsc-feat-grid { grid-template-columns: 1fr; gap: 16px; }
  .dsc-h2 { letter-spacing: -0.5px; }
}

/* "How it works" — centered + tidy on mobile */
@media (max-width: 760px) {
  #how-it-works .dsc-hiw-head { text-align: center; }
  #how-it-works .dsc-h2 { text-align: center; }
  #how-it-works .dsc-body { text-align: center; margin-left: auto; margin-right: auto; margin-bottom: 32px; }
  #how-it-works .dsc-feat { align-items: center; text-align: center; }
  #how-it-works .dsc-feat-desc { max-width: 34ch; margin-left: auto; margin-right: auto; }
}

/* Brand logos — smaller on mobile (desktop unchanged) */
@media (max-width: 760px) {
  .dsc-logo-chip { height: 50px; padding: 0 16px; margin: 0 6px; border-radius: 11px; }
  .dsc-logo-chip img { height: 26px; max-width: 104px; }
  .dsc-logos { padding-top: 22px; }
}

/* "How it works" features on mobile: 2 in row 1, the 3rd centered on row 2 */
@media (max-width: 760px) {
  #how-it-works .dsc-feat-grid { grid-template-columns: 1fr 1fr; gap: 22px 14px; }
  #how-it-works .dsc-feat:nth-child(3) { grid-column: 1 / -1; }
}

/* Model-strip cards scale fluidly with the screen (width follows the viewport,
   height derives from an aspect-ratio → the car image scales proportionally). */
@media (max-width: 860px) {
  .dsc-strip-track .dsc-strip-card,
  .dsc-strip-card { height: auto !important; aspect-ratio: 4 / 3; }
  .dsc-strip-card img { width: 100%; height: 100%; object-fit: contain; }
}

/* Model-strip boxes scale with the screen: fluid viewport-based width (bounded),
   height follows the 4:3 aspect-ratio → the whole card grows/shrinks smoothly. */
@media (max-width: 860px) {
  .dsc-strip-track .dsc-strip-card,
  .dsc-strip-card { flex: 0 0 auto !important; width: clamp(260px, 74vw, 460px) !important; }
}