/* ══════════════════════════════════════════════════════════════
   I MEMORIAL URBANO GONZÁLEZ ESCAPA — memorialurbano.com
   Diseño y desarrollo: INTDEA
   ══════════════════════════════════════════════════════════════ */

/* ---------- 1. TOKENS ---------- */
:root{
  --carbon:#0B0B0D;
  --stone:#131317;
  --stone-2:#1B1B21;
  --line:rgba(242,238,230,.12);

  --bone:#F2EEE6;
  --bone-60:rgba(242,238,230,.62);
  --bone-40:rgba(242,238,230,.42);

  --gold:#C9A227;
  --gold-lt:#F3DFA0;
  --gold-dk:#7E5F12;
  --grad-gold:linear-gradient(100deg,#8E6B14 0%,#E7CE84 22%,#C9A227 48%,#F3DFA0 68%,#9A7518 100%);

  --rose:#D6197D;
  --rose-lt:#F04E9E;
  --ela:#A6C84B;

  --ff:"Archivo","Archivo Fallback",system-ui,-apple-system,"Segoe UI",sans-serif;
  --wrap:1180px;
  --pad:clamp(1.15rem,5vw,2.5rem);
  --sec-y:clamp(4.5rem,11vw,8.5rem);
  --r:14px;
  --ease:cubic-bezier(.2,.7,.25,1);
}

/* ---------- 2. BASE ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--carbon);color:var(--bone);
  font-family:var(--ff);font-size:clamp(1rem,.96rem + .25vw,1.09rem);
  line-height:1.62;font-weight:400;overflow-x:hidden;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3{margin:0;line-height:.94;text-transform:uppercase;font-weight:900;
  font-variation-settings:"wdth" 84;letter-spacing:-.015em}
p{margin:0 0 1em}
ul{margin:0;padding:0;list-style:none}
::selection{background:var(--gold);color:#101013}
:focus-visible{outline:2px solid var(--gold-lt);outline-offset:3px;border-radius:4px}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:0;z-index:200;background:var(--gold);color:#101013;padding:.7rem 1.1rem;font-weight:700}
.skip:focus{left:.5rem;top:.5rem}

.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--pad)}
.wrap--narrow{max-width:820px}

/* ---------- 3. TIPOGRAFÍA DE SECCIÓN ---------- */
.eyebrow{
  font-size:.74rem;letter-spacing:.34em;text-transform:uppercase;font-weight:700;
  color:var(--gold);margin:0 0 1.1rem;display:flex;align-items:center;gap:.85rem;
}
.eyebrow::after{content:"";flex:1;height:1px;max-width:170px;
  background:linear-gradient(90deg,var(--gold),transparent)}
.eyebrow--rose{color:var(--rose-lt)}
.eyebrow--rose::after{background:linear-gradient(90deg,var(--rose),transparent)}

.h2{font-size:clamp(2.3rem,7.4vw,4.6rem);margin:0 0 1.6rem}
.h2--sm{font-size:clamp(2rem,5.6vw,3.4rem)}

.lead{max-width:44ch;font-size:clamp(1.05rem,1rem + .4vw,1.24rem);color:var(--bone-60)}
.prose{color:var(--bone-60);font-size:clamp(1.02rem,.98rem + .3vw,1.17rem)}
.prose--center{text-align:center;max-width:56ch;margin-inline:auto}

.sec{position:relative;padding-block:var(--sec-y)}

/* ---------- 4. BOTONES ---------- */
.btn{
  --bh:3.55rem;
  display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
  min-height:var(--bh);padding:0 1.7rem;border:0;border-radius:999px;cursor:pointer;
  font-family:var(--ff);font-size:.86rem;font-weight:800;letter-spacing:.13em;
  text-transform:uppercase;text-align:center;position:relative;isolation:isolate;
  transition:transform .25s var(--ease),box-shadow .25s var(--ease),filter .25s var(--ease);
}
.btn--sm{--bh:2.6rem;padding:0 1.15rem;font-size:.72rem;letter-spacing:.11em}
.btn--lg{--bh:3.85rem;padding:0 2.2rem;font-size:.92rem}
.btn--gold{background:var(--grad-gold);background-size:200% 100%;color:#14100A;
  box-shadow:0 8px 26px -12px rgba(201,162,39,.85)}
.btn--rose{background:var(--rose);color:#fff;box-shadow:0 8px 26px -12px rgba(214,25,125,.9)}
.btn--rose.btn--ghost{background:transparent;color:var(--rose-lt);
  box-shadow:inset 0 0 0 1.5px var(--rose)}
.btn:hover{transform:translateY(-2px)}
.btn--gold:hover{background-position:100% 0;box-shadow:0 14px 34px -12px rgba(201,162,39,.95)}
.btn--rose:hover{background:var(--rose-lt);box-shadow:0 14px 34px -12px rgba(214,25,125,1)}
.btn:active{transform:translateY(0)}
.btn.is-soon{cursor:default}
.btn.is-soon:hover{transform:none}
.btn__badge{order:2;display:inline-block;padding:.3em .75em;border-radius:999px;
  font-size:.68em;font-weight:800;letter-spacing:.12em;white-space:nowrap;
  background:rgba(12,12,14,.22);box-shadow:inset 0 0 0 1.4px currentColor;
  animation:soonPulse 2.6s ease-in-out infinite}
.btn--rose .btn__badge{background:rgba(255,255,255,.16)}
.dock .btn__badge,.nav__menu .btn__badge{font-size:.62em;padding:.24em .55em;letter-spacing:.06em}
@keyframes soonPulse{0%,100%{opacity:.78}50%{opacity:1}}

.cta-row{display:flex;flex-wrap:wrap;gap:.85rem}
.cta-row--center{justify-content:center}

/* ---------- 5. NAV ---------- */
.nav{position:fixed;inset:0 0 auto;z-index:100;transition:background .35s,backdrop-filter .35s,border-color .35s;
  border-bottom:1px solid transparent}
.nav.is-stuck{background:rgba(11,11,13,.86);backdrop-filter:blur(14px) saturate(1.3);border-bottom-color:var(--line)}
.nav__wrap{max-width:var(--wrap);margin-inline:auto;padding:.7rem var(--pad);
  display:flex;align-items:center;justify-content:space-between;gap:1rem}
.nav__brand{display:flex;align-items:center;gap:.6rem}
.nav__brand img{width:46px;height:auto}
.nav__brand span{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--bone-60);line-height:1.15}
.nav__brand b{display:block;color:var(--bone);font-weight:800;letter-spacing:.14em}
.nav__menu{display:flex;align-items:center;gap:1.6rem}
.nav__menu a{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--bone-60);
  transition:color .2s;position:relative}
