/* ==========================================================================
   AUTO-OK — responsive.css
   Base mobile-first (360-390px). Estas reglas SOLO amplían/reacomodan,
   nunca agregan funcionalidad exclusiva de escritorio (regla 8 del prompt).
   ========================================================================== */

/* ---- Tablet (>= 600px) ---- */
@media (min-width: 600px) {
  .header__cta {
    width: auto;
    min-height: var(--altura-tap-minima);
    padding: 0 var(--esp-4);
    border-radius: 999px;
    background: #FFFBEF;
    border: 1.5px solid #FFC93C;
    color: #B8860B;
  }
  .header__cta-largo { display: inline; }

  .footer__columnas {
    grid-template-columns: repeat(2, 1fr);
  }
  .tarjetas-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--esp-4);
  }
  .opciones-grid { grid-template-columns: repeat(3, 1fr); }
  .hero__cta-fila { flex-direction: row; align-items: stretch; }
  .hero__cta-fila .boton--amarillo { width: auto; padding: 0 var(--esp-6); }
  .header__marca-divisor { display: block; }
  .header__marca-sub { display: block; }
}

/* ---- Desktop (>= 960px) ---- */
@media (min-width: 960px) {
  .beneficios__lista { gap: var(--esp-7); padding: var(--esp-3) var(--esp-4); justify-content: center; }
  .beneficios__item { flex-direction: row; align-items: center; gap: var(--esp-2); text-align: left; min-width: 0; }
  .beneficios__item svg { width: 22px; height: 22px; }
  .beneficios__texto { display: flex; flex-direction: column; line-height: 1.25; }
  .beneficios__texto strong { font-size: var(--texto-sm); font-weight: 700; color: #FFFFFF; }
  .beneficios__texto small { font-size: 11px; color: #9FB0C0; }
  .beneficios__texto-corto { display: none; }

  .header__menu-boton { display: none; }
  .header__nav {
    display: flex !important;
    position: static;
    flex-direction: row;
    align-items: center;
    gap: var(--esp-5);
    background: none;
    border: none;
    box-shadow: none;
    padding: 0;
  }
  .header__nav a,
  .header__nav-disparador {
    text-decoration: none;
    color: var(--color-texto);
    font-weight: 500;
    font-size: var(--texto-sm);
    padding: 0;
    border-bottom: none;
    width: auto;
  }
  .header__nav a:hover,
  .header__nav-disparador:hover { color: var(--color-asfalto-900); }

  .header__nav-item { display: flex; align-items: center; position: relative; }
  .header__submenu {
    display: block;
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: var(--esp-3);
    background: var(--color-bg-alt);
    border: var(--borde);
    border-radius: var(--radio-md);
    box-shadow: var(--sombra-md);
    padding: var(--esp-2);
    min-width: 220px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(4px);
    transition: opacity 0.12s ease, transform 0.12s ease, visibility 0.12s;
  }
  .header__nav-item:hover .header__submenu,
  .header__nav-item:focus-within .header__submenu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }
  .header__submenu a {
    padding: var(--esp-2) var(--esp-3);
    border-radius: var(--radio-sm);
  }
  .header__submenu a:hover { background: var(--color-bg); color: var(--color-asfalto-900); }

  .opciones-grid { grid-template-columns: repeat(3, 1fr); }
  .perspectivas-grid { grid-template-columns: repeat(2, 1fr); }

  .federal {
    display: grid;
    grid-template-columns: 0.8fr 1.6fr 1fr;
    gap: var(--esp-6);
    align-items: center;
    text-align: left;
  }
  .federal__texto { max-width: none; }
  .federal__jurisdiccion { margin-top: 0; }

  .asesoramiento { flex-direction: row-reverse; }
  .asesoramiento__texto { text-align: left; max-width: none; }

  .semaforo-grid { flex-direction: row; }
  .semaforo-item { flex: 1; flex-direction: column; }
  .semaforo-item__luz { margin-bottom: var(--esp-2); }

  .perspectiva { flex-direction: row; align-items: center; }
  .perspectiva__acciones { flex-direction: row; }

  .confianza-grid { grid-template-columns: repeat(4, 1fr); }

  .flujo-acciones { flex-direction: row-reverse; justify-content: flex-end; }
  .flujo-acciones .boton { width: auto; min-width: 220px; }
  .flujo-acciones .boton--secundario { order: 0; min-width: 140px; }

  .boton--primario,
  .boton--secundario,
  .boton--acento,
  .boton--amarillo {
    width: auto;
  }

  .footer__columnas {
    grid-template-columns: repeat(4, 1fr);
  }
  .tarjetas-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .hero-seccion h1 { font-size: 2.75rem; max-width: 620px; }
  .hero__subtitulo { font-size: var(--texto-lg); max-width: 560px; }

  .hero {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 560px;
    padding: var(--esp-7) 0;
  }
  .hero__contenido { max-width: 560px; }
  .hero__foto-bg {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 42%;
    width: auto;
    height: auto;
    aspect-ratio: unset;
    border-radius: 0;
    margin: 0;
    z-index: -1;
  }
  .hero__foto { object-position: 65% center; }
  .hero__foto-degradado {
    display: block;
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg,
      var(--color-asfalto-900) 0%,
      rgba(10,36,64,0.85) 16%,
      rgba(10,36,64,0.4) 28%,
      rgba(10,36,64,0) 38%);
  }

  /* El modal se comporta como diálogo centrado en desktop, no como hoja inferior */
  .modal { align-items: center; }
  .modal__contenido {
    border-radius: var(--radio-lg);
    max-width: 560px;
  }
}

