/* ============================================================
   RODAMIENTOS CUYO — CSS
   Diseño limpio / blanco
   ============================================================ */

/* ---- Tokens ---- */
:root {
  --bg:          #f2f4f8;
  --white:       #ffffff;
  --dark:        #0a1b33;
  --mid:         #334155;
  --muted:       #64748b;
  --border:      rgba(148,163,184,0.28);
  --border-md:   rgba(148,163,184,0.5);
  --blue:        #1B53D4;
  --gold:        #e8991a;
  --nav-h:       68px;
  --max:         1400px;
  --r-hero:      44px;
  --font:        'Inter', system-ui, sans-serif;
  --font-d:      'Cormorant Garamond', Georgia, serif;
  --ease:        cubic-bezier(.4,0,.2,1);
}

/* ---- Reset ---- */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:var(--font);
  background:var(--bg);
  color:var(--dark);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}


/* ============================================================
   BOTONES PILL
   ============================================================ */
.btn-pill{
  display:inline-flex;align-items:center;gap:8px;
  border:none;cursor:pointer;
  border-radius:100px;
  font-family:var(--font);font-weight:600;
  transition:all .2s var(--ease);
  white-space:nowrap;
}
.btn-pill--dark{
  background:var(--dark);color:#fff;
  padding:12px 26px;font-size:15px;
}
.btn-pill--dark:hover{
  background:#162744;
  transform:translateY(-1px);
  box-shadow:0 8px 24px rgba(10,27,51,.22);
}
.btn-pill--sm{padding:9px 20px;font-size:13.5px}
.btn-pill--lg{padding:14px 32px;font-size:15.5px}


/* ============================================================
   NAVEGACIÓN
   ============================================================ */
.nav{
  position:fixed;top:0;left:0;right:0;
  z-index:1000;
  background:rgba(242,244,248,.82);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  border-bottom:1px solid var(--border);
  transition:background .3s var(--ease),box-shadow .3s var(--ease);
}
.nav.scrolled{
  background:rgba(242,244,248,.97);
  box-shadow:0 2px 20px rgba(10,27,51,.07);
}

.nav__inner{
  max-width:var(--max);margin:0 auto;
  padding:0 32px;height:var(--nav-h);
  display:flex;align-items:center;gap:28px;
}

/* Logo */
.nav__logo{display:flex;align-items:center}
.nav__logo img{height:40px;width:auto}
.nav__logo-fallback{display:none;align-items:center;gap:10px}
.logo-mark{
  width:36px;height:36px;
  background:var(--dark);color:#fff;border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:13px;flex-shrink:0;
}
.logo-label{font-size:13px;line-height:1.2;color:var(--dark)}
.logo-label strong{font-weight:700}

/* Links — pill container (estilo COA Medical) */
.nav__links{
  display:flex;align-items:center;gap:2px;margin-left:auto;
  background:rgba(240,243,248,.78);
  border:1px solid rgba(148,163,184,.35);
  border-radius:999px;
  padding:5px 8px;
  backdrop-filter:blur(8px);
}
.nav__link{
  padding:7px 14px;border-radius:999px;
  font-size:12px;font-weight:600;color:var(--mid);
  text-transform:uppercase;letter-spacing:.07em;
  transition:all .15s;
}
.nav__link:hover{color:var(--dark);background:rgba(10,27,51,.06)}

/* Right side */
.nav__right{display:flex;align-items:center;gap:12px;flex-shrink:0}
.nav__tel{font-size:13.5px;font-weight:500;color:var(--muted);transition:color .15s}
.nav__tel:hover{color:var(--dark)}
.nav__wa{display:flex;align-items:center;color:#25D366;transition:opacity .15s}
.nav__wa:hover{opacity:.75}

/* Burger */
.nav__burger{
  display:none;flex-direction:column;gap:5px;
  background:none;border:none;cursor:pointer;padding:6px;margin-left:auto;
}
.nav__burger span{
  display:block;width:23px;height:2px;
  background:var(--dark);border-radius:2px;transition:all .25s;
}
.nav__burger.active span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav__burger.active span:nth-child(2){opacity:0}
.nav__burger.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* Mobile menu */
.nav__mobile{
  display:none;flex-direction:column;gap:4px;
  padding:12px 24px 20px;
  border-top:1px solid var(--border);
  background:rgba(242,244,248,.98);
}
.nav__mobile.open{display:flex}
.nav__mobile-link{
  padding:11px 14px;border-radius:6px;
  font-size:14.5px;font-weight:500;color:var(--muted);transition:all .15s;
}
.nav__mobile-link:hover{color:var(--dark);background:rgba(10,27,51,.05)}


/* ============================================================
   PÁGINA (wrapper)
   ============================================================ */
.page{
  padding:calc(var(--nav-h) + 24px) 24px 48px;
  max-width:1460px;
  margin:0 auto;
}


/* ============================================================
   HERO CARD
   ============================================================ */
.hero-card{
  position:relative;
  border-radius:var(--r-hero);
  background:var(--white);
  border:1px solid rgba(148,163,184,.22);
  box-shadow:
    0 40px 80px -20px rgba(10,27,51,.09),
    0 0 0 1px rgba(255,255,255,.9) inset;
  overflow:hidden;
  height:640px;
  display:flex;flex-direction:column;
}


/* ============================================================
   FONDO: IMAGEN + EFECTOS
   ============================================================ */
.hero-bg{
  position:absolute;inset:0;
  pointer-events:none;z-index:0;
  overflow:hidden;
}

/* Video de fondo */
.hero-bg__video{
  position:absolute;
  right:0;top:50%;
  transform:translateY(-50%);
  width:62%;height:115%;
  object-fit:cover;
  object-position:center center;
}

/* Imagen fallback (se oculta si el video carga) */
.hero-bg__img--fallback{
  position:absolute;
  right:0;top:50%;
  transform:translateY(-50%);
  width:62%;height:115%;
  object-fit:cover;
  object-position:center center;
}
/* Ocultar fallback cuando el video está presente y disponible */
.hero-bg__video ~ .hero-bg__img--fallback{
  display:none;
}

/* Fade izquierda para que el texto sea legible */
.hero-bg__fade{
  position:absolute;inset:0;
  background:linear-gradient(
    to right,
    #ffffff  38%,
    rgba(255,255,255,.96) 50%,
    rgba(255,255,255,.55) 66%,
    rgba(255,255,255,.08) 84%,
    transparent 94%
  );
}

/* ---- Glow pulsante (resplandor azul sobre el cubo) ---- */
.glow{
  position:absolute;
  border-radius:50%;
  pointer-events:none;
}

/* Core: destello principal, brillante */
.glow--core{
  width:320px;height:320px;
  right:26%;top:50%;
  transform:translate(50%,-50%);
  background:radial-gradient(circle,
    rgba(27,83,212,.45) 0%,
    rgba(27,83,212,.15) 40%,
    transparent 70%
  );
  animation:glow-core 3.2s ease-in-out infinite;
}

/* Halo: anillo externo más suave */
.glow--halo{
  width:520px;height:520px;
  right:26%;top:50%;
  transform:translate(50%,-50%);
  background:radial-gradient(circle,
    rgba(27,83,212,.08) 0%,
    transparent 65%
  );
  border:1px solid rgba(27,83,212,.12);
  animation:glow-halo 4s ease-in-out infinite;
}

@keyframes glow-core{
  0%,100%{opacity:.45;transform:translate(50%,-50%) scale(.88)}
  50%     {opacity:.9; transform:translate(50%,-50%) scale(1.1)}
}
@keyframes glow-halo{
  0%,100%{opacity:.3;transform:translate(50%,-50%) scale(.82)}
  50%     {opacity:.7;transform:translate(50%,-50%) scale(1.15)}
}

/* ---- Shimmer / destello barrido diagonal ---- */
.shimmer{
  position:absolute;
  top:0;bottom:0;
  left:28%;width:45%;
  background:linear-gradient(
    108deg,
    transparent        30%,
    rgba(255,255,255,.5) 50%,
    transparent        70%
  );
  animation:shimmer 6s ease-in-out infinite;
  opacity:0;
}
.shimmer--b{
  width:28%;
  animation-delay:3s;
  animation-duration:5.5s;
}
@keyframes shimmer{
  0%       {transform:translateX(-110%);opacity:0}
  12%      {opacity:1}
  80%      {opacity:.4}
  100%     {transform:translateX(280%);opacity:0}
}

/* ---- Sparks (chispas pequeñas) ---- */
.spark{
  position:absolute;
  width:6px;height:6px;
  border-radius:50%;
  background:#fff;
  box-shadow:0 0 8px 4px rgba(27,83,212,.6);
  animation:spark-anim 4s ease-in-out infinite;
  opacity:0;
}
/* Posiciones (relativas al cubo, que está ~right:26%) */
.spark--1{right:29%;top:38%;animation-delay:0s}
.spark--2{right:24%;top:55%;animation-delay:1.4s}
.spark--3{right:32%;top:48%;animation-delay:2.6s}
.spark--4{right:22%;top:35%;animation-delay:3.8s}

@keyframes spark-anim{
  0%        {opacity:0;transform:scale(0)}
  20%       {opacity:1;transform:scale(1)}
  60%       {opacity:.6}
  100%      {opacity:0;transform:scale(.4) translateY(-12px)}
}


/* ============================================================
   CONTENIDO DEL HERO (texto izquierda)
   ============================================================ */
.hero-content{
  position:relative;z-index:10;
  flex:1;
  display:flex;flex-direction:column;justify-content:center;
  padding:60px 72px;
  max-width:680px;
}

/* Eyebrow badge */
.hero-eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-size:11px;font-weight:600;color:var(--muted);
  letter-spacing:.1em;text-transform:uppercase;
  margin-bottom:28px;
  opacity:0;transform:translateY(10px);
  border:1px solid rgba(148,163,184,.45);
  border-radius:6px;
  padding:6px 14px;
  background:rgba(255,255,255,.55);
  backdrop-filter:blur(6px);
  width:fit-content;
}

/* SKF distributor badge (hero) */
.hero-skf-badge{
  display: block;
  width: clamp(210px, 20vw, 310px);
  height: auto;
  object-fit: contain;
  margin-bottom: 32px;
}

/* Headline */
.hero-headline{
  font-family:var(--font);
  font-size:clamp(38px,5vw,72px);
  font-weight:700;
  line-height:1.05;
  letter-spacing:-.04em;
  color:var(--dark);
  margin-bottom:20px;
  opacity:0;transform:translateY(16px);
}
.hero-headline em{
  font-style:normal;
  color:var(--blue);
}

/* Descripción */
.hero-desc{
  font-size:clamp(14.5px,1.2vw,16px);
  font-weight:400;
  color:var(--muted);line-height:1.75;
  max-width:520px;margin-bottom:40px;
  opacity:0;transform:translateY(14px);
}
.hero-desc strong{color:var(--mid);font-weight:500}

/* CTAs wrapper */
.hero-ctas{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
}
#h-cta{opacity:0;transform:translateY(12px)}

/* Botón principal (azul marca) */
.btn-pill--orange{
  background:var(--blue);color:#fff;
  padding:14px 28px;font-size:13.5px;letter-spacing:.04em;
}
.btn-pill--orange:hover{
  background:#1644b8;
  transform:translateY(-1px);
  box-shadow:0 8px 24px rgba(27,83,212,.35);
}

/* Botón outline */
.btn-pill--outline{
  background:transparent;color:var(--dark);
  border:1.5px solid rgba(10,27,51,.22);
  padding:13.5px 24px;font-size:13.5px;letter-spacing:.04em;
}
.btn-pill--outline:hover{
  border-color:rgba(10,27,51,.45);
  background:rgba(10,27,51,.04);
}

/* Botón "Déjanos conocerte" — azul fuerte, con pulso continuo para llamar la atención */
.btn-pill--lead-cta{
  background:var(--blue);color:#fff;
  border:none;
  padding:14px 28px;font-size:13.5px;letter-spacing:.04em;
  animation:lead-cta-pulse 2.4s ease-in-out infinite;
}
.btn-pill--lead-cta:hover{
  background:#1644b8;
  transform:translateY(-1px);
  box-shadow:0 8px 24px rgba(27,83,212,.4);
}
@keyframes lead-cta-pulse{
  0%, 100%{ box-shadow:0 0 0 0 rgba(27,83,212,.45); }
  50%{ box-shadow:0 0 0 9px rgba(27,83,212,0); }
}
@media (prefers-reduced-motion: reduce){
  .btn-pill--lead-cta{ animation:none; }
}




/* ============================================================
   MARCAS (scroller)
   ============================================================ */
.brands{
  margin-top:64px;overflow:hidden;
  mask-image:linear-gradient(to right,transparent,black 10%,black 90%,transparent);
  -webkit-mask-image:linear-gradient(to right,transparent,black 10%,black 90%,transparent);
}
.brands__track{
  display:flex;width:max-content;
  animation:brands-scroll 28s linear infinite;
}
.brands__track:hover{animation-play-state:paused}
.brands__list{display:flex;align-items:center;gap:14px;padding:6px}

@keyframes brands-scroll{
  0%  {transform:translateX(0)}
  100%{transform:translateX(-50%)}
}

