@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Montserrat:wght@600;700;800;900&display=swap');
:root{--deep:#061c31;--blue:#0c4169;--gold:#ffdb53;--grass:#167a45;--red:#a60821;--white:#f8fdff;font-family:'DM Sans',Arial,sans-serif;color:var(--white)}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--deep)}button,input,textarea{font:inherit}button{cursor:pointer}a{color:#ffe572}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #ffdf58;outline-offset:3px}
#app,.welcome,.stage{position:relative;width:100%;height:100vh;height:100dvh;min-height:400px;overflow:hidden}.welcome-background{position:absolute;inset:0;background:url('bienvenida-jarabacoa.jpg') center center/cover no-repeat;filter:saturate(1.05)}.welcome-background:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.04),transparent 35%,rgba(0,0,0,.03))}.welcome-mobile-heading{display:none}
.welcome-bottom{position:absolute;left:0;right:0;bottom:0;z-index:2;height:35%;min-height:262px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:17px 20px max(16px,env(safe-area-inset-bottom));background:linear-gradient(180deg,rgba(4,36,34,.98),rgba(2,20,31,.99) 38%,#03101c 100%);border-top:2px solid rgba(255,222,72,.6);box-shadow:0 -18px 60px #0008}.welcome-caption{font-weight:800;font-size:clamp(16px,2.2vw,27px);letter-spacing:.01em;text-shadow:0 2px 9px #000}.count-wrapper{display:flex;align-items:center;justify-content:center;min-width:130px;background:linear-gradient(180deg,#137e2e,#04551e);border:2px solid #e4bb46;border-radius:99px;padding:2px 42px;box-shadow:0 3px 15px #0008,inset 0 1px 8px #c8fa6788}.count-number{font-family:Montserrat,Arial,sans-serif;font-size:clamp(34px,5vw,58px);line-height:1.06;font-weight:900;color:white;text-shadow:1px 3px 0 #07371f}.upcoming{color:#ffdd40;letter-spacing:.12em;font-family:Montserrat,sans-serif;font-size:clamp(13px,1.6vw,19px);font-weight:900}.enter-btn{margin-top:6px;display:flex;gap:28px;align-items:center;justify-content:center;border-radius:100px;padding:12px 35px;background:linear-gradient(180deg,#e53638,#a80d17 56%,#76000b);border:2px solid #ffdb76;box-shadow:0 7px 25px #0009,inset 0 1px 1px white;color:white;font-family:Montserrat,sans-serif;font-size:clamp(14px,1.7vw,20px);font-weight:900;letter-spacing:.02em;transition:transform .2s,filter .2s}.enter-btn:hover{transform:translateY(-2px);filter:brightness(1.13)}.enter-btn span{font-size:26px}.welcome-privacy{font-size:11px;color:#aec0c8;margin-top:2px}.welcome-privacy a{color:#dbdbe9}
.stage{background:#041a2e}.slide-frame{position:absolute;inset:0;opacity:0;transform:scale(1.012);transition:opacity 900ms ease,transform 8s linear;pointer-events:none}.slide-frame.visible{opacity:1;transform:scale(1);pointer-events:auto}.slide-frame img,.slide-frame video{display:block;width:100%;height:100%;object-fit:cover;object-position:center}.slide-frame:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#03172791,transparent 20%,transparent 72%,#0414268e);pointer-events:none}.stage-topline{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:22px 28px;z-index:5;pointer-events:none;gap:10px}.brand-mark{font-family:Montserrat,Arial,sans-serif;font-size:clamp(12px,1.7vw,22px);font-weight:900;text-shadow:0 2px 6px #000a}.brand-mark .signal{color:#f23e43;letter-spacing:-5px;margin-right:10px}.brand-mark em{color:var(--gold);font-style:italic}.soon-chip{font-size:11px;letter-spacing:.14em;border:1px solid #f4bd5b99;background:#103225a9;color:#ffe59c;padding:9px 12px;border-radius:18px;font-weight:800}.stage-footer{position:absolute;z-index:5;bottom:max(20px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);display:flex;gap:18px;align-items:center;justify-content:center}.control{width:38px;height:38px;display:grid;place-items:center;border-radius:100%;background:#03172788;border:1px solid #ffffff99;color:white;font-size:34px;line-height:1;transition:background .2s}.control:hover{background:#29648c}.slide-dots{display:flex;align-items:center;gap:8px}.slide-dots button{background:#ffffff99;border:0;width:8px;height:8px;padding:0;border-radius:100%;transition:all .2s}.slide-dots button.active{background:#ffcc36;width:26px;border-radius:6px}.suggestion-open{position:absolute;right:25px;bottom:max(20px,env(safe-area-inset-bottom));z-index:8;color:#fff;border:1px solid #f9cf7a;background:linear-gradient(140deg,#cf1425,#8f0e1b);border-radius:99px;padding:14px 18px;font-weight:800;box-shadow:0 5px 25px #0009}.audio-toggle{position:absolute;z-index:7;bottom:90px;left:23px;background:#0009;color:#fff;border:1px solid #ffea91;padding:9px 13px;border-radius:18px}
.modal[hidden],.stage[hidden]{display:none}.modal{position:fixed;inset:0;display:grid;place-items:center;z-index:50;padding:12px;overflow:auto}.modal-shade{position:fixed;inset:0;background:#001324d9;backdrop-filter:blur(9px)}.modal-content{position:relative;width:min(100%,500px);max-height:min(95dvh,870px);overflow:auto;background:linear-gradient(145deg,#143b4a,#071e33);border:1px solid #7b989b8a;border-radius:22px;padding:28px;box-shadow:0 20px 60px #000a}.modal-close{position:absolute;right:18px;top:13px;background:none;color:#c9d9df;border:0;font-size:31px}.modal-flower{font-size:40px;color:#ffc844}.eyebrow{color:#ffe55f;letter-spacing:.18em;font-size:11px;font-weight:900}.modal-content h2{font-family:Montserrat,sans-serif;font-weight:900;font-size:27px;margin:3px 0 12px}.modal-content>p:not(.eyebrow){color:#c3d5df;line-height:1.6;margin:0 0 20px}.modal-content label{display:block;font-weight:700;font-size:13px;margin:14px 0}.modal-content label small{color:#a0b8c0;font-weight:400}.modal-content input,.modal-content textarea{background:#051727;border:1px solid #4b6770;color:#fff;display:block;width:100%;margin-top:7px;border-radius:10px;padding:12px;resize:vertical}.modal-content input::placeholder,.modal-content textarea::placeholder{color:#78909a}.send-btn{width:100%;margin-top:7px;border:0;border-radius:12px;background:linear-gradient(90deg,#f5b72d,#ffdc68);font-weight:900;color:#222a24;padding:15px}.feedback-result{font-weight:700;font-size:14px}.modal-content>small{color:#afbdc8;line-height:1.6}.privacy-body{overflow:auto;height:auto;min-height:100vh;background:#092236}.privacy-box{max-width:760px;margin:40px auto;padding:30px;line-height:1.8}.privacy-box h1{color:#ffe073}
@media(max-width:900px){.welcome-background{background-position:center;background-size:cover}.welcome-bottom{height:37%;min-height:250px}.suggestion-open span{display:none}.suggestion-open{padding:15px 18px;font-size:20px}.stage-footer{left:48%;gap:12px}}@media(max-width:640px){.welcome-background{background-position:50% center;filter:brightness(.45) saturate(1.25)}.welcome-mobile-heading{position:absolute;display:flex;z-index:1;left:10px;right:10px;top:13%;align-items:center;flex-direction:column;gap:8px;text-align:center;text-shadow:0 4px 15px #000;font-family:Montserrat,Arial,sans-serif}.welcome-mobile-heading span{font-size:clamp(22px,7vw,36px);font-weight:800;font-style:italic}.welcome-mobile-heading strong{font-size:clamp(31px,10vw,50px);line-height:1.13;color:#ffdd45;font-weight:900}.welcome-mobile-heading em{color:#fff}.welcome-mobile-heading small{font-size:12px;letter-spacing:.08em;background:#03632c;padding:7px 11px;border-radius:12px}.welcome-bottom{height:46%;min-height:260px;padding:15px 10px 20px;gap:8px}.welcome-caption{font-size:17px}.count-number{font-size:50px}.enter-btn{font-size:15px;padding:13px 22px;gap:10px}.upcoming{font-size:15px}.stage-topline{padding:16px 14px}.brand-mark{font-size:13px}.stage-footer{bottom:25px;left:43%;gap:9px}.control{width:32px;height:32px;font-size:26px}.suggestion-open{right:14px;bottom:20px}.soon-chip{padding:6px 8px;font-size:9px}}
@media(max-height:600px) and (min-width:700px){.welcome-bottom{min-height:195px;height:40%;gap:1px;padding:6px 10px}.count-number{font-size:35px}.count-wrapper{padding:0 28px}.enter-btn{padding:7px 25px;margin-top:2px}.welcome-privacy{font-size:9px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}

@media(max-width:640px){.welcome-mobile-heading .mobile-greeting{font-family:'DM Sans',Arial,sans-serif;font-size:14px;font-weight:600;line-height:1.45;max-width:320px;color:#fff}}
@media(max-width:640px){
 .welcome-background{filter:blur(11px) brightness(.30) saturate(1.5);transform:scale(1.13);background-position:center center}
 .welcome-mobile-heading{top:12%;gap:14px}
 .welcome-mobile-heading .mobile-greeting{font-style:normal!important;font-size:14px!important;line-height:1.55!important;max-width:320px;font-weight:600!important;text-shadow:0 2px 5px #000}
 .welcome-mobile-heading strong{color:#ffdb46;text-shadow:0 4px 14px #000}
}

/* JARABACOA RADIO V2 — movimiento cinematográfico independiente, sin GIF ni deformación de texto */
.welcome{isolation:isolate}
.welcome-background{background-image:url('bienvenida-jarabacoa.jpg');background-size:cover;background-position:center center;filter:saturate(1.02)}
.welcome-background::after{background:linear-gradient(180deg,transparent 55%,rgba(3,19,23,.23) 72%,rgba(2,12,18,.66) 100%)}
.river-scene{position:absolute;z-index:1;left:0;right:0;bottom:0;height:34%;background:url('rio-jarabacoa.webp') center center/cover no-repeat;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.7) 18%,#000 38%);mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.7) 18%,#000 38%);overflow:hidden}
.river-scene:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(1,26,38,.27),transparent 52%),repeating-linear-gradient(169deg,transparent 0px,transparent 35px,rgba(225,247,255,.11) 36px,transparent 47px);mix-blend-mode:screen;animation:jr-water-light 8.5s ease-in-out infinite alternate;will-change:transform,opacity}
.river-flow{position:absolute;inset:-3% -5%;background:linear-gradient(115deg,transparent 16%,rgba(168,232,255,.10) 31%,transparent 46%,rgba(255,255,255,.075) 59%,transparent 76%);filter:blur(3px);animation:jr-water-flow 9s linear infinite;will-change:transform}
.scene-paraglider{position:absolute;z-index:2;pointer-events:none;background-position:center;background-repeat:no-repeat;background-size:contain;will-change:transform}
.paraglider-left{left:13.2%;top:21.4%;width:8.85%;height:14.55%;background-image:url('parapente-izquierdo.png');animation:jr-glide-left 18s ease-in-out infinite alternate}
.paraglider-right{left:80.6%;top:12.8%;width:10.26%;height:20.1%;background-image:url('parapente-derecho.png');animation:jr-glide-right 21s ease-in-out infinite alternate}
.scene-branches{position:absolute;pointer-events:none;z-index:3;top:-1%;background-position:top center;background-size:contain;background-repeat:no-repeat;will-change:transform;opacity:.97}
.branches-left{left:-1%;width:34%;height:31%;background-image:url('ramas-izquierda.webp');transform-origin:8% 3%;animation:jr-branches-left 8.3s ease-in-out infinite alternate}
.branches-right{right:-1%;width:26%;height:29%;background-image:url('flores-derecha.webp');transform-origin:95% 3%;animation:jr-branches-right 7s ease-in-out infinite alternate}
.scene-sign-shine{position:absolute;z-index:2;left:19%;top:7%;width:57%;height:16%;pointer-events:none;background:linear-gradient(100deg,transparent 0%,transparent 38%,rgba(255,245,170,.17) 48%,transparent 60%,transparent 100%);background-size:225% 100%;mix-blend-mode:screen;animation:jr-sign-shine 11s ease-in-out infinite;clip-path:polygon(0 22%,100% 3%,100% 93%,0 100%)}
.welcome-bottom{z-index:5;left:50%;right:auto;bottom:max(1.4%,env(safe-area-inset-bottom));transform:translateX(-50%);width:min(90%,540px);height:auto;min-height:0;max-height:48%;background:linear-gradient(160deg,rgba(5,40,47,.94),rgba(2,19,29,.96));border:1.5px solid rgba(255,224,126,.7);border-radius:23px;padding:13px 20px 14px;gap:4px;backdrop-filter:blur(9px);box-shadow:0 9px 36px rgba(0,0,0,.65),inset 0 1px 16px rgba(176,242,255,.08)}
.welcome-caption{font-size:clamp(15px,1.7vw,21px)}
.count-wrapper{min-width:115px;padding:1px 30px}.count-number{font-size:clamp(34px,4vw,48px)}
.upcoming{font-size:clamp(12px,1.5vw,17px)}
.enter-btn{position:relative;isolation:isolate;overflow:hidden;animation:jr-enter-pulse 3.3s ease-in-out infinite;box-shadow:0 0 0 0 rgba(255,202,74,.4),0 7px 23px rgba(0,0,0,.65);margin-top:5px;padding:10px 28px}
.enter-btn:before{content:'';position:absolute;pointer-events:none;inset:-45% -70%;background:linear-gradient(110deg,transparent 42%,rgba(255,255,255,.04) 47%,rgba(255,255,255,.65) 50%,rgba(255,255,255,.05) 53%,transparent 58%);transform:translateX(-56%);animation:jr-button-shine 4.1s ease-in-out infinite;z-index:-1}
.enter-btn:hover{animation-play-state:paused;transform:scale(1.035)}
.welcome-privacy{color:#c1dbdf;font-size:10px}
.custom-scene .river-scene,.custom-scene .scene-paraglider,.custom-scene .scene-branches,.custom-scene .scene-sign-shine{display:none}
@keyframes jr-water-flow{0%{transform:translateX(-5%)}100%{transform:translateX(5%)}}
@keyframes jr-water-light{0%{transform:translate(-1%,1%);opacity:.4}100%{transform:translate(1%,-1%);opacity:.83}}
@keyframes jr-glide-left{0%{transform:translate3d(-2px,3px,0) rotate(-2deg)}50%{transform:translate3d(5px,-4px,0) rotate(1deg)}100%{transform:translate3d(9px,1px,0) rotate(2deg)}}
@keyframes jr-glide-right{0%{transform:translate3d(-3px,2px,0) rotate(1deg)}50%{transform:translate3d(3px,-5px,0) rotate(-1deg)}100%{transform:translate3d(9px,0px,0) rotate(2deg)}}
@keyframes jr-branches-left{0%{transform:rotate(-.6deg) translateY(-2px)}100%{transform:rotate(1.4deg) translateY(2px)}}
@keyframes jr-branches-right{0%{transform:rotate(.6deg) translateY(-1px)}100%{transform:rotate(-1.8deg) translateY(3px)}}
@keyframes jr-sign-shine{0%,43%{background-position:130% center;opacity:0}52%{opacity:.5}68%{background-position:-120% center;opacity:.28}100%{background-position:-120% center;opacity:0}}
@keyframes jr-enter-pulse{0%,100%{box-shadow:0 0 0 0 rgba(255,202,74,.25),0 8px 20px #0009;filter:brightness(1)}55%{box-shadow:0 0 0 8px rgba(255,202,74,0),0 8px 24px #0009;filter:brightness(1.16)}}
@keyframes jr-button-shine{0%,28%{transform:translateX(-55%)}63%,100%{transform:translateX(55%)}}
@media(max-width:900px){.welcome-bottom{height:auto;min-height:0;max-height:50%}}
@media(max-width:640px){.welcome-background{background-size:cover;filter:blur(8px) brightness(.38) saturate(1.3);transform:scale(1.13)}.river-scene{height:36%;filter:brightness(.72)}.welcome-mobile-heading{z-index:4;top:10%;gap:12px}.welcome-bottom{height:auto;min-height:0;max-height:44%;width:94%;padding:15px 11px 18px;gap:6px;bottom:max(1%,env(safe-area-inset-bottom))}.welcome-caption{font-size:15px}.count-number{font-size:46px}.enter-btn{font-size:14px}.scene-paraglider{opacity:.8}.paraglider-left{left:9%;top:24%}.paraglider-right{left:77%;top:17%}}
@media(max-height:650px) and (min-width:700px){.welcome-bottom{height:auto;min-height:0;padding:7px 12px;gap:2px}.count-number{font-size:30px}.enter-btn{padding:6px 18px;font-size:13px}.welcome-privacy{display:none}}
@media(prefers-reduced-motion:reduce){.river-scene:after,.river-flow,.scene-paraglider,.scene-branches,.scene-sign-shine,.enter-btn,.enter-btn:before{animation:none!important}}
