/* ═══════════════════════════════════════════════════════════════════
   RAPIBOY · Restaurantes Colombia — 2026
   Base: Restaurantes Argentina (mismos tokens, componentes y motion).
   Cambios UY/CO: sin Integraciones (carrusel) ni Social proof; card
   "Refuerzos" con animación propia; banda "Integración" (solo texto) y
   sección "Flota dedicada" nuevas (esta ocupa el lugar de Disponibilidad).
   Propio de esta página: --green (CTA de restaurantes).
   ═══════════════════════════════════════════════════════════════════ */

/* ─────────────────────────── 0 · TOKENS ─────────────────────────── */
:root{
  /* Color */
  --navy:        #242468;
  --navy-diag:   #2f2f6f;   /* vectores decorativos */
  --navy-soft:   #494970;
  --violet:      #8787b6;
  --text:        #6b6b8a;
  --nav:         #4a5565;
  --border:      #dddde8;
  --surface:     #f5f6fa;
  --white:       #ffffff;
  --yellow:      #fdc616;   /* reclutamiento ("Quiero repartir") · refuerzos */
  --cyan:        #00a3cf;   /* eyebrows, acentos secundarios */
  --green:       #1f9e63;   /* CTA de restaurantes */
  --idle:        #c9c9da;   /* repartidores en espera / cancelados (animación) */

  /* Tipografía */
  --font: 'Rubik', system-ui, -apple-system, sans-serif;

  --fs-display:    70px;
  --fs-h2:         45px;
  --fs-h3:         35px;
  --fs-stat:       68px;
  --fs-card-title: 20px;
  --fs-card-sm:    16px;
  --fs-faq:        16px;
  --fs-body:       15px;
  --fs-small:      13px;
  --fs-nav:        14px;
  --fs-eyebrow:    11px;

  /* Radios (sistema) */
  --r-sm:   8px;
  --r:     10px;
  --r-lg:  15px;
  --r-pill: 999px;

  /* Layout · contenido 1260px (334→1594 en el frame de 1920) */
  --container: 1308px;
  --gutter:    24px;

  /* Motion */
  --ease: cubic-bezier(.16, 1, .3, 1);
}

/* ─────────────────────────── 1 · RESET ─────────────────────────── */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:88px; }
body{
  margin:0;
  font-family:var(--font);
  font-size:var(--fs-body);
  color:var(--text);
  background:var(--white);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,svg{ display:block; max-width:100%; }
picture{ display:contents; }
h1,h2,h3,h4,p,ul,ol{ margin:0; }
ul,ol{ list-style:none; padding:0; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; }

.container{
  width:100%;
  max-width:var(--container);
  margin-inline:auto;
  padding-inline:var(--gutter);
}

/* Caja con recorte: ubica un export dentro de la caja del Figma cuando el
   archivo no coincide 1:1 con esa caja. --w/--h/--l/--t = tamaño y posición. */
.fx{ position:relative; display:block; overflow:hidden; flex:none; }
.fx img{
  position:absolute;
  left:var(--l, 0); top:var(--t, 0);
  width:var(--w, 100%); height:var(--h, 100%);
  max-width:none;
}

/* ─────────────────── 2 · TIPOGRAFÍA COMPARTIDA ─────────────────── */
.h2{
  font-size:var(--fs-h2);
  font-weight:800;
  line-height:1.18;
  letter-spacing:-.01em;
  color:var(--navy);
}
.h2--light{ color:var(--white); }

.lead{
  font-size:var(--fs-body);
  line-height:1.45;
  letter-spacing:.02em;
  color:var(--text);
}
.lead b{ font-weight:700; }
.lead--light{ color:var(--white); }

.eyebrow{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:var(--fs-eyebrow);
  font-weight:800;
  letter-spacing:.17em;
  text-transform:uppercase;
  line-height:1.2;
  margin-bottom:14px;
  color:var(--cyan);
}
.eyebrow__line{ width:18px; height:2px; background:currentColor; flex:none; }
.eyebrow--cyan{ color:var(--cyan); }
.eyebrow--yellow{ color:var(--yellow); }

.section-head{ margin-bottom:57px; }
.section-head .lead{ margin-top:15px; max-width:860px; }
.section-head--center{ text-align:center; }
.section-head--center .eyebrow{ justify-content:center; }
.section-head--center .lead{ margin-inline:auto; }

/* ─────────────────────────── 3 · BOTONES ─────────────────────────── */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:50px;
  padding-inline:26px;
  border-radius:var(--r);
  border:2px solid transparent;
  font-size:var(--fs-body);
  font-weight:700;
  letter-spacing:.04em;
  cursor:pointer;
  white-space:nowrap;
  transition:transform .2s var(--ease), background-color .2s ease, color .2s ease, border-color .2s ease;
}
.btn:hover{ transform:translateY(-2px); }
.btn:focus-visible{ outline:3px solid var(--cyan); outline-offset:3px; }