.brand-card{
  height:100px;width:196px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  border-radius:20px;
  background:#fff;
  border:1px solid rgba(148,163,184,.24);
  box-shadow:0 2px 10px rgba(10,27,51,.05);
  padding:12px 18px;
  transition:all .25s var(--ease);
  cursor:default;
  overflow:hidden;
}
.brand-card:hover{
  border-color:rgba(148,163,184,.5);
  box-shadow:0 6px 22px rgba(10,27,51,.1);
  transform:translateY(-2px);
}
.brand-card img{
  width:100%;height:100%;
  object-fit:contain;
}
.brand-card img[alt="Molykote"],
.brand-card img[alt="NSK"]{
  transform:scale(1.3);
}
.brand-card img[alt="Timken"],
.brand-card img[alt="Dodge"]{
  transform:scale(.78);
}
.brand-card img[alt="Bahco"]{
  transform:scale(2.05);
}
.brand-card img[alt="Vulcano"],
.brand-card img[alt="JIT"]{
  transform:scale(1.3);
}


/* ============================================================
   RESPONSIVO
   ============================================================ */
@media(max-width:1024px){
  .hero-bg__video,.hero-bg__img--fallback{width:78%;right:-4%}
  .hero-content{padding:48px 48px}
}

@media(max-width:900px){
  .nav__links,.nav__right{display:none}
  .nav__burger{display:flex}

  .hero-card{height:auto;min-height:560px}
  .hero-bg__video,.hero-bg__img--fallback{width:100%;left:-66px;right:auto;top:auto;bottom:-20px;transform:scale(1.41);transform-origin:50% 100%;height:30%;opacity:1;object-position:68% 50%}
  .hero-bg__fade{
    background:linear-gradient(to bottom,
      #ffffff 0%,
      #ffffff 72%,
      rgba(255,255,255,.5) 78%,
      transparent 85%
    );
  }
  .hero-content{padding:52px 32px 100px;max-width:100%}
  .glow--core,.glow--halo{right:15%}
}

@media(max-width:580px){
  .page{padding:calc(var(--nav-h) + 14px) 14px 32px}
  .hero-card{border-radius:28px}
  .hero-content{padding:44px 22px 88px}
  .hero-headline{font-size:27px}
  .fnav__links{display:none}
}


/* ============================================================
   SECCIÓN 2: CONÓCENOS
   ============================================================ */
.about-wrap{
  margin-top:64px;
  display:flex;flex-direction:column;gap:16px;
}

/* --- Card principal --- */
.about-card{
  border-radius:var(--r-hero);
  background:var(--white);
  border:1px solid rgba(148,163,184,.22);
  box-shadow:0 40px 80px -20px rgba(10,27,51,.09),0 0 0 1px rgba(255,255,255,.9) inset;
  overflow:hidden;
}
.about-inner{
  display:flex;
  min-height:460px;
}

/* Texto izquierda */
.about-text{
  flex:1;
  display:flex;flex-direction:column;justify-content:center;
  padding:72px 72px;
}
.about-eyebrow{
  display:flex;
  align-items:center;
  gap:12px;
  font-size:11px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;
  color:var(--blue);
  margin:0 0 18px;
}
.about-eyebrow-icon{
  width:18px;height:18px;
  flex-shrink:0;
  border-radius:50%;
  border:1.5px solid var(--blue);
  display:flex;
  align-items:center;
  justify-content:center;
}
.about-eyebrow-dot{
  width:6px;height:6px;
  border-radius:50%;
  background:var(--blue);
}
.about-eyebrow-line{
  width:56px;height:1.5px;
  flex-shrink:0;
  background:var(--blue);
}
.about-head{
  position:relative;
}
.about-dots{
  position:absolute;
  top:-14px;
  right:0;
  color:rgba(27,83,212,.22);
}
.about-headline{
  margin:0;
  font-family:'Anton', var(--font), sans-serif;
  font-weight:400;
  text-transform:uppercase;
  line-height:1.14;
}
.about-headline-a,
.about-headline-b{
  display:block;
  font-size:clamp(32px,3.6vw,56px);
  color:var(--dark);
  letter-spacing:.01em;
  word-spacing:.14em;
}
.about-headline-accent{ color:var(--blue); }
.about-rule{
  display:block;
  width:44px;height:3px;
  margin:20px 0 22px;
  background:var(--blue);
  border-radius:2px;
}
.about-body{
  font-size:15px;line-height:1.78;
  color:var(--muted);
  margin-top:16px;
}
.about-ctas{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:28px;
}
.about-tag{
  display:inline-flex;
  align-items:center;
  gap:9px;
  width:fit-content;
  padding:.72em 1.25em;
  border:1px solid rgba(27,83,212,.22);
  border-radius:999px;
  background:rgba(27,83,212,.07);
  font-size:12px;
  font-weight:700;
  letter-spacing:.11em;
  text-transform:uppercase;
  color:var(--blue);
  white-space:nowrap;
  transition:background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease);
}
.about-tag svg{ width:15px;height:15px; flex-shrink:0; }
.about-tag:hover{
  background:var(--blue);
  border-color:var(--blue);
  color:#fff;
}

/* Visual derecha */
.about-visual{
  width:44%;flex-shrink:0;
  position:relative;overflow:hidden;
}
.about-visual__bg{
  display:none;
}
.about-visual__dots{
  position:absolute;top:0;right:0;
  width:68%;height:52%;
  background-image:radial-gradient(circle,rgba(27,83,212,.22) 1.5px,transparent 1.5px);
  background-size:18px 18px;
  z-index:1;
}
.about-visual__corner{ display:none; }
.about-visual__bearing{
  position:absolute;
  left:50%;top:50%;
  transform:translate(-50%,-50%);
  width:78%;max-width:320px;
  z-index:2;
}
.about-visual__photo{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center top;
  display:block;
  z-index:2;
}

/* ============================================================
   BARRA: EN NÚMEROS
   ============================================================ */
.stats-bar{
  position:relative;
  margin-top:64px;
  border-radius:var(--r-hero);
  background:var(--white);
  border:1px solid rgba(148,163,184,.22);
  box-shadow:0 30px 70px -25px rgba(10,27,51,.14),0 0 0 1px rgba(255,255,255,.9) inset;
  padding:clamp(22px,2.4vw,32px) clamp(20px,2.2vw,32px) clamp(36px,4vw,52px);
  display:flex;
  flex-direction:column;
  overflow:hidden;
}

/* Título centrado sobre toda la tarjeta */
.stats-bar__head{
  text-align:center;
  margin-bottom:clamp(16px,2vw,26px);
}
.stats-bar__title{
  font-family:var(--font);
  font-size:clamp(13px,1.18vw,17px);
  font-weight:900;
  -webkit-text-stroke:.4px currentColor;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--dark);
  margin:0 0 12px;
}
.stats-bar__title span{ color:var(--blue); }
.stats-bar__head .stats-bar__accent{ margin:0 auto; }

/* Fila de columnas */
.stats-bar__cols{
  display:flex;
  align-items:stretch;
  gap:clamp(16px,1.9vw,28px);
}

.stats-bar__col{
  display:flex;flex-direction:column;
  justify-content:flex-start;   /* ambas columnas arrancan a la misma altura */
  min-width:0;
}
.stats-bar__ghost{ visibility:hidden; }
.stats-bar__col--figures{ flex:1.22; justify-content:center; }
.stats-bar__col--trust{ flex:1; }

.stats-bar__label{
  display:block;
  font-size:clamp(11px,.98vw,14px);
  font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;
  color:var(--blue);
  margin-bottom:11px;
}
.stats-bar__accent{
  display:block;
  width:clamp(26px,2.4vw,34px);height:2px;
  background:var(--blue);
  border-radius:2px;
  margin-bottom:clamp(20px,2.2vw,30px);
}
/* En la referencia el bloque de la derecha va centrado */
.stats-bar__col--trust{ text-align:center; }
.stats-bar__col--trust .stats-bar__accent{ margin-left:auto;margin-right:auto; }

.stats-bar__divider{
  width:1px;align-self:stretch;
  background:rgba(148,163,184,.28);
}

/* --- Columna izquierda: trayectoria y sucursales --- */
.stats-figures{
  display:flex;
  align-items:flex-start;   /* los números "+50" y "6" arrancan a la misma altura */
  gap:clamp(16px,2.2vw,32px);
}
.stats-divider{
  width:1px;align-self:stretch;
  background:rgba(148,163,184,.28);
}
/* Ambos bloques ("+50 / AÑOS" y "6 / SUCURSALES") con el mismo formato */
.stats-figure{ text-align:center; }

