/* ==========================================================================
   RH·BOTS — catálogo y fichas de producto
   Se carga después de styles.css y reutiliza sus tokens.
   ========================================================================== */

.section--tight{ padding-block:clamp(38px, 4.5vw, 60px); }
.nav a.is-active{ color:var(--ink); }
.nav a.is-active::after{ transform:scaleX(1); }

/* ---------- miga de pan ---------- */
.crumbs{
  font-size:12px; letter-spacing:.06em; text-transform:uppercase;
  color:var(--muted); margin-bottom:18px;
}
.crumbs a{ color:var(--muted); transition:color .25s var(--ease); }
.crumbs a:hover{ color:var(--blue); }
.crumbs span{ margin-inline:6px; opacity:.5; }
.crumbs em{ font-style:normal; color:var(--ink); }

/* ---------- distintivos ---------- */
.badges{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px; }
.badge{
  display:inline-block; padding:5px 12px; border-radius:var(--r-pill);
  font-size:11px; font-weight:700; letter-spacing:.07em; text-transform:uppercase;
}
.badge--fam  { background:rgba(0,158,227,.12); color:var(--blue-deep); }
.badge--ok   { background:rgba(0,158,227,.12); color:var(--blue-deep); }
.badge--warn { background:#fff4d6; color:#8a6100; }
.badge--alert{ background:#ffe2e2; color:#a11b1b; }

/* ---------- hero de ficha ---------- */
.phero{ background:var(--light); padding-block:clamp(34px, 4.5vw, 64px); overflow:hidden; }
.phero__grid{
  display:grid; grid-template-columns:1.05fr .95fr;
  gap:clamp(24px, 4vw, 56px); align-items:center;
}
.phero__name{
  font-weight:400; font-size:clamp(34px, 5vw, 62px); line-height:1.05;
  color:var(--navy); letter-spacing:.01em;
}
.phero__claim{
  display:block; letter-spacing:normal;
  margin-top:12px; font-weight:500;
  font-size:clamp(15px, 1.5vw, 20px); line-height:1.35; color:var(--blue);
}
.phero__tag{
  margin-top:16px; font-weight:400;
  font-size:clamp(13px, 1.1vw, 15px); line-height:1.65; color:var(--ink-66);
  max-width:52ch;
}
.phero__cta{ display:flex; flex-wrap:wrap; gap:14px; margin-top:28px; }
.phero__cta .pill{ min-width:0; }

.phero__lado{
  display:flex; flex-direction:column; align-items:center;
  gap:clamp(16px, 2vw, 26px);
}
.phero__media{
  margin:0; display:grid; place-items:center; width:100%;
  min-height:clamp(240px, 30vw, 400px);
}

/* tarjeta de precio y compra bajo la imagen */
.phero__compra{
  width:min(100%, 460px);
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:14px 18px;
  padding:14px 14px 14px 26px;
  background:#fff; border-radius:20px;
  box-shadow:0 14px 34px rgba(40,40,40,.08);
}
.phero__compra--solo{ justify-content:center; padding:16px 26px; }
.phero__compra .pvp{ margin:0; font-size:clamp(24px, 2.2vw, 30px); white-space:nowrap; }
.phero__compra .compra{ flex:0 1 auto; flex-basis:auto; flex-wrap:nowrap; }
.phero__compra .compra .pill{ min-width:0; }
.phero__compra .sinstock{ flex-basis:auto; margin:0; }
@media (max-width:560px){
  .phero__compra{ flex-direction:column; align-items:stretch; padding:18px; text-align:center; }
  .phero__compra .compra{ flex-direction:column; align-items:stretch; }
  .phero__compra .compra .pill{ width:100%; }
}
.phero__media img{
  max-height:clamp(240px, 34vw, 440px); width:auto;
  filter:drop-shadow(0 26px 34px rgba(40,40,40,.18));
}

/* datos rápidos */
.keyfacts{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(120px, 1fr));
  gap:14px; margin-top:26px;
}
.keyfacts li{
  border-left:4px solid var(--blue); padding-left:12px;
}
.keyfacts span{
  display:block; font-size:11px; letter-spacing:.05em; text-transform:uppercase;
  color:var(--muted);
}
.keyfacts strong{
  display:block; margin-top:3px; font-weight:700;
  font-size:clamp(14px, 1.2vw, 17px); color:var(--ink);
}

/* ---------- precio de tarifa ---------- */
.pvp{
  margin-top:clamp(16px, 1.8vw, 22px);
  font-family:var(--font-titulo); font-weight:700; letter-spacing:-.02em;
  font-size:clamp(26px, 2.6vw, 34px); line-height:1.1; color:var(--navy);
}
.pvp__etiqueta,
.pcard .pcard__precio__etiqueta{
  font-family:var(--font-subtitulo); font-weight:700; font-size:12px;
  letter-spacing:.14em; color:var(--muted); vertical-align:middle; margin-right:8px;
}
.pcard .pcard__precio{
  margin-top:18px; font-family:var(--font-titulo); font-weight:800;
  font-size:clamp(24px, 2.1vw, 29px); line-height:1.1; letter-spacing:-.02em;
  color:var(--blue);
}

/* ---------- compra ---------- */
.precio{
  flex-basis:100%; margin:4px 0 -4px;
  font-weight:700; font-size:clamp(22px, 2.2vw, 28px); color:var(--navy);
}
.precio span{
  font-weight:400; font-size:.55em; letter-spacing:.08em;
  color:var(--muted); margin-left:4px;
}
/* contenedor del bloque de compra: el JS reemplaza su interior con el estado
   en vivo de Shopify, así que debe mantener el flujo del flex del hero */
.compra{
  flex-basis:100%;
  display:flex; flex-wrap:wrap; align-items:center; gap:14px;
}

.sinstock{
  flex-basis:100%; display:flex; align-items:center; gap:9px;
  margin:4px 0 -2px;
  font-weight:700; font-size:13px; letter-spacing:.03em; color:var(--ink-66);
}
.sinstock__punto{
  width:9px; height:9px; border-radius:50%; flex:none;
  background:#e0a500; box-shadow:0 0 0 4px rgba(224,165,0,.18);
}

.pill--comprar{
  background:var(--navy);
  box-shadow:0 8px 20px rgba(47,36,131,.28);
}
.pill--comprar:hover{ box-shadow:0 14px 30px rgba(47,36,131,.36); }
.pill--comprar .pill__ico{ background:rgba(255,255,255,.2); }

/* ---------- visualizador giratorio ---------- */
.viewer{
  position:relative; width:100%; max-width:560px;
  aspect-ratio:900/806;
  cursor:ew-resize; touch-action:pan-y;
  user-select:none; -webkit-user-select:none;
  border-radius:14px;
}
.viewer__frame{
  position:absolute; inset:0; margin:auto;
  max-width:100%; max-height:100%; width:auto; height:auto;
  opacity:0; pointer-events:none;
  filter:drop-shadow(0 24px 30px rgba(40,40,40,.16));
}
.viewer__frame.is-on{ opacity:1; }

.viewer__hint{
  position:absolute; left:50%; bottom:2%; transform:translateX(-50%);
  display:inline-flex; align-items:center; gap:8px;
  padding:7px 15px 7px 12px; border-radius:var(--r-pill);
  background:rgba(255,255,255,.92);
  box-shadow:0 4px 14px rgba(40,40,40,.14);
  font-size:11.5px; font-weight:700; letter-spacing:.07em; text-transform:uppercase;
  color:var(--blue-deep);
  transition:opacity .3s var(--ease), transform .3s var(--ease);
}
.viewer__hint svg{ width:17px; height:17px; stroke-width:2.2; }
.viewer.is-active .viewer__hint{ opacity:0; transform:translateX(-50%) translateY(6px); }
.viewer:focus-visible{ outline:3px solid var(--navy); outline-offset:6px; }

/* ---------- vídeo ---------- */
.vid{
  display:grid; gap:clamp(18px, 2.6vw, 30px);
  grid-template-columns:1fr;
}
.vid--2{ grid-template-columns:repeat(auto-fit, minmax(320px, 1fr)); }
.vid__item figure{ margin:0; }
.vid__item video{
  width:100%; height:auto; display:block;
  aspect-ratio:16/9; object-fit:cover;
  background:var(--ink);
  border-radius:14px;
  box-shadow:0 10px 30px rgba(40,40,40,.16);
}
.vid__item figcaption{
  margin-top:12px;
  font-size:12.5px; font-weight:700; letter-spacing:.04em; color:var(--ink-66);
}
.vid__item figcaption::after{
  content:''; display:block; width:26px; height:3px;
  background:var(--blue); margin-top:10px;
}

/* ---------- la gama al completo ---------- */

/* ---------- galería ---------- */
.carrusel--gal{ --visibles:3; }
.gal__item{ display:flex; align-items:center; justify-content:center; }
.gal__item img{
  width:100%; aspect-ratio:1 / .82; height:auto; object-fit:contain;
  -webkit-user-drag:none;
  transition:transform .45s var(--ease);
}
.gal__item img:hover{ transform:scale(1.04); }

/* ---------- ficha: rejilla corta de especificaciones ---------- */
.datos-tec{
  list-style:none; margin:clamp(28px, 3.4vw, 48px) 0 0; padding:0;
  display:grid; grid-template-columns:repeat(5, minmax(0, 1fr));
  gap:clamp(20px, 2.4vw, 34px) clamp(16px, 2vw, 30px);
}
.dato-tec__etiqueta{
  font-family:var(--font-texto); font-size:14px; line-height:1.4; color:#8b93a1;
}
.dato-tec__valor{
  margin-top:10px; padding-left:14px;
  border-left:3px solid var(--blue);
  font-family:var(--font-subtitulo); font-weight:700;
  font-size:15.5px; line-height:1.45; color:var(--ink);
}
.fichacompleta{ margin-top:clamp(30px, 3.6vw, 48px); }
.fichacompleta > summary{
  display:inline-flex; align-items:center; gap:10px; cursor:pointer;
  padding:12px 20px; border-radius:999px;
  background:var(--light); border:1px solid #e1e5eb;
  font-family:var(--font-subtitulo); font-weight:700;
  font-size:13px; letter-spacing:.08em; text-transform:uppercase; color:var(--navy);
  transition:background .25s var(--ease), color .25s var(--ease);
  list-style:none;
}
.fichacompleta > summary::-webkit-details-marker{ display:none; }
.fichacompleta > summary::after{
  content:''; width:9px; height:9px; margin-left:2px;
  border-right:2px solid currentColor; border-bottom:2px solid currentColor;
  transform:translateY(-2px) rotate(45deg);
  transition:transform .25s var(--ease);
}
.fichacompleta[open] > summary::after{ transform:translateY(2px) rotate(-135deg); }
.fichacompleta > summary:hover{ background:#e8eef6; color:var(--blue); }
.fichacompleta .specgrid{ margin-top:clamp(24px, 3vw, 40px); }
/* como mucho tres filas: con menos columnas se enseñan menos datos y el
   resto queda en la ficha completa, que está justo debajo */
@media (max-width:1100px){
  .datos-tec{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
  .datos-tec > li:nth-child(n+10){ display:none; }
}
@media (max-width:640px){
  .datos-tec{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .datos-tec > li:nth-child(n+7){ display:none; }
}

/* ---------- marcador cuando no hay foto ---------- */
.ph{
  width:100%; aspect-ratio:4/3;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:14px; border-radius:14px;
  background:
    repeating-linear-gradient(135deg, rgba(0,158,227,.05) 0 12px, transparent 12px 24px),
    #fff;
  border:1px dashed rgba(0,158,227,.4);
  color:var(--blue);
}
.ph svg{ width:34%; max-width:120px; height:auto; stroke-width:2.4; }
.ph span{
  font-weight:700; font-size:13px; letter-spacing:.07em; text-transform:uppercase;
  color:var(--ink-66);
}

/* ---------- avisos de fiabilidad ---------- */
.notas{ display:grid; gap:14px; }
.nota{
  border-left:4px solid var(--muted);
  background:var(--light);
  padding:18px 22px; border-radius:0 10px 10px 0;
}
.nota__titulo{
  font-weight:700; font-size:13px; letter-spacing:.05em; text-transform:uppercase;
  color:var(--ink);
}
.nota p{ margin-top:8px; font-size:14px; line-height:1.65; color:var(--ink-66); }
.nota--info { border-color:var(--blue);  background:rgba(0,158,227,.06); }
.nota--warn { border-color:#e0a500;      background:#fff9ec; }
.nota--alert{ border-color:#c62828;      background:#fdeeee; }
.nota--alert h3{ color:#a11b1b; }

/* ---------- puntos clave ---------- */
.hl{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
  gap:clamp(20px, 3vw, 38px);
}
.hl__item{ border-top:3px solid var(--blue); padding-top:18px; }
.hl__item h3{
  font-weight:700; font-size:13px; letter-spacing:.05em; text-transform:uppercase;
  color:var(--ink); line-height:1.35;
}
.hl__item p{
  margin-top:10px; font-weight:400; font-size:14px; line-height:1.65; color:var(--ink-66);
}

/* ---------- aplicaciones ---------- */
.apx{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
  gap:clamp(16px, 2.4vw, 28px);
}
.section-head--solo{ margin-bottom:0; }

/* aplicaciones sin fotografía */
.applist{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
  gap:12px 26px; max-width:900px; margin-inline:auto;
}
.applist li{
  position:relative; padding:14px 18px 14px 34px;
  background:#fff; border-radius:10px;
  font-weight:500; font-size:14.5px; line-height:1.45; color:var(--ink);
  box-shadow:0 3px 12px rgba(40,40,40,.06);
}
.applist li::before{
  content:''; position:absolute; left:16px; top:50%; transform:translateY(-50%);
  width:4px; height:18px; background:var(--blue); border-radius:1px;
}
.apx__item figure{
  margin:0; aspect-ratio:16/10; border-radius:12px; overflow:hidden;
  background:#fff; display:grid; place-items:center;
  box-shadow:0 6px 18px rgba(40,40,40,.08);
}
.apx__item img{ width:100%; height:100%; object-fit:cover; }
.apx__ico{ display:block; width:56px; height:56px; color:var(--blue); }
.apx__ico svg{ width:100%; height:100%; stroke-width:2.4; }
.apx__item h3{
  margin-top:14px; font-weight:700; font-size:12.5px;
  letter-spacing:.05em; text-transform:uppercase; line-height:1.4; color:var(--ink);
}
.apx__item h3::after{
  content:''; display:block; width:26px; height:3px; background:var(--blue); margin-top:10px;
}

/* ---------- especificaciones ---------- */
.specgrid{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(320px, 1fr));
  gap:clamp(22px, 3vw, 40px);
  align-items:start;
}
.specgrp h3{
  font-weight:700; font-size:12.5px; letter-spacing:.07em; text-transform:uppercase;
  color:var(--blue-deep); padding-bottom:10px; border-bottom:2px solid var(--blue);
}
.spectable{ width:100%; border-collapse:collapse; }
.spectable th,
.spectable td{
  text-align:left; vertical-align:top;
  padding:11px 0; border-bottom:1px solid #e6e9ee;
  font-size:13.5px; line-height:1.5;
}
.spectable th{ font-weight:400; color:var(--ink-66); padding-right:18px; width:48%; }
.spectable td{ font-weight:700; color:var(--ink); }

/* ---------- checklist ---------- */
.checklist{ counter-reset:c; display:grid; gap:10px; }
.checklist li{
  counter-increment:c; position:relative; padding:14px 18px 14px 52px;
  background:#fff; border-radius:10px; font-size:14px; line-height:1.5;
  box-shadow:0 4px 14px rgba(40,40,40,.07);
}
.checklist li::before{
  content:counter(c); position:absolute; left:16px; top:13px;
  width:22px; height:22px; border-radius:50%;
  background:var(--blue); color:#fff;
  font-size:11px; font-weight:700; display:grid; place-items:center;
}

/* ---------- índice: cabecera ---------- */
.chero{ background:var(--light); padding-block:clamp(38px, 5vw, 72px); }
.display--left, .lede--left{ text-align:left; }
.lede--left{ max-width:60ch; margin-top:16px; }

/* catálogo: portada con foto, mismos colores que la de inicio
   (fondo --night, velo oscuro de izquierda a derecha y franja azul translúcida) */
.hero--catalogo{
  background:var(--night);
  min-height:clamp(420px, calc(100svh - var(--header-h)), 1100px);
}
.hero__foto{
  position:absolute; z-index:0; top:0; right:0;
  height:100%; width:auto; max-width:none; object-fit:cover;
  /* el borde izquierdo de la foto se funde con el fondo */
  -webkit-mask-image:linear-gradient(90deg, transparent 0%, #000 22%);
          mask-image:linear-gradient(90deg, transparent 0%, #000 22%);
}
.hero__velo{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background:linear-gradient(90deg,
    rgba(11,22,38,.95) 0%, rgba(11,22,38,.88) 45%, rgba(11,22,38,.72) 100%);
}
.hero--catalogo .hero__copy{ padding-block:clamp(40px, 4.6vw, 68px); }
.hero--catalogo .display--hero{ max-width:14ch; font-size:clamp(36px, 4.8vw, 72px); }
.hero--catalogo .lede--hero{ max-width:54ch; font-size:clamp(15px, 1.2vw, 18px); }
@media (max-width:860px){
  .hero__foto{ width:100%; object-position:60% 30%; -webkit-mask-image:none; mask-image:none; }
}


/* catálogo: una sección por familia */
.familia{ scroll-margin-top:calc(var(--header-h) + 12px); }
.familia__head{ max-width:760px; margin-bottom:clamp(28px, 3.5vw, 46px); }
.familia__titulo{
  font-size:clamp(30px, 3.4vw, 50px); line-height:1.08; color:var(--ink);
}
.familia__desc{
  margin-top:clamp(12px, 1.4vw, 18px);
  font-size:clamp(15px, 1.2vw, 18px); line-height:1.7; color:var(--ink-66);
}

/* ---------- rejilla de producto ---------- */
.pgrid{
  display:grid; grid-template-columns:repeat(auto-fill, minmax(250px, 1fr));
  gap:clamp(18px, 2.4vw, 30px);
}
.pgrid--big{ grid-template-columns:repeat(auto-fill, minmax(280px, 1fr)); }
/* home: los 4 destacados en una sola fila, sin huérfanos */

/* home: 6 sectores en 3 + 3 */
.apx--3{ grid-template-columns:repeat(3, 1fr); }
@media (max-width:860px){ .apx--3{ grid-template-columns:repeat(2, 1fr); } }
@media (max-width:480px){ .apx--3{ grid-template-columns:1fr; } }
.pcard{ display:flex; }
.pcard > a{
  display:flex; flex-direction:column; width:100%;
  background:#fff; border-radius:14px; overflow:hidden;
  box-shadow:0 6px 20px rgba(40,40,40,.08);
  transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.pcard > a:hover{ transform:translateY(-5px); box-shadow:0 16px 34px rgba(40,40,40,.14); }
/* altura fija: mantiene alineadas las tarjetas de una misma fila,
   mezclando fotos verticales, horizontales y marcadores */
.pcard__media{
  position:relative;
  height:clamp(190px, 17vw, 240px); background:var(--light);
  display:grid; place-items:center; padding:14px; overflow:hidden;
}
/* la foto entera, quepa como quepa: las de los AMR y humanoides son muy altas */
.pcard__media img{
  position:absolute; inset:14px; width:calc(100% - 28px); height:calc(100% - 28px);
  object-fit:contain; mix-blend-mode:multiply;
}
.pcard__media .ph{
  border:0; background:transparent;
  height:100%; aspect-ratio:auto; gap:8px;
}
.pcard__media .ph svg{ max-width:64px; }
.pcard__media .ph span{ font-size:11px; }
.pcard__body{ padding:20px 22px 24px; display:flex; flex-direction:column; flex:1; }
.pcard__body .badges{ margin-bottom:12px; }
.pcard__body h3{
  font-weight:400; font-size:22px; line-height:1.15; color:var(--navy);
}
.pcard__body > p{
  margin-top:8px; font-size:13.5px; line-height:1.55; color:var(--ink-66);
}
.pcard__facts{ display:grid; gap:8px; margin-top:16px; }
.pcard__facts li{ display:flex; justify-content:space-between; gap:12px; font-size:12.5px; }
.pcard__facts span{ color:var(--muted); }
.pcard__facts strong{ font-weight:700; color:var(--ink); text-align:right; }
.pcard__more{
  margin-top:auto; padding-top:18px;
  font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--blue);
}
.pcard__more::after{ content:' →'; }

.empty{ text-align:center; color:var(--muted); padding:40px 0; }

/* ---------- guía rápida ---------- */

/* ---------- home: qué hacemos ---------- */
.que__grid{
  display:grid; grid-template-columns:minmax(0, 1.12fr) minmax(0, 1fr);
  gap:clamp(32px, 4.5vw, 72px); align-items:start;
}
.que__titulo{
  margin-top:clamp(16px, 2vw, 26px);
  font-size:clamp(38px, 4.4vw, 68px); line-height:1.06;
  color:var(--ink);
}
.que__lede{
  margin-top:clamp(24px, 3vw, 40px); max-width:44ch;
  font-weight:400; font-size:clamp(16px, 1.3vw, 19px); line-height:1.9;
  color:var(--ink-66);
}
.que__tarjeta{
  background:var(--light);
  border-left:5px solid var(--blue);
  border-radius:clamp(26px, 3vw, 44px);
  padding:clamp(30px, 4vw, 64px) clamp(26px, 4vw, 64px);
}
.que__destacado{
  font-size:clamp(20px, 1.9vw, 30px); line-height:1.5;
  color:var(--navy);
}
.que__detalle{
  margin-top:clamp(20px, 2.4vw, 34px);
  font-weight:400; font-size:clamp(15px, 1.2vw, 18px); line-height:1.9;
  color:var(--ink-66);
}
@media (max-width:860px){
  .que__grid{ grid-template-columns:1fr; }
}

/* flecha de los enlaces de texto (tarjetas, «Leer más», «Ir al blog») */
.flecha{
  width:1em; height:1em; flex:none; stroke-width:2.4;
  transition:transform .28s var(--ease);
}

/* ---------- home: actualidad (últimas entradas del blog) ---------- */
.actualidad__head{
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:clamp(20px, 3vw, 48px); flex-wrap:wrap;
  margin-bottom:clamp(34px, 4vw, 56px);
}
.actualidad__titulo{
  margin-top:clamp(14px, 1.6vw, 22px);
  font-size:clamp(32px, 3.8vw, 56px); line-height:1.08; color:var(--ink);
}
.actualidad__enlace{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--font-subtitulo); font-weight:700; font-size:15px;
  color:var(--navy); padding-bottom:6px;
}
.actualidad__enlace:hover .flecha{ transform:translateX(4px); }
.actualidad__grid{
  display:grid; grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:clamp(18px, 2.2vw, 32px);
}
.ncard > a{
  display:flex; flex-direction:column; height:100%;
  background:#fff; border-radius:clamp(18px, 2vw, 26px); overflow:hidden;
  box-shadow:0 20px 44px rgba(40,40,40,.07);
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
}
.ncard > a:hover{ transform:translateY(-6px); box-shadow:0 28px 56px rgba(40,40,40,.13); }
.ncard__media{ aspect-ratio:16 / 9; overflow:hidden; background:var(--light); }
.ncard__media img{
  width:100%; height:100%; object-fit:cover;
  transition:transform .5s var(--ease);
}
.ncard > a:hover .ncard__media img{ transform:scale(1.05); }
.ncard__body{
  display:flex; flex-direction:column; flex:1;
  padding:clamp(18px, 1.9vw, 26px);
}
.ncard__fecha{
  font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:var(--muted);
}
.ncard__body h3{
  margin-top:clamp(10px, 1.1vw, 14px);
  font-size:clamp(17px, 1.4vw, 20px); line-height:1.25; color:var(--ink);
}
.ncard__resumen{
  margin-top:10px;
  font-size:clamp(13.5px, 1vw, 15px); line-height:1.6; color:var(--ink-66);
}
.ncard__mas{
  display:inline-flex; align-items:center; gap:8px;
  margin-top:auto; padding-top:clamp(14px, 1.5vw, 20px);
  font-size:13.5px; color:var(--navy);
}
.ncard > a:hover .ncard__mas .flecha{ transform:translateX(4px); }
@media (max-width:980px){ .actualidad__grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); } }
@media (max-width:640px){ .actualidad__grid{ grid-template-columns:1fr; } }

/* ---------- home: método en cuatro pasos ---------- */
.metodo__head{ max-width:980px; margin-bottom:clamp(34px, 4vw, 56px); }
.metodo__titulo{
  margin-top:clamp(14px, 1.6vw, 22px);
  font-size:clamp(32px, 3.8vw, 56px); line-height:1.08; color:var(--ink);
}
.metodo__grid{
  display:grid; grid-template-columns:repeat(4, minmax(0, 1fr));
  border:1px solid rgba(40,40,40,.12);
  list-style:none; margin:0; padding:0;   /* es <ol>: la numeración la pinta .metodo__num */
}
.metodo__paso{ padding:clamp(26px, 2.8vw, 42px); }
.metodo__paso + .metodo__paso{ border-left:1px solid rgba(40,40,40,.12); }
.metodo__num{
  font-family:var(--font-subtitulo); font-weight:700;
  font-size:14px; letter-spacing:.14em; color:var(--muted);
}
.metodo__nombre{
  margin-top:clamp(20px, 2.2vw, 32px);
  font-size:clamp(19px, 1.7vw, 23px); line-height:1.25; color:var(--ink);
}
.metodo__texto{
  margin-top:14px;
  font-size:clamp(14px, 1.1vw, 16px); line-height:1.7; color:var(--ink-66);
}
.metodo__mas{ margin-top:clamp(32px, 3.6vw, 52px); text-align:center; }
@media (max-width:980px){
  .metodo__grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .metodo__paso:nth-child(2n+1){ border-left:0; }
  .metodo__paso:nth-child(n+3){ border-top:1px solid rgba(40,40,40,.12); }
}
@media (max-width:560px){
  .metodo__grid{ grid-template-columns:1fr; }
  .metodo__paso + .metodo__paso{ border-left:0; border-top:1px solid rgba(40,40,40,.12); }
}

/* ---------- home: aplicaciones por sector ---------- */
.secbloque{
  position:relative; overflow:hidden; isolation:isolate;
  background:var(--navy); color:#fff;
  padding-block:clamp(60px, 8vw, 120px);
}
.secbloque__diagonal{
  position:absolute; inset:0; z-index:0;
  background:linear-gradient(140deg, var(--blue-deep) 0%, #1f6fc9 60%, var(--blue) 100%);
  clip-path:polygon(76% 0, 100% 0, 100% 100%, 58% 100%);
  opacity:.9;
}
.secbloque__grid{
  position:relative; z-index:1;
  display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1.15fr);
  gap:clamp(36px, 5vw, 90px); align-items:center;
}
.secbloque__titulo{
  margin-top:clamp(14px, 1.6vw, 22px);
  font-size:clamp(34px, 3.8vw, 56px); line-height:1.08; color:#fff;
}
.secbloque__lede{
  margin-top:clamp(20px, 2.4vw, 32px); max-width:46ch;
  font-size:clamp(15px, 1.2vw, 18px); line-height:1.8;
  color:rgba(255,255,255,.82);
}
.secbloque__copy .pill{ margin-top:clamp(26px, 3vw, 40px); }
.secbloque__fichas{
  display:grid; grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:clamp(16px, 1.8vw, 26px);
}
.secbloque__ficha{
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.22);
  border-radius:clamp(16px, 1.6vw, 22px);
  padding:clamp(22px, 2.4vw, 32px);
  backdrop-filter:blur(6px);
}
.secbloque__ficha h3{
  font-size:clamp(17px, 1.5vw, 21px); line-height:1.25; color:#fff;
}
.secbloque__ficha p{
  margin-top:12px;
  font-size:clamp(14px, 1.05vw, 16px); line-height:1.7;
  color:rgba(255,255,255,.8);
}
@media (max-width:980px){
  .secbloque__grid{ grid-template-columns:1fr; }
  .secbloque__diagonal{ clip-path:polygon(70% 0, 100% 0, 100% 100%, 88% 100%); }
}
@media (max-width:560px){
  .secbloque__fichas{ grid-template-columns:1fr; }
}

/* ---------- home: nuestros robots (carrusel de modelos) ---------- */
.loop__head{ max-width:900px; margin-bottom:clamp(36px, 4.5vw, 64px); }
.loop__titulo{
  margin-top:clamp(14px, 1.6vw, 22px);
  font-size:clamp(34px, 4vw, 60px); line-height:1.08;
  color:var(--ink);
}
.carrusel{ position:relative; --gap:clamp(18px, 2.2vw, 32px); --visibles:3; }
.carrusel__pista{
  display:grid; grid-auto-flow:column;
  grid-auto-columns:calc((100% - var(--gap) * (var(--visibles) - 1)) / var(--visibles));
  gap:var(--gap);
  overflow-x:auto; overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory; scroll-behavior:smooth;
  scrollbar-width:none;
  /* aire para que la sombra de las tarjetas no se recorte */
  padding:12px 0 48px; margin:-12px 0 -48px;
  cursor:grab;
}
.carrusel__pista::-webkit-scrollbar{ display:none; }
.carrusel__pista:focus-visible{ outline-offset:6px; }
.carrusel__pista > li{ scroll-snap-align:start; }
.carrusel.is-arrastrando .carrusel__pista{
  scroll-snap-type:none; scroll-behavior:auto; cursor:grabbing; user-select:none;
}
.carrusel.is-arrastrando .lcard > a{ pointer-events:none; }

.carrusel__btn{
  position:absolute; top:calc(50% - 30px); z-index:2;
  width:clamp(44px, 4vw, 56px); height:clamp(44px, 4vw, 56px);
  display:grid; place-items:center; border-radius:50%;
  background:#fff; color:var(--blue);
  box-shadow:0 12px 30px rgba(11,22,38,.16);
  transition:background .25s var(--ease), color .25s var(--ease), opacity .25s var(--ease), transform .25s var(--ease);
}
.carrusel__btn svg{ width:40%; height:40%; stroke-width:2.4; }
.carrusel__btn--prev{ left:clamp(-28px, -2vw, -12px); }
.carrusel__btn--next{ right:clamp(-28px, -2vw, -12px); }
.carrusel__btn:hover{ background:var(--blue); color:#fff; transform:scale(1.06); }
.carrusel__btn:disabled{ opacity:0; pointer-events:none; }
.lcard > a{
  display:flex; flex-direction:column; height:100%;
  -webkit-user-drag:none;
  border-radius:clamp(22px, 2.4vw, 32px); overflow:hidden;
  background:linear-gradient(180deg, #e6edf6 0%, #f4f7fb 45%, #ffffff 100%);
  box-shadow:0 24px 50px rgba(40,40,40,.06);
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
}
.lcard > a:hover{ transform:translateY(-6px); box-shadow:0 30px 60px rgba(40,40,40,.12); }
.lcard__media{ position:relative; aspect-ratio:1 / .9; }
.lcard__media img{
  position:absolute; inset:8%; width:84%; height:84%;
  object-fit:contain; mix-blend-mode:multiply;
  transition:transform .5s var(--ease);
}
.lcard > a:hover .lcard__media img{ transform:scale(1.05); }
.lcard__media .ph{ position:absolute; inset:0; background:transparent; border:0; border-radius:0; }
.lcard__media .ph span{ display:none; }   /* el nombre ya va debajo */
.lcard__body{ padding:0 clamp(22px, 2.6vw, 38px) clamp(26px, 3vw, 40px); }
.lcard__cat{
  font-size:clamp(12px, 1vw, 14px); letter-spacing:.2em; text-transform:uppercase;
  color:var(--ink-66);
}
.lcard__name{
  margin-top:clamp(10px, 1.2vw, 16px);
  font-size:clamp(24px, 2.2vw, 32px); line-height:1.1; letter-spacing:-.01em;
  color:var(--ink);
}
.lcard__desc{
  margin-top:10px;
  font-size:clamp(14px, 1.1vw, 16px); line-height:1.6;
  color:var(--ink-66);
}
.lcard__mas{
  display:inline-flex; align-items:center; gap:8px;
  margin-top:clamp(16px, 1.8vw, 24px);
  font-size:14px; letter-spacing:.02em; color:var(--blue);
}
.lcard > a:hover .lcard__mas .flecha{ transform:translateX(4px); }
.loop__mas{ margin-top:clamp(36px, 4vw, 56px); text-align:center; }
@media (max-width:980px){ .carrusel{ --visibles:2; } }
@media (max-width:560px){ .carrusel--gal{ --visibles:1; } }
@media (max-width:560px){
  /* en móvil una tarjeta y un asomo de la siguiente */
  .carrusel{ --visibles:1; }
  .carrusel__pista{ grid-auto-columns:86%; }
  .carrusel__btn--prev{ left:-6px; }
  .carrusel__btn--next{ right:-6px; }
}

/* ---------- blog ---------- */
/* ---------- blog: buscador y artículo destacado ---------- */
.blogbusca__head{
  display:flex; align-items:flex-end; justify-content:space-between;
  flex-wrap:wrap; gap:clamp(20px, 3vw, 48px);
  margin-bottom:clamp(30px, 3.6vw, 52px);
}
.blogbusca__head > div{ flex:1 1 360px; }
.blogbusca__titulo{
  margin-top:clamp(12px, 1.4vw, 18px); max-width:20ch;
  font-size:clamp(30px, 3.4vw, 50px); line-height:1.08; color:var(--ink);
}
.buscador{
  flex:0 1 480px; display:flex; align-items:center; gap:10px;
  padding:8px 8px 8px 28px; border-radius:24px;
  background:var(--light); border:1px solid rgba(40,40,40,.08);
  transition:border-color .25s var(--ease), box-shadow .25s var(--ease);
}
.buscador:focus-within{ border-color:rgba(0,158,227,.5); box-shadow:0 0 0 4px rgba(0,158,227,.12); }
.buscador input{
  flex:1; min-width:0; border:0; background:transparent; outline:0;
  font-size:clamp(15px, 1.2vw, 17px); color:var(--ink); padding:10px 0;
}
.buscador input::placeholder{ color:var(--muted); }
.buscador input::-webkit-search-cancel-button{ cursor:pointer; }
.buscador__btn{
  flex:none; padding:14px 28px; border-radius:16px;
  background:var(--blue); color:#fff;
  font-family:var(--font-subtitulo); font-weight:700; font-size:16px;
  transition:background .25s var(--ease), transform .25s var(--ease);
}
.buscador__btn:hover{ background:var(--blue-deep); transform:translateY(-1px); }

.destacado{
  display:grid; grid-template-columns:minmax(0, 1.1fr) minmax(0, .9fr);
  border-radius:clamp(22px, 2.6vw, 34px); overflow:hidden;
  background:var(--night); color:#fff;
  margin-bottom:clamp(30px, 3.6vw, 52px);
}
.destacado__foto{ min-height:clamp(280px, 34vw, 520px); background:var(--light); }
.destacado__foto img{ width:100%; height:100%; object-fit:cover; }
.destacado__texto{
  display:flex; flex-direction:column; justify-content:center; align-items:flex-start;
  padding:clamp(28px, 4.5vw, 72px);
}
.destacado__etiquetas{ display:flex; flex-wrap:wrap; gap:10px; }
.etiqueta{
  padding:8px 16px; border-radius:6px;
  background:rgba(0,158,227,.14); color:var(--blue);
  font-family:var(--font-subtitulo); font-weight:700; font-size:13px;
  letter-spacing:.08em; text-transform:uppercase;
}
.destacado__meta{
  margin-top:clamp(18px, 2vw, 28px);
  font-family:var(--font-subtitulo); font-weight:700; font-size:15px; color:rgba(255,255,255,.6);
}
html body .destacado h3.destacado__titulo{
  margin-top:clamp(10px, 1.2vw, 16px);
  font-family:var(--font-titulo); font-weight:700; letter-spacing:-.035em;
  font-size:clamp(30px, 3.4vw, 52px); line-height:1.06; color:#fff;
}
.destacado__titulo a:hover{ color:var(--blue); }
.destacado__resumen{
  margin-top:clamp(14px, 1.6vw, 22px); max-width:44ch;
  font-size:clamp(15px, 1.2vw, 17px); line-height:1.7; color:rgba(255,255,255,.78);
}
.destacado .pill{ margin-top:clamp(22px, 2.6vw, 34px); min-width:0; }
.blogbusca .destacado{ margin-bottom:0; }
.blogbusca__vacio{
  padding:clamp(28px, 4vw, 48px); text-align:center;
  background:#fff; color:var(--ink-66); font-size:16px;
}

/* ---------- blog: cierre «¿Necesitas orientación?» ---------- */
.orienta{
  position:relative; overflow:hidden; isolation:isolate;
  background:var(--night); color:#fff;
  padding-block:clamp(64px, 9vw, 140px);
}
/* halo azul desenfocado en la esquina superior derecha */
.orienta__halo{
  position:absolute; z-index:-1; pointer-events:none;
  top:-22%; right:-8%; width:clamp(260px, 32vw, 480px); aspect-ratio:1;
  border-radius:50%; background:rgba(0,158,227,.2); filter:blur(18px);
}
.orienta__titulo{
  margin-top:clamp(14px, 1.6vw, 22px); max-width:17ch;
  font-size:clamp(36px, 4.6vw, 72px); line-height:1.02; color:#fff;
}
.orienta__lede{
  margin-top:clamp(18px, 2.2vw, 30px); max-width:46ch;
  font-size:clamp(15px, 1.25vw, 19px); line-height:1.75; color:rgba(255,255,255,.72);
}
.orienta .pill{ margin-top:clamp(26px, 3vw, 44px); min-width:0; }

/* ---------- blog: últimos artículos con filtro por categoría ---------- */
.ultimos__titulo{
  margin-top:clamp(12px, 1.4vw, 18px);
  font-size:clamp(30px, 3.4vw, 50px); line-height:1.08; color:var(--ink);
}
.filtros{
  display:flex; flex-wrap:wrap; gap:10px;
  margin:clamp(24px, 3vw, 40px) 0 clamp(28px, 3.4vw, 48px);
}
.filtro{
  padding:14px 22px; border-radius:2px;
  background:#fff; border:1px solid rgba(40,40,40,.08); color:var(--ink);
  font-family:var(--font-subtitulo); font-weight:700; font-size:16px;
  transition:background .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease);
}
.filtro:hover{ border-color:var(--blue); color:var(--blue); }
.filtro.is-on{ background:var(--blue); border-color:var(--blue); color:#fff; }
.artgrid{
  display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:2px;
}
.artcard > a{
  display:flex; flex-direction:column; height:100%; background:#fff;
  transition:box-shadow .3s var(--ease);
}
.artcard > a:hover{ box-shadow:0 20px 44px rgba(40,40,40,.12); position:relative; z-index:1; }
.artcard__foto{ aspect-ratio:16 / 11.3; overflow:hidden; background:var(--light); }
.artcard__foto img{ width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); }
.artcard > a:hover .artcard__foto img{ transform:scale(1.04); }
.artcard__texto{
  display:flex; flex-direction:column; flex:1;
  padding:clamp(24px, 2.6vw, 42px) clamp(22px, 2.4vw, 42px);
}
.artcard__meta{
  font-family:var(--font-subtitulo); font-weight:700; font-size:13px;
  letter-spacing:.12em; text-transform:uppercase; color:var(--blue);
}
html body .artcard h3.artcard__titulo{
  margin-top:clamp(12px, 1.4vw, 18px);
  font-family:var(--font-titulo); font-weight:700; letter-spacing:-.03em;
  font-size:clamp(22px, 1.9vw, 30px); line-height:1.15; color:var(--ink);
}
.artcard__resumen{
  margin-top:12px; font-size:clamp(14px, 1.05vw, 16px); line-height:1.65; color:var(--ink-66);
}
.artcard__mas{
  display:inline-flex; align-items:center; gap:8px;
  margin-top:auto; padding-top:clamp(18px, 2vw, 26px);
  font-family:var(--font-subtitulo); font-weight:700; font-size:14px; color:var(--navy);
}
.artcard > a:hover .artcard__mas .flecha{ transform:translateX(4px); }
@media (max-width:980px){ .artgrid{ grid-template-columns:repeat(2, minmax(0, 1fr)); } }
@media (max-width:600px){
  .artgrid{ grid-template-columns:1fr; }
  .filtro{ padding:11px 16px; font-size:14px; }
}
@media (max-width:860px){
  .destacado{ grid-template-columns:1fr; }
  .destacado__foto{ min-height:0; aspect-ratio:16 / 10; }
  .buscador{ flex-basis:100%; }
}
@media (max-width:480px){
  .buscador{ padding-left:18px; }
  .buscador__btn{ padding:12px 18px; }
}

/* estado vacío */
.vacio{ text-align:center; padding:clamp(28px, 4vw, 52px) 0; }
.vacio__ico{
  display:inline-grid; place-items:center;
  width:78px; height:78px; border-radius:50%;
  background:var(--light); color:var(--blue); padding:16px;
}
.vacio__ico svg{ width:100%; height:100%; }
.vacio h2{
  margin-top:22px; font-weight:400; font-size:clamp(21px, 2.4vw, 28px);
  line-height:1.25; color:var(--ink);
}
.vacio p{
  margin:14px auto 0; max-width:52ch;
  font-size:14.5px; line-height:1.7; color:var(--ink-66);
}
.vacio .feat-cta{ margin-top:30px; }

/* ---------- contacto: portada partida ---------- */
.ctohero{
  position:relative; overflow:hidden; isolation:isolate; color:#fff;
  background:
    radial-gradient(ellipse 40% 70% at 0% 100%, rgba(0,158,227,.14), transparent 70%),
    var(--night);
  padding-block:clamp(40px, 4.8vw, 72px);
  min-height:clamp(460px, calc(100svh - var(--header-h)), 1100px);
  display:flex; align-items:center;
}
.ctohero > .wrap{ width:100%; }
.ctohero__lado--foto{
  position:absolute; z-index:-1; top:0; right:0; bottom:0; width:52%;
}
.ctohero__lado--foto img{ width:100%; height:100%; object-fit:cover; object-position:40% 50%; }
.ctohero__lado--foto::after{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(11,22,38,.55) 0%, rgba(22,32,72,.72) 45%, rgba(47,36,131,.78) 100%);
}
.ctohero__grid{
  display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
  gap:clamp(32px, 5vw, 90px); align-items:center;
}
.ctohero__copy{ max-width:600px; }
.ctohero__kicker{ display:flex; align-items:center; gap:14px; font-family:var(--font-subtitulo); font-weight:700; }
.ctohero__kicker::before{ content:""; width:44px; height:2px; background:var(--blue); }
.ctohero__titulo{
  margin-top:clamp(16px, 2vw, 26px);
  font-size:clamp(36px, 4.8vw, 72px); line-height:1.02; letter-spacing:-.035em; color:#fff;
}
.ctohero__lede{
  margin-top:clamp(16px, 1.8vw, 24px); max-width:48ch;
  font-size:clamp(15px, 1.1vw, 17px); line-height:1.7; color:rgba(255,255,255,.78);
}
.ctohero__cta{ display:flex; flex-wrap:wrap; gap:12px; margin-top:clamp(22px, 2.4vw, 32px); }
.ctohero__cta .pill{ min-width:0; padding:12px 12px 12px 26px; font-size:clamp(14.5px, 1.05vw, 16px); }
.pill--borde{
  background:transparent; color:#fff; padding-right:30px !important;
  border:1.5px solid rgba(255,255,255,.28); box-shadow:none;
}
.pill--borde:hover{ background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.5); box-shadow:none; }

.asesora{
  justify-self:end; width:100%; max-width:460px;
  background:rgba(245,247,250,.97); color:var(--ink);
  border-radius:clamp(20px, 2.2vw, 28px);
  padding:clamp(20px, 2.2vw, 30px);
  box-shadow:0 24px 56px rgba(0,0,0,.32);
}
.asesora__titulo{ font-size:clamp(19px, 1.6vw, 24px); line-height:1.2; color:var(--ink); }
.asesora__texto{ margin-top:10px; font-size:14px; line-height:1.65; color:var(--ink-66); }
.asesora__pasos{ list-style:none; margin:clamp(14px, 1.6vw, 20px) 0 0; padding:0; display:grid; gap:9px; }
.asesora__paso{
  display:flex; gap:18px; align-items:flex-start;
  background:#fff; border-radius:14px; padding:12px 14px;
  box-shadow:0 4px 16px rgba(11,22,38,.05);
}
.asesora__num{
  flex:none; width:36px; height:36px; border-radius:10px;
  display:grid; place-items:center;
  background:var(--blue); color:#fff;
  font-family:var(--font-subtitulo); font-weight:700; font-size:13px;
}
.asesora__paso{ gap:14px; }
.asesora__paso h3{ font-size:14.5px; line-height:1.3; color:var(--ink); }
.asesora__paso p{ margin-top:3px; font-size:13px; line-height:1.5; color:var(--ink-66); }

@media (max-width:960px){
  .ctohero{ min-height:0; }
  .ctohero__grid{ grid-template-columns:1fr; }
  .ctohero__lado--foto{ top:auto; width:100%; height:46%; }
  .ctohero__lado--foto::after{ background:linear-gradient(180deg, var(--night) 0%, rgba(11,22,38,.6) 40%, rgba(47,36,131,.75) 100%); }
  .asesora{ justify-self:stretch; max-width:none; }
}
@media (max-width:560px){
  .ctohero__cta .pill{ width:100%; justify-content:space-between; }
  .pill--borde{ justify-content:center !important; }
  .asesora__paso{ padding:12px; gap:12px; }
  .asesora__num{ width:34px; height:34px; }
}

/* ---------- contacto: formulario ---------- */
.ctoform__grid{
  display:grid; grid-template-columns:minmax(0, .82fr) minmax(0, 1.18fr);
  gap:clamp(20px, 2.6vw, 36px); align-items:start;
}
.ctoform__lado{
  background:#fff; border:1px solid #e6e9ee;
  border-radius:clamp(22px, 2.6vw, 32px);
  padding:clamp(26px, 3.4vw, 48px);
  box-shadow:0 20px 50px rgba(11,22,38,.06);
}
.ctoform__ladotitulo{ margin-top:12px; font-size:clamp(26px, 2.8vw, 40px); line-height:1.1; color:var(--ink); }
.ctoform__ladotexto{
  margin-top:clamp(16px, 1.8vw, 24px);
  font-size:clamp(15px, 1.15vw, 17px); line-height:1.75; color:var(--ink-66);
}
.datos{ list-style:none; margin:clamp(24px, 2.8vw, 36px) 0 0; padding:0; display:grid; gap:12px; }
.dato{
  display:flex; align-items:center; gap:16px;
  background:#f7f9fb; border:1px solid #eceff3; border-radius:16px;
  padding:16px 18px;
}
.dato__ico{
  flex:none; width:44px; height:44px; border-radius:12px;
  display:grid; place-items:center;
  background:#e8f4fd; color:var(--blue);
}
.dato__ico svg{ width:21px; height:21px; }
.dato__etiqueta{
  font-family:var(--font-subtitulo); font-weight:700;
  font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; color:#8b93a1;
}
.dato__valor{ margin-top:3px; font-size:16px; font-weight:600; color:var(--ink); overflow-wrap:anywhere; }
.dato__valor--dir{ font-style:normal; font-weight:500; font-size:14.5px; line-height:1.6; color:var(--ink-66); }
.dato__valor a{ transition:color .25s var(--ease); }
.dato__valor a:hover{ color:var(--blue); }

.form__consent{ display:flex; align-items:flex-start; gap:14px; }
html body .form__consent input{
  flex:none; width:22px; height:22px; min-height:0; margin-top:2px; padding:0;
  border-radius:6px; background:#fff;
  accent-color:var(--blue); cursor:pointer;
}
html body .form .form__consent label{
  flex:1; min-width:0;
  font-family:var(--font-texto); font-size:14px; line-height:1.6;
  letter-spacing:normal; text-transform:none; font-weight:400; color:var(--ink-66);
}
.form__consent a{ color:var(--blue); text-decoration:underline; }
.pill--ancho{ width:100%; justify-content:space-between; padding:18px 18px 18px 30px; }
.ctoform__caja{
  background:#fff; border:1px solid #e6e9ee;
  border-radius:clamp(22px, 2.6vw, 32px);
  padding:clamp(26px, 4vw, 56px);
  box-shadow:0 20px 50px rgba(11,22,38,.06);
}
.ctoform__cab{ display:flex; justify-content:space-between; align-items:flex-start; gap:16px; flex-wrap:wrap; }
.ctoform__titulo{ margin-top:10px; font-size:clamp(30px, 3.2vw, 46px); line-height:1.08; color:var(--ink); }
.ctoform__sello{
  padding:12px 22px; border-radius:999px;
  background:#eaf4fc; color:var(--blue);
  font-family:var(--font-subtitulo); font-weight:700; font-size:15px; white-space:nowrap;
}

.form{ margin-top:clamp(26px, 3vw, 40px); display:grid; gap:clamp(18px, 2vw, 26px); }
.form__two{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(14px, 1.6vw, 22px); }
.form__row{ display:grid; gap:10px; }
.form label{
  font-size:12.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:#6b7280;
}
.form input, .form select, .form textarea{
  font:inherit; font-size:16px; color:var(--ink);
  padding:16px 18px; border:1.5px solid #e1e5eb; border-radius:14px;
  background:#f7f9fb; width:100%;
  transition:border-color .25s var(--ease), box-shadow .25s var(--ease), background .25s var(--ease);
}
.form input::placeholder, .form textarea::placeholder{ color:#a3aab5; }
.form select{
  appearance:none; -webkit-appearance:none; padding-right:48px; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='10' viewBox='0 0 14 10'%3E%3Cpath d='M0 0h14L7 10z' fill='%23009ee3'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 20px center;
}
.form textarea{ resize:vertical; min-height:170px; }
.form input:focus, .form select:focus, .form textarea:focus{
  outline:none; background-color:#fff; border-color:var(--blue); box-shadow:0 0 0 4px rgba(0,158,227,.14);
}
.form input:user-invalid, .form textarea:user-invalid{ border-color:#c62828; }
.form .pill{ justify-self:start; min-width:230px; border:0; cursor:pointer; }
.form__nota{ font-size:13.5px; line-height:1.6; color:var(--ink-66); min-height:1.2em; }
.form__nota.is-ok{ color:var(--blue-deep); font-weight:700; }
.form__nota.is-err{ color:#c62828; }

@media (max-width:960px){
  .ctoform__grid{ grid-template-columns:1fr; }
}
@media (max-width:560px){
  .form__two{ grid-template-columns:1fr; }
  .form .pill{ width:100%; }
  .ctoform__sello{ font-size:13px; padding:9px 16px; }
}

/* ---------- contacto: cómo trabajamos ---------- */
.ctoproceso__titulo{ margin-top:12px; font-size:clamp(30px, 3.4vw, 50px); line-height:1.08; color:var(--ink); }
.ctopasos{
  list-style:none; margin:clamp(28px, 3vw, 44px) 0 0; padding:0;
  display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:clamp(14px, 1.6vw, 24px);
}
.ctopaso{
  border:1px solid #e6e9ee; border-radius:clamp(20px, 2.2vw, 28px);
  padding:clamp(24px, 2.6vw, 36px);
  transition:border-color .3s var(--ease), box-shadow .3s var(--ease), transform .3s var(--ease);
}
.ctopaso:hover{ border-color:rgba(0,158,227,.35); box-shadow:0 18px 40px rgba(11,22,38,.08); transform:translateY(-3px); }
.ctopaso__num{ font-family:var(--font-subtitulo); font-weight:700; font-size:16px; color:var(--blue); }
.ctopaso__titulo{ margin-top:clamp(16px, 1.8vw, 26px); font-size:clamp(20px, 1.8vw, 26px); color:var(--ink); }
.ctopaso__texto{ margin-top:12px; font-size:clamp(14.5px, 1.1vw, 16px); line-height:1.75; color:var(--ink-66); }
@media (max-width:860px){ .ctopasos{ grid-template-columns:1fr; } }

/* ---------- contacto: franja con el email ---------- */
.ctomail{
  background:
    radial-gradient(ellipse 30% 90% at 50% 0%, rgba(0,158,227,.35), transparent 70%),
    var(--navy);
  color:#fff; text-align:center;
  padding-block:clamp(48px, 6vw, 84px);
}
.ctomail__texto p{ font-size:clamp(15px, 1.25vw, 19px); color:rgba(255,255,255,.88); }
.ctomail__email{
  display:inline-block; margin-top:10px;
  font-family:var(--font-subtitulo); font-weight:700;
  font-size:clamp(24px, 2.6vw, 36px); color:#fff; overflow-wrap:anywhere;
  transition:color .25s var(--ease);
}
.ctomail__email:hover{ color:var(--blue); }

/* ---------- conócenos: misión ---------- */
.mision__grid{
  display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
  gap:clamp(32px, 6vw, 110px); align-items:start;
}
.mision__titulo{
  margin-top:clamp(14px, 1.6vw, 22px);
  font-size:clamp(32px, 3.8vw, 58px); line-height:1.06; color:var(--ink);
}
.mision__texto p{
  font-size:clamp(16px, 1.3vw, 19px); line-height:1.8; color:var(--ink-66);
}
.mision__texto p + p{ margin-top:clamp(14px, 1.6vw, 20px); }
.mision__puntos{
  margin-top:clamp(24px, 2.8vw, 36px); padding-top:clamp(20px, 2.4vw, 30px);
  border-top:1px solid rgba(40,40,40,.1);
}
.mision__puntos li{ font-weight:600; }
@media (max-width:860px){ .mision__grid{ grid-template-columns:1fr; } }

/* ---------- marcas distribuidas: franja en inicio y tarjetas en conócenos ---------- */
.marcas{
  background:var(--light);
  border-bottom:1px solid rgba(47,36,131,.08);
  padding-block:clamp(22px, 2.6vw, 34px);
}
.marcas__fila{
  display:flex; align-items:center; justify-content:center; flex-wrap:wrap;
  gap:clamp(14px, 3vw, 48px);
}
.marcas__rotulo{
  margin:0; font-family:var(--font-subtitulo); font-weight:700;
  font-size:13px; letter-spacing:.14em; text-transform:uppercase; color:var(--navy);
}
.marcas__logos, .alianza__marcas{ list-style:none; margin:0; padding:0; display:flex; align-items:center; }
.marcas__logos{ gap:clamp(28px, 4vw, 64px); }
.marcas__logo img{ display:block; height:clamp(26px, 2.6vw, 36px); width:auto; }
.marcas__logo:last-child img{ height:clamp(30px, 3vw, 42px); }

.alianza__marcas{
  justify-content:center; flex-wrap:wrap;
  gap:clamp(12px, 1.6vw, 20px);
  margin-top:clamp(20px, 2.4vw, 30px);
}
.alianza__marca{
  display:flex; align-items:center; justify-content:center;
  width:clamp(170px, 17vw, 220px); height:clamp(60px, 6vw, 76px);
  padding:0 clamp(22px, 2.6vw, 34px);
  background:#fff; border-radius:clamp(16px, 1.8vw, 22px);
  box-shadow:0 12px 30px rgba(11,22,38,.18);
}
.alianza__marca img{ display:block; width:100%; height:auto; max-height:34px; object-fit:contain; }
.alianza__marca:last-child img{ max-height:28px; }
@media (max-width:560px){
  .marcas__fila{ flex-direction:column; gap:14px; }
  .marcas__rotulo{ text-align:center; font-size:12px; letter-spacing:.1em; }
  .alianza__marca{ width:calc(50% - 6px); height:70px; padding:0 16px; }
}

/* ---------- conócenos: alianza con cifras (franja compacta) ---------- */
.alianza{
  position:relative; overflow:hidden; color:#fff;
  background:
    radial-gradient(ellipse 45% 80% at 0% 40%, rgba(0,158,227,.35), transparent 70%),
    var(--navy);
  padding-block:clamp(48px, 5.6vw, 80px);
}
.alianza__head{ max-width:900px; margin:0 auto; text-align:center; }
.alianza__titulo{ font-size:clamp(28px, 2.9vw, 42px); line-height:1.1; color:#fff; }
.alianza__texto{
  max-width:62ch; margin:clamp(10px, 1.2vw, 16px) auto 0;
  font-size:clamp(14px, 1.1vw, 16px); line-height:1.7; color:rgba(255,255,255,.8);
}
.alianza__cifras{
  max-width:1140px; margin:clamp(28px, 3.2vw, 44px) auto 0;
  display:grid; grid-template-columns:repeat(4, minmax(0, 1fr));
  border-radius:clamp(20px, 2.2vw, 30px); overflow:hidden;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.16);
}
.alianza__cifra{
  padding:clamp(22px, 2.4vw, 34px) clamp(14px, 1.4vw, 22px);
  text-align:center;
}
.alianza__cifra + .alianza__cifra{ border-left:1px solid rgba(255,255,255,.14); }
.alianza__valor{
  font-family:var(--font-titulo); font-weight:800; letter-spacing:-.035em;
  font-size:clamp(34px, 3.4vw, 52px); line-height:1; color:#fff;
  font-variant-numeric:tabular-nums; white-space:nowrap;
}
.alianza__etiqueta{
  margin:clamp(8px, 1vw, 12px) auto 0; max-width:26ch;
  font-size:clamp(13px, .95vw, 14.5px); line-height:1.5; color:rgba(255,255,255,.78);
}
@media (max-width:900px){
  .alianza__cifras{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .alianza__cifra:nth-child(odd){ border-left:0; }
  .alianza__cifra:nth-child(n+3){ border-top:1px solid rgba(255,255,255,.14); }
}
@media (max-width:420px){
  .alianza__cifra{ padding:20px 10px; }
  .alianza__valor{ font-size:30px; }
}

/* ---------- conócenos: cta «¿Hablamos de tu proyecto?» con foto ---------- */
.proyecto{ padding-top:0; }
.proyecto__caja{
  position:relative; overflow:hidden; isolation:isolate;
  display:grid; grid-template-columns:minmax(0, 1fr) auto;
  align-items:end; gap:clamp(24px, 4vw, 64px);
  max-width:1140px; min-height:clamp(300px, 30vw, 380px); margin-inline:auto;
  padding:clamp(34px, 4.4vw, 60px) clamp(26px, 4.4vw, 64px);
  border-radius:clamp(22px, 2.6vw, 34px);
  background:var(--navy); color:#fff;
  box-shadow:0 24px 60px rgba(11,22,38,.18);
}
.proyecto__foto{
  position:absolute; z-index:-2; top:0; right:0; bottom:0;
  width:66%; height:100%; object-fit:cover; object-position:60% 0%;
}
.proyecto__velo{
  position:absolute; z-index:-1; inset:0;
  background:
    linear-gradient(90deg, var(--navy) 0%, var(--navy) 34%, rgba(47,36,131,.82) 50%, rgba(47,36,131,.25) 72%, rgba(47,36,131,.05) 100%),
    linear-gradient(0deg, rgba(11,22,38,.55) 0%, transparent 55%);
}
.proyecto__texto{ max-width:560px; }
.proyecto__titulo{ font-size:clamp(30px, 3.4vw, 50px); line-height:1.05; color:#fff; }
.proyecto__lede{
  margin-top:clamp(12px, 1.4vw, 18px); max-width:44ch;
  font-size:clamp(15px, 1.2vw, 18px); line-height:1.7; color:rgba(255,255,255,.85);
}
.proyecto__boton{
  padding:16px 14px 16px 30px; font-size:clamp(15px, 1.2vw, 17px); gap:20px; white-space:nowrap;
  box-shadow:0 14px 34px rgba(0,158,227,.35);
}
@media (max-width:760px){
  .proyecto__caja{ grid-template-columns:1fr; align-items:start; min-height:0; padding-top:clamp(180px, 50vw, 240px); }
  .proyecto__foto{ width:100%; height:62%; bottom:auto; object-position:50% 30%; }
  .proyecto__velo{
    background:linear-gradient(180deg, rgba(47,36,131,.05) 0%, rgba(47,36,131,.4) 30%, var(--navy) 58%);
  }
  .proyecto__boton{ justify-self:start; min-width:0; max-width:100%; }
}

/* ---------- página de aplicaciones ---------- */
.hero--aplicaciones .hero__foto,
.hero--foto-ancha .hero__foto{ width:62%; object-fit:cover; }
.hero__foto--arriba{ object-position:50% 20%; }
.sector__grid{
  display:grid; grid-template-columns:minmax(0, .9fr) minmax(0, 1.1fr);
  gap:clamp(28px, 5vw, 80px); align-items:center;
}
.sector--invertido .sector__foto{ order:2; }
.sector__foto{ margin:0; border-radius:clamp(20px, 2.4vw, 32px); overflow:hidden; aspect-ratio:4 / 4.2; }
.sector__foto img{ width:100%; height:100%; object-fit:cover; }
.sector__titulo{
  margin-top:clamp(10px, 1.2vw, 16px);
  font-size:clamp(28px, 3.2vw, 46px); line-height:1.08; color:var(--ink);
}
.sector__lede{
  margin-top:clamp(14px, 1.6vw, 22px); max-width:52ch;
  font-size:clamp(15px, 1.2vw, 18px); line-height:1.75; color:var(--ink-66);
}
.sector__tareas{ margin-top:clamp(18px, 2vw, 26px); display:grid; gap:10px; }
.sector__tareas li{
  position:relative; padding-left:30px;
  font-size:clamp(14px, 1.05vw, 16px); line-height:1.55; color:var(--ink);
}
.sector__tareas li::before{
  content:''; position:absolute; left:0; top:.2em; width:18px; height:18px; border-radius:50%;
  background:var(--blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center / 12px no-repeat;
}
.sector__sub{
  margin-top:clamp(24px, 2.8vw, 36px);
  font-family:var(--font-subtitulo); font-weight:700;
  font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:var(--muted);
}
.sector__robots{
  margin-top:14px;
  display:grid; grid-template-columns:repeat(auto-fill, minmax(190px, 1fr)); gap:12px;
}
.minirobot{
  display:flex; align-items:center; gap:12px; height:100%;
  padding:10px 14px 10px 10px; border-radius:14px;
  background:#fff; border:1px solid rgba(40,40,40,.08);
  transition:border-color .25s var(--ease), box-shadow .25s var(--ease), transform .25s var(--ease);
}
.section--white .minirobot{ background:var(--light); }
.minirobot:hover{ border-color:rgba(0,158,227,.45); box-shadow:0 10px 24px rgba(40,40,40,.08); transform:translateY(-2px); }
.minirobot__foto{
  flex:none; width:52px; height:52px; border-radius:10px; background:#fff;
  display:grid; place-items:center; overflow:hidden;
}
.minirobot__foto img{ width:100%; height:100%; object-fit:contain; mix-blend-mode:multiply; }
.minirobot__foto .ph{ border:0; background:transparent; padding:8px; }
.minirobot__foto .ph span{ display:none; }
.minirobot__texto{ display:flex; flex-direction:column; line-height:1.25; }
.minirobot__texto strong{ font-family:var(--font-subtitulo); font-size:16px; color:var(--navy); }
.minirobot__texto span{ font-size:12.5px; color:var(--ink-66); }
@media (max-width:860px){
  .sector__grid{ grid-template-columns:1fr; }
  .sector--invertido .sector__foto{ order:0; }
  .sector__foto{ aspect-ratio:16 / 10; }
  .hero--aplicaciones .hero__foto,
  .hero--foto-ancha .hero__foto{ width:100%; }
}

/* ---------- catálogo: cierre «¿No sabes qué robot encaja mejor?» ---------- */
.elegir{
  position:relative; overflow:hidden; color:#fff;
  background:
    radial-gradient(ellipse 38% 90% at 86% 30%, rgba(0,158,227,.42), transparent 70%),
    var(--navy);
  padding-block:clamp(64px, 8vw, 120px);
}
.elegir__grid{
  display:grid; grid-template-columns:minmax(0, 1fr) auto;
  align-items:center; gap:clamp(28px, 5vw, 90px);
}
.elegir__titulo{
  font-size:clamp(34px, 4vw, 60px); line-height:1.05; color:#fff;
}
.elegir__lede{
  margin-top:clamp(20px, 2.4vw, 32px); max-width:56ch;
  font-size:clamp(15px, 1.2vw, 18px); line-height:1.8; color:rgba(255,255,255,.82);
}
.elegir__boton{ min-width:0; padding:16px 14px 16px 34px; font-size:clamp(16px, 1.3vw, 18px); gap:22px; }
@media (max-width:860px){
  .elegir__grid{ grid-template-columns:1fr; }
  .elegir__boton{ justify-self:start; }
}

/* ---------- franja clara sobre el pie: mensaje y logotipo ---------- */
.prefoot{
  position:relative; overflow:hidden; isolation:isolate;
  background:linear-gradient(90deg, #f1f4f8 0%, #ffffff 45%, #eaf2fa 100%);
  padding-block:clamp(48px, 6vw, 90px);
}
/* dos bandas diagonales azuladas a la derecha, como en la maqueta */
.prefoot__diagonal,
.prefoot::before{
  content:''; position:absolute; inset:0; z-index:-1; pointer-events:none;
}
.prefoot::before{
  background:rgba(0,158,227,.10);
  clip-path:polygon(64% 0, 77% 0, 67% 100%, 54% 100%);
}
.prefoot__diagonal{
  background:rgba(0,158,227,.06);
  clip-path:polygon(77% 0, 100% 0, 100% 100%, 67% 100%);
}
.prefoot__grid{
  display:grid; grid-template-columns:minmax(0, 1fr) auto minmax(0, 1fr);
  align-items:center; gap:clamp(28px, 5vw, 80px);
}
.prefoot__texto{ max-width:34ch; justify-self:center; text-align:center; }
.prefoot__titulo{
  font-family:var(--font-titulo); font-weight:700; letter-spacing:-.02em;
  font-size:clamp(21px, 1.9vw, 27px); line-height:1.2; color:var(--ink);
}
.prefoot__texto p + p{
  margin-top:clamp(14px, 1.6vw, 22px);
  font-size:clamp(15px, 1.2vw, 18px); line-height:1.75; color:var(--ink-66);
}
.prefoot__logo{ display:block; justify-self:center; }
.prefoot__logo img{ width:clamp(160px, 16vw, 240px); height:auto; }
.prefoot__redes{ justify-self:center; text-align:center; }
.prefoot__redes ul{
  display:flex; justify-content:center; gap:clamp(18px, 2.2vw, 30px);
  margin-top:clamp(18px, 2.2vw, 28px);
}
.prefoot__redes a{
  display:block; width:clamp(44px, 3.8vw, 58px); height:clamp(44px, 3.8vw, 58px);
  transition:transform .25s var(--ease), filter .25s var(--ease);
}
.prefoot__redes a:hover{ transform:translateY(-3px); filter:brightness(1.25); }
.prefoot__redes svg{ width:100%; height:100%; }
@media (max-width:760px){
  .prefoot__grid{ grid-template-columns:1fr; gap:30px; }
  .prefoot__logo{ order:-1; }
}

/* ---------- cierre de página: diagonal, texto y robot ---------- */
.ctafinal{
  position:relative; overflow:hidden; isolation:isolate;
  background:var(--night); color:#fff;
}
.ctafinal__diagonal{
  position:absolute; inset:0; z-index:0;
  background:var(--navy);
  clip-path:polygon(0 0, 43% 0, 29% 100%, 0 100%);
}
.ctafinal__grid{
  position:relative; z-index:1;
  display:grid; grid-template-columns:38% minmax(0, 1fr) minmax(0, .5fr);
  align-items:end; column-gap:clamp(20px, 3vw, 48px);
}
.ctafinal__copy{
  position:relative; z-index:2;   /* el texto, por delante del robot */
  grid-column:2;
  padding-block:clamp(56px, 6.5vw, 100px);
  align-self:center;
}
.ctafinal__titulo{
  margin-top:clamp(14px, 1.6vw, 22px);
  max-width:14ch;
  font-size:clamp(32px, 3.6vw, 54px); line-height:1.08; color:#fff;
}
.ctafinal__texto{
  margin-top:clamp(18px, 2.2vw, 30px); max-width:38ch;
  font-size:clamp(15px, 1.15vw, 17px); line-height:1.8;
  color:rgba(255,255,255,.82);
}
.ctafinal__copy .pill{ margin-top:clamp(26px, 3vw, 40px); }
.ctafinal__robot{
  /* muy ampliado y desplazado hacia abajo: sólo asoma de la pegatina
     «RH·BOTS» del pecho hacia arriba; la sección recorta el resto */
  position:absolute; right:clamp(-190px, -9vw, -30px); bottom:0; z-index:0;
  width:clamp(420px, 40vw, 680px); height:auto;
  transform:translateY(48%);
  pointer-events:none;
}
@media (max-width:980px){
  .ctafinal__grid{ grid-template-columns:1fr; }
  .ctafinal__copy{ grid-column:1; padding-block:clamp(48px, 9vw, 80px); }
  .ctafinal__titulo{ max-width:none; }
  .ctafinal__robot{ display:none; }   /* en móvil manda el texto */
  .ctafinal__copy{ padding-block:clamp(40px, 8vw, 68px); }
  .ctafinal__diagonal{ clip-path:polygon(0 0, 16% 0, 6% 100%, 0 100%); }
}

/* botón secundario: negativo del principal, blanco con letras azules */
.pill--line{
  background:#fff; color:var(--blue);
  box-shadow:0 10px 28px rgba(11,22,38,.16);
}
.pill--line .pill__ico{ background:var(--blue); color:#fff; }
.pill--line:hover{ background:#fff; box-shadow:0 16px 36px rgba(11,22,38,.24); }

/* ---------- responsive ---------- */
@media (max-width:860px){
  .phero__grid{ grid-template-columns:1fr; }
  .phero__lado{ order:-1; }
  .phero__media{ min-height:0; }
  .phero__media img{ max-height:min(46vh, 320px); }
  .spectable th{ width:52%; }
}
@media (max-width:560px){
  .phero__cta{ flex-direction:column; }
  .phero__cta .pill{ width:100%; }
  .spectable th, .spectable td{ font-size:13px; }
}

/* ---------- 404 ---------- */
.err404{
  font-weight:700; font-size:clamp(60px, 12vw, 130px); line-height:1;
  color:var(--blue); opacity:.18; margin:0 0 -.12em;
}

/* ==========================================================================
   FONDOS DE VÍDEO
   El desenfoque viene aplicado en el propio archivo (ffmpeg), no aquí:
   un filter:blur() sobre vídeo en marcha se recalcula cada fotograma.
   ========================================================================== */
.fondovid{
  position:absolute; inset:0; overflow:hidden;
  pointer-events:none; z-index:0;
}
.fondovid video{
  width:100%; height:100%; object-fit:cover;
  transform:scale(1.08);           /* tapa los bordes del desenfoque */
  opacity:0; transition:opacity 1.2s var(--ease);
}
.fondovid.is-listo video{ opacity:1; }

/* velo de marca encima: el vídeo aporta movimiento, no protagonismo */
.fondovid::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(120deg,
    rgba(0,158,227,.86) 0%, rgba(0,158,227,.78) 45%, rgba(10,127,196,.88) 100%);
}
/* hero: velo casi negro a la izquierda para que el titular respire */
.fondovid--oscuro::after{
  background:linear-gradient(90deg,
    rgba(11,22,38,.95) 0%, rgba(11,22,38,.88) 45%, rgba(11,22,38,.72) 100%);
}
.fondovid--claro::after{
  background:linear-gradient(120deg,
    rgba(243,245,248,.93) 0%, rgba(243,245,248,.88) 50%, rgba(255,255,255,.92) 100%);
}

.phero > .wrap, .cta-seccion > .wrap{ position:relative; z-index:1; }
.phero, .cta-seccion{ position:relative; overflow:hidden; }

@media (prefers-reduced-motion: reduce){
  .fondovid video{ display:none; }   /* se queda el poster, quieto */
}


/* ==========================================================================
   ANIMACIONES
   ========================================================================== */

/* ---- entrada escalonada del hero ---- */
.js .hero__copy .display,
.js .hero__copy .lede,
.js .hero__copy .hero__cta,
.js .hero__kicker,
.js .phero__copy > *{
  opacity:0; transform:translateY(26px);
  animation:entra .9s var(--ease) forwards;
}
.js .hero__kicker            { animation-delay:.15s; }
.js .hero__copy .display     { animation-delay:.25s; }
.js .hero__copy .lede        { animation-delay:.40s; }
.js .hero__copy .hero__cta   { animation-delay:.55s; }

.js .phero__copy > *:nth-child(1){ animation-delay:.10s; }
.js .phero__copy > *:nth-child(2){ animation-delay:.18s; }
.js .phero__copy > *:nth-child(3){ animation-delay:.26s; }
.js .phero__copy > *:nth-child(4){ animation-delay:.34s; }
.js .phero__copy > *:nth-child(5){ animation-delay:.42s; }
.js .phero__copy > *:nth-child(6){ animation-delay:.50s; }

@keyframes entra{
  from{ opacity:0; transform:translateY(26px); filter:blur(6px); }
  to  { opacity:1; transform:none;             filter:blur(0); }
}

/* la imagen de la ficha entra con un leve zoom */
.js .phero__media{ animation:acerca 1.1s var(--ease) .2s both; }
@keyframes acerca{
  from{ opacity:0; transform:scale(.94); }
  to  { opacity:1; transform:none; }
}

/* ---- revelados con variantes ---- */
.js .reveal.reveal--zoom      { transform:translateY(22px) scale(.96); }
.js .reveal.reveal--izq       { transform:translateX(-34px); }
.js .reveal.reveal--der       { transform:translateX(34px); }
.js .reveal.is-in.reveal--zoom,
.js .reveal.is-in.reveal--izq,
.js .reveal.is-in.reveal--der { transform:none; }

/* ---- tarjetas: elevación y brillo al pasar ---- */
.pcard > a{ position:relative; overflow:hidden; }
.pcard > a::after{
  content:''; position:absolute; top:0; left:-70%; width:45%; height:100%;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.55), transparent);
  transform:skewX(-18deg); pointer-events:none; opacity:0;
}
.pcard > a:hover::after{ animation:brillo .85s var(--ease); }
@keyframes brillo{
  0%  { left:-70%; opacity:0; }
  35% { opacity:1; }
  100%{ left:130%; opacity:0; }
}
.pcard__media img{ transition:transform .55s var(--ease); }
.pcard > a:hover .pcard__media img{ transform:scale(1.06); }

/* ---- cifras que cuentan hacia arriba ---- */
.contando{ font-variant-numeric:tabular-nums; }

/* ---- banda azul con arista diagonal ---- */
.section--blue{ position:relative; }

@media (prefers-reduced-motion: reduce){
  .js .hero__copy .display, .js .hero__copy .lede, .js .hero__copy .hero__cta,
  .js .hero__kicker, .js .phero__copy > *, .js .phero__media{
    animation:none; opacity:1; transform:none; filter:none;
  }
  .pcard > a:hover::after{ animation:none; }
}

/* ==========================================================================
   ARTÍCULO DEL BLOG
   ========================================================================== */
.chero--art{ padding-bottom:clamp(24px, 3vw, 34px); }
.art__meta{
  font-size:12.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--blue-deep); margin:14px 0 6px;
}
.art__portada{
  margin:0 0 clamp(28px, 4vw, 44px);
  border-radius:16px; overflow:hidden;
  box-shadow:0 14px 40px rgba(40,40,40,.14);
}
.art__portada img{ width:100%; height:auto; display:block; }

.art__cuerpo{
  font-size:clamp(16px, 1.5vw, 18px); line-height:1.75; color:var(--ink);
}
.art__cuerpo h2{
  font-size:clamp(22px, 2.4vw, 28px); font-weight:400; color:var(--navy);
  margin:clamp(30px, 4vw, 46px) 0 14px;
}
.art__cuerpo h3{
  font-size:clamp(18px, 1.8vw, 21px); font-weight:700; color:var(--navy);
  margin:28px 0 12px;
}
.art__cuerpo p{ margin:0 0 20px; }
.art__cuerpo ul, .art__cuerpo ol{ margin:0 0 20px; padding-left:28px; }
.art__cuerpo li{ margin-bottom:8px; }
.art__cuerpo blockquote{
  margin:28px 0; padding:4px 4px 4px 22px; border-left:4px solid var(--blue);
  color:var(--ink-66); font-style:italic; font-size:1.05em;
}
.art__cuerpo a{ color:var(--blue-deep); text-decoration:underline; text-underline-offset:2px; }
.art__cuerpo a:hover{ color:var(--blue); }
.art__cuerpo img{
  max-width:100%; height:auto; display:block; border-radius:12px;
  margin:clamp(22px, 3vw, 34px) 0;
  box-shadow:0 10px 30px rgba(40,40,40,.12);
}
.art__cuerpo code{
  background:var(--light); padding:2px 7px; border-radius:5px;
  font-size:.9em;
}
.art__cuerpo hr{ border:0; border-top:1px solid #dcdfe4; margin:32px 0; }

.art__volver{ margin-top:clamp(32px, 4vw, 48px); }
.art__volver a{
  font-weight:700; font-size:13px; letter-spacing:.04em; color:var(--blue-deep);
  transition:color .25s var(--ease);
}
.art__volver a:hover{ color:var(--blue); }

/* ==========================================================================
   PÁGINA RH·BOTS — cifras y equipo
   ========================================================================== */

/* ---------- cifras ---------- */
.cifras{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(140px, 1fr));
  gap:clamp(22px, 4vw, 40px);
  text-align:center;
}
.cifra{ padding:0 8px; }
.cifra__valor{
  font-weight:700; font-size:clamp(32px, 4.4vw, 52px); line-height:1;
  color:var(--navy);
}
.cifra__etiqueta{
  margin-top:10px; font-size:12.5px; font-weight:700; letter-spacing:.05em;
  text-transform:uppercase; color:var(--ink-66);
}
.cifra__etiqueta::before{
  content:''; display:block; width:26px; height:3px;
  background:var(--blue); margin:0 auto 10px;
}

/* ---------- conócenos: cómo trabajamos ---------- */
.proceso__head{
  display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1.1fr);
  gap:clamp(24px, 5vw, 90px); align-items:start;
  margin-bottom:clamp(36px, 4.4vw, 64px);
}
.proceso__titulo{
  margin-top:clamp(14px, 1.6vw, 22px); max-width:16ch;
  font-size:clamp(32px, 3.8vw, 58px); line-height:1.06; color:var(--ink);
}
.proceso__texto{
  padding-top:clamp(4px, 1vw, 16px);
  font-size:clamp(15px, 1.25vw, 18px); line-height:1.85; color:var(--ink-66);
}
.pasos{
  display:grid; grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:clamp(14px, 1.6vw, 24px);
  list-style:none; margin:0; padding:0;
}
.paso{
  position:relative; overflow:hidden;
  padding:clamp(24px, 2.4vw, 34px) clamp(22px, 2vw, 30px) clamp(30px, 3vw, 44px);
  border-radius:clamp(20px, 2.2vw, 30px); background:var(--light);
}
/* cuarto de círculo decorativo en la esquina */
.paso::after{
  content:''; position:absolute; top:0; right:0;
  width:clamp(60px, 5.4vw, 80px); aspect-ratio:1;
  border-bottom-left-radius:100%; background:rgba(0,158,227,.14);
}
.paso__num{
  font-family:var(--font-subtitulo); font-weight:700;
  font-size:15px; letter-spacing:.14em; color:var(--blue);
}
.paso__titulo{
  margin-top:clamp(28px, 3vw, 44px);
  font-size:clamp(20px, 1.7vw, 25px); line-height:1.2; color:var(--ink);
}
.paso__texto{
  margin-top:clamp(12px, 1.4vw, 18px);
  font-size:clamp(14px, 1.1vw, 16px); line-height:1.75; color:var(--ink-66);
}
@media (max-width:980px){
  .proceso__head{ grid-template-columns:1fr; }
  .pasos{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
@media (max-width:560px){ .pasos{ grid-template-columns:1fr; } }

/* ---------- historia: mismo tratamiento tipográfico que un artículo ---------- */
.historia__subtitulo{
  font-weight:400; font-size:clamp(22px, 2.6vw, 30px); color:var(--navy);
  margin-bottom:clamp(18px, 2.6vw, 28px);
}


/* ==========================================================================
   TIPOGRAFÍA — tres estilos para toda la web
   Va al final para imponerse a los pesos sueltos de cada componente.
   Jerarquía: un solo h1 por página, h2 por sección y h3 dentro de cada una.
   ========================================================================== */

/* 1 · TÍTULOS — h1 y h2. Terminan con un punto (lo añade tools/build.py). */
html body :is(h1, h2, p.h-section, .err404, .cifra__valor){
  font-family:var(--font-titulo);
  font-weight:700;
  letter-spacing:-.035em;
}

/* 2 · SUBTÍTULOS — h3 y todo lo que rotula: rótulos, botones, menú,
   etiquetas, pies de foto, frases destacadas. */
html body :is(h3, h4, .kicker, .phero__claim, .que__destacado,
  .pill, .nav a, .crumbs, .badge, .keyfacts span, .viewer__hint,
  .vid__item figcaption, .gal__item figcaption, .ph span, .nota__titulo,
  .pcard__more, .lcard__cat, .lcard__mas, .ncard__fecha, .ncard__mas, .form label,
  .persona__cargo, .art__meta, .art__volver a, .cifra__etiqueta, .slide-name){
  font-family:var(--font-subtitulo);
  font-weight:700;
}

/* 3 · TEXTO — lo hereda todo lo demás desde body (Exo). */

/* el punto va del color de la primera palabra del título (lo decide build.py) */
.punto{ color:inherit; }
.punto--acento{ color:var(--blue); }