:root{--green:#00813f;--yellow:#fcd116;--red:#d21034;--black:#111;--blue:#1f4fa0;--sand:#fbf3e2;--ink:#1d1d1d}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:70px}
body{margin:0;font-family:Poppins,system-ui,sans-serif;color:var(--ink);line-height:1.65;background:#fff}
img{max-width:100%;height:auto}a{color:var(--blue)}
h2{font-family:'Bebas Neue',sans-serif;font-size:clamp(2.6rem,6vw,4rem);letter-spacing:.03em;line-height:1;margin:0 0 .5rem;color:var(--green)}
h3{font-family:'Playfair Display',serif;margin:.4rem 0}
.wrap{max-width:1140px;margin:auto;padding:0 22px}.narrow{max-width:780px}.center{text-align:center}
.two{display:grid;grid-template-columns:1.2fr 1fr;gap:48px;align-items:center}
.section{padding:90px 0}.lead{font-size:1.15rem;font-weight:500}.small{font-size:.85rem;opacity:.8}
.sand{background:var(--sand)}.dark{background:var(--black);color:#fff}.dark h2{color:var(--yellow)}.dark a{color:var(--yellow)}
.btn{display:inline-block;background:var(--red);color:#fff!important;text-decoration:none;font-weight:600;padding:14px 32px;border-radius:40px;box-shadow:0 6px 0 #8f0a22;transition:transform .15s;margin:6px}
.btn:hover{transform:translateY(-2px)}.btn-sm{padding:8px 20px;box-shadow:none;margin:0 0 0 8px}
.btn-ghost{background:transparent;border:2px solid #fff;box-shadow:none}.btn-ghost-dark{background:transparent;border:2px solid var(--green);color:var(--green)!important;box-shadow:none;margin-left:0}
.nav{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:10px 22px;background:rgba(17,17,17,.94);backdrop-filter:blur(6px)}
.brand{font-family:'Bebas Neue';font-size:1.7rem;color:var(--yellow);text-decoration:none;letter-spacing:.05em}
.links{display:flex;align-items:center;gap:18px}.links a:not(.btn){color:#fff;text-decoration:none;font-size:.9rem}.links a:not(.btn):hover{color:var(--yellow)}
.burger{display:none;background:none;border:0;color:#fff;font-size:1.8rem;cursor:pointer}
.hero{position:relative;color:#fff;text-align:center;padding:50px 20px 70px;background:
 radial-gradient(circle at 50% 38%,rgba(252,209,22,.35),transparent 45%),
 linear-gradient(180deg,#0b5a2e 0%,#00813f 55%,#0b4a8a 100%)}
.hero-logo{width:min(560px,92%);filter:drop-shadow(0 10px 24px rgba(0,0,0,.35))}
.slogan{font-family:'Playfair Display',serif;font-style:italic;font-size:clamp(2rem,5vw,3.2rem);margin:.2rem 0 0;color:var(--yellow)}
.slogan-en{margin:0 0 1.2rem;letter-spacing:.2em;text-transform:uppercase;font-size:.85rem}
.facts{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-bottom:24px}
.facts span{background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.3);padding:8px 16px;border-radius:30px;font-weight:500}
.countdown{display:flex;justify-content:center;gap:12px;margin:0 0 26px}
.countdown div{background:var(--black);border-bottom:4px solid var(--red);border-radius:10px;min-width:82px;padding:10px}
.countdown b{display:block;font-family:'Bebas Neue';font-size:2.6rem;line-height:1;color:var(--yellow)}.countdown small{text-transform:uppercase;font-size:.7rem;letter-spacing:.15em}
.age{margin-top:16px;font-size:.85rem;opacity:.9}
.tile-strip,.azulejo{background-color:#fff;background-image:
 radial-gradient(circle at 50% 50%,var(--blue) 18%,transparent 19%),
 radial-gradient(circle at 0 0,var(--blue) 22%,transparent 23%),radial-gradient(circle at 100% 0,var(--blue) 22%,transparent 23%),
 radial-gradient(circle at 0 100%,var(--blue) 22%,transparent 23%),radial-gradient(circle at 100% 100%,var(--blue) 22%,transparent 23%);background-size:38px 38px}
.tile-strip{height:38px}
.azulejo{position:relative}.azulejo::before{content:"";position:absolute;inset:0;background:rgba(10,30,70,.88)}.azulejo>*{position:relative}
.capulana{background-image:repeating-linear-gradient(45deg,rgba(252,209,22,.08) 0 14px,transparent 14px 28px),repeating-linear-gradient(-45deg,rgba(210,16,52,.1) 0 14px,transparent 14px 28px)}
.stats{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:16px}
.stats li{background:var(--sand);border-left:6px solid var(--red);border-radius:12px;padding:22px}
.stats b{display:block;font-family:'Bebas Neue';font-size:3rem;line-height:1;color:var(--green)}
.badge{display:inline-block;background:var(--yellow);color:var(--black);font-weight:600;text-transform:uppercase;letter-spacing:.15em;padding:6px 18px;border-radius:30px}
.lineup-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:30px 0}
.slot{border:2px dashed rgba(252,209,22,.6);border-radius:14px;padding:30px 10px;font-weight:600;text-transform:uppercase;letter-spacing:.1em}
.slot span{font-family:'Bebas Neue';font-size:2.4rem;color:var(--red)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:30px}
.card{border-radius:16px;padding:26px;background:#fff;box-shadow:0 8px 26px rgba(0,0,0,.08);border-top:6px solid var(--green)}
.card:nth-child(3n+2){border-top-color:var(--red)}.card:nth-child(3n){border-top-color:var(--blue)}
.ico{font-size:2.2rem}
.tickets{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin:34px 0}
.ticket{position:relative;background:#fff;border-radius:16px;padding:28px 22px;text-align:center;box-shadow:0 8px 26px rgba(0,0,0,.08)}
.price{font-family:'Bebas Neue';font-size:3.2rem;line-height:1;color:var(--red);margin:.3rem 0}
.vip{background:var(--black);color:#fff;border:3px solid var(--yellow)}.vip h3{color:var(--yellow)}.vip .price{color:var(--yellow)}
.vip ul{text-align:left;padding-left:20px;margin:0}.flag{position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:var(--red);color:#fff;font-size:.75rem;font-weight:600;padding:4px 14px;border-radius:20px;text-transform:uppercase;white-space:nowrap}
.map{border-radius:16px;overflow:hidden;box-shadow:0 8px 26px rgba(0,0,0,.12);border:6px solid var(--yellow)}.map iframe{display:block;width:100%;height:400px;border:0}
details{background:#fff;border-radius:12px;margin:12px 0;padding:4px 20px;box-shadow:0 3px 12px rgba(0,0,0,.05)}
summary{cursor:pointer;font-weight:600;padding:14px 0;list-style:none}summary::after{content:"+";float:right;color:var(--red);font-size:1.3rem}details[open] summary::after{content:"–"}
.footer{background:var(--black);color:#ddd;padding:40px 0;border-top:6px solid var(--red)}.footer a{color:var(--yellow)}
.foot{display:flex;gap:30px;align-items:center}.foot p{margin:.3rem 0}
@media(max-width:960px){.links{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;background:#111;padding:20px;gap:14px}.links.open{display:flex}.burger{display:block}
 .two{grid-template-columns:1fr}.cards{grid-template-columns:1fr 1fr}.tickets{grid-template-columns:1fr 1fr;row-gap:30px}.lineup-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.section{padding:64px 0}.cards,.tickets{grid-template-columns:1fr}.countdown{gap:6px}.countdown div{min-width:68px;padding:8px 4px}.countdown b{font-size:2rem}.foot{flex-direction:column;text-align:center}}
.map{background:var(--sand) url(logo-web.png) center/50% no-repeat}

.btn-vendor{background:var(--yellow);color:var(--black)!important}
.modal{display:none;position:fixed;inset:0;z-index:100;align-items:center;justify-content:center;padding:16px}
.modal:target,.modal.open{display:flex}
.modal-bg{position:absolute;inset:0;background:rgba(0,0,0,.7)}
.modal-box{position:relative;background:#fff;border-radius:16px;border-top:6px solid var(--yellow);padding:28px;width:min(620px,100%);max-height:92vh;overflow:auto;box-shadow:0 20px 60px rgba(0,0,0,.4)}
.modal-x{position:absolute;top:8px;right:16px;font-size:2rem;text-decoration:none;color:var(--ink)}
.vform label{display:block;font-weight:600;font-size:.9rem;margin:0 0 12px}
.vform input,.vform textarea{display:block;width:100%;margin-top:4px;padding:10px 12px;border:2px solid #ddd;border-radius:10px;font:inherit;font-weight:400}
.vform input:focus,.vform textarea:focus{outline:0;border-color:var(--green)}
.vform .invalid{border-color:var(--red)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-msg{padding:10px 14px;border-radius:10px;background:#fde7eb;color:var(--red);font-weight:600}
.form-ok{background:#e3f4ea;color:var(--green)}
.vform .btn{margin:6px 0 0;border:0;cursor:pointer;font:inherit;font-weight:600}
@media(max-width:560px){.row2{grid-template-columns:1fr;gap:0}.modal-box{padding:22px 18px}}

/* Background music button */
.music-btn{position:fixed;right:18px;bottom:18px;z-index:40;width:54px;height:54px;border-radius:50%;border:3px solid #1f9d55;background:#ffd23f;color:#d62828;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.35);transition:transform .2s}
.music-btn:hover,.music-btn:focus-visible{transform:scale(1.08)}
.music-btn:focus-visible{outline:3px solid #d62828;outline-offset:3px}
.music-btn.playing{background:#d62828;color:#ffd23f;animation:musicPulse 1.6s ease-in-out infinite}
.music-btn::after{content:attr(data-tip);position:absolute;right:64px;white-space:nowrap;background:#111;color:#fff;font-size:.8rem;padding:5px 9px;border-radius:6px;opacity:0;pointer-events:none;transition:opacity .2s}
.music-btn:hover::after,.music-btn:focus-visible::after{opacity:1}
@keyframes musicPulse{50%{box-shadow:0 0 0 8px rgba(255,210,63,.35)}}
@media(prefers-reduced-motion:reduce){.music-btn.playing{animation:none}}

.hero-h1{margin:0;font-size:inherit;line-height:1}.hero-sub{display:block;font-family:Poppins,system-ui,sans-serif;font-size:clamp(.85rem,2vw,1.05rem);font-weight:500;letter-spacing:.02em;margin-top:.6rem;opacity:.9}