.stats-figure__num{
  font-family:var(--font);
  font-size:clamp(32px,5.4vw,76px);
  font-weight:800;
  letter-spacing:-.035em;
  line-height:1;
  /* cifras de ancho fijo: el número no “baila” mientras cuenta */
  font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum" 1;

  /* Acabado metalizado: reflejos claros y sombras profundas en diagonal */
  background:linear-gradient(148deg,
    #8fb6f5 0%,
    #2f6ae0 18%,
    #1B53D4 34%,
    #0a2f8e 50%,
    #1B53D4 63%,
    #4f86e8 78%,
    #a8c8f8 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
}
.stats-figure__plus,
.stats-figure__count{
  color:transparent;
  -webkit-text-fill-color:transparent;
}
.stats-figure__count{ display:inline-block; }

/* Si el navegador no soporta recortar el degradado al texto, azul plano */
@supports not ((-webkit-background-clip:text) or (background-clip:text)){
  .stats-figure__num,
  .stats-figure__plus,
  .stats-figure__count{
    color:var(--blue);
    -webkit-text-fill-color:var(--blue);
  }
}
.stats-figure__label{
  display:block;
  margin-top:11px;
  font-size:clamp(11px,1.02vw,14.5px);
  font-weight:700;
  letter-spacing:.09em;text-transform:uppercase;
  color:var(--dark);
  white-space:nowrap;
}
/* Grilla de 3 columnas: las cápsulas de ambas filas quedan alineadas */
.stats-branches{
  display:grid;
  grid-template-columns:repeat(3,auto);
  justify-content:center;
  justify-items:start;   /* cada cápsula ocupa solo su texto (ej. "Añelo") */
  column-gap:clamp(8px,.95vw,13px);
  row-gap:clamp(8px,.85vw,11px);
  margin-top:clamp(14px,1.5vw,21px);
}
.stats-branch{
  display:flex;align-items:center;gap:6px;
  font-size:clamp(10.5px,.92vw,13.2px);
  font-weight:600;
  color:var(--dark);
  background:#f3f5f9;
  border-radius:999px;
  padding:.6em 1em;
  white-space:nowrap;
}
.stats-branch__icon{
  width:.88em;height:.88em;flex-shrink:0;
  color:var(--blue);
}

/* --- Columna derecha: confianza --- */
.stats-trust__grid{
  display:flex;
  align-items:stretch;
  gap:clamp(12px,1.15vw,16px);
  flex:1;
}
.stats-trust__item{
  flex:1;
  min-width:0;
  display:flex;flex-direction:column;
  align-items:stretch;
  justify-content:flex-start;
  gap:14px;
  text-align:center;
}
.stats-trust__logo{
  height:clamp(48px,6.8vw,96px);width:100%;
  display:flex;align-items:center;justify-content:center;
}
/* Los dos distintivos quedan con el MISMO alto de arte visible. El SKF
   ya viene recortado sin margen (100% de su alto es arte); el ISO trae
   83,3% de margen propio, así que se compensa el alto de cada <img>
   para que los logos queden alineados y del mismo tamaño óptico. */
.stats-trust__logo img{
  width:auto;max-width:100%;
  object-fit:contain;
}
.stats-trust__logo--skf img{ height:78.1% }
.stats-trust__logo--iso img{ height:93.8% }
.stats-trust__logo--cmp img{ height:78.1% }

/* Ítem "apilado": los dos distintivos SKF, uno arriba del otro, con su
   tamaño normal (mismo alto que cualquier otro logo de esta fila). */
.stats-trust__item--stack{ justify-content:center; gap:16px; }
.stats-trust__stack-divider{
  width:26px;height:1px;
  background:rgba(148,163,184,.35);
  align-self:center;
}

/* El ítem de ISO queda centrado en su columna (más abajo que antes, ya
   que el ítem apilado de al lado ahora es más alto). */
.stats-trust__item:not(.stats-trust__item--stack){ justify-content:center; }
/* Tilde arriba, texto en dos tonos y línea azul debajo */
.stats-trust__caption{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  width:100%;
}
.stats-trust__check{
  width:clamp(16px,1.35vw,20px);
  height:clamp(16px,1.35vw,20px);
  color:var(--blue);
  flex-shrink:0;
  margin-bottom:2px;
}
.stats-trust__caption-main{
  display:block;
  font-size:clamp(10px,.87vw,12.5px);
  font-weight:700;
  letter-spacing:.11em;
  text-transform:uppercase;
  color:var(--dark);
  line-height:1.45;
}
.stats-trust__caption-sub{
  display:block;
  font-size:clamp(9.5px,.8vw,11.5px);
  font-weight:600;
  letter-spacing:.09em;
  text-transform:uppercase;
  color:var(--blue);
  line-height:1.45;
  margin-top:-3px;
}
.stats-trust__rule{
  display:block;
  width:clamp(28px,2.6vw,38px);
  height:2px;
  background:var(--blue);
  border-radius:2px;
  margin-top:4px;
}

/* --- Detalle decorativo inferior --- */
/* Franja azul inferior de ancho completo, en tres tramos con corte diagonal */
.stats-bar__band{
  position:absolute; left:0; right:0; bottom:0;
  height:clamp(18px,2.2vw,30px);
  display:block;
  pointer-events:none;
}
.stats-bar__band > span{
  position:absolute; top:0; bottom:0;
  display:block;
}
/* tramo claro: ocupa todo el fondo */
.stats-bar__band-c{
  left:0; right:0;
  background:linear-gradient(90deg,#9dbdec 0%,#b9d0f3 100%);
}
/* tramo medio */
.stats-bar__band-b{
  left:0; width:76%;
  background:linear-gradient(90deg,#2f6ae0 0%,#5a8be9 100%);
  clip-path:polygon(0 0,100% 0,calc(100% - 52px) 100%,0 100%);
}
/* tramo oscuro */
.stats-bar__band-a{
  left:0; width:46%;
  background:linear-gradient(90deg,#1240c2 0%,#2059d8 100%);
  clip-path:polygon(0 0,100% 0,calc(100% - 52px) 100%,0 100%);
}

@media(max-width:1024px){
  .about-text{padding:56px 52px}
  .about-visual{width:40%}
  .stats-branch{padding:.5em .85em}
}
/* Laptop chico: las dos columnas siguen una al lado de la otra, pero las
   cápsulas no entran de a 3 sin tocar el divisor */
@media(max-width:1010px) and (min-width:901px){
  .stats-branches{grid-template-columns:repeat(2,auto)}
}
@media(max-width:900px){
  .about-visual{display:none}
  .about-text{padding:52px 40px}
  .about-inner{min-height:auto}
  .stats-bar__cols{flex-direction:column;gap:32px}
  .stats-bar__divider{width:auto;height:1px;align-self:stretch}
  .stats-trust__grid{max-width:480px}
}
@media(max-width:580px){
  .about-card,.stats-bar{border-radius:28px}
  .about-text{padding:44px 22px}

  /* Tarjeta más compacta: menos aire arriba/abajo */
  .stats-bar{margin-top:44px;padding:24px 20px 32px}
  .stats-bar__head{margin-bottom:20px}
  .stats-bar__cols{gap:24px}
  .stats-bar__divider{display:none}

  /* Fila de estadísticas: "+50" y "6" en dos columnas con divisor sutil.
     Los wrappers .stats-figure se “aplanan” con display:contents para que
     su número/etiqueta se ubiquen directamente en el grid de .stats-figures,
     y la grilla de sucursales pueda ocupar todo el ancho debajo. */
  .stats-figures{
    display:grid;
    grid-template-columns:1fr 1px 1fr;
    column-gap:16px;
    row-gap:6px;
  }
  .stats-figure{ display:contents; }
  .stats-figure:not(.stats-figure--branches) .stats-figure__num{ grid-column:1; grid-row:1; text-align:left; }
  .stats-figure:not(.stats-figure--branches) .stats-figure__label{ grid-column:1; grid-row:2; text-align:left; white-space:normal; }
  .stats-figure--branches .stats-figure__num{ grid-column:3; grid-row:1; text-align:left; }
  .stats-figure--branches .stats-figure__label{ grid-column:3; grid-row:2; text-align:left; white-space:normal; }
  .stats-divider{ grid-column:2; grid-row:1/3; width:1px; height:auto; align-self:stretch; }

  /* Sucursales: grilla de 2 columnas x 3 filas, píldoras de igual altura */
  .stats-branches{
    grid-column:1/-1;
    grid-row:3;
    display:grid;
    grid-template-columns:1fr 1fr;
    justify-items:stretch;
    column-gap:10px;
    row-gap:10px;
    margin-top:22px;
  }
  .stats-branch{
    width:100%;
    box-sizing:border-box;
    justify-content:flex-start;
  }

  /* Respaldos SKF + ISO */
  .stats-trust__grid{flex-direction:column;gap:22px}

  /* Los dos badges SKF, lado a lado como tarjetas del mismo tamaño */
  .stats-trust__item--stack{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
  }
  .stats-trust__stack-divider{ display:none; }
  .stats-trust__logo--skf,
  .stats-trust__logo--cmp{
    height:76px;
    border:1px solid rgba(148,163,184,.32);
    border-radius:14px;
    background:var(--white);
    box-sizing:border-box;
    padding:12px;
  }

  /* Tarjeta ISO: badge a la izquierda, separador sutil, check + textos a la derecha */
  .stats-trust__item:not(.stats-trust__item--stack){
    flex-direction:row;
    align-items:center;
    justify-content:center;
    gap:18px;
    border:1px solid rgba(148,163,184,.32);
    border-radius:14px;
    background:var(--white);
    padding:16px 18px;
  }
  .stats-trust__logo--iso{
    flex:0 0 auto;
    height:52px;width:auto;
    padding-right:18px;
    border-right:1px solid rgba(148,163,184,.28);
  }
  .stats-trust__caption{ flex:1; min-width:0; }
}

/* Pantallas muy angostas: la tarjeta ISO pasa a columna para no desbordar */
@media(max-width:360px){
  .stats-trust__item:not(.stats-trust__item--stack){
    flex-direction:column;
    gap:10px;
  }
  .stats-trust__logo--iso{
    padding-right:0;
    border-right:none;
    padding-bottom:10px;
    border-bottom:1px solid rgba(148,163,184,.28);
  }
}


/* ============================================================
   SECCIÓN 3: SOLUCIONES INDUSTRIALES
   ============================================================ */
.solutions-wrap{ margin-top:64px; }

.solutions-card{
  border-radius:var(--r-hero);
  background:var(--white);
  border:1px solid rgba(148,163,184,.22);
  box-shadow:0 40px 80px -20px rgba(10,27,51,.09),0 0 0 1px rgba(255,255,255,.9) inset;
  padding:64px 64px 56px;
  overflow:hidden;
}

.solutions-eyebrow{
  text-align:center;
  font-size:clamp(10px,.85vw,12px);
  font-weight:700;
  letter-spacing:.32em;
  text-transform:uppercase;
  color:var(--blue);
  margin:0 0 clamp(10px,1.4vw,18px);
}
.solutions-heading{
  font-family:'Anton', var(--font), sans-serif;
  font-size:clamp(46px,7.4vw,108px);
  font-weight:400;
  letter-spacing:-.01em;
  line-height:1.04;
  text-transform:uppercase;
  text-align:center;
  color:var(--dark);
  margin:0 0 clamp(24px,3vw,36px);
}
.solutions-heading em{
  font-style:normal;
  color:var(--blue);
}

.solutions-actions{
  display:flex;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
  margin-bottom:clamp(40px,5vw,64px);
}
.solutions-tag{
  display:inline-flex;
  align-items:center;
  font-size:clamp(9px,.68vw,10.5px);
  font-weight:600;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:var(--blue);
  background:rgba(27,83,212,.07);
  border:1px solid rgba(27,83,212,.22);
  border-radius:999px;
  padding:.6em 1.05em;
  white-space:nowrap;
  transition:background .25s var(--ease),color .25s var(--ease),border-color .25s var(--ease);
}
.solutions-tag:hover{
  background:var(--blue);
  border-color:var(--blue);
  color:var(--white);
}

.tiles-grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  grid-auto-rows:clamp(150px,15vw,200px);
  gap:16px;
}

.tile-card{
  position:relative;
  display:block;
  grid-column:span 2;
  border-radius:14px;
  overflow:hidden;
  opacity:0;
  filter:blur(18px);
  transition:opacity .6s var(--ease),filter .6s var(--ease),transform .35s var(--ease),box-shadow .35s var(--ease);
}
.tile-card--featured{ grid-column:span 3; grid-row:span 2; }
.tile-card--wide{ grid-column:span 3; }
.solutions-card.visible .tile-card{ opacity:1;filter:blur(0) }
.solutions-card.visible .tile-card:nth-child(1){ transition-delay:.05s }
.solutions-card.visible .tile-card:nth-child(2){ transition-delay:.17s }
.solutions-card.visible .tile-card:nth-child(3){ transition-delay:.29s }
.solutions-card.visible .tile-card:nth-child(4){ transition-delay:.41s }
.solutions-card.visible .tile-card:nth-child(5){ transition-delay:.53s }
.solutions-card.visible .tile-card:nth-child(6){ transition-delay:.65s }

.tile-card:hover{
  transform:translateY(-3px);
  box-shadow:0 16px 40px rgba(10,27,51,.18);
  transition-delay:0s;
}

.tile-card img,
.tile-card video{
  width:100%;height:100%;
  object-fit:cover;
  transition:transform .5s var(--ease);
}
.tile-card video{ object-position:center top; }
.tile-card--wide video{ object-position:center 40%; }
.tile-card:hover img,
.tile-card:hover video{ transform:scale(1.05) }

/* Recorta el margen inferior del video para ocultar la marca de agua de la IA */
@media(min-width:901px){
  .tile-card:not(.tile-card--wide):not(.tile-card--featured) video{
    transform:scale(1.22);
    transform-origin:50% 0%;
  }
  .tile-card:not(.tile-card--wide):not(.tile-card--featured):hover video{ transform:scale(1.28) }
}
@media(max-width:900px){
  .tile-card video{
    transform:scale(1.35);
    transform-origin:50% 0%;
  }
  .tile-card--wide video{ transform-origin:50% 22%; }
  .tile-card:hover video{ transform:scale(1.4) }
}
.tile-card::after{
  content:'';
  position:absolute;
  inset:0;
  z-index:1;
  background:linear-gradient(to top, rgba(6,14,28,.78) 0%, rgba(6,14,28,.28) 42%, rgba(6,14,28,0) 68%);
  pointer-events:none;
}

.tile-card__name{
  position:absolute;left:16px;bottom:12px;right:16px;
  z-index:2;
  font-size:17px;font-weight:800;
  letter-spacing:-.01em;
  color:#fff;
  text-shadow:0 1px 4px rgba(10,27,51,.55),0 2px 14px rgba(10,27,51,.45);
}
.tile-card--featured .tile-card__name{
  left:22px;bottom:20px;right:22px;
  font-size:23px;
}

@media(max-width:900px){
  .tiles-grid{ grid-template-columns:repeat(4,1fr); grid-auto-rows:clamp(140px,20vw,180px); }
  .tile-card{ grid-column:span 2; grid-row:span 1; }
  .tile-card--featured{ grid-column:span 4; grid-row:span 1; }
  .tile-card--featured .tile-card__name{ font-size:19px; }
  .solutions-card{ padding:48px 36px 40px }
}
@media(max-width:580px){
  .tiles-grid{ grid-template-columns:1fr; grid-auto-rows:auto; }
  .tile-card,.tile-card--wide,.tile-card--featured{ grid-column:span 1; grid-row:span 1; aspect-ratio:16/9; }
  .tile-card--featured .tile-card__name{ font-size:17px; left:16px; bottom:12px; right:16px; }
  .solutions-card{ border-radius:28px; padding:40px 22px }
}


/* ============================================================
   SECCIÓN: ACTUALIDAD
   ============================================================ */
.news-wrap{ margin-top:64px; scroll-margin-top:calc(var(--nav-h) + 24px); }

.news-card{
  border-radius:var(--r-hero);
  background:var(--bg);
  border:1px solid rgba(148,163,184,.18);
  box-shadow:0 20px 60px -15px rgba(10,27,51,.07);
  overflow:hidden;
}

.news-inner{
  display:flex;
  align-items:center;
  min-height:440px;
}

/* Texto izquierda */
.news-content{
  flex:0 0 40%;
  padding:64px 32px 64px 72px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.news-eyebrow{
  display:flex;
  align-items:center;
  gap:12px;
  font-size:11px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;
  color:var(--blue);
  margin:0 0 18px;
}
.news-eyebrow-icon{
  width:18px;height:18px;
  flex-shrink:0;
  border-radius:50%;
  border:1.5px solid var(--blue);
  display:flex;
  align-items:center;
  justify-content:center;
}
.news-eyebrow-dot{
  width:6px;height:6px;
  border-radius:50%;
  background:var(--blue);
}
.news-eyebrow-line{
  width:56px;height:1.5px;
  flex-shrink:0;
  background:var(--blue);
}
.news-head{
  position:relative;
}
.news-dots{
  position:absolute;
  top:-14px;
  right:0;
  color:rgba(27,83,212,.22);
}
.news-headline{
  margin:0;
  font-family:'Anton', var(--font), sans-serif;
  font-weight:400;
  text-transform:uppercase;
  line-height:.96;
}
.news-headline-a{
  display:block;
  font-size:clamp(38px,4vw,58px);
  color:var(--dark);
}
.news-headline-b{
  display:block;
  font-size:clamp(38px,4vw,58px);
  color:var(--dark);
}
.news-headline-accent{ color:var(--blue); }
.news-rule{
  display:block;
  width:44px;height:3px;
  margin:18px 0 20px;
  background:var(--blue);
  border-radius:2px;
}
.news-desc{
  font-size:16px;
  color:var(--muted);
  line-height:1.6;
  max-width:400px;
  border-left:2px solid var(--blue);
  padding-left:18px;
}

.news-follow{
  display:flex;
  align-items:center;
  gap:16px;
  margin-top:36px;
  margin-bottom:16px;
  max-width:400px;
}
.news-follow__label{
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--dark);
  white-space:nowrap;
}
.news-follow__line{
  flex:1 1 auto;
  height:1px;
  background:rgba(148,163,184,.4);
}
.news-social{
  display:flex;
  align-items:center;
  gap:12px;
}
.news-social a{
  display:flex;
  align-items:center;
  justify-content:center;
  width:38px;height:38px;
  border-radius:50%;
  border:1px solid rgba(148,163,184,.35);
  color:var(--dark);
  transition:background .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease);
}
.news-social a:hover{
  background:var(--blue);
  border-color:var(--blue);
  color:var(--white);
}

/* Publicación derecha: carrusel */
.news-carousel{
  position:relative;
  flex:0 0 60%;
  height:100%;
  padding:32px 32px;
}
.news-carousel__viewport{
  position:relative;
  width:100%;
  height:100%;
  min-height:376px;
}
.news-slide{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  opacity:0;
  pointer-events:none;
  transition:opacity .5s var(--ease), transform .25s var(--ease);
}
.news-slide.is-active{
  opacity:1;
  pointer-events:auto;
  position:relative;
}
.news-slide:hover{ transform:scale(1.015); }
.news-post__img{
  display:block;
  width:100%;
  max-height:420px;
  object-fit:contain;
}

/* Slide de video */
.news-video-stage{
  position:relative;
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
}
.news-video{
  display:block;
  width:68%;
  max-height:412px;
  aspect-ratio:1.35;
  object-fit:cover;
  border-radius:24px;
  box-shadow:0 20px 44px -12px rgba(10,27,51,.28);
  position:relative;
  z-index:1;
}
.news-video-card-link{
  display:block;
  width:37%;
  position:relative;
  z-index:2;
  margin-left:-8%;
  line-height:0;
}
.news-video-card{
  display:block;
  width:100%;
  height:auto;
  border-radius:16px;
}

/* Flechas y dots */
.news-carousel__arrow{
  position:absolute;
  top:50%;
  translate:0 -50%;
  width:38px;height:38px;
  border-radius:50%;
  border:1px solid rgba(148,163,184,.3);
  background:var(--white);
  color:var(--dark);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
  box-shadow:0 8px 20px -8px rgba(10,27,51,.25);
  transition:background .2s var(--ease), color .2s var(--ease);
  z-index:2;
}
.news-carousel__arrow:hover{ background:var(--dark); color:var(--white); }
.news-carousel__arrow--prev{ left:12px; }
.news-carousel__arrow--next{ right:12px; }

.news-carousel__dots{
  position:absolute;
  left:50%;
  bottom:4px;
  translate:-50% 0;
  display:flex;
  gap:8px;
  z-index:2;
}
.news-dot{
  width:7px;height:7px;
  border-radius:50%;
  background:rgba(51,65,85,.25);
  border:none;
  cursor:pointer;
  padding:0;
  transition:background .2s var(--ease), transform .2s var(--ease);
}
.news-dot.is-active{ background:var(--dark); transform:scale(1.3); }

@media(max-width:1200px){
  .news-content{padding:56px 28px 56px 56px}
  .news-carousel{padding:28px 40px}
}
@media(max-width:1024px){
  .news-inner{min-height:400px}
  .news-content{padding:48px 24px 48px 48px}
  .news-carousel{padding:24px 32px}
  .news-post__img{max-height:340px}
  .news-video{max-height:320px}
}
@media(max-width:768px){
  .news-inner{flex-direction:column;justify-content:flex-start;min-height:auto}
  .news-content{flex:0 0 auto;width:100%;padding:44px 36px 24px}
  .news-carousel{flex:0 0 auto;width:100%;padding:16px 24px 48px}
  .news-carousel__viewport{min-height:200px}
  .news-post__img{max-height:none}
  .news-carousel__arrow{top:34px}
  .news-carousel__arrow--prev{left:0}
  .news-carousel__arrow--next{right:0}
  .news-video{max-height:260px}
}
@media(max-width:580px){
  .news-card{border-radius:28px}
  .news-content{padding:36px 22px 16px}
  .news-carousel{padding:12px 16px 44px}
  .news-carousel__viewport{min-height:170px}
  .news-video{max-height:210px}
}


/* ============================================================
   SECCIÓN: INDUSTRIAS
   ============================================================ */
.industries-wrap{ margin-top:20px; }

.industries-card{
  border-radius:var(--r-hero);
  background:var(--bg);
  border:1px solid rgba(148,163,184,.22);
  box-shadow:0 20px 60px -15px rgba(10,27,51,.07);
  overflow:hidden;
}

.industries-top{
  position:relative;
  overflow:hidden;
  padding:64px 72px 52px;
  min-height:260px;
}
.industries-top-content{
  position:relative;
  z-index:1;
  max-width:50%;
}
.industries-banner-img{
  position:absolute;
  top:0;right:0;
  height:100%;
  width:auto;
  object-fit:cover;
  pointer-events:none;
  user-select:none;
  /* La foto trae un degradado a blanco quemado en su borde izquierdo. Sobre el
     fondo gris de la card ese blanco se notaría como una mancha, así que lo
     recortamos con una máscara que copia el mismo tramo del degradado. */
  -webkit-mask-image:linear-gradient(to right, transparent 0, transparent 30%, #000 66%);
  mask-image:linear-gradient(to right, transparent 0, transparent 30%, #000 66%);
}
.industries-eyebrow{
  display:flex;
  align-items:center;
  gap:12px;
  font-size:11px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;
  color:var(--blue);
  margin:0 0 18px;
}
.industries-eyebrow-icon{
  width:18px;height:18px;
  flex-shrink:0;
  border-radius:50%;
  border:1.5px solid var(--blue);
  display:flex;
  align-items:center;
  justify-content:center;
}
.industries-eyebrow-dot{
  width:6px;height:6px;
  border-radius:50%;
  background:var(--blue);
}
.industries-eyebrow-line{
  width:56px;height:1.5px;
  flex-shrink:0;
  background:var(--blue);
}
.industries-head{
  position:relative;
}
.industries-dots{
  position:absolute;
  top:-14px;
  right:0;
  color:rgba(27,83,212,.22);
}
.industries-headline{
  margin:0;
  font-family:'Anton', var(--font), sans-serif;
  font-weight:400;
  text-transform:uppercase;
  line-height:1.02;
}
.industries-headline-a,
.industries-headline-b{
  display:block;
  font-size:clamp(38px,4.4vw,66px);
  color:var(--dark);
}
.industries-headline-accent{ color:var(--blue); }
.industries-rule{
  display:block;
  width:44px;height:3px;
  margin:18px 0 20px;
  background:var(--blue);
  border-radius:2px;
}
.industries-desc{
  font-size:16px;
  color:var(--muted);
  max-width:480px;
  line-height:1.65;
}
.industries-tag{
  display:inline-flex;
  align-items:center;
  gap:9px;
  margin-top:22px;
  font-size:12px;
  font-weight:700;
  letter-spacing:.11em;
  text-transform:uppercase;
  color:var(--blue);
  background:rgba(27,83,212,.07);
  border:1px solid rgba(27,83,212,.22);
  border-radius:999px;
  padding:.72em 1.25em;
  white-space:nowrap;
  transition:background .25s var(--ease),color .25s var(--ease),border-color .25s var(--ease);
}
.industries-tag svg{
  width:15px;height:15px;flex-shrink:0;
}
.industries-tag:hover{
  background:var(--blue);
  border-color:var(--blue);
  color:var(--white);
}

.industries-bottom{
  background:var(--dark);
  background-image:radial-gradient(rgba(255,255,255,.045) 1px, transparent 1px);
  background-size:24px 24px;
  padding:48px 64px 52px;
}
.industries-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
}
.industry-card{
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.09);
  border-radius:18px;
  padding:28px 22px 24px;
  display:flex;flex-direction:column;
  align-items:flex-start;
  gap:14px;
  transition:background .25s ease,border-color .25s ease,transform .22s ease,box-shadow .25s ease;
  cursor:default;
}
.industry-card:hover{
  background:rgba(27,83,212,.18);
  border-color:rgba(27,83,212,.55);
  transform:translateY(-4px);
  box-shadow:0 12px 32px rgba(27,83,212,.2);
}
.industry-icon{
  width:38px;height:38px;
  color:var(--blue);
  flex-shrink:0;
}
.industry-name{
  font-size:14px;font-weight:700;
  color:rgba(255,255,255,.88);
  letter-spacing:-.01em;
  line-height:1.3;
}

@media(max-width:1024px){
  .industries-top{padding:52px 52px 40px}
  .industries-top-content{max-width:55%}
  .industries-bottom{padding:40px 48px 44px}
}
@media(max-width:900px){
  .industries-grid{grid-template-columns:repeat(2,1fr)}
  .industries-top{padding:44px 40px 36px;min-height:220px}
  .industries-top-content{max-width:60%}
  .industries-bottom{padding:36px 36px 40px}
}
@media(max-width:640px){
  .industries-top-content{max-width:100%}
  .industries-banner-img{display:none}
  .industries-top{min-height:auto}
}
@media(max-width:580px){
  .industries-card{border-radius:28px}
  .industries-top{padding:36px 22px 28px}
  .industries-bottom{padding:28px 18px 32px}
  .industries-grid{gap:10px}
  .industry-card{padding:22px 16px 18px}
}


/* ============================================================
   SECCIÓN: COBERTURA REGIONAL
   ============================================================ */
.coverage-wrap{ margin-top:64px; }

.coverage-card{
  position:relative;
  border-radius:var(--r-hero);
  background:var(--bg);
  border:1px solid rgba(148,163,184,.18);
  box-shadow:0 20px 60px -15px rgba(10,27,51,.07);
  overflow:hidden;
}

/* ── Fila superior: texto + mapa en dos columnas ── */
.coverage-top{
  display:flex;
  align-items:center;
  min-height:600px;
}
.coverage-map-zone{
  flex:0 0 60%;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px 16px 16px 0;
}
.coverage-map-img{
  display:block;
  width:100%;
  max-width:clamp(300px,33vw,470px);
  height:auto;
  object-fit:contain;
  margin:0 auto;
}

/* Texto — columna izquierda del flex */
.coverage-text{
  flex:0 0 40%;
  padding:72px 24px 64px 72px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.coverage-eyebrow{
  display:flex;
  align-items:center;
  gap:12px;
  font-size:11px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;
  color:var(--blue);
  margin:0 0 10px;
}
.coverage-eyebrow-icon{
  width:18px;height:18px;
  flex-shrink:0;
  border-radius:50%;
  border:1.5px solid var(--blue);
  display:flex;
  align-items:center;
  justify-content:center;
}
.coverage-eyebrow-dot{
  width:6px;height:6px;
  border-radius:50%;
  background:var(--blue);
}
.coverage-eyebrow-line{
  width:56px;height:1.5px;
  flex-shrink:0;
  background:var(--blue);
}
.coverage-accent{
  display:block;
  width:24px;height:2px;
  background:var(--blue);
  border-radius:2px;
  margin:0 0 18px 30px;
}
.coverage-head{
  display:flex;
  align-items:flex-start;
  gap:14px;
}
.coverage-dots{
  flex-shrink:0;
  width:40px;height:58px;
  margin-top:4px;
  color:rgba(27,83,212,.22);
}
.coverage-headline{
  margin:0;
  font-family:'Anton', var(--font), sans-serif;
  font-weight:400;
  text-transform:uppercase;
  line-height:.94;
}
.coverage-headline-lead{
  display:block;
  font-size:clamp(16px,1.7vw,22px);
  color:var(--blue);
  margin-bottom:2px;
}
.coverage-headline-big{
  display:block;
  font-size:clamp(28px,3.6vw,50px);
}
.coverage-headline-hero{
  font-size:clamp(40px,5.4vw,76px);
}
.coverage-zoom{
  display:inline-block;
  transform-origin:left center;
}
[data-scroll-reveal].visible .coverage-zoom{
  animation: coverage-zoom-pulse 3.4s ease-in-out infinite;
}
@keyframes coverage-zoom-pulse{
  0%, 100%{ transform:scale(1); }
  50%{ transform:scale(1.035); }
}
@media (prefers-reduced-motion: reduce){
  .coverage-zoom{ animation:none; }
}
.coverage-headline-blue{ color:var(--blue); }
.coverage-headline-dark{ color:var(--dark); }
.coverage-rule{
  position:relative;
  display:block;
  width:min(360px,70%);
  height:20px;
  margin:6px 0 16px;
  border-left:2px solid var(--blue);
  border-bottom:2px solid var(--blue);
  border-bottom-left-radius:16px;
}
.coverage-rule-dot{
  position:absolute;
  right:-8px;
  bottom:-9px;
  width:16px;height:16px;
  border-radius:50%;
  border:2px solid var(--blue);
  background:var(--bg);
}
.coverage-rule-dot::after{
  content:'';
  position:absolute;
  top:50%;left:50%;
  width:6px;height:6px;
  border-radius:50%;
  background:var(--blue);
  transform:translate(-50%,-50%);
}
.coverage-desc{
  font-size:15px;
  color:var(--muted);
  line-height:1.72;
  max-width:420px;
  margin-bottom:32px;
}
.coverage-ctas{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
}

/* Branch cards */
.coverage-branches{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  border-top:1px solid rgba(148,163,184,.22);
}
.branch-card{
  padding:20px 14px 16px;
  text-align:center;
  border-right:1px solid rgba(148,163,184,.22);
  transition:background .2s ease;
}
.branch-card:last-child{ border-right:none; }
.branch-card:hover{ background:rgba(27,83,212,.03); }

.branch-icon{
  width:42px;height:42px;
  background:var(--blue);
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 10px;
  color:#fff;
  flex-shrink:0;
}
.branch-icon svg{ width:18px;height:18px; }
.branch-city{
  font-size:13px;font-weight:700;
  color:var(--dark);
  letter-spacing:-.01em;
  margin-bottom:3px;
}
.branch-sub{
  font-size:11px;color:var(--muted);
  margin-bottom:12px;
}
.branch-photo{
  border-radius:10px;
  height:112px;
  overflow:hidden;
  background:var(--bg);
}
.branch-photo img{
  width:100%;height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}
.branch-photo--placeholder{
  background:linear-gradient(135deg, #e0e7f0 0%, #c8d5e8 100%);
  display:flex;align-items:center;justify-content:center;
}
.branch-photo--anelo{
  background:linear-gradient(135deg, #1a2d4a 0%, #0d1f3a 100%);
}
.branch-actions{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  margin-top:10px;
}
.branch-map{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:12px;font-weight:600;
  color:#4285F4;
  transition:letter-spacing .15s ease, color .15s ease;
}
.branch-map svg{ flex-shrink:0; }
.branch-map:hover{ letter-spacing:.02em; color:#EA4335; }
.branch-wa .cr-faq-wa{
  margin:0;
  gap:6px;
  padding:6px 13px;
  font-size:11.5px;
  font-weight:600;
  line-height:1.3;
}
.branch-wa .cr-faq-wa svg{ width:12px;height:12px; }

@media(max-width:1100px){
  .coverage-text{padding:56px 36px 48px 52px}
}
@media(max-width:900px){
  .coverage-text{max-width:100%;padding:44px 40px 36px}
  .coverage-branches{grid-template-columns:repeat(3,1fr)}
  .branch-card:nth-child(3n){ border-right:none }
  .branch-card:nth-child(n+4){ border-top:1px solid rgba(148,163,184,.22) }
}
@media(max-width:580px){
  .coverage-card{border-radius:28px 28px 0 0}
  .coverage-top{flex-direction:column;min-height:auto}
  .coverage-text{flex:0 0 auto;width:100%;padding:36px 30px 8px}
  .coverage-desc{font-size:17px;line-height:1.6}
  .coverage-ctas{flex-direction:column;align-items:flex-start;gap:14px}
  .coverage-ctas .btn-pill--lg{padding:17px 32px}
  .coverage-map-zone{flex:0 0 auto;width:100%;padding:0 30px 32px}
  .coverage-map-img{max-width:min(360px,100%)}
  .coverage-branches{grid-template-columns:repeat(2,1fr)}
  .branch-card:nth-child(2n){ border-right:none }
  .branch-card:nth-child(n+3){ border-top:1px solid rgba(148,163,184,.22) }
}


/* ============================================================
   SECCIÓN: CAPACITACIONES TÉCNICAS
   ============================================================ */
.training-wrap{ margin-top:64px; }

.training-card{
  border-radius:var(--r-hero);
  background:var(--white);
  box-shadow:0 20px 60px -15px rgba(10,27,51,.07);
  overflow:hidden;
}

/* ── Header ── */
.training-header{
  position:relative;
  overflow:hidden;
  min-height:320px;
  display:flex;
  align-items:center;
}
.training-intro{
  position:relative;
  z-index:2;
  width:52%;
  padding:60px 52px 52px 68px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.training-head{
  position:relative;
}
.training-dots{
  position:absolute;
  top:-14px;
  right:0;
  color:rgba(27,83,212,.22);
}
.training-headline{
  margin:0;
  font-family:'Anton', var(--font), sans-serif;
  font-weight:400;
  text-transform:uppercase;
  line-height:.96;
}
.training-headline-a,
.training-headline-b{
  display:block;
  font-size:clamp(26px,2.8vw,44px);
  color:var(--dark);
}
.training-headline-accent{ color:var(--blue); }
.training-rule{
  display:block;
  width:44px;height:3px;
  margin:18px 0 20px;
  background:var(--blue);
  border-radius:2px;
}
.training-lead{
  font-size:15px;
  color:var(--muted);
  line-height:1.7;
  max-width:480px;
}
.training-badges{
  display:flex;
  flex-wrap:nowrap;
  gap:8px;
  margin-top:24px;
}
.training-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  width:fit-content;
  padding:.5em .85em;
  border:1px solid rgba(27,83,212,.22);
  border-radius:999px;
  background:rgba(27,83,212,.07);
  font-size:9.5px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--blue);
  white-space:nowrap;
  transition:background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease);
}
.training-badge svg{ width:12px;height:12px; flex-shrink:0; }
.training-badge:hover{
  background:var(--blue);
  border-color:var(--blue);
  color:#fff;
}
/* Imagen decorativa absoluta — lado derecho, sin caja visible */
.training-hero-img{
  position:absolute;
  right:0;
  left:58%;
  top:0;
  bottom:0;
  pointer-events:none;
  z-index:1;
}
.training-hero-img::after{
  content:'';
  position:absolute;
  inset:0;
  background:
    linear-gradient(to right, var(--white) 0%, transparent 35%),
    linear-gradient(to bottom, transparent 82%, var(--white) 100%);
  z-index:2;
}
.training-hero-img img,
.training-hero-img video{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:right center;
  display:block;
}

/* ── Grid de cursos 3×2 ── */
.training-courses{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  column-gap:16px;
  row-gap:24px;
  padding:28px 28px 32px;
  background:var(--white);
}
.training-courses .course-card{ grid-column:span 2; }
.training-courses .course-card:nth-child(4),
.training-courses .course-card:nth-child(5){ grid-column:span 3; }
.course-card{
  display:flex;
  align-items:stretch;
  min-height:270px;
  background:var(--white);
  border:1px solid rgba(148,163,184,.2);
  border-radius:20px;
  overflow:visible;
  box-shadow:0 2px 12px rgba(10,27,51,.06);
  transition:box-shadow .2s ease, transform .2s ease;
}
.course-card:hover{
  box-shadow:0 10px 30px rgba(10,27,51,.13);
  transform:translateY(-2px);
}

.course-info{
  flex:0 0 50%;
  min-width:0;
  padding:26px 12px 22px 24px;
  display:flex;
  flex-direction:column;
}
.course-num{
  font-family:'Anton', var(--font), sans-serif;
  font-weight:400;
  font-size:32px;
  color:var(--blue);
  line-height:1;
  margin-bottom:14px;
}
.course-label{
  font-size:10.5px;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;
  color:var(--blue);
  margin-bottom:8px;
}
.course-title{
  font-size:13.5px;font-weight:800;
  text-transform:uppercase;
  letter-spacing:-.01em;
  color:var(--dark);
  line-height:1.35;
  margin-bottom:12px;
}
.course-line{
  display:block;
  width:24px;height:3px;
  background:var(--blue);
  border-radius:2px;
  margin-bottom:12px;
}
.course-desc{
  font-size:12px;
  color:var(--muted);
  line-height:1.62;
  flex:1;
  margin-bottom:14px;
}
.course-link{
  font-size:11.5px;font-weight:600;
  color:var(--blue);
  transition:letter-spacing .15s ease;
}
.course-link:hover{ letter-spacing:.02em; }

.course-actions{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
  margin-top:auto;
}
.course-actions .cr-faq-wa{
  margin:0;
  gap:5px;
  padding:7px 13px;
  font-size:11px;
  font-weight:600;
  line-height:1.2;
  white-space:nowrap;
}
.course-actions .cr-faq-wa svg{ width:11px;height:11px; }

.course-photo{
  flex:0 0 50%;
  position:relative;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  overflow:visible;
  padding-bottom:16px;
}
.course-pedestal{
  position:absolute;
  bottom:18px;
  left:50%;
  width:72%;
  height:20px;
  background:var(--white);
  border-radius:50%;
  transform:translateX(-50%);
  box-shadow:0 16px 22px -6px rgba(10,27,51,.22), 0 2px 6px rgba(10,27,51,.08);
  z-index:1;
}
.course-photo img,
.course-photo video{
  position:relative;
  z-index:2;
  max-width:112%;
  max-height:200px;
  width:auto;
  height:auto;
  object-fit:contain;
  display:block;
  filter:drop-shadow(0 12px 14px rgba(10,27,51,.16));
}
.course-photo video{
  max-width:80%;
  max-height:150px;
  margin-bottom:26px;
  -webkit-mask-image:
    linear-gradient(to right, transparent 0%, #000 16%, #000 84%, transparent 100%),
    linear-gradient(to bottom, transparent 0%, #000 20%, #000 80%, transparent 100%);
  -webkit-mask-composite:source-in;
  mask-image:
    linear-gradient(to right, transparent 0%, #000 16%, #000 84%, transparent 100%),
    linear-gradient(to bottom, transparent 0%, #000 20%, #000 80%, transparent 100%);
  mask-composite:intersect;
}
@media(max-width:1100px){
  .training-badges{ flex-wrap:wrap; }
  .training-courses{ grid-template-columns:repeat(2,1fr); }
  .training-courses .course-card,
  .training-courses .course-card:nth-child(4),
  .training-courses .course-card:nth-child(5){ grid-column:span 1; }
}
@media(max-width:900px){
  .training-header{ flex-direction:column; }
  .training-intro{ padding:44px 40px 36px; }
  .training-hero-photo{ min-height:260px; }
}
@media(max-width:640px){
  .course-card{ flex-direction:column; min-height:0; }
  .course-info{ flex:1 1 auto; padding:22px 22px 8px; }
  .course-photo{ flex:1 1 auto; min-height:180px; padding:8px 16px 24px; }
}
@media(max-width:580px){
  .training-courses{ grid-template-columns:1fr; }

  /* Composición mobile: una sola tarjeta vertical — foto arriba, contenido abajo */
  .training-header{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    min-height:0;
  }
  .training-hero-img{
    order:-1;
    position:relative;
    left:auto;right:auto;top:auto;bottom:auto;
    width:100%;
    height:clamp(320px,66vw,410px);
    flex-shrink:0;
  }
  .training-hero-img::after{
    background:linear-gradient(to bottom, transparent 55%, var(--white) 100%);
  }
  .training-hero-img img,
  .training-hero-img video{
    object-position:60% center;
  }
  .training-intro{
    width:100%;
    padding:clamp(28px,7.5vw,40px) clamp(28px,7.5vw,40px) 32px;
  }
  .training-headline-a,
  .training-headline-b{
    font-size:clamp(36px,9.2vw,46px);
    line-height:.94;
  }
  .training-lead{
    max-width:none;
    margin-top:2px;
    font-size:clamp(18px,4.6vw,22px);
    line-height:1.55;
  }
  .training-badges{
    flex-direction:column;
    align-items:stretch;
    flex-wrap:nowrap;
    gap:14px;
    margin-top:28px;
  }
  .training-badge{
    position:relative;
    width:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:56px;
    padding:14px 40px;
    box-sizing:border-box;
    background:var(--white);
    border:1.5px solid var(--blue);
    font-size:13px;
    line-height:1.35;
    white-space:normal;
    text-align:center;
  }
  .training-badge svg{
    position:absolute;
    left:20px;
    top:50%;
    transform:translateY(-50%);
    width:16px;height:16px;
  }
}


/* ============================================================
   SECCIÓN: COTIZACIÓN / ASESORAMIENTO TÉCNICO
   ============================================================ */
.quote-wrap{ margin-top:64px; }

.quote-card{
  position:relative;
  border-radius:var(--r-hero);
  background:var(--white);
  border:1px solid rgba(148,163,184,.18);
  box-shadow:0 20px 60px -15px rgba(10,27,51,.07);
  overflow:hidden;
}

.quote-inner{
  display:flex;
  align-items:stretch;
  min-height:600px;
}

/* ── Columna izquierda ── */
.quote-left{
  flex:0 0 50%;
  padding:72px 56px 72px 72px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.quote-eyebrow{
  display:flex;
  align-items:center;
  gap:12px;
  font-size:11px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;
  color:var(--blue);
  margin:0 0 18px;
}
.quote-eyebrow-icon{
  width:18px;height:18px;
  flex-shrink:0;
  border-radius:50%;
  border:1.5px solid var(--blue);
  display:flex;
  align-items:center;
  justify-content:center;
}
.quote-eyebrow-dot{
  width:6px;height:6px;
  border-radius:50%;
  background:var(--blue);
}
.quote-eyebrow-line{
  width:56px;height:1.5px;
  flex-shrink:0;
  background:var(--blue);
}
.quote-head{
  position:relative;
}
.quote-dots{
  position:absolute;
  top:-14px;
  right:0;
  color:rgba(27,83,212,.22);
}
.quote-headline{
  margin:0;
  font-family:'Anton', var(--font), sans-serif;
  font-weight:400;
  text-transform:uppercase;
  line-height:1.14;
}
.quote-headline-a,
.quote-headline-b,
.quote-headline-c{
  display:block;
  font-size:clamp(26px,2.8vw,42px);
  color:var(--dark);
  letter-spacing:.01em;
  word-spacing:.14em;
}
.quote-headline-accent{ color:var(--blue); }
.quote-rule{
  display:block;
  width:44px;height:3px;
  margin:20px 0 22px;
  background:var(--blue);
  border-radius:2px;
}

.quote-desc{
  font-size:15px;
  color:var(--muted);
  line-height:1.7;
  max-width:460px;
  margin-bottom:36px;
}

/* Pasos */
.quote-steps{
  list-style:none;
  display:flex;
  flex-direction:column;
  gap:12px;
  margin-bottom:40px;
}

.quote-step{
  display:flex;
  align-items:flex-start;
  gap:16px;
  background:#F5F7FC;
  border-radius:14px;
  padding:16px 18px;
  border:1px solid rgba(148,163,184,.15);
}

.quote-step-icon{
  width:46px;height:46px;
  background:var(--blue);
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  color:#fff;
  flex-shrink:0;
}

.quote-step-body strong{
  display:block;
  font-size:14px;font-weight:700;
  color:var(--dark);
  margin-bottom:3px;
}
.quote-step-body p{
  font-size:13px;
  color:var(--muted);
  line-height:1.55;
  margin:0;
}

/* CTAs */
.quote-ctas{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}

/* ── Columna derecha ── */
.quote-right{
  flex:0 0 50%;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:48px 40px 48px 40px;
  position:relative;
  z-index:2;
}

/* Formulario */
.quote-form-card{
  background:var(--white);
  border-radius:22px;
  border:1px solid rgba(148,163,184,.2);
  box-shadow:0 8px 40px rgba(10,27,51,.08);
  padding:30px 28px;
  width:100%;
  max-width:420px;
  position:relative;
  z-index:2;
  flex-shrink:0;
}

.quote-form-header{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:22px;
}

.quote-form-icon{
  width:46px;height:46px;
  background:#EEF2FF;
  border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  color:var(--blue);
  flex-shrink:0;
}

.quote-form-title{
  font-size:17px;font-weight:800;
  color:var(--dark);
  letter-spacing:-.02em;
  margin-bottom:2px;
}
.quote-form-sub{ font-size:13px; color:var(--muted); }

/* Campos */
.quote-form{ display:flex; flex-direction:column; gap:9px; }

.qf-row{ display:grid; grid-template-columns:1fr 1fr; gap:9px; }

.qf-input{
  width:100%;
  padding:11px 14px;
  border:1.5px solid rgba(148,163,184,.38);
  border-radius:10px;
  font-family:var(--font);
  font-size:14px;
  color:var(--dark);
  background:var(--white);
  outline:none;
  transition:border-color .15s ease, box-shadow .15s ease;
  -webkit-appearance:none;
  appearance:none;
}
.qf-input::placeholder{ color:var(--muted); }
.qf-input:focus{
  border-color:var(--blue);
  box-shadow:0 0 0 3px rgba(27,83,212,.1);
}

.qf-select{
  cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 12px center;
  padding-right:36px;
}

.qf-textarea{
  resize:vertical;
  min-height:90px;
  line-height:1.55;
}

/* Adjuntar */
.qf-file{
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 14px;
  border:1.5px dashed rgba(148,163,184,.5);
  border-radius:10px;
  cursor:pointer;
  transition:border-color .15s ease, background .15s ease;
  color:var(--muted);
}
.qf-file:hover{ border-color:var(--blue); background:rgba(27,83,212,.03); }
.qf-file-text{ flex:1; font-size:13px; color:var(--dark); line-height:1.3; }
.qf-file-sub{ display:block; font-size:11px; color:var(--muted); margin-top:1px; }

/* Botón enviar */
.qf-submit{
  width:100%;
  padding:13px;
  border:none;
  border-radius:10px;
  background:var(--blue);
  color:#fff;
  font-family:var(--font);
  font-size:15px;
  font-weight:700;
  cursor:pointer;
  transition:background .2s ease, transform .2s ease, box-shadow .2s ease;
  margin-top:2px;
}
.qf-submit:hover{
  background:#1644b8;
  transform:translateY(-1px);
  box-shadow:0 8px 24px rgba(27,83,212,.3);
}

/* ============================================================
   MODAL "DÉJANOS CONOCERTE" (home)
   ============================================================ */
.cr-lead-modal{
  position:fixed;
  inset:0;
  z-index:1200;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  visibility:hidden;
  opacity:0;
  transition:opacity .3s var(--ease), visibility 0s linear .3s;
}
.cr-lead-modal.is-open{
  visibility:visible;
  opacity:1;
  transition:opacity .3s var(--ease);
}
.cr-lead-modal__backdrop{
  position:absolute;
  inset:0;
  background:rgba(10,15,26,.55);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
}
.cr-lead-modal__panel{
  position:relative;
  width:100%;
  max-width:440px;
  max-height:calc(100vh - 48px);
  overflow-y:auto;
  background:var(--white);
  border-radius:24px;
  box-shadow:0 30px 80px -20px rgba(10,27,51,.35);
  padding:40px 32px 32px;
  transform:translateY(16px) scale(.97);
  transition:transform .35s var(--ease);
}
.cr-lead-modal.is-open .cr-lead-modal__panel{
  transform:translateY(0) scale(1);
}
.cr-lead-modal__close{
  position:absolute;
  top:18px;
  right:18px;
  width:34px;height:34px;
  border-radius:50%;
  border:none;
  background:var(--dark);
  color:#fff;
  cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:background .2s var(--ease);
}
.cr-lead-modal__close:hover{ background:var(--blue); }
.cr-lead-modal__eyebrow{
  font-size:12px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--blue);
  margin:0 0 8px;
}
.cr-lead-modal__title{
  font-family:var(--font);
  font-size:clamp(22px,3vw,28px);
  font-weight:800;
  line-height:1.15;
  letter-spacing:-.01em;
  color:var(--dark);
  margin:0 0 10px;
}
.cr-lead-modal__body{
  font-size:14.5px;
  line-height:1.55;
  color:var(--muted);
  margin:0 0 22px;
}
.cr-lead-modal #form-lead{
  display:flex;
  flex-direction:column;
  gap:9px;
}
.cr-lead-modal #form-lead[hidden]{ display:none; }
.cr-lead-modal__status{
  font-size:13px;
  line-height:1.5;
  color:var(--muted);
  margin:2px 0 0;
}
.cr-lead-modal__status.is-error{ color:#d64545; }
.cr-lead-modal__status[hidden]{ display:none; }

.cr-lead-modal__success{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  padding:6px 0 4px;
}
.cr-lead-modal__success[hidden]{ display:none; }
.cr-lead-modal__success-icon{
  width:48px;height:48px;
  border-radius:50%;
  background:rgba(27,83,212,.1);
  color:var(--blue);
  display:flex;align-items:center;justify-content:center;
  margin-bottom:14px;
}
.cr-lead-modal__success-title{
  font-family:var(--font);
  font-size:19px;
  font-weight:800;
  color:var(--dark);
  margin:0 0 6px;
}
.cr-lead-modal__success-text{
  font-size:14.5px;
  line-height:1.55;
  color:var(--muted);
  margin:0;
}

body.cr-modal-lock{ overflow:hidden; }

/* Rodamiento decorativo — dentro del card, detrás del formulario */
.quote-bearing-deco{
  position:absolute;
  right:-180px;
  top:50%;
  transform:translateY(-50%);
  width:680px;
  height:680px;
  z-index:0;
  pointer-events:none;
}
.quote-bearing-deco img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
  mix-blend-mode:multiply;
  -webkit-mask-image:radial-gradient(ellipse 110% 88% at 44% 50%, black 46%, transparent 68%);
  mask-image:radial-gradient(ellipse 110% 88% at 44% 50%, black 46%, transparent 68%);
}

/* Responsive */
@media(max-width:1100px){
  .quote-right{ padding:40px 0 40px 32px; }
  .quote-form-card{ max-width:380px; }
  .quote-bearing-deco{ width:420px; height:420px; right:-220px; }
}
@media(max-width:900px){
  .quote-inner{ flex-direction:column; }
  .quote-left{ padding:52px 44px; }
  .quote-right{ padding:40px 44px 52px; background:var(--white); }
  .quote-form-card{ max-width:100%; box-shadow:none; border:none; padding:0; }
  .quote-bearing-deco{ display:none; }
}
@media(max-width:580px){
  .quote-left{ padding:40px 28px; }
  .quote-right{ padding:32px 28px 48px; }
  .qf-row{ grid-template-columns:1fr; }
}

/* ============================================================
   FOOTER
   ============================================================ */
.footer-outer{
  max-width:var(--max);
  margin:0 auto;
  padding:20px 24px 48px;
}

.footer-card{
  background:var(--white);
  border-radius:var(--r-hero);
  border:1px solid var(--border);
  box-shadow:0 4px 24px rgba(10,27,51,.05);
  padding:56px 64px 0;
}

.footer-main{
  display:grid;
  grid-template-columns:1.7fr 1fr 1fr 1fr 1.5fr;
  gap:40px;
  padding-bottom:48px;
}

/* Columna 1: brand */
.footer-logo{ height:48px; width:auto; margin-bottom:14px; display:block; }
.footer-tagline{ font-size:14px; color:var(--muted); margin-bottom:28px; line-height:1.5; }
.footer-ctas{ display:flex; flex-direction:column; gap:12px; }

.footer-btn-primary{
  display:flex; align-items:center; justify-content:center;
  padding:13px 20px;
  background:var(--blue); color:#fff;
  border-radius:100px; font-size:14px; font-weight:600;
  border:2px solid var(--blue);
  transition:background .2s, border-color .2s;
}
.footer-btn-primary:hover{ background:#1446b5; border-color:#1446b5; }

.footer-btn-wa{
  display:flex; align-items:center; justify-content:center; gap:8px;
  padding:13px 20px;
  background:transparent; color:var(--dark);
  border-radius:100px; font-size:14px; font-weight:600;
  border:2px solid var(--border-md);
  transition:border-color .2s, color .2s;
}
.footer-btn-wa:hover{ border-color:var(--blue); color:var(--blue); }

/* Columnas nav */
.footer-col__title{
  font-size:15px; font-weight:700; color:var(--dark);
  padding-bottom:10px;
  border-bottom:2px solid var(--blue);
  display:inline-block;
  margin-bottom:20px;
}

.footer-nav{
  list-style:none;
  display:flex; flex-direction:column; gap:13px;
}
.footer-nav li a{
  font-size:14px; color:var(--mid);
  display:flex; align-items:center; gap:6px;
  transition:color .2s;
}
.footer-nav li a::before{
  content:'›';
  color:var(--blue); font-size:17px; font-weight:700; line-height:1;
}
.footer-nav li a:hover{ color:var(--blue); }

/* Columna contacto */
.footer-contact{
  list-style:none;
  display:flex; flex-direction:column; gap:20px;
}
.footer-contact li{
  display:flex; align-items:flex-start; gap:12px;
}
.footer-contact li svg{ color:var(--blue); flex-shrink:0; margin-top:2px; }
.footer-contact li strong{ display:block; font-size:13px; font-weight:600; color:var(--dark); }
.footer-contact li span{ font-size:13px; color:var(--muted); }

/* Barra inferior */
.footer-bottom{
  display:flex; align-items:center; justify-content:space-between;
  padding:20px 0;
  border-top:1px solid var(--border);
}
.footer-copy{ font-size:13px; color:var(--muted); }
.footer-social{ display:flex; gap:20px; align-items:center; }
.footer-social a{ color:var(--mid); transition:color .2s; }
.footer-social a:hover{ color:var(--blue); }

/* Responsive footer */
@media(max-width:1100px){
  .footer-main{ grid-template-columns:1.4fr 1fr 1fr 1fr; }
  .footer-col:last-child{ grid-column:1/-1; }
}
@media(max-width:768px){
  .footer-card{ padding:40px 32px 0; }
  .footer-main{ grid-template-columns:1fr 1fr; gap:32px; }
  .footer-brand{ grid-column:1/-1; }
}
@media(max-width:480px){
  .footer-card{ padding:32px 24px 0; }
  .footer-main{ grid-template-columns:1fr; }
}

/* ============================================================
   SCROLL REVEAL (secciones futuras)
   ============================================================ */
[data-scroll-reveal]{
  opacity:0;transform:translateY(22px);
  transition:opacity .6s var(--ease),transform .6s var(--ease);
}
[data-scroll-reveal].visible{opacity:1;transform:translateY(0)}


/* ============================================================
   INDUSTRIAS QUE ACOMPAÑAMOS (acordeón + imagen que cambia)
   ============================================================ */
.cr-ind{
  margin-top: 64px;
}
.cr-ind__card{
  border-radius: var(--r-hero);
  background: #f5f5f7;
  border: 1px solid rgba(148,163,184,.22);
  box-shadow: 0 20px 60px -15px rgba(10,27,51,.07);
  overflow: hidden;
  padding: clamp(64px, 7vw, 100px) 0;
}
.cr-ind__content{
  width: min(1280px, 90vw);
  margin: 0 auto;
}
.cr-ind__layout{
  display: grid;
  grid-template-columns: clamp(360px, 31vw, 500px) 1fr;
  grid-template-rows: auto auto;
  column-gap: clamp(56px, 6vw, 96px);
  row-gap: clamp(28px, 3vw, 40px);
  align-items: start;
}
.cr-ind__stats{
  grid-column: 1;
  grid-row: 1;
  align-self: center;
}
.cr-ind__header{
  grid-column: 2;
  grid-row: 1;
  align-self: end;
}
.cr-ind__visual{
  grid-column: 1;
  grid-row: 2;
  align-self: stretch;
}
.cr-ind__list{
  grid-column: 2;
  grid-row: 2;
  align-self: start;
}

/* ---- Stats (+50 años / 6 sucursales / 3 provincias) ---- */
.cr-ind__stats{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.cr-ind__stats-row{
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: clamp(24px, 2.6vw, 36px);
}
.cr-ind__stat{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 7px;
  opacity: 0;
  transform: translateY(16px);
  transition: opacity .5s var(--ease), transform .5s var(--ease);
}
.cr-ind__stat.is-on{ opacity: 1; transform: translateY(0); }
@media (prefers-reduced-motion: reduce){
  .cr-ind__stat{ opacity: 1; transform: none; transition: none; }
}
.cr-ind__stat-icon{
  width: 26px; height: 26px;
  color: var(--blue);
}
.cr-ind__stat-num{
  display: flex;
  align-items: baseline;
  gap: 2px;
  font-family: var(--font);
  font-weight: 800;
  font-size: clamp(22px, 2vw, 30px);
  color: var(--blue);
  letter-spacing: -.02em;
}
.cr-ind__stat-plus{ font-size: .55em; }
.cr-ind__stat-label{
  font-size: 11px;
  font-weight: 600;
  color: var(--muted);
  line-height: 1.3;
  text-transform: uppercase;
  letter-spacing: .02em;
  text-align: center;
}
.cr-ind__stat-sep{
  width: 2px;
  align-self: stretch;
  margin-top: 4px;
  background: rgba(10,27,51,.28);
}

/* ---- Tag "Sección Industrias" (igual al de la home) ---- */
.cr-ind__tag{
  display: inline-flex;
  align-items: center;
  gap: 9px;
  width: fit-content;
  margin-top: 32px;
  padding: .72em 1.25em;
  border: 1px solid rgba(27,83,212,.22);
  border-radius: 999px;
  background: rgba(27,83,212,.07);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .11em;
  text-transform: uppercase;
  color: var(--blue);
  white-space: nowrap;
  transition: background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease);
}
.cr-ind__tag svg{ width: 15px; height: 15px; flex-shrink: 0; }
.cr-ind__tag:hover{
  background: var(--blue);
  border-color: var(--blue);
  color: #fff;
}

/* ---- Título editorial ---- */
.cr-ind__header{
  position: relative;
}
.cr-ind__dots{
  position: absolute;
  top: 2px;
  right: 0;
  color: rgba(27,83,212,.15);
}
.cr-ind__title{
  margin: 0 0 18px;
  font-family: 'Anton', var(--font), sans-serif;
  font-weight: 400;
  text-transform: uppercase;
  line-height: .86;
}
.cr-ind__title-l1{
  display: block;
  font-size: clamp(42px, 5.2vw, 78px);
  color: var(--dark);
}
.cr-ind__title-l2{
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 8px;
  font-size: clamp(42px, 5.2vw, 78px);
  color: var(--blue);
}
.cr-ind__title-badge{
  display: inline-flex;
  align-items: center;
  padding: 4px 14px 8px;
  border: 2px solid var(--blue);
  border-radius: 10px;
  font-family: var(--font);
  font-size: clamp(14px, 1.4vw, 19px);
  font-weight: 800;
  letter-spacing: .01em;
  text-transform: uppercase;
  line-height: 1;
  color: var(--blue);
}
.cr-ind__title-rule{
  position: relative;
  display: block;
  width: 220px;
  max-width: 40%;
  height: 2px;
  margin: 0 0 20px;
  background: var(--blue);
}
.cr-ind__title-rule::after{
  content: '';
  position: absolute;
  top: 50%;
  right: -3px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--blue);
  transform: translateY(-50%);
}
.cr-ind__subtitle{
  max-width: 480px;
  margin: 0 0 clamp(36px, 4vw, 52px);
  color: var(--muted);
  font-size: 15px;
  line-height: 1.5;
}

/* ---- Lista de industrias (letras animadas al hover) ---- */
.cr-ind__list{
  display: flex;
  flex-direction: column;
}
.cr-ind__item{
  border-bottom: 1px solid rgba(10,27,51,.1);
}
.cr-ind__row{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-height: clamp(76px, 6.3vw, 100px);
}
.cr-ind__trigger{
  --trig-h: clamp(36px, 3.2vw, 50px);
  position: relative;
  height: var(--trig-h);
  max-width: 100%;
  padding: 0;
  overflow: hidden;
  color: var(--muted);
  background: none;
  border: 0;
  cursor: pointer;
  text-align: left;
  text-transform: uppercase;
  font-family: var(--font);
  transition: color .3s ease;
}
.cr-ind__trigger.is-active,
.cr-ind__trigger:hover,
.cr-ind__trigger:focus-visible{
  color: var(--blue);
}
.cr-ind__trigger-line{
  display: block;
  position: relative;
  height: var(--trig-h);
  line-height: var(--trig-h);
}
.cr-ind__trigger-letter{
  position: relative;
  display: inline-block;
  height: var(--trig-h);
  font-size: clamp(28px, 2.9vw, 40px);
  font-weight: 800;
  line-height: var(--trig-h);
  color: inherit;
  white-space: pre;
  transition: transform .45s var(--ease);
  transition-delay: calc(var(--letter-index) * 16ms);
}
.cr-ind__trigger-letter::after{
  content: attr(data-letter);
  position: absolute;
  left: 0;
  top: 100%;
  height: var(--trig-h);
  line-height: var(--trig-h);
  color: var(--blue);
  white-space: pre;
}
.cr-ind__trigger.is-active .cr-ind__trigger-letter,
.cr-ind__trigger:hover .cr-ind__trigger-letter,
.cr-ind__trigger:focus-visible .cr-ind__trigger-letter{
  transform: translateY(-100%);
}
.cr-ind__expand{
  position: relative;
  width: 34px; height: 34px;
  flex-shrink: 0;
  border-radius: 50%;
  border: 1.5px solid rgba(27,83,212,.4);
  background: none;
  cursor: pointer;
  transition: border-color .2s, background .2s;
}
.cr-ind__expand::before,
.cr-ind__expand::after{
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  background: var(--blue);
  transform: translate(-50%, -50%);
  transition: transform .25s var(--ease), background .2s;
}
.cr-ind__expand::before{ width: 12px; height: 1.5px; }
.cr-ind__expand::after{ width: 1.5px; height: 12px; transform-origin: center; }
.cr-ind__item.is-open .cr-ind__expand::after{ transform: translate(-50%, -50%) scaleY(0); }
.cr-ind__item.is-open .cr-ind__expand{
  border-color: var(--blue);
  background: rgba(27,83,212,.06);
}
.cr-ind__expand:hover{ border-color: var(--blue); background: rgba(27,83,212,.06); }

.cr-ind__panel{
  display: grid;
  grid-template-rows: 0fr;
  opacity: 0;
  transition: grid-template-rows 400ms cubic-bezier(.65,0,.35,1), opacity 240ms ease;
}
.cr-ind__item.is-open .cr-ind__panel{
  grid-template-rows: 1fr;
  opacity: 1;
}
.cr-ind__panel-inner{ min-height: 0; overflow: hidden; }
.cr-ind__panel-content{ padding: 2px 40px 22px 0; }
.cr-ind__copy{
  max-width: 480px;
  margin: 0 0 10px;
  color: var(--muted);
  font-size: 14.5px;
  line-height: 1.5;
}
.cr-ind__link{
  color: var(--dark);
  font-size: 13px;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.cr-ind__link:hover{ color: var(--blue); }
.cr-ind__panel-actions{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 16px;
  margin-top: 4px;
}
.cr-ind__panel-actions .cr-ind__link{ flex-shrink: 0; }
.cr-ind__panel-actions .cr-faq-wa{
  margin: 0;
  gap: 7px;
  padding: 7px 15px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.3;
}
.cr-ind__panel-actions .cr-faq-wa svg{ width: 13px; height: 13px; }

/* ---- Imagen que cambia según la industria activa ---- */
.cr-ind__visual{
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #eef1f6;
}
.cr-ind__media{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transform: scale(1.035);
  transition: opacity 420ms ease, transform 700ms cubic-bezier(.22,1,.36,1);
}
.cr-ind__media.is-active{
  opacity: 1;
  transform: scale(1);
}
.cr-ind__image{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ---- Barra de WhatsApp reutilizable (chip verde) ---- */
.cr-faq-wa{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 20px;
  padding: 8px 16px;
  border-radius: 999px;
  background: #25D366;
  color: #fff;
  font-size: 12.5px;
  font-weight: 700;
  text-decoration: none;
  transition: background .15s, transform .15s;
}
.cr-faq-wa:hover{
  background: #1fb958;
  transform: translateY(-1px);
}
.cr-faq-wa svg{ flex-shrink: 0; }

/* ---- Selector de industria -> WhatsApp ---- */
.cr-ind__picker{
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 24px;
  margin-top: clamp(48px, 5vw, 72px);
  padding: 28px 32px;
  border: 1px solid rgba(27,83,212,.18);
  border-radius: 20px;
  background: rgba(27,83,212,.04);
}
.cr-ind__picker-text{
  display: flex;
  align-items: center;
  gap: 16px;
  flex: 1 1 320px;
}
.cr-ind__picker-icon{
  position: relative;
  width: 48px; height: 48px;
  flex-shrink: 0;
  border-radius: 50%;
  background: rgba(27,83,212,.1);
  color: var(--blue);
}
.cr-ind__picker-icon svg{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 18px;
  height: 18px;
}
.cr-ind__picker-icon--wa{
  background: rgba(37,211,102,.14);
  color: #25D366;
}
.cr-ind__picker-text strong{
  display: block;
  font-size: 16px;
  font-weight: 800;
  color: var(--dark);
  margin-bottom: 3px;
}
.cr-ind__picker-text span{
  display: block;
  font-size: 13.5px;
  color: var(--muted);
  line-height: 1.45;
  max-width: 420px;
}
.cr-ind__picker-actions{
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.cr-ind__picker-select{
  appearance: none;
  -webkit-appearance: none;
  font-family: var(--font);
  font-size: 13.5px;
  font-weight: 600;
  color: var(--dark);
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") no-repeat right 14px center;
  border: 1.5px solid var(--border);
  border-radius: 10px;
  padding: 11px 36px 11px 14px;
  min-width: 220px;
  cursor: pointer;
  transition: border-color .15s;
}
.cr-ind__picker-select:focus{ outline: none; border-color: rgba(27,83,212,.45); }
.cr-ind__picker-other{
  background: #fff;
  cursor: text;
  padding: 11px 14px;
}
.cr-ind__picker-cta{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 20px;
  border-radius: 10px;
  background: #25D366;
  color: #fff;
  font-size: 13.5px;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
  transition: background .15s, opacity .15s;
}
.cr-ind__picker-cta:hover{ background: #1fb958; }
.cr-ind__picker-cta.is-disabled{
  background: #cbd5e1;
  color: #fff;
  pointer-events: none;
  opacity: .75;
}

@media (max-width: 900px){
  .cr-ind__layout{
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    row-gap: 24px;
  }
  .cr-ind__stats{ grid-column: 1; grid-row: 1; }
  .cr-ind__header{ grid-column: 1; grid-row: 2; }
  .cr-ind__visual{ grid-column: 1; grid-row: 3; align-self: auto; height: auto; aspect-ratio: 1 / 1.06; }
  .cr-ind__list{ grid-column: 1; grid-row: 4; }
  .cr-ind__dots{ display: none; }

  .cr-ind__picker{ padding: 24px; }
  .cr-ind__picker-actions{ width: 100%; }
  .cr-ind__picker-select{ flex: 1 1 auto; min-width: 0; }
  .cr-ind__picker-cta{ flex: 0 0 auto; }
}

@media (prefers-reduced-motion: reduce){
  .cr-ind__trigger-letter,
  .cr-ind__media,
  .cr-ind__panel,
  .cr-ind__expand::after,
  .cr-ind__expand::before{
    transition: none;
  }
}

/* ============================================================
   SECCIÓN: RESPALDO SKF (carrusel CMP / Distribuidor autorizado)
   ============================================================ */
.skf-cert-wrap{ margin-top:64px; }
.skf-cert-scrollpin{ position:relative; }
.skf-cert-sticky{ }
@media(min-width:1025px){
  /* Ancla la card en pantalla mientras el usuario recorre el alto extra
     de .skf-cert-scrollpin; el scroll dentro de ese tramo es lo que
     dispara el cambio de slide (efecto tipo Apple). */
  .skf-cert-scrollpin{ height:265vh; }
  .skf-cert-sticky{ position:sticky; top:calc(var(--nav-h) + 24px); }
}
.skf-cert-card{
  display:flex;
  flex-direction:column;
  align-items:center;
}
.skf-cert-stage{
  position:relative;
  width:100%;
  min-height:520px;
}
.skf-cert-slide{
  position:absolute;
  inset:0;
  display:flex;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-22px);
  transition:opacity .6s var(--ease), transform .6s var(--ease), visibility 0s linear .6s;
}
.skf-cert-slide.is-active{
  position:relative;
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0);
  transition:opacity .6s var(--ease), transform .6s var(--ease);
}
.skf-cert-visual{
  width:44%;
  flex-shrink:0;
  position:relative;
  overflow:hidden;
  border-radius:28px;
  box-shadow:0 30px 60px -20px rgba(10,27,51,.22);
  z-index:1;
}
.skf-cert-visual--placeholder{ background:rgba(15,23,42,.045); }
.skf-cert-content:empty{ background:rgba(15,23,42,.02); }
.skf-cert-visual img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.skf-cert-content{
  flex:1;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:64px 72px 76px 136px;
  margin-left:-64px;
  z-index:2;
  background:var(--white);
  border-radius:28px;
  box-shadow:0 30px 70px -24px rgba(10,27,51,.16), 0 0 0 1px rgba(148,163,184,.16);
}
.skf-cert-head{
  position:relative;
}
.skf-cert-brand{
  position:absolute;
  bottom:28px;
  right:36px;
  width:184px;
  height:auto;
  opacity:.9;
  z-index:3;
}
.skf-cert-headline{
  margin:0;
  font-family:'Anton', var(--font), sans-serif;
  font-weight:400;
  text-transform:uppercase;
  line-height:1.14;
}
.skf-cert-headline-a,
.skf-cert-headline-b{
  display:block;
  font-size:clamp(26px,2.6vw,40px);
  color:var(--dark);
  letter-spacing:.01em;
  word-spacing:.14em;
}
.skf-cert-headline-accent{ color:var(--blue); }
.skf-cert-rule{
  display:block;
  width:44px;height:3px;
  margin:20px 0 22px;
  background:var(--blue);
  border-radius:2px;
}
.skf-cert-intro{
  font-size:15px;
  line-height:1.78;
  color:var(--muted);
  margin:0 0 26px;
  max-width:46ch;
}
.skf-cert-features{
  display:flex;
  flex-direction:column;
  gap:26px;
}
.skf-cert-feature{
  display:flex;
  align-items:flex-start;
  gap:18px;
}
.skf-cert-feature__icon{
  flex:0 0 auto;
  width:26px;
  height:26px;
  color:var(--blue);
  display:flex;
  align-items:center;
  justify-content:center;
}
.skf-cert-feature__icon svg{ width:100%; height:100%; }
.skf-cert-feature__icon--logo img{ width:100%; height:auto; display:block; }
.skf-cert-feature__text{
  font-size:14.5px;
  line-height:1.6;
  color:var(--muted);
  margin:0;
  max-width:42ch;
}
.skf-cert-feature__text strong{ color:var(--dark); font-weight:700; }

/* La card de "Distribuidor autorizado" trae un párrafo más largo que la de
   CMP; se ajusta apenas el espaciado para que ambas terminen del mismo alto. */
.skf-cert-slide[data-slide="1"] .skf-cert-intro{ margin-bottom:16px; }
.skf-cert-slide[data-slide="1"] .skf-cert-features{ gap:22px; }
.skf-cert-slide[data-slide="1"] .skf-cert-feature__text{ line-height:1.52; }

.skf-cert-nav{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:22px;
  margin-top:36px;
}
.skf-cert-arrow{
  width:48px;height:48px;
  flex-shrink:0;
  border-radius:50%;
  border:1px solid rgba(148,163,184,.3);
  background:var(--white);
  color:var(--dark);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
  box-shadow:0 10px 24px -10px rgba(10,27,51,.3);
  transition:background .2s var(--ease), color .2s var(--ease);
}
.skf-cert-arrow:hover{ background:var(--dark); color:var(--white); }
.skf-cert-dots{
  display:flex;
  gap:8px;
}
.skf-cert-dot{
  width:7px;height:7px;
  border-radius:50%;
  background:rgba(51,65,85,.25);
  border:none;
  cursor:pointer;
  padding:0;
  transition:background .2s var(--ease), transform .2s var(--ease);
}
.skf-cert-dot.is-active{ background:var(--blue); transform:scale(1.3); }

@media(min-width:1025px){
  /* Tamaño fijo (igual al de la card CMP) para que ninguna de las dos
     cards del carrusel cambie de alto al rotar. */
  .skf-cert-stage{ height:680px; }
  .skf-cert-slide.is-active{ position:absolute; }
}
@media(max-width:1024px){
  .skf-cert-stage{ min-height:auto; }
  .skf-cert-slide{ flex-direction:column; }
  .skf-cert-visual{ width:100%; height:220px; }
  .skf-cert-content{ margin-left:0; margin-top:20px; padding:44px 40px 56px; border-radius:24px; }
  .skf-cert-brand{ width:148px; right:24px; bottom:18px; }
}
@media(max-width:580px){
  .skf-cert-visual{ height:180px; border-radius:20px; }
  .skf-cert-content{ padding:36px 22px 52px; margin-top:16px; border-radius:20px; }
  .skf-cert-intro{ margin:16px 0 26px; }
  .skf-cert-features{ gap:20px; }
  .skf-cert-brand{ width:122px; right:16px; bottom:12px; }
  .skf-cert-nav{ gap:16px; margin-top:28px; }
  .skf-cert-arrow{ width:40px; height:40px; }
}

/* ============================================================
   MOBILE — Fila de confianza (SKF + años/sucursales) del hero de
   categoría. Componente compartido: mismo HTML/clases (.rod-hero__badge*)
   duplicado en las 9 páginas cat-*.html; se resuelve una sola vez acá
   para que las nueve hereden el mismo diseño mobile sin copiar CSS.
   ============================================================ */
@media(max-width:600px){
  /* Nota de especificidad: cada página cat-*.html carga su propio CSS
     DESPUÉS de style.css, con estas mismas clases en reglas base de igual
     especificidad (una sola clase). Para que estos overrides mobile
     ganen sin depender del orden de carga, se duplica la clase
     (.foo.foo) en vez de subir a !important. */

  /* La fila original está pensada para una sola línea a lo ancho del
     hero (100vh, con las piezas ancladas abajo por --hc). En mobile no
     entra en una línea: pasa a flujo normal, arriba de todo, y el hero
     deja de forzar 100vh para no recortar el resto del contenido. */
  .rod-hero.rod-hero{
    height:auto;
    padding-top:var(--nav-h);
  }
  @supports (height:100svh){
    .rod-hero.rod-hero{ height:auto; }
  }
  .rod-hero__stage.rod-hero__stage{ height:auto; }

  .rod-hero__badges.rod-hero__badges{
    position:static;
    display:flex;
    flex-direction:column;
    align-items:stretch;
    flex-wrap:nowrap;
    gap:20px;
    padding:24px 24px 28px;
  }
  .rod-hero__badges-divider{ display:none; }

  /* Logo SKF centrado, con su propia línea azul corta debajo */
  .rod-hero__badge:first-child{
    flex-direction:column;
    align-items:center;
    gap:0;
  }
  .rod-hero__badge-logo.rod-hero__badge-logo{
    width:clamp(150px,45vw,190px);
    height:auto;
  }
  .rod-hero__badge:first-child::after{
    content:'';
    display:block;
    width:76px;
    height:3px;
    margin-top:24px;
    background:var(--blue);
    border-radius:2px;
  }

  /* Tarjetas de estadísticas: ícono + número + descripción en fila,
     ancho completo, centradas verticalmente */
  .rod-hero__badge:not(:first-child){
    width:100%;
    background:#fbfcfe;
    border:1px solid rgba(15,40,80,.12);
    border-radius:18px;
    padding:clamp(16px,5.2vw,24px);
    box-shadow:0 2px 10px rgba(10,27,51,.03);
  }
  .rod-hero__badge-icon.rod-hero__badge-icon{
    width:clamp(36px,10vw,48px);
    height:clamp(36px,10vw,48px);
  }
  .rod-hero__badge-num.rod-hero__badge-num{
    font-size:clamp(54px,15vw,72px);
    line-height:1;
  }
  .rod-hero__badge-text.rod-hero__badge-text{
    font-size:clamp(17px,4.6vw,21px);
    line-height:1.25;
    flex:1;
    min-width:0;
  }
}

/* ============================================================
   MOBILE — Grilla de tarjetas "Por qué elegir X" (.cr-why__grid /
   .cr-why__card) del hero de categoría. Componente compartido: mismo
   HTML/clases duplicado en las 9 páginas cat-*.html; se resuelve una
   sola vez acá. Cada página tiene su propio alto de card y variantes
   de imagen para desktop (--center/--lg/--sm/-group), pero todas usan
   las mismas clases base, así que un solo bloque alcanza para las 9.
   ============================================================ */
@media(max-width:600px){
  .cr-why__grid.cr-why__grid{
    grid-template-columns: minmax(0,1fr);
    gap: 22px;
  }

  /* La card pasa de flex-column con footer position:absolute (pensado
     para una columna angosta de escritorio) a un grid de una columna:
     cada pieza (encabezado, regla, texto, imagen, acciones) ocupa su
     propia fila en el flujo normal, alto automático. */
  .cr-why__card.cr-why__card{
    display: grid;
    grid-template-columns: 1fr;
    grid-template-areas:
      "head"
      "rule"
      "body"
      "img"
      "wa";
    align-items: start;
    row-gap: 16px;
    column-gap: 12px;
    height: auto;
    min-height: 0;
    min-width: 0;
    box-sizing: border-box;
    padding: clamp(22px,6vw,28px);
    overflow: visible;
  }

  .cr-why__head-row{
    grid-area: head;
    min-width: 0;
  }
  .cr-why__headline.cr-why__headline{
    min-height: 0;
    min-width: 0;
  }

  .cr-why__rule{
    grid-area: rule;
    margin: 0;
  }

  .cr-why__body.cr-why__body{
    grid-area: body;
    min-height: 0;
    width: 100%;
    margin-top: 10px; /* + row-gap(16px) = ~26px entre la regla y el texto */
    font-size: clamp(17px,4.4vw,19px);
    line-height: 1.55;
  }

  .cr-why__img.cr-why__img{
    grid-area: img;
    position: static;
    justify-self: center;
    align-self: center;
    margin: 0;
    width: clamp(170px,52vw,230px);
    max-width: 100%;
    height: auto;
    max-height: none;
  }
  /* Card con dos imágenes lado a lado (única en cat-monitoreo): se
     mantienen centradas y en fila propia, más chicas para no desbordar. */
  .cr-why__img-group.cr-why__img-group{
    grid-area: img;
    flex-wrap: wrap;
    justify-content: center;
    margin: 0;
    width: 100%;
  }
  .cr-why__img-group .cr-why__img.cr-why__img{
    width: clamp(120px,38vw,160px);
  }

  .cr-why__wa.cr-why__wa{
    grid-area: wa;
    position: static;
    align-self: center;
    justify-self: start;
  }
}

/* ============================================================
   MOBILE — "Trabajamos con / Marcas líderes de la industria"
   (.cr-trust__card) + su carrusel de marcas (.cr-trust__marquee).
   Componente compartido: mismas clases duplicadas en las 9 páginas
   cat-*.html. El marquee de la HOME usa las mismas clases base
   (.brands/.brand-card) pero SIN .cr-trust__marquee, así que todo
   acá va scopeado bajo .cr-trust__* para no tocar el de index.html.
   ============================================================ */
@media(max-width:600px){
  .cr-trust__head.cr-trust__head{
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 28px 22px 32px;
    border-bottom: none;
  }

  /* .cr-trust__intro se "aplana" para que su eyebrow/título/regla/
     mensaje se reordenen junto con la imagen y los respaldos, todos
     hermanos directos de .cr-trust__head (mismo recurso que ya usamos
     en la fila de estadísticas de la home). */
  .cr-trust__intro{ display: contents; }

  .cr-trust__eyebrow.cr-trust__eyebrow{ order: 1; gap: 8px; margin: 0 0 14px; }
  .cr-trust__eyebrow-line.cr-trust__eyebrow-line{ width: 16px; }
  .cr-trust__title.cr-trust__title{ order: 2; font-size: clamp(24px,7vw,30px); }
  .cr-trust__title-rule.cr-trust__title-rule{ order: 3; }

  .cr-trust__visual.cr-trust__visual{
    order: 4;
    width: clamp(210px,62vw,260px);
    height: auto;
    max-width: 100%;
    margin: 32px auto 0;
    overflow: visible;
  }
  .cr-trust__visual:not(.cr-trust__visual--pair):not(.cr-trust__visual--trio) img{
    width: 100%;
    height: auto;
    object-fit: contain;
  }
  /* Variantes con 2-3 piezas agrupadas (algunas páginas): mismo lugar
     en el orden, contenedor explícito para que sus reglas de alto en
     % (definidas por página) sigan funcionando a este tamaño. */
  .cr-trust__visual--pair.cr-trust__visual--pair,
  .cr-trust__visual--trio.cr-trust__visual--trio{
    width: clamp(230px,72vw,300px);
    height: clamp(140px,40vw,180px);
    max-width: 100%;
    margin: 32px auto 0;
  }

  .cr-trust__wa.cr-trust__wa{
    order: 5;
    max-width: none;
    width: 100%;
    margin-top: 28px;
    padding: 20px 22px;
    font-size: 14.5px;
    line-height: 1.5;
    box-sizing: border-box;
    align-items: flex-start;
  }

  .cr-trust__divider{ display: none; }

  .cr-trust__brand.cr-trust__brand{
    order: 6;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    width: 100%;
    margin-top: 24px;
  }
  .cr-trust__badge.cr-trust__badge,
  .cr-trust__iso.cr-trust__iso{
    width: 100%;
    height: 92px;
    max-width: 100%;
    object-fit: contain;
    background: #fff;
    border: 1px solid rgba(148,163,184,.32);
    border-radius: 16px;
    padding: 16px;
    box-sizing: border-box;
  }

  /* Carrusel de marcas: mismo scroll automático infinito de escritorio
     (.brands__track anima, las dos .brands__list dan el loop sin
     costuras), solo con cards más chicas para mobile. */
  .cr-trust__marquee.cr-trust__marquee{ margin-top: 28px; }
  .cr-trust__marquee .brand-card{ height: 84px; width: 150px; }
}