/* /maxi-01/ — página comercial canónica. No toca variables globales ni la
   sección protegida de scroll/animación. */
.phero{padding:38px 0 26px}
.phero__inner{display:grid;gap:44px;grid-template-columns:1fr;align-items:center}
.phero__text .lead{max-width:52ch}
.phero__title{font-size:clamp(38px,6vw,68px);line-height:1.02;letter-spacing:-.02em;margin:10px 0 16px}
.phero__media img{width:100%;height:auto;border-radius:18px;display:block}


/* La barra de secciones se pega justo debajo del header fijo, no detrás de
   él: antes ambas se fijaban en top:0 y ésta, con menos z-index, quedaba
   tapada por el vidrio esmerilado de la barra superior. */
.localnav{position:sticky;top:var(--nav-h);z-index:90;background:rgba(7,9,13,.86);
  backdrop-filter:blur(12px);border-block:1px solid rgba(255,255,255,.07)}
.localnav .wrap{display:flex;gap:26px;overflow-x:auto;padding:13px 22px;scrollbar-width:none}
.localnav .wrap::-webkit-scrollbar{display:none}
.localnav a{font-size:13.5px;color:var(--txt-2);white-space:nowrap}
.localnav a:hover{color:#fff}

.strip{padding:26px 0;border-bottom:1px solid rgba(255,255,255,.07)}
.strip__row{display:flex;flex-wrap:wrap;gap:10px}
.strip__item{font-size:13px;color:var(--txt-2);border:1px solid rgba(255,255,255,.14);
  border-radius:999px;padding:7px 14px}

.pasos{list-style:none;display:grid;gap:22px;margin-top:30px}
.pasos li{border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:26px}
.pasos b{display:block;font-size:12px;letter-spacing:.14em;color:var(--txt-2);margin-bottom:12px}
.pasos h3{font-size:20px;margin-bottom:8px}
.pasos p{color:var(--txt-2);font-size:15px}
@media(min-width:820px){.pasos{grid-template-columns:repeat(3,1fr)}}

.media{margin-top:30px}
.media img{width:100%;height:auto;border-radius:16px;display:block}

/* `.cards` vive en css/styles.css: lo usan /guias/, los artículos y /soporte/,
   que no cargan esta hoja. Aquí quedaba sin estilo en todas ellas. */

/* Bloque de respuestas directas: pregunta como encabezado, respuesta corta y
   autosuficiente debajo. Pensado para lectura rápida y para que un buscador
   pueda extraer la respuesta sin perder contexto. */
.aeo{padding-block:clamp(56px,7vw,92px)}
.aeo__grid{display:grid;gap:20px;margin-top:26px}
.aeo__item{border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:26px 26px 24px;
  background:linear-gradient(180deg,rgba(255,255,255,.03),transparent)}
.aeo__item h2{font-size:clamp(18px,2.1vw,22px);letter-spacing:-.02em;margin-bottom:12px}
.aeo__item p{color:var(--txt-2);font-size:15.5px;max-width:62ch}
.aeo__item a{color:var(--blue-2);border-bottom:1px solid rgba(99,165,255,.35)}
.aeo__item a:hover{border-bottom-color:var(--blue-2)}
@media(min-width:900px){.aeo__grid{grid-template-columns:1fr 1fr;gap:22px}}