/* ===================================================================
   SERENNA — modo móvil (lote 3.81)
   Se carga el ÚLTIMO y solo actúa en pantallas de hasta 640 px. Letra algo más pequeña (≈ 15 % menos que
   en 3.80), cabeceras compactas, pie recogido en una sola fila, tarjetas y botones más afinados y barra
   inferior más baja. Los objetivos táctiles se mantienen en 44 px o más.
   Va en un fichero aparte: no toca el <style> de serena-home.html (huella de los PDF) ni serena-simple.css.
   =================================================================== */
@media (max-width:640px){

/* ---------- perfil simple (sx-*) ---------- */
.sx-shell{font-size:17px;line-height:1.5;padding:0 14px 96px}
.sx-top{padding:8px 2px 2px;gap:10px}
.sx-logo{width:48px;height:48px}
.sx-marca{font-size:28px}
.sx-volver{min-height:46px;padding:0 18px;margin:2px 0 8px;border-width:2px;border-radius:16px;font-size:17px;font-weight:700}
.sx-titulo,.sx-hola h1{font-size:25px;line-height:1.2;margin:4px 0 12px}
.sx-hola h1{text-align:center}
.sx-h2{font-size:21px;margin:0 0 8px}
.sx-h3{font-size:19px;margin:18px 0 8px}
.sx-p{font-size:16.5px;line-height:1.55;margin:0 0 10px}
.sx-nota{font-size:14.5px;margin:8px 0 12px}
.sx-aviso{font-size:16px;padding:12px 14px;border-radius:16px}
.sx-msg{font-size:15.5px;min-height:22px}
.sx-lb{font-size:16.5px;margin:12px 0 4px}
.sx-grande{font-size:50px}
.sx-card{padding:16px 16px;border-radius:20px;margin:0 0 12px}

/* botones y campos */
.sx-btn{min-height:52px;padding:0 22px;font-size:17px;border-radius:16px}
.sx-btn.big{min-height:58px;font-size:19px}
.sx-ta,.sx-inp,.sx-sel{font-size:16.5px;padding:11px 14px;border-radius:14px;border-width:2px;min-height:52px}
.sx-radio{font-size:16.5px;min-height:48px}
.sx-chip{font-size:15.5px;padding:6px 14px}
.sx-qtag{font-size:15px}
.sx-pill{font-size:15.5px;padding:7px 18px}
.sx-lista li{font-size:16.5px;padding:8px 2px}
.sx-estado{font-size:18px;min-height:28px}
.sx-ok{font-size:22px}
.sx-celebra{font-size:20px}
.sx-sonido{font-size:16.5px;min-height:48px}
.sx-tiempo{font-size:17px}
.sx-cita{font-size:18px}
.sx-frase{font-size:20px;padding:14px}
.sx-cupon{font-size:21px}

/* inicio: círculo de respiro y tres atajos */
.sx-respiro{width:min(54vw,212px);margin:6px auto 12px}
.sx-respiro-t{font-size:clamp(21px,6.2vw,27px)}
.sx-tres{gap:8px}
.sx-op{min-height:104px;border-radius:18px;padding:10px 4px 8px;gap:4px}
.sx-op .sx-ic{width:42px;height:42px}
.sx-op small{font-size:14px}
@media (min-width:360px){ .sx-op{min-height:112px;font-size:clamp(12px,3.3vw,15px)} }

/* tarjetas de opción */
.sx-tarjeta{padding:14px;border-radius:20px;gap:14px;border-width:2px}
.sx-tarjeta b{font-size:20px}
.sx-tarjeta em{font-size:15px;margin:3px 0 6px}
.sx-tarjeta .sx-ic{font-size:38px}
.sx-tarjeta .sx-ic-img{width:60px;height:60px}
.sx-an-c h3{font-size:20px}
.sx-an-c p{font-size:16px}
.sx-precio{font-size:19px}
.sx-badge{font-size:14px}
.sx-rec h3{font-size:19px}
.sx-rec p{font-size:16px}
.sx-rec-f{font-size:15px}

/* respiro, astral, tarot, oráculo, giro */
.sx-resp-t{font-size:21px}
.sx-play{min-height:72px;padding:0 32px;font-size:20px}
.sx-astro-h{font-size:19px}
.sx-glifo{font-size:34px}
.sx-gr{font-size:15px}
.sx-preg{font-size:17px}
.sx-carta-nom{font-size:21px}
.sx-animo{font-size:17px;padding:12px 14px}
.or-modo b{font-size:20px}
.or-modo small{font-size:15px}
.or-consent{font-size:15px}
.sx-modal-ic{font-size:60px}

/* informe y paneles heredados */
.sx-informe .meta-title{font-size:19px}
.sx-informe .meta-desc,.sx-informe .serena-muted{font-size:16px}
.sx-informe .chip{font-size:15px;padding:7px 12px}
.sx-informe .serena-section-title,.sx-shell .serena-section-title{font-size:20px}
.sx-shell .serena-qtext{font-size:21px}
.sx-shell .serena-field textarea,.sx-shell #serena-answer{font-size:17px;min-height:150px}
.sx-shell .serena-btn{min-height:54px;font-size:17px;padding:0 22px}
.sx-shell .serena-muted{font-size:16px}
.sx-shell .serena-msg,.sx-shell .serena-qtag{font-size:15.5px}

/* chat de Mi círculo */
.sx-m{font-size:16px;padding:7px 12px}
.sx-m-h b{font-size:15px}
.sx-m-h i,.sx-m-h small,.sx-m-o{font-size:13.5px}
.sx-priv{font-size:14.5px}
.sx-link{font-size:15.5px}
.sx-vacio{font-size:16px}
.sx-envio .sx-ta{font-size:16px}
.sx-chat .sx-h2{font-size:19px}
.sx-cg-n,.sx-cg-p,.sx-fund,.sx-cont-t{font-size:16px}

/* pie: idiomas y accesos recogidos en una fila de píldoras pequeñas */
.sx-pie{gap:8px;margin:22px 0 4px;padding-top:12px;justify-content:center}
.sx-pie .sx-langs{gap:4px}
.sx-pie .sx-lang,.sx-lang{min-width:44px;min-height:40px;border-width:2px;border-radius:12px;font-size:14px}
.sx-salir{min-height:40px;padding:0 13px;border-width:2px;border-radius:12px;font-size:14px;font-weight:600}

/* barra inferior más baja */
.sx-nav{padding:4px 8px calc(4px + env(safe-area-inset-bottom));gap:4px}
.sx-nb{min-height:54px;border-radius:14px}
.sx-nb-i{width:26px;height:26px}
.sx-nb-t{font-size:clamp(12px,3.3vw,14px)}

.sx-modoguia .sx-respiro-t small{font-size:14.5px}

/* aviso de instalar la app */
.sx-pwa{display:flex;align-items:flex-start;gap:12px;padding:14px 14px}
.sx-pwa-ic{font-size:30px}
.sx-pwa .sx-h2{font-size:18px;margin:0 0 4px}
.sx-pwa .sx-p{font-size:14.5px;margin:0 0 10px}
.sx-pwa .sx-btn{min-height:44px;padding:0 16px;font-size:15.5px;margin:0 6px 0 0}
.sx-pwa-caja{padding:20px 18px}
.sx-pwa-pasos li{font-size:18px}

/* ---------- inicio público (so-*) ---------- */
.so-movil .so-logo{width:min(40vw,150px);height:min(40vw,150px);margin:16px 0 4px;padding:7px}
.so-movil .so-eb{font-size:16px}
.so-movil .so-hero{padding:4px 20px 2px}
.so-movil .so-hero h1{font-size:21px;line-height:1.22;margin-top:4px}
.so-movil .so-cta{min-height:48px;font-size:16px;padding:0 24px;margin-top:10px}
.so-movil .so-hint{font-size:15px;margin-top:10px}
.so-movil .so-items{gap:16px 4px;padding:8px 12px 14px}
.so-movil .so-it img{width:min(22vw,84px);height:min(22vw,84px);border-width:3px}
.so-movil .so-lb{font-size:15px}
.so-movil .so-pie{padding:12px 14px calc(14px + env(safe-area-inset-bottom))}
.so .serena-lang button{min-width:42px;min-height:40px;padding:0 11px;font-size:14px}
.so-entrar{min-height:40px;padding:0 22px;font-size:15.5px}
.so-movil .so-pie .sh-pwa-lnk{margin-top:8px;min-height:40px;font-size:14.5px;padding:0 14px}
.so-legal,.so-movil .so-legal{font-size:12.5px;margin-top:8px}

/* hoja de contenido */
.so-movil .so-tab{min-height:46px;padding:6px 10px;font-size:15px}
.so-movil .so-x{width:44px;height:44px;font-size:17px}
.so-movil .so-cuerpo{padding:4px 16px 32px}
.so-movil .so-cuerpo .sh-h2{font-size:21px}
.so-cuerpo .sh-lead{font-size:16px}
.so-cuerpo .sh-mv p,.so-cuerpo .sh-box p,.so-cuerpo .sh-step p{font-size:15.5px}
.so-cuerpo .sh-box h3,.so-cuerpo .sh-step b{font-size:17px}
.so-cuerpo .sh-btn{min-height:46px;font-size:15.5px}
.so-cita{padding:16px 16px;border-radius:20px}
.so-cita p{font-size:17px}
.so-gratis-cta p{font-size:16px}
.so-gr-sel{gap:12px;grid-template-columns:minmax(0,1fr)}
.so-gr-card b{font-size:20px}
.so-gr-card small{font-size:15px}
.so-gr-volver{min-height:46px;font-size:16px}

/* accesos (login, registro) */
.so-flogo{width:min(36vw,128px);height:min(36vw,128px)}
.so-fcab{gap:10px;margin:0 0 14px}
.so-fcab .serena-lang button{min-height:40px;min-width:46px;padding:0 13px;font-size:14px}
}