/* Videoteca panorámica profesional V3 */
.video-main{background:radial-gradient(circle at 5% 16%,rgba(14,165,233,.08),transparent 24rem),radial-gradient(circle at 96% 48%,rgba(124,58,237,.08),transparent 26rem)}
.hero-videos{isolation:isolate;background:linear-gradient(125deg,#111936 0%,#4321a8 52%,#087da9 100%);box-shadow:0 24px 65px rgba(43,34,131,.26)}
.hero-videos:before{content:"";position:absolute;width:340px;height:340px;right:-105px;top:-170px;border:55px solid rgba(255,255,255,.09);border-radius:50%;z-index:-1;animation:videoOrb 8s ease-in-out infinite alternate}
.hero-videos:after{content:"";position:absolute;width:120px;height:120px;left:44%;bottom:-82px;border-radius:42% 58% 63% 37%;background:linear-gradient(135deg,rgba(255,122,53,.4),rgba(239,71,111,.3));z-index:-1;animation:videoOrb 6s ease-in-out infinite alternate-reverse}
.grados-panel{border:0;box-shadow:0 18px 48px rgba(29,43,66,.08)}
.grado-btn{border:1px solid transparent;box-shadow:0 8px 20px rgba(29,43,66,.06);transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}
.grado-btn:hover,.grado-btn.active{transform:translateY(-4px);box-shadow:0 15px 28px rgba(29,43,66,.12);border-color:color-mix(in srgb,var(--grado-color) 35%,white)}
.grado-numero{box-shadow:0 8px 18px color-mix(in srgb,var(--grado-color) 28%,transparent)}
.section-bar{padding:19px 21px;border-radius:19px;background:#fff;box-shadow:0 12px 32px rgba(29,43,66,.07)}
.videos-grid{display:grid;grid-template-columns:1fr;gap:28px}
.video-card{display:grid;grid-template-columns:minmax(0,1.38fr) minmax(330px,.62fr);min-height:390px;border:0;border-radius:29px;background:#fff;box-shadow:0 20px 52px rgba(24,36,62,.12);isolation:isolate}
.video-card:after{content:"";position:absolute;inset:0 0 auto;height:5px;background:linear-gradient(90deg,#8b5cf6,#0ea5e9,#22c55e);z-index:7}
.video-card:hover{transform:translateY(-7px);box-shadow:0 28px 70px rgba(24,36,62,.17)}
.video-number{top:20px;left:20px;width:52px;height:52px;background:linear-gradient(135deg,#7c3aed,#2563eb);border-width:3px;box-shadow:0 12px 28px rgba(74,54,200,.38)}
.video-frame{height:100%;min-height:390px;padding-top:0;border-radius:29px 0 0 29px;background:radial-gradient(circle at 50% 30%,#27395c,#08111f 68%)}
.video-frame:after{content:"";position:absolute;inset:auto 0 0;height:70px;background:linear-gradient(transparent,rgba(6,12,25,.5));pointer-events:none;z-index:2}
.video-frame iframe,.video-frame video{z-index:1}
.video-frame-label{position:absolute;top:21px;right:20px;z-index:5;display:inline-flex;align-items:center;gap:7px;padding:8px 11px;border:1px solid rgba(255,255,255,.22);border-radius:999px;background:rgba(9,16,34,.7);color:#fff;font-size:.65rem;font-weight:900;letter-spacing:.06em;text-transform:uppercase;backdrop-filter:blur(9px);box-shadow:0 8px 25px #0003}
.video-frame-label i{color:#5ee7bd}
.video-body{position:relative;display:flex;flex-direction:column;justify-content:center;padding:31px 29px;background:linear-gradient(155deg,#fff,#fbfaff)}
.video-body:before{content:"";position:absolute;width:115px;height:115px;right:-55px;top:-50px;border:22px solid rgba(124,58,237,.055);border-radius:50%}
.video-chip{width:max-content;color:#6740d8;background:#f0eaff}
.video-body h3{font-size:clamp(1.2rem,2vw,1.65rem);letter-spacing:-.025em}
.video-description{font-size:.87rem}
.instructions{background:linear-gradient(135deg,#fff8e9,#fff2e5);border-color:#f8dfbc}
.video-actions{margin-top:20px}
.btn-video{min-height:43px;border-radius:13px}
.btn-comment{color:#5f3dc4!important;background:#f1ecff;border:1px solid #ded2ff}
.btn-comment b{display:grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:#fff;color:#5f3dc4;font-size:.64rem}
.btn-comment:hover{color:#fff!important;background:linear-gradient(135deg,#7c3aed,#4f46e5);box-shadow:0 9px 20px rgba(99,62,210,.24)}
.btn-comment:hover b{color:#5f3dc4}
@keyframes videoOrb{to{transform:translate(26px,22px) rotate(20deg) scale(1.06)}}
@media(max-width:950px){.video-card{grid-template-columns:1fr;min-height:0}.video-frame{height:auto;min-height:0;padding-top:56.25%;border-radius:25px 25px 0 0}.video-body{padding:25px}.videos-grid{gap:22px}}
@media(max-width:640px){.hero-videos{padding:30px 22px}.video-card{border-radius:22px}.video-frame{border-radius:22px 22px 0 0}.video-body{padding:21px 18px}.video-number{top:14px;left:14px;width:45px;height:45px}.video-frame-label{top:16px;right:13px;font-size:.57rem}.video-actions{display:grid;grid-template-columns:1fr 1fr}.btn-video{padding:9px 8px}.btn-youtube{grid-column:1/-1}}
@media(prefers-reduced-motion:reduce){.hero-videos:before,.hero-videos:after{animation:none}.video-card,.grado-btn{transition:none}}