/* =====================================================
   SELLORRA WEBSITE — Global Styles
   ===================================================== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --orange:        #E65100;
  --orange-soft:   #F97316;
  --orange-press:  #C44600;
  --dark:          #222222;
  --body:          #555555;
  --muted:         #9E9E9E;
  --border:        #EEEEEE;
  --bg-alt:        #F7F7F8;
  --white:         #FFFFFF;
  --font:          'Roboto', system-ui, -apple-system, sans-serif;
  --shadow-card:   0 4px 20px rgba(0,0,0,0.07);
  --shadow-raised: 0 12px 40px rgba(0,0,0,0.12);
  --shadow-orange: 0 8px 24px rgba(230,81,0,0.35);
  --max-w:         1200px;
}

html  { scroll-behavior: smooth; }
body  { font-family: var(--font); color: var(--dark); background: var(--white); -webkit-font-smoothing: antialiased; }
img   { max-width: 100%; display: block; }
a     { color: inherit; }

.max-w { max-width: var(--max-w); margin: 0 auto; padding: 0 28px; }

/* ── NAV ─────────────────────────────────────────── */
#mainNav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 200;
  background: #fff; border-bottom: 1px solid var(--border);
  box-shadow: 0 2px 16px rgba(0,0,0,0.06);
  transition: box-shadow .3s;
}
.nav-inner {
  max-width: var(--max-w); margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 28px; height: 68px;
}
.nav-logo    { display:flex; align-items:center; gap:10px; text-decoration:none; }
.nav-logo img{ width:34px; height:34px; border-radius:8px; }
.nav-wordmark{ font-size:20px; font-weight:900; color:var(--dark); letter-spacing:-.3px; }
.nav-links   { display:flex; align-items:center; gap:30px; list-style:none; }
.nav-links a {
  font-size:14px; font-weight:500; color:#666;
  text-decoration:none; transition:color .18s; position:relative;
}
.nav-links a::after {
  content:''; position:absolute; bottom:-4px; left:0; right:0;
  height:2px; background:var(--orange); border-radius:2px;
  transform:scaleX(0); transition:transform .2s;
}
.nav-links a:hover { color:var(--orange); }
.nav-links a:hover::after { transform:scaleX(1); }
.nav-right { display:flex; align-items:center; gap:12px; }
.nav-cta {
  background:var(--orange); color:#fff;
  border:none; border-radius:10px; padding:11px 24px;
  font-family:var(--font); font-size:14px; font-weight:700;
  cursor:pointer; text-decoration:none;
  box-shadow:var(--shadow-orange); transition:background .18s, box-shadow .18s;
}
.nav-cta:hover { background:var(--orange-press); }

/* Burger */
.nav-burger {
  display:none; flex-direction:column; justify-content:center; gap:5px;
  background:none; border:none; cursor:pointer; padding:6px; width:36px; height:36px;
}
.nav-burger span {
  display:block; height:2px; background:var(--dark); border-radius:2px;
  transition:transform .25s, opacity .25s;
}
.nav-burger.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.nav-burger.open span:nth-child(2) { opacity:0; }
.nav-burger.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

/* Mobile drawer */
.nav-drawer {
  position:fixed; top:68px; left:0; right:0; z-index:190;
  background:#fff; border-bottom:1px solid var(--border);
  padding:12px 0 20px; transform:translateY(-110%); transition:transform .3s ease;
  box-shadow:0 8px 24px rgba(0,0,0,0.08);
}
.nav-drawer.open { transform:translateY(0); }
.nav-drawer ul   { list-style:none; }
.nav-drawer a    {
  display:block; padding:14px 28px;
  font-size:16px; font-weight:500; color:var(--dark); text-decoration:none;
  transition:color .18s, background .18s;
}
.nav-drawer a:hover    { color:var(--orange); background:rgba(230,81,0,0.04); }
.nav-drawer .drawer-cta{
  margin:12px 28px 0; padding:14px 24px; text-align:center;
  background:var(--orange); color:#fff !important; border-radius:10px;
  font-weight:700;
}
.nav-overlay {
  display:none; position:fixed; inset:0; z-index:180;
  background:rgba(0,0,0,0.28); backdrop-filter:blur(2px);
}
.nav-overlay.open { display:block; }

