/* Home only. Scene sizing/approved Payasito remain unchanged from 20261003-r1. */
:root{--fit-inicio-build:20261007-programacion}
.fit-home{margin:0;background:var(--surface-header);color:var(--text);font-family:var(--font-family)}
.fit-home *{box-sizing:border-box}
.fit-home header{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.6rem 4vw;color:var(--text-inverse)}
.fit-home .brand{color:inherit;font-size:1.4rem;font-weight:700;text-decoration:none}
.fit-home .brand span{color:var(--brand-accent)}
.fit-home .preview{background:var(--notice-background);color:var(--notice-text);text-align:center;padding:.4rem 1rem;font-size:.8rem}
.fit-home main{width:100%;margin:0}
.fit-stage{position:relative;width:100%;height:calc(100svh - 88px);min-height:480px;overflow:hidden}
.fit-stage__scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:left top}
/* Desktop axis is exactly 50% of the complete scene, independent of the puppet. */
.fit-flow{position:absolute;left:0;width:100%;top:12%;height:71%;touch-action:pan-y}
.fit-poster{position:absolute;left:50%;top:50%;width:var(--poster-width,29%);height:var(--poster-height,100%);padding:0;border:0;background:transparent;cursor:pointer;transform:translate(-50%,-50%) translateX(var(--offset,0px)) scale(var(--scale,1));transition:transform 380ms ease,width 380ms ease,height 380ms ease,opacity 380ms ease;opacity:1}
.fit-poster__art{position:relative;display:block;width:100%;height:100%;filter:brightness(var(--brightness,1));transition:transform 380ms ease,filter 380ms ease;box-shadow:0 5px 12px color-mix(in srgb,var(--color-negro) 20%,transparent)}
.fit-poster img{display:block;width:100%;height:100%;object-fit:contain}
/* The outer edge stays near the viewer; the inner edge recedes into the center. */
.fit-poster[data-side="left"] .fit-poster__art{transform-origin:left center;transform:perspective(1100px) rotateY(var(--tilt));--shade-direction:90deg}
.fit-poster[data-side="right"] .fit-poster__art{transform-origin:right center;transform:perspective(1100px) rotateY(var(--tilt));--shade-direction:270deg}
.fit-poster__art::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:1;background:linear-gradient(var(--shade-direction,90deg),transparent 0%,color-mix(in srgb,var(--color-negro) 8%,transparent) 35%,color-mix(in srgb,var(--color-negro) 30%,transparent) 100%);transition:opacity 380ms ease}
.fit-poster[data-side="center"] .fit-poster__art{transform:perspective(1100px) rotateY(0deg);transform-origin:center}
.fit-poster[data-side="center"] .fit-poster__art::after{opacity:0}
.fit-poster[hidden],.fit-poster.offstage{visibility:hidden;pointer-events:none;opacity:0}
.fit-controls{position:absolute;left:17%;width:66%;bottom:3%;padding:.7rem;background:color-mix(in srgb,var(--surface-card) 92%,transparent);border-radius:var(--radius-card);display:flex;gap:.7rem;justify-content:center;align-items:center;flex-wrap:wrap}
.fit-controls label{display:flex;align-items:center;gap:.5rem}
.fit-home button:not(.fit-poster),.fit-home select{min-height:44px;padding:.6rem .8rem;font:inherit;border:1px solid var(--border-control);border-radius:var(--radius-control)}
.fit-home button:not(.fit-poster){background:var(--button-background);color:var(--button-text);cursor:pointer}
.fit-home button:disabled{opacity:.45;cursor:default}
.fit-home :focus-visible{outline:3px solid var(--focus-outer);outline-offset:4px;box-shadow:0 0 0 3px var(--focus-inner)}
.fit-home footer{color:var(--text-inverse);text-align:center;padding:.55rem 1rem;font-size:.8rem}
.visually-hidden,.fit-home .skip{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.fit-home .skip:focus{position:relative;clip-path:none;width:auto;height:auto;display:block;background:var(--surface-card);padding:1rem}
.fit-home noscript,#consulta-status{padding:1rem;background:var(--alert-background);color:var(--alert-text)}
#consulta-status[hidden]{display:none}
@media(min-width:701px) and (max-width:1050px){.fit-flow{left:12%;width:88%}.fit-controls{left:8%;width:84%}}
/* Preserve the approved phone center (35% + 61%/2) and scene behavior. */
@media(max-width:700px){.fit-home header{font-size:.75rem}.fit-home .brand{font-size:1rem}.fit-stage{height:calc(100svh - 102px);min-height:480px}.fit-flow{left:35%;width:61%;top:18%;height:59%}.fit-controls{left:3%;width:94%;bottom:2%;gap:.35rem;font-size:.75rem;padding:.45rem}.fit-controls label{gap:.25rem}.fit-home button:not(.fit-poster),.fit-home select{padding:.4rem}}
@media(prefers-reduced-motion:reduce){.fit-poster,.fit-poster__art,.fit-poster__art::after{transition:none}}
/* Overlay belongs to the transformed artwork, above the image pixels. */
.fit-poster__art{isolation:isolate;filter:none}.fit-poster__art img{position:relative;z-index:0}
.fit-poster__art::after{z-index:1;background:linear-gradient(var(--shade-direction,90deg),transparent,color-mix(in srgb,var(--color-negro) calc(var(--shade-strength,.12) * 100%),transparent))}
@media(min-width:701px) and (orientation:portrait){.fit-flow{left:35%;width:61%;top:18%;height:59%}.fit-controls{left:3%;width:94%}}

/* Reserve one action row without changing poster art, controls or scene assets. */
.fit-action-dock{position:absolute;left:17%;width:66%;bottom:3%;display:grid;gap:.5rem}
.fit-action-dock .fit-controls{position:static;width:100%;margin:0}
.fit-programme-action{display:flex;justify-content:center}
.fit-programme-action #fit-programme{min-width:10rem;font-weight:700}
.fit-flow{height:calc(71% - 56px)}
@media(min-width:701px) and (max-width:1050px){.fit-action-dock{left:8%;width:84%}}
@media(max-width:700px){.fit-action-dock{left:3%;width:94%;bottom:2%}.fit-flow{height:calc(59% - 56px)}}
@media(min-width:701px) and (orientation:portrait){.fit-action-dock{left:3%;width:94%}.fit-flow{height:calc(59% - 56px)}}