/* Correcciones Etapa 3.1: SOLO pantallas pequeñas; escritorio intacto. */
@media(max-width:760px){
  html,body{max-width:100%;overflow-x:clip}
  header nav{gap:10px 13px!important}
  header nav a{font-size:clamp(11px,2.9vw,13px)!important;white-space:nowrap}
  header .actions{flex-wrap:wrap}
  /* About: mostrar los pilares como elementos reales, sin recortar la cuarta columna. */
  body[data-page="about"] main .hero{height:clamp(450px,128vw,550px)!important;min-height:0!important;aspect-ratio:auto!important;overflow:hidden!important}
  body[data-page="about"] .hero .visual{background-size:auto 100%!important;background-position:left center!important}
  body[data-page="about"] .features{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body[data-page="about"] .feature{min-width:0;padding:20px 8px;border-bottom:1px solid #71531f}
  body[data-page="about"] .feature strong{font-size:13px}
  body[data-page="about"] .feature small{font-size:10px;letter-spacing:0}
  /* Vision: ampliar el lado que contiene el mensaje y ofrecer imagen completa. */
  body[data-page="vision"] .vision-image{width:100%!important;height:clamp(290px,90vw,420px)!important;object-fit:cover!important;object-position:left center!important}
  body[data-page="vision"] .rey-vision-full{display:block!important;text-align:center;margin:14px auto 0;padding:10px 14px;width:max-content;max-width:90%;border:1px solid #d6a33e;border-radius:22px;color:#ffd07a;font-size:13px}
  body[data-page="vision"] .vision-panel{padding-top:28px!important}
  /* Asistente: evitar que tape toda la pantalla y conservar acceso al teclado. */
  .rey-chat-vip{width:calc(100vw - 24px)!important;right:12px!important;bottom:75px!important;max-height:min(66dvh,520px)!important}
  .rey-chat-vip .rey-chat-body{min-height:70px!important}
  .rey-chat-vip .rey-chat-compose{flex-shrink:0}
  .rey-chat-vip .rey-chat-compose input{font-size:16px!important}
  .rey-chat-launch{width:52px!important;height:52px!important;right:12px!important;bottom:12px!important}
  footer,.foot{overflow-wrap:anywhere}
}
@media(min-width:761px){.rey-vision-full{display:none!important}}

/* Etapa 3.2: evitar repetir pilares incluidos en el arte de About. */
@media(max-width:760px){
 body[data-page="about"] main .hero{height:clamp(350px,100vw,430px)!important;overflow:hidden!important}
 body[data-page="about"] .hero .visual{background-size:auto clamp(510px,138vw,620px)!important;background-position:left top!important}
 body[data-page="about"] .features{display:grid!important}
 body[data-page="about"] .feature{overflow:hidden}
 /* Imagen panorámica: botón de lectura en ventana independiente. */
 body[data-page="vision"] .rey-vision-full{min-height:44px;display:flex!important;align-items:center;justify-content:center}
}
