*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:#090a09;background:#eeefeb;font-family:Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:3px solid #aa7928;outline-offset:6px}button{border:0;background:none}.header{height:78px;max-width:1320px;margin:auto;padding:0 28px;display:flex;align-items:center;justify-content:space-between;gap:32px;position:relative;z-index:2}.brand{font-size:23px;font-weight:800;letter-spacing:-1px;white-space:nowrap}nav{display:flex;align-items:center;gap:35px}nav a,nav button{text-transform:uppercase;font-size:12px;letter-spacing:.4px;padding:16px 0;position:relative}nav .active:after{content:"";position:absolute;bottom:4px;left:0;width:30px;height:2px;background:#c99d45}.socials{display:flex;gap:27px;align-items:center}.socials button,.socials a{padding:0;display:flex;width:25px;height:25px;align-items:center;justify-content:center}.socials svg{width:25px;height:25px;fill:currentColor}.menu-button{display:none}.hero{position:relative;max-width:1536px;min-height:845px;margin:auto;padding-top:475px;overflow:hidden}.hero-photo{position:absolute;top:-138px;left:50%;transform:translateX(-50%);width:1300px;max-width:none;height:auto;z-index:-2}.photo-fade{position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#eeefeb 1%,rgba(238,239,235,.94) 10%,transparent 39%)}.hero{isolation:isolate}.identity{position:absolute;width:365px;height:282px;top:-10px;left:50%;transform:translateX(-50%);background-image:url('assets/plantilla-aprobada.png');background-size:1475px 983px;background-position:-555px -67px;mix-blend-mode:multiply}.slogan{position:absolute;top:98px;margin:0;font-family:'Brush Script MT','Segoe Print',cursive;font-style:italic;text-transform:uppercase;font-size:29px;line-height:1.2;transform:rotate(-12deg)}.slogan:after{content:"";display:block;width:77px;height:2px;background:#111;margin:14px 0 0 13px}.slogan.left{left:8%}.slogan.right{right:8%;text-align:right}.slogan.right:after{margin-left:auto}.mixes{max-width:1030px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:95px;padding:0 20px;position:relative;scroll-margin-top:30px}.video{display:block;aspect-ratio:2.06;position:relative;overflow:hidden;border:1px solid #b4b7af;border-radius:12px;box-shadow:0 10px 24px #0003;background:#191919;transition:transform .2s}.video:hover{transform:translateY(-4px)}.thumbnail,.shade{position:absolute;inset:0}.thumbnail{background-repeat:no-repeat}.mix-one .thumbnail{background-image:url('assets/mix-1.png');background-size:224% auto;background-position:1.8% 46%}.mix-two .thumbnail{background-image:url('assets/mix-2.png');background-size:211% auto;background-position:5.3% 47%}.shade{background:linear-gradient(180deg,#0007,transparent 55%,#0005)}.mix-label{position:absolute;top:10px;left:18px;color:white;display:grid;gap:1px;font-size:16px;font-weight:700;line-height:1.1}.mix-label strong{font-size:30px;color:#dbaf51}.play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:57px;height:40px;background:#ff001b;border-radius:12px;color:white;display:grid;place-items:center;font-size:24px;padding-left:3px}.youtube{position:absolute;bottom:13px;left:17px;color:#fff;font-size:18px;font-weight:bold}.duration{position:absolute;bottom:11px;right:14px;background:#000e;color:#fff;border-radius:4px;padding:4px 7px;font-size:13px;font-weight:bold}article h2{text-align:center;font-size:19px;margin:13px 0 4px;letter-spacing:-.6px}.artist{text-align:center;letter-spacing:5px;font-size:12px;margin:0}.vote{text-align:center;margin:6px 20px 17px}.cta{background:#d0a44d;border-radius:40px;padding:14px 30px;letter-spacing:2px;font-size:12px;font-weight:700;display:inline-flex;align-items:center;gap:15px;transition:background .2s}.cta:hover{background:#bd9039}.cta span{font-size:25px;line-height:17px}.vote p{font-size:13px;margin:13px 0 0}footer{border-top:1px solid #d1d4cd;min-height:94px;padding:18px max(28px,calc((100% - 1264px)/2));display:flex;align-items:center;justify-content:space-between;gap:25px}.footer-brand{display:grid;gap:3px}.footer-brand strong{font-size:21px;letter-spacing:-.8px}.footer-brand span{font-size:11px;font-weight:bold;letter-spacing:4px}footer>p{font-size:18px;font-style:italic;margin:0;text-align:center}footer>p:after{content:"";display:block;width:40px;height:2px;background:#d0a44d;margin:10px auto 0}dialog{border:1px solid #d6c69f;border-radius:18px;padding:40px;max-width:480px;width:calc(100% - 32px);background:#f7f7f1;box-shadow:0 24px 100px #0004}dialog::backdrop{background:#1118;backdrop-filter:blur(5px)}dialog h2{font-size:28px}dialog p{line-height:1.7;color:#444}dialog .close{position:absolute;right:16px;top:10px;font-size:32px}.dialog-mark{font-size:35px}dialog a.cta{margin-top:12px}dialog .network-list{display:flex;flex-direction:column;gap:15px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(min-width:1450px){.hero{padding-top:479px;min-height:852px}.mixes{max-width:1070px;gap:100px}}
@media(max-width:1100px){.header{gap:20px}.header>.socials{display:none}nav{gap:24px}.hero-photo{width:1150px;top:-90px}.mixes{max-width:940px;gap:50px}.slogan.left{left:4%}.slogan.right{right:4%}.hero{min-height:810px;padding-top:475px}}
@media(max-width:700px){.header{height:68px;padding:0 22px}.brand{font-size:21px}.menu-button{display:block;font-size:26px;padding:8px}nav{display:none;position:absolute;top:64px;left:16px;right:16px;flex-direction:column;gap:0;background:#f7f7f1;padding:15px;border-radius:12px;box-shadow:0 10px 40px #0002}nav.open{display:flex}nav a,nav button{width:100%;text-align:center;padding:13px}nav .active:after{display:none}.hero{padding-top:390px;min-height:0;padding-bottom:23px}.hero-photo{width:760px;top:14px}.identity{width:275px;height:205px;background-size:1108px 739px;background-position:-417px -50px;top:0}.slogan{font-size:17px;top:186px;line-height:1.1;z-index:1}.slogan.left{left:5%}.slogan.right{right:5%}.slogan:after{width:40px;margin-top:7px}.photo-fade{background:linear-gradient(0deg,#eeefeb 35%,transparent 69%)}.mixes{max-width:430px;grid-template-columns:1fr;gap:23px;padding:0 24px}.video{aspect-ratio:1.95}article h2{font-size:17px}.artist{font-size:10px;letter-spacing:4px}.vote{margin:26px 20px 0}.vote p{font-size:12px;line-height:1.6;max-width:280px;margin:13px auto 0}.cta{font-size:11px;padding:14px 22px}footer{padding:24px;flex-wrap:wrap;justify-content:center;text-align:center;gap:20px}footer>p{order:3;width:100%;font-size:16px}.footer-brand strong{font-size:18px}.socials{gap:18px}dialog{padding:32px 25px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
/* La identidad conserva el lettering de la plantilla aprobada. */
.identity{top:0;height:270px;filter:brightness(1.12)}
.hero-photo{top:-40px}
@media(max-width:1100px) and (min-width:701px){.hero-photo{top:0}}
@media(max-width:700px){.hero-photo{top:14px}}
@media(max-width:700px){.hero-photo{width:530px;top:122px}.slogan{top:192px;font-size:15px}}

@media(max-width:700px){.identity{height:202px}}

.slogan.right{transform:rotate(12deg)}

.vote{margin-top:28px;margin-bottom:28px}.candidate-video{display:block;width:100%;max-width:560px;aspect-ratio:16/9;margin:0 auto;border:0;border-radius:12px;background:#101010}

/* El fundido pertenece a la foto, no a la altura variable del contenido. */
.hero-photo{
  -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 60%,rgba(0,0,0,.92) 66%,rgba(0,0,0,.55) 74%,rgba(0,0,0,.14) 84%,transparent 94%),linear-gradient(to right,transparent 0%,#000 13%,#000 87%,transparent 100%);
  mask-image:linear-gradient(to bottom,#000 0%,#000 60%,rgba(0,0,0,.92) 66%,rgba(0,0,0,.55) 74%,rgba(0,0,0,.14) 84%,transparent 94%),linear-gradient(to right,transparent 0%,#000 13%,#000 87%,transparent 100%);
  -webkit-mask-composite:source-in;
  mask-composite:intersect;
}
.photo-fade{display:none}

/* Cabecera: marca izquierda, navegación centrada y redes derecha. */
@media(min-width:701px){
  .header{display:grid;grid-template-columns:1fr auto 1fr;gap:20px}
  .header>.brand{justify-self:start}
  .header>nav{justify-self:center}
  .header>.socials{display:flex;justify-self:end;gap:22px}
}
@media(min-width:701px) and (max-width:850px){
  .header{padding-inline:22px;gap:14px}
  .header>.brand{font-size:20px}
  .header>.socials{gap:15px}
}
@media(max-width:700px){
  .header{height:auto;min-height:104px;display:grid;grid-template-columns:1fr auto;padding:15px 20px;gap:12px}
  .header>.brand{font-size:19px}
  .header>.socials{display:flex;justify-self:end;gap:12px}
  .header>.socials a,.header>.socials button,.header>.socials svg{width:21px;height:21px}
  .header>.menu-button{display:none}
  .header>nav{display:flex;position:static;grid-column:1/-1;grid-row:2;flex-direction:row;justify-content:center;gap:30px;background:none;padding:0;border-radius:0;box-shadow:none}
  .header>nav a,.header>nav button{width:auto;padding:5px 0}
}
@media(max-width:360px){
  .header{padding-inline:14px;column-gap:8px}
  .header>.brand{font-size:17px}
  .header>.socials{gap:9px}
}

@font-face{font-family:'Kaushan Script';src:url('assets/kaushan-script.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
.slogan{font-family:'Kaushan Script',cursive;font-style:normal;font-weight:400;font-size:28px;line-height:1.35}
.slogan.left{left:4%}
.slogan.right{right:5%}
.vote-heading{font-size:clamp(22px,2.7vw,32px);line-height:1.25;letter-spacing:-.7px;margin:35px auto 24px;max-width:700px;padding:0 8px;font-weight:800}
.vote-heading span{color:#936919}
.booking-card{display:flex;flex-direction:column;gap:12px;border-block:1px solid #d6c69f;padding:20px 0;margin:22px 0}
.booking-label{font-size:11px;letter-spacing:3px;color:#936919;font-weight:700}
.booking-card h3{margin:0;font-size:24px}.booking-phone{font-size:21px;font-weight:bold}
@media(max-width:700px){.slogan{font-size:14px;line-height:1.4}.slogan.left{left:3%}.slogan.right{right:3%}.vote-heading{font-size:23px;margin-top:32px}.vote-heading br{display:none}}

/* Revisión local: lettering gráfico y marca transparente. */
.identity{background-image:url('assets/identity-transparent.png');background-size:contain;background-position:center;background-repeat:no-repeat;mix-blend-mode:normal;filter:none;width:365px;height:270px}
.slogan{width:195px;top:105px}.slogan img{display:block;width:100%;height:auto}.slogan:after{display:none}
@media(max-width:1100px) and (min-width:701px){.slogan{width:170px}}
@media(max-width:700px){.identity{width:275px;height:202px}.slogan{width:105px;top:187px}.slogan.left{left:2%}.slogan.right{right:2%}}
@media(max-width:360px){.slogan{width:88px}}

/* Contacto: página independiente, con la misma identidad visual. */
.contact-page .hero{padding-top:650px;min-height:0;padding-bottom:65px}
.contact-details{position:relative;text-align:center;max-width:760px;margin:0 auto;padding:0 28px}
.contact-eyebrow{font-size:11px;letter-spacing:3px;font-weight:700;color:#8e692b;margin:0 0 12px}
.contact-details h1{font-size:clamp(38px,5vw,56px);letter-spacing:-2px;line-height:1.08;margin:0;font-weight:800}
.contact-rule{width:44px;height:2px;background:#c99d45;margin:24px auto}
.contact-details h2{font-size:32px;font-weight:500;letter-spacing:-.7px;margin:0 0 9px}
.contact-description{font-size:14px;color:#5f615b;margin:0 0 29px}
.contact-actions{display:flex;justify-content:center;gap:14px;align-items:stretch}
.contact-actions a{min-height:76px;border:1px solid #c8c9c0;border-radius:8px;text-align:left;display:flex;align-items:center;gap:24px;padding:17px 23px;transition:background .2s,border-color .2s}
.contact-actions a:hover{background:#e6e5db;border-color:#ad853f}
.contact-actions .contact-phone{display:grid;grid-template-columns:1fr auto;gap:4px 25px;min-width:275px}
.contact-action-label{font-size:9px;letter-spacing:2px;color:#666b60;grid-column:1}
.contact-phone>span:nth-child(2){font-size:20px;font-weight:600;grid-column:1}
.contact-phone .contact-arrow{grid-column:2;grid-row:1/3}
.contact-arrow{font-size:22px;color:#946d2a}.contact-instagram{font-size:16px;justify-content:space-between;min-width:170px}
@media(max-width:700px){.contact-page .hero{padding-top:435px;padding-bottom:42px}.contact-details{padding:0 24px}.contact-details h2{font-size:29px}.contact-actions{flex-direction:column;max-width:330px;margin:auto}.contact-actions a{min-height:68px}.contact-actions .contact-phone{min-width:0}.contact-rule{margin:20px auto}.contact-eyebrow{font-size:10px;letter-spacing:2.3px}}
@media(max-width:430px){.contact-page .slogan{width:88px;top:157px}.contact-page .slogan.left{left:3%}.contact-page .slogan.right{right:3%}}

/* Reproductores originales de YouTube para los dos mixes. */
.mixes article{min-width:0}
.mixes .mix-heading{font-size:18px;line-height:1.3;letter-spacing:-.3px;margin:0 0 16px;min-height:76px;display:flex;flex-direction:column;justify-content:flex-end;gap:5px}
.mix-heading span{display:block;color:#936919;font-size:25px;letter-spacing:1px;font-weight:800}
.mix-player{display:block;width:100%;aspect-ratio:16/9;border:0;border-radius:12px;background:#101010;box-shadow:0 10px 24px #0002}
.mix-caption{text-align:center;font-size:19px;font-weight:700;letter-spacing:-.6px;margin:13px 0 4px}
@media(max-width:700px){.mixes{gap:32px}.mixes .mix-heading{min-height:0;font-size:17px}.mix-caption{font-size:17px}}