.laser-explainer { background:#1f2a3d; color:#fff; padding-block:64px; }
.laser-explainer .laser-shell { width:100%; max-width:none; padding-inline:clamp(16px,4vw,64px); }
.laser-title { font:700 clamp(30px,3.2vw,48px)/1.15 var(--font-display)!important; margin:0 0 32px; color:#fff; }
.laser-videos { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; align-items:stretch; }
.laser-player { min-width:0; display:flex; flex-direction:column; padding:20px; border:1px solid #a8a6b0; border-radius:var(--r-globo); }
.laser-video-title { font:600 clamp(23px,2.1vw,32px)/1.2 var(--font-display); margin:0 0 20px; }
.laser-live,.laser-controls { display:none; }
.laser-plate { position:relative; width:100%; aspect-ratio:16/9; overflow:hidden; border-radius:12px; background:#1f2a3d; isolation:isolate; }
.laser-visual { position:absolute; inset:0; transform-origin:center; }
.laser-frame,.laser-frame img { display:block; width:100%; height:100%; }
.laser-frame img { object-fit:contain; }
.laser-frame-after,.laser-frame-sealed { position:absolute; inset:0; opacity:0; }
/* The vessel fade is confined below the intact mucosal surface, near the fiber. */
.laser-frame-sealed { mask-image:radial-gradient(ellipse 19% 9% at 36% 53%,#fff 15%,transparent 100%); }
.laser-effects,.laser-effects svg { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
/* Screen blend lives on the inner <g>; the swelling layer stays in normal blend. */
.laser-steps { list-style:none; margin:0; padding:0; min-width:0; }
.laser-steps>li { margin:0 0 28px; min-width:0; }
.laser-step-card { padding-top:16px; }
.laser-step-card h5 { color:#a778fd; font:700 clamp(26px,2.3vw,34px)/1.15 var(--font-display); margin:0 0 8px; }
.laser-step-card p { color:#e7f0fd; font:400 20px/1.45 var(--font-texto); margin:0; }
.laser-controls { flex-wrap:wrap; gap:12px; margin-top:20px; }
.laser-playback { display:flex; flex-wrap:wrap; gap:8px; }
.laser-controls button { min-height:44px; min-width:44px; border:1px solid #a8a6b0; border-radius:var(--r-mirilla); padding:0 14px; color:#fff; background:transparent; font:600 16px/1 var(--font-texto); cursor:pointer; }
.laser-controls button:focus-visible,.laser-benefit a:focus-visible { outline:2px solid #a778fd; outline-offset:4px; }
.laser-progress { flex-basis:100%; height:4px; background:#5d5a63; border-radius:var(--r-mirilla); overflow:hidden; }
.laser-progress span { display:block; height:100%; width:0; background:#a778fd; }
.laser-credit { color:#e7f0fd; font:400 12px/1.5 var(--font-texto); margin:20px 0 0; }
.laser-credit a { color:inherit; text-underline-offset:3px; }
.laser-benefits { margin-top:40px; padding-top:32px; border-top:1px solid #a8a6b0; }
.laser-benefits .laser-title { font-size:30px!important; margin-bottom:24px; }
.laser-benefit-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; }
.laser-benefit { min-width:0; }
.laser-benefit-icon { display:block; width:24px; height:24px; color:#ff72a0; margin-bottom:12px; }
.laser-benefit h4 { font:600 24px/1.2 var(--font-display); margin:0 0 12px; }
.laser-benefit p { font:400 18px/1.5 var(--font-texto); margin:0; color:#e7f0fd; }
.laser-benefit p+p { margin-top:12px; }
.laser-benefit a { color:#a778fd; font-size:15px; text-underline-offset:4px; }
@media(prefers-reduced-motion:no-preference) {
 .laser-enhanced .laser-live { display:block; }
 .laser-enhanced .laser-controls { display:flex; }
 .laser-enhanced .laser-static-figure { display:none; }
 .laser-enhanced .laser-steps>li { margin:0; }
 .laser-enhanced .laser-steps>li:not(.is-current) { display:none; }
 .laser-enhanced .laser-steps { min-height:164px; }
 .laser-enhanced .laser-credit { margin-top:auto; padding-top:20px; }
 /* Cine: viñeta, rótulo que entra con desenfoque, halo cuando el láser dispara. */
 .laser-enhanced .laser-plate::after { content:''; position:absolute; inset:0; pointer-events:none; background:radial-gradient(ellipse 78% 72% at 50% 50%,transparent 55%,#1f2a3d 100%); }
 .laser-enhanced .laser-steps>li.is-current .laser-step-card { animation:laser-caption .8s cubic-bezier(.2,.7,.2,1) both; }
 .laser-enhanced .laser-plate { transition:box-shadow .6s ease; }
 .laser-player[data-running="true"] { border-color:#a778fd; }
 .laser-player[data-laser="tejido"][data-step="3"] .laser-plate { box-shadow:0 0 48px #8341fc; }
 .laser-player[data-laser="anatomia"][data-step="3"] .laser-plate { box-shadow:0 0 40px #ff72a0; }
}
@keyframes laser-caption { from { opacity:0; transform:translateY(16px); filter:blur(6px); } to { opacity:1; transform:none; filter:none; } }
@media(max-width:1023px) {
 .laser-benefit-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .laser-player { padding:16px; }
 .laser-step-card p { font-size:19px; }
 .laser-enhanced .laser-steps { min-height:190px; }
}
@media(max-width:767px) {
 .laser-videos { grid-template-columns:minmax(0,1fr); }
 .laser-explainer { padding-block:40px; }
 .laser-player { padding:12px; }
 .laser-title { margin-bottom:24px; }
 .laser-video-title { font-size:26px; }
 .laser-playback { gap:6px; }
 .laser-playback button { padding:0 10px; font-size:15px; }
 .laser-enhanced .laser-steps { min-height:172px; }
}
@media(max-width:600px) { .laser-benefit-grid { grid-template-columns:minmax(0,1fr); } }
@media(prefers-reduced-motion:reduce), print {
 .laser-explainer .laser-live,.laser-explainer .laser-controls { display:none!important; }
 .laser-explainer .laser-static-figure { display:block!important; }
 .laser-explainer .laser-steps>li { display:block!important; margin-bottom:28px; }
 .laser-explainer .laser-steps { min-height:0!important; }
 .laser-explainer * { animation:none!important; transition:none!important; }
}