.nav__menu a:hover{color:var(--bone)}
.nav__menu a.is-fila0{color:var(--rose-lt)}
.nav__menu a.btn{color:#14100A}
.nav__toggle{display:none;width:44px;height:40px;background:none;border:0;padding:8px;cursor:pointer}
.nav__toggle span{display:block;height:2px;background:var(--bone);margin:5px 0;transition:transform .3s var(--ease),opacity .2s}
.nav.is-open .nav__toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav.is-open .nav__toggle span:nth-child(2){opacity:0}
.nav.is-open .nav__toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ---------- 6. HERO ---------- */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;justify-content:center;
  padding:5.6rem var(--pad) 4.2rem;text-align:center;overflow:hidden}
.hero__bg{position:absolute;inset:0;
  background-image:url("../img/fondo-mobile.jpg");
  background-image:image-set(url("../img/fondo-mobile.webp") type("image/webp"),url("../img/fondo-mobile.jpg") type("image/jpeg"));
  background-size:cover;background-position:50% 30%;
  transform:scale(1.06);will-change:transform}
.hero__bg::after{content:"";position:absolute;inset:0;
  background:radial-gradient(120% 80% at 50% 18%,rgba(11,11,13,.15),rgba(11,11,13,.72) 55%,var(--carbon) 100%)}
.hero__glow{position:absolute;left:50%;top:-14%;width:min(900px,120vw);aspect-ratio:1;transform:translateX(-50%);
  background:radial-gradient(circle,rgba(201,162,39,.16),transparent 62%);pointer-events:none}
.hero__inner{position:relative;z-index:2;width:100%;max-width:960px}

