/* Approved editorial treatment: upper edge filled, content kept below. */
.tutoras.editorial-active .scene:not(.hero):not(#scene-indice):not(#scene-conclusiones)>.scene-inner>.eyebrow{opacity:0;font-size:clamp(13px,.8vw,20px);line-height:1.4;margin-bottom:clamp(28px,2.8vh,40px)}
.editorial-top{position:fixed;z-index:8;top:0;left:0;right:0;height:0;background:#23434d;color:#f7f7f0;overflow:hidden;isolation:isolate;pointer-events:none;opacity:0;transition:height .75s cubic-bezier(.22,.7,.25,1),opacity .25s ease}
.editorial-top.is-visible{opacity:1}
.editorial-top-label{position:absolute;z-index:1;display:flex;align-items:center;gap:20px;text-transform:uppercase;letter-spacing:.15em;white-space:nowrap;font-weight:500;transition:left .75s cubic-bezier(.22,.7,.25,1),top .75s cubic-bezier(.22,.7,.25,1);line-height:1.4}
.editorial-top-label .number{font-family:var(--serif);font-size:1.5em;font-style:italic;color:#c2d59a;line-height:.9;letter-spacing:0;padding-right:20px;border-right:1px solid #819997}
body.editorial-active:has(.editorial-top.is-visible) .presentation-menu{color:#f7f7f0}
@media(max-width:900px){.editorial-top-label{white-space:normal;max-width:85vw;font-size:11px!important;gap:12px;letter-spacing:.08em}.editorial-top-label .number{padding-right:12px}}
@media(prefers-reduced-motion:reduce){.editorial-top,.editorial-top-label{transition:none}}

/* Sparse outlined bubbles: transform/opacity only, clipped inside the ribbon. */
.editorial-bubble-window{position:absolute;inset:0;overflow:hidden;pointer-events:none;-webkit-mask-image:linear-gradient(to bottom,transparent,#000 16px,#000 calc(100% - 22px),transparent);mask-image:linear-gradient(to bottom,transparent,#000 16px,#000 calc(100% - 22px),transparent)}
.editorial-bubbles{--bubble-edge:clamp(96px,5vw,160px);position:absolute;top:0;left:0;width:100%;height:310px;pointer-events:none;-webkit-mask-image:linear-gradient(to right,transparent var(--bubble-safe-left,68vw),#000 calc(var(--bubble-safe-left,68vw) + 24px),#000 calc(100% - var(--bubble-edge) - 20px),transparent calc(100% - var(--bubble-edge)));mask-image:linear-gradient(to right,transparent var(--bubble-safe-left,68vw),#000 calc(var(--bubble-safe-left,68vw) + 24px),#000 calc(100% - var(--bubble-edge) - 20px),transparent calc(100% - var(--bubble-edge)))}
.editorial-bubbles i{
 position:absolute;left:var(--bubble-x);top:var(--bubble-y);width:var(--bubble-size);height:var(--bubble-size);
 border:1px solid #f5ffff7a;border-radius:50%;background:#f5ffff09;opacity:0;
 animation:editorialBubble var(--bubble-time) var(--bubble-delay) linear infinite;
 animation-play-state:paused
}
.editorial-top.is-visible .editorial-bubbles i{animation-play-state:running}
body:has(.scene.active.sequence-paused) .editorial-bubbles i{animation-play-state:paused}
@keyframes editorialBubble{
 0%{transform:translate3d(0,0,0);opacity:0}
 12%{opacity:.52}
 78%{opacity:.35}
 100%{transform:translate3d(var(--bubble-drift),-310px,0);opacity:0}
}
body.reduce-motion .editorial-bubbles{display:none}
@media(prefers-reduced-motion:reduce){.editorial-bubbles{display:none}}

/* Index → introduction: collect the same water background into the ribbon. */
.editorial-sea{position:absolute;inset:0;opacity:1;pointer-events:none;background-size:100vw 100vh;background-position:0 0;background-repeat:no-repeat}
.editorial-transfer{position:absolute;z-index:4;inset:0 0 auto;pointer-events:none;background-size:100vw 100vh;background-position:0 0;background-repeat:no-repeat}
.editorial-top.from-index{opacity:0!important;transition:none}
body.index-to-editorial #scene-indice{z-index:5;background:transparent;transform:none;transition:opacity .2s ease,visibility .2s}
body.index-to-editorial #scene-indice:before{opacity:0}