/* ---- Desktop amplio (>= 1200px) ---- */
@media (min-width: 1200px) {
  h1 { font-size: 2.75rem; }
}

/* Visual master responsive overrides */
@media (max-width: 959px) {
  .header { background:#031225; border-bottom:1px solid rgba(255,255,255,.12); }
  .header__barra { min-height:64px; }
  .header__marca-nombre { color:#fff; }
  .header__marca-nombre small, .header__marca-sub { color:#fff; }
  .header__menu-boton svg { stroke:#fff; }
  .header__cta { background:#FFC400; color:#031225; }
  .hero-seccion { padding:0; }
  .hero { max-width:none; width:100%; min-height:0; display:flex; flex-direction:column; padding:0; }
  .hero__contenido { position:relative; z-index:2; max-width:none; padding:38px 22px 30px; box-sizing:border-box; }
  .hero__contenido h1 { position:relative; z-index:4; font-size:2rem; line-height:1.08; max-width:500px; }
  .hero__subtitulo { position:relative; z-index:4; font-size:1rem; max-width:500px; margin-bottom:26px; }
  .hero__foto-bg { position:relative; z-index:1; order:2; width:100%; height:auto; aspect-ratio:1016 / 486; border-radius:0; margin:0; overflow:hidden; }
  .hero__foto { object-fit:cover; object-position:center; }
  .hero__foto-degradado { display:block; position:absolute; inset:0; background:linear-gradient(180deg,rgba(3,18,37,0) 0%,rgba(3,18,37,.12) 100%); }
  .hero__cta-fila { position:relative; z-index:4; flex-direction:row; width:100%; }
  .hero__legend { position:relative; z-index:4; }
  .seccion--rutas { padding:9px 8px 0; }
  .rutas-grid { display:grid; grid-template-columns:1fr; gap:9px; }
  .ruta-card { min-height:330px; }
  .ruta-card__contenido { width:70%; min-width:0; padding:24px 22px; }
  .ruta-card h2 { font-size:1.9rem; }
  .ruta-card p { font-size:.95rem; max-width:420px; }
  .ruta-card__imagen img { object-position:center; }
}
@media (max-width: 599px) {
  .header__marca-divisor, .header__marca-sub { display:none; }
  .hero__contenido { padding:32px 18px 24px; }
  .hero__contenido h1 { font-size:1.8rem; }
  .hero__cta-fila { flex-direction:column; }
  .hero__cta-fila .patente, .hero__cta-fila .boton--amarillo { width:100%; }
  .hero__legend { font-size:.8rem; }
  .ruta-card { min-height:410px; }
  .ruta-card__contenido { width:86%; padding:24px 20px; }
  .ruta-card h2 { font-size:1.75rem; }
  .ruta-card p { font-size:.9rem; }
}

/* ==========================================================================
   AJUSTE QUIRÚRGICO — HEADER + HERO
   Solo corrige centrado del menú/CTA y transición cromática del Hero.
   No modifica estructura, JS ni otros bloques.
   ========================================================================== */
@media (min-width: 960px) {
  /* HEADER: navegación centrada respecto de la página, CTA anclado a la derecha */
  .header__barra {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 0 !important;
  }
  .header__marca { justify-self: start !important; }
  .header__nav {
    justify-self: center !important;
    margin-left: 0 !important;
    gap: 42px !important;
  }
  .header__cta {
    justify-self: end !important;
    width: 252px !important;
    min-width: 252px !important;
    height: 54px !important;
    min-height: 54px !important;
    padding: 0 20px !important;
    border-radius: 7px !important;
    box-sizing: border-box !important;
  }

  /* HERO: degradé único sobre el Hero completo, sin borde entre fondo e imagen */
  .hero__foto-degradado {
    background: none !important;
  }
  .hero::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    background: linear-gradient(
      90deg,
      #031225 0%,
      #031225 18%,
      rgba(3,18,37,.98) 27%,
      rgba(3,18,37,.88) 36%,
      rgba(3,18,37,.58) 45%,
      rgba(3,18,37,.25) 53%,
      rgba(3,18,37,0) 63%
    );
  }
  .hero__contenido { z-index: 3 !important; }
}

/* AUTO-OK — ajuste final solicitado: fondo general + fundido Hero + VENDER */
@media (min-width: 960px) {
  /* Fondo general: toda la experiencia visual permanece dentro de la paleta navy. */
  body { background: #031225 !important; color: #FFFFFF; }
  .seccion, .seccion--alt, .seccion--rutas { background: #031225 !important; }
  .seccion--alt { border-top-color: rgba(255,255,255,.10) !important; border-bottom-color: rgba(255,255,255,.10) !important; }
  .seccion--alt h2, .seccion--alt > .contenedor > p { color:#FFFFFF !important; }
  .tarjeta { background:#0A2440 !important; border-color:rgba(255,255,255,.10) !important; color:#FFFFFF; }
  .tarjeta h3, .tarjeta p { color:#FFFFFF; }

  /* HERO: el borde debe desaparecer antes de que termine el sector de imagen. */
  .hero::after {
    background: linear-gradient(
      90deg,
      #031225 0%,
      #031225 24%,
      rgba(3,18,37,.995) 31%,
      rgba(3,18,37,.96) 38%,
      rgba(3,18,37,.82) 46%,
      rgba(3,18,37,.60) 54%,
      rgba(3,18,37,.34) 62%,
      rgba(3,18,37,.12) 70%,
      rgba(3,18,37,0) 78%
    ) !important;
  }

  /* VENDER: mismo comportamiento geométrico que COMPRAR; no se estira. */
  .ruta-card--vender .ruta-card__imagen img {
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:center center !important;
    transform:none !important;
  }
}

@media (max-width: 959px) {
  body { background:#031225 !important; }
  .seccion, .seccion--alt, .seccion--rutas { background:#031225 !important; }
  .seccion--alt { border-top-color:rgba(255,255,255,.10) !important; border-bottom-color:rgba(255,255,255,.10) !important; }
  .seccion--alt h2, .seccion--alt > .contenedor > p { color:#FFFFFF !important; }
  .tarjeta { background:#0A2440 !important; border-color:rgba(255,255,255,.10) !important; color:#FFFFFF; }
  .tarjeta h3, .tarjeta p { color:#FFFFFF; }
}

/* AUTO-OK — COMPRA / VENTA: botones alineados y VENTA sin deformación */
@media (min-width: 960px) {
  .ruta-card__contenido { height: 100% !important; display:flex !important; flex-direction:column !important; }
  .ruta-card__contenido p { margin-bottom: 0 !important; }
  .ruta-card__boton { margin-top:auto !important; }
  .ruta-card--vender .ruta-card__imagen img {
    object-fit: cover !important;
    object-position: 58% center !important;
    transform: none !important;
  }
}

/* Servicios rápidos — responsive de la composición aprobada */
@media (max-width: 959px) {
  #servicios-rapidos .servicios-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 599px) {
  #servicios-rapidos .servicios-grid {
    grid-template-columns: 1fr;
  }
  #servicios-rapidos .servicio-card {
    grid-template-columns: 56px minmax(0, 1fr) auto;
    column-gap: 0.75rem;
    min-height: 132px;
    padding: 0.9rem;
  }
  #servicios-rapidos .servicio-card__icono {
    width: 50px;
    height: 50px;
  }
  #servicios-rapidos .servicio-card__icono svg {
    width: 26px;
    height: 26px;
  }
  #servicios-rapidos .servicio-card h3 {
    font-size: 1rem;
    font-weight: 800;
  }
  #servicios-rapidos .servicio-card__texto > p:not(.tarjeta__precio) {
    font-size: 0.74rem;
  }
  #servicios-rapidos .tarjeta__precio {
    font-size: 0.95rem;
  }
  #servicios-rapidos .servicio-card__boton {
    min-height: 34px;
    padding: 0.45rem 0.55rem;
    font-size: 0.61rem;
  }
  #servicios-rapidos .servicio-card__distintivo {
    font-size: 0.54rem;
    top: -10px;
  }
}

/* AUTO-OK — responsive consolidado: Servicios + Semáforo 1B */
@media (max-width: 1199px) {
  #servicios-rapidos .servicio-card { min-height: 205px; }
  #servicios-rapidos .servicio-card h3 { font-size: 1.02rem; }
}

@media (max-width: 959px) {
  #servicios-rapidos .servicios-grid { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
  #servicios-rapidos .servicio-card { min-height: 190px; }
  .semaforo-auto-ok__panel { padding: 1.7rem 1.1rem; }
  .semaforo-auto-ok__estados { grid-template-columns: 1fr; gap: 2.1rem; }
  .semaforo-estado { min-height: 210px; }
}

@media (max-width: 599px) {
  #servicios-rapidos .servicios-grid { grid-template-columns: 1fr !important; }
  #servicios-rapidos .servicio-card {
    min-height: 196px;
    grid-template-columns: 56px minmax(0,1fr);
    padding: 1rem 1rem 4.1rem;
  }
  #servicios-rapidos .servicio-card__icono { width: 48px; height: 48px; }
  #servicios-rapidos .servicio-card__texto { height: 112px; grid-template-rows: 2.75rem 3.4rem 1.45rem; }
  #servicios-rapidos .servicio-card h3 { font-size: .98rem; }
  #servicios-rapidos .servicio-card__texto > p:not(.tarjeta__precio) { font-size: .8rem; }
  #servicios-rapidos .tarjeta__precio { font-size: 1.08rem !important; }
  #servicios-rapidos .servicio-card__distintivo { font-size: .55rem; max-width: calc(100% - 36px); white-space: nowrap; }
  .semaforo-auto-ok { padding-left: .65rem; padding-right: .65rem; }
  .semaforo-auto-ok__panel { padding: 1.55rem .85rem; }
  .semaforo-auto-ok__encabezado { margin-bottom: 2.15rem; }
  .semaforo-auto-ok__encabezado h2 { font-size: 1.8rem; }
}

/* AUTO-OK — Federal 1B + ajuste VENTA */
@media (max-width: 1199px) {
  .federal-1b__panel { grid-template-columns: minmax(0,1fr) 390px; grid-template-areas:"intro mapa" "mensaje mapa" "nota nota"; }
  .federal-1b__mensaje { min-height:0; max-width:520px; }
  .federal-1b__beneficios { grid-template-columns:1fr; }
  .federal-1b__beneficio { min-height:72px; }
}
@media (max-width: 959px) {
  .ruta-card--vender .ruta-card__imagen img {
    object-position: 60% 48% !important;
    transform: translate(1.5%, -1%) scale(1.035) !important;
  }
  .federal-1b__panel {
    grid-template-columns:1fr;
    grid-template-areas:"intro" "mapa" "mensaje" "nota";
    padding:1.6rem 1.1rem 1rem;
  }
  .federal-1b__intro { max-width:none; }
  .federal-1b__beneficios { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .federal-1b__mapa-wrap { min-height:430px; }
  .federal-1b__mapa { width:220px; }
  .federal-1b__mensaje { max-width:none; }
}
@media (max-width: 599px) {
  .federal-1b { padding-left:.65rem; padding-right:.65rem; }
  .federal-1b__panel { padding:1.35rem .85rem .9rem; }
  .federal-1b__intro h2 { font-size:2rem; }
  .federal-1b__intro > p { font-size:.9rem; }
  .federal-1b__beneficios { grid-template-columns:1fr; }
  .federal-1b__beneficio { min-height:68px; }
  .federal-1b__mapa-wrap { min-height:455px; }
  .federal-1b__mapa { width:185px; }
  .federal-1b__region { max-width:118px; font-size:.57rem; }
  .federal-1b__region strong { font-size:.72rem; }
  .federal-1b__region--noa { left:0; top:30px; }
  .federal-1b__region--cuyo { left:0; top:152px; }
  .federal-1b__region--litoral { right:0; top:80px; }
  .federal-1b__region--centro { right:0; top:195px; }
  .federal-1b__region--patagonia { left:0; bottom:36px; }
  .federal-1b__malvinas-texto { right:6px; bottom:10px; font-size:.65rem; }
  .federal-1b__malvinas-texto::after { width:74px; }
  #servicios-rapidos .servicio-card--completo .servicio-card__texto > p:not(.tarjeta__precio) { font-size:.75rem; }
}

/* AUTO-OK — responsive de páginas internas */
@media (min-width: 960px) {
  .pagina-interna .header__nav { background:transparent !important; }
  .pagina-interna .header__cta { background:transparent !important; color:#FFC400 !important; }
}
@media (max-width: 959px) {
  .pagina-interna__hero { padding:3.3rem 0 2.8rem !important; }
  .pagina-interna__hero::after { width:280px; height:280px; right:-130px; top:20px; }
  .pagina-interna__hero h1 { font-size:clamp(2rem,8vw,3.1rem); }
  .pagina-interna--servicios .catalogo-servicios { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .pagina-interna--como-funciona .pasos--internos { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .pagina-interna--como-funciona .pasos--internos .pasos__item:last-child { grid-column:1/-1; }
  .pagina-interna__seccion > .contenedor,
  .pagina-interna__pedido > .contenedor { padding:1.55rem; }
}
@media (max-width: 640px) {
  .pagina-interna__hero { padding:2.55rem 0 2.2rem !important; }
  .pagina-interna__hero h1 { font-size:2.15rem; }
  .pagina-interna__hero p:not(.tarjeta__precio):not(.plazo-entrega) { font-size:.98rem; }
  .pagina-interna .boton { width:100%; }
  .pagina-interna--servicios .catalogo-servicios { grid-template-columns:1fr; }
  .pagina-interna--servicios .catalogo-servicios__card { min-height:170px; }
  .pagina-interna--como-funciona .pasos--internos { grid-template-columns:1fr; }
  .pagina-interna--como-funciona .pasos--internos .pasos__item:last-child { grid-column:auto; }
  .pagina-interna--ayuda .ayuda-opciones { grid-template-columns:1fr; }
  .pagina-interna--ayuda .ayuda-opciones .boton--primario { grid-column:auto; }
  .pagina-interna__seccion { padding:.65rem 0 !important; }
  .pagina-interna__seccion > .contenedor,
  .pagina-interna__pedido > .contenedor { padding:1.2rem 1rem; border-radius:11px; }
}

/* Depuración de páginas internas */
@media (min-width: 960px) {
  .header__submenu {
    background: #071B32 !important;
    border-color: rgba(37,177,255,.32) !important;
    min-width: 245px;
    padding: .5rem !important;
  }
  .header__submenu a { color: #EAF5FC !important; padding: .65rem .75rem !important; }
  .header__submenu a:hover { color: #fff !important; background: rgba(13,107,232,.18) !important; }
}
@media (max-width: 820px) {
  .pagina-interna .selector-situacion--tres { grid-template-columns: 1fr; }
  .pagina-interna .selector-situacion--tres .selector-situacion__opcion {
    min-height: 145px;
    grid-template-columns: 58px 1fr;
    grid-template-rows: auto auto;
    justify-items: start;
    text-align: left;
  }
  .pagina-interna .selector-situacion__icono { grid-row: 1 / 3; align-self: center; }
  .pagina-interna .selector-situacion__texto strong { min-height: 0; align-self:end; }
  .pagina-interna .selector-situacion__texto small { align-self:start; }
}
@media (max-width: 640px) {
  .pagina-servicio [data-paso="patente"] .flujo-acciones .boton { width: 100%; min-width: 0; }
  .pagina-interna .alcance-aclaraciones > .contenedor { padding: .85rem .9rem !important; }
}


/* ==========================================================================
   PRE-UAT 1.1 — ESTABILIZACIÓN VISUAL MÓVIL
   Capa deliberadamente exclusiva <= 959px. No modifica desktop.
   ========================================================================== */
@media (max-width: 959px) {
  html, body { max-width:100%; overflow-x:hidden; }
  .contenedor { width:min(100% - 2rem, var(--ancho-contenedor)); }

  /* Header: marca/acciones nunca fuerzan ancho. */
  .header__barra { min-width:0; gap:.55rem; }
  .header__marca { min-width:0; }
  .header__marca-nombre { white-space:nowrap; }

  /* Hero: texto y mockup como dos planos limpios, sin desplazamientos heredados. */
  .hero { display:flex !important; flex-direction:column !important; height:auto !important; min-height:0 !important; }
  .hero__contenido { width:100% !important; height:auto !important; min-height:0 !important; padding:2rem 1.15rem 1.45rem !important; }
  .hero__foto-bg {
    position:relative !important; inset:auto !important; transform:none !important;
    width:100% !important; height:clamp(205px,56vw,330px) !important; aspect-ratio:auto !important;
    order:2 !important; overflow:hidden !important;
  }
  .hero__foto { object-fit:cover !important; object-position:58% center !important; transform:none !important; }
  .hero__foto-degradado {
    display:block !important;
    background:linear-gradient(180deg,#031225 0%,rgba(3,18,37,.28) 18%,rgba(3,18,37,0) 46%) !important;
  }
  .hero__legend { align-items:center; flex-wrap:wrap; row-gap:.45rem; }
  .hero__legend .hero__entrega-texto { flex:0 0 100%; }

  /* Compra / Venta: en móvil la foto queda completa arriba y el copy debajo.
     Se neutralizan TODOS los transforms/left/width pensados para desktop. */
  .rutas-grid { grid-template-columns:1fr !important; gap:.85rem !important; }
  .ruta-card { min-height:0 !important; height:auto !important; overflow:hidden !important; }
  .ruta-card__imagen,
  .ruta-card--comprar .ruta-card__imagen,
  .ruta-card--vender .ruta-card__imagen {
    position:absolute !important; inset:0 0 auto 0 !important; left:0 !important; right:0 !important;
    width:100% !important; height:225px !important; transform:none !important; overflow:hidden !important;
  }
  .ruta-card__imagen img,
  .ruta-card--comprar .ruta-card__imagen img,
  .ruta-card--vender .ruta-card__imagen img {
    width:100% !important; height:100% !important; object-fit:cover !important;
    object-position:center center !important; transform:none !important;
  }
  .ruta-card__velo {
    inset:0 0 auto 0 !important; height:225px !important;
    background:linear-gradient(180deg,rgba(3,18,37,.02) 35%,rgba(3,18,37,.82) 100%) !important;
  }
  .ruta-card__contenido {
    width:100% !important; min-height:0 !important; padding:245px 1.25rem 1.35rem !important;
    background:transparent !important; box-sizing:border-box !important;
  }
  .ruta-card--comprar { background:#052F7D !important; }
  .ruta-card--vender { background:#00712C !important; }
  .ruta-card__boton { width:100% !important; min-width:0 !important; box-sizing:border-box; }

  /* Servicios: impedir que precio/CTA se monten al achicarse. */
  #servicios-rapidos .servicio-card { min-width:0 !important; }
  #servicios-rapidos .servicio-card__texto { min-width:0 !important; }

  /* Semáforo: fondo estable y tarjetas sin alturas forzadas. */
  .semaforo-auto-ok__panel { background-position:center !important; overflow:hidden; }
  .semaforo-estado { min-height:0 !important; height:auto !important; }

  /* Federal: el mockup aprobado se muestra ENTERO y centrado. */
  .federal-1b__panel--preview {
    grid-template-columns:1fr !important; grid-template-areas:"intro" "preview" "nota" !important;
    min-height:0 !important; overflow:hidden !important;
  }
  .federal-1b__intro { min-width:0 !important; max-width:none !important; }
  .federal-1b__beneficios { grid-template-columns:1fr !important; }
  .federal-1b__preview {
    width:100% !important; max-width:100% !important; min-width:0 !important; margin:0 auto !important;
    display:block !important; transform:none !important; overflow:hidden !important;
  }
  .federal-1b__preview img {
    display:block !important; width:100% !important; height:auto !important; max-height:none !important;
    object-fit:contain !important; object-position:center center !important; transform:none !important;
  }

  /* CTA final: escena contenida, nunca corre el texto. */
  .cta-final-1c__escena { transform:none !important; background-size:cover !important; background-position:center center !important; }
  .cta-final-1c__contenido { width:min(100% - 2rem,var(--ancho-contenedor)) !important; }

  /* Barras/footer: evitar columnas apretadas y contenido fuera de pantalla. */
  .confianza-barra-final__inner, .footer__principal, .footer__legal { min-width:0; }
  .footer.footer--institucional .footer__principal { grid-template-columns:1fr !important; }

  /* Páginas internas + flujo: ninguna tarjeta excede viewport. */
  .pagina-interna__seccion > .contenedor,
  .pagina-interna__pedido > .contenedor,
  .flujo-paso, .resumen { max-width:100%; min-width:0; box-sizing:border-box; }
  .pagina-servicio input, .pagina-servicio select, .pagina-servicio textarea { max-width:100%; box-sizing:border-box; }
}

@media (max-width: 640px) {
  .contenedor { width:min(100% - 1.25rem, var(--ancho-contenedor)); }
  .hero__contenido { padding:1.65rem .9rem 1.2rem !important; }
  .hero__foto-bg { height:220px !important; }
  .hero__foto { object-position:60% center !important; }
  .hero__legend { font-size:.76rem !important; }
  .hero__legend .canales-entrega { gap:.45rem; }

  .ruta-card__imagen, .ruta-card__velo { height:205px !important; }
  .ruta-card__contenido { padding:225px 1rem 1.1rem !important; }

  #servicios-rapidos .servicio-card {
    display:grid !important; grid-template-columns:52px minmax(0,1fr) !important;
    padding:1rem 1rem 4.75rem !important;
  }
  #servicios-rapidos .servicio-card__texto { width:100% !important; }
  #servicios-rapidos .tarjeta__precio { left:1rem !important; bottom:.9rem !important; }
  #servicios-rapidos .servicio-card__boton { right:1rem !important; bottom:.9rem !important; }

  .federal-1b { padding-left:.4rem !important; padding-right:.4rem !important; }
  .federal-1b__panel--preview { padding:1.15rem .75rem .75rem !important; }
  .federal-1b__beneficio {
    display:grid !important; grid-template-columns:46px minmax(0,1fr) !important;
    grid-template-rows:auto auto !important; column-gap:.75rem !important; min-height:84px !important;
    align-items:center !important; text-align:left !important; padding:.8rem .9rem !important;
  }
  .federal-1b__beneficio-icono { grid-row:1 / 3; margin:0 !important; }
  .federal-1b__beneficio strong, .federal-1b__beneficio span { text-align:left !important; margin:0 !important; }

  .cta-final-1c__contenido { width:100% !important; padding-left:1rem !important; padding-right:1rem !important; }
  .cta-final-1c__beneficios { grid-template-columns:1fr 1fr !important; }
  .canales-entrega { gap:.35rem; }
}

/* ==========================================================================
   PRE-UAT 1.1.1 — CORRECCIÓN MÓVIL VALIDADA DESDE CAPTURAS REALES
   Exclusivo <=959px. No altera desktop.
   ========================================================================== */
@media (max-width: 959px) {
  /* Entrega: una sola pieza visual, sin duplicados ni iconos gigantes. */
  .hero__legend {
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    flex-wrap:wrap !important;
    gap:.45rem .7rem !important;
    width:100% !important;
    margin-top:1rem !important;
  }
  .hero__legend .hero__entrega-texto {
    flex:0 0 auto !important;
    white-space:nowrap !important;
  }
  .hero__legend .canales-entrega {
    flex:0 0 auto !important;
    display:inline-flex !important;
    flex-wrap:nowrap !important;
    gap:.6rem !important;
  }
  .canales-entrega { flex-wrap:nowrap !important; max-width:100%; }

  /* Hero mobile: copy arriba, imagen completa y contenida abajo. */
  .hero-seccion { overflow:hidden !important; }
  .hero {
    display:flex !important;
    flex-direction:column !important;
    width:100% !important;
    max-width:100% !important;
    min-height:0 !important;
    overflow:hidden !important;
  }
  .hero__contenido {
    order:1 !important;
    position:relative !important;
    width:100% !important;
    max-width:100% !important;
    padding:1.75rem 1rem 1.2rem !important;
    background:#031225 !important;
    color:#fff !important;
    opacity:1 !important;
  }
  .hero__contenido h1,
  .hero__contenido p,
  .hero__contenido label,
  .hero__legend { opacity:1 !important; color:#fff !important; }
  .hero__foto-bg {
    order:2 !important;
    position:relative !important;
    inset:auto !important;
    transform:none !important;
    width:100% !important;
    height:auto !important;
    aspect-ratio: 16 / 9 !important;
    overflow:hidden !important;
    border-radius:0 !important;
    margin:0 !important;
  }
  .hero__foto {
    display:block !important;
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:center center !important;
    transform:none !important;
  }
  .hero__foto-degradado { display:none !important; }

  /* Compra/Venta: tarjeta real. Foto, velo y contenido nunca se separan. */
  .seccion--rutas { padding:.75rem !important; }
  .rutas-grid { display:grid !important; grid-template-columns:1fr !important; gap:1rem !important; }
  .ruta-card,
  .ruta-card--comprar,
  .ruta-card--vender {
    position:relative !important;
    display:flex !important;
    flex-direction:column !important;
    width:100% !important;
    min-height:0 !important;
    height:auto !important;
    overflow:hidden !important;
    border:1px solid rgba(37,177,255,.5) !important;
    border-radius:12px !important;
    background:#061D34 !important;
  }
  .ruta-card__imagen,
  .ruta-card--comprar .ruta-card__imagen,
  .ruta-card--vender .ruta-card__imagen {
    order:1 !important;
    position:relative !important;
    inset:auto !important;
    left:auto !important;
    right:auto !important;
    top:auto !important;
    bottom:auto !important;
    width:100% !important;
    height:auto !important;
    aspect-ratio:16 / 9 !important;
    transform:none !important;
    overflow:hidden !important;
  }
  .ruta-card__imagen img,
  .ruta-card--comprar .ruta-card__imagen img,
  .ruta-card--vender .ruta-card__imagen img {
    display:block !important;
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:center center !important;
    transform:none !important;
  }
  .ruta-card__velo { display:none !important; }
  .ruta-card__contenido,
  .ruta-card--comprar .ruta-card__contenido,
  .ruta-card--vender .ruta-card__contenido {
    order:2 !important;
    position:relative !important;
    inset:auto !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    padding:1.1rem 1rem 1.15rem !important;
    box-sizing:border-box !important;
    background:linear-gradient(180deg,#082844 0%,#061D34 100%) !important;
    color:#fff !important;
    opacity:1 !important;
  }
  .ruta-card--comprar .ruta-card__contenido { border-top:3px solid #0D6BE8; }
  .ruta-card--vender .ruta-card__contenido { border-top:3px solid #10C987; }
  .ruta-card__contenido > * { opacity:1 !important; color:inherit; }
  .ruta-card__tag { display:inline-flex !important; width:max-content !important; margin-bottom:.7rem !important; }
  .ruta-card h2 { margin:.1rem 0 .65rem !important; color:#fff !important; line-height:1.05 !important; }
  .ruta-card p { margin:0 0 1rem !important; color:#E6F1F8 !important; line-height:1.45 !important; }
  .ruta-card__boton {
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    width:100% !important;
    min-height:48px !important;
    margin-top:.2rem !important;
    padding:.75rem .9rem !important;
    border-radius:7px !important;
    background:#fff !important;
    color:#063276 !important;
    text-decoration:none !important;
    opacity:1 !important;
  }
  .ruta-card--vender .ruta-card__boton { color:#057438 !important; }

  /* Confirmación: iconos siempre inline, nunca heredan tamaños ilustrativos. */
  .pedido-generado .campo__ayuda .canales-entrega {
    display:inline-flex !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    gap:.55rem !important;
    vertical-align:middle !important;
  }
  .pedido-generado .campo__ayuda .canal-entrega { display:inline-flex !important; }
}

@media (max-width: 520px) {
  .hero__legend { font-size:.78rem !important; }
  .hero__legend .hero__entrega-texto { flex:0 0 100% !important; }
  .hero__legend .canales-entrega { flex:0 0 auto !important; }
  .hero__foto-bg, .ruta-card__imagen { aspect-ratio: 4 / 3 !important; }
  .ruta-card h2 { font-size:1.65rem !important; }
  .ruta-card p { font-size:.88rem !important; }
}


/* ========================================================================== */
/* PRE-UAT 1.1.2 — AJUSTE MOBILE DESDE REVISIÓN HUMANA                      */
/* Solo <=959px. Desktop queda intacto salvo Compra/Venta sin mockup aprobados.*/
/* ========================================================================== */
@media (max-width: 959px) {
  /* HERO: imagen integrada como pieza del bloque, con marco + degradé suave. */
  .hero-seccion {
    background:#031225 !important;
    padding-bottom:.8rem !important;
  }
  .hero {
    gap:0 !important;
    padding-bottom:0 !important;
  }
  .hero__foto-bg {
    order:2 !important;
    position:relative !important;
    width:calc(100% - 1.5rem) !important;
    max-width:720px !important;
    height:auto !important;
    aspect-ratio:16 / 9 !important;
    margin:.25rem auto .6rem !important;
    border:1px solid rgba(48,180,255,.42) !important;
    border-radius:12px !important;
    overflow:hidden !important;
    box-shadow:0 12px 34px rgba(0,0,0,.28) !important;
    background:#061a2f !important;
  }
  .hero__foto {
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:center 54% !important;
    transform:none !important;
  }
  .hero__foto-degradado {
    display:block !important;
    position:absolute !important;
    inset:0 !important;
    pointer-events:none !important;
    background:
      linear-gradient(180deg,rgba(3,18,37,.32) 0%,rgba(3,18,37,0) 28%,rgba(3,18,37,.08) 70%,rgba(3,18,37,.45) 100%),
      linear-gradient(90deg,rgba(3,18,37,.2) 0%,transparent 15%,transparent 85%,rgba(3,18,37,.18) 100%) !important;
  }

  /* COMPRA / VENTA: bloques editoriales compactos, sin fotografía. */
  .ruta-card--sin-imagen {
    min-height:0 !important;
    border-radius:12px !important;
  }
  .ruta-card--sin-imagen .ruta-card__contenido {
    width:100% !important;
    min-height:0 !important;
    padding:1.25rem 1.1rem 1.2rem !important;
    border-top:0 !important;
    background:transparent !important;
  }
  .ruta-card--sin-imagen .ruta-card__boton {
    width:100% !important;
    min-width:0 !important;
  }

  /* CTA FINAL: contenido y beneficios quedan a la izquierda, fuera de la foto. */
  .cta-final-1c {
    min-height:620px !important;
    background:#031225 !important;
  }
  .cta-final-1c__escena {
    inset:56% 0 0 0 !important;
    background-position:center 58% !important;
    background-size:cover !important;
  }
  .cta-final-1c__escena::before {
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,#031225 0%,rgba(3,18,37,.55) 20%,rgba(3,18,37,.05) 52%,rgba(3,18,37,.28) 100%);
  }
  .cta-final-1c__contenido {
    min-height:620px !important;
    align-items:flex-start !important;
    text-align:left !important;
    padding-top:1.75rem !important;
  }
  .cta-final-1c__texto {
    width:100% !important;
    max-width:620px !important;
    text-align:left !important;
  }
  .cta-final-1c__beneficios {
    width:min(100%,560px) !important;
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:.65rem 1rem !important;
    margin:0 !important;
    padding:0 !important;
    text-align:left !important;
  }
  .cta-final-1c__beneficios span {
    min-width:0 !important;
    align-items:flex-start !important;
    text-align:left !important;
    padding:.15rem 0 .15rem .75rem !important;
    border-left:2px solid rgba(56,191,255,.72) !important;
  }
  .cta-final-1c__beneficios strong,
  .cta-final-1c__beneficios small {
    width:100% !important;
    text-align:left !important;
  }
  .cta-final-1c__lema {
    align-self:flex-start !important;
    margin:auto 0 .9rem !important;
    max-width:100% !important;
    text-align:left !important;
  }
}

@media (max-width: 520px) {
  .hero__foto-bg {
    width:calc(100% - 1rem) !important;
    aspect-ratio:16 / 10 !important;
  }
  .hero__foto {
    object-position:center center !important;
  }
  .cta-final-1c {
    min-height:650px !important;
  }
  .cta-final-1c__contenido {
    min-height:650px !important;
  }
  .cta-final-1c__escena {
    inset:59% 0 0 0 !important;
  }
  .cta-final-1c__beneficios {
    grid-template-columns:1fr !important;
    gap:.4rem !important;
  }
  .cta-final-1c__beneficios span {
    padding-top:.08rem !important;
    padding-bottom:.08rem !important;
  }
}

/* PRE-UAT V1.1.3 — Catálogo interno / Footer / Volver responsive. */
@media (max-width: 900px) {
  .pagina-interna--servicios #catalogo-servicios { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .footer__identidad-marca img { width:74px !important;max-width:74px !important; }
}
@media (max-width: 620px) {
  .pagina-interna--servicios #catalogo-servicios { grid-template-columns:1fr !important;gap:.9rem; }
  .pagina-interna--servicios #catalogo-servicios .servicio-card { min-height:190px;padding:1rem 1rem 4.1rem;grid-template-columns:52px minmax(0,1fr);column-gap:.8rem; }
  .pagina-interna--servicios #catalogo-servicios .servicio-card__icono { width:48px;height:48px; }
  .pagina-interna--servicios #catalogo-servicios .servicio-card__icono svg { width:26px;height:26px; }
  .pagina-interna--servicios #catalogo-servicios .servicio-card__texto { height:112px;grid-template-rows:2.75rem 3.4rem 1.45rem; }
  .pagina-interna--servicios #catalogo-servicios .servicio-card h3 { font-size:.98rem; }
  .pagina-interna--servicios #catalogo-servicios .servicio-card__texto > p:not(.tarjeta__precio) { font-size:.8rem; }
  .pagina-interna--servicios #catalogo-servicios .tarjeta__precio { left:1rem;bottom:.9rem;font-size:1.08rem !important; }
  .pagina-interna--servicios #catalogo-servicios .servicio-card__boton { right:1rem;bottom:.9rem; }
  .pagina-interna--servicios #catalogo-servicios .servicio-card__distintivo { font-size:.55rem;max-width:calc(100% - 28px);overflow:hidden;text-overflow:ellipsis; }
  .footer__identidad-marca img { width:70px !important;max-width:70px !important; }
  .pagina-volver-wrap { padding-top:.65rem; }
}

/* ========================================================================== */
/* PRE-UAT 1.1.4 — corrección botones catálogo + menú móvil Home              */
/* Exclusivo mobile/tablet: no modifica desktop.                               */
/* ========================================================================== */
@media (max-width: 959px) {
  /* Home: el panel principal del menú móvil usa la misma paleta navy que las páginas internas. */
  body:not(.pagina-interna) .header__nav {
    background:#04182D !important;
    border:1px solid rgba(37,177,255,.22) !important;
    box-shadow:0 18px 45px rgba(0,0,0,.38) !important;
  }
  body:not(.pagina-interna) .header__nav a,
  body:not(.pagina-interna) .header__nav-disparador {
    color:#EAF5FC !important;
    border-color:rgba(255,255,255,.09) !important;
  }
  body:not(.pagina-interna) .header__nav a:hover,
  body:not(.pagina-interna) .header__nav a:focus-visible,
  body:not(.pagina-interna) .header__nav-disparador:hover,
  body:not(.pagina-interna) .header__nav-disparador:focus-visible {
    color:#fff !important;
    background:rgba(13,107,232,.15) !important;
  }
  body:not(.pagina-interna) .header__submenu {
    background:#071B32 !important;
    border-color:rgba(37,177,255,.24) !important;
  }

  /* Catálogo interno: neutraliza la regla global .pagina-interna .boton{width:100%}
     para que precio y CTA convivan en la base de cada tarjeta sin superponerse. */
  .pagina-interna--servicios #catalogo-servicios .servicio-card__boton {
    width:auto !important;
    min-width:126px !important;
    max-width:46% !important;
    padding:.62rem .78rem !important;
    white-space:nowrap !important;
    justify-content:center !important;
    font-size:.78rem !important;
    line-height:1 !important;
  }
  .pagina-interna--servicios #catalogo-servicios .tarjeta__precio {
    width:auto !important;
    max-width:44% !important;
    min-width:96px !important;
    white-space:nowrap !important;
  }
}

@media (max-width: 380px) {
  .pagina-interna--servicios #catalogo-servicios .servicio-card__boton {
    min-width:118px !important;
    max-width:45% !important;
    padding:.58rem .62rem !important;
    font-size:.74rem !important;
  }
  .pagina-interna--servicios #catalogo-servicios .tarjeta__precio {
    min-width:92px !important;
    max-width:42% !important;
    padding:.4rem .55rem !important;
  }
}