.hero__emblem{width:min(232px,50vw);margin:0 auto .7rem}
.hero__eyebrow{font-size:clamp(.82rem,2.6vw,1.05rem);letter-spacing:.55em;text-indent:.55em;font-weight:800;
  text-transform:uppercase;margin:0 0 .35rem;
  background:var(--grad-gold);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero__title{font-size:clamp(2.9rem,12vw,5.6rem);font-variation-settings:"wdth" 80;margin:0 0 1.05rem}
.hero__title span{display:block;font-size:.43em;letter-spacing:.01em;margin-top:.22em;font-variation-settings:"wdth" 88}

.matchup{display:flex;align-items:center;justify-content:center;gap:clamp(1rem,5vw,3.2rem);margin:0 0 1.05rem}
.matchup__team{margin:0;display:flex;flex-direction:column;align-items:center;gap:.55rem}
.matchup__team a{display:block;line-height:0;width:clamp(84px,18vw,128px);aspect-ratio:420/560}
.matchup__team img{width:100%;height:100%;object-fit:contain;object-position:bottom;
  filter:drop-shadow(0 12px 26px rgba(0,0,0,.6));transition:transform .35s var(--ease)}
.matchup__team a:hover img{transform-origin:bottom center}
.matchup__team a:hover img{transform:scale(1.06)}
.matchup__team figcaption{font-size:clamp(.66rem,2.2vw,.84rem);letter-spacing:.22em;text-transform:uppercase;
  font-weight:700;color:var(--bone-60)}
.matchup__vs{width:clamp(48px,9vw,84px);opacity:.95}

.hero__slogan{width:min(330px,66vw);margin:0 auto 1.15rem}

.hero__fixture{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.55rem .8rem;
  font-size:clamp(.72rem,2.3vw,.9rem);letter-spacing:.17em;text-transform:uppercase;font-weight:600;
  color:var(--bone);margin:0 0 1.25rem}
.hero__fixture i{width:5px;height:5px;border-radius:50%;background:var(--gold);display:inline-block}

/* MARCADOR */
.board{display:inline-block;padding:.8rem 1.3rem .7rem;margin:0 0 1.4rem;border-radius:12px;
  background:linear-gradient(180deg,rgba(20,20,24,.82),rgba(10,10,12,.86));
  border:1px solid var(--line);box-shadow:0 22px 50px -30px #000,inset 0 1px 0 rgba(255,255,255,.05);
  backdrop-filter:blur(6px);position:relative}
.board::before{content:"";position:absolute;inset:auto 12% -1px;height:2px;background:var(--grad-gold);border-radius:2px}
.board__label{font-size:.6rem;letter-spacing:.36em;text-transform:uppercase;color:var(--bone-40);margin:0 0 .5rem}
.board__grid{display:flex;gap:clamp(.6rem,2.5vw,1.35rem);align-items:flex-end;justify-content:center}
.board__cell{display:flex;flex-direction:column;align-items:center;min-width:3.1rem}
.board__cell b{font-size:clamp(1.65rem,5.4vw,2.25rem);font-weight:900;line-height:1;font-variant-numeric:tabular-nums;
  font-variation-settings:"wdth" 92;
  background:var(--grad-gold);-webkit-background-clip:text;background-clip:text;color:transparent}
.board__cell span{font-size:.56rem;letter-spacing:.22em;text-transform:uppercase;color:var(--bone-40);margin-top:.3rem}
.board.is-live .board__cell b{background:none;color:var(--ela);-webkit-text-fill-color:var(--ela)}

.hero .cta-row{justify-content:center}
.hero__note{font-size:.8rem;color:var(--bone-60);margin:1.1rem 0 0;letter-spacing:.04em}
.hero__note b{color:var(--gold-lt);font-weight:800;letter-spacing:.08em;text-transform:uppercase;font-size:.92em}

.hero__cue{position:absolute;left:50%;bottom:1.4rem;transform:translateX(-50%);width:24px;height:38px;
  border:1.5px solid var(--bone-40);border-radius:14px;z-index:2}
.hero__cue span{position:absolute;left:50%;top:8px;width:3px;height:7px;border-radius:2px;background:var(--gold);
  transform:translateX(-50%);animation:cue 1.9s var(--ease) infinite}
@keyframes cue{0%{opacity:0;transform:translate(-50%,-4px)}35%{opacity:1}100%{opacity:0;transform:translate(-50%,14px)}}

/* ---------- 7. SECCIÓN PARTIDO ---------- */
.sec--partido{background:linear-gradient(180deg,var(--carbon),var(--stone) 60%,var(--carbon))}
.sec--partido .lead{margin-bottom:clamp(2.8rem,7vw,4.5rem)}
.pillars{display:grid;gap:clamp(1rem,2.5vw,1.5rem);grid-template-columns:repeat(3,1fr)}
.pillar{padding:clamp(1.5rem,3vw,2.1rem);border-radius:var(--r);border:1px solid var(--line);
  background:linear-gradient(165deg,rgba(242,238,230,.05),rgba(242,238,230,.01));
  transition:border-color .3s,transform .3s var(--ease)}
.pillar:hover{border-color:rgba(201,162,39,.4);transform:translateY(-4px)}
.pillar__mark{display:block;width:34px;color:var(--gold);margin-bottom:1.1rem}
.pillar h3{font-size:1.16rem;letter-spacing:.03em;font-variation-settings:"wdth" 92;margin-bottom:.7rem}
.pillar p{color:var(--bone-60);font-size:.97rem;margin:0}

/* ---------- 8. ENTRADAS ---------- */
.sec--tickets{background:var(--carbon)}
.sec--tickets::before{content:"";position:absolute;inset:0;opacity:.28;pointer-events:none;
  background-image:url("../img/textura.jpg");
  background-image:image-set(url("../img/textura.webp") type("image/webp"),url("../img/textura.jpg") type("image/jpeg"));
  background-size:cover;background-position:center;
  mask-image:linear-gradient(180deg,transparent,#000 40%,#000 60%,transparent);
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 40%,#000 60%,transparent)}
.sec--tickets .wrap{position:relative;z-index:1}
.ticket{display:grid;grid-template-columns:1fr 250px;border-radius:var(--r);overflow:hidden;
  border:1px solid rgba(201,162,39,.35);background:linear-gradient(150deg,#17171C,#0E0E11);
  box-shadow:0 40px 80px -50px #000}
.ticket__main{padding:clamp(1.7rem,4.2vw,3rem)}
.ticket__match{font-size:clamp(1.5rem,4.4vw,2.5rem);font-weight:900;text-transform:uppercase;line-height:1;
  font-variation-settings:"wdth" 84;margin:0 0 1.5rem}
.ticket__match em{font-style:normal;color:var(--gold);font-size:.55em;padding:0 .25em;vertical-align:.12em}
.ticket__data{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.1rem 1.6rem;margin:0 0 1.6rem;
  padding-bottom:1.6rem;border-bottom:1px dashed var(--line)}
.ticket__data dt{font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin-bottom:.3rem}
.ticket__data dd{margin:0;font-size:.98rem;font-weight:600;line-height:1.35}
.ticket__copy{color:var(--bone-60);max-width:46ch}
.ticket__mini{font-size:.72rem;color:var(--bone-40);margin:1rem 0 0}
.ticket__stub{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.2rem;
  border-left:2px dashed rgba(201,162,39,.4);background:linear-gradient(180deg,rgba(201,162,39,.1),rgba(214,25,125,.08))}
.ticket__stub img{width:120px;opacity:.95}
.ticket__stubtext{writing-mode:vertical-rl;transform:rotate(180deg);font-size:.66rem;letter-spacing:.4em;
  text-transform:uppercase;color:var(--gold-lt);font-weight:700}

/* ---------- 9. MEMORIAL ---------- */
.sec--memorial{background:linear-gradient(180deg,var(--carbon),#0F0F13)}
.urbano__text{margin-bottom:0}
.urbano__text p:last-of-type{margin-bottom:0}
.emblem{margin:0;text-align:center;padding:clamp(1.8rem,4vw,2.8rem);border-radius:var(--r);
  border:1px solid var(--line);background:radial-gradient(90% 120% at 50% 0%,rgba(214,25,125,.09),transparent 60%)}
.emblem img{width:min(300px,68vw);margin:0 auto 1.4rem}
.emblem figcaption{color:var(--bone-60);font-size:.95rem;max-width:52ch;margin-inline:auto}
.emblem figcaption b{color:var(--bone);font-weight:800}

/* ---------- 10. FILA 0 ---------- */
.sec--fila0{background:linear-gradient(165deg,#1A0A18 0%,#0D0D10 55%,#12060F 100%);
  border-block:1px solid rgba(214,25,125,.28);text-align:center;overflow:hidden}
.hive{position:absolute;inset:0;opacity:.16;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='97' viewBox='0 0 56 97'%3E%3Cg fill='none' stroke='%23D6197D' stroke-width='1.4'%3E%3Cpath d='M28 1 L54 16 L54 46 L28 61 L2 46 L2 16 Z'/%3E%3Cpath d='M28 49 L54 64 L54 94 L28 109 L2 94 L2 64 Z'/%3E%3C/g%3E%3C/svg%3E");
  mask-image:radial-gradient(70% 70% at 50% 50%,#000,transparent 78%);
  -webkit-mask-image:radial-gradient(70% 70% at 50% 50%,#000,transparent 78%)}
.sec--fila0 .wrap{position:relative;z-index:1}
.sec--fila0 .eyebrow{justify-content:center}
.sec--fila0 .eyebrow::after{display:none}
.sec--fila0 .h2{margin-bottom:1.5rem}
.sec--fila0 .prose{margin-bottom:2.2rem}
.fila0__note{font-size:.8rem;color:var(--bone-40);margin:1.2rem 0 0}

/* ---------- 11. INFO ---------- */
.sec--info{background:var(--carbon)}
.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(.9rem,2vw,1.3rem);margin-top:.6rem}
.info-card{padding:clamp(1.3rem,2.6vw,1.8rem);border-radius:var(--r);background:var(--stone);
  border:1px solid var(--line);transition:border-color .3s}
.info-card:hover{border-color:rgba(201,162,39,.35)}
.info-card h3{font-size:.72rem;letter-spacing:.22em;color:var(--gold);margin-bottom:.75rem;font-weight:800;
  font-variation-settings:"wdth" 100}
.info-card p{margin:0;font-size:.97rem;color:var(--bone-60);line-height:1.5}
.info-card__link{display:inline-block;margin-top:.9rem;font-size:.78rem;font-weight:700;letter-spacing:.09em;
  text-transform:uppercase;color:var(--bone);border-bottom:1.5px solid var(--gold);padding-bottom:2px}
.info-card__link:hover{color:var(--gold-lt)}

/* ---------- 11b. PALACIO DE LOS DEPORTES ---------- */
.venue{display:grid;grid-template-columns:1fr;
  gap:clamp(.9rem,2vw,1.3rem);margin:0 0 clamp(1.6rem,3.5vw,2.4rem)}
.venue figure{margin:0;position:relative;border-radius:var(--r);overflow:hidden;
  border:1px solid var(--line);background:#0E0E11}
.venue img{width:100%;height:100%;object-fit:cover;display:block;
  filter:saturate(.55) contrast(1.05) brightness(.82);transition:filter .5s var(--ease),transform .7s var(--ease)}
.venue figure:hover img{filter:saturate(.8) contrast(1.05) brightness(.92);transform:scale(1.03)}
.venue__main{aspect-ratio:16/9}
.venue figcaption{position:absolute;inset:auto 0 0;padding:2.6rem 1.3rem 1.1rem;
  background:linear-gradient(180deg,transparent,rgba(8,8,10,.9));
  font-size:.82rem;color:var(--bone-60);line-height:1.4}
.venue__main figcaption b{display:block;font-size:1rem;letter-spacing:.03em;text-transform:uppercase;
  font-weight:800;color:var(--bone);margin-bottom:.15rem}
.venue__main figcaption span{font-size:.78rem;letter-spacing:.06em}

/* ---------- 12. PATROCINADORES (banda clara, como el cartel) ---------- */
.sec--sponsors{background:var(--bone);color:#16161A;
  border-block:3px solid transparent;
  border-image:var(--grad-gold) 1;text-align:center}
.sec--sponsors .eyebrow{color:#8E6B14;justify-content:center}
.sec--sponsors .eyebrow::after{display:none}
.sec--sponsors .h2{color:#16161A}
.sponsors__label{font-size:.62rem;letter-spacing:.3em;text-transform:uppercase;color:rgba(22,22,26,.45);
  margin:2.8rem 0 1.1rem;font-weight:700}
.logos{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
  gap:clamp(1.5rem,4.5vw,3.4rem);padding:1.6rem clamp(1rem,3vw,2.2rem);border-radius:var(--r)}
.logos a,.strip__logos a{display:block;line-height:0}
.logos img{object-fit:contain;width:auto;transition:transform .3s var(--ease)}
.logos a:hover img,.logos img:hover{transform:scale(1.05)}
.logos a:focus-visible,.strip__logos a:focus-visible,.credits__item a:focus-visible,
.matchup__team a:focus-visible{outline:2px solid var(--gold);outline-offset:6px}
.logos--inst{background:rgba(22,22,26,.045);gap:clamp(1.3rem,3.4vw,2.6rem)}
.logos--inst img{height:clamp(36px,5.8vw,50px)}
.logos--main{background:#fff;box-shadow:0 18px 46px -30px rgba(22,22,26,.7);
  border:1px solid rgba(201,162,39,.45)}
.logos--main img{height:clamp(42px,7.4vw,66px)}
.logos--small{gap:clamp(1rem,3vw,2.2rem)}
.logos--small img{height:clamp(26px,4.2vw,36px);opacity:.85}
.logo-slot{display:flex;align-items:center;justify-content:center;width:clamp(112px,16vw,146px);height:56px;
  border:1px dashed rgba(22,22,26,.22);border-radius:8px}
.logo-slot span{font-size:.56rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(22,22,26,.3)}
.sponsors__cta{font-size:.88rem;color:rgba(22,22,26,.55);margin:2rem 0 0}
.sponsors__cta a{color:#8E6B14;font-weight:700;border-bottom:1.5px solid rgba(201,162,39,.6)}
.sponsors__cta a:hover{color:#16161A}

/* ---------- 12b. BANDA SUPERIOR DE PATROCINADORES ---------- */
.strip{background:var(--bone);color:#16161A;padding-block:1.5rem 1.7rem;
  border-block:3px solid transparent;border-image:var(--grad-gold) 1}
.strip__row{text-align:center}
.strip__row + .strip__row{margin-top:1.2rem;padding-top:1.2rem;border-top:1px solid rgba(22,22,26,.12)}
.strip__label{font-size:.58rem;letter-spacing:.32em;text-transform:uppercase;font-weight:800;
  color:rgba(22,22,26,.42);text-align:center;margin:0 0 .85rem}
.strip__row--main .strip__label{color:#8E6B14}
.strip__logos{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
  gap:clamp(1.4rem,4vw,3rem)}
.strip__logos img{width:auto;height:clamp(24px,3.2vw,32px);object-fit:contain;
  transition:transform .3s var(--ease)}
.strip__row--main .strip__logos img{height:clamp(34px,5vw,50px)}
.strip__row--mini{padding-top:1rem;margin-top:1rem}
.strip__row--mini .strip__logos{gap:clamp(1.1rem,3vw,2.2rem)}
.strip__row--mini .strip__logos img{height:clamp(20px,2.6vw,26px);opacity:.8}
.strip__logos a:hover img,.strip__logos img:hover{transform:scale(1.06)}

/* ---------- 12c. AVISOS "PRÓXIMAMENTE" ---------- */
.notice{display:flex;flex-direction:column;gap:.3rem;margin:0 0 1.6rem;padding:1rem 1.25rem;
  border-radius:12px;text-align:left;
  background:linear-gradient(120deg,rgba(201,162,39,.16),rgba(201,162,39,.05));
  border:1px solid rgba(201,162,39,.5)}
.notice b{font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-lt);font-weight:800}
.notice span{font-size:.92rem;color:var(--bone-60)}
.notice--rose{background:linear-gradient(120deg,rgba(214,25,125,.18),rgba(214,25,125,.05));
  border-color:rgba(240,78,158,.5);text-align:center;align-items:center;max-width:34rem;margin-inline:auto}
.notice--rose b{color:var(--rose-lt)}
.notice[hidden]{display:none}

/* ---------- 12d. URBANO ---------- */
.urbano{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  gap:clamp(1.6rem,4vw,3.2rem);align-items:center;margin-bottom:clamp(2.6rem,6vw,3.8rem)}
.urbano__photo{margin:0;position:relative}
.urbano__photo img{width:100%;border-radius:var(--r);
  filter:grayscale(1) contrast(1.06);box-shadow:0 34px 70px -40px #000}
.urbano__photo::after{content:"";position:absolute;inset:0;border-radius:var(--r);pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(201,162,39,.35),inset 0 -80px 90px -60px rgba(214,25,125,.35)}
.urbano__photo figcaption{margin-top:.85rem;font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;
  font-weight:700;color:var(--gold)}
.urbano__quote{margin:1.4rem 0 0;padding-left:1.1rem;border-left:2px solid var(--gold);
  color:var(--bone);font-size:1.02em;font-weight:600;font-style:italic;line-height:1.5}

/* ---------- 12e. CRÉDITOS: A FAVOR DE / ORGANIZA ---------- */
.credits{display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:1.15rem;margin:2.4rem auto 0;padding-top:1.6rem;width:100%;max-width:460px;
  text-align:center;border-top:1px solid rgba(22,22,26,.12)}
.credits__item{display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:.45rem;margin:0;width:100%;text-align:center}
.credits__item span{display:block;width:100%;font-size:.6rem;letter-spacing:.26em;
  text-transform:uppercase;font-weight:800;color:rgba(22,22,26,.38)}
.credits__item a{display:block;line-height:0;margin-inline:auto}
.credits__item img{display:block;width:auto;height:36px;object-fit:contain;margin-inline:auto;
  transition:transform .3s var(--ease),opacity .3s var(--ease)}
.credits__item a:hover img{transform:scale(1.06)}
.credits--strip{margin-top:1.2rem;padding-top:1.1rem;gap:.95rem}
.credits--strip .credits__item img{height:30px}

.credits--dark{border-top-color:var(--line)}
.credits--dark .credits__item span{color:rgba(242,238,230,.34)}
.credits--dark .credits__item img{opacity:.7;height:30px}
.credits--dark .credits__item a:hover img{opacity:1}

/* pie: fila propia, centrada y discreta */
.credits--foot{grid-column:1/-1;flex-direction:row;flex-wrap:wrap;align-items:center;
  gap:.6rem 2.4rem;max-width:none;margin:1.8rem 0 0;padding-top:1.5rem}
.credits--foot .credits__item{width:auto}
.credits--foot .credits__item span{font-size:.55rem;letter-spacing:.22em}
.credits--foot .credits__item img{height:26px;opacity:.6}

/* ---------- 12f. AVISO DE APERTURA DE VENTA ---------- */
.onsale{display:inline-flex;flex-direction:column;align-items:center;gap:.2rem;
  margin:0 0 1.1rem;padding:.6rem 1.3rem;border-radius:999px;
  background:linear-gradient(120deg,rgba(201,162,39,.2),rgba(201,162,39,.06));
  border:1px solid rgba(201,162,39,.55)}
.onsale b{font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;font-weight:800;
  color:var(--gold-lt)}
.onsale span{font-size:.68rem;letter-spacing:.06em;color:var(--bone-60)}
.onsale[hidden]{display:none}

/* ---------- 13. CTA FINAL ---------- */
.sec--final{text-align:center;overflow:hidden;padding-block:clamp(5rem,12vw,9rem)}
.final__bg{position:absolute;inset:0;
  background-image:url("../img/fondo-desktop.jpg");
  background-image:image-set(url("../img/fondo-desktop.webp") type("image/webp"),url("../img/fondo-desktop.jpg") type("image/jpeg"));
  background-size:cover;background-position:50% 40%;opacity:.55}
.final__bg::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,var(--carbon),rgba(11,11,13,.62) 45%,var(--carbon))}
.sec--final .wrap{position:relative;z-index:1}
.final__title{font-size:clamp(2.5rem,8.6vw,5.4rem);font-variation-settings:"wdth" 80;margin:0 0 1rem}
.final__sub{font-size:clamp(1.05rem,3vw,1.5rem);color:var(--gold-lt);letter-spacing:.06em;font-weight:600;margin:0 0 .5rem}
.final__fixture{font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;color:var(--bone-40);margin:0 0 2.2rem}
.share{margin-top:2.6rem;text-align:center}
.share__label{display:block;font-size:.64rem;letter-spacing:.32em;text-transform:uppercase;
  color:var(--bone-40);margin-bottom:1rem;font-weight:700}
.share__list{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.7rem}
.share__list a,.share__list button{display:grid;place-items:center;width:48px;height:48px;padding:0;
  border-radius:50%;background:rgba(242,238,230,.06);border:1px solid var(--line);color:var(--bone-60);
  cursor:pointer;transition:color .25s,background .25s,border-color .25s,transform .25s var(--ease)}
.share__list svg{width:21px;height:21px;fill:currentColor}
.share__list a:hover,.share__list button:hover{color:#14100A;background:var(--grad-gold);
  border-color:transparent;transform:translateY(-3px)}
.share__done{font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ela);margin:.9rem 0 0}
.share__done[hidden]{display:none}

/* ---------- 14. FOOTER ---------- */
.foot{background:#08080A;border-top:1px solid var(--line);padding-block:3.2rem 6.5rem}
.foot__wrap{display:grid;gap:2.2rem;grid-template-columns:1.4fr 1fr 1fr;align-items:start}
.foot__brand{display:flex;gap:1rem;align-items:center}
.foot__col{display:flex;flex-direction:column;gap:.2rem}
.foot__brand img{width:64px;flex:none}
.foot__brand p{margin:0;font-size:.82rem;color:var(--bone-40);line-height:1.5}
.foot__brand b{color:var(--bone);font-size:.88rem}
.foot__nav{display:flex;flex-direction:column;gap:.55rem;font-size:.8rem;color:var(--bone-40);letter-spacing:.06em}
.foot__nav a:hover{color:var(--bone)}
.foot__legal{font-size:.74rem;color:var(--bone-40);text-align:right}
.foot__legal p{margin:0 0 .9rem}
.foot__intdea{display:flex;align-items:center;justify-content:flex-end;gap:.6rem;
  font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(242,238,230,.3)}
.foot__intdea img{width:74px;opacity:.55;transition:opacity .3s}
.foot__intdea a:hover img{opacity:1}

/* ---------- 15. DOCK MÓVIL ---------- */
.dock{position:fixed;left:0;right:0;bottom:0;z-index:95;display:none;gap:.55rem;
  padding:.6rem var(--pad) calc(.6rem + env(safe-area-inset-bottom));
  background:rgba(9,9,11,.93);backdrop-filter:blur(12px);border-top:1px solid var(--line);
  transform:translateY(110%);transition:transform .4s var(--ease)}
.dock.is-on{transform:translateY(0)}
.dock .btn{flex:1;--bh:3.1rem;padding:0 .8rem;font-size:.75rem;letter-spacing:.1em}
.dock .btn--ghost{flex:0 0 34%}


/* ---------- 16. ANIMACIONES ---------- */
.reveal{opacity:0;transform:translateY(26px);
  transition:opacity .75s var(--ease) var(--d,0ms),transform .75s var(--ease) var(--d,0ms)}
.reveal.is-in{opacity:1;transform:none}

.hero__emblem,.hero__eyebrow,.hero__title,.hero__slogan,.hero__fixture,.board,.hero .cta-row,.hero__note{
  opacity:0;animation:up .9s var(--ease) forwards}
.hero__emblem{animation:pop 1.1s var(--ease) forwards}
.hero__eyebrow{animation-delay:.18s}
.hero__title{animation-delay:.26s}
.hero__slogan{animation-delay:.72s}
.hero__fixture{animation-delay:.82s}
.board{animation-delay:.9s}
.onsale{opacity:0;animation:up .9s var(--ease) .95s forwards}
.hero .cta-row{animation-delay:1.05s}
.hero__note{animation-delay:1.15s}
.matchup__team{opacity:0;animation:slideIn 1s var(--ease) .42s forwards}
.matchup__team--r{animation-name:slideInR}
.matchup__vs{opacity:0;animation:pop .7s var(--ease) .78s forwards}

@keyframes up{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes pop{from{opacity:0;transform:scale(.86)}to{opacity:1;transform:none}}
@keyframes slideIn{from{opacity:0;transform:translateX(-70px) rotate(-8deg)}to{opacity:1;transform:none}}
@keyframes slideInR{from{opacity:0;transform:translateX(70px) rotate(8deg)}to{opacity:1;transform:none}}

/* ---------- 17. RESPONSIVE ---------- */
@media (min-width:700px){
  .hero__bg{background-image:url("../img/fondo-desktop.jpg");
    background-image:image-set(url("../img/fondo-desktop.webp") type("image/webp"),url("../img/fondo-desktop.jpg") type("image/jpeg"))}
}
@media (max-width:1000px){
  .urbano{grid-template-columns:1fr;gap:1.8rem}
  .urbano__photo{max-width:420px;margin-inline:auto}
  .pillars{grid-template-columns:1fr}
  .info-grid{grid-template-columns:repeat(2,1fr)}
  .ticket{grid-template-columns:1fr}
  .ticket__stub{flex-direction:row;border-left:0;border-top:2px dashed rgba(201,162,39,.4);padding:1.4rem;gap:1.6rem}
  .ticket__stubtext{writing-mode:horizontal-tb;transform:none}
  .ticket__stub img{width:88px}
  .foot__wrap{grid-template-columns:1fr 1fr}
  .foot__legal{grid-column:1/-1;text-align:left}
  .foot__intdea{justify-content:flex-start}
}
@media (max-width:860px){
  .nav__toggle{display:block}
  .nav__menu{position:fixed;inset:0 0 auto;padding:5.2rem var(--pad) 2.2rem;flex-direction:column;
    align-items:stretch;gap:1.35rem;background:rgba(8,8,10,.97);backdrop-filter:blur(16px);
    border-bottom:1px solid var(--line);transform:translateY(-102%);transition:transform .45s var(--ease);
    text-align:center}
  .nav.is-open .nav__menu{transform:translateY(0)}
  .nav__menu a{font-size:1rem;letter-spacing:.2em}
  .nav__menu .btn{margin-top:.4rem}
  .nav.is-open{background:rgba(8,8,10,.97)}
  .dock{display:flex}
  .foot{padding-bottom:7.5rem}
  .hero{min-height:auto;padding-top:7rem;padding-bottom:4.5rem}
  .hero__cue{display:none}
  .board__cell{min-width:2.6rem}
}
@media (max-width:620px){
  .strip__logos{gap:1.1rem 1.6rem}
  .credits--foot{gap:1rem 1.6rem}
  .venue{grid-template-columns:1fr}
  .info-grid{grid-template-columns:1fr}
  .ticket__data{grid-template-columns:1fr}
  .eyebrow::after{max-width:70px}
  .cta-row .btn{width:100%}
  .hero .cta-row .btn{width:100%}
  .foot__wrap{grid-template-columns:1fr}
  .foot__legal{text-align:left}
}

/* pantallas de escritorio poco altas: el hero cabe entero */
@media (min-width:861px) and (max-height:840px){
  .hero__emblem{width:190px}
  .hero__title{font-size:clamp(2.6rem,5.6vw,4.4rem)}
  .matchup__team img{width:104px}
  .hero__slogan{width:280px;margin-bottom:.9rem}
  .board{margin-bottom:1.1rem;padding:.65rem 1.1rem .55rem}
  .board__cell b{font-size:1.75rem}
  .hero{padding-bottom:3.4rem}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-delay:0ms!important;
    transition-duration:.001ms!important}
  .reveal{opacity:1;transform:none}
  .hero__emblem,.hero__eyebrow,.hero__title,.hero__slogan,.hero__fixture,.board,
  .hero .cta-row,.hero__note,.onsale,.matchup__team,.matchup__vs{opacity:1}
}
