/*! INKATRUCK — estilos base */
@font-face{font-family:'Archivo';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/archivo-400-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Archivo';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/archivo-400.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Archivo';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/archivo-600-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Archivo';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/archivo-600.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Archivo';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/archivo-700-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Archivo';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/archivo-700.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Archivo';font-style:normal;font-weight:800;font-display:swap;src:url('../fonts/archivo-800-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Archivo';font-style:normal;font-weight:800;font-display:swap;src:url('../fonts/archivo-800.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Archivo';font-style:normal;font-weight:900;font-display:swap;src:url('../fonts/archivo-900-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Archivo';font-style:normal;font-weight:900;font-display:swap;src:url('../fonts/archivo-900.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/inter-400-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/inter-400.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/inter-500-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/inter-500.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/inter-600-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/inter-600.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/inter-700-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/inter-700.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
:root {
    --red: #A6171C;
    --red-deep: #7A0F14;
    --red-bright: #D8262D;
    --ink: #0E0E10;
    --ink-2: #18181B;
    --ink-3: #232327;
    --line: #2A2A2F;
    --bone: #F4F1EC;
    --paper: #FAF8F4;
    --muted: #6B6B72;
    --safety-yellow: #F4C20D;
  }

  * { box-sizing: border-box; }
  html, body { margin: 0; padding: 0; }
  body {
    font-family: 'Inter', system-ui, sans-serif;
    background: var(--paper);
    color: var(--ink);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    line-height: 1.5;
  }
  img { max-width: 100%; display: block; }
  a { color: inherit; text-decoration: none; }
  button { font-family: inherit; cursor: pointer; }

  .display { font-family: 'Archivo', sans-serif; font-weight: 800; letter-spacing: -0.02em; line-height: 0.95; }
  .display-cond { font-family: 'Archivo', sans-serif; font-weight: 600; letter-spacing: -0.005em; line-height: 1.15; }
  .mono { font-family: 'JetBrains Mono', monospace; letter-spacing: 0.02em; }
  .eyebrow { font-family: 'JetBrains Mono', monospace; font-size: 11px; font-weight: 500; letter-spacing: 0.18em; text-transform: uppercase; color: var(--red); }
  .eyebrow-light { color: rgba(255,255,255,0.6); }

  /* Safety chevron pattern */
  .chevron-band {
    background-image: repeating-linear-gradient(
      135deg,
      var(--red) 0 22px,
      var(--red) 22px 22px,
      #fff 22px 44px
    );
    height: 14px;
  }
  .chevron-band-sm {
    background-image: repeating-linear-gradient(135deg, var(--red) 0 10px, #fff 10px 20px);
    height: 6px;
  }

  /* Grain overlay */
  .grain::before {
    content: "";
    position: absolute; inset: 0;
    background-image: radial-gradient(rgba(255,255,255,0.04) 1px, transparent 1px);
    background-size: 3px 3px;
    pointer-events: none;
    mix-blend-mode: overlay;
    opacity: 0.6;
  }

  /* Noise on dark */
  .noise {
    position: relative;
  }
  .noise::after {
    content: '';
    position: absolute; inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='0.9' numOctaves='2' /%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
    opacity: 0.06;
    pointer-events: none;
    mix-blend-mode: overlay;
  }

  .container { max-width: 1340px; margin: 0 auto; padding: 0 32px; }
  @media (max-width: 720px) { .container { padding: 0 20px; } }

  /* Buttons */
  .btn {
    display: inline-flex; align-items: center; gap: 10px;
    padding: 16px 22px;
    font-weight: 600;
    border: 1.5px solid transparent;
    border-radius: 0;
    transition: transform .15s ease, background .2s ease, color .2s ease;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-family: 'Archivo', sans-serif;
  }
  .btn-red { background: var(--red); color: #fff; }
  .btn-red:hover { background: var(--red-bright); }
  .btn-ghost { background: transparent; color: #fff; border-color: rgba(255,255,255,0.3); }
  .btn-ghost:hover { background: #fff; color: var(--ink); }
  .btn-dark { background: var(--ink); color: #fff; }
  .btn-dark:hover { background: var(--red); }
  .btn-light { background: #fff; color: var(--ink); border-color: var(--ink); }
  .btn-light:hover { background: var(--ink); color: #fff; }

  .btn .arrow { display: inline-block; transition: transform .2s ease; }
  .btn:hover .arrow { transform: translateX(3px); }

  /* Section spacing */
  section { padding: 96px 0; position: relative; }
  @media (max-width: 720px) { section { padding: 64px 0; } }

  .section-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    color: var(--muted);
    letter-spacing: 0.2em;
  }

  /* Reveal animation */
  .reveal { opacity: 0; transform: translateY(24px); transition: opacity .8s ease, transform .8s ease; }
  .reveal.in { opacity: 1; transform: none; }

  /* Marquee */
  @keyframes marquee {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
  }
  .marquee-track { animation: marquee 40s linear infinite; }

  /* Number counter */
  .counter { font-variant-numeric: tabular-nums; }

  /* Print */
  @media print { .no-print { display: none; } }

  /* Smooth scroll */
  html { scroll-behavior: smooth; }

  /* Scrollbar tweak */
  ::selection { background: var(--red); color: #fff; }

  /* ══ MÓVIL Y TABLETA ══ */
  /* Evita que un hijo ancho reviente su columna de grid/flex y recorte el contenido */

  @media (max-width: 900px) {
    /* Legibilidad: nada por debajo de 12px */
    .eyebrow { font-size: 12px !important; letter-spacing: .14em !important; }
    .section-num { font-size: 12px !important; }
    .mono { letter-spacing: .1em; }

    /* Objetivos táctiles cómodos */
    .btn { padding: 15px 20px; min-height: 48px; }
    a[aria-label], .socials a { min-width: 44px; min-height: 44px; }
  }

  @media (max-width: 760px) {
    section { padding: 56px 0; }
    .container { padding: 0 18px; }

    /* Titulares: menos interlínea negativa, más aire */
    h1.display, h1.display-9 { line-height: 1.02 !important; letter-spacing: -.02em !important; }
    h2.display { line-height: 1.06 !important; }

    /* HUD del radar: compacto para no tapar la escena */
    .trk-hud { padding: 8px 10px !important; }
    .trk-hud .display { font-size: 24px !important; }
    .trk-hud--bar { right: 14px !important; }

    /* El flotante de WhatsApp no debe pisar los botones del pie */
    .wa-float, a[aria-label="WhatsApp"] { bottom: 16px !important; right: 16px !important; }
  }

  @media (max-width: 900px) {
    /* Adorno de fondo: se sale del marco en pantallas chicas */
    .deco-peru { display: none !important; }
    /* Enlaces de listas: área de toque cómoda sin cambiar el diseño */
    footer ul a { display: inline-block; padding: 6px 0; }
  }

  @media (max-width: 480px) {
    section { padding: 46px 0; }
    .btn { width: 100%; justify-content: center; }
    .btn--inline { width: auto; }
  }

  /* Evita el zoom automático de iOS al enfocar un campo */
  @media (max-width: 900px) {
    input, select, textarea { font-size: 16px !important; }
  }


.wrap{width:100%;max-width:1340px;margin:0 auto;padding:0 32px}

/* ══ LAPTOP (1024–1500px) ══
   A 1366px el contenedor de 1340px + 64px de padding pedía 1404px: 38px de más,
   ~53px con la barra de desplazamiento. Se reduce el ancho y el padding por tramos. */
@media(max-width:1500px){
  .wrap{max-width:1200px;padding:0 28px}
}
@media(max-width:1400px){
  .wrap{max-width:1120px;padding:0 26px}
  .trk__in{gap:48px}
  .qs__in,.pg__g{gap:40px}
}
@media(max-width:1280px){
  .wrap{max-width:1040px;padding:0 24px}
  .pg__g{grid-template-columns:1fr 290px}
}
@media(max-width:1120px){
  .wrap{max-width:100%;padding:0 24px}
}
/* ══ SALVAGUARDA DE DESBORDAMIENTO HORIZONTAL ══
   QUÉ RESUELVE: red de seguridad contra desbordamiento lateral en móvil. La causa
   real (min-width:auto en los hijos del grid del hero) está corregida más abajo;
   esto solo evita que un futuro elemento ancho provoque scroll horizontal.

   EFECTO SECUNDARIO — IMPORTANTE: con 'overflow-x:hidden' el <html> se convierte
   en contenedor de desplazamiento y position:sticky se ancla a él en vez de al
   viewport, así que el header DEJA DE FIJARSE al hacer scroll (se notaba solo en
   móvil). Por eso aquí va 'clip', que recorta igual pero NO crea contenedor.

   ANTES DE TOCAR ESTO: si lo cambias a 'hidden', el header fijo se rompe.

   ══ QUÉ MEDICIONES INVALIDA ══ (leer antes de escribir cualquier comprobación)
   Con 'clip' u 'hidden' activo, document.scrollWidth queda RECORTADO al ancho
   del cliente. Toda medición sobre el DOCUMENTO da verde aunque haya elementos
   fuera del viewport:
     ✗ document.scrollWidth > innerWidth   → nunca se cumple
     ✗ document.body.scrollWidth           → idem
     ✓ el.getBoundingClientRect().right > clientWidth, elemento por elemento,
       con la salvaguarda desactivada durante la medición

   HISTORIAL: esta regla nos mordió dos veces. Como 'hidden' rompió el header
   sticky (el <html> pasaba a contenedor de scroll). Y ya como 'clip', dejó
   pasar a producción un desbordamiento en móvil porque la comprobación 9 medía
   sobre el documento. Un parche defensivo causando el problema que previene.
   REGLA GENERAL: toda salvaguarda que oculte un síntoma debe documentar qué
   mediciones deja ciegas. */
html{max-width:100%;overflow-x:clip}
body{max-width:100%;overflow-x:clip}
@supports not (overflow-x:clip){
  /* Navegadores sin soporte: el header pasa a fixed y se compensa con padding */
  html,body{overflow-x:hidden}
  .hd{position:fixed;left:0;right:0}
  body{padding-top:var(--hd-h,72px)}
}

/* ══ HEADER ══ */
.hd{position:sticky;top:0;z-index:80;background:var(--ink);border-bottom:1px solid var(--line)}
:root{--hd-h:72px}
html{scroll-padding-top:calc(var(--hd-h) + 12px)}
.hd__in{display:flex;align-items:center;justify-content:space-between;gap:20px;height:var(--hd-h)}
.bd{display:flex;align-items:center;gap:11px;color:#fff;text-decoration:none}
.bd:hover{color:#fff}
.bd img{width:38px;height:38px;object-fit:contain;flex-shrink:0}
.bd__n{display:block;font-family:'Archivo',sans-serif;font-weight:800;font-size:20px;letter-spacing:-.01em;line-height:1;white-space:nowrap}
.bd__s{display:block;font-family:'Archivo',sans-serif;font-weight:400;font-size:9px;letter-spacing:.13em;color:rgba(255,255,255,.55);margin-top:3px;text-transform:uppercase;white-space:nowrap}
.nv{display:flex;align-items:center;gap:2px}
.nv__i{position:relative}
.nv__l{display:inline-flex;align-items:center;gap:6px;padding:11px 12px;font-family:'Inter',sans-serif;font-size:13.5px;font-weight:500;white-space:nowrap;color:rgba(255,255,255,.82);background:none;border:none;cursor:pointer;text-decoration:none;transition:color .18s}
.nv__l:hover,.nv__i:hover>.nv__l,.nv__i.is-open>.nv__l{color:#fff;text-decoration:none}
.nv__l svg{opacity:.7;transition:transform .2s}
.nv__i:hover>.nv__l svg,.nv__i.is-open>.nv__l svg{transform:rotate(180deg)}
.nv__p{position:absolute;top:100%;left:0;min-width:270px;background:var(--ink-2);border:1px solid var(--line);border-top:2px solid var(--red-bright);padding:8px;margin:0;list-style:none;box-shadow:0 24px 60px rgba(0,0,0,.55);opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .18s .3s,transform .18s .3s,visibility .18s .3s;z-index:90}
.nv__i:hover>.nv__p,.nv__i:focus-within>.nv__p,.nv__i.is-open>.nv__p{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.nv__p li+li{margin-top:1px}
.nv__p a{display:block;padding:10px 12px;color:rgba(255,255,255,.88);font-family:'Archivo',sans-serif;font-weight:600;font-size:13.5px;white-space:nowrap;border-left:2px solid transparent;text-decoration:none}
.nv__p a:hover,.nv__p a[aria-current=page]{background:rgba(212,32,39,.14);border-left-color:var(--red-bright);color:#fff;text-decoration:none}
.btn--sm{padding:11px 15px;font-size:12.5px;margin-left:8px;white-space:nowrap}
@media(max-width:1180px){.nv__l{padding:11px 9px;font-size:13px}}
@media(max-width:1040px){.nv{display:none}}
@media(max-width:400px){.bd__s{display:none}}

/* ══ MENÚ MÓVIL (sin JS) ══ */
.mn{display:none}
.mn__b{list-style:none;width:46px;height:46px;border:1px solid rgba(255,255,255,.25);display:flex;align-items:center;justify-content:center;cursor:pointer}
.mn__b::-webkit-details-marker{display:none}
.mn__i{position:relative;display:block;width:18px;height:2px;background:#fff}
.mn__i::before,.mn__i::after{content:"";position:absolute;left:0;width:18px;height:2px;background:#fff;transition:transform .2s}
.mn__i::before{top:-6px}.mn__i::after{top:6px}
.mn[open]>.mn__b .mn__i{background:transparent}
.mn[open]>.mn__b .mn__i::before{transform:translateY(6px) rotate(45deg)}
.mn[open]>.mn__b .mn__i::after{transform:translateY(-6px) rotate(-45deg)}
.mn__p{position:absolute;left:0;right:0;top:72px;background:var(--ink);border-top:1px solid var(--line);border-bottom:4px solid var(--red);padding:6px 0 20px;max-height:calc(100vh - 72px);overflow-y:auto;z-index:95}
.mn__g{border-bottom:1px solid var(--ink-3)}
.mn__g>summary{width:100%;box-sizing:border-box;list-style:none;display:flex;justify-content:space-between;align-items:center;padding:15px 0;color:#fff;font-family:'Archivo',sans-serif;font-weight:600;font-size:16.5px;cursor:pointer}
.mn__g>summary::-webkit-details-marker{display:none}
.mn__g>summary i{font-style:normal;color:var(--red-bright);font-size:20px;transition:transform .2s}
.mn__g[open]>summary i{transform:rotate(45deg)}
.mn__s{padding-bottom:10px}
.mn__s a{display:block;padding:11px 0 11px 14px;color:rgba(255,255,255,.72);font-size:14.5px;border-left:2px solid var(--red);text-decoration:none}
.mn__f{display:block;padding:15px 0;color:#fff;font-family:'Archivo',sans-serif;font-weight:600;font-size:16.5px;border-bottom:1px solid var(--ink-3);text-decoration:none}
.mn__cta{display:block;background:var(--red);color:#fff;text-align:center;margin-top:18px;padding:15px;text-transform:uppercase;letter-spacing:.05em;font-family:'Archivo',sans-serif;font-weight:700;font-size:14px;text-decoration:none}
@media(max-width:1040px){.mn{display:block}}
@media(min-width:1041px){.mn{display:none!important}}

/* ══ FOOTER ══ */
.ft{background:#08080A;color:#fff;border-top:4px solid var(--red);padding:52px 0 26px}
.ft__g{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:36px}
@media(max-width:900px){.ft__g{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.ft__g{grid-template-columns:1fr}}
.ft p{font-size:13.5px;line-height:1.65;color:rgba(255,255,255,.55);margin-top:16px;max-width:340px}
.ft p b{color:#fff}
.ft h2{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9.5px;letter-spacing:.2em;color:var(--red-bright);text-transform:uppercase;font-weight:500;margin:0 0 14px}
.ft ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}
.ft ul a{font-size:13.5px;color:rgba(255,255,255,.62);text-decoration:none;padding:3px 0;display:inline-block}
.ft ul a:hover{color:#fff}
.ft__b{margin-top:44px;padding-top:20px;border-top:1px solid rgba(255,255,255,.08);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:center}
.ft__b .mono{font-size:10.5px;color:rgba(255,255,255,.4);letter-spacing:.12em;margin:0}
.ft__l{display:flex;gap:18px;flex-wrap:wrap}
.ft__l a{font-size:12px;color:rgba(255,255,255,.5);text-decoration:none}
.wa{position:fixed;bottom:20px;right:20px;z-index:30;width:56px;height:56px;border-radius:50%;background:#25D366;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 30px rgba(37,211,102,.45);transition:transform .2s}
.wa:hover{transform:scale(1.07);color:#fff}

/* ══ APARICIÓN ══
   El CSS NO oculta nada por sí solo: parte de opacity 1. Es el JS el que añade
   .rv-armed al inicializar el observer, así que si el script no carga o el
   observer no dispara, el contenido queda visible. */
[data-rv]{opacity:1}
[data-rv].rv-armed{opacity:0;transform:translateY(22px)}
[data-rv].rv-armed.in{opacity:1;transform:none;transition:opacity .7s ease,transform .7s ease}
@media(prefers-reduced-motion:reduce){
  [data-rv].rv-armed{opacity:1;transform:none;transition:none}
}

/* ══ FORMULARIO ══ */
.qs{background:var(--ink-2);color:#fff;padding:64px 0;border-top:1px solid var(--line)}
.qs__in{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
@media(max-width:900px){.qs__in{grid-template-columns:1fr;gap:32px}.qs{padding:48px 0}}
.qs h2{font-family:'Archivo',sans-serif;font-weight:800;font-size:clamp(25px,2.1vw,34px);letter-spacing:-.025em;line-height:1.1;margin:14px 0 0}
.qs__l>p{font-size:16px;line-height:1.65;color:rgba(255,255,255,.75);margin-top:16px;max-width:460px}
.qs__ck{list-style:none;padding:0;margin:22px 0 0}
.qs__ck li{position:relative;padding:9px 0 9px 26px;font-size:14.5px;color:rgba(255,255,255,.8);border-bottom:1px solid rgba(255,255,255,.08)}
.qs__ck li::before{content:"";position:absolute;left:2px;top:17px;width:9px;height:5px;border-left:2px solid var(--red-bright);border-bottom:2px solid var(--red-bright);transform:rotate(-45deg)}
.qf{background:var(--ink);padding:28px 26px;display:flex;flex-direction:column;gap:14px;border:1px solid var(--line)}
.fl label,.fl .lb{display:block;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9.5px;letter-spacing:.17em;text-transform:uppercase;color:rgba(255,255,255,.66);margin-bottom:6px}

.fl2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:520px){.fl2{grid-template-columns:1fr}}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chips input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.chips label{display:inline-block;padding:12px 15px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.2);font-family:'Inter',sans-serif;font-size:13px;font-weight:500;letter-spacing:0;text-transform:none;color:rgba(255,255,255,.78);cursor:pointer;margin:0}
.chips input:checked+label{background:var(--red);border-color:var(--red);color:#fff}
.chips input:focus-visible+label{outline:2px solid var(--red-bright);outline-offset:2px}
.qf__ok{background:rgba(37,211,102,.14);border:1px solid rgba(37,211,102,.4);color:#86EFAC;padding:12px 14px;font-size:13.5px;margin:0}
.qf__alt{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;letter-spacing:.12em;color:rgba(255,255,255,.45);text-align:center;text-transform:uppercase;margin:0}
.qf__alt a{color:rgba(255,255,255,.75)}

/* ══ PROSA de páginas de categoría ══ */
.pg{padding:64px 0 72px}
.pg__g{display:grid;grid-template-columns:1fr 320px;gap:48px;align-items:start}
@media(max-width:980px){.pg__g{grid-template-columns:1fr;gap:36px}}
.art{max-width:800px;font-size:16.5px;line-height:1.75;color:#25252B}
.art>*+*{margin-top:18px}
.art h2{font-family:'Archivo',sans-serif;font-weight:800;font-size:clamp(24px,2vw,33px);letter-spacing:-.025em;line-height:1.15;color:var(--ink);margin-top:46px;padding-left:16px;border-left:4px solid var(--red)}
.art h3{font-family:'Archivo',sans-serif;font-weight:700;font-size:19.5px;letter-spacing:-.015em;color:var(--ink);margin-top:30px}
.art h2+*{margin-top:16px}
.art strong{font-weight:600;color:var(--ink)}
.art ul{list-style:none;padding:0}
.art ul li{position:relative;padding:6px 0 6px 22px}
.art ul li::before{content:"";position:absolute;left:0;top:17px;width:9px;height:1px;background:var(--red)}
.cal{background:var(--ink);color:#fff;padding:26px 28px;margin:30px 0}
.cal .ey{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--red-bright);display:block;margin-bottom:10px}
.cal__t{font-family:'Archivo',sans-serif;font-weight:700;font-size:20px;letter-spacing:-.015em;line-height:1.3;color:#fff;margin:0}
.cal__d{font-size:15px;line-height:1.65;color:rgba(255,255,255,.75);margin-top:10px}
.cds{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:26px}
@media(max-width:620px){.cds{grid-template-columns:1fr}}
.cd{background:#fff;border:1px solid #E2DCD0;padding:24px 22px}
.cd:hover{border-color:var(--red)}
.cd__n{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;letter-spacing:.22em;color:var(--red);display:block}
.cd__t{font-family:'Archivo',sans-serif;font-weight:700;font-size:18px;letter-spacing:-.015em;line-height:1.25;margin-top:12px;display:block;color:var(--ink)}
.cd p{font-size:14px;line-height:1.6;color:var(--muted);margin-top:9px}
.stp{counter-reset:s;list-style:none;padding:0;margin-top:24px}
.stp li{position:relative;counter-increment:s;padding:16px 0 16px 56px;border-bottom:1px solid #E2DCD0}
.stp li::before{content:"0" counter(s);position:absolute;left:0;top:16px;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;font-weight:600;color:#fff;background:var(--red);width:36px;height:30px;display:flex;align-items:center;justify-content:center}
.stp b{display:block;font-family:'Archivo',sans-serif;font-weight:700;font-size:16.5px;color:var(--ink)}
.stp span{display:block;font-size:14.5px;color:var(--muted);margin-top:4px}
.fq{margin-top:26px;border-top:1px solid #E2DCD0}
.fq details{border-bottom:1px solid #E2DCD0}
.fq summary{padding:20px 44px 20px 0;font-family:'Archivo',sans-serif;font-weight:600;font-size:17px;letter-spacing:-.01em;line-height:1.35;cursor:pointer;list-style:none;position:relative;color:var(--ink)}
.fq summary::-webkit-details-marker{display:none}
.fq summary::after{content:"+";position:absolute;right:6px;top:16px;font-size:25px;font-weight:400;color:var(--red)}
.fq details[open] summary::after{content:"–"}
.fq__a{padding:0 44px 22px 0;font-size:15.5px;line-height:1.7;color:var(--muted)}
.fq__a p+p{margin-top:12px}
.asd{position:sticky;top:96px;display:flex;flex-direction:column;gap:14px}
@media(max-width:980px){.asd{position:static}}
.bx{border:1px solid #E2DCD0;background:#fff;padding:22px 20px}
.bx--red{background:var(--red);border-color:var(--red);color:#fff}
.bx--red .bx__t,.bx--red p{color:#fff}
.bx__t{font-family:'Archivo',sans-serif;font-weight:700;font-size:17px;letter-spacing:-.015em;line-height:1.3;color:var(--ink);margin:0}
.bx p{font-size:14px;line-height:1.6;color:var(--muted);margin-top:9px}
.bx .ey{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--red);display:block;margin-bottom:9px}
.bx--red .ey{color:rgba(255,255,255,.85)}
.bx .btn{margin-top:16px;width:100%;justify-content:center}
.bx__ls{list-style:none;padding:0;margin-top:12px}
.bx__ls li+li{margin-top:1px}
.bx__ls a{display:block;padding:10px 12px;background:var(--paper);border-left:2px solid var(--red);font-family:'Archivo',sans-serif;font-weight:600;font-size:14px;color:var(--ink);text-decoration:none}
.bx__ls a:hover{background:var(--bone);color:var(--red)}
.chk{list-style:none;padding:0;margin-top:12px}
.chk li{position:relative;padding:8px 0 8px 26px;font-size:14px;color:#25252B;border-bottom:1px dashed #E2DCD0}
.chk li:last-child{border-bottom:none}
.chk li::before{content:"";position:absolute;left:2px;top:15px;width:9px;height:5px;border-left:2px solid var(--red);border-bottom:2px solid var(--red);transform:rotate(-45deg)}
.phe{padding:0}
.phe{background:var(--ink);color:#fff;position:relative;overflow:hidden;border-bottom:6px solid var(--red)}
.phe::before{content:"";position:absolute;top:0;right:0;width:46%;height:100%;background:linear-gradient(135deg,var(--red) 0%,var(--red-deep) 100%);clip-path:polygon(24% 0,100% 0,100% 100%,0 100%)}
.phe__in{position:relative;z-index:2;padding:52px 0 60px;max-width:800px}
.crb{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;letter-spacing:.1em;color:rgba(255,255,255,.5);text-transform:uppercase;margin:0 0 18px}
.crb a{color:rgba(255,255,255,.72);text-decoration:none}
.crb span{color:var(--red-bright)}
.phe h1{font-family:'Archivo',sans-serif;font-weight:900;font-size:clamp(32px,3.6vw,58px);letter-spacing:-.03em;line-height:1.03;margin:14px 0 0}
.phe__p{font-size:clamp(15.5px,1.1vw,18px);line-height:1.65;color:rgba(255,255,255,.8);margin-top:20px;max-width:660px}
.phe__p b{color:#fff;font-weight:600}
.phe__c{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.ctb{background:var(--ink);color:#fff;padding:64px 0}
.ctb__in{display:grid;grid-template-columns:1.4fr 1fr;gap:40px;align-items:center}
@media(max-width:860px){.ctb__in{grid-template-columns:1fr;gap:26px}}
.ctb h2{font-family:'Archivo',sans-serif;font-weight:900;font-size:clamp(26px,2.5vw,40px);letter-spacing:-.03em;line-height:1.05;margin:14px 0 0}
.ctb p{font-size:16px;color:rgba(255,255,255,.8);margin-top:14px;max-width:520px}
.ctb__a{display:flex;flex-direction:column;gap:11px}
.ey{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--red);margin:0}
.ey--l{color:#fff}

/* ══ SEGUIMIENTO GPS ══ */
.trk{background:var(--ink);color:#fff;padding:96px 0;border-top:1px solid var(--line)}
.trk__in{display:grid;grid-template-columns:1.05fr 1fr;gap:64px;align-items:center}
@media(max-width:960px){.trk__in{grid-template-columns:1fr;gap:40px}.trk{padding:64px 0}}
.trk h2{font-family:'Archivo',sans-serif;font-weight:800;font-size:clamp(34px,4vw,64px);letter-spacing:-.028em;line-height:1;margin:14px 0 0}
.trk__rule{width:120px;height:3px;background:var(--red-bright);margin:24px 0}
.trk__p{font-size:18px;line-height:1.6;color:rgba(255,255,255,.78);max-width:520px;margin:0}
.trk__ck{list-style:none;padding:0;margin:32px 0 0;display:flex;flex-direction:column;gap:10px}
.trk__ck li{padding:14px 18px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-left:3px solid var(--red-bright)}
.trk__ck b{display:block;font-family:'Archivo',sans-serif;font-weight:600;font-size:16px;color:#fff}
.trk__ck span{display:block;font-size:12.5px;color:rgba(255,255,255,.6);margin-top:2px;line-height:1.45}
.trk__viz{position:relative;aspect-ratio:1/1;max-width:560px;margin:0 auto;width:100%}
.trk__viz svg{width:100%;height:100%;display:block}
.gps-sweep{transform-origin:200px 200px;animation:gpsSweep 3.4s linear infinite}
@keyframes gpsSweep{to{transform:rotate(360deg)}}
.gps-ping{animation:gpsPing 2.2s ease-out infinite}
@keyframes gpsPing{0%{r:10;opacity:.85}100%{r:26;opacity:0}}
.trk__hud{position:absolute;background:rgba(0,0,0,.62);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.14);padding:11px 14px}
.trk__hud--tl{top:14px;left:14px;min-width:168px}
.trk__hud--br{bottom:14px;right:14px;text-align:right;min-width:132px}
.trk__hud--bl{bottom:14px;left:14px;right:164px}
.trk__hud p{margin:0}
.trk__live{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9px;letter-spacing:.2em;color:var(--red-bright);text-transform:uppercase}
.trk__co{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;color:#fff;margin-top:7px!important;font-variant-numeric:tabular-nums}
.trk__k{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9px;letter-spacing:.16em;color:rgba(255,255,255,.55);text-transform:uppercase}
.trk__v{font-family:'Archivo',sans-serif;font-weight:800;font-size:32px;color:#fff;line-height:1;margin-top:5px!important;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.trk__v i{font-style:normal;font-size:13px;font-weight:400;color:rgba(255,255,255,.5)}
.trk__bar{height:4px;background:rgba(255,255,255,.12);margin-top:8px;overflow:hidden}
.trk__bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--red),var(--red-bright))}
@media(prefers-reduced-motion:reduce){.gps-sweep,.gps-ping{animation:none}}
@media(max-width:760px){.trk__hud--bl{right:14px;bottom:64px}.trk__v{font-size:24px}}

/* ══ BOTONES (modificadores del header/footer generado) ══ */
.btn--red{background:var(--red);color:#fff;border-color:var(--red)}
.btn--red:hover{background:var(--red-bright);color:#fff;border-color:var(--red-bright)}
.btn--ink{background:var(--ink);color:#fff;border-color:var(--ink)}
.btn--ink:hover{background:var(--red);color:#fff;border-color:var(--red)}
.btn--ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
.btn--ghost:hover{background:#fff;color:var(--ink);border-color:#fff}
.btn--outline{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn--outline:hover{background:var(--ink);color:#fff}
.arw{display:inline-block;transition:transform .2s}
.btn:hover .arw{transform:translateX(4px)}


/* ══ FORMULARIO DEL LIBRO DE RECLAMACIONES ══ */
.lgl fieldset{
    border: 1px solid #E8E2D8;
    padding: 24px;
    margin: 0 0 22px;
  }
  .lgl legend{
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 600;
    color: var(--red);
    letter-spacing: 0.18em;
    padding: 0 10px;
    text-transform: uppercase;
  }
  .field-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }
  .field-grid.three { grid-template-columns: repeat(3, 1fr); }
  .field { display: flex; flex-direction: column; }
  .field.full { grid-column: 1 / -1; }
  .lgl label,fieldset label{
    font-size: 11px; font-weight: 600;
    color: var(--ink);
    text-transform: uppercase; letter-spacing: 0.12em;
    margin-bottom: 6px;
    font-family: 'JetBrains Mono', monospace;
  }
  .lgl label .req,fieldset label .req{ color: var(--red); }
  
  /* Radio groups */
  .radio-group { display: flex; gap: 10px; flex-wrap: wrap; }
  .radio-group label {
    display: flex; align-items: center; gap: 8px;
    background: var(--paper);
    border: 1px solid #D9D3C5;
    padding: 12px 16px;
    cursor: pointer;
    font-family: 'Inter', sans-serif;
    font-size: 13px; font-weight: 500;
    color: var(--ink);
    letter-spacing: 0;
    text-transform: none;
    margin-bottom: 0;
    transition: all .15s ease;
  }
  .radio-group label:hover { border-color: var(--red); }
  .radio-group input[type=radio]:checked + span,
  .radio-group label:has(input:checked) {
    background: var(--ink);
    color: #fff;
    border-color: var(--ink);
  }
  .radio-group input[type=radio] { accent-color: var(--red); }

  /* Submit row */
  .submit-row {
    display: flex; gap: 14px; justify-content: space-between; align-items: center;
    flex-wrap: wrap; margin-top: 20px; padding-top: 24px; border-top: 1px solid #E8E2D8;
  }
  .lgl button[type=submit]{
    background: var(--red); color: #fff;
    padding: 16px 28px;
    border: none; cursor: pointer;
    font-family: 'Archivo', sans-serif; font-weight: 700; font-size: 14px;
    letter-spacing: 0.04em; text-transform: uppercase;
    display: inline-flex; align-items: center; gap: 10px;
    transition: background .2s ease;
  }
  .lgl button[type=submit]:hover{ background: var(--red-bright); }
  .back-link {
    font-family: 'JetBrains Mono', monospace; font-size: 12px;
    color: var(--muted); text-decoration: none; letter-spacing: 0.1em;
  }
  .back-link:hover { color: var(--red); }

  /* Notice */
  .notice {
    background: #FFF4E5;
    border: 1px solid #F2C780;
    padding: 16px 20px;
    margin: 24px 0;
    font-size: 13px;
    color: #6B4500;
    line-height: 1.55;
  }
  .notice b { color: #4A2E00; }

  /* Footer */
  footer.bottom {
    background: var(--ink); color: #fff;
    padding: 30px 0;
    margin-top: 60px;
    text-align: center;
  }
  footer.bottom .mono {
    font-size: 11px; color: rgba(255,255,255,0.5); letter-spacing: 0.16em;
  }

  /* Success state */
  .success {
    background: #E8FDF0;
    border: 2px solid #22C55E;
    padding: 32px;
    text-align: center;
    color: #14532D;
  }
  .success h2 { color: #14532D; font-family: 'Archivo'; font-size: 32px; margin: 0 0 12px; }

  @media (max-width: 700px) {
    .field-grid, .field-grid.three { grid-template-columns: 1fr; }
  }

/* ══ PÁGINAS LEGALES ══ */
.lgl-wrap{padding-bottom:72px}
.lgl{background:#fff;border:1px solid var(--line);padding:40px 38px;margin-top:-40px;position:relative;z-index:2;box-shadow:0 20px 60px rgba(0,0,0,.08)}
@media(max-width:760px){.lgl{padding:26px 22px;margin-top:-28px}}
.lgl-meta{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;padding-bottom:24px;margin-bottom:32px;border-bottom:2px solid var(--ink)}
@media(max-width:700px){.lgl-meta{grid-template-columns:1fr;gap:14px}}
.lgl-meta--2{grid-template-columns:1.4fr 1fr}
.lgl-meta__i{min-width:0}
.lgl-meta__i .lgl-meta__k{margin-bottom:8px}

.lgl-meta__k{display:block;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.lgl-meta__v{display:block;font-family:'Archivo',sans-serif;font-weight:700;font-size:14.5px;color:var(--ink);margin-top:6px;line-height:1.35}
.lgl-dl{list-style:none;padding:0;margin:16px 0 0}
.lgl-dl li{padding:11px 0;border-bottom:1px dashed var(--line);font-size:14.5px;color:#25252B}
.lgl-dl li:last-child{border-bottom:none}
.lgl-dl b{color:var(--ink);font-weight:600}
.lgl-cta{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:44px;padding-top:28px;border-top:1px solid var(--line)}

.art .lgl-dl li::before,.lgl-dl li::before{display:none!important}

/* ── Validación visible ── */
.req{color:var(--red-bright)}
.fl__e{font-size:12.5px;color:#FF8A8F;margin:6px 0 0;font-family:'Inter',sans-serif;letter-spacing:0;text-transform:none}
.chips label:focus-within,.chips input:focus-visible+label{outline:2px solid var(--red-bright);outline-offset:2px}
.qf__err{background:rgba(255,90,97,.12);border:1px solid rgba(255,90,97,.4);color:#FF9A9E;padding:12px 14px;font-size:13.5px;margin:0}
.qf button[type=submit][disabled]{opacity:.6;cursor:wait}

.deco-peru{max-width:100%}
@media(max-width:1500px){.deco-peru{display:none}}

/* El flotante no debe cubrir el botón de envío */
@media(max-width:760px){
  .wa{bottom:16px;right:16px;width:52px;height:52px}
  .qf button[type=submit]{margin-bottom:64px}
  .ctb__a{padding-bottom:56px}
}
/* --wa-safe */

/* Etiquetas largas dentro de tarjetas estrechas */
.mat-grid .mono,.cd__t,.card__t,.nv__p a,.mn__s a{overflow-wrap:anywhere;hyphens:auto}

/* Botones del hero: a 360–390px deben caber en la columna, no proyectarse */
@media(max-width:420px){
  .hero__cta,.phe__c{flex-direction:column;align-items:stretch}
  .hero__cta .btn,.phe__c .btn{width:100%;justify-content:center;white-space:normal}
}

@media(max-width:420px){
  .btn-red,.btn-ghost,.btn-wa{width:100%;justify-content:center;white-space:normal;box-sizing:border-box}
  #top div[style*="flex-wrap"]{flex-direction:column;align-items:stretch}
}

/* Los hijos del grid del hero heredan min-width:auto y se expanden por encima
   del track. Confinarlos es lo que impide que el botón se proyecte fuera. */
.hero-grid,.hero-grid > *,.hero-grid > * > *{min-width:0}
@media(max-width:420px){
  .btn-red,.btn-ghost{width:100%;justify-content:center;white-space:normal;box-sizing:border-box}
  #top div[style*="flex-wrap"]{flex-direction:column;align-items:stretch}
}
/* --hero-cta-fix */

/* ══ HEADER FIJO EN MÓVIL ══
   El alto se declara en --hd-h y scroll-padding-top lo consume, así que ningún
   anclaje queda oculto tras el header en ningún punto de quiebre. */
@media(max-width:1040px){
  :root{--hd-h:64px}
}
@media(max-width:430px){
  :root{--hd-h:60px}
  .bd img{width:32px;height:32px}
  .bd__n{font-size:18px}
}
/* Pantallas bajas: el header cede altura para no comerse el viewport */
@media(max-height:850px) and (max-width:1040px){
  :root{--hd-h:56px}
}
@media(max-height:700px) and (max-width:1040px){
  :root{--hd-h:52px}
  .bd__s{display:none}
}
/* El acordeón abierto arranca bajo el header y se desplaza si no cabe */
.mn__p{top:var(--hd-h);max-height:calc(100dvh - var(--hd-h));overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
@supports not (height:100dvh){
  .mn__p{max-height:calc(100vh - var(--hd-h))}
}

/* ══ BLOG ══ */
.psts{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:940px){.psts{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.psts{grid-template-columns:1fr}}
.pst{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);padding:26px 24px;color:var(--ink);text-decoration:none;transition:border-color .2s,transform .2s,box-shadow .2s}
.pst:hover{border-color:var(--red);transform:translateY(-3px);box-shadow:0 14px 30px rgba(0,0,0,.07);color:var(--ink);text-decoration:none}
.pst__k{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9.5px;letter-spacing:.18em;color:var(--red);text-transform:uppercase}
.pst__t{font-family:'Archivo',sans-serif;font-weight:700;font-size:19px;letter-spacing:-.02em;line-height:1.25;margin-top:14px}
.pst__d{font-size:13.5px;line-height:1.6;color:var(--muted);margin-top:10px;flex:1}
.pst__m{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9.5px;letter-spacing:.13em;color:var(--red);margin-top:18px;text-transform:uppercase}
.pg__nota{margin-top:32px;padding:18px 22px;background:var(--bone);border-left:3px solid var(--red);font-size:14.5px;color:var(--ink)}
.art__meta{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;letter-spacing:.12em;color:rgba(255,255,255,.55);text-transform:uppercase;margin-top:20px}
/* Rutas: tarjetas de la madre a las hijas */
.rts{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:28px}
@media(max-width:700px){.rts{grid-template-columns:1fr}}
.rt{display:block;padding:22px 24px;background:#fff;border:1px solid var(--line);border-left:3px solid var(--red);color:var(--ink);text-decoration:none;transition:transform .2s,box-shadow .2s}
.rt:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(0,0,0,.08);color:var(--ink);text-decoration:none}
.rt__k{display:block;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9.5px;letter-spacing:.17em;color:var(--muted);text-transform:uppercase}
.rt__n{display:block;font-family:'Archivo',sans-serif;font-weight:800;font-size:22px;letter-spacing:-.02em;margin-top:7px}
.rt__d{display:block;font-size:13px;color:var(--muted);margin-top:6px}
.rt__a{display:block;font-family:'Archivo',sans-serif;font-weight:700;font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--red);margin-top:14px}
.tbl{width:100%;border-collapse:collapse;margin-top:24px;font-size:14.5px;background:#fff;border:1px solid var(--line)}
.tbl th,.tbl td{text-align:left;padding:13px 16px;border-bottom:1px solid var(--line)}
.tbl tr:last-child th,.tbl tr:last-child td{border-bottom:none}
.tbl th{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;letter-spacing:.13em;color:var(--muted);text-transform:uppercase;font-weight:500}
.tbl td{font-weight:500}

/* ══ VÍDEO INSTITUCIONAL (fachada, sin iframe hasta el clic) ══ */
.vid{background:var(--bone);padding:80px 0}
.vid__in{display:grid;grid-template-columns:1fr minmax(280px,380px);gap:56px;align-items:center}
@media(max-width:900px){.vid__in{grid-template-columns:1fr;gap:32px}.vid{padding:56px 0}}
.vid__txt h2{font-family:'Archivo',sans-serif;font-weight:800;font-size:clamp(26px,2.4vw,36px);letter-spacing:-.025em;line-height:1.1;margin:14px 0 0}
.vid__p{font-size:16.5px;line-height:1.7;color:#25252B;margin-top:16px;max-width:460px}
.vid__nota{font-size:13.5px;color:var(--muted);margin-top:14px;padding-left:14px;border-left:2px solid var(--red)}
/* Reserva 9:16 con aspect-ratio: sin salto de diseño al cargar */
.vid__box{width:100%}
/* El techo se aplica al ANCHO, no a la altura: con max-height, un ancho fijo de
   columna anula el aspect-ratio y la caja se vuelve cuadrada (franjas negras en
   el iframe vertical). Topando el ancho, la proporción 9:16 sobrevive siempre. */
.vid__fac{display:block;position:relative;width:min(100%,calc(70dvh * 9 / 16));aspect-ratio:9/16;margin-inline:auto;padding:0;border:1px solid var(--line);background:var(--ink);cursor:pointer;overflow:hidden}
.vid__fac img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease,opacity .3s ease}
.vid__fac:hover img{transform:scale(1.03);opacity:.9}
.vid__play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:76px;height:76px;border-radius:50%;background:var(--red);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 30px rgba(0,0,0,.4);transition:transform .25s ease,background .2s ease}
.vid__fac:hover .vid__play{transform:translate(-50%,-50%) scale(1.08);background:var(--red-bright)}
.vid__fac:focus-visible{outline:3px solid var(--red-bright);outline-offset:3px}
.vid__dur{position:absolute;bottom:12px;right:12px;background:rgba(0,0,0,.72);color:#fff;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;padding:4px 8px;letter-spacing:.06em}
.vid__box iframe{width:min(100%,calc(70dvh * 9 / 16));aspect-ratio:9/16;margin-inline:auto;border:0;display:block}
.vid__alt{font-size:12.5px;color:var(--muted);margin-top:10px;text-align:center}

/* ══ PANEL DE REDES ══ */
.soc{background:var(--ink);color:#fff;padding:64px 0}
.soc__in{display:grid;grid-template-columns:1.2fr 1fr;gap:48px;align-items:center}
@media(max-width:860px){.soc__in{grid-template-columns:1fr;gap:28px}.soc{padding:48px 0}}
.soc h2{font-family:'Archivo',sans-serif;font-weight:800;font-size:clamp(24px,2.6vw,34px);letter-spacing:-.025em;line-height:1.1;margin:14px 0 0}
.soc__p{font-size:16px;line-height:1.65;color:rgba(255,255,255,.78);margin-top:14px;max-width:480px}
.soc__lnk{display:flex;flex-direction:column;gap:11px}
.soc__a{display:flex;align-items:center;gap:15px;padding:17px 20px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-left:3px solid var(--red-bright);color:#fff;text-decoration:none;transition:background .2s ease}
.soc__a:hover{background:rgba(212,32,39,.14);color:#fff;text-decoration:none}
.soc__a:focus-visible{outline:2px solid var(--red-bright);outline-offset:2px}
.soc__a svg{flex-shrink:0;color:var(--red-bright)}
.soc__a b{display:block;font-family:'Archivo',sans-serif;font-weight:600;font-size:16px}
.soc__a span span{display:block;font-size:12.5px;color:rgba(255,255,255,.6);margin-top:2px}

/* ══ PANTALLA DE CARGA ══
   QUÉ RESUELVE: identidad de marca en la primera visita de la sesión.
   GARANTÍA: el CSS no oculta NADA por sí solo. La capa .spl la inyecta site.js;
   si el JS no corre, no existe y la página se ve normal. No hay ninguna regla
   que ponga opacity:0 ni display:none sobre el contenido de la página.
   ANTES DE TOCAR ESTO: nunca añadas reglas que oculten <main>, <header> ni body. */
.spl{position:fixed;inset:0;z-index:9999;background:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;opacity:1;transition:opacity .42s ease}
.spl--out{opacity:0}
.spl img{width:clamp(84px,13vw,132px);height:auto;display:block}
.spl__t{font-family:'Archivo',sans-serif;font-weight:600;font-style:italic;font-size:clamp(15px,2.2vw,21px);color:#fff;letter-spacing:-.01em;text-align:center;padding:0 24px;margin:0}
.spl__t b{color:var(--red-bright);font-weight:800;font-style:normal}
.spl__bar{width:min(180px,42vw);height:3px;background:rgba(255,255,255,.14);overflow:hidden}
.spl__bar i{display:block;height:100%;width:0;background:var(--red-bright);animation:splBar .9s cubic-bezier(.4,0,.2,1) forwards}
@keyframes splBar{to{width:100%}}
@media(prefers-reduced-motion:reduce){.spl{display:none}}

/* El acordeón móvil vive en un <details> cerrado: sus hijos deben quedar
   contenidos aunque el panel no tenga ancho resuelto. Sin esto, el icono "+"
   del summary se proyecta fuera del viewport (medido: x=451 sobre 375px). */
.mn__g>summary{width:100%;box-sizing:border-box}
.mn__p,.mn__p *{max-width:100%;box-sizing:border-box}

/* Respaldo para navegadores sin dvh: vh mide el viewport grande (barra de
   direcciones oculta), así que sobredimensiona mientras la barra está visible. */
@supports not (height:1dvh){
  .vid__fac,.vid__box iframe{width:min(100%,calc(62vh * 9 / 16))}
}

/* La insignia "Ver perfil" del equipo es un enlace real, no un adorno.
   Área táctil completa y foco visible. */
.tm__li{display:block;text-decoration:none}
.tm__li:hover{text-decoration:none}
.tm__li:focus-visible{outline:3px solid var(--red-bright);outline-offset:3px}

/* ══ MODAL DE TRAYECTORIA ══
   <dialog> nativo: el navegador gestiona foco, Escape y fondo inerte.
   Cerrado por defecto sin CSS, así que sin JS no tapa nada (comprobación 12). */
.dlg{border:0;padding:0;max-width:min(560px,92vw);width:100%;background:transparent}
.dlg::backdrop{background:rgba(14,14,16,.72)}
.dlg__box{background:#fff;border-top:4px solid var(--red);padding:34px 32px;position:relative;max-height:86vh;overflow-y:auto}
.dlg__x{position:absolute;top:12px;right:14px;width:44px;height:44px;border:0;background:none;font-size:30px;line-height:1;color:var(--muted);cursor:pointer}
.dlg__x:hover{color:var(--red)}
.dlg__x:focus-visible{outline:3px solid var(--red-bright);outline-offset:2px}
.dlg__t{font-family:'Archivo',sans-serif;font-weight:800;font-size:clamp(21px,3vw,27px);letter-spacing:-.02em;line-height:1.15;margin:10px 0 0;color:var(--ink)}
.dlg__d{font-size:15px;line-height:1.65;color:var(--muted);margin-top:14px}
.dlg__k{margin-top:24px}
.dlg .chk{margin-top:12px}
.dlg .btn{margin-top:24px;width:100%;justify-content:center}
.tm__more{color:var(--red);font-family:'Archivo',sans-serif;font-weight:700}
.tm__more:hover{color:var(--red-bright)}
.tm__more:focus-visible{outline:3px solid var(--red-bright);outline-offset:2px}
@media(prefers-reduced-motion:no-preference){.dlg[open]{animation:dlgIn .22s ease}}
@keyframes dlgIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}


/* ══ TARJETAS DE MATERIAL DEL HERO ══
   Eran <div> con estilos inline: parecían botones y no llevaban a ninguna parte.
   Un usuario lo reportó tras intentar pulsarlas. Ahora son <a> reales con foco
   visible y área táctil de 44px mínimo.
   Cinco columnas en escritorio; a partir de 700px pasan a 3+2 y luego a 2 para
   que el texto no se comprima ni desborde. */
.mat-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-top:32px}
.mat{display:flex;flex-direction:column;align-items:center;gap:8px;min-height:88px;padding:14px 6px 12px;text-align:center;text-decoration:none;color:#fff;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.2);transition:background .22s,border-color .22s,transform .22s}
.mat:hover{background:rgba(212,32,39,.16);border-color:var(--red-bright);color:#fff;text-decoration:none;transform:translateY(-2px)}
.mat:focus-visible{outline:3px solid var(--red-bright);outline-offset:2px;background:rgba(212,32,39,.16)}
.mat__i{width:40px;height:40px;min-width:40px;border:1.5px solid rgba(255,255,255,.9);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff}
.mat:hover .mat__i,.mat:focus-visible .mat__i{border-color:var(--red-bright)}
.mat__t{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9px;letter-spacing:.08em;line-height:1.3;text-transform:uppercase;color:#fff;min-width:0;overflow-wrap:normal;word-break:normal;hyphens:none}
@media(max-width:1040px){.mat-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:560px){.mat-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.mat{min-height:80px}}
@media(max-width:380px){.mat__t{font-size:8.5px}}

/* ══ GARANTÍAS DE LA HOME ══
   La meta description promete «caballete propio, seguro de carga y guía
   electrónica» y el cuerpo no contenía ninguna de las tres. Este bloque las
   desarrolla, adaptando el contenido de /cobertura/ y las páginas de servicio. */
.gar{background:var(--bone);padding:88px 0}
.gar__g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:44px}
@media(max-width:940px){.gar__g{grid-template-columns:1fr}.gar{padding:64px 0}}
.gar__c{background:#fff;border:1px solid var(--line);border-top:3px solid var(--red);padding:28px 26px;min-width:0}
.gar__n{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;letter-spacing:.22em;color:var(--red);display:block}
.gar__c h3{font-family:'Archivo',sans-serif;font-weight:800;font-size:20px;letter-spacing:-.02em;line-height:1.2;color:var(--ink);margin:14px 0 0}
.gar__c p{font-size:14.5px;line-height:1.65;color:#3A3A42;margin-top:12px}
.gar__c strong{font-weight:600;color:var(--ink)}
.gar__c a{font-family:'Archivo',sans-serif;font-weight:700;font-size:13px;color:var(--red);text-decoration:none}
.gar__c a:hover{text-decoration:underline}
.gar__pie{margin-top:28px;padding:20px 24px;background:var(--ink);color:rgba(255,255,255,.82);font-size:14.5px;line-height:1.6}
.gar__pie strong{color:#fff;font-weight:600}
.gar__pie a{color:#fff;text-decoration:underline}
.gar .shead h2{font-family:'Archivo',sans-serif;font-weight:800;font-size:clamp(28px,3.4vw,42px);letter-spacing:-.028em;line-height:1.08;color:var(--ink);margin:14px 0 0}
.gar .shead p{font-size:17px;line-height:1.6;color:var(--muted);margin-top:16px;max-width:640px}

/* Subtítulo bajo el H1 de las rutas: el término de búsqueda va en el H1 y el
   matiz descriptivo aquí, para no alargar el titular. */
.phe__sub{font-family:'Archivo',sans-serif;font-weight:600;font-size:clamp(15px,1.7vw,20px);color:rgba(255,255,255,.72);margin:10px 0 0;letter-spacing:-.01em}

/* ══ RUTAS EN LA HOME ══
   La home tiene la mejor posición del sitio y no enlazaba a ninguna ruta, que
   concentran el 71% de las impresiones en posición 33. Este bloque transfiere
   autoridad interna hacia las cuatro. */
.rut{background:var(--paper);padding:88px 0}
@media(max-width:940px){.rut{padding:64px 0}}
.rut__g{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:44px}
@media(max-width:1040px){.rut__g{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.rut__g{grid-template-columns:1fr}}
.rut__c{display:flex;flex-direction:column;gap:6px;min-height:150px;padding:24px 22px;background:#fff;border:1px solid var(--line);border-left:3px solid var(--red);color:var(--ink);text-decoration:none;transition:transform .2s,box-shadow .2s,border-color .2s}
.rut__c:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(0,0,0,.09);color:var(--ink);text-decoration:none}
.rut__c:focus-visible{outline:3px solid var(--red);outline-offset:2px}
.rut__k{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9.5px;letter-spacing:.17em;color:var(--muted);text-transform:uppercase}
.rut__n{font-family:'Archivo',sans-serif;font-weight:800;font-size:21px;letter-spacing:-.02em;line-height:1.15;margin-top:2px}
.rut__d{font-size:13.5px;color:var(--muted);flex:1}
.rut__d b{color:var(--ink);font-weight:600}
.rut__a{font-family:'Archivo',sans-serif;font-weight:700;font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--red)}
.rut__pie{margin-top:26px;padding:18px 22px;background:var(--bone);border-left:3px solid var(--ink);font-size:14.5px;color:var(--ink)}
.rut__pie strong{font-weight:600}
.rut .shead h2{font-family:'Archivo',sans-serif;font-weight:800;font-size:clamp(28px,3.4vw,42px);letter-spacing:-.028em;line-height:1.08;color:var(--ink);margin:14px 0 0}
.rut .shead p{font-size:17px;line-height:1.6;color:var(--muted);margin-top:16px;max-width:660px}

/* Cabecera de sección: fila del número y su guion. Se usa en los bloques de
   garantías y rutas de la home, con el mismo patrón que las páginas internas. */
.shead__top{display:flex;align-items:center;gap:14px;margin-bottom:4px}
.shead__dash{flex:1;height:1px;background:var(--line);min-width:0}
.sect--dark .shead__dash,.gar .shead__dash{background:rgba(0,0,0,.12)}
/* Campo trampa de Web3Forms: oculto también por clase, no solo inline. */
.hidden{display:none!important}

/* ══ CAMPOS DE FORMULARIO · UN SOLO CRITERIO ══

   POR QUÉ ASÍ: las versiones anteriores cambiaban el fondo en :focus, :hover y
   :not(:placeholder-shown), y en cada cambio había que volver a declarar el color
   o el texto quedaba invisible. Se rompió tres veces: la última, el campo estaba
   blanco, al escribir se ponía oscuro con texto invisible y al salir volvía a
   blanco. Además input y textarea llevaban criterios opuestos en el mismo
   formulario: fondo claro uno, fondo oscuro el otro.

   REGLA: el campo NO cambia de color nunca. Fondo claro y texto oscuro fijos en
   los cinco estados —base, hover, foco, con texto y error—. Lo único que cambia
   entre estados es el BORDE: gris en reposo, rojo de marca al enfocar, rojo de
   error al fallar la validación. El foco ya se señala con el borde y el halo, así
   que el cambio de fondo no aportaba nada y era donde se rompía el contraste.

   ANTES DE TOCAR ESTO: no añadas background-color ni color en ninguna regla de
   estado. La comprobación 16 hace fallar el build si aparecen. Un solo selector
   cubre input, textarea y select en los siete formularios del sitio. */

.fl input:not([type=radio]):not([type=checkbox]):not([type=hidden]),
.fl textarea,
.fl select,
.lgl input:not([type=radio]):not([type=checkbox]):not([type=hidden]),
.lgl textarea,
.lgl select,
fieldset input:not([type=radio]):not([type=checkbox]):not([type=hidden]),
fieldset textarea,
fieldset select{
  width:100%;
  padding:13px 15px;
  background-color:#FFFFFF;
  color:#15151A;
  border-width:1px;
  border-style:solid;
  border-color:#C9C4B8;
  border-radius:0;
  font-family:'Inter',sans-serif;
  font-size:16px;
  transition:border-color .18s ease, box-shadow .18s ease;
}

/* Placeholder: mismo fondo claro, gris suficiente para 4.5:1 */
.fl input::placeholder,.fl textarea::placeholder,
.lgl input::placeholder,.lgl textarea::placeholder,
fieldset input::placeholder,fieldset textarea::placeholder{color:#63636B;opacity:1}

/* Estados: SOLO borde y halo. Nunca fondo ni color de texto.
   Los :not() se repiten aquí para igualar la especificidad de la regla base:
   sin ellos la base ganaba y el borde de foco no llegaba a aplicarse. */
.fl input:not([type=radio]):not([type=checkbox]):not([type=hidden]):hover,.fl textarea:hover,.fl select:hover,
.lgl input:not([type=radio]):not([type=checkbox]):not([type=hidden]):hover,.lgl textarea:hover,.lgl select:hover,
fieldset input:not([type=radio]):not([type=checkbox]):not([type=hidden]):hover,fieldset textarea:hover,fieldset select:hover{border-color:#9B9689}

.fl input:not([type=radio]):not([type=checkbox]):not([type=hidden]):focus,.fl textarea:focus,.fl select:focus,
.lgl input:not([type=radio]):not([type=checkbox]):not([type=hidden]):focus,.lgl textarea:focus,.lgl select:focus,
fieldset input:not([type=radio]):not([type=checkbox]):not([type=hidden]):focus,fieldset textarea:focus,fieldset select:focus{
  outline:none;
  border-color:var(--red);
  box-shadow:0 0 0 3px rgba(166,23,28,.22);
}

.fl input:not([type=radio]):not([type=checkbox]):not([type=hidden]).is-err,.fl textarea.is-err,
.lgl input:not([type=radio]):not([type=checkbox]):not([type=hidden]).is-err,.lgl textarea.is-err{border-color:#C8202A}

.fl input:not([type=radio]):not([type=checkbox]):not([type=hidden]).is-err:focus,.fl textarea.is-err:focus,
.lgl input:not([type=radio]):not([type=checkbox]):not([type=hidden]).is-err:focus,.lgl textarea.is-err:focus{
  border-color:#C8202A;
  box-shadow:0 0 0 3px rgba(200,32,42,.26);
}

/* Autocompletado del navegador: conserva el mismo criterio */
.fl input:-webkit-autofill,.fl textarea:-webkit-autofill,
.lgl input:-webkit-autofill,fieldset input:-webkit-autofill{
  -webkit-text-fill-color:#15151A;
  -webkit-box-shadow:0 0 0 40px #FFFFFF inset;
  caret-color:#15151A;
}

.fl textarea,.lgl textarea,fieldset textarea{resize:vertical;min-height:88px}

/* mat__t: sin corte dentro de palabra.
   'overflow-wrap:anywhere' partía «SOBREDIMENSIONADA» en «SOBREDIMENSIONAD / A» en la
   columna de cinco tarjetas. La palabra más larga cabe con letter-spacing reducido;
   si no cupiera, se prefiere que la tarjeta crezca a romper la palabra. */
.mat__t{letter-spacing:.04em}
@media(min-width:1041px){.mat__t{font-size:8.5px}}