@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

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

:root {
  --navy: #060E1A;
  --royal: #1E4BD4;
  --cobalt: #2D6FE8;
  --accent: #5B8EF4;
  --gold: #F5C842;
  --light: #EEF4FF;
  --white: #fff;
  --text-body: #0D1520;
  --text-muted: rgba(13,21,32,0.55);
}

html { scroll-behavior: smooth; }

body {
  font-family: 'Inter', sans-serif;
  background: #fff;
  color: var(--text-body);
  overflow-x: hidden;
}

/* ── ANIMATIONS (loop/hover — GSAP maneja las entradas) ── */
@keyframes fadeIn     { from { opacity:0 } to { opacity:1 } }
@keyframes float      { 0%,100% { transform:translateY(0) rotate(0deg) } 50% { transform:translateY(-16px) rotate(0.4deg) } }
@keyframes floatPhone { 0%,100% { transform:translateY(0) rotateY(-6deg) rotateX(2deg) } 50% { transform:translateY(-14px) rotateY(-6deg) rotateX(2deg) } }
@keyframes pulse      { 0%,100% { box-shadow:0 0 0 0 rgba(30,75,212,0.45) } 70% { box-shadow:0 0 0 18px rgba(30,75,212,0) } }
@keyframes pingRing   { 0% { r:10; opacity:0.85; stroke-width:2.5 } 100% { r:36; opacity:0; stroke-width:0.5 } }
@keyframes zoomCol    { 0%,45% { transform:scale(1) translate(0,0) } 75%,100% { transform:scale(3.1) translate(-6px,16px) } }
@keyframes colAppear  { 0%,55% { fill:rgba(45,111,232,0.22) } 75%,100% { fill:#F5C842; filter:drop-shadow(0 0 10px rgba(245,200,66,0.8)) } }
@keyframes routeLine  { from { stroke-dashoffset:500 } to { stroke-dashoffset:0 } }
@keyframes shimmer    { 0%,100% { opacity:0.3 } 50% { opacity:1 } }
@keyframes notifBar   { from { width:20% } to { width:70% } }
@keyframes eyebrowDot { 0%,100% { opacity:1; transform:scale(1) } 50% { opacity:0.35; transform:scale(0.65) } }
@keyframes gradShift  { 0%,100% { background-position:0% 50% } 50% { background-position:100% 50% } }
@keyframes orbFloat   { 0%,100% { transform:translate(0,0) scale(1) } 33% { transform:translate(28px,-18px) scale(1.06) } 66% { transform:translate(-18px,14px) scale(0.95) } }
@keyframes statBar    { from { transform:scaleX(0) } to { transform:scaleX(1) } }
@keyframes slideLeft  { from { opacity:0; transform:translateX(-28px) } to { opacity:1; transform:translateX(0) } }
@keyframes scaleIn    { from { opacity:0; transform:scale(0.86) } to { opacity:1; transform:scale(1) } }

/* .reveal — GSAP maneja opacity/transform, solo necesitamos la clase para selección */
.reveal { will-change: transform, opacity; }

/* ── NAV ── */
#navbar {
  position: sticky; top: 0; z-index: 200;
  height: 68px; padding: 0 48px;
  display: flex; align-items: center; justify-content: space-between;
  background: rgba(6,14,26,0.93);
  backdrop-filter: blur(24px) saturate(180%);
  border-bottom: 0.5px solid rgba(255,255,255,0.07);
  transition: background 0.3s;
}
.nav-logo { display:flex; align-items:center; gap:10px; text-decoration:none; }
.nav-logo-icon { width:34px; height:34px; border-radius:10px; background:var(--royal); display:flex; align-items:center; justify-content:center; }
.nav-logo-icon i { font-size:18px; color:#fff; }
.nav-logo-text { color:#fff; font-size:20px; font-weight:700; letter-spacing:-0.5px; }
.nav-logo-text span { color:var(--accent); }
.nav-logo-img { height:36px; width:auto; object-fit:contain; border-radius:8px; }
.nav-links { display:flex; gap:4px; }
.nav-links a { color:rgba(255,255,255,0.55); text-decoration:none; font-size:14px; font-weight:500; padding:7px 14px; border-radius:8px; transition:all 0.2s; }
.nav-links a:hover { color:#fff; background:rgba(255,255,255,0.07); }
.nav-right { display:flex; align-items:center; gap:12px; }
.nav-cta { background:var(--royal); color:#fff; text-decoration:none; padding:9px 22px; border-radius:9px; font-size:14px; font-weight:600; cursor:pointer; transition:all 0.25s; display:flex; align-items:center; gap:7px; }
.nav-cta:hover { background:var(--cobalt); transform:translateY(-1px); box-shadow:0 8px 24px rgba(30,75,212,0.35); }
.hamburger { display:none; background:transparent; border:none; cursor:pointer; color:#fff; font-size:22px; }

/* ── HERO ── */
.hero {
  background: var(--navy);
  min-height: 680px;
  display: grid; grid-template-columns: 1fr 1fr; align-items: center;
  padding: 90px 48px 80px; gap: 40px; position: relative; overflow: hidden;
}
.hero::before {
  content:''; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(ellipse 800px 600px at 60% 40%, rgba(30,75,212,0.15) 0%, transparent 60%),
    radial-gradient(ellipse 400px 300px at 20% 80%, rgba(45,111,232,0.08) 0%, transparent 50%);
}
.hero::after {
  content:''; position:absolute; inset:0; pointer-events:none;
  background-image: linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
  background-size: 60px 60px;
  mask-image: radial-gradient(ellipse at 30% 50%, rgba(0,0,0,0.6), transparent 70%);
}
.hero-content { z-index:2; }

.hero-eyebrow {
  display:inline-flex; align-items:center; gap:8px;
  background:rgba(91,142,244,0.12); border:0.5px solid rgba(91,142,244,0.35);
  color:var(--accent); font-size:12px; font-weight:600; letter-spacing:0.3px;
  padding:6px 14px; border-radius:100px; margin-bottom:28px;
}
.eyebrow-dot { width:6px; height:6px; border-radius:50%; background:var(--accent); display:block; animation:eyebrowDot 1.8s ease-in-out infinite; }

.hero h1 { color:#fff; font-size:52px; font-weight:700; line-height:1.1; letter-spacing:-1.5px; margin-bottom:22px; }
/* .grad defined below with animation */

.hero-desc { color:rgba(255,255,255,0.55); font-size:17px; line-height:1.75; max-width:440px; margin-bottom:40px; }

.hero-actions { display:flex; gap:14px; flex-wrap:wrap; }
.cta-main {
  background:var(--royal); color:#fff; text-decoration:none; border:none;
  padding:15px 32px; border-radius:12px; font-size:15px; font-weight:600; font-family:'Inter',sans-serif;
  cursor:pointer; display:flex; align-items:center; gap:9px; letter-spacing:-0.2px;
  animation:pulse 2.5s 3s ease-in-out infinite; transition:all 0.25s;
}
.cta-main:hover { background:var(--cobalt); animation:none; transform:translateY(-2px); box-shadow:0 12px 32px rgba(30,75,212,0.4); }
.cta-ghost {
  background:rgba(255,255,255,0.06); color:rgba(255,255,255,0.85);
  border:0.5px solid rgba(255,255,255,0.15); padding:15px 28px; border-radius:12px;
  font-size:15px; font-weight:500; font-family:'Inter',sans-serif;
  cursor:pointer; display:flex; align-items:center; gap:9px; transition:all 0.25s;
}
.cta-ghost:hover { background:rgba(255,255,255,0.1); border-color:rgba(255,255,255,0.3); transform:translateY(-1px); }

/* ── SEARCH WIDGET ── */
.search-widget {
  background:rgba(10,18,38,0.72);
  border:1px solid rgba(255,255,255,0.10);
  border-radius:24px;
  backdrop-filter:blur(24px);
  -webkit-backdrop-filter:blur(24px);
  overflow:hidden;
  box-shadow:0 24px 64px rgba(0,0,0,0.4), 0 0 0 1px rgba(255,255,255,0.04) inset;
}
.sw-header {
  display:flex; align-items:center; gap:10px;
  padding:16px 20px;
  border-bottom:1px solid rgba(255,255,255,0.06);
  background:rgba(30,75,212,0.10);
}
.sw-header > i { font-size:17px; color:var(--accent); }
.sw-header > span { font-size:13px; font-weight:600; color:#fff; flex:1; }
.sw-header-pills { display:flex; gap:6px; }
.sw-pill {
  font-size:11px; font-weight:600; padding:4px 12px; border-radius:99px;
  border:1px solid rgba(255,255,255,0.12); color:rgba(255,255,255,0.45);
  cursor:pointer; transition:all .2s;
}
.sw-pill-active { background:rgba(30,75,212,0.35); border-color:rgba(30,75,212,0.6); color:#fff; }

.search-widget form { padding:16px 20px; display:flex; flex-direction:column; gap:12px; }

/* Fila ruta */
.sw-route-row {
  display:grid; grid-template-columns:1fr 40px 1fr; align-items:end; gap:8px;
  background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.07);
  border-radius:14px; padding:4px;
}
.sw-field { display:flex; flex-direction:column; gap:4px; padding:10px 14px; }
.sw-field label {
  font-size:10px; font-weight:600; letter-spacing:0.8px; text-transform:uppercase;
  color:rgba(255,255,255,0.35); display:flex; align-items:center; gap:5px;
}
.sw-field label i { font-size:11px; color:var(--accent); }
.sw-field input, .sw-field select {
  background:transparent; border:none; outline:none;
  color:#fff; font-size:14px; font-weight:500;
  font-family:'Inter',sans-serif; width:100%; min-width:0;
}
.sw-field input::placeholder { color:rgba(255,255,255,0.28); font-weight:400; }
.sw-field select { cursor:pointer; color:rgba(255,255,255,0.7); }
.sw-field select option { background:#0D1520; }
.sw-field:focus-within label { color:var(--accent); }
.sw-field:focus-within input { color:#fff; }

.sw-swap {
  width:40px; height:40px; border-radius:12px; align-self:center;
  background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.10);
  color:rgba(255,255,255,0.5); cursor:pointer; display:flex;
  align-items:center; justify-content:center; transition:all .25s; flex-shrink:0;
}
.sw-swap:hover { background:rgba(30,75,212,0.3); border-color:rgba(30,75,212,0.5); color:#fff; }
.sw-swap i { font-size:17px; }

/* Fila fecha + pax */
.sw-bottom-row {
  display:grid; grid-template-columns:1fr 1fr; gap:8px;
}
.sw-field-half {
  background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.07);
  border-radius:14px;
}
.sw-field-half input[type="date"] { color:rgba(255,255,255,0.7); }
.sw-field-half input[type="date"]::-webkit-calendar-picker-indicator { filter:invert(0.5); cursor:pointer; }

/* Botón buscar */
.sw-btn {
  width:100%; padding:14px; border-radius:14px; border:none;
  background:linear-gradient(135deg,var(--royal) 0%,var(--cobalt) 100%);
  color:#fff; font-size:15px; font-weight:700; letter-spacing:-0.2px;
  cursor:pointer; display:flex; align-items:center; justify-content:center; gap:8px;
  transition:opacity .2s, box-shadow .2s;
  box-shadow:0 8px 24px rgba(30,75,212,0.4);
}
.sw-btn:hover { opacity:.9; box-shadow:0 12px 32px rgba(30,75,212,0.55); }
.sw-btn i { font-size:18px; }

/* Trust bar */
.sw-trust {
  display:flex; justify-content:center; gap:20px; flex-wrap:wrap;
  padding:12px 20px;
  border-top:1px solid rgba(255,255,255,0.06);
  background:rgba(255,255,255,0.02);
}
.sw-trust span {
  font-size:11px; color:rgba(255,255,255,0.3);
  display:flex; align-items:center; gap:5px;
}
.sw-trust span i { font-size:12px; color:rgba(30,75,212,0.7); }

/* Badges heredados (ya no se usan pero se mantiene por si acaso) */
.hero-badges { display:flex; gap:12px; flex-wrap:wrap; }
.badge-pill { display:flex; align-items:center; gap:8px; background:rgba(255,255,255,0.05); border:0.5px solid rgba(255,255,255,0.1); border-radius:100px; padding:8px 16px; }

@media(max-width:700px){
  .sw-route-row { grid-template-columns:1fr 36px 1fr; }
  .sw-bottom-row { grid-template-columns:1fr; }
  .sw-header-pills { display:none; }
}
.badge-pill i { font-size:14px; color:var(--accent); }
.badge-pill span { color:rgba(255,255,255,0.65); font-size:12px; font-weight:500; }

/* Globe */
.hero-globe-col { z-index:2; display:flex; align-items:center; justify-content:center; position:relative; }
.globe-aura { position:absolute; width:400px; height:400px; border-radius:50%; background:radial-gradient(circle, rgba(30,75,212,0.2) 0%, transparent 70%); animation:shimmer 3s ease-in-out infinite; }
.globe-svg { animation:float 7s ease-in-out infinite; position:relative; z-index:1; width:100%; max-width:460px; }
#globeCanvas { display:block; width:100%; max-width:460px; background:transparent; position:relative; z-index:1; animation:float 7s ease-in-out infinite; cursor:pointer; }
.col-chip { position:absolute; bottom:10px; left:50%; transform:translateX(-50%); background:rgba(245,200,66,0.12); border:1px solid rgba(245,200,66,0.4); color:#F5C842; font-size:12px; font-weight:600; padding:5px 14px; border-radius:20px; display:flex; align-items:center; gap:6px; opacity:0; transition:opacity 0.6s ease; white-space:nowrap; backdrop-filter:blur(8px); }
.col-chip.show { opacity:1; }
.col-chip-dot { width:7px; height:7px; border-radius:50%; background:#F5C842; animation:pingRing 1.2s ease-out infinite; }
.globe-zoom { transform-origin:250px 250px; animation:zoomCol 6s 1s cubic-bezier(.22,1,.36,1) forwards; }
.colombia-path { animation:colAppear 6s 1s ease forwards; }
.ping-ring { animation:pingRing 1.8s ease-out infinite; }
.ping-1 { animation-delay: 5.5s; }
.ping-2 { animation-delay: 6.1s; }
.colombia-dot { animation:fadeIn 0.3s 5.5s ease forwards; filter:drop-shadow(0 0 4px #F5C842); }
.globe-route { animation:routeLine 1.8s ease forwards; }
.r1 { animation-delay: 7s; }
.r2 { animation-delay: 7.3s; }
.colombia-label { animation:fadeIn 0.5s 6.5s ease forwards; }

/* ── STATS ── */
.stats-bar { background:#0a1628; display:grid; grid-template-columns:repeat(4,1fr); border-top:0.5px solid rgba(255,255,255,0.06); }
.stat-item { padding:26px 20px; border-right:0.5px solid rgba(255,255,255,0.06); text-align:center; }
.stat-item:last-child { border-right:none; }
.stat-val { color:#fff; font-size:28px; font-weight:700; letter-spacing:-0.5px; }
.stat-lbl { color:rgba(255,255,255,0.38); font-size:12px; margin-top:3px; letter-spacing:0.2px; }

/* ── SECTIONS ── */
.sec { padding:96px 48px; }
.sec-tag { display:inline-flex; align-items:center; gap:6px; color:var(--royal); font-size:11px; font-weight:700; letter-spacing:1.4px; text-transform:uppercase; margin-bottom:14px; }
.sec-tag::before { content:''; width:16px; height:1.5px; background:var(--royal); display:block; }
.sec h2, .feat-bg h2, .app-sec h2, .routes-sec h2, .contact-sec h2 { font-size:40px; font-weight:700; letter-spacing:-1px; margin-bottom:56px; line-height:1.15; color:var(--text-body); }
.sec h2 span, .feat-bg h2 span, .routes-sec h2 span { color:var(--royal); }

/* ── STEPS ── */
.steps-sec { background:linear-gradient(180deg,#060e1a 0%,#071022 100%); padding:100px 48px; border-top:1px solid rgba(255,255,255,0.06); border-bottom:1px solid rgba(255,255,255,0.06); }
.steps-sec-inner { max-width:1160px; margin:0 auto; }
.steps-header { text-align:center; margin-bottom:72px; }
.steps-header .sec-tag { justify-content:center; margin-bottom:16px; color:#7fa8ff; }
.steps-header .sec-tag::before { background:#7fa8ff; }
.steps-header h2 { font-size:44px; font-weight:800; letter-spacing:-1.4px; color:#ffffff; margin-bottom:16px; }
.steps-header h2 span { color:#5b8ef4; }
.steps-subtitle { font-size:16px; color:rgba(255,255,255,0.65); line-height:1.75; font-weight:400; }

.steps-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; position:relative; }
.steps-connector { position:absolute; top:56px; left:calc(12.5% + 32px); right:calc(12.5% + 32px); height:1px; z-index:0; background:rgba(255,255,255,0.07); overflow:hidden; pointer-events:none; }
.steps-connector-fill { height:100%; width:0%; background:linear-gradient(90deg,#1e4bd4,#5b8ef4); transition:width 1.2s cubic-bezier(0.4,0,0.2,1); }
.steps-connector-fill.active { width:100%; }

.step-card {
  position:relative;
  background:rgba(255,255,255,0.055);
  border:1px solid rgba(255,255,255,0.12);
  border-radius:20px; padding:28px 22px 24px;
  display:flex; flex-direction:column; gap:14px;
  transition:border-color 0.3s,transform 0.3s,box-shadow 0.3s,background 0.3s;
  will-change:transform,opacity; z-index:1;
}
.step-card:hover {
  background:rgba(30,75,212,0.10);
  border-color:rgba(91,142,244,0.5);
  transform:translateY(-6px);
  box-shadow:0 28px 56px rgba(0,0,0,0.45), 0 0 0 1px rgba(91,142,244,0.2);
}

.step-badge {
  position:absolute; top:18px; right:18px;
  font-size:22px; font-weight:800; letter-spacing:-0.5px;
  color:rgba(255,255,255,0.07); font-family:'Inter',sans-serif;
  line-height:1; user-select:none;
}

.step-icon-wrap { width:52px; height:52px; border-radius:14px; background:rgba(30,75,212,0.22); display:flex; align-items:center; justify-content:center; transition:background 0.3s,box-shadow 0.3s; }
.step-card:hover .step-icon-wrap { background:rgba(30,75,212,0.4); box-shadow:0 8px 24px rgba(30,75,212,0.35); }
.step-icon-wrap i { font-size:24px; color:#7fa8ff; transition:color 0.3s; }
.step-card:hover .step-icon-wrap i { color:#aac4ff; }
.step-icon-gold { background:rgba(245,200,66,0.18) !important; }
.step-icon-gold i { color:#f5c842 !important; }
.step-card:hover .step-icon-gold { background:rgba(245,200,66,0.32) !important; box-shadow:0 8px 24px rgba(245,200,66,0.25) !important; }

.step-body h3 { font-size:15px; font-weight:700; color:#ffffff; margin-bottom:6px; letter-spacing:-0.3px; line-height:1.3; }
.step-body p { font-size:13px; color:rgba(255,255,255,0.68); line-height:1.75; }

.step-pill { display:inline-flex; align-self:flex-start; padding:4px 12px; border-radius:99px; font-size:11px; font-weight:700; letter-spacing:0.4px; background:rgba(91,142,244,0.18); color:#aac4ff; border:1px solid rgba(91,142,244,0.35); }
.step-pill-gold { background:rgba(245,200,66,0.15); color:#f5c842; border-color:rgba(245,200,66,0.4); }

.btn-primary {
  display:inline-flex; align-items:center; gap:8px;
  padding:12px 28px; border-radius:14px; border:none;
  background:linear-gradient(135deg, var(--royal) 0%, var(--cobalt) 100%);
  color:#fff; font-size:14px; font-weight:700; letter-spacing:-0.1px;
  cursor:pointer; text-decoration:none;
  box-shadow:0 8px 24px rgba(30,75,212,0.4);
  transition:opacity 0.2s, box-shadow 0.2s, transform 0.2s;
}
.btn-primary:hover { opacity:0.9; box-shadow:0 12px 32px rgba(30,75,212,0.55); transform:translateY(-1px); }
.btn-primary i { font-size:16px; }

.steps-cta { display:flex; flex-direction:column; align-items:center; gap:14px; margin-top:60px; }
.steps-cta .btn-primary { font-size:15px; padding:14px 36px; }
.steps-cta-note { font-size:12px; color:rgba(255,255,255,0.45); display:flex; align-items:center; gap:6px; }
.steps-cta-note i { font-size:13px; color:rgba(91,142,244,0.7); }

/* ── FEATURES ── */
.feat-bg { background:#f8faff; padding:96px 48px; }
.feat-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.feat-card {
  background:#fff; border-radius:20px; padding:28px;
  border:0.5px solid rgba(30,75,212,0.09);
  position:relative; overflow:hidden;
  will-change:transform,opacity;
}
.feat-card::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; background:linear-gradient(90deg,var(--royal),var(--accent)); transform:scaleX(0); transform-origin:left; transition:transform 0.3s ease; }
.feat-card:hover::before { transform:scaleX(1); }
.feat-card:hover { box-shadow:0 24px 56px rgba(30,75,212,0.13); border-color:rgba(30,75,212,0.22); }
.feat-ico { width:52px; height:52px; border-radius:14px; background:var(--light); display:flex; align-items:center; justify-content:center; margin-bottom:18px; transition:all 0.3s; }
.feat-card:hover .feat-ico { background:var(--royal); transform:scale(1.05); }
.feat-card:hover .feat-ico i { color:#fff; }
.feat-ico i { font-size:22px; color:var(--royal); transition:color 0.3s; }
.feat-card h3 { font-size:15px; font-weight:600; margin-bottom:8px; letter-spacing:-0.2px; }
.feat-card p { font-size:13px; color:var(--text-muted); line-height:1.65; }

/* ── APP SECTION ── */
.app-sec {
  padding:96px 48px; background:var(--navy);
  display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center;
  position:relative; overflow:hidden;
}
.app-sec::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 600px 500px at 70% 50%, rgba(30,75,212,0.14), transparent); pointer-events:none; }
.app-text-col { z-index:1; }
.app-eyebrow { display:inline-flex; align-items:center; gap:6px; color:var(--accent); font-size:11px; font-weight:700; letter-spacing:1.4px; text-transform:uppercase; margin-bottom:16px; }
.app-eyebrow::before { content:''; width:14px; height:1.5px; background:var(--accent); display:block; }
.app-text-col h2 { color:#fff; font-size:38px; font-weight:700; letter-spacing:-1px; line-height:1.15; margin-bottom:18px; }
.app-text-col p { color:rgba(255,255,255,0.52); font-size:15px; line-height:1.8; margin-bottom:36px; }
.feat-list { list-style:none; display:flex; flex-direction:column; gap:14px; }
.feat-list li { display:flex; align-items:center; gap:14px; opacity:0; transform:translateX(-20px); transition:opacity 0.45s, transform 0.45s; }
.feat-list li.in { opacity:1; transform:none; }
.feat-check { width:28px; height:28px; border-radius:8px; background:rgba(30,75,212,0.25); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.feat-check i { font-size:14px; color:var(--accent); }
.feat-list li span { color:rgba(255,255,255,0.72); font-size:14px; font-weight:500; }

/* Phone */
.phone-col { display:flex; justify-content:center; align-items:center; z-index:1; }
.phone-3d { position:relative; perspective:1000px; }
.notif-float {
  position:absolute; top:60px; right:-20px; z-index:10;
  background:#fff; border-radius:16px; padding:12px 16px; width:180px;
  box-shadow:0 16px 48px rgba(0,0,0,0.3); border:0.5px solid rgba(30,75,212,0.12);
  animation:slideLeft 0.5s 1s ease both;
}
.notif-float-top { display:flex; align-items:center; gap:8px; margin-bottom:8px; }
.notif-ico { width:28px; height:28px; border-radius:8px; background:rgba(30,75,212,0.1); display:flex; align-items:center; justify-content:center; }
.notif-ico i { font-size:14px; color:var(--royal); }
.notif-title { font-size:11px; font-weight:600; color:var(--text-body); }
.notif-sub { font-size:9px; color:#999; }
.notif-body { font-size:10px; color:#555; line-height:1.5; }
.notif-progress { margin-top:8px; height:3px; background:#eee; border-radius:2px; overflow:hidden; }
.notif-bar { height:100%; background:var(--royal); border-radius:2px; animation:notifBar 2s 1.5s ease forwards; width:20%; }
.qr-float {
  position:absolute; bottom:90px; left:-24px; z-index:10;
  background:#fff; border-radius:16px; padding:12px;
  box-shadow:0 16px 48px rgba(0,0,0,0.3); border:0.5px solid rgba(30,75,212,0.12);
  animation:scaleIn 0.5s 1.4s ease both;
}
.qr-inner { width:72px; height:72px; background:var(--text-body); border-radius:10px; display:flex; align-items:center; justify-content:center; }
.qr-inner i { font-size:40px; color:#fff; opacity:0.9; }
.qr-label { font-size:9px; color:#999; text-align:center; margin-top:6px; font-weight:600; letter-spacing:0.2px; }

.phone-body {
  width:272px; background:linear-gradient(160deg,#1c2a45,#101828);
  border-radius:48px; padding:14px;
  border:1.5px solid rgba(255,255,255,0.12);
  box-shadow: 0 40px 80px rgba(0,0,0,0.5), 0 0 0 0.5px rgba(255,255,255,0.06), inset 0 1px 0 rgba(255,255,255,0.1);
  animation:floatPhone 6s ease-in-out infinite; position:relative;
}
.phone-body::before { content:''; position:absolute; left:-3px; top:90px; width:3px; height:32px; background:rgba(255,255,255,0.1); border-radius:2px; }
.phone-body::after { content:''; position:absolute; right:-3px; top:100px; width:3px; height:50px; background:rgba(255,255,255,0.1); border-radius:2px; }
.dyn-island { width:100px; height:34px; background:#000; border-radius:17px; margin:0 auto; position:relative; z-index:10; display:flex; align-items:center; justify-content:center; gap:6px; }
.dyn-dot { width:10px; height:10px; border-radius:50%; background:#1a1a1a; border:1.5px solid rgba(255,255,255,0.05); }
.dyn-cam { width:8px; height:8px; border-radius:50%; background:#111; box-shadow:0 0 0 2px #0d0d0d, inset 0 0 0 1.5px rgba(30,75,212,0.4); }

.screen { background:#0f1c35; border-radius:38px; overflow:hidden; min-height:520px; margin-top:-17px; }
.status-bar { display:flex; justify-content:space-between; align-items:center; padding:14px 20px 6px; background:rgba(30,75,212,0.95); }
.status-bar span { color:rgba(255,255,255,0.7); font-size:10px; font-weight:600; }
.status-icons { display:flex; gap:4px; }
.status-icons i { font-size:11px; color:rgba(255,255,255,0.7); }
.app-header { background:rgba(30,75,212,0.95); padding:4px 20px 18px; }
.app-header-row { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; }
.app-brand { display:flex; align-items:center; gap:7px; }
.app-brand-icon { width:26px; height:26px; border-radius:7px; background:rgba(255,255,255,0.2); display:flex; align-items:center; justify-content:center; }
.app-brand-icon i { font-size:14px; color:#fff; }
.app-brand-name { color:#fff; font-size:14px; font-weight:700; letter-spacing:-0.3px; }
.notif-btn-ph { width:28px; height:28px; border-radius:8px; background:rgba(255,255,255,0.15); display:flex; align-items:center; justify-content:center; }
.notif-btn-ph i { font-size:14px; color:#fff; }
.app-greeting { color:rgba(255,255,255,0.6); font-size:11px; margin-bottom:3px; }
.app-question { color:#fff; font-size:18px; font-weight:700; letter-spacing:-0.5px; }

.search-card { background:#fff; margin:12px 16px 0; border-radius:18px; padding:14px 16px; box-shadow:0 12px 40px rgba(0,0,0,0.25); }
.search-field-row { display:flex; align-items:center; gap:10px; padding:8px 0; border-bottom:0.5px solid rgba(0,0,0,0.06); }
.search-field-row:last-of-type { border-bottom:none; }
.field-icon { width:30px; height:30px; border-radius:9px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.origin-ic { background:rgba(30,75,212,0.1); }
.dest-ic { background:rgba(30,75,212,0.07); }
.field-icon i { font-size:14px; color:var(--royal); }
.field-val { font-size:13px; color:var(--text-body); font-weight:600; letter-spacing:-0.2px; }
.field-hint { font-size:10px; color:#aaa; margin-top:1px; }
.swap-row { display:flex; justify-content:center; padding:2px 0; }
.swap-row i { font-size:16px; color:var(--royal); background:var(--light); padding:4px; border-radius:50%; }
.meta-row { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:10px; }
.meta-chip { background:#f8faff; border:0.5px solid rgba(30,75,212,0.12); border-radius:10px; padding:8px 10px; display:flex; align-items:center; gap:6px; font-size:10px; color:#555; font-weight:600; }
.meta-chip i { font-size:12px; color:var(--royal); }
.search-button { background:var(--royal); color:#fff; border:none; border-radius:12px; padding:12px; width:100%; font-size:13px; font-weight:700; margin-top:10px; cursor:pointer; font-family:'Inter',sans-serif; display:flex; align-items:center; justify-content:center; gap:6px; letter-spacing:-0.2px; }
.alert-strip { margin:12px 16px 0; background:#FFF8E1; border-left:3px solid #F9A825; border-radius:12px; padding:10px 12px; display:flex; gap:8px; align-items:flex-start; }
.alert-strip i { font-size:14px; color:#F9A825; flex-shrink:0; margin-top:1px; }
.alert-strip p { font-size:10px; color:#7B3F00; line-height:1.6; }
.pop-header { display:flex; align-items:center; justify-content:space-between; padding:14px 16px 8px; }
.pop-title { font-size:11px; font-weight:700; color:var(--text-body); display:flex; align-items:center; gap:5px; }
.pop-title i { font-size:13px; color:#F9A825; }
.pop-see { font-size:10px; color:var(--royal); font-weight:600; }
.route-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:0 16px 14px; }
.rc { border-radius:14px; overflow:hidden; position:relative; height:96px; }
.rc-barranquilla { background:linear-gradient(145deg,#0f2a5e,#1e4bd4); }
.rc-cartagena { background:linear-gradient(145deg,#1a3560,#2d5fa8); }
.rc-overlay { position:absolute; inset:0; background:linear-gradient(to top, rgba(6,14,26,0.85) 0%, rgba(6,14,26,0.1) 55%); }
.rc-badge { position:absolute; top:7px; left:7px; background:rgba(30,75,212,0.9); color:#fff; font-size:8px; font-weight:700; padding:3px 8px; border-radius:20px; display:flex; align-items:center; gap:3px; backdrop-filter:blur(8px); }
.rc-badge i { font-size:8px; }
.rc-city { position:absolute; bottom:22px; left:10px; color:#fff; font-size:11px; font-weight:700; letter-spacing:-0.2px; }
.rc-action { position:absolute; bottom:7px; left:8px; right:8px; background:rgba(255,255,255,0.1); backdrop-filter:blur(8px); color:#fff; border:none; border-radius:8px; font-size:9px; font-weight:600; padding:4px 8px; cursor:pointer; font-family:'Inter',sans-serif; display:flex; align-items:center; justify-content:space-between; }
.rc-action i { font-size:10px; }
.btm-nav { display:grid; grid-template-columns:repeat(4,1fr); border-top:0.5px solid rgba(255,255,255,0.06); padding:10px 0 8px; background:#0f1c35; }
.bn { text-align:center; padding:2px 0; cursor:pointer; }
.bn i { font-size:19px; }
.bn-lbl { font-size:8px; margin-top:3px; font-weight:600; }
.bn.active i, .bn.active .bn-lbl { color:var(--royal); }
.bn:not(.active) i, .bn:not(.active) .bn-lbl { color:rgba(255,255,255,0.28); }

/* ── ROUTES ── */
.routes-sec { padding:100px 48px; background:#f4f7ff; }
.routes-sec-inner { max-width:1200px; margin:0 auto; }
.routes-header { margin-bottom:28px; }
.routes-header h2 { margin-bottom:10px; }
.routes-sub { color:var(--text-muted); font-size:15px; line-height:1.65; margin-top:0; }

/* Filtros */
.routes-filters { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:28px; }
.rf-btn { padding:7px 18px; border-radius:99px; border:1.5px solid rgba(30,75,212,0.18); background:#fff; color:#555; font-size:12px; font-weight:600; cursor:pointer; transition:all .2s; white-space:nowrap; }
.rf-btn:hover { border-color:var(--royal); color:var(--royal); }
.rf-btn-active { background:var(--royal); color:#fff !important; border-color:var(--royal) !important; box-shadow:0 4px 14px rgba(30,75,212,0.28); }

/* Carousel wrapper */
.routes-carousel-wrap { position:relative; }
.routes-carousel {
  display:flex; gap:16px;
  overflow-x:auto; scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  padding-bottom:12px;
  scrollbar-width:none;
}
.routes-carousel::-webkit-scrollbar { display:none; }

/* Destination card — igual al app Flutter */
.dc-card {
  flex-shrink:0;
  width:200px; height:152px;
  border-radius:20px;
  overflow:hidden;
  position:relative;
  scroll-snap-align:start;
  cursor:pointer;
  text-decoration:none;
  box-shadow:0 6px 20px rgba(0,0,0,0.18);
  transition:transform .25s, box-shadow .25s;
  will-change:transform,opacity;
}
.dc-card:hover { transform:translateY(-5px) scale(1.02); box-shadow:0 16px 40px rgba(0,0,0,0.28); }

/* Gradiente de fondo (fallback igual que el app) */
.dc-bg {
  position:absolute; inset:0;
  background:linear-gradient(135deg,#0D1520 0%,#1E4BD4 60%,#2D6FE8 100%);
}
/* Variantes de color por ciudad */
.dc-bg.grad-1 { background:linear-gradient(135deg,#0D1520 0%,#1E4BD4 60%,#2D6FE8 100%); }
.dc-bg.grad-2 { background:linear-gradient(135deg,#0a1a2e 0%,#0d4b7c 60%,#1a6fa8 100%); }
.dc-bg.grad-3 { background:linear-gradient(135deg,#12082a 0%,#3d1b8e 60%,#5c33c1 100%); }
.dc-bg.grad-4 { background:linear-gradient(135deg,#0a2018 0%,#0e6b42 60%,#18a86a 100%); }
.dc-bg.grad-5 { background:linear-gradient(135deg,#1a0d08 0%,#7a2e10 60%,#c44f20 100%); }

/* Overlay oscuro inferior (igual que el app: stops [0.25, 1.0]) */
.dc-overlay {
  position:absolute; inset:0;
  background:linear-gradient(to bottom, transparent 25%, rgba(13,21,32,0.92) 100%);
}

/* Contenido de la tarjeta */
.dc-content { position:absolute; inset:0; padding:12px; display:flex; flex-direction:column; }

/* Badge "Directo" arriba izquierda */
.dc-badge {
  display:inline-flex; align-items:center; gap:4px;
  background:rgba(30,75,212,0.85); border-radius:8px;
  padding:3px 8px; align-self:flex-start;
}
.dc-badge i { font-size:11px; color:#fff; }
.dc-badge span { font-size:10px; font-weight:700; color:#fff; }

/* Ruta abajo */
.dc-route { margin-top:auto; display:flex; flex-direction:column; gap:0; }
.dc-origen {
  display:flex; align-items:center; gap:5px;
  font-size:12px; color:rgba(255,255,255,0.65); margin-bottom:3px;
}
.dc-origen i { font-size:10px; }
.dc-connector { width:1.5px; height:10px; background:rgba(255,255,255,0.22); margin-left:5px; margin-bottom:3px; }
.dc-destino {
  display:flex; align-items:center; gap:4px;
  font-size:16px; font-weight:700; color:#fff; line-height:1.15;
}
.dc-destino i { font-size:13px; color:var(--cobalt); flex-shrink:0; }

/* Botón "Buscar viajes" frosted */
.dc-cta {
  margin-top:8px;
  background:rgba(255,255,255,0.14);
  border:1px solid rgba(255,255,255,0.24);
  border-radius:10px;
  padding:5px;
  display:flex; align-items:center; justify-content:center; gap:4px;
  font-size:12px; font-weight:600; color:#fff;
  transition:background .2s;
}
.dc-card:hover .dc-cta { background:rgba(255,255,255,0.24); }

/* Skeleton */
.dc-skeleton {
  background:linear-gradient(90deg,#dde4f0 25%,#eaf0ff 50%,#dde4f0 75%);
  background-size:200% 100%;
  animation:shimmer 1.4s ease-in-out infinite;
  pointer-events:none;
}

/* Botones navegación carousel */
.rc-arrow-btn {
  position:absolute; top:50%; transform:translateY(-50%);
  width:40px; height:40px; border-radius:50%; border:none;
  background:#fff; box-shadow:0 4px 16px rgba(0,0,0,0.15);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; transition:all .2s; z-index:2; color:#333;
}
.rc-arrow-btn:hover { background:var(--royal); color:#fff; box-shadow:0 6px 20px rgba(30,75,212,0.35); }
.rc-prev { left:-16px; }
.rc-next { right:-16px; }
.rc-arrow-btn i { font-size:18px; }

.routes-footer { margin-top:40px; display:flex; justify-content:center; }

@media(max-width:768px) {
  .routes-sec { padding:64px 24px; }
  .rc-prev, .rc-next { display:none; }
}

/* ── CONTACT ── */
.contact-sec { padding:96px 48px; background:#fff; }
.contact-grid { display:grid; grid-template-columns:1fr 1.1fr; gap:60px; align-items:start; }
.contact-info h2 { font-size:38px; font-weight:700; letter-spacing:-1px; margin-bottom:14px; line-height:1.15; }
.contact-info > p { color:var(--text-muted); font-size:15px; line-height:1.8; margin-bottom:36px; }
.cinfo-cards { display:flex; flex-direction:column; gap:12px; }
.cinfo-card { display:flex; align-items:center; gap:16px; padding:16px 20px; border-radius:16px; border:0.5px solid rgba(30,75,212,0.1); transition:all 0.28s cubic-bezier(.22,1,.36,1); cursor:default; background:#fff; }
.cinfo-card:hover { border-color:var(--royal); transform:translateX(6px); box-shadow:0 8px 24px rgba(30,75,212,0.08); }
.cinfo-card:hover .cinfo-ico { background:var(--royal); }
.cinfo-card:hover .cinfo-ico i { color:#fff; }
.cinfo-ico { width:44px; height:44px; border-radius:12px; background:var(--light); display:flex; align-items:center; justify-content:center; flex-shrink:0; transition:all 0.25s; }
.cinfo-ico i { font-size:20px; color:var(--royal); transition:color 0.25s; }
.cinfo-lbl { font-size:11px; color:rgba(13,21,32,0.4); margin-bottom:2px; font-weight:600; letter-spacing:0.2px; }
.cinfo-val { font-size:14px; font-weight:600; color:var(--text-body); letter-spacing:-0.2px; }
.contact-form-wrap { background:#f8faff; border-radius:24px; padding:32px; border:0.5px solid rgba(30,75,212,0.08); }
.contact-form-wrap h3 { font-size:18px; font-weight:700; letter-spacing:-0.4px; margin-bottom:24px; }
.fg { margin-bottom:14px; }
.fg label { display:block; font-size:12px; color:rgba(13,21,32,0.5); margin-bottom:6px; font-weight:600; letter-spacing:0.2px; }
.fg input, .fg textarea, .fg select { width:100%; background:#fff; border:0.5px solid rgba(30,75,212,0.15); border-radius:12px; padding:11px 14px; font-size:14px; color:var(--text-body); outline:none; font-family:'Inter',sans-serif; transition:border-color 0.2s, box-shadow 0.2s; }
.fg input:focus, .fg textarea:focus, .fg select:focus { border-color:var(--royal); box-shadow:0 0 0 3px rgba(30,75,212,0.08); }
.fg textarea { resize:vertical; min-height:90px; }
.fg-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.form-btn { background:var(--royal); color:#fff; border:none; border-radius:12px; padding:13px 24px; font-size:14px; font-weight:700; width:100%; cursor:pointer; font-family:'Inter',sans-serif; display:flex; align-items:center; justify-content:center; gap:8px; transition:all 0.25s; margin-top:4px; letter-spacing:-0.2px; }
.form-btn:hover { background:var(--cobalt); transform:translateY(-1px); box-shadow:0 8px 24px rgba(30,75,212,0.3); }
.form-success { display:none; text-align:center; padding:20px; color:var(--royal); font-weight:600; }

/* ── DOWNLOAD ── */
.dl-sec { background:var(--navy); padding:100px 48px; text-align:center; position:relative; overflow:hidden; }
.dl-bg { position:absolute; inset:0; background: radial-gradient(ellipse 600px 400px at 50% 50%, rgba(30,75,212,0.2), transparent), radial-gradient(ellipse 200px 200px at 20% 20%, rgba(91,142,244,0.1), transparent), radial-gradient(ellipse 200px 200px at 80% 80%, rgba(91,142,244,0.1), transparent); pointer-events:none; }
.dl-sec h2 { color:#fff; font-size:44px; font-weight:700; letter-spacing:-1.5px; margin-bottom:16px; position:relative; }
.dl-sec p { color:rgba(255,255,255,0.5); font-size:16px; max-width:420px; margin:0 auto 44px; line-height:1.75; position:relative; }
.store-btns { display:flex; justify-content:center; gap:14px; flex-wrap:wrap; position:relative; }
.store-btn { background:rgba(255,255,255,0.06); border:0.5px solid rgba(255,255,255,0.15); color:#fff; border-radius:14px; padding:16px 26px; display:flex; align-items:center; gap:14px; cursor:pointer; transition:all 0.28s; text-align:left; font-family:'Inter',sans-serif; }
.store-btn:hover { background:rgba(255,255,255,0.11); border-color:rgba(255,255,255,0.35); transform:translateY(-3px); box-shadow:0 12px 32px rgba(0,0,0,0.25); }
.store-btn i { font-size:26px; }
.sbt { font-size:10px; color:rgba(255,255,255,0.45); font-weight:600; }
.sbl { font-size:16px; font-weight:700; letter-spacing:-0.3px; }
.dl-rating { margin-top:32px; display:flex; align-items:center; justify-content:center; gap:8px; position:relative; }
.dl-rating span { color:rgba(255,255,255,0.45); font-size:13px; }
.stars { color:var(--gold); font-size:16px; letter-spacing:2px; }

/* ── FOOTER ── */
footer { background:#04090F; padding:40px 48px; display:flex; align-items:center; justify-content:space-between; border-top:0.5px solid rgba(255,255,255,0.04); flex-wrap:wrap; gap:20px; }
.f-logo { display:flex; align-items:center; gap:9px; }
.f-logo-icon { width:30px; height:30px; border-radius:8px; background:var(--royal); display:flex; align-items:center; justify-content:center; }
.f-logo-icon i { font-size:15px; color:#fff; }
.f-logo-text { color:#fff; font-size:17px; font-weight:700; letter-spacing:-0.3px; }
.f-logo-text span { color:var(--accent); }
.f-logo-img { height:28px; width:auto; object-fit:contain; border-radius:6px; }
.f-links { display:flex; gap:24px; flex-wrap:wrap; }
.f-links a { color:rgba(255,255,255,0.28); font-size:13px; text-decoration:none; font-weight:500; transition:color 0.2s; }
.f-links a:hover { color:rgba(255,255,255,0.65); }
footer > p { color:rgba(255,255,255,0.2); font-size:12px; }

/* ── SCROLL PROGRESS ── */
#scrollProgress {
  position: fixed; top: 0; left: 0; height: 2.5px; z-index: 9999;
  background: linear-gradient(90deg, var(--royal), var(--accent), #a78bfa);
  background-size: 200% 100%;
  animation: gradShift 3s ease infinite;
  width: 0%; transition: width 0.1s linear;
  transform-origin: left;
}

/* ── CURSOR GLOW ── */
#cursorGlow {
  position: fixed; pointer-events: none; z-index: 9998;
  width: 380px; height: 380px; border-radius: 50%;
  background: radial-gradient(circle, rgba(30,75,212,0.12) 0%, transparent 65%);
  transform: translate(-50%, -50%);
  transition: opacity 0.3s ease;
  opacity: 0;
}

/* ── HERO PARTICLE CANVAS ── */
#particleCanvas {
  position: absolute; inset: 0; width: 100%; height: 100%;
  pointer-events: none; z-index: 1;
}

/* ── HERO animated gradient orbs ── */
.hero-orb {
  position: absolute; border-radius: 50%; pointer-events: none; z-index: 0;
  filter: blur(80px);
}
.hero-orb-1 {
  width: 500px; height: 500px;
  background: rgba(30,75,212,0.18);
  top: -100px; right: 10%;
  animation: orbFloat 12s ease-in-out infinite;
}
.hero-orb-2 {
  width: 300px; height: 300px;
  background: rgba(91,142,244,0.12);
  bottom: -60px; left: 5%;
  animation: orbFloat 9s 2s ease-in-out infinite reverse;
}

/* ── HERO h1 word — GSAP anima opacity/y/filter ── */
.hero h1 .word {
  display: inline-block;
  will-change: transform, opacity, filter;
}

/* ── ANIMATED GRADIENT heading ── */
.grad {
  background: linear-gradient(135deg, #fff 20%, var(--accent) 50%, #a78bfa 80%, var(--accent) 100%);
  background-size: 200% 200%;
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
  animation: gradShift 4s ease infinite;
}

/* ── NAV ACTIVE INDICATOR ── */
.nav-links a { position: relative; }
.nav-links a.active { color: #fff !important; }
.nav-links a.active::after {
  content: ''; position: absolute; bottom: -3px; left: 14px; right: 14px;
  height: 2px; border-radius: 2px;
  background: linear-gradient(90deg, var(--royal), var(--accent));
}

/* ── MAGNETIC BUTTON ── */
.cta-main, .nav-cta { will-change: transform; }

/* ── TILT CARDS ── */
.feat-card { will-change: transform; transform-style: preserve-3d; }
.feat-card.tilt-active { transition: none !important; }

/* ── STAT PROGRESS BARS ── */
.stat-item { position: relative; }
.stat-progress {
  position: absolute; bottom: 0; left: 20%; right: 20%;
  height: 2px; background: rgba(255,255,255,0.06); border-radius: 2px; overflow: hidden;
}
.stat-progress-fill {
  height: 100%; border-radius: 2px;
  background: linear-gradient(90deg, var(--royal), var(--accent));
  transform: scaleX(0); transform-origin: left;
  transition: transform 1.2s cubic-bezier(.22,1,.36,1);
}
.stat-progress-fill.in { transform: scaleX(1); }

/* ── SECTION DIVIDER WAVE ── */
.wave-divider { display: block; width: 100%; overflow: hidden; line-height: 0; }
.wave-divider svg { display: block; }

/* ── RESPONSIVE ── */
@media (max-width: 1024px) {
  .hero { grid-template-columns:1fr; min-height:auto; padding:80px 32px; }
  .hero-globe-col { display:none; }
  .app-sec { grid-template-columns:1fr; gap:48px; padding:80px 32px; }
  .feat-grid { grid-template-columns:repeat(2,1fr); }
  .contact-grid { grid-template-columns:1fr; }
  .steps-grid { grid-template-columns:repeat(2,1fr); }
  .steps-connector { display:none; }
  .steps-sec { padding:72px 32px; }
}
@media (max-width: 768px) {
  #navbar { padding:0 24px; }
  .nav-links, .nav-right { display:none; }
  .hamburger { display:flex; }
  .nav-links.open { display:flex; flex-direction:column; position:absolute; top:68px; left:0; right:0; background:rgba(6,14,26,0.98); padding:16px 24px; gap:4px; border-bottom:0.5px solid rgba(255,255,255,0.07); }
  .hero { padding:60px 24px; }
  .hero h1 { font-size:38px; }
  .sec, .feat-bg, .routes-sec, .contact-sec { padding:64px 24px; }
  .sec h2, .feat-bg h2, .routes-sec h2, .contact-sec h2 { font-size:30px; margin-bottom:36px; }
  .feat-grid { grid-template-columns:1fr; }
  .steps-grid { grid-template-columns:1fr; }
  .steps-sec { padding:64px 24px; }
  .steps-header h2 { font-size:32px; }
  .stats-bar { grid-template-columns:repeat(2,1fr); }
  .stat-item { border-right:none; border-bottom:0.5px solid rgba(255,255,255,0.06); }
  .dl-sec { padding:64px 24px; }
  .dl-sec h2 { font-size:32px; }
  footer { padding:28px 24px; flex-direction:column; align-items:flex-start; gap:16px; }
  .phone-col { transform:scale(0.85); }
  .notif-float, .qr-float { display:none; }
}