.btn--green{ background:var(--green); color:var(--white); min-width:249px; }
.btn--green:hover{ background:#1a8755; }

.btn--yellow{ background:var(--yellow); color:var(--navy); }
.btn--yellow:hover{ background:#eab410; }

.btn--outline-light{ background:transparent; color:var(--white); border-color:var(--white); min-width:182px; }
.btn--outline-light:hover{ background:var(--white); color:var(--navy); }

.btn--sm{ height:36px; padding-inline:18px; font-size:var(--fs-nav); font-weight:500; letter-spacing:0; }
.btn--block{ width:100%; }

/* ─────────────────────────── 4 · CARDS ─────────────────────────── */
.card{
  background:var(--surface);
  border:2px solid var(--border);
  border-radius:var(--r);
  transition:border-color .25s ease, transform .3s var(--ease), box-shadow .3s var(--ease);
}
/* Sin sombras en reposo. La única sombra vive en hover (tinte navy). */
.card:hover,
.faq__item:hover{
  transform:translateY(-4px);
  box-shadow:0 20px 40px -24px rgba(36,36,104,.55);
}
.card--white{ background:var(--white); }

.card__title{
  font-size:var(--fs-card-title);
  font-weight:800;
  letter-spacing:.02em;
  line-height:1.25;
  color:var(--navy);
}
.card__text{
  font-size:var(--fs-small);
  line-height:1.45;
  letter-spacing:.03em;
  color:var(--text);
}

.grid-2{ display:grid; grid-template-columns:repeat(2,1fr); gap:60px; }
.grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.grid-4{ display:grid; grid-template-columns:repeat(4,1fr); gap:31px; }

/* Pills */
.pill{
  display:inline-flex;
  align-items:center;
  height:26px;
  padding-inline:14px;
  border-radius:var(--r-pill);
  font-size:var(--fs-eyebrow);
  font-weight:800;
  letter-spacing:.17em;
  text-transform:uppercase;
  color:var(--white);
}
.pill--cyan{ background:var(--cyan); }
.pill--yellow{ background:var(--yellow); color:var(--navy); } /* contraste corregido */

/* ─────────── VECTORES DECORATIVOS (navy-diag, trazo 140, puntas redondas) ───────────
   SVG inline con las coordenadas exactas del Figma (frame de 1920px).
   .vec--full = 1920px centrado; en pantallas >1920 escala al ancho.        */
.vec{ position:absolute; pointer-events:none; overflow:visible; z-index:0; }
.vec--full{ left:50%; top:0; width:1920px; height:auto; margin-left:-960px; max-width:none; }
@media (min-width:1921px){ .vec--full{ width:100%; left:0; margin-left:0; } }
.vec__path{
  stroke:var(--navy-diag);
  stroke-width:140;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* Glows (radiales decorativos) */
.glow{ position:absolute; width:716px; height:716px; border-radius:50%; pointer-events:none; z-index:0; }

/* ═══════════════════════════════════════════════════════════════════
   0 · TOP BAR   (mismo componente que Argentina · logo Rapiboy)
   ═══════════════════════════════════════════════════════════════════ */
.s-topbar{
  position:fixed;
  inset:0 0 auto 0;
  height:64px;
  background:var(--white);
  z-index:100;
  transition:transform .3s var(--ease), box-shadow .3s ease;
}
.s-topbar.is-hidden{ transform:translateY(-100%); }
.s-topbar.is-stuck{ box-shadow:0 1px 0 var(--border); }

.topbar__inner{
  max-width:1895px;
  height:100%;
  margin-inline:auto;
  padding-inline:24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
.topbar__logo{ display:flex; align-items:center; }
.topbar__logo-svg{ height:26px; width:auto; display:block; }

.topbar__nav{ display:flex; align-items:center; gap:40px; }
.topbar__nav a{
  font-size:var(--fs-nav);
  font-weight:500;
  line-height:20px;
  color:var(--nav);
  transition:color .2s ease;
}
.topbar__nav a:hover{ color:var(--navy); }
.topbar__nav a.is-active{ color:var(--navy); font-weight:700; }

.topbar__item{ position:relative; display:flex; align-items:center; }
.topbar__item > a{ display:inline-flex; align-items:center; }

.mega{
  position:fixed;
  top:64px; left:0; right:0;
  width:100%;
  background:var(--white);
  border-top:1px solid var(--border);
  box-shadow:0 30px 50px -24px rgba(36,36,104,.35);
  padding:34px 0 38px;
  opacity:0;
  visibility:hidden;
  transform:translateY(-8px);
  transition:opacity .2s ease, transform .25s var(--ease), visibility .2s;
  z-index:30;
}
.mega::before{ content:''; position:absolute; top:-16px; left:0; right:0; height:16px; }
.topbar__item:hover .mega,
.topbar__item:focus-within .mega{ opacity:1; visibility:visible; transform:translateY(0); }

.mega__inner{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:6px 40px; }
.mega__link{ display:flex; align-items:center; gap:14px; padding:12px 14px; border-radius:var(--r); }
.mega__link:hover{ background:var(--surface); }
.mega__icon{
  flex:none;
  width:44px; height:44px;
  display:flex; align-items:center; justify-content:center;
  border-radius:var(--r);
  background:var(--surface);
  transition:background-color .2s ease;
}
.mega__link:hover .mega__icon{ background:var(--white); }
.mega__icon img{ width:36px; height:36px; object-fit:contain; transition:transform .25s var(--ease); }
.mega__link:hover .mega__icon img{ transform:scale(1.12); }
.mega__t{ font-size:var(--fs-body); font-weight:700; color:var(--navy); }

.topbar__actions{ display:flex; align-items:center; gap:22px; }
.topbar__link{ font-size:var(--fs-nav); font-weight:500; color:var(--navy); }
.topbar__link:hover{ text-decoration:underline; }
.topbar__mobile-actions{ display:none; }   /* aparece dentro del menú hamburguesa */

/* Selector de país */
.country{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:8px;
  height:36px;
  padding-inline:12px;
  border:1px solid var(--border);
  border-radius:var(--r);
  font-size:var(--fs-nav);
  font-weight:500;
  color:var(--nav);
  cursor:pointer;
  user-select:none;
}
.country__flag{ font-size:16px; line-height:1; }
.country__caret{ width:10px; height:6px; color:var(--nav); transition:transform .2s var(--ease); }
.country:hover, .country:focus-within{ border-color:var(--navy); color:var(--navy); }
.country:hover .country__caret,
.country:focus-within .country__caret{ transform:rotate(180deg); }
.country__menu{
  position:absolute;
  top:calc(100% + 6px);
  right:0;
  min-width:170px;
  background:var(--white);
  border:1px solid var(--border);
  border-radius:var(--r);
  box-shadow:0 16px 32px -20px rgba(36,36,104,.35);
  padding:6px;
  opacity:0;
  visibility:hidden;
  transform:translateY(-6px);
  transition:opacity .18s ease, transform .18s var(--ease), visibility .18s;
  z-index:20;
}
.country:hover .country__menu,
.country:focus-within .country__menu{ opacity:1; visibility:visible; transform:none; }
.country__opt{ display:flex; align-items:center; gap:10px; padding:9px 10px; border-radius:var(--r-sm); color:var(--nav); }
.country__opt:hover{ background:var(--surface); color:var(--navy); }
.country__opt[aria-selected="true"]{ color:var(--navy); font-weight:700; }

/* Hamburguesa (mobile) */
.topbar__burger{
  display:none;
  width:40px; height:40px;
  background:none; border:0;
  flex-direction:column; justify-content:center; gap:5px;
  cursor:pointer;
}
.topbar__burger span{
  display:block; height:2px; width:22px;
  background:var(--navy); border-radius:2px;
  transition:transform .25s var(--ease), opacity .2s ease;
}
.topbar__burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.topbar__burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.topbar__burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* ═══════════════════════════════════════════════════════════════════
   1 · HERO   (fondo en 4 capas: foto · velo 15% · vector · recorte)
   ═══════════════════════════════════════════════════════════════════ */
.s-hero{
  position:relative;
  min-height:896px;
  padding:234px 0 120px;
  background:var(--navy);
  overflow:hidden;
  isolation:isolate;
}
.hero__bg{ position:absolute; inset:0; z-index:-1; overflow:hidden; }
.hero__stage{
  position:absolute;
  left:50%;
  bottom:0;
  width:max(1922px, 100%);
  aspect-ratio:1922 / 1078;
  transform:translateX(calc(-50% - max(0px, 752px - 50vw)));
}
.hero__photo{ position:absolute; inset:0; width:100%; height:100%; max-width:none; object-fit:cover; }
.hero__shade{ position:absolute; inset:0; background:rgba(0,0,0,.15); }
.hero__moza{ position:absolute; left:62.85%; top:27.18%; width:25.08%; height:72.82%; max-width:none; }
.hero__vec{ left:.104%; top:16.883%; width:99.896%; height:83.117%; max-width:none; }
.hero__fade{ display:none; }

.hero__inner{ position:relative; }
.hero__title{
  max-width:726px;
  font-size:var(--fs-display);
  font-weight:900;
  line-height:.97;
  letter-spacing:-.01em;
  color:var(--white);
  text-shadow:2px 2px 5.2px rgba(0,0,0,.25);
}
.hero__lead{
  margin-top:44px;
  max-width:448px;
  font-size:20px;
  font-weight:500;
  line-height:1.2;
  letter-spacing:.02em;
  color:var(--white);
  text-shadow:2px 2px 5.2px rgba(0,0,0,.25);
}
.hero__cta{ display:flex; gap:28px; margin-top:33px; }

/* ═══════════════════════════════════════════════════════════════════
   2 · REPARTIDORES DISPONIBLES   (2 cards · fijos / refuerzos)
   ═══════════════════════════════════════════════════════════════════ */
.s-repartidores-disponibles{ background:var(--surface); padding:73px 0 99px; }
.s-repartidores-disponibles .section-head{ margin-bottom:67px; }

.servicio{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  min-height:369px;
  padding:30px 30px 36px;
}
/* Animación de cada modalidad (SVG que arma el JS, módulo 12).
   Punto que viaja, ruta punteada que se pinta a su paso.
   Fijos = cyan · Refuerzos = el cyan se cae y lo reemplaza uno amarillo. */
.servicio__anim{ width:100%; height:126px; margin-bottom:15px; }
.ranim{ display:block; width:100%; height:100%; overflow:visible; }
.ranim__base{ fill:none; stroke:var(--border); stroke-width:2; stroke-linecap:round; stroke-dasharray:2 6; }
.ranim__trail{ fill:none; stroke-width:2.5; stroke-linecap:round; stroke-dasharray:1 1; stroke-dashoffset:1; }
.ranim__resto{ fill:var(--navy); }
.ranim__door{ fill:var(--white); }
.ranim__dest{ fill:var(--white); stroke:var(--border); stroke-width:2; transition:stroke .3s ease, fill .3s ease; }
.ranim__halo{ opacity:.22; }
.ranim__ring{ fill:none; stroke-width:2; }
.ranim__bar{ stroke:var(--border); stroke-width:4; stroke-linecap:round; }
.ranim__barfill{ stroke-width:4; stroke-linecap:round; }
.ranim__txt{ font-family:var(--font); font-size:10px; font-weight:700; letter-spacing:.08em; fill:var(--violet); }
/* Colores por rol (valen para las dos animaciones) */
.ranim__trail--c, .ranim__barfill--c{ stroke:var(--cyan); }
.ranim__trail--y, .ranim__barfill--y{ stroke:var(--yellow); }
.ranim__dot--c, .ranim__halo--c{ fill:var(--cyan); }
.ranim__dot--y{ fill:var(--yellow); stroke:var(--navy); stroke-width:1.5; }   /* borde navy: se lee sobre blanco */
.ranim__halo--y{ fill:var(--yellow); }
.ranim__ring{ stroke:var(--yellow); }
.ranim__dest.is-hit{ stroke:var(--cyan); fill:#e0f4fa; }
.ranim__dest.is-hit-y{ stroke:var(--yellow); fill:#fff6d6; }
/* Refuerzos: repartidores en espera + cartel de cierre */
.ranim__pool{ fill:var(--idle); transition:fill .3s ease; }
.ranim__x{ stroke:var(--navy-soft); stroke-width:2.5; stroke-linecap:round; }
.ranim__ok{ font-family:var(--font); font-size:10px; font-weight:800; letter-spacing:.14em; fill:var(--navy); }

.servicio .card__title{ margin-top:17px; }
.servicio .card__text{ margin-top:12px; max-width:381px; }

/* ═══════════════════════════════════════════════════════════════════
   3 · PASOS REGISTRO   (4 cards numeradas)
   ═══════════════════════════════════════════════════════════════════ */
.s-pasos{ background:var(--white); padding:60px 0 72px; }
.s-pasos .section-head{ margin-bottom:60px; }
.pasos__title{ max-width:630px; }

.paso{
  position:relative;
  min-height:240px;
  padding:31px 17px 20px;
}
.paso__num{
  position:absolute;
  top:15px; left:15px;
  width:43px; height:43px;
  display:grid; place-items:center;
  border-radius:var(--r-sm);
  background:var(--cyan);
  color:var(--white);
  font-size:26px;
  font-weight:800;
  z-index:1;
}
.paso__img{ height:125px; display:flex; justify-content:center; align-items:flex-start; }
.paso__pic{ object-fit:contain; }
.paso__text{
  margin-top:11px;
  font-size:var(--fs-body);
  line-height:1.2;
  letter-spacing:.02em;
  color:var(--text);
}
.pasos__note{ margin-top:20px; }
.pasos__cta{ margin-top:37px; }

/* ═══════════════════════════════════════════════════════════════════
   4 · CUMPLIMIENTO   (divisor de marca · foto con blur + vector)
   ═══════════════════════════════════════════════════════════════════ */
.s-cumplimiento{
  position:relative;
  min-height:521px;
  display:flex;
  align-items:center;
  background:var(--navy);
  isolation:isolate;
  z-index:1;
  overflow-x:clip;
}
.cumpl__bg{ position:absolute; inset:0; overflow:hidden; z-index:-1; }
.cumpl__photo{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
}
.cumpl__glow{
  position:absolute;
  left:calc(50% + 39px);
  top:-248px;
  width:926px; height:926px;
  border-radius:50%;
  background:radial-gradient(closest-side, rgba(255,255,255,.15), rgba(255,255,255,0));
}
.cumpl__inner{ position:relative; }
.cumpl__title{
  max-width:678px;
  font-size:var(--fs-h2);
  font-weight:800;
  line-height:1.25;
  color:var(--white);
  text-shadow:0 2px 5px rgba(0,0,0,.3);
}
.cumpl__rider{
  position:absolute;
  left:calc(50% + 223px);
  top:-126px;
  width:512px;
  height:647px;
  z-index:2;
  pointer-events:none;
}

/* ═══════════════════════════════════════════════════════════════════
   5 · TECNOLOGÍA   (3 cards + laptop a sangre · sticky en desktop)
   ═══════════════════════════════════════════════════════════════════ */
.s-tecnologia{ position:relative; background:var(--surface); }
.s-tecnologia .section-head{ margin-bottom:66px; }

.tec__cards{ position:relative; z-index:1; width:587px; max-width:100%; display:flex; flex-direction:column; gap:26px; align-items:flex-start; }
.tec-card{
  width:100%;
  min-height:119px;
  display:flex;
  gap:27px;
  padding:15px 22px 15px 16px;
}
.tec-card__icon{ width:85px; height:85px; flex:none; display:flex; align-items:center; justify-content:center; }
.tec-card__icon img{ width:85px; height:85px; object-fit:contain; }
.tec-card__icon img.tec-card__mini{ width:65px; height:76px; }
.tec-card__icon--box{ background:var(--white); border-radius:var(--r); }
.tec-card > div{ padding-top:12px; }
.tec-card__title,
.ventaja__title{
  font-size:var(--fs-card-sm);
  font-weight:800;
  letter-spacing:.01em;
  line-height:1.3;
  color:var(--navy);
  margin-bottom:6px;
}
.tec-card .card__text{ max-width:434px; letter-spacing:.01em; }
.tec__cta{ margin-top:7px; }
.tec__body{ position:relative; }
.tec__laptop{
  position:absolute;
  top:0;
  left:calc(50% - 43px);
  width:1003px;
  height:592px;
  z-index:0;
  pointer-events:none;
}

/* ═══════════════════════════════════════════════════════════════════
   6 · NÚMEROS   (3 stats · sin título)
   ═══════════════════════════════════════════════════════════════════ */
.s-numeros{ background:var(--white); padding:113px 0 103px; }
.numeros__grid{ gap:43px; }
.stat{
  min-height:213px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:24px 20px 30px;
}
.stat__num{
  font-size:var(--fs-stat);
  font-weight:900;
  line-height:1.15;
  color:var(--cyan);
  font-variant-numeric:tabular-nums;
}
.stat__num--long{ font-size:49px; line-height:1.6; }
.stat__label{
  font-size:24px;
  font-weight:400;
  line-height:1.05;
  color:var(--navy);
}

/* ═══════════════════════════════════════════════════════════════════
   7 · VENTAJAS DEL SERVICIO   (personaje + path navy + 4 cards)
   ═══════════════════════════════════════════════════════════════════ */
.s-ventajas{
  position:relative;
  background:var(--surface);
  padding:113px 0 144px;
  overflow:hidden;
  isolation:isolate;
}
.s-ventajas .vec{ z-index:-1; }
.ventajas__character{
  position:absolute;
  left:calc(50% - 631px);
  bottom:0;
  width:868px;
  height:891px;
  z-index:0;
  pointer-events:none;
}
.s-ventajas .container{ position:relative; z-index:1; }
.ventajas__col{ margin-left:527px; max-width:733px; }
.ventajas__list{ display:flex; flex-direction:column; gap:24px; }
.ventaja{
  min-height:115px;
  display:flex;
  align-items:flex-start;
  gap:26px;
  padding:14px 30px 14px 24px;
}
.ventaja__icon{ width:80px; height:84px; flex:none; display:flex; align-items:center; justify-content:center; }
.ventaja__icon img{ max-width:none; object-fit:contain; }
.ventaja > div{ padding-top:10px; }
.ventaja .card__text{ max-width:541px; letter-spacing:.01em; }

/* ═══════════════════════════════════════════════════════════════════
   8 · INTEGRACIÓN   (banda navy · solo texto, centrado)
   ═══════════════════════════════════════════════════════════════════ */
.s-integracion{ background:var(--navy); padding:58px 0 63px; }
.s-integracion .section-head{ margin-bottom:0; }
.integracion__title{ max-width:856px; margin-inline:auto; }
.s-integracion .integracion__lead{ margin-top:17px; color:var(--violet); max-width:680px; }
.integracion__lead b{ font-weight:700; }

/* ═══════════════════════════════════════════════════════════════════
   9 · FLOTA DEDICADA   (texto + imagen a sangre en 3 capas)
   Foto → vector → recorte: el vector pasa por detrás de la mano y la caja.
   ═══════════════════════════════════════════════════════════════════ */
.s-flota{
  position:relative;
  min-height:689px;
  padding:93px 0 108px;
  background:var(--white);
  overflow:hidden;
}
.flota__media{
  position:absolute;
  top:0;
  left:calc(50% + 45px);
  width:918px;
  height:689px;
}
.flota__photo{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; max-width:none; }
.flota__vec{ inset:0; width:100%; height:100%; }
.flota__copy{ position:relative; z-index:1; max-width:560px; }
.flota__copy .h2{ margin-bottom:37px; }
.flota__text{ max-width:447px; display:flex; flex-direction:column; gap:18px; font-size:var(--fs-body); line-height:1.2; letter-spacing:.02em; }
.flota__text b{ font-weight:700; }
.flota__copy .btn{ margin-top:43px; }

/* ═══════════════════════════════════════════════════════════════════
   10 · RENTABILIDAD   (3 cards con ícono)
   ═══════════════════════════════════════════════════════════════════ */
.s-rentabilidad{ background:var(--surface); padding:102px 0 82px; }
.renta{ min-height:262px; padding:31px 29px 28px; }
.renta__icon{ height:99px; display:flex; align-items:flex-start; margin-bottom:16px; }
.renta__icon img{ object-fit:contain; }
.renta .card__text{ margin-top:12px; max-width:340px; }

/* ═══════════════════════════════════════════════════════════════════
   11 · REPARTIDORES   (banda navy · reclutamiento · CTA amarillo)
   ═══════════════════════════════════════════════════════════════════ */
.s-repartidores{
  position:relative;
  min-height:211px;
  display:flex;
  align-items:center;
  background:var(--navy);
  padding:40px 0;
  overflow:hidden;
}
.repartidores__inner{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:40px;
}
.repartidores__title{
  font-size:var(--fs-h3);
  font-weight:800;
  line-height:1.2;
  letter-spacing:.02em;
  color:var(--white);
}
.repartidores__title span{ display:block; margin-top:4px; font-size:20px; font-weight:700; line-height:1.7; }
.repartidores__cta{ min-width:280px; }

/* ═══════════════════════════════════════════════════════════════════
   12 · FAQ   (acordeón · 2 columnas)
   ═══════════════════════════════════════════════════════════════════ */
.s-faq{ background:var(--white); padding:83px 0 95px; }
.s-faq .section-head{ margin-bottom:34px; }
.faq__cols{ display:grid; grid-template-columns:repeat(2,1fr); gap:22px; align-items:start; }
.faq__col{ display:flex; flex-direction:column; gap:15px; }
.faq__item{
  background:var(--surface);
  border:2px solid var(--border);
  border-radius:var(--r-lg);
  transition:border-color .25s ease, transform .3s var(--ease), box-shadow .3s var(--ease);
}
.faq__item[open]{ border-color:var(--violet); }
.faq__item summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  min-height:65px;
  padding:14px 26px 14px 16px;
  cursor:pointer;
  list-style:none;
  font-size:var(--fs-faq);
  font-weight:700;
  letter-spacing:.02em;
  color:var(--navy);
}
.faq__item summary::-webkit-details-marker{ display:none; }
.faq__item summary i{
  position:relative;
  flex:none;
  width:30px; height:30px;
  border-radius:50%;
  background:var(--yellow);
  transition:transform .25s var(--ease);
}
.faq__item summary i::before,
.faq__item summary i::after{
  content:'';
  position:absolute;
  inset:50% 9px auto;
  height:2px;
  background:var(--navy);
  transform:translateY(-1px);
}
.faq__item summary i::after{ transform:translateY(-1px) rotate(90deg); }
.faq__item[open] summary i{ transform:rotate(45deg); }
.faq__answer{
  padding:0 22px 20px 16px;
  font-size:var(--fs-small);
  line-height:1.55;
  letter-spacing:.03em;
  color:var(--text);
}
.faq__answer a{ color:var(--navy); font-weight:700; text-decoration:underline; }

/* ═══════════════════════════════════════════════════════════════════
   13 · BLOG   (3 notas)
   ═══════════════════════════════════════════════════════════════════ */
.s-blog{ background:var(--surface); padding:71px 0 84px; }
.s-blog .section-head{ margin-bottom:53px; }
.blog__grid{ gap:25px; }
.post{ display:flex; flex-direction:column; min-height:419px; overflow:hidden; }
.post__media{ position:relative; height:249px; overflow:hidden; }
.post__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.post__body{ flex:1; display:flex; flex-direction:column; align-items:flex-start; padding:12px 26px 26px; }
.tag{
  display:inline-flex;
  align-items:center;
  height:23px;
  padding-inline:16px;
  border-radius:var(--r-pill);
  font-size:var(--fs-eyebrow);
  font-weight:800;
  letter-spacing:.17em;
  text-transform:uppercase;
  box-shadow:0 0 10px rgba(22,22,22,.05);
}
.tag--green{ background:#e0f3ea; color:var(--green); }
.tag--navy{ background:#e0e1eb; color:#2b2f74; }
.tag--cyan{ background:#dceef5; color:var(--cyan); }
.post__title{
  margin-top:11px;
  font-size:var(--fs-card-title);
  font-weight:700;
  line-height:1.2;
  letter-spacing:.02em;
  color:var(--navy);
}
.post__link{
  margin-top:auto;
  padding-top:14px;
  font-size:var(--fs-small);
  font-weight:700;
  color:var(--navy);
  text-decoration:underline;
}
.post__link:hover{ color:var(--cyan); }

/* ═══════════════════════════════════════════════════════════════════
   14 · EMPEZÁ HOY   (banda navy · vector · glows · form centrado)
   ═══════════════════════════════════════════════════════════════════ */
.s-empeza-hoy{
  position:relative;
  background:var(--navy);
  padding:88px 0 92px;
  overflow:hidden;
}
.glow--cyan{
  left:calc(50% + 348px);
  top:-177px;
  background:radial-gradient(closest-side, rgba(0,163,207,.10), rgba(0,163,207,0));
}
.glow--yellow{
  left:calc(50% - 890px);
  top:670px;
  background:radial-gradient(closest-side, rgba(253,198,22,.10), rgba(253,198,22,0));
}
.empeza__inner{ position:relative; z-index:1; }
.s-empeza-hoy .section-head{ margin-bottom:11px; }
.empeza__lead{ max-width:659px; line-height:1.4; margin-top:3px !important; min-height:64px; }

.form{
  max-width:886px;
  margin-inline:auto;
  background:var(--white);
  border-radius:var(--r);
  padding:38px 64px 29px;
}
.form__row{ display:grid; grid-template-columns:1fr 1fr; gap:38px; }
.field{ margin-bottom:14px; }
.field label{
  display:block;
  margin-bottom:8px;
  font-size:var(--fs-eyebrow);
  font-weight:800;
  letter-spacing:.17em;
  text-transform:uppercase;
  color:var(--navy);
}
.field input,
.field select,
.field textarea{
  width:100%;
  height:50px;
  padding-inline:22px;
  background:var(--surface);
  border:2px solid var(--border);
  border-radius:var(--r);
  font-family:var(--font);
  font-size:var(--fs-small);
  letter-spacing:.03em;
  color:var(--navy);
  transition:border-color .2s ease;
}
.field textarea{ height:96px; padding-block:12px; resize:vertical; display:block; }
.field input::placeholder,
.field textarea::placeholder{ color:var(--text); }
.field textarea::placeholder{ color:var(--navy-soft); }
.field select option{ background:var(--white); color:var(--navy); }
.field select:invalid{ color:var(--navy-soft); }
.field__phone{ display:flex; gap:10px; }
.field__phone .field__code{ width:auto; flex:none; padding-inline:12px; }
.field__phone .field__num{ flex:1 1 auto; min-width:0; }
.field input:focus,
.field select:focus,
.field textarea:focus{ outline:none; border-color:var(--cyan); }
.form .btn{ margin-top:18px; }

/* ═══════════════════════════════════════════════════════════════════
   15 · FOOTER
   ═══════════════════════════════════════════════════════════════════ */
.s-footer{ background:var(--surface); padding:80px 0 40px; border-top:.8px solid #e5e7eb; }
.footer__inner{ max-width:1300px; }
.footer__grid{ display:grid; grid-template-columns:minmax(0,1fr) 200px 200px; gap:64px; align-items:start; }
.footer__logo{ display:flex; align-items:center; gap:10px; }
.footer__logo-svg{ height:34px; width:auto; display:block; }
.footer__brand{ max-width:410px; }
.footer__desc{ margin-top:24px; max-width:320px; font-size:var(--fs-nav); line-height:1.625; color:#6a7282; }
.footer__social{ display:flex; align-items:center; gap:16px; margin-top:24px; }
.footer__social a{ display:inline-flex; align-items:center; color:var(--nav); transition:color .2s ease; }
.footer__social a:hover{ color:var(--navy); }
.footer__social svg{ display:block; width:20px; height:20px; }
.footer__col-title{ font-size:16px; font-weight:600; color:var(--navy); margin-bottom:24px; }
.footer__col ul{ display:flex; flex-direction:column; gap:16px; }
.footer__col a{ font-size:var(--fs-nav); line-height:1.43; color:var(--nav); transition:color .2s ease; }
.footer__col a:hover{ color:var(--navy); }
.footer__bottom{ margin-top:56px; padding-top:17px; border-top:.8px solid #e5e7eb; }
.footer__bottom p{ font-size:var(--fs-nav); line-height:20px; color:#6a7282; }
.footer__bottom a{ color:var(--navy); text-decoration:underline; }
.footer__bottom a:hover{ color:var(--cyan); }

/* ═══════════════════════════════════════════════════════════════════
   MOTION
   ═══════════════════════════════════════════════════════════════════ */

/* 1 · Slide-in-up — IntersectionObserver al 15%, una vez, stagger 80ms. */
.js [data-anim]:not(.is-in){ opacity:0; transform:translateY(24px); }
[data-anim].is-anim{
  transition:opacity .6s var(--ease) var(--d, 0ms), transform .6s var(--ease) var(--d, 0ms);
}

/* 2 · Vectores que se dibujan — trazo de punta a punta sobre pathLength="1". */
.js .vec[data-draw] .vec__path{ stroke-dasharray:1 1; stroke-dashoffset:1; opacity:0; }
.js .vec[data-draw].is-drawn .vec__path{
  opacity:1;
  animation:vec-draw var(--draw, 2.2s) cubic-bezier(.65, 0, .35, 1) forwards;
}
@keyframes vec-draw{ to{ stroke-dashoffset:0; } }
.hero__vec{ --draw:2.4s; }
.flota__vec{ --draw:1.8s; }

/* 3 · Contadores: el ancho no "baila" mientras cuentan */
[data-count]{ font-variant-numeric:tabular-nums; }

/* 4 · Tecnología (desktop): sección fija + cards de a una (ref. Sohub). */
.s-tecnologia{ overflow:clip; padding:0; }
.tec__sticky{ padding:93px 0 121px; }
@media (min-width:1025px){
  .tec__scroll.is-pinned{ height:var(--tec-scroll, auto); }
  .tec__scroll.is-pinned .tec__sticky{
    position:sticky;
    top:var(--tec-top, 0px);
    min-height:100vh;
    display:flex;
    flex-direction:column;
    padding:56px 0 0;
  }
  .tec__scroll.is-pinned .section-head{ margin-bottom:40px; }
  .tec__scroll.is-pinned .tec__progress{
    flex:1;
    min-height:12vh;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:10px;
  }
  .tec__scroll.is-pinned [data-tec]{
    opacity:var(--a, 0);
    transform:translateY(calc((1 - var(--a, 0)) * 60px)) scale(calc(.96 + var(--a, 0) * .04));
    transition:none;
  }
}
.tec__progress{ display:none; color:var(--cyan); }
.tec__dots{ display:flex; gap:10px; }
.tec__dots i{
  width:10px; height:10px;
  border-radius:50%;
  border:2px solid var(--cyan);
  background:rgb(0 163 207 / var(--a, 0));
}
.tec__arrow{
  width:16px; height:10px;
  opacity:var(--more, 1);
  transition:opacity .3s ease;
  animation:tec-bounce 1.4s ease-in-out infinite;
}
@keyframes tec-bounce{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(5px); } }

.js .tec__scroll:not(.is-pinned) [data-tec]:not(.is-in){ opacity:0; transform:translateY(24px); }
.tec__scroll:not(.is-pinned) [data-tec].is-anim{
  transition:opacity .6s var(--ease) var(--d, 0ms), transform .6s var(--ease) var(--d, 0ms);
}

@media (prefers-reduced-motion: reduce){
  *{ animation:none !important; transition:none !important; scroll-behavior:auto !important; }
  .js [data-anim]:not(.is-in),
  .js .tec__scroll:not(.is-pinned) [data-tec]:not(.is-in){ opacity:1; transform:none; }
  .js .vec[data-draw] .vec__path{ opacity:1; stroke-dashoffset:0; }
}

/* ═══════════════════════════════════════════════════════════════════
   RESPONSIVE   ·   breakpoints 1600 / 1280 / 1024 / 768 / 480
   ═══════════════════════════════════════════════════════════════════ */

/* ── ≤1600 · notebooks: la laptop de Tecnología se achica y se apoya a la derecha ── */
@media (max-width:1600px){
  .tec__laptop{
    left:auto;
    width:min(1003px, 62vw);
    height:auto;
    aspect-ratio:1003 / 592;
    right:calc((100% - 100vw) / 2 + 24px - .15 * min(1003px, 62vw));
  }
}

/* ── ≤1280 · títulos un escalón más chicos ── */
@media (max-width:1280px){
  :root{
    --fs-display:60px;
    --fs-h2:38px;
    --fs-stat:56px;
  }
  .stat__num--long{ font-size:40px; line-height:1.7; }
  .cumpl__title{ font-size:40px; }
  .hero__title{ max-width:600px; }
  .ventajas__col{ margin-left:auto; }
  .ventajas__character{ left:calc(50% - 700px); }
  .flota__media{ left:calc(50% + 20px); }
  .flota__copy{ max-width:500px; }
}

/* ── ≤1024 · tablet: menú hamburguesa, se apagan las composiciones laterales ── */
@media (max-width:1024px){
  :root{ --fs-display:52px; --fs-h2:34px; --fs-h3:30px; --fs-stat:46px; }

  /* Top bar: hamburguesa */
  .topbar__burger{ display:flex; }
  .topbar__actions{ display:none; }
  .topbar__nav{
    position:absolute;
    inset:64px 0 auto 0;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    background:var(--white);
    border-top:1px solid var(--border);
    padding:8px 24px 20px;
    max-height:calc(100vh - 64px);
    overflow-y:auto;
    transform:translateY(-8px);
    opacity:0;
    visibility:hidden;
    transition:opacity .2s ease, transform .2s var(--ease), visibility .2s;
    box-shadow:0 16px 32px -20px rgba(36,36,104,.35);
  }
  .topbar__nav.is-open{ transform:none; opacity:1; visibility:visible; }
  .topbar__nav a{ display:block; padding:14px 0; border-bottom:1px solid var(--border); font-size:16px; }
  .topbar__nav > a:last-child{ border-bottom:0; }
  .topbar__item{ display:block; }
  .topbar__item > a{ display:block; }
  .mega{ display:none; }
  .topbar__mobile-actions{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:12px;
    padding-top:16px;
  }
  .topbar__nav .topbar__mobile-actions a{ border-bottom:0; }
  .topbar__nav .topbar__mobile-actions .topbar__link{ padding:10px 0; font-size:16px; color:var(--navy); font-weight:500; }
  .topbar__nav .topbar__mobile-actions .btn{ display:flex; padding:0 26px; font-size:var(--fs-body); color:var(--navy); font-weight:700; }

  /* Hero */
  .s-hero{ min-height:760px; padding:170px 0 100px; }
  .hero__title{ max-width:520px; }
  .hero__lead{ margin-top:32px; max-width:420px; font-size:18px; }

  /* Repartidores disponibles */
  .grid-2{ gap:28px; }
  .servicio{ min-height:0; }

  /* Pasos: 2 × 2 */
  .grid-4{ grid-template-columns:repeat(2,1fr); gap:20px; }

  /* Cumplimiento */
  .cumpl__title{ font-size:34px; max-width:56%; }
  .cumpl__rider{ left:auto; right:-20px; top:-60px; width:400px; height:505px; }

  /* Tecnología: laptop abajo, en el flujo */
  .tec__sticky{ padding-bottom:80px; }
  .tec__cards{ width:100%; }
  .tec__laptop{
    position:relative;
    top:auto; right:auto; left:auto;
    width:min(760px, 100%);
    margin:24px auto 0;
  }

  /* Números */
  .numeros__grid{ gap:20px; }
  .stat{ min-height:170px; }
  .stat__num--long{ font-size:31px; line-height:1.8; }
  .stat__label{ font-size:20px; }

  /* Ventajas: lista a todo el ancho y el personaje abajo */
  .s-ventajas{ display:flex; flex-direction:column; padding-bottom:0; }
  .s-ventajas .container{ order:1; }
  .ventajas__col{ margin-left:0; max-width:none; }
  .ventajas__character{
    order:2;
    position:relative;
    left:auto; bottom:auto;
    width:351px; height:360px;
    margin:48px auto 0;
  }

  /* Integración */
  .s-integracion{ padding:56px 0 60px; }

  /* Flota dedicada: texto arriba, imagen a todo el ancho abajo */
  .s-flota{ min-height:0; padding:80px 0 0; display:flex; flex-direction:column; }
  .s-flota .container{ order:1; }
  .flota__copy{ max-width:620px; }
  .flota__text{ max-width:none; }
  .flota__media{
    order:2;
    position:relative;
    left:auto; top:auto;
    width:100%;
    height:auto;
    aspect-ratio:918 / 689;
    margin-top:56px;
  }

  /* Rentabilidad */
  .renta{ min-height:0; padding:26px 22px 24px; }
  .renta .card__text br{ display:none; }

  /* Repartidores */
  .repartidores__inner{ flex-direction:column; align-items:flex-start; gap:24px; }

  /* Blog */
  .post{ min-height:0; }
  .post__media{ height:190px; }
  .post__body{ padding:12px 20px 22px; }

  /* Footer */
  .footer__grid{ grid-template-columns:minmax(0,1fr) 160px 160px; gap:40px; }
}

/* ── ≤768 · mobile ── */
@media (max-width:768px){
  :root{ --fs-display:40px; --fs-h2:30px; --fs-h3:26px; --fs-stat:56px; }

  .h2 br, .cumpl__title br{ display:none; }
  .section-head{ margin-bottom:36px; }
  .btn--green{ min-width:0; }

  /* Hero */
  .s-hero{ min-height:0; padding:112px 0 430px; }
  .hero__stage{ left:0; width:1100px; transform:translateX(calc(62vw - 829px)); }
  .hero__fade{
    display:block;
    position:absolute;
    inset:0;
    background:linear-gradient(180deg, var(--navy) 0%, rgba(36,36,104,.9) 30%, rgba(36,36,104,0) 60%);
  }
  .hero__title{ max-width:none; }
  .hero__lead{ margin-top:22px; font-size:17px; max-width:none; }
  .hero__cta{ flex-direction:column; align-items:stretch; gap:12px; margin-top:28px; }

  /* Repartidores disponibles */
  .s-repartidores-disponibles{ padding:64px 0; }
  .s-repartidores-disponibles .section-head{ margin-bottom:36px; }
  .grid-2{ grid-template-columns:1fr; }
  .servicio{ padding:24px 22px 28px; }
  .servicio__anim{ height:110px; }

  /* Pasos */
  .s-pasos{ padding:56px 0 64px; }
  .s-pasos .section-head{ margin-bottom:36px; }
  .grid-4{ gap:14px; }
  .paso{ min-height:0; padding:28px 14px 18px; }
  .paso__img{ height:110px; }
  .paso__img .fx, .paso__pic{ transform:scale(.85); transform-origin:top center; }
  .paso__text{ font-size:14px; }
  .pasos__cta{ width:100%; }

  /* Cumplimiento */
  .s-cumplimiento{ display:block; min-height:0; padding:64px 0 380px; }
  .cumpl__title{ font-size:30px; max-width:none; }
  .cumpl__rider{ top:auto; bottom:0; right:auto; left:50%; margin-left:-150px; width:300px; height:379px; }
  .cumpl__glow{ left:50%; top:auto; bottom:-460px; margin-left:-463px; }

  /* Tecnología */
  .tec__sticky{ padding:64px 0 64px; }
  .s-tecnologia .section-head{ margin-bottom:36px; }
  .tec__cards{ gap:14px; }
  .tec-card{ gap:16px; padding:14px 16px; }
  .tec-card__icon, .tec-card__icon img{ width:64px; height:64px; }
  .tec-card__icon img.tec-card__mini{ width:48px; height:56px; }
  .tec-card > div{ padding-top:4px; }
  .tec__cta{ width:100%; }

  /* Números */
  .s-numeros{ padding:64px 0; }
  .numeros__grid{ grid-template-columns:1fr; gap:14px; }
  .stat{ min-height:150px; }
  .stat__num--long{ font-size:44px; line-height:1.3; }

  /* Ventajas */
  .s-ventajas{ padding-top:64px; }
  .ventajas__list{ gap:14px; }
  .ventaja{ gap:14px; padding:14px 16px; }
  .ventaja__icon{ width:64px; height:70px; }
  .ventaja__icon img{ transform:scale(.8); }
  .ventaja > div{ padding-top:4px; }
  .ventajas__character{ width:273px; height:280px; margin-top:36px; }

  /* Integración */
  .s-integracion{ padding:48px 0 52px; }

  /* Flota dedicada */
  .s-flota{ padding-top:64px; }
  .flota__copy .h2{ margin-bottom:28px; }
  .flota__copy .btn{ width:100%; margin-top:32px; }
  .flota__media{ margin-top:40px; }

  /* Rentabilidad */
  .s-rentabilidad{ padding:64px 0; }
  .grid-3{ grid-template-columns:1fr; gap:14px; }
  .renta__icon{ height:80px; }
  .renta__icon img{ transform:scale(.8); transform-origin:left top; }

  /* Repartidores */
  .s-repartidores{ padding:48px 0; }
  .repartidores__title span{ font-size:16px; line-height:1.5; margin-top:8px; }
  .repartidores__cta{ min-width:0; width:100%; }

  /* FAQ */
  .s-faq{ padding:64px 0; }
  .faq__cols{ grid-template-columns:1fr; gap:15px; }
  .faq__item summary{ font-size:15px; padding:14px 16px; }

  /* Blog */
  .s-blog{ padding:64px 0; }
  .s-blog .section-head{ margin-bottom:36px; }
  .post__media{ height:210px; }

  /* Empezá hoy */
  .s-empeza-hoy{ padding:64px 0; }
  .form{ padding:26px 20px 22px; }
  .form__row{ grid-template-columns:1fr; gap:0; }
  .empeza__lead{ min-height:0; }
  .s-empeza-hoy .section-head{ margin-bottom:28px; }

  /* Footer */
  .s-footer{ padding:56px 0 32px; }
  .footer__grid{ grid-template-columns:1fr 1fr; gap:36px 24px; }
  .footer__brand{ grid-column:1 / -1; }
  .footer__bottom{ margin-top:40px; }
}

/* ── ≤480 · mobile chico ── */
@media (max-width:480px){
  :root{ --fs-display:36px; --fs-h2:27px; --fs-stat:50px; }
  .container{ padding-inline:18px; }
  .s-hero{ padding-bottom:400px; }
  .hero__stage{ width:1020px; transform:translateX(calc(64vw - 769px)); }
  .grid-4{ grid-template-columns:1fr; }
  .paso{ display:grid; grid-template-columns:116px 1fr; align-items:center; gap:12px; padding:18px 16px; }
  .paso__img{ height:100px; align-items:center; }
  .paso__text{ margin-top:0; }
  .paso__num{ top:10px; left:10px; width:34px; height:34px; font-size:20px; }
  .paso__img .fx, .paso__pic{ transform:scale(.72); transform-origin:center; }
  .cumpl__title{ font-size:27px; }
  .stat__num--long{ font-size:38px; }
  .ventaja{ flex-direction:row; }
  .servicio__anim{ height:96px; }
}