/* ── SECTION SHARED ──────────────────────────────── */
.section-tag {
  font-size:11px; font-weight:700; letter-spacing:1.1px;
  text-transform:uppercase; color:var(--orange); margin-bottom:12px;
  display:block;
}
.section-h2 {
  font-size:clamp(28px,3.8vw,46px); font-weight:900;
  color:var(--dark); letter-spacing:-1.2px; line-height:1.08; margin-bottom:14px;
}
.section-sub { font-size:16px; color:var(--body); line-height:1.7; max-width:560px; }

/* ── HERO ─────────────────────────────────────────── */
.hero {
  background:var(--orange);
  background-image:
    radial-gradient(ellipse at 80% 0%,   #F97316 0%, transparent 48%),
    radial-gradient(ellipse at 10% 100%, #C44600 0%, transparent 48%);
  padding:110px 28px 84px; position:relative; overflow:hidden;
  min-height:100vh; display:flex; align-items:center;
}
.hero::before {
  content:''; position:absolute; inset:0;
  background-image:radial-gradient(circle at 1.5px 1.5px, rgba(255,255,255,.10) 1.5px, transparent 0);
  background-size:28px 28px; pointer-events:none;
}
.h-blob { position:absolute; border-radius:50%; pointer-events:none; will-change:transform; }
.h-blob-1 {
  width:600px; height:600px; top:-200px; right:-160px;
  background:radial-gradient(circle, rgba(255,255,255,.07) 0%, transparent 70%);
  animation:blobDrift1 12s ease-in-out infinite;
}
.h-blob-2 {
  width:480px; height:480px; bottom:-160px; left:-120px;
  background:radial-gradient(circle, rgba(0,0,0,.08) 0%, transparent 70%);
  animation:blobDrift2 16s ease-in-out infinite;
}
.h-blob-3 {
  width:260px; height:260px; top:40%; left:36%;
  background:radial-gradient(circle, rgba(255,255,255,.05) 0%, transparent 70%);
  animation:blobDrift1 10s ease-in-out infinite reverse;
}
@keyframes blobDrift1 {
  0%,100% { transform:translate(0,0) scale(1); }
  50%     { transform:translate(30px,-24px) scale(1.04); }
}
@keyframes blobDrift2 {
  0%,100% { transform:translate(0,0) scale(1); }
  50%     { transform:translate(-24px,32px) scale(1.06); }
}
.hero-inner {
  max-width:var(--max-w); margin:0 auto; width:100%;
  display:grid; grid-template-columns:1fr 1.15fr; gap:64px; align-items:center;
  position:relative; z-index:1;
}

/* Hero copy */
.hero-eyebrow {
  display:inline-flex; align-items:center; gap:9px;
  background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.28);
  border-radius:999px; padding:7px 18px; margin-bottom:30px;
  font-size:12px; font-weight:700; letter-spacing:.8px;
  text-transform:uppercase; color:#fff;
}
.hero-live-dot {
  width:8px; height:8px; border-radius:50%; background:#4ADE80; flex-shrink:0;
  animation:livePulse 1.4s ease-in-out infinite;
}
@keyframes livePulse {
  0%,100% { box-shadow:0 0 0 0 rgba(74,222,128,.55); }
  60%     { box-shadow:0 0 0 6px rgba(74,222,128,0); }
}
h1.hero-title {
  font-size:clamp(44px,6vw,78px); font-weight:900;
  color:#fff; line-height:1.0; letter-spacing:-2.5px; margin-bottom:22px;
}
.hero-sub {
  font-size:17px; color:rgba(255,255,255,.72); line-height:1.72;
  max-width:400px; margin-bottom:44px;
}
.hero-trust   { display:flex; align-items:center; gap:16px; }
.avatar-group { display:flex; }
.avatar-chip  {
  width:34px; height:34px; border-radius:50%;
  border:2.5px solid var(--orange); background:rgba(255,255,255,.22);
  margin-left:-9px; display:flex; align-items:center; justify-content:center;
  font-size:11px; font-weight:700; color:#fff;
}
.avatar-chip:first-child { margin-left:0; }
.trust-text { font-size:13px; color:rgba(255,255,255,.80); font-weight:500; line-height:1.5; }
.trust-text strong { color:#fff; display:block; }

/* Track card */
.track-card {
  background:#fff; border-radius:24px; padding:38px;
  box-shadow:0 36px 80px rgba(0,0,0,.24), 0 0 0 1.5px rgba(255,255,255,.08);
}
.tc-top {
  display:flex; align-items:flex-start; justify-content:space-between;
  margin-bottom:8px; gap:12px;
}
.tc-title { font-size:21px; font-weight:900; color:var(--dark); letter-spacing:-.5px; }
.tc-sub   { font-size:13px; color:var(--muted); margin-bottom:26px; margin-top:4px; }
.tc-live-badge {
  display:inline-flex; align-items:center; gap:6px; flex-shrink:0;
  background:rgba(34,197,94,.10); border:1px solid rgba(34,197,94,.28);
  border-radius:999px; padding:5px 13px;
}
.tc-live-dot  { width:7px; height:7px; border-radius:50%; background:#22c55e; animation:livePulse 1.4s ease-in-out infinite; }
.tc-live-text { font-size:10px; font-weight:700; letter-spacing:.7px; text-transform:uppercase; color:#16a34a; }
.tc-input {
  width:100%; padding:17px 20px;
  background:#F5F5F5; border:2px solid transparent; border-radius:14px;
  font-family:var(--font); font-size:16px; font-weight:500; color:var(--dark);
  outline:none; transition:border-color .2s, background .2s;
  letter-spacing:.8px; margin-bottom:12px; display:block;
}
.tc-input::placeholder { color:#BDBDBD; font-weight:400; letter-spacing:0; }
.tc-input:focus { border-color:var(--orange); background:#fff; }
.tc-btn {
  width:100%; padding:18px; border:none; border-radius:14px;
  background:var(--orange); color:#fff;
  font-family:var(--font); font-size:17px; font-weight:700;
  cursor:pointer; display:flex; align-items:center; justify-content:center; gap:10px;
  box-shadow:0 10px 28px rgba(230,81,0,.38);
  transition:background .18s, transform .1s, box-shadow .2s;
  position:relative; overflow:hidden; letter-spacing:-.2px;
}
.tc-btn-arrow { font-size:20px; transition:transform .2s; }
.tc-btn:hover .tc-btn-arrow { transform:translateX(4px); }
.tc-btn:hover { background:var(--orange-press); box-shadow:0 14px 36px rgba(230,81,0,.45); }
.tc-btn:active { transform:scale(.99); }
.tc-btn::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.14), transparent);
  transform:translateX(-120%);
}
.tc-btn:hover::after { transition:transform .55s ease; transform:translateX(120%); }
.tc-hint { font-size:12px; color:#BDBDBD; margin-top:12px; text-align:center; }
.tc-hint span { color:var(--orange); font-weight:600; cursor:pointer; }
.tc-hint span:hover { text-decoration:underline; }
.tc-error {
  display:none; margin-top:16px;
  background:rgba(211,47,47,.06); border:1px solid rgba(211,47,47,.16);
  border-radius:10px; padding:12px 16px; font-size:13px; color:#D32F2F;
}
.tc-loading {
  display:none; margin-top:16px; text-align:center;
  font-size:13px; color:var(--muted);
}
.tc-result { display:none; margin-top:26px; padding-top:24px; border-top:1.5px solid var(--border); }
.tc-result.show { display:block; animation:resultIn .32s ease forwards; }
@keyframes resultIn {
  from { opacity:0; transform:translateY(-8px); }
  to   { opacity:1; transform:translateY(0); }
}
.tc-order-badge {
  display:inline-flex; align-items:center; gap:6px;
  background:rgba(230,81,0,.08); border-radius:8px; padding:5px 12px;
  font-size:11px; font-weight:700; color:var(--orange); letter-spacing:.5px;
  text-transform:uppercase; margin-bottom:16px;
}
.tc-rider-card {
  display:flex; align-items:center; gap:12px;
  background:rgba(230,81,0,.05); border:1px solid rgba(230,81,0,.12);
  border-radius:14px; padding:14px 16px; margin-bottom:20px;
}
.tc-rider-avatar {
  width:40px; height:40px; border-radius:50%; background:var(--orange);
  display:flex; align-items:center; justify-content:center;
  font-size:13px; font-weight:700; color:#fff; flex-shrink:0;
}
.tc-rider-name { font-size:14px; font-weight:700; color:var(--dark); }
.tc-rider-sub  { font-size:11px; color:var(--muted); margin-top:1px; }
.tc-rider-eta  { font-size:14px; font-weight:700; color:var(--orange); margin-left:auto; white-space:nowrap; }
.tc-progress   { margin-bottom:20px; }
.tc-progress-labels {
  display:flex; justify-content:space-between;
  font-size:11px; color:var(--muted); margin-bottom:8px; font-weight:500;
}
.tc-progress-track { height:7px; background:var(--border); border-radius:999px; overflow:hidden; }
.tc-progress-fill  {
  height:100%; background:linear-gradient(90deg, var(--orange-press), var(--orange-soft));
  border-radius:999px; transition:width 1.2s cubic-bezier(.4,0,.2,1); width:0%;
}
.tc-steps { display:flex; flex-direction:column; }
.tcstep   { display:flex; gap:12px; }
.tcstep-aside { display:flex; flex-direction:column; align-items:center; flex-shrink:0; }
.tcstep-dot   { width:11px; height:11px; border-radius:50%; margin-top:3px; flex-shrink:0; }
.tcstep-dot.active { background:var(--orange)!important; animation:stepPulse 1.4s ease-in-out infinite; }
@keyframes stepPulse {
  0%,100% { box-shadow:0 0 0 0 rgba(230,81,0,.45); }
  55%     { box-shadow:0 0 0 5px rgba(230,81,0,0); }
}
.tcstep-line  { width:2px; min-height:16px; flex:1; border-radius:2px; }
.tcstep-body  { padding-bottom:12px; }
.tcstep-label { font-size:13px; font-weight:600; color:var(--dark); }
.tcstep-label.dim     { color:#D0D0D0; font-weight:400; }
.tcstep-label.current { color:var(--orange); }
.tcstep-time  { font-size:11px; color:var(--muted); margin-top:1px; }

/* ── HOW IT WORKS ────────────────────────────────── */
.how { padding:104px 28px; background:var(--white); }
.how-steps {
  display:grid; grid-template-columns:repeat(4,1fr); gap:0;
  margin-top:60px; position:relative;
}
.how-steps::before {
  content:''; position:absolute; top:27px;
  left:calc(12.5% + 20px); right:calc(12.5% + 20px);
  height:1px; background:linear-gradient(to right, var(--orange) 0%, rgba(230,81,0,.12) 100%);
}
.how-step { padding-right:32px; }
.how-step:last-child { padding-right:0; }
.how-step-num {
  width:54px; height:54px; border-radius:15px; margin-bottom:20px;
  display:flex; align-items:center; justify-content:center;
  font-size:20px; font-weight:900; position:relative; z-index:1;
  background:var(--white); border:2px solid var(--orange); color:var(--orange);
}
.how-step-num.dim { border-color:var(--border); color:var(--muted); }
.how-step-title { font-size:16px; font-weight:700; color:var(--dark); margin-bottom:8px; }
.how-step-desc  { font-size:13px; color:var(--body); line-height:1.65; }

/* ── SERVICES ────────────────────────────────────── */
.services      { padding:104px 28px; background:var(--bg-alt); }
.services-head { text-align:center; margin-bottom:56px; }
.services-head .section-sub { margin:0 auto; text-align:center; }
.svc-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.svc-card {
  background:var(--white); border-radius:20px; padding:32px 24px;
  border:1px solid var(--border); box-shadow:var(--shadow-card);
  transition:transform .2s, box-shadow .2s;
}
.svc-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-raised); }
.svc-icon {
  width:56px; height:56px; border-radius:15px;
  background:rgba(230,81,0,.08);
  display:flex; align-items:center; justify-content:center; margin-bottom:20px;
}
.svc-name { font-size:17px; font-weight:700; color:var(--dark); margin-bottom:8px; }
.svc-desc { font-size:13px; color:var(--body); line-height:1.65; }

/* ── STATS ───────────────────────────────────────── */
.stats { background:var(--orange); padding:56px 28px; }
.stats-inner {
  max-width:var(--max-w); margin:0 auto;
  display:grid; grid-template-columns:repeat(4,1fr); gap:24px; text-align:center;
}
.stat-num   { font-size:44px; font-weight:900; color:#fff; letter-spacing:-1px; line-height:1; margin-bottom:6px; }
.stat-label { font-size:13px; color:rgba(255,255,255,.70); font-weight:500; }

/* ── DOWNLOAD ────────────────────────────────────── */
.download {
  background:#1A1A1A; padding:104px 28px; position:relative; overflow:hidden;
}
.download::before {
  content:''; position:absolute; bottom:-200px; left:-150px;
  width:600px; height:600px; border-radius:50%;
  background:radial-gradient(circle, rgba(230,81,0,.10) 0%, transparent 65%);
  pointer-events:none;
}
.download-inner {
  max-width:var(--max-w); margin:0 auto;
  display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center;
}
.dl-badges { display:flex; gap:14px; margin-top:36px; flex-wrap:wrap; }
.dl-badge  {
  display:flex; align-items:center; gap:12px;
  background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.13);
  border-radius:13px; padding:13px 20px; text-decoration:none;
  transition:background .2s, border-color .2s;
}
.dl-badge:hover { background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.22); }
.dl-icon    { font-size:30px; line-height:1; }
.dl-text-sm { font-size:10px; color:rgba(255,255,255,.50); margin-bottom:1px; }
.dl-text-lg { font-size:17px; font-weight:700; color:#fff; line-height:1; }
.dl-phone-wrap { display:flex; justify-content:center; }

/* Phone mockup */
.track-phone {
  width:288px; background:#0C0D10;
  border-radius:48px; border:7px solid #252629;
  box-shadow:0 40px 90px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.05);
  position:relative; overflow:hidden; display:flex; flex-direction:column;
  min-height:540px;
}
.tp-notch {
  position:absolute; top:0; left:50%; transform:translateX(-50%);
  width:90px; height:26px; background:#0C0D10;
  border-radius:0 0 18px 18px; z-index:5;
}
.tp-screen { flex:1; display:flex; flex-direction:column; background:#F5F5F5; overflow:hidden; }
.tp-map    {
  flex:1; min-height:280px;
  background:linear-gradient(0deg,#e9efe9 0%,#eef2ee 100%);
  position:relative; overflow:hidden;
}
.tp-topbar {
  position:absolute; top:0; left:0; right:0;
  background:rgba(255,255,255,.93); padding:28px 14px 10px;
  display:flex; align-items:center; gap:8px;
}
.tp-topbar-title { font-size:12px; font-weight:700; color:#222; }
.tp-sheet {
  background:#fff; border-radius:22px 22px 0 0; padding:16px 14px 12px;
  box-shadow:0 -4px 16px rgba(0,0,0,.08); flex-shrink:0;
}
.tp-rider { display:flex; align-items:center; gap:10px; margin-bottom:14px; }
.tp-avatar {
  width:34px; height:34px; border-radius:50%; background:var(--orange);
  display:flex; align-items:center; justify-content:center;
  font-size:11px; font-weight:700; color:#fff; flex-shrink:0;
}
.tp-rider-name { font-size:12px; font-weight:700; color:#222; }
.tp-rider-sub  { font-size:9px;  color:#9E9E9E; margin-top:1px; }
.tp-eta   { font-size:12px; font-weight:700; color:var(--orange); margin-left:auto; }
.tp-tl    { display:flex; flex-direction:column; }
.tp-step  { display:flex; gap:8px; align-items:flex-start; }
.tp-dot   { width:8px; height:8px; border-radius:50%; margin-top:2px; flex-shrink:0; }
.tp-line  { width:1.5px; height:14px; margin-left:3px; flex-shrink:0; }
.tp-step-label { font-size:10px; padding-bottom:5px; }

/* ── B2B PLANS ───────────────────────────────────── */
.plans      { padding:104px 28px; background:var(--white); }
.plans-head { text-align:center; margin-bottom:56px; max-width:700px; margin-left:auto; margin-right:auto; }
.plans-head .section-sub { margin:0 auto; text-align:center; }
.plans-grid {
  display:grid; grid-template-columns:repeat(4,1fr); gap:20px;
}
.plan-card {
  border-radius:22px; padding:32px 22px;
  border:1.5px solid var(--border);
  position:relative; transition:transform .2s, box-shadow .2s;
}
.plan-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-raised); }
.plan-card.featured { border-color:var(--orange); background:rgba(230,81,0,.025); }
.plan-tag {
  position:absolute; top:-13px; left:50%; transform:translateX(-50%);
  background:var(--orange); color:#fff;
  font-size:10px; font-weight:700; letter-spacing:.8px; text-transform:uppercase;
  padding:4px 16px; border-radius:999px; white-space:nowrap;
}
.plan-name  { font-size:20px; font-weight:700; color:var(--dark); margin-bottom:4px; }
.plan-desc  { font-size:13px; color:var(--muted); margin-bottom:24px; }
.plan-price { font-size:36px; font-weight:900; color:var(--dark); letter-spacing:-1px; line-height:1; }
.plan-mo    { font-size:12px; color:var(--muted); margin-bottom:26px; margin-top:4px; }
.plan-feats { list-style:none; display:flex; flex-direction:column; gap:11px; margin-bottom:30px; }
.plan-feats li { font-size:14px; color:var(--body); display:flex; align-items:center; gap:9px; }
.feat-check { color:#2E8B57; font-weight:700; font-size:15px; }
.plan-btn {
  width:100%; padding:14px; border-radius:10px; border:none;
  font-family:var(--font); font-size:15px; font-weight:700; cursor:pointer;
  transition:background .2s, box-shadow .2s;
}
.plan-btn.primary { background:var(--orange); color:#fff; box-shadow:var(--shadow-orange); }
.plan-btn.primary:hover { background:var(--orange-press); }
.plan-btn.outline { background:transparent; color:var(--dark); border:1.5px solid var(--border); }
.plan-btn.outline:hover { border-color:#aaa; background:var(--bg-alt); }

/* ── FOOTER ──────────────────────────────────────── */
footer {
  background:#1A1A1A; padding:72px 28px 40px;
  border-top:1px solid rgba(255,255,255,.05);
}
.footer-grid {
  display:grid; grid-template-columns:2fr 1fr 1fr 1fr;
  gap:48px; margin-bottom:56px;
}
.footer-brand .nav-logo { margin-bottom:0; }
.footer-desc  {
  font-size:14px; color:rgba(255,255,255,.40); line-height:1.75;
  margin-top:18px; max-width:280px;
}
.footer-social { display:flex; gap:16px; margin-top:20px; }
.footer-social a {
  color:rgba(255,255,255,.40); transition:color .2s; text-decoration:none;
}
.footer-social a:hover { color:#fff; }
.footer-col h5 {
  font-size:11px; font-weight:700; letter-spacing:1.1px; text-transform:uppercase;
  color:rgba(255,255,255,.30); margin-bottom:20px;
}
.footer-col a {
  display:block; font-size:14px; color:rgba(255,255,255,.55);
  text-decoration:none; margin-bottom:13px; transition:color .2s;
}
.footer-col a:hover { color:#fff; }
.footer-bottom {
  border-top:1px solid rgba(255,255,255,.06); padding-top:28px;
  display:flex; align-items:center; justify-content:space-between;
}
.footer-bottom p { font-size:13px; color:rgba(255,255,255,.28); }

/* ── LEGAL PAGES ─────────────────────────────────── */
.legal-hero {
  background:var(--orange);
  padding:130px 28px 60px;
  text-align:center;
}
.legal-hero h1 {
  font-size:clamp(32px,5vw,56px); font-weight:900;
  color:#fff; letter-spacing:-1.5px; margin-bottom:12px;
}
.legal-hero p { font-size:16px; color:rgba(255,255,255,.75); }
.legal-body {
  max-width:780px; margin:0 auto; padding:72px 28px 96px;
}
.legal-body h2 {
  font-size:22px; font-weight:700; color:var(--dark);
  margin-top:44px; margin-bottom:14px; letter-spacing:-.4px;
}
.legal-body h3 {
  font-size:16px; font-weight:700; color:var(--dark);
  margin-top:28px; margin-bottom:10px;
}
.legal-body p, .legal-body li {
  font-size:15px; color:var(--body); line-height:1.8; margin-bottom:14px;
}
.legal-body ul { padding-left:20px; margin-bottom:14px; }
.legal-body ul li { margin-bottom:8px; }
.legal-body a { color:var(--orange); text-decoration:none; }
.legal-body a:hover { text-decoration:underline; }
.legal-date {
  display:inline-block; background:rgba(230,81,0,.08);
  border:1px solid rgba(230,81,0,.15); border-radius:8px;
  padding:8px 16px; font-size:13px; color:var(--orange);
  font-weight:600; margin-bottom:36px;
}

/* ── RESPONSIVE ──────────────────────────────────── */

/* Large tablets — 4-col plans become 2×2 */
@media (max-width:1100px) {
  .plans-grid { grid-template-columns:repeat(2,1fr); }
}

/* Tablets */
@media (max-width:1000px) {
  .hero-inner     { grid-template-columns:1fr; gap:48px; }
  .how-steps      { grid-template-columns:1fr 1fr; gap:36px; }
  .how-steps::before { display:none; }
  .svc-grid       { grid-template-columns:1fr 1fr; }
  .stats-inner    { grid-template-columns:1fr 1fr; gap:36px; }
  .download-inner { grid-template-columns:1fr; text-align:center; }
  .dl-badges      { justify-content:center; }
  .dl-phone-wrap  { order:-1; }
  .footer-grid    { grid-template-columns:1fr 1fr; gap:36px; }
}

/* Mobile */
@media (max-width:600px) {
  .hero           { padding:100px 20px 60px; min-height:auto; }
  h1.hero-title   { letter-spacing:-1.5px; }
  .track-card     { padding:24px 18px; }
  .how-steps      { grid-template-columns:1fr; }
  .svc-grid       { grid-template-columns:1fr; }
  .stats-inner    { grid-template-columns:1fr 1fr; gap:20px; }
  .stat-num       { font-size:32px; }
  .plans-grid     { grid-template-columns:1fr; }
  .nav-links      { display:none; }
  .nav-burger     { display:flex; }
  .footer-grid    { grid-template-columns:1fr; }
  .footer-bottom  { flex-direction:column; gap:8px; text-align:center; }
  .legal-body     { padding:48px 20px 72px; }
  .download       { padding:72px 20px; }
  .how, .services, .plans { padding:72px 20px; }
  .how-step-num   { width:44px; height:44px; font-size:16px; }
  .plan-price     { font-size:28px; }
  .section-h2     { letter-spacing:-.8px; }
  .dl-phone-wrap  { display:none; }
}