/* Generado por tools/proto2wp/convertir.mjs desde Inicio.html — no editar. Ámbito: body.alsis-p-t01. */
/* 1) CSS local de la página que no está en prototipo.css (sin las fuentes, que declara theme.json, ni las r-*), acotado sin añadir especificidad. */

/* 2) Estilos en línea subidos a clase (especificidad 0 + !important, como el atributo style). */
:where(.alsis-p-t01 .alsis-t01-e1){position:relative!important;isolation:isolate!important}
:where(.alsis-p-t01 .alsis-t01-e2){font-size:clamp(52px, 8.4vw, 132px)!important;line-height:0.93!important;font-weight:400!important;letter-spacing:-0.042em!important;max-width:13ch!important;text-wrap:balance!important;font-style:normal!important;font-family:"Hubot Sans", "Mona Sans", system-ui, sans-serif!important}
:where(.alsis-p-t01 .alsis-t01-e3){height:259px!important}
:where(.alsis-p-t01 .alsis-t01-e4){left:877px!important}
:where(.alsis-p-t01 .alsis-t01-e5){overflow-x:clip!important}
:where(.alsis-p-t01 .alsis-t01-e6){justify-content:center!important}
:where(.alsis-p-t01 .alsis-t01-e7){margin-top:28px!important}
:where(.alsis-p-t01 .alsis-t01-e8){left:62%!important;top:8%!important}
:where(.alsis-p-t01 .alsis-t01-e9){left:4%!important;top:74%!important}
:where(.alsis-p-t01 .alsis-t01-e10){border-bottom:1px solid var(--line)!important}
/* 3) Reglas responsive r-* propias de la página: van después y siguen ganando. */
@media (max-width:600px){:where(.alsis-p-t01) .r-h1{font-size:52px!important;line-height:.93!important}}
@media (max-width:700px){:where(.alsis-p-t01) .r-readout{left:auto!important}}
@media (max-width:600px){:where(.alsis-p-t01) .hero h1.r-h1{font-size:52px!important;line-height:.93!important}}

/* manual (ola 2, T01): reglas escritas a mano, no las genera el conversor; reaplicar si se vuelve a convertir.
   Las fotos van en figure.wp-block-image: sin el margen de 1em del núcleo y llenando su caja, como los div del prototipo
   (mismo arreglo que t04.css, t06.css y t15.css). */
:where(.alsis-p-t01) .hero>.wp-block-image.hero-bg{margin:0}
:where(.alsis-p-t01) .pcard>.wp-block-image.media{margin-bottom:0}
:where(.alsis-p-t01) .photo>.wp-block-image,:where(.alsis-p-t01) .annot>.wp-block-image{margin:0;height:100%}
:where(.alsis-p-t01) .photo>.wp-block-image img,:where(.alsis-p-t01) .annot>.wp-block-image img{width:100%;height:100%;object-fit:cover;display:block}

/* Señal con lupa (alsis/senal, Inicio.html:108-131). El lienzo mide 259 px a cualquier ancho (style del prototipo, :109).
   El rótulo del umbral es HTML (en el prototipo, <text> del SVG en x = 4 % e y = umbral − 10, :111). El panel arranca
   donde lo deja la lupa en reposo (82 %): a su izquierda, 24 px + 280 px de ancho (el prototipo lo fija en left:877px a
   1440); view.js lo mueve con la lupa. Las lecturas (ol.lecturas) se ven sin JS; con JS quedan para lectores de pantalla. */
:where(.alsis-p-t01) .signal .cvw{height:259px}
:where(.alsis-p-t01) .signal .umbral{position:absolute;left:max(20px,4%);top:calc(50% - 20px);font:400 12px/1 var(--font-body);color:rgba(163,171,198,.8);white-space:nowrap;pointer-events:none}
@media (min-width:701px){:where(.alsis-p-t01) .signal .readout{left:max(12px,calc(82% - 304px))}}
:where(.alsis-p-t01) .signal .lecturas{list-style:none;margin:16px 0 0;padding:0 var(--gut);display:grid;gap:8px;font-size:14px;line-height:1.45;color:var(--d-ink-2)}
:where(.alsis-p-t01) .signal .lecturas b{color:var(--d-ink);font-weight:500}
:where(html.js .alsis-p-t01) .signal .lecturas{position:absolute;top:0;left:0;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

/* Qué medimos (Inicio.html:170-188) con pestañas de verdad: cada panel lleva su frase, su enlace y su foto. Con JS solo
   se ve el panel elegido y sus piezas ocupan, con display:contents, la misma rejilla del prototipo (texto a la izquierda,
   centrado en el alto de la foto; las pestañas debajo del enlace). Sin JS, una columna con todos los paneles. */
:where(html.js .alsis-p-t01) .frase>div:has(>.tabs[role="tablist"]),:where(html.js .alsis-p-t01) .frase [role="tabpanel"]:not([hidden]){display:contents}
:where(html.js .alsis-p-t01) .frase{row-gap:0;grid-template-rows:1fr auto auto auto auto 1fr;grid-template-areas:". foto" "k foto" "frase foto" "ir foto" "pest foto" ". foto";align-items:start}
:where(html.js .alsis-p-t01) .frase>.fr-k{grid-area:k}
:where(html.js .alsis-p-t01) .frase .sayit{grid-area:frase}
:where(html.js .alsis-p-t01) .frase .go{grid-area:ir}
:where(html.js .alsis-p-t01) .frase .tabs{grid-area:pest}
:where(html.js .alsis-p-t01) .frase .photo{grid-area:foto}
@media (max-width:900px){
  :where(html.js .alsis-p-t01) .frase{grid-template-rows:none;grid-template-areas:"k" "frase" "ir" "pest" "foto"}
  :where(html.js .alsis-p-t01) .frase .photo{margin-top:clamp(40px,7vw,120px)}
}
:where(html:not(.js) .alsis-p-t01) .frase{grid-template-columns:minmax(0,1fr)}

/* .btn.block del prototipo (Inicio.html:159-161, bundle.css «.btn.block{width:100%}»): en WP la clase queda en el
   envoltorio .wp-block-button; el botón ocupa todo el ancho de la tarjeta como en el prototipo. */
:where(.alsis-p-t01) .wp-block-buttons:has(>.wp-block-button.block),:where(.alsis-p-t01) .wp-block-button.block,:where(.alsis-p-t01) .wp-block-button.block>.btn{width:100%}
