/* ══════════════════════════════════════════════════
   SAFETY EATS — Hunger Palette
   Yellow #FFD835 (vivo) · Orange #FF7A00 · Red #DD0000
   Warm dark #1A0800 · Light vivid #FFF3B0
   ══════════════════════════════════════════════════ */

/* ─── TOKENS ─── */
:root {
  --y:    #FFD835;
  --y2:   #FFE566;
  --r:    #DD0000;
  --r2:   #FF4D4D;
  --o:    #FF7A00;

  --bg:   #1A0800;
  --s1:   #2E1500;
  --s2:   #3D1E00;
  --s3:   #4D2800;
  --b:    rgba(255,216,53,0.22);
  --bh:   rgba(255,216,53,0.35);

  --tx:   #FFF8E0;
  --txm:  #E0B840;
  --txf:  #A07820;

  --grad: linear-gradient(120deg, #FFD835 0%, #FF7A00 50%, #DD0000 100%);
  --grad-r: linear-gradient(120deg, #DD0000 0%, #FF7A00 50%, #FFD835 100%);

  --fd:  'Space Grotesk', sans-serif;
  --fb:  'Inter', sans-serif;

  --xs:   clamp(.75rem,  .7rem  + .25vw, .875rem);
  --sm:   clamp(.875rem, .8rem  + .35vw, 1rem);
  --base: clamp(1rem,    .95rem + .25vw, 1.125rem);
  --lg:   clamp(1.125rem,1rem   + .75vw, 1.5rem);
  --xl:   clamp(1.5rem,  1.2rem + 1.25vw,2.25rem);
  --2xl:  clamp(2rem,    1.2rem + 2.5vw, 3.5rem);
  --3xl:  clamp(2.5rem,  1rem   + 4vw,   5rem);

  --sp1:.25rem; --sp2:.5rem;  --sp3:.75rem; --sp4:1rem;
  --sp5:1.25rem;--sp6:1.5rem; --sp8:2rem;   --sp10:2.5rem;
  --sp12:3rem;  --sp16:4rem;  --sp20:5rem;  --sp24:6rem;

  --rr:.375rem; --rm:.625rem; --rl:1rem;
  --rx:1.5rem;  --r2x:2rem;   --rf:9999px;

  --sh-sm: 0 2px 8px rgba(0,0,0,.5);
  --sh-md: 0 8px 28px rgba(0,0,0,.6);
  --sh-lg: 0 24px 64px rgba(0,0,0,.7);
  --sh-y:  0 0 48px rgba(255,216,53,.35);
  --sh-r:  0 0 48px rgba(221,0,0,.30);
  --sh-o:  0 0 48px rgba(255,122,0,.25);

  --ease-out: cubic-bezier(.16,1,.3,1);
  --ease-in:  cubic-bezier(.4,0,1,1);
  --t: 180ms cubic-bezier(.16,1,.3,1);

  --w: 1100px;
  --nav-h: 70px;
}

/* ─── LIGHT THEME ─── */
/* Amarelo vivo #FFD835 + vermelho #DD0000 — cores quentes de fome */
[data-theme="light"] {
  --bg:   #FFF3B0;
  --s1:   #FFED88;
  --s2:   #FFE666;
  --s3:   #FFDD44;
  --b:    rgba(180,80,0,.18);
  --bh:   rgba(180,80,0,.28);

  --tx:   #2A1000;
  --txm:  #5A3000;
  --txf:  #8A5510;

  --sh-sm: 0 2px 8px rgba(180,80,0,.18);
  --sh-md: 0 8px 28px rgba(180,80,0,.22);
  --sh-lg: 0 24px 64px rgba(180,80,0,.28);
  --sh-y:  0 0 48px rgba(255,216,53,.55);
  --sh-r:  0 0 48px rgba(221,0,0,.35);
}

[data-theme="light"] body {
  color: var(--tx);
  background: var(--bg);
}

[data-theme="light"] .nav.scrolled {
  background: transparent;
  backdrop-filter: none;
  border-bottom: none;
}

[data-theme="light"] .hero {
  background: url('./hero3.png') top center/100% auto no-repeat;
  background-color: #000;
}

[data-theme="light"] .hero-h1 { color: #fff; text-shadow: 0 2px 12px rgba(0,0,0,.2) }
[data-theme="light"] .hero-p { color: rgba(255,255,255,.92) }
[data-theme="light"] .hero-p strong { color: #fff }
[data-theme="light"] .hero-chip { background: rgba(255,255,255,.2); border-color: rgba(255,255,255,.4); color: #fff }

[data-theme="light"] .btn-primary {
  color: #fff;
  background: #DD0000;
  box-shadow: 0 4px 22px rgba(221,0,0,.40);
  border: none;
}
[data-theme="light"] .btn-primary:hover { box-shadow: 0 6px 32px rgba(221,0,0,.55); background: #CC1818 }

[data-theme="light"] .hero .btn-primary {
  background: #fff;
  color: #DD0000;
  box-shadow: 0 4px 22px rgba(0,0,0,.20);
}
[data-theme="light"] .hero .btn-primary:hover { background:#fff; box-shadow: 0 6px 32px rgba(0,0,0,.30) }

[data-theme="light"] .hero .btn-ghost {
  background: rgba(255,255,255,.2);
  color: #fff;
  border-color: rgba(255,255,255,.4);
}
[data-theme="light"] .hero .btn-ghost:hover {
  background: rgba(255,255,255,.3);
  border-color: rgba(255,255,255,.5);
}

[data-theme="light"] .btn-ghost {
  background: rgba(255,216,53,.30);
  color: var(--tx);
  border: 2px solid #E5B800;
}
[data-theme="light"] .btn-ghost:hover {
  background: rgba(255,216,53,.50);
  border-color: #FFD835;
}

[data-theme="light"] .btn-outline {
  color: var(--tx);
  border: 2px solid #E5B800;
}
[data-theme="light"] .btn-outline:hover {
  border-color: #DD0000;
  color: #DD0000;
  background: rgba(221,0,0,.08);
}

[data-theme="light"] .nav-cta {
  color: #fff;
  background: #DD0000;
  box-shadow: 0 4px 16px rgba(221,0,0,.30);
}
[data-theme="light"] .nav-cta:hover {
  background: #CC1818;
  box-shadow: 0 6px 24px rgba(221,0,0,.45);
}

[data-theme="light"] .scroll-cue span { color: rgba(255,255,255,.6) }
[data-theme="light"] .scroll-line { background: linear-gradient(to bottom, rgba(255,255,255,.4), transparent) }

[data-theme="light"] .hstat-n { color: #fff }
[data-theme="light"] .hstat-u { color: rgba(255,255,255,.85) }
[data-theme="light"] .hstat-l { color: rgba(255,255,255,.6) }
[data-theme="light"] .hstat-sep { background: rgba(255,255,255,.25) }

[data-theme="light"] .eyebrow { color: var(--r) }

[data-theme="light"] .mobile-menu {
  background: rgba(255,243,176,.97);
  backdrop-filter: blur(24px);
}
[data-theme="light"] .mob-link { color: var(--txm); border-bottom-color: var(--b) }
[data-theme="light"] .mob-link:hover { color: var(--r) }

[data-theme="light"] .problem-sec {
  background: linear-gradient(180deg, #FFE866 0%, #FFDD44 50%, #FFE866 100%);
  border-top: none;
  border-bottom: 3px solid #DD0000;
  padding-top:0;
}
[data-theme="light"] .video-sec {
  background: linear-gradient(180deg, #FFE866 0%, #FFCECE 50%, #FFE866 100%);
  border-top: 3px solid #DD0000;
  border-bottom: 3px solid #DD0000;
}
[data-theme="light"] .footer {
  background: #FDD802;
  border-top: none;
}

[data-theme="light"] .prob-donut-card {
  background: #FFFDE8;
  border: 3px solid #DD0000;
  box-shadow: 0 8px 32px rgba(221,0,0,.12);
}
[data-theme="light"] .prob-donut-card::before {
  background: radial-gradient(ellipse at 50% 0%, rgba(255,216,53,.18) 0%, transparent 65%);
}

[data-theme="light"] .donut-arc { stroke: url(#donutGrad) }

[data-theme="light"] .pdc-leg-dot[style*="rgba(255,255,255"] {
  background: rgba(42,21,0,.08) !important;
}

[data-theme="light"] .pbc-track { background: rgba(42,21,0,.06) }
[data-theme="light"] .pbc-row:hover .pbc-track { background: rgba(42,21,0,.1) }

[data-theme="light"] .step {
  background: #FFFDE8;
  border: 2px solid #FFD835;
}
[data-theme="light"] .step-ico {
  background: #DD0000;
  border: none;
  color: #fff;
  box-shadow: none;
}
[data-theme="light"] .step:hover {
  border-color: #DD0000;
  box-shadow: var(--sh-r);
}
[data-theme="light"] .pms-card {
  background: #FFFDE8;
  border: 2px solid #FFD835;
}
[data-theme="light"] .pms-card:hover {
  border-color: #DD0000;
  box-shadow: var(--sh-r);
}
[data-theme="light"] .prob-bars-card {
  background: #FFFDE8;
  border: 3px solid #DD0000;
  box-shadow: 0 8px 32px rgba(221,0,0,.12);
}

[data-theme="light"] .lock-showcase {
  background: #FFFDE8;
  border: 3px solid #FFD835;
  box-shadow: 0 16px 48px rgba(255,216,53,.30);
}
[data-theme="light"] .lock-badge {
  background: var(--r);
  color: #fff;
}
[data-theme="light"] .lstat-n { color: var(--r) }

[data-theme="light"] .contact-form-wrap {
  background: #FFFDE8;
  border: 3px solid #FFD835;
  box-shadow: 0 8px 32px rgba(255,216,53,.20);
}
[data-theme="light"] .c-ico {
  background: #FFD835;
  border: 2px solid #E5B800;
  color: #2A1000;
  box-shadow: 0 4px 16px rgba(255,216,53,.35);
}

[data-theme="light"] .vcard {
  background: #fff;
  border: 1px solid var(--b);
  box-shadow: var(--sh-md);
}
[data-theme="light"] .vcard:hover {
  border-color: var(--bh);
  box-shadow: var(--sh-lg);
}
[data-theme="light"] .vcard-play {
  background: #DD0000;
  box-shadow: 0 4px 28px rgba(221,0,0,.6);
  color: #fff;
}
[data-theme="light"] .vcard-thumb:hover .vcard-play { background: var(--r) }

[data-theme="light"] .lb-backdrop { background: rgba(255,243,176,.94) }

[data-theme="light"] .app-sec::before {
  background: radial-gradient(circle, rgba(255,216,53,.08) 0%, transparent 70%);
}

[data-theme="light"] .acard-features li i { color: var(--r) }

[data-theme="light"] .c-val:hover { color: var(--r) }

[data-theme="light"] .fg input,
[data-theme="light"] .fg select,
[data-theme="light"] .fg textarea {
  background: #FFFEF0;
  border: 2px solid #E5B800;
  color: var(--tx);
}
[data-theme="light"] .fg input::placeholder,
[data-theme="light"] .fg textarea::placeholder { color: var(--txf) }
[data-theme="light"] .fg input:focus,
[data-theme="light"] .fg select:focus,
[data-theme="light"] .fg textarea:focus {
  border-color: #DD0000;
  box-shadow: 0 0 0 3px rgba(221,0,0,.25);
  background: #fff;
}

[data-theme="light"] .soc-btn {
  background: #FFD835;
  border: 2px solid #E5B800;
  color: #2A1000;
}
[data-theme="light"] .soc-btn:hover {
  background: #DD0000;
  border-color: #B01010;
  color: #fff;
}

[data-theme="light"] .nav-link { color: var(--txm) }
[data-theme="light"] .nav-link:hover { color: var(--tx) }
[data-theme="light"] .nav-link::after { background: var(--grad) }

[data-theme="light"] .f-col a:hover { color: var(--r) }
[data-theme="light"] .f-contact-link:hover { color: var(--r) }

[data-theme="light"] .cursor { background: var(--r) }
[data-theme="light"] .cursor-follower { border-color: rgba(221,0,0,.45) }
[data-theme="light"] .cursor-follower.hover { border-color: rgba(221,0,0,.28) }

[data-theme="light"] ::selection { background: rgba(255,216,53,.3); color: var(--tx) }

/* ─── THEME TOGGLE ─── */
.theme-toggle {
  position: relative;
  width: 40px; height: 40px;
  border-radius: 50%;
  background: var(--s2);
  border: 1px solid var(--b);
  display: flex; align-items: center; justify-content: center;
  color: var(--y);
  font-size: 1.1rem;
  transition: all var(--t);
  flex-shrink: 0;
  overflow: hidden;
}
.theme-toggle:hover {
  background: rgba(255,216,53,.15);
  border-color: rgba(255,216,53,.35);
  transform: translateY(-1px);
}
.theme-toggle .ph-sun,
.theme-toggle .ph-moon {
  position: absolute;
  transition: transform .4s var(--ease-out), opacity .3s;
}

/* Dark theme: show sun (to switch to light), hide moon */
[data-theme="dark"] .logo-text { color: #fff }
[data-theme="dark"] .theme-toggle .ph-sun { opacity: 1; transform: rotate(0deg) scale(1) }
[data-theme="dark"] .theme-toggle .ph-moon { opacity: 0; transform: rotate(-90deg) scale(.5) }

/* Light theme: show moon (to switch to dark), hide sun */
[data-theme="light"] .theme-toggle .ph-sun { opacity: 0; transform: rotate(90deg) scale(.5) }
[data-theme="light"] .theme-toggle .ph-moon { opacity: 1; transform: rotate(0deg) scale(1); color: var(--y) }
[data-theme="light"] .theme-toggle { background: var(--s1); border-color: var(--b) }
[data-theme="light"] .theme-toggle:hover { background: rgba(255,216,53,.12); border-color: rgba(255,216,53,.4) }

@media(max-width:768px){
  .theme-toggle { width: 36px; height: 36px; font-size: 1rem }
}

/* ─── RESET ─── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  scroll-behavior: smooth;
  scroll-padding-top: var(--nav-h);
  text-rendering: optimizeLegibility;
  font-feature-settings: "kern" 1, "liga" 1;
  font-optical-sizing: auto;
  overflow-x: hidden;
}

body {
  font-family: var(--fb);
  font-size: var(--base);
  color: var(--tx);
  background: var(--bg);
  min-height: 100dvh;
  line-height: 1.6;
  overflow-x: hidden;
  cursor: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

*, *::before, *::after {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@media(hover:none){ body{ cursor:auto } a,button{cursor:pointer} }

img,video { display:block; max-width:100%; height:auto }
ul[role="list"] { list-style:none }
input,button,textarea,select { font:inherit; color:inherit }
h1,h2,h3,h4 { text-wrap:balance; line-height:1.08; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; text-rendering:optimizeLegibility }
p { text-wrap:pretty; max-width:72ch }
button { cursor:none; background:none; border:none }
a { text-decoration:none; color:inherit; cursor:none }
::selection { background:rgba(255,216,53,.28); color:var(--tx) }
:focus-visible { outline:2px solid var(--o, #FF7A00); outline-offset:3px; border-radius:var(--rr) }
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* ─── CURSOR ─── */
.cursor {
  position:fixed; width:8px; height:8px;
  background:var(--y); border-radius:50%;
  pointer-events:none; z-index:9999;
  transform:translate(-50%,-50%);
  transition:width .2s var(--ease-out),height .2s var(--ease-out),background .2s;
}
.cursor-follower {
  position:fixed; width:30px; height:30px;
  border:1.5px solid rgba(255,216,53,.45);
  border-radius:50%; pointer-events:none; z-index:9998;
  transform:translate(-50%,-50%);
  transition:transform .12s var(--ease-out),width .28s var(--ease-out),height .28s var(--ease-out),border-color .3s;
}
.cursor.hover { width:14px; height:14px }
.cursor-follower.hover { width:52px; height:52px; border-color:rgba(255,216,53,.28) }
@media(hover:none){ .cursor,.cursor-follower{display:none} }

/* ─── LAYOUT ─── */
.container {
  max-width: var(--w);
  margin-inline: auto;
  padding-inline: clamp(var(--sp6),5vw,var(--sp12));
  box-sizing: border-box;
  width: 100%;
}
.section { padding-block: clamp(var(--sp16),8vw,var(--sp24)); position:relative }

/* ─── TYPE HELPERS ─── */
.eyebrow {
  display:inline-block; font-size:var(--xs); font-weight:700;
  letter-spacing:.12em; text-transform:uppercase;
  color:var(--y); margin-bottom:var(--sp4);
}
.sec-title {
  font-family:var(--fd); font-size:var(--2xl); font-weight:700;
  color:var(--tx); line-height:1.04;
}
.sec-title.centered { text-align:center }
.sec-sub {
  font-size:var(--base); color:var(--txm);
  margin-top:var(--sp4); max-width:52ch;
}
.sec-sub.centered { margin-inline:auto; text-align:center }
.sec-sub-red { color:#DD0000; font-weight:700 }
.sec-sub-red strong { color:#DD0000 }
.body-copy { font-size:var(--base); color:var(--txm); line-height:1.75; max-width:52ch }
.grad-text {
  font-style:normal;
  background:var(--grad);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
  background-clip:text;
  transform:translateZ(0);
}
.sec-header { text-align:center; margin-bottom:clamp(var(--sp10),5vw,var(--sp16)) }

/* ─── BUTTONS ─── */
.btn {
  display:inline-flex; align-items:center; gap:var(--sp2);
  padding:var(--sp3) var(--sp6); border-radius:var(--rf);
  font-weight:600; font-size:var(--sm); white-space:nowrap;
  transition:all var(--t); position:relative; overflow:hidden;
}
.btn::before {
  content:''; position:absolute; inset:0;
  background:rgba(255,255,255,.08); opacity:0; transition:opacity var(--t);
}
.btn:hover::before { opacity:1 }
.btn:active { transform:scale(.97) }

.btn-primary {
  background:#FFD835; color:#2A1000; font-weight:700;
  box-shadow:0 4px 22px rgba(255,216,53,.35);
}
.btn-primary:hover { box-shadow:0 6px 32px rgba(255,216,53,.50); transform:translateY(-2px); background:#FFE04D }

.btn-ghost {
  background:rgba(255,255,255,.15); color:#fff;
  border:1px solid rgba(255,255,255,.35);
}
.btn-ghost:hover { background:rgba(255,255,255,.25); border-color:rgba(255,255,255,.5); transform:translateY(-2px) }

.btn-outline {
  background:transparent; color:var(--tx); border:1px solid var(--b);
  font-size:var(--xs); padding:var(--sp2) var(--sp4);
}
.btn-outline:hover { border-color:var(--y); color:var(--y); transform:translateY(-1px) }

.btn-lg { padding:var(--sp4) var(--sp8); font-size:var(--base) }
.full { width:100%; justify-content:center }

/* ─── NAV ─── */
.nav {
  position:fixed; top:0; left:0; right:0; z-index:1000;
  height:var(--nav-h); display:flex; align-items:center;
  transition:background .4s var(--ease-out),backdrop-filter .4s;
}
.nav.scrolled {
  background: transparent;
  backdrop-filter: none;
  border-bottom: none;
}
.nav-inner {
  max-width:var(--w); width:100%; margin-inline:auto;
  padding-inline:clamp(var(--sp6),5vw,var(--sp12));
  display:flex; align-items:center; gap:var(--sp8);
}
.nav-logo { margin-left:auto }
.logo-text {
  font-family:var(--fd); font-size:var(--lg); font-weight:700;
  color:#000; letter-spacing:-.02em;
}
.accent {
  color:#DD0000;
  -webkit-text-fill-color:#DD0000;
}
.nav-links {
  display:flex; gap:var(--sp8); list-style:none;
  align-items:center;
}
.nav-link {
  font-size:var(--sm); font-weight:500; color:var(--txm);
  position:relative; transition:color var(--t);
}
.nav-link::after {
  content:''; position:absolute; bottom:-3px; left:0;
  width:0; height:2px; background:var(--grad); border-radius:var(--rf);
  transition:width .3s var(--ease-out);
}
.nav-link:hover { color:var(--tx) }
.nav-link:hover::after { width:100% }
.nav-chip {
  display:inline-flex; align-items:center; gap:var(--sp2);
  padding:var(--sp1) var(--sp3); background:rgba(221,0,0,.12);
  border:1px solid rgba(221,0,0,.30); border-radius:var(--rf);
  font-size:var(--xs); font-weight:700; color:#DD0000;
  letter-spacing:.04em; white-space:nowrap;
}
@media(max-width:768px){ .nav-chip { display:none } }
.nav-cta {
  display:flex; align-items:center; gap:var(--sp2);
  padding:var(--sp2) var(--sp5); background:#DD0000;
  color:#fff; font-weight:700; font-size:var(--sm); border-radius:var(--rf);
  transition:all var(--t);
}
.nav-cta:hover { transform:translateY(-1px); box-shadow:var(--sh-r); background:#CC1818 }
.hamburger { display:none; flex-direction:column; gap:5px; padding:var(--sp2) }
.hamburger span { display:block; width:22px; height:2px; background:var(--tx); border-radius:2px; transition:all .3s var(--ease-out) }
.hamburger.open span:nth-child(1){ transform:rotate(45deg) translate(5px,5px) }
.hamburger.open span:nth-child(2){ opacity:0; transform:translateX(-8px) }
.hamburger.open span:nth-child(3){ transform:rotate(-45deg) translate(5px,-5px) }
.mobile-menu {
  position:fixed; top:var(--nav-h); left:0; right:0;
  background:rgba(26,10,0,.96); backdrop-filter:blur(24px);
  border-bottom:1px solid var(--b); z-index:999;
  padding:var(--sp6) var(--sp8);
  transform:translateY(-110%); opacity:0;
  transition:transform .4s var(--ease-out),opacity .3s;
}
.mobile-menu.open { transform:translateY(0); opacity:1 }
.mobile-menu ul { display:flex; flex-direction:column; gap:var(--sp2) }
.mob-link {
  display:block; font-family:var(--fd); font-size:var(--lg); font-weight:600;
  color:var(--txm); padding:var(--sp3) 0; border-bottom:1px solid var(--b);
  transition:color var(--t);
}
.mob-link:hover { color:var(--y) }

/* ─── HERO ─── */
.hero {
  position:relative; min-height:100dvh;
  display:flex; align-items:flex-end;
  background: url('./hero3.png') top center/100% auto no-repeat;
  background-color: #000;
}
.hero-bottom {
  position:absolute; bottom:var(--sp6); left:0; right:0;
  display:flex; justify-content:flex-end; z-index:10;
  padding-inline:clamp(var(--sp6),5vw,var(--sp12));
  max-width:var(--w); margin-inline:auto;
}
.hero-cta { font-size:var(--xs); padding:var(--sp2) var(--sp4) }
.hero-label {
  background:rgba(255,255,255,.15); color:#fff;
  font-size:var(--xs); font-weight:600;
  letter-spacing:.05em;
  padding:var(--sp2) var(--sp4); border-radius:var(--rf);
  border:1px solid rgba(255,255,255,.35);
  margin-right:var(--sp3);
}
.hero::before {
  content:''; position:absolute; inset:0;
  background: linear-gradient(to bottom, transparent 0%, transparent 30%, rgba(0,0,0,.25) 60%, rgba(0,0,0,.65) 100%);
  pointer-events:none;
}
.hero-bg { display:none }
.hero-vid { display:none }
.hero-overlay { display:none }
.scanlines { display:none }
.vid-dots { display:none }
.vdot { display:none }
.hero-content { position:absolute; bottom:calc(var(--sp6) + 36px); left:0; right:0; z-index:10 }

.hero-chip {
  display:inline-flex; align-items:center; gap:var(--sp2);
  padding:var(--sp2) var(--sp4); background:rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.35); border-radius:var(--rf);
  font-size:var(--xs); font-weight:600; color:#fff;
  letter-spacing:.05em; margin-bottom:var(--sp6);
}

.hero-h1 {
  font-family:var(--fd); font-size:var(--3xl); font-weight:700;
  color:#fff; letter-spacing:-.03em; margin-bottom:var(--sp6);
  text-shadow: 0 2px 16px rgba(0,0,0,.15);
}

.hero-p {
  font-size:var(--lg); color:rgba(255,255,255,.9);
  max-width:48ch; margin-bottom:var(--sp8); line-height:1.6;
}
.hero-p strong { color:#fff; font-weight:700 }
.hero-btns { display:flex; flex-wrap:wrap; gap:var(--sp4); margin-bottom:var(--sp12) }

.hero-stats { display:flex; gap:var(--sp6); flex-wrap:wrap; align-items:center }
.hstat { display:flex; flex-direction:column; gap:1px }
.hstat-n {
  font-family:var(--fd); font-size:var(--sm); font-weight:600;
  color:#fff; line-height:1;
}
.hstat-u { font-size:var(--xs); color:rgba(255,255,255,.85); font-weight:600 }
.hstat-l { font-size:.68rem; color:rgba(255,255,255,.6); margin-top:2px; max-width:16ch; line-height:1.3 }
.hstat-sep { width:1px; height:28px; background:rgba(255,255,255,.25); align-self:center }

.scroll-cue {
  position:absolute; bottom:var(--sp10);
  left:clamp(var(--sp6),5vw,var(--sp12));
  display:flex; flex-direction:column; align-items:center; gap:var(--sp3); z-index:10;
}
.scroll-cue span { font-size:var(--xs); color:rgba(255,255,255,.6); letter-spacing:.1em; writing-mode:vertical-lr }
.scroll-line {
  width:1px; height:48px;
  background:linear-gradient(to bottom,rgba(255,255,255,.5),transparent);
  animation:scPulse 1.8s ease-in-out infinite;
}
@keyframes scPulse { 0%,100%{opacity:.3} 50%{opacity:1} }

.anim-fade-up {
  opacity:0; transform:translateY(22px);
  animation:fadeUp .8s var(--ease-out) var(--d, 0ms) forwards;
}
@keyframes fadeUp { to{opacity:1;transform:translateY(0)} }

.js-ready .reveal-l { opacity:0; transform:translateX(-38px); transition:opacity .8s var(--ease-out),transform .8s var(--ease-out) }
.js-ready .reveal-r { opacity:0; transform:translateX(38px); transition:opacity .8s var(--ease-out),transform .8s var(--ease-out) }
.js-ready .reveal-card { opacity:0; transform:translateY(30px) scale(.98); transition:opacity .6s var(--ease-out) var(--d,0ms), transform .6s var(--ease-out) var(--d,0ms) }
.reveal-l.visible,.reveal-r.visible,.reveal-card.visible { opacity:1 !important; transform:none !important }

/* ─── PROBLEM ─── */
.problem-sec {
  background: linear-gradient(180deg, var(--s1) 0%, rgba(255,216,53,.08) 50%, var(--s1) 100%);
  border-top:none; border-bottom:2px solid rgba(255,216,53,.25);
  padding-top:0;
  margin-top:0;
}

.prob-divider {
  text-align:left;
  padding-top:var(--sp6);
  padding-bottom:var(--sp4);
}
.prob-eyebrow-center {
  color:#000 !important; font-size:var(--sm); letter-spacing:.15em;
}

.prob-video-top {
  margin-bottom:0; margin-top:0;
  max-width:700px;
  margin-inline:auto;
}
.problem-sec > .container { padding-top:0 }
.prob-video-top .vcard {
  box-shadow:none; transform:none;
  border-radius:0 0 var(--rx) var(--rx);
  border:2px solid #DD0000; background:#fff;
}
@media(max-width:768px){
  .prob-video-top .vcard {
    border-left:none; border-right:none;
  }
}
.prob-video-top .vcard-thumb { border-radius:0 }
.vcard-autoplay { width:100%; aspect-ratio:16/9; overflow:hidden }
.vcard-autoplay video { width:100%; height:100%; object-fit:cover; display:block }
.prob-video-top .vcard:hover { transform:none; box-shadow:none; border:2px solid #DD0000 }
.prob-video-top .vcard-body { background:#fff }
.prob-video-top .vcard-body h3 { color:#DD0000 }
.prob-video-top .vcard-body p { color:#5A3000 }
.prob-video-top .vcard-red { background:#fff; box-shadow:none }
.prob-video-top .vcard-red:hover { box-shadow:none }

@media(max-width:768px){
  .prob-video-top {
    max-width:none;
    margin-left:calc(-1 * var(--sp4));
    margin-right:calc(-1 * var(--sp4));
    margin-bottom:var(--sp6);
  }
  .prob-video-top .vcard {
    border-radius:0 0 var(--rx) var(--rx);
  }
  .problem-sec {
    padding-top:4px;
  }
}

.prob-header {
  display:grid; grid-template-columns:1fr 1fr;
  gap:clamp(var(--sp8),5vw,var(--sp16)); align-items:end;
  margin-top:clamp(var(--sp12),6vw,var(--sp20));
  margin-bottom:clamp(var(--sp10),5vw,var(--sp14));
  padding-bottom:clamp(var(--sp8),4vw,var(--sp10));
  border-bottom:1px solid var(--b);
}
.prob-header-text { display:flex; flex-direction:column }
.prob-header-text .eyebrow { color:#000 }
.prob-header-text .sec-title { color:#DD0000 }
.prob-header-sub {
  font-size:var(--base); color:var(--txm); line-height:1.7;
  max-width:46ch; align-self:end;
}

.prob-grid {
  display:grid; grid-template-columns:1fr 1.3fr;
  gap:clamp(var(--sp6),3vw,var(--sp8)); align-items:start;
  width:100%;
}
.prob-left {
  display:flex; flex-direction:column; gap:var(--sp6);
  min-width:0;
}

.prob-donut-card {
  background:var(--s2); border:2px solid rgba(221,0,0,.35); border-radius:var(--r2x);
  padding:var(--sp8); display:flex; flex-direction:column; gap:var(--sp6);
  position:relative; overflow:hidden;
  box-shadow: 0 8px 32px rgba(221,0,0,.15);
}
.prob-donut-card::before {
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse at 50% 0%, rgba(255,216,53,.12) 0%, transparent 65%);
  pointer-events:none;
}
.pdc-label-top { display:flex; align-items:center; justify-content:space-between }
.pdc-duo {
  display:grid; grid-template-columns:1fr 1fr; gap:var(--sp6);
  align-items:end;
}
.pdc-duo-item {
  display:flex; flex-direction:column; align-items:center; gap:var(--sp4);
  justify-content:flex-end;
  height:100%;
}
.pdc-duo-item .pdc-chart-area { width:180px; height:180px }

/* Vertical bar chart */
.vbar-chart {
  display:flex; align-items:flex-end; justify-content:center;
  gap:var(--sp3); height:200px;
}
.vbar-wrapper {
  display:flex; flex-direction:column; align-items:center; gap:var(--sp2);
  height:100%;
  justify-content:flex-end;
}
.vbar {
  width:32px; height:6px;
  background:var(--c, #DD0000);
  border-radius:4px 4px 0 0;
  transition:height 1.2s cubic-bezier(.16,1,.3,1);
  position:relative;
  flex-shrink:0;
}
.vbar-val {
  position:absolute; top:-22px; left:50%; transform:translateX(-50%);
  font-family:var(--fd); font-size:.65rem; font-weight:700;
  color:var(--tx); white-space:nowrap; opacity:0;
  transition:opacity .4s .8s;
}
.vbar.animated .vbar-val { opacity:1 }
.vbar-label {
  font-size:var(--xs); color:var(--txm); text-align:center;
  letter-spacing:.02em; font-weight:500;
}
@media(max-width:480px){
  .pdc-duo { grid-template-columns:1fr 1fr; gap:var(--sp3) }
  .pdc-duo-item .pdc-chart-area { width:140px; height:140px }
  .vbar-chart { height:140px }
  .vbar { min-width:22px }
}
.pdc-chart-area {
  position:relative; width:220px; height:220px; margin:0 auto;
}
.pdc-svg { width:100%; height:100%; display:block }
.donut-arc, .gauge-arc {
  stroke-dashoffset:553.2;
  transition:stroke-dashoffset 1.8s cubic-bezier(.16,1,.3,1) .4s;
}
.pdc-center {
  position:absolute; inset:0;
  display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  gap:var(--sp2); text-align:center;
}
.pdc-number {
  display:flex; align-items:flex-start; line-height:1;
}
.pdc-num {
  font-family:var(--fd); font-size:clamp(1.8rem,3.5vw,2.4rem); font-weight:700; line-height:1;
  background:linear-gradient(135deg,#FFD835,#FF7A00,#DD0000);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
  transform:translateZ(0);
}
.pdc-unit {
  font-family:var(--fd); font-size:clamp(.9rem,1.5vw,1.1rem); font-weight:700;
  color:var(--y); padding-top:4px;
}
.pdc-desc {
  font-size:var(--xs); color:var(--txm); line-height:1.4;
  font-weight:500; max-width:14ch;
}
.pdc-legend {
  display:flex; flex-direction:column; gap:var(--sp3);
  padding-top:var(--sp4); border-top:1px solid var(--b);
}
.pdc-leg-item {
  display:flex; align-items:center; gap:var(--sp3);
  font-size:var(--xs); color:var(--txm);
}
.pdc-leg-dot {
  width:10px; height:10px; border-radius:50%; flex-shrink:0;
}

.prob-right { display:flex; flex-direction:column; gap:var(--sp5); min-width:0 }
.prob-bars-card {
  background:var(--s2); border:2px solid rgba(221,0,0,.35); border-radius:var(--r2x);
  padding:var(--sp8); display:flex; flex-direction:column; gap:var(--sp6);
  box-shadow: 0 8px 32px rgba(221,0,0,.15);
}
.pbc-header {
  display:flex; align-items:center; justify-content:space-between;
}
.pbc-title {
  font-family:var(--fd); font-size:var(--base); font-weight:600; color:var(--tx);
}
.pbc-src {
  font-size:var(--xs); color:var(--txf); letter-spacing:.04em;
}
.pbc-bars { display:flex; flex-direction:column; gap:var(--sp4) }
.pbc-row {
  display:grid; grid-template-columns:70px 1fr 40px;
  align-items:center; gap:var(--sp4);
}
.pbc-lbl {
  font-size:var(--xs); color:var(--txm); font-weight:500; white-space:nowrap;
}
.pbc-track {
  height:8px; background:rgba(255,255,255,.06); border-radius:var(--rf); overflow:hidden;
}
.pbc-fill {
  height:100%; border-radius:var(--rf);
  background:var(--c, #FFD835);
  width:0;
  transition:width 1.2s cubic-bezier(.16,1,.3,1);
  box-shadow:0 0 8px rgba(0,0,0,.15);
}
.pbc-val {
  font-family:var(--fd); font-size:var(--xs); font-weight:700; color:var(--tx); text-align:right;
}
.pbc-row:hover .pbc-lbl { color:var(--tx) }
.pbc-row:hover .pbc-track { background:rgba(255,255,255,.1) }

.prob-mini-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:var(--sp4) }
.pms-card {
  background: linear-gradient(135deg, var(--s2) 0%, rgba(255,216,53,.06) 100%);
  border:2px solid rgba(255,216,53,.15); border-radius:var(--rx);
  padding:var(--sp6) var(--sp5); display:flex; flex-direction:column; gap:var(--sp3);
  transition:border-color var(--t),transform var(--t),box-shadow var(--t);
}
.pms-card:hover { border-color:rgba(255,216,53,.40); transform:translateY(-3px); box-shadow:var(--sh-y) }
.pms-icon { font-size:1.4rem }
.pms-data {
  display:flex; align-items:flex-end; gap:2px; line-height:1;
}
.pms-n {
  font-family:var(--fd); font-size:var(--xl); font-weight:700;
  color:#DD0000; -webkit-text-fill-color:#DD0000;
}
.pms-u {
  font-family:var(--fd); font-size:var(--base); font-weight:700; color:#DD0000;
  -webkit-text-fill-color:#DD0000; padding-bottom:3px;
}
.pms-l { font-size:var(--xs); color:var(--txm); line-height:1.4 }

/* ─── TECH ─── */
.tech-sec { background: #FDD802; color: #2A1000 }
.tech-sec .eyebrow { color: #DD0000 }
.tech-sec .sec-title { color: #2A1000 }
.tech-sec .sec-sub { color: #000 }
.tech-sec .step { background: #fff; border: 2px solid #DD0000 }
.tech-sec .step:hover { border-color: #DD0000; background: #DD0000; box-shadow: 0 8px 32px rgba(221,0,0,.25) }
.tech-sec .step:hover .step-ico { background: #fff; color: #DD0000 }
.tech-sec .step:hover .step-num { color: rgba(255,255,255,.4) }
.tech-sec .step:hover h3 { color: #fff }
.tech-sec .step:hover p { color: rgba(255,255,255,.85) }
.tech-sec .step-num { color: rgba(42,16,0,.2) }
.tech-sec .step h3 { color: #DD0000 }
.tech-sec .step p { color: #DD0000 }
.tech-sec .step-arrow { color: #DD0000 }
.tech-sec .lock-showcase { background: #fff; border: 2px solid #DD0000 }
.tech-sec .lock-info h3 { color: #2A1000 }
.tech-sec .lock-info p { color: #5A3000 }
.tech-sec .lstat-n { color: #DD0000 }
.tech-sec .lstat-l { color: #5A3000 }
.tech-sec .lock-badge { background: #DD0000; color: #fff }
.steps-row {
  display:flex; align-items:flex-start; gap:var(--sp4);
  margin-bottom:clamp(var(--sp12),6vw,var(--sp20));
}
.step {
  flex:1; background: linear-gradient(180deg, var(--s1) 0%, rgba(255,216,53,.05) 100%);
  border:2px solid rgba(255,216,53,.15);
  border-radius:var(--rx); padding:var(--sp8) var(--sp6);
  transition:border-color var(--t),box-shadow var(--t),transform var(--t);
}
.step:hover { border-color:rgba(255,216,53,.45); box-shadow:var(--sh-y); transform:translateY(-5px) }
.step-top {
  display:flex; align-items:center; gap:var(--sp3); margin-bottom:var(--sp5);
}
.step-ico {
  width:48px; height:48px; background:#DD0000;
  border:none; border-radius:var(--rl);
  display:flex; align-items:center; justify-content:center;
  font-size:1.5rem; color:#fff; flex-shrink:0;
}
.step-num { font-family:var(--fd); font-size:var(--xl); font-weight:700; color:var(--txf); line-height:1 }
.step h3 { font-family:var(--fd); font-size:var(--lg); font-weight:700; color:#DD0000; margin-bottom:var(--sp3) }
.step p { font-size:var(--sm); color:#DD0000; max-width:24ch; font-weight:600 }
.step-arrow {
  display:flex; align-items:center; justify-content:center;
  color:var(--y); font-size:1.25rem; width:32px; flex-shrink:0; margin-top:88px;
}

/* ─── LOCK SHOWCASE (FIXED LAYOUT) ─── */
.lock-showcase {
  display:grid; grid-template-columns:1fr 1.2fr;
  gap:clamp(var(--sp8),4vw,var(--sp12)); align-items:start;
  background:var(--s1); border:2px solid rgba(255,216,53,.35);
  border-radius:var(--r2x); padding:clamp(var(--sp8),4vw,var(--sp12));
  position:relative; overflow:hidden;
  box-shadow: 0 16px 48px rgba(255,216,53,.18);
}
.lock-showcase::before {
  content:''; position:absolute; inset:0;
  background:linear-gradient(135deg,rgba(255,216,53,.10) 0%,rgba(221,0,0,.08) 100%);
  pointer-events:none;
}
.lock-info { display:flex; flex-direction:column; gap:var(--sp4); position:relative }
.lock-info h3 { font-family:var(--fd); font-size:var(--xl); font-weight:700; color:var(--tx) }
.lock-info p { font-size:var(--sm); color:var(--txm); max-width:38ch }
.lock-stats { display:flex; gap:var(--sp6); margin-block:var(--sp2) }
.lstat { display:flex; flex-direction:column }
.lstat-n { font-family:var(--fd); font-size:var(--lg); font-weight:700; color:var(--y) }
.lstat-l { font-size:var(--xs); color:var(--txm) }

/* Images: main full width, then 2x2 grid below */
.lock-imgs {
  position:relative;
  display:flex;
  flex-direction:column;
  gap:var(--sp3);
}
.lock-main {
  position:relative;
  border-radius:var(--rl); overflow:hidden;
  aspect-ratio:16/9;
  width:100%;
}
.lock-main img { width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease-out) }
.lock-main:hover img { transform:scale(1.05) }
.lock-badge {
  position:absolute; top:var(--sp3); right:var(--sp3);
  background:#FFD835; color:#2A1000; font-size:var(--xs);
  font-weight:700; padding:var(--sp1) var(--sp3); border-radius:var(--rf);
  box-shadow: 0 2px 8px rgba(255,216,53,.40);
}

/* 4 small images: 2 columns x 2 rows below main */
.lock-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:var(--sp3);
}
.lock-grid img {
  width:100%;
  aspect-ratio:4/3;
  object-fit:cover;
  border-radius:var(--rm);
  transition:transform .4s var(--ease-out);
  display:block;
}
.lock-grid img:hover { transform:scale(1.05) }

/* ─── VIDEOS ─── */
.video-sec {
  background: #FDD802;
  border-top:none; border-bottom:none;
}
.video-grid { display:grid; grid-template-columns:1fr; gap:var(--sp6); max-width:700px; margin-inline:auto }
.video-grid { display:grid; grid-template-columns:1fr; gap:var(--sp6); max-width:700px; margin-inline:auto }
.vcard {
  background:var(--s2); border:1px solid var(--b);
  border-radius:var(--rx); overflow:hidden;
  transform:translateY(-5px); box-shadow:var(--sh-md);
  transition:border-color var(--t),transform var(--t),box-shadow var(--t);
}
.vcard:hover { border-color:var(--bh); transform:translateY(-8px); box-shadow:var(--sh-lg) }
.vcard-thumb {
  display:block; width:100%; aspect-ratio:16/9;
  background-size:cover; background-position:center;
  position:relative; overflow:hidden;
  cursor:none;
}
.vcard-thumb::after {
  content:''; position:absolute; inset:0;
  background:rgba(26,10,0,.2); transition:background .3s;
}
.vcard:hover .vcard-thumb::after { background:rgba(26,10,0,.1) }
.vcard-play {
  position:absolute; top:50%; left:50%;
  transform:translate(-50%,-50%) scale(1);
  z-index:2; width:64px; height:64px;
  background:rgba(221,0,0,.9); border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  color:#fff; font-size:1.6rem;
  transition:transform .3s var(--ease-out),background .3s;
  box-shadow:0 4px 28px rgba(221,0,0,.5);
}
.vcard-thumb:hover .vcard-play { transform:translate(-50%,-50%) scale(1.1); background:var(--r) }
.vcard-tag {
  position:absolute; bottom:var(--sp3); left:var(--sp3); z-index:2;
  background:rgba(0,0,0,.65); color:var(--tx); font-size:var(--xs);
  font-weight:600; padding:var(--sp1) var(--sp3); border-radius:var(--rf);
  backdrop-filter:blur(8px);
}
/* Red variant — borders removed */
.vcard-red { border:none; box-shadow:none }
.vcard-red:hover { border:none; box-shadow:none }

.vcard-body { padding:var(--sp6) }
.vcard-body h3 { font-family:var(--fd); font-size:var(--lg); font-weight:600; color:var(--tx); margin-bottom:var(--sp2) }
.vcard-body p { font-size:var(--sm); color:var(--txm); max-width:40ch }

/* Lightbox */
.lightbox {
  position:fixed; inset:0; z-index:2000;
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none; transition:opacity .3s var(--ease-out);
}
.lightbox.open { opacity:1; pointer-events:all }
.lb-backdrop { position:absolute; inset:0; background:rgba(0,0,0,.92); backdrop-filter:blur(10px) }
.lb-box {
  position:relative; z-index:1;
  width:min(90vw,960px); border-radius:var(--rx); overflow:hidden;
  transform:scale(.94); transition:transform .3s var(--ease-out);
  box-shadow:var(--sh-lg);
}
.lightbox.open .lb-box { transform:scale(1) }
.lb-box video { width:100%; display:block; background:#000 }
.lb-close {
  position:absolute; top:var(--sp3); right:var(--sp3); z-index:2;
  width:36px; height:36px; background:rgba(0,0,0,.6);
  border-radius:var(--rf); display:flex; align-items:center;
  justify-content:center; color:var(--tx); font-size:1rem;
  transition:background var(--t); backdrop-filter:blur(8px);
}
.lb-close:hover { background:rgba(221,0,0,.7) }

/* ─── APP ─── */
.app-sec { background: #fff; color: #2A1000 }
.app-sec .eyebrow { color: #DD0000 }
.app-sec .sec-title { color: #2A1000 }
.app-sec .sec-sub { color: #5A3000 }
.app-sec::before {
  content:''; position:absolute;
  top:0; left:50%; transform:translateX(-50%);
  width:900px; height:900px;
  background:radial-gradient(circle,rgba(255,216,53,.10) 0%,transparent 60%);
  pointer-events:none;
}
.app-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--sp6); margin-bottom:var(--sp10) }
.acard {
  position:relative; background:#FFFEF5;
  border-radius:var(--rx); padding:var(--sp8) var(--sp6);
  overflow:hidden; display:flex; flex-direction:column; gap:var(--sp4);
  transform:translateY(-5px);
  transition:border-color var(--t),transform var(--t),box-shadow var(--t);
}
.acard.driver  { border:1px solid rgba(100,210,100,.3) }
.acard.restaurant { border:1px solid rgba(221,0,0,.3) }
.acard.user    { border:1px solid rgba(80,160,255,.3) }
.acard:hover { transform:translateY(-5px) }
.acard-glow { display:none }
.acard-icon { width:64px; height:64px; border-radius:var(--rl); object-fit:cover }
.acard-role { font-size:var(--xs); font-weight:700; letter-spacing:.08em; text-transform:uppercase }
.driver-role   { color:#64d264 }
.restaurant-role { color:var(--r2) }
.user-role     { color:#50a0ff }
.acard h3 { font-family:var(--fd); font-size:var(--xl); font-weight:700; color:#2A1000; line-height:1 }
.acard p { font-size:var(--sm); color:#5A3000 }
.acard-features { list-style:none; display:flex; flex-direction:column; gap:var(--sp2); flex:1 }
.acard-features li { display:flex; align-items:center; gap:var(--sp2); font-size:var(--sm); color:#5A3000 }
.acard-features li i { font-size:.75rem; color:#DD0000; flex-shrink:0 }
.acard-btns { display:flex; gap:var(--sp2); flex-wrap:wrap; margin-top:auto }
.acard .btn-outline { color:#2A1000; border-color:rgba(42,16,0,.2) }
.acard .btn-outline:hover { border-color:#DD0000; color:#DD0000 }

/* CTA Band */
.cta-band {
  background: linear-gradient(135deg, #FFD835, #FF7A00 50%, #DD0000);
  border:none; border-radius:var(--r2x);
  padding:clamp(var(--sp8),4vw,var(--sp12));
  position:relative; overflow:hidden;
  box-shadow: 0 16px 48px rgba(221,0,0,.2), 0 8px 24px rgba(255,216,53,.15);
}
.cta-band::before {
  content:''; position:absolute; inset:0;
  background: radial-gradient(ellipse at 30% 50%, rgba(255,255,255,.12) 0%, transparent 60%);
}
.cta-band-inner { position:relative; display:flex; align-items:center; gap:var(--sp6); flex-wrap:wrap }
.cta-ico { font-size:3rem; color:#fff; -webkit-text-fill-color:#fff; flex-shrink:0 }
.cta-band-inner > div { flex:1; min-width:200px }
.cta-band-inner h3 { font-family:var(--fd); font-size:var(--xl); font-weight:700; color:#fff; margin-bottom:var(--sp2) }
.cta-band-inner p { font-size:var(--sm); color:rgba(255,255,255,.85) }
.cta-band .btn-primary { margin-left:auto; flex-shrink:0; background:#fff; color:#DD0000; box-shadow:0 4px 22px rgba(0,0,0,.15) }
.cta-band .btn-primary:hover { box-shadow:0 6px 32px rgba(0,0,0,.25) }

/* ─── CONTACT ─── */
.contact-sec { background: var(--bg) }
.contact-grid {
  display:grid; grid-template-columns:1fr 1.2fr;
  gap:clamp(var(--sp12),8vw,var(--sp20)); align-items:start;
}
.contact-info { display:flex; flex-direction:column; gap:var(--sp6) }
.contact-list { list-style:none; display:flex; flex-direction:column; gap:var(--sp4) }
.contact-list li { display:flex; align-items:flex-start; gap:var(--sp4) }
.c-ico {
  width:44px; height:44px; background:rgba(255,216,53,.22);
  border:2px solid rgba(255,216,53,.45); border-radius:var(--rl);
  display:flex; align-items:center; justify-content:center;
  color:var(--y); font-size:1.1rem; flex-shrink:0;
  box-shadow: 0 4px 16px rgba(255,216,53,.20);
}
.c-label { display:block; font-size:var(--xs); color:var(--txf); letter-spacing:.08em; text-transform:uppercase; margin-bottom:2px }
.c-val { font-size:var(--base); font-weight:500; color:var(--tx); transition:color var(--t) }
.c-val:hover { color:var(--y) }
.social-row { display:flex; gap:var(--sp3) }
.soc-btn {
  width:40px; height:40px; background:var(--s1); border:1px solid var(--b);
  border-radius:var(--rm); display:flex; align-items:center; justify-content:center;
  color:var(--txm); font-size:1rem; transition:all var(--t);
}
.soc-btn:hover { background:rgba(255,216,53,.1); border-color:rgba(255,216,53,.3); color:var(--y); transform:translateY(-2px) }

.contact-form-wrap {
  background:var(--s1); border:1px solid var(--b);
  border-radius:var(--r2x); padding:clamp(var(--sp8),4vw,var(--sp10));
}
.cform { display:flex; flex-direction:column; gap:var(--sp5) }
.fg { display:flex; flex-direction:column; gap:var(--sp2) }
.fg label { font-size:var(--xs); font-weight:700; color:var(--txm); letter-spacing:.06em; text-transform:uppercase }
.fg input,.fg select,.fg textarea {
  width:100%; padding:var(--sp4) var(--sp5); background:var(--s2);
  border:1px solid var(--b); border-radius:var(--rm);
  color:var(--tx); font-size:var(--base); appearance:none;
  transition:border-color var(--t),box-shadow var(--t),background var(--t);
}
.fg input:focus,.fg select:focus,.fg textarea:focus {
  outline:none; border-color:var(--y);
  box-shadow:0 0 0 3px rgba(255,216,53,.12); background:var(--s3);
}
.fg input::placeholder,.fg textarea::placeholder { color:var(--txf) }
.fg textarea { resize:vertical }
.form-success {
  display:none; text-align:center; color:var(--y);
  font-size:var(--sm); font-weight:600; padding-top:var(--sp2);
}
.form-success.show { display:block }

/* ─── FOOTER ─── */
.footer { background:#FDD802; border-top:none; color:#2A1000 }
.footer .logo-text { color:#000 }
.footer .f-tagline { color:#DD0000; -webkit-text-fill-color:#DD0000 }
.footer .f-mission { color:#5A3000 }
.footer .f-col h4 { color:#5A3000 }
.footer .f-col a { color:#2A1000 }
.footer .f-col a:hover { color:#DD0000 }
.footer .f-contact-link { color:#2A1000 }
.footer .f-contact-link:hover { color:#DD0000 }
.footer .footer-bottom { border-top:1px solid rgba(42,16,0,.15) }
.footer .fbot-inner p { color:#5A3000 }
.footer-top { padding-block:clamp(var(--sp12),6vw,var(--sp16)) }
.footer-grid {
  display:grid; grid-template-columns:1.5fr repeat(3,1fr);
  gap:clamp(var(--sp8),5vw,var(--sp12));
}
.f-brand { display:flex; flex-direction:column; gap:var(--sp4) }
.f-logo { font-size:var(--xl) }
.f-tagline { font-family:var(--fd); font-size:var(--lg); font-weight:600; color:#DD0000; -webkit-text-fill-color:#DD0000 }
.f-mission { font-size:var(--sm); color:var(--txm); max-width:30ch; line-height:1.6 }
.f-col h4 { font-size:var(--xs); font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--txf); margin-bottom:var(--sp5) }
.f-col ul { list-style:none; display:flex; flex-direction:column; gap:var(--sp3) }
.f-col a { font-size:var(--sm); color:var(--txm); transition:color var(--t) }
.f-col a:hover { color:var(--y) }
.f-contact-link { display:flex; align-items:center; gap:var(--sp3); font-size:var(--sm); color:var(--txm); margin-bottom:var(--sp3); transition:color var(--t) }
.f-contact-link:hover { color:var(--y) }
.footer-bottom { border-top:1px solid var(--b); padding-block:var(--sp5) }
.fbot-inner { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:var(--sp4) }
.fbot-inner p { font-size:var(--xs); color:var(--txf) }

/* ─── RESPONSIVE ─── */
@media(max-width:1024px){
  .steps-row { flex-wrap:wrap; gap:var(--sp4) }
  .step-arrow { display:none }
  .step { flex:1 1 calc(50% - var(--sp4)) }
  .footer-grid { grid-template-columns:1fr 1fr }
}
@media(max-width:768px){
  .container { padding-inline:var(--sp4) }
  .hero-content { padding-inline:var(--sp4) }
  .hero-bottom { padding-inline:var(--sp4) }
  .hero-content { padding-top:var(--nav-h) }
  .nav-links,.nav-cta { display:none }
  .hamburger { display:flex }
  .nav-inner { padding-inline:var(--sp4); justify-content:flex-start; gap:var(--sp3) }
  .prob-header { grid-template-columns:1fr; padding-inline:var(--sp4) }
  .prob-divider { padding-inline:var(--sp4) }
  .prob-grid { grid-template-columns:1fr }
  .prob-mini-stats { grid-template-columns:repeat(2,1fr); gap:var(--sp3) }
  .step { flex:1 1 calc(50% - var(--sp4)) }
  .video-grid { grid-template-columns:1fr }
  .app-cards { grid-template-columns:1fr }
  .contact-grid { grid-template-columns:1fr }
  .footer-grid { grid-template-columns:1fr 1fr }
  .lock-showcase { grid-template-columns:1fr }
  .cta-band-inner { flex-direction:column; align-items:flex-start }
  .cta-band .btn-primary { width:100%; justify-content:center }
  .sec-header { padding-inline:var(--sp4) }
}
@media(max-width:480px){
  .hero { min-height:100dvh; align-items:flex-start }
  .hero-content { padding-top:calc(var(--nav-h) + var(--sp2)) }
  .hero-chip { margin-bottom:var(--sp3) }
  .hero-h1 { margin-bottom:var(--sp3) }
  .hero-p { margin-bottom:var(--sp5) }
  .hero-btns { flex-direction:row; flex-wrap:wrap; margin-bottom:var(--sp6); gap:var(--sp3) }
  .hero-btns .btn { font-size:var(--xs); padding:var(--sp3) var(--sp4) }
  .hero-stats .hstat-sep { display:none }
  .footer-grid { grid-template-columns:1fr }
}