/* esquemas.css — estilos de los esquemas interactivos (esquemas.js) */
.esquema{background:#F7F4EC;border:1px solid #CFCABD;padding:1rem;margin:1.8rem 0}
.esquema .esq-cuerpo svg{width:100%;height:auto;display:block}
.esquema .et{font-family:"Source Sans 3",system-ui,sans-serif;font-size:15px;font-weight:600;fill:#0A0F11}
.esquema .et.sub{font-size:13px;font-weight:400;fill:#2C3A3D}
.esquema .guia{stroke:#2C3A3D;stroke-width:1.4;fill:none;stroke-dasharray:3 3}
.esquema .oculto{opacity:0;transition:opacity .4s}
.esquema .visible{opacity:1}
.esquema .curva{transition:opacity .3s}
.esq-controles{display:grid;grid-template-columns:1fr;gap:.8rem;margin-top:1rem;align-items:center}
@media(min-width:40rem){.esq-controles{grid-template-columns:auto 1fr auto}}
.esq-botones,.esq-seg,.esq-leyenda{display:flex;gap:.5rem;flex-wrap:wrap}
.esq-controles button{font-family:"Source Sans 3",system-ui,sans-serif;font-weight:600;font-size:.98rem;padding:.55rem 1rem;border:2px solid #123338;background:#123338;color:#FFF;cursor:pointer;border-radius:2px;line-height:1.2}
.esq-controles button.sec,.esq-seg button,.esq-leyenda button{background:transparent;color:#123338}
.esq-seg button[aria-pressed="true"]{background:#123338;color:#FFF}
.esq-leyenda button{border-color:#CFCABD;display:inline-flex;align-items:center;gap:.5rem;font-weight:500}
.esq-leyenda button[aria-pressed="false"]{opacity:.45}
.esq-leyenda i{display:inline-block;width:.9rem;height:.9rem;border-radius:50%}
.esq-controles button:hover{opacity:.88}
.esq-controles button:focus-visible{outline:3px solid #B87A1E;outline-offset:2px}
.esq-desl label{font-size:.92rem;font-weight:600;color:#2C3A3D;display:block;margin-bottom:.2rem}
.esq-desl input[type=range]{width:100%;accent-color:#123338}
.esq-valor{font-weight:700;font-size:1.1rem;color:#123338;min-width:7rem;text-align:right}
.esq-lectura{margin-top:.9rem;padding:.9rem 1.1rem;background:#F7E8CB;border-left:4px solid #B87A1E;font-size:1.02rem;line-height:1.5;min-height:3.4rem}
.esq-lectura strong{color:#6E4306}
.esq-nota{font-size:.92rem;color:#2C3A3D;margin:.6rem 0 0}
.esquema noscript p{margin:0;font-size:1rem;color:#2C3A3D}
@media(prefers-reduced-motion:reduce){.esquema .oculto,.esquema .curva{transition:none}}
@media print{.esq-controles{display:none}}

/* --- video de YouTube con carga diferida --- */
.video{background:#F7F4EC;border:1px solid #CFCABD;padding:1rem;margin:1.8rem 0}
.video-marco{position:relative;aspect-ratio:16/9;background:#0A0F11;overflow:hidden}
.video-marco img{width:100%;height:100%;object-fit:cover;display:block;opacity:.92}
.video-marco iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video-play{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.7rem;background:transparent;border:0;cursor:pointer;color:#FFF;font:inherit;width:100%}
.video-play span{display:inline-flex;align-items:center;justify-content:center;width:4.4rem;height:4.4rem;border-radius:50%;background:#123338;border:3px solid #F7E8CB;transition:transform .15s}
.video-play span::after{content:"";display:block;width:0;height:0;border-left:1.4rem solid #F7E8CB;border-top:.85rem solid transparent;border-bottom:.85rem solid transparent;margin-left:.3rem}
.video-play:hover span{transform:scale(1.06)}
.video-play:focus-visible{outline:3px solid #B87A1E;outline-offset:-3px}
.video-play b{font-weight:600;font-size:1.02rem;text-shadow:0 1px 6px rgba(0,0,0,.7);padding:.3rem .8rem;background:rgba(10,15,17,.45);border-radius:2px}
.video figcaption{font-size:1rem;color:#2C3A3D;margin-top:.85rem;line-height:1.5}
