/* ============================================================
   Enduro Army — light "race program" theme
   White/paper canvas · near-black ink type · racing blue spine ·
   Costa-Rica red energy accent · Big Shoulders headlines + Geist body
   ============================================================ */
:root{
  --paper:    #ffffff;
  --paper-2:  #f5f6f4;   /* warm off-white section bg */
  --paper-3:  #ecedeb;   /* fills / alt rows */
  --ink:      #0c1116;   /* near-black — headlines & text */
  --panel:    #0c1116;   /* ALWAYS-dark surface (footer, promo cards, dark bands) — stays dark in both themes */
  --ink-2:    #11181d;
  --ink-soft: #39434b;   /* body copy */
  --ink-faint:#5c656e;   /* muted labels — darkened for AA contrast */
  --blue:     #0a5fd0;   /* racing blue — primary */
  --blue-deep:#0846a3;
  --blue-tint:#e7eefb;
  --red:      #e0312e;   /* CR red — energy accent (sparing) */
  --red-tint: #fbe6e5;
  --green:    #1f9d57;   /* category only */
  --gold:     #c98a14;   /* category only */
  --line:     rgba(12,17,22,.12);
  --line-2:   rgba(12,17,22,.07);
  --line-strong:rgba(12,17,22,.22);
  --bluebar:  #0a5fd0;
  --rowlight: #ffffff;
  --rowalt:   #f3f4f1;
  --shadow:   0 22px 48px -26px rgba(12,17,22,.32);
  --shadow-sm:0 8px 22px -14px rgba(12,17,22,.3);
  --hero-scrim-rgb:255,255,255;   /* hero text sits on this — flips dark in dark theme */
  --r:        12px;
  --maxw:     1240px;
  --font-disp:'Big Shoulders Display','Arial Narrow',system-ui,sans-serif;
  --font-cond:'Geist',system-ui,'Segoe UI',sans-serif;
  --font-body:'Geist',system-ui,'Segoe UI',sans-serif;
}

/* ============ DARK THEME ============ */
:root[data-theme="dark"]{
  --paper:    #0e141b;   /* page bg */
  --paper-2:  #151d26;   /* section bg / cards */
  --paper-3:  #1d2732;   /* fills / alt rows */
  --ink:      #eef2f6;   /* headlines & text */
  --ink-2:    #f4f7fa;
  --ink-soft: #c2ccd6;   /* body copy */
  --ink-faint:#8b97a3;   /* muted labels */
  --blue:     #3d8bff;   /* racing blue — brighter for dark */
  --btn-blue: #2b6fdf;   /* white text needs 4.5:1 (AA); #3d8bff only gives 3.3 */
  --blue-deep:#2f6fd0;
  --blue-tint:rgba(61,139,255,.16);
  --red:      #ff5a52;
  --red-tint: rgba(255,90,82,.16);
  --green:    #34b268;
  --gold:     #e0a437;
  --line:     rgba(255,255,255,.14);
  --line-2:   rgba(255,255,255,.07);
  --line-strong:rgba(255,255,255,.26);
  --bluebar:  #3d8bff;
  --rowlight: #151d26;
  --rowalt:   #111820;
  --shadow:   0 24px 50px -26px rgba(0,0,0,.7);
  --shadow-sm:0 10px 26px -16px rgba(0,0,0,.7);
  --hero-scrim-rgb:8,11,15;   /* dark scrim so white hero text reads */
}
html{background:var(--paper)}

/* theme toggle button — the two icons stack in one cell and cross-fade/rotate
   between sun & moon (the icon shown is the mode you'll switch TO) */
/* theme toggle — a small motorcycle headlight that lights up in light mode */
.theme-toggle{position:relative;display:inline-grid;place-items:center;width:2.3rem;height:2.3rem;padding:0;border:0;background:transparent;color:currentColor;cursor:pointer;border-radius:50%;transition:background .2s ease}
.theme-toggle:hover{background:var(--paper-3)}
.theme-headlight{width:21px;height:21px;overflow:visible;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.theme-headlight .hl-lens{transition:stroke .35s ease}
/* bulb core: dim when the headlight is off (dark mode) */
.theme-headlight .hl-core{stroke:none;fill:currentColor;opacity:.28;transform-origin:9.4px 12px;
  transition:opacity .35s ease, fill .35s ease, transform .5s cubic-bezier(.34,1.35,.4,1)}
/* beams: retracted and hidden when off */
.theme-headlight .hl-beam path{stroke:currentColor;opacity:0;transform-origin:9.4px 12px;transform:translateX(-3px);
  transition:opacity .3s ease, transform .45s cubic-bezier(.34,1.35,.4,1)}
/* LIGHT mode → headlight ON: glowing amber bulb + beams shining out */
:root[data-theme="light"] .theme-headlight .hl-lens{stroke:#e0a512}
:root[data-theme="light"] .theme-headlight .hl-core{opacity:1;fill:#ffcf47;transform:scale(1.08);filter:drop-shadow(0 0 3px rgba(255,193,60,.85))}
:root[data-theme="light"] .theme-headlight .hl-beam path{stroke:#f0b21e;opacity:.95;transform:translateX(0)}
:root[data-theme="light"] .theme-headlight .hl-beam path:nth-child(2){transition-delay:.05s}
:root[data-theme="light"] .theme-headlight .hl-beam path:nth-child(3){transition-delay:.1s}
/* while switching themes, ease surface colours across the whole page (~.4s) */
:root.theming *{transition:background-color .35s ease, color .35s ease, border-color .35s ease, fill .35s ease !important}
@media (prefers-reduced-motion: reduce){
  .theme-headlight .hl-core,.theme-headlight .hl-beam path{transition:opacity .01s;transform:none}
  :root.theming *{transition:none !important}
}

/* ============ GLOBAL FOCUS RING (a11y) ============ */
:focus-visible{outline:3px solid var(--blue);outline-offset:2px;border-radius:3px}
a:focus-visible,button:focus-visible,summary:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--blue);outline-offset:2px}

/* ============ MOTION — page-load stagger + scroll reveal ============ */
@keyframes ea-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
/* only hide for reveal when JS is present to bring it back (no-JS = content shows) */
html.js .reveal{opacity:0}
.reveal.is-visible{animation:ea-rise .6s cubic-bezier(.2,.7,.2,1) both}
.hero-stagger>*{opacity:0;animation:ea-rise .7s cubic-bezier(.2,.7,.2,1) both}
.hero-stagger>*:nth-child(1){animation-delay:.05s}
.hero-stagger>*:nth-child(2){animation-delay:.15s}
.hero-stagger>*:nth-child(3){animation-delay:.25s}
.hero-stagger>*:nth-child(4){animation-delay:.35s}
.hero-stagger>*:nth-child(5){animation-delay:.45s}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .reveal,.hero-stagger>*{opacity:1!important;transform:none!important}
}

/* ============ HERO / CARD ATMOSPHERE ============ */
/* fine grain + edge vignette so posterless gradients read as designed */
.hero::before,.ei-card::before,.coverage-card::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    radial-gradient(120% 90% at 50% 20%,transparent 40%,rgba(6,9,13,.28) 100%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='.04'/%3E%3C/svg%3E");
  mix-blend-mode:overlay;
}
.hero{position:relative}
.hero-window-note{z-index:3}

/* ============ ABOUT band (home) ============ */
.about-inner{max-width:840px;margin:0 auto;text-align:center;padding:.5rem 0}
.about-logo{display:block;height:auto;width:min(240px,60vw);margin:.4rem auto 1rem;filter:drop-shadow(0 6px 18px rgba(0,0,0,.35))}
.about-body{font-size:1.05rem;line-height:1.7;color:var(--ink-soft);max-width:700px;margin:.9rem auto 0}
.about-points{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:2.2rem}
.about-point{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:1.3rem 1rem;border:1px solid var(--line);border-radius:var(--r);background:var(--paper-2)}
.about-point-num{font-family:var(--font-disp);font-size:1.7rem;color:var(--blue);line-height:1;letter-spacing:.02em}
.about-point>span:last-child{font-family:var(--font-cond);font-weight:600;font-size:.92rem;color:var(--ink);line-height:1.3}
@media(max-width:680px){.about-points{grid-template-columns:1fr;gap:.7rem}}

/* ---- About page: socials, team, investors ---- */
.about-h2{font-family:var(--font-disp);text-transform:uppercase;font-size:clamp(1.6rem,4vw,2.4rem);color:var(--ink);margin:0 0 .3rem;letter-spacing:.01em}
.about-socials{display:flex;justify-content:center;gap:.7rem;margin-top:1.8rem;flex-wrap:wrap}
.about-social{width:48px;height:48px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;color:var(--ink);background:var(--paper);transition:.2s}
.about-social:hover{background:var(--blue);border-color:var(--blue);color:#fff;transform:translateY(-2px)}
.about-social svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8}
.about-social .ico-wa{fill:currentColor;stroke:none}
/* about page image hero (top banner) */
.about-hero{position:relative;min-height:min(72vh,640px);display:flex;align-items:flex-end;overflow:hidden;background:var(--panel) center/cover no-repeat fixed;background-image:url('assets/about-hero.webp')}
/* Mobile: background-attachment:fixed is janky/unsupported on iOS & Android,
   so fall back to a normal scrolling cover image there. */
@media (max-width:820px), (hover:none) and (pointer:coarse){
  .about-hero{min-height:min(56vh,460px);background-attachment:scroll}
}
.about-hero-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,9,12,.28) 0%,rgba(6,9,12,.35) 55%,rgba(6,9,12,.78) 100%)}
.about-hero-inner{position:relative;z-index:1;max-width:var(--maxw);margin:0 auto;width:100%;padding:2.4rem 1.4rem;text-align:center}
.about-hero .page-title{color:#fff}
.about-hero .page-sub{color:rgba(255,255,255,.88)}
/* mission panel */
.about-mission{max-width:760px;margin:2.8rem auto 0;padding:2rem 2rem 2.1rem;border:1px solid var(--line);border-left:4px solid var(--blue);border-radius:var(--r);background:var(--paper-2);text-align:center}
.about-kicker{display:inline-block;font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.16em;font-size:.8rem;color:var(--blue)}
.about-mission-text{font-size:1.08rem;line-height:1.7;color:var(--ink);margin:.7rem 0 0}
/* team band */
.about-band{background:var(--paper-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:3rem 0;margin-top:3rem}
.team-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:1.4rem;margin:2rem auto 0;max-width:840px}
.team-card{margin:0;display:flex;flex-direction:column;align-items:center;text-align:center;padding:1.7rem 1rem;border:1px solid var(--line);border-radius:var(--r);background:var(--paper)}
.team-avatar{width:96px;height:96px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:linear-gradient(140deg,var(--blue),var(--blue-deep));color:#fff;font-family:var(--font-disp);font-size:2rem;line-height:1;margin-bottom:.9rem}
.team-avatar img{width:100%;height:100%;object-fit:cover}
.team-name{font-family:var(--font-disp);text-transform:uppercase;font-size:1.25rem;color:var(--ink);line-height:1}
.team-role{font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:.78rem;color:var(--blue);margin-top:.35rem}
.team-bio{color:var(--ink-soft);font-size:.9rem;line-height:1.5;margin-top:.6rem}
/* investors / partners */
.about-invest{padding-top:3rem}
.about-cta-row{display:flex;justify-content:center;gap:.8rem;flex-wrap:wrap;margin-top:1.6rem}
.about-cta-primary{background:var(--blue);color:#fff;border-radius:999px;padding:.85rem 1.9rem;font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.about-cta-primary:hover{background:var(--blue-deep);transform:translateY(-2px)}
.about-cta-ghost{background:transparent;color:var(--ink);border:1px solid var(--line);border-radius:999px;padding:.85rem 1.9rem;font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.about-cta-ghost:hover{border-color:var(--blue);color:var(--blue)}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--font-body);
  background:var(--paper);
  color:var(--ink-soft);
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
/* subtle paper atmosphere — faint topographic lines + corner tints */
body::before{
  content:"";position:fixed;inset:0;z-index:-2;
  background:
    radial-gradient(900px 520px at 100% -6%, rgba(10,95,208,.06), transparent 60%),
    radial-gradient(760px 520px at -6% 104%, rgba(224,49,46,.045), transparent 60%),
    var(--paper);
}
body::after{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.6;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='620' height='620'%3E%3Cg fill='none' stroke='%230c1116' stroke-opacity='0.028' stroke-width='1.2'%3E%3Cpath d='M0 130 Q155 70 310 130 T620 130'/%3E%3Cpath d='M0 220 Q155 160 310 220 T620 220'/%3E%3Cpath d='M0 310 Q155 250 310 310 T620 310'/%3E%3Cpath d='M0 400 Q155 340 310 400 T620 400'/%3E%3Cpath d='M0 490 Q155 430 310 490 T620 490'/%3E%3C/g%3E%3C/svg%3E");
  background-size:620px 620px;
}

a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.ital{font-style:normal;color:var(--blue)}
.kicker{
  font-family:var(--font-cond);font-weight:700;
  text-transform:uppercase;letter-spacing:.2em;font-size:.76rem;
  color:var(--red);margin-bottom:.5rem;
}

/* ============ HEADER / NAV ============ */
.site-header{
  position:sticky;top:0;z-index:100;
  background:transparent;
  border-bottom:1px solid transparent;
  transition:background .3s ease,border-color .3s ease;
}
/* legibility scrim under the tabs while the header floats over the hero image */
.site-header::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(6,9,12,.6) 0%,rgba(6,9,12,.18) 55%,rgba(6,9,12,0) 100%);
  opacity:1;transition:opacity .3s ease;
}
/* solid bar once scrolled (or on any non-hero page) */
.site-header.is-solid{background:#000;border-bottom-color:rgba(255,255,255,.1)}
.site-header.is-solid::before{opacity:0}
.header-inner{
  position:relative;z-index:1;
  max-width:var(--maxw);margin:0 auto;padding:.6rem 1.3rem;
  display:flex;align-items:center;gap:1rem;justify-content:space-between;
}
.brand{display:flex;align-items:center;gap:.6rem;flex:none}
.brand-logo{height:48px;width:auto;display:block;object-fit:contain;border-radius:12px;transition:transform .25s cubic-bezier(.2,1.2,.3,1)}
.brand:hover .brand-logo{transform:scale(1.05)}
.brand-mark{
  width:48px;height:48px;display:grid;place-items:center;overflow:hidden;position:relative;
  background:linear-gradient(143deg,#2f8dff 0%,var(--blue) 36%,var(--blue-deep) 70%,#06234a 100%);
  border-radius:9px;transform:rotate(-6deg) skewX(-3deg);
  box-shadow:0 10px 22px -8px rgba(10,95,208,.85),inset 0 0 0 1px rgba(255,255,255,.14);
  transition:transform .25s cubic-bezier(.2,1.2,.3,1);
}
/* sharp red corner notch — hard-enduro hazard accent */
.brand-mark::after{content:"";position:absolute;top:0;right:0;border-width:0 11px 11px 0;border-style:solid;border-color:transparent var(--red) transparent transparent;filter:drop-shadow(-1px 1px 0 rgba(0,0,0,.15))}
.brand:hover .brand-mark{transform:rotate(-6deg) skewX(-3deg) scale(1.06)}
.brand-svg{width:42px;height:42px;transform:skewX(3deg)}
/* aggressive hard-enduro emblem */
.bk-ridge{fill:rgba(255,255,255,.16)}
.bk-knob{fill:none;stroke:#fff;stroke-width:2.4;stroke-dasharray:1.7 3;stroke-linecap:round}
.bk-rim{fill:none;stroke:#fff;stroke-width:2}
.bk-hub{fill:#fff}
.bk-body{fill:#fff}
.bk-frame{fill:none;stroke:#fff;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.bk-roost{fill:none;stroke:var(--gold);stroke-width:2.6;stroke-linecap:round}
/* wordmark */
.brand-text{display:flex;align-items:center}
.brand-word{
  font-family:var(--font-disp);font-weight:800;font-size:1.4rem;
  letter-spacing:.003em;line-height:1;color:var(--ink);white-space:nowrap;
}
.brand-word em{font-style:normal;color:var(--blue)}
.brand-word b{font-weight:inherit;color:var(--red)}
/* header wordmark beside the logo — white & heavy on the black bar */
.brand-word-head{color:#fff;font-weight:900;letter-spacing:.01em;font-size:1.5rem;text-transform:uppercase}

.main-nav{display:flex;align-items:center;gap:0}
/* centered-logo header: tab groups split left/right, logo floated dead-center */
.header-inner-centered{position:relative}
.header-inner-centered .main-nav{flex:0 1 auto;width:auto;justify-content:flex-end;gap:1.2rem}
.nav-side{display:flex;align-items:center;gap:.1rem}
.nav-side-right{gap:.1rem}
.brand-center{position:static;transform:none;z-index:2;gap:0;margin-right:auto}
.brand-center .brand-logo{height:52px}
.nav-tab{
  font-family:var(--font-cond);font-weight:700;text-transform:uppercase;
  letter-spacing:.02em;font-size:.8rem;color:#fff;white-space:nowrap;
  padding:.45rem .58rem;border-radius:8px;position:relative;transition:.18s;
}
.nav-tab::after{content:"";position:absolute;left:.58rem;right:.58rem;bottom:.26rem;height:2px;background:#6db0ff;transform:scaleX(0);transition:transform .2s;transform-origin:left}
.nav-tab:hover{color:#fff}
.nav-tab:hover::after{transform:scaleX(1)}
.nav-tab.is-active{color:#6db0ff}
.nav-tab.is-active::after{transform:scaleX(1)}
.nav-cta{
  margin-left:.4rem;color:#fff!important;background:var(--red);
  font-weight:700;padding:.5rem .95rem;
}
.nav-cta::after{display:none}
.nav-cta:hover{background:#c52723;color:#fff}
.nav-cta.is-active{color:#fff}

.nav-toggle{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:6px}
.nav-toggle span{width:26px;height:3px;background:#fff;border-radius:3px;transition:.25s}

/* ============ VIEWS ============ */
.view{display:none;animation:fade .4s ease}
.view.is-active{display:block}
@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.section{max-width:var(--maxw);margin:0 auto;padding:4.5rem 1.4rem}
.section-head{margin-bottom:2rem}
.section-title{
  font-family:var(--font-disp);text-transform:uppercase;color:var(--ink);
  font-size:clamp(2rem,5vw,3.4rem);line-height:.92;letter-spacing:.004em;
}

/* ============ HERO CAROUSEL (editorial white scrim) ============ */
.hero{position:relative;height:min(80vh,700px);min-height:540px;overflow:hidden;background:var(--paper-2);border-bottom:1px solid var(--line);padding-top:64px}
.hero-track{height:100%;width:100%;position:relative}
.hero-slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .7s ease;display:flex;align-items:center}
.hero-slide.is-active{opacity:1;visibility:visible;z-index:2}
.hero-bg{position:absolute;inset:0;background-size:cover;background-position:center right;transform:scale(1.05)}
.hero-slide.is-active .hero-bg{animation:kenburns 9s ease-out forwards}
@keyframes kenburns{from{transform:scale(1.1)}to{transform:scale(1)}}
.hero-scrim{
  position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(var(--hero-scrim-rgb),.98) 0%,rgba(var(--hero-scrim-rgb),.92) 30%,rgba(var(--hero-scrim-rgb),.55) 52%,rgba(var(--hero-scrim-rgb),.05) 78%,transparent 100%),
    linear-gradient(0deg,rgba(var(--hero-scrim-rgb),.9) 0%,transparent 26%);
}
.hero-inner{position:relative;z-index:3;max-width:var(--maxw);margin:0 auto;width:100%;padding:0 1.4rem}
.hero-top{display:flex;align-items:center;gap:.6rem;margin-bottom:1rem;flex-wrap:wrap}
.hero-status{
  display:inline-flex;align-items:center;gap:.5rem;
  font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.1em;
  font-size:.76rem;padding:.32rem .75rem;border-radius:100px;
}
.hero-status.upcoming{background:var(--blue-tint);color:var(--blue-deep)}
.hero-status.recap{background:var(--red-tint);color:#b3231f}
.hero-status .dot{width:8px;height:8px;border-radius:50%;background:currentColor;animation:pulse 1.8s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(10,95,208,.45)}70%{box-shadow:0 0 0 9px transparent}100%{box-shadow:0 0 0 0 transparent}}
.hero-name{
  font-family:var(--font-disp);text-transform:uppercase;color:var(--ink);
  font-size:clamp(2.1rem,5vw,4.3rem);line-height:.92;max-width:22ch;
  /* never spill past two rows — long titles run wider, not taller */
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;
  overflow:hidden;
}
.hero-place{
  display:flex;align-items:center;gap:.5rem;margin-top:.9rem;
  font-family:var(--font-cond);font-weight:600;text-transform:uppercase;letter-spacing:.05em;
  font-size:1.05rem;color:var(--ink-2);
}
.hero-place .flag{font-size:1.3rem}
.hero-desc{max-width:44ch;margin:1rem 0 1.6rem;font-size:1.08rem;color:var(--ink-soft)}
.hero-foot{display:flex;align-items:center;gap:.9rem;flex-wrap:wrap}
.hero-date{
  display:flex;flex-direction:column;line-height:1;padding:.55rem .95rem;
  background:var(--paper);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow-sm);
}
.hero-date .hd-day{font-family:var(--font-disp);font-size:1.8rem;color:var(--red)}
.hero-date .hd-mon{font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.14em;font-size:.74rem;color:var(--ink-faint)}

.hero-arrow{
  position:absolute;bottom:1.3rem;z-index:5;
  width:52px;height:52px;border-radius:50%;border:1px solid var(--line);
  background:rgba(255,255,255,.9);backdrop-filter:blur(6px);color:var(--ink);
  cursor:pointer;display:grid;place-items:center;transition:.2s;box-shadow:var(--shadow-sm);
}
.hero-arrow:hover{background:var(--blue);color:#fff;border-color:var(--blue);transform:scale(1.06)}
.hero-arrow svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.hero-prev{left:auto;right:5.4rem}.hero-next{right:1.4rem}
.hero-dots{position:absolute;bottom:1.3rem;left:50%;transform:translateX(-50%);z-index:5;display:flex;gap:.5rem}
.hero-dots button{width:30px;height:5px;border-radius:4px;border:0;background:rgba(12,17,22,.22);cursor:pointer;transition:.25s}
.hero-dots button.is-active{background:var(--blue);width:46px}
.hero-window-note{
  position:absolute;top:1rem;right:1.4rem;z-index:5;
  font-family:var(--font-cond);font-weight:600;text-transform:uppercase;letter-spacing:.1em;
  font-size:.72rem;color:var(--ink-faint);background:rgba(255,255,255,.8);
  padding:.32rem .7rem;border-radius:100px;border:1px solid var(--line);
}

/* ============ BUTTONS ============ */
.btn{
  font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.05em;
  font-size:.92rem;padding:.85rem 1.5rem;border-radius:9px;border:0;cursor:pointer;
  display:inline-flex;align-items:center;gap:.5rem;transition:.2s;justify-content:center;
}
.btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.btn .ico-wa{fill:currentColor;stroke:none;width:19px;height:19px}
.btn-primary{background:var(--btn-blue,var(--blue));color:#fff;box-shadow:0 12px 26px -12px rgba(10,95,208,.7)}
.btn-primary:hover{background:var(--blue-deep);transform:translateY(-2px)}
.btn-ghost{background:var(--paper);color:var(--ink);border:1px solid var(--line-strong)}
.btn-ghost:hover{border-color:var(--ink);background:var(--paper-2)}
.btn-block{width:100%}
.btn-sm{padding:.5rem .9rem;font-size:.82rem}

/* ============ COVERAGE (3 enduro recaps → YouTube) ============ */
.coverage-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.coverage-card{
  position:relative;border-radius:var(--r);overflow:hidden;aspect-ratio:16/9;
  border:1px solid var(--line);background:var(--paper-2);cursor:pointer;
  display:flex;align-items:flex-end;transition:.3s;box-shadow:var(--shadow-sm);
}
.coverage-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.coverage-card:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.coverage-card .cc-media{position:absolute;inset:0;background-size:cover;background-position:center;transition:.5s}
.coverage-card:hover .cc-media{transform:scale(1.06)}
.coverage-card::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,12,16,.92),transparent 58%);transition:.3s}
.cc-body{position:relative;z-index:2;padding:1.2rem}
.cc-tag{font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-size:.7rem;color:#ff8d6b}
.cc-title{font-family:var(--font-disp);text-transform:uppercase;font-size:1.4rem;line-height:1;margin-top:.3rem;color:#fff}
/* centered play button — YouTube facade */
.cc-play{
  position:absolute;top:42%;left:50%;transform:translate(-50%,-50%);z-index:3;
  width:62px;height:62px;border-radius:50%;border:0;cursor:pointer;
  background:rgba(224,49,46,.92);display:grid;place-items:center;
  box-shadow:0 10px 26px -8px rgba(0,0,0,.6);transition:.22s;
}
.coverage-card:hover .cc-play{transform:translate(-50%,-50%) scale(1.1);background:var(--red)}
/* cards without a real video open a YouTube search — de-emphasize so the button
   doesn't imply an embedded player */
.coverage-card.is-search .cc-play{background:rgba(12,17,22,.72);width:52px;height:52px}
.coverage-card.is-search:hover .cc-play{background:var(--blue)}
.coverage-card.is-search .cc-play svg{width:22px;height:22px;margin-left:0}
.cc-play svg{width:26px;height:26px;fill:#fff;margin-left:3px}
/* once playing, the iframe takes over the whole card */
.coverage-card.is-playing{cursor:default}
.coverage-card.is-playing::after{opacity:0}
.cc-iframe{position:absolute;inset:0;width:100%;height:100%;border:0;z-index:4}

/* ============ POWERED BY (sponsor marquee) — compact ============ */
.powered{background:var(--panel);padding:.85rem 0;overflow:hidden;border-top:2px solid var(--blue);border-bottom:1px solid rgba(255,255,255,.08)}
.powered-kicker{
  text-align:center;font-family:var(--font-cond);font-weight:700;text-transform:uppercase;
  letter-spacing:.16em;font-size:.68rem;color:#9aa2a9;margin-bottom:.55rem;
}
.marquee{
  position:relative;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
}
.marquee-track{display:flex;gap:1rem;width:max-content;align-items:center;animation:marquee 34s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
/* every sponsor sits on a clean white plaque so mixed logo backgrounds read cohesively */
.m-logo{
  flex:none;height:36px;min-width:112px;
  display:flex;align-items:center;justify-content:center;gap:.45rem;
  background:var(--paper);border-radius:9px;padding:0 1rem;
  box-shadow:0 8px 18px -14px rgba(0,0,0,.85);
  opacity:.95;transition:transform .25s,opacity .25s;
}
.m-logo:hover{opacity:1;transform:translateY(-2px)}
.m-img img{max-height:22px;max-width:104px;width:auto;object-fit:contain;display:block}
.m-badge{
  width:22px;height:22px;border-radius:6px;display:grid;place-items:center;flex:none;
  font-family:var(--font-disp);font-size:.78rem;color:#fff;transform:rotate(-4deg);
  box-shadow:0 5px 11px -7px rgba(0,0,0,.5);
}
.m-word{font-family:var(--font-disp);text-transform:uppercase;font-size:.92rem;letter-spacing:.01em;color:var(--ink);white-space:nowrap}
@media(prefers-reduced-motion:reduce){.marquee-track{animation:none}}

/* ============ LEADING BRANDS IN HARD ENDURO ============ */
.brands-wrap{max-width:var(--maxw);margin:0 auto;padding:1rem 1.4rem 5rem}
.brand-group{margin-top:2.4rem}
.brand-group:first-child{margin-top:.6rem}
.brand-group-label{
  display:flex;align-items:center;gap:.7rem;
  font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.14em;
  font-size:.8rem;color:var(--ink-faint);margin-bottom:1.1rem;
}
.brand-group-label span{flex:1;height:1px;background:var(--line)}
.brand-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1.1rem}
.brand-card{
  display:flex;align-items:stretch;gap:1rem;
  background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:1.1rem;
  box-shadow:var(--shadow-sm);transition:.26s;position:relative;overflow:hidden;
}
.brand-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:0;background:var(--red);transition:width .26s}
.brand-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--blue)}
.brand-card:hover::before{width:4px}
.brand-card-logo{
  flex:none;width:88px;height:88px;align-self:center;overflow:hidden;
  border-radius:12px;box-shadow:0 0 0 1px var(--line-2);background:var(--paper);
}
.brand-card-logo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s}
.brand-card:hover .brand-card-logo img{transform:scale(1.06)}
.brand-card-body{display:flex;flex-direction:column;min-width:0}
.brand-card-name{font-family:var(--font-disp);text-transform:uppercase;font-size:1.4rem;line-height:1;color:var(--ink)}
.brand-card-blurb{color:var(--ink-soft);font-size:.88rem;line-height:1.45;margin:.35rem 0 .6rem}
.brand-card-link{
  margin-top:auto;display:inline-flex;align-items:center;gap:.35rem;
  font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.04em;
  font-size:.78rem;color:var(--blue);
}
.brand-card-link svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
.brand-card:hover .brand-card-link{color:var(--blue-deep)}
.brand-card:hover .brand-card-link svg{transform:translate(3px,0)}

/* ---- brand article (#brand/<slug>) ---- */
.brand-hero{max-width:var(--maxw);margin:0 auto;padding:2.6rem 1.4rem 1rem}
.brand-hero .back-link{margin-bottom:1.4rem}
.brand-hero-inner{display:flex;align-items:center;gap:1.6rem;flex-wrap:wrap}
.brand-hero-logo{width:108px;height:108px;border-radius:18px;overflow:hidden;flex:none;box-shadow:var(--shadow-sm),0 0 0 1px var(--line-2)}
.brand-hero-logo img{width:100%;height:100%;object-fit:cover;display:block}
.brand-hero-chip{font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.12em;font-size:.72rem;color:var(--red)}
.brand-hero-name{font-family:var(--font-disp);text-transform:uppercase;font-size:clamp(2.4rem,6vw,4.2rem);line-height:.9;color:var(--ink);margin-top:.2rem}
.brand-hero-tagline{font-family:var(--font-cond);font-weight:600;font-style:normal;color:var(--ink-soft);font-size:1.1rem;margin-top:.3rem}

.brand-models{display:flex;flex-direction:column;gap:.7rem;margin-top:.4rem}
.brand-model{border:1px solid var(--line);border-radius:11px;padding:.9rem 1.1rem;background:var(--paper);transition:.2s}
.brand-model:hover{border-color:var(--blue);box-shadow:var(--shadow-sm)}
.brand-model.has-img{display:flex;align-items:center;gap:1.1rem;padding:.8rem}
.bm-thumb{flex:none;width:158px;height:92px;border-radius:9px;overflow:hidden;background:var(--paper);border:1px solid var(--line-2);display:grid;place-items:center}
.bm-thumb img{width:100%;height:100%;object-fit:contain;transition:transform .3s}
.brand-model.has-img:hover .bm-thumb img{transform:scale(1.05)}
.bm-info{flex:1;min-width:0}
.bm-head{display:flex;align-items:baseline;justify-content:space-between;gap:.8rem}
.bm-name{font-family:var(--font-disp);text-transform:uppercase;font-size:1.3rem;color:var(--ink);line-height:1}
.bm-spec{font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:.7rem;color:#fff;background:var(--blue);padding:.2rem .55rem;border-radius:5px;flex:none}
.bm-note{color:var(--ink-soft);font-size:.92rem;margin-top:.4rem}

.brand-riders{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.brand-rider{display:flex;align-items:center;gap:.9rem;border:1px solid var(--line);border-radius:11px;padding:.7rem .8rem;background:var(--paper);transition:.2s}
.brand-rider:hover{border-color:var(--red);box-shadow:var(--shadow-sm)}
.br-photo{flex:none;width:60px;height:60px;border-radius:11px;overflow:hidden;background:var(--panel);display:grid;place-items:center;box-shadow:0 0 0 1px var(--line-2)}
.br-photo img{width:100%;height:100%;object-fit:cover}
.br-initial{font-family:var(--font-disp);font-size:1.25rem;color:#fff;letter-spacing:.03em;line-height:1}
.br-info{min-width:0;display:flex;flex-direction:column;gap:.15rem}
.br-name{font-family:var(--font-disp);text-transform:uppercase;font-size:1.15rem;color:var(--ink);line-height:1}
.br-note{color:var(--ink-soft);font-size:.86rem;line-height:1.3}

.brand-cta{margin-top:1rem;padding:1.6rem;border-radius:14px;background:var(--paper-2);border:1px solid var(--line);text-align:center}
.brand-cta-note{color:var(--ink-soft);margin-bottom:1rem}
.brand-cta .btn svg{width:17px;height:17px}

.brand-innov{list-style:none;display:flex;flex-direction:column;gap:.55rem}
.brand-innov li{display:flex;gap:.6rem;align-items:flex-start;color:var(--ink-soft);font-size:.92rem}
.brand-innov li::before{content:"";width:8px;height:8px;border-radius:2px;background:var(--blue);margin-top:.5rem;flex:none;transform:rotate(45deg)}
.brand-related{display:flex;flex-direction:column;gap:.4rem}
.brand-related a{display:flex;align-items:center;gap:.7rem;padding:.4rem;border-radius:9px;transition:.18s;font-family:var(--font-cond);font-weight:600;color:var(--ink)}
.brand-related a:hover{background:var(--paper-2)}
.brand-related img{width:34px;height:34px;border-radius:7px;object-fit:cover;flex:none;box-shadow:0 0 0 1px var(--line-2)}

@media(max-width:680px){.brand-riders{grid-template-columns:1fr}}

/* ============ STATS ============ */
.stats-strip{
  border-top:2px solid var(--blue);border-bottom:1px solid var(--line);
  background:var(--paper-2);
  display:grid;grid-template-columns:repeat(4,1fr);max-width:var(--maxw);margin:0 auto;
}
.stat{padding:2.4rem 1rem;text-align:center;border-right:1px solid var(--line)}
.stat:last-child{border-right:0}
.stat-num{display:block;font-family:var(--font-disp);font-size:clamp(2.2rem,4vw,3.2rem);color:var(--blue);line-height:1}
.stat-label{font-family:var(--font-cond);font-weight:600;text-transform:uppercase;letter-spacing:.08em;font-size:.8rem;color:var(--ink-faint)}

/* ============ JOIN ============ */
.join-card{
  display:flex;gap:2rem;align-items:center;justify-content:space-between;flex-wrap:wrap;
  background:var(--panel);border-radius:18px;padding:2.6rem;position:relative;overflow:hidden;
}
.join-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:linear-gradient(var(--blue),var(--red))}
.join-copy{position:relative;z-index:2;max-width:42ch}
.join-copy .section-title{color:#fff}
.join-copy .section-title .ital{color:#6db0ff}
.join-copy p{color:#aeb6bd;margin-top:.6rem}
.join-form{position:relative;z-index:2;display:flex;gap:.6rem;flex:1;min-width:280px}
.join-form input{
  flex:1;background:#0a0f13;border:1px solid rgba(255,255,255,.16);border-radius:10px;
  padding:.9rem 1rem;color:#fff;font-family:var(--font-body);font-size:1rem;
}
.join-form input::placeholder{color:#7b848c}
.join-form input:focus{outline:none;border-color:var(--blue)}
.join-form button{
  font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.04em;
  background:var(--blue);color:#fff;border:0;border-radius:10px;padding:0 1.4rem;cursor:pointer;transition:.2s;
}
.join-form button:hover{background:var(--blue-deep)}

/* ============ PAGE BANNERS ============ */
/* just-for-fun GIF centered below the Calendario title */
.cal-fun{display:flex;justify-content:center;padding:.2rem 1.4rem 1.2rem}
.cal-fun[hidden]{display:none}
.cal-fun img,.cal-fun video{width:min(200px,46vw);height:auto;border-radius:14px;display:block}
.page-banner{max-width:var(--maxw);margin:0 auto;padding:3.4rem 1.4rem 1.4rem;position:relative;text-align:center}
.page-title{font-family:var(--font-disp);text-transform:uppercase;color:var(--ink);font-size:clamp(2.6rem,7vw,5rem);line-height:.9}
.page-title .ital{color:inherit}   /* keep the whole page title one color, not a blue first word */
.page-sub{color:var(--ink-soft);font-size:1.08rem;max-width:62ch;margin:.5rem auto 0}

/* ============ POSTER CAROUSEL (slide-dot navigation) ============ */
.poster-carousel{position:relative;max-width:var(--maxw);margin:0 auto;padding:0 1.4rem}
.poster-rail{
  display:flex;gap:1rem;overflow-x:auto;padding:1rem .2rem .6rem;
  scroll-snap-type:x mandatory;scroll-behavior:smooth;
  scrollbar-width:none;-ms-overflow-style:none;
}
.poster-rail::-webkit-scrollbar{display:none}
.pcar-arrow{
  position:absolute;top:calc(50% - .5rem);transform:translateY(-50%);z-index:5;
  width:46px;height:46px;border-radius:50%;border:1px solid var(--line);
  background:rgba(255,255,255,.92);backdrop-filter:blur(6px);color:var(--ink);
  cursor:pointer;display:grid;place-items:center;transition:.2s;box-shadow:var(--shadow-sm);
}
.pcar-arrow:hover{background:var(--blue);color:#fff;border-color:var(--blue)}
.pcar-arrow svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.pcar-prev{left:.2rem}.pcar-next{right:.2rem}
.pcar-dots{display:flex;justify-content:center;gap:.5rem;padding:.4rem 0 1.2rem}
.pcar-dots button{width:30px;height:5px;border-radius:4px;border:0;background:rgba(12,17,22,.2);cursor:pointer;transition:.25s;padding:0}
.pcar-dots button.is-active{background:var(--blue);width:46px}
.poster-card{
  flex:0 0 248px;height:330px;border-radius:var(--r);overflow:hidden;position:relative;
  scroll-snap-align:start;border:1px solid var(--line);cursor:pointer;transition:.3s;box-shadow:var(--shadow-sm);
}
.poster-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.poster-card .pc-media{position:absolute;inset:0;background-size:cover;background-position:center}
.poster-card::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,12,16,.9),transparent 52%)}
.pc-body{position:absolute;bottom:0;left:0;right:0;z-index:2;padding:1rem}
.pc-date{font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#ffd27a;font-size:.74rem}
.pc-name{font-family:var(--font-disp);text-transform:uppercase;font-size:1.2rem;line-height:1;margin-top:.2rem;color:#fff}

/* ============ CALENDAR CONTROLS ============ */
.calendar-controls{max-width:var(--maxw);margin:0 auto;padding:0 1.4rem 1.4rem;display:flex;gap:2rem;flex-wrap:wrap;align-items:center;justify-content:center}
.control-group{display:flex;align-items:center;gap:.5rem}
.control-label{font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.12em;font-size:.74rem;color:var(--ink-faint)}
.chip{
  font-family:var(--font-cond);font-weight:600;text-transform:uppercase;letter-spacing:.03em;
  background:var(--paper);border:1px solid var(--line-strong);color:var(--ink-soft);
  padding:.45rem 1rem;border-radius:100px;cursor:pointer;transition:.2s;font-size:.86rem;
}
.chip:hover{color:var(--ink);border-color:var(--ink)}
.chip.is-active{background:var(--blue);color:#fff;border-color:var(--blue)}
.month-select{
  background:var(--paper);border:1px solid var(--line-strong);color:var(--ink);
  padding:.55rem .9rem;border-radius:8px;font-family:var(--font-body);cursor:pointer;font-size:.95rem;
}
.month-select:focus{outline:none;border-color:var(--blue)}

/* ---- standardized event category pills ----
   ONE colour per category, applied identically across hero, event-info and
   calendar.  moto = blue · motos & cuadras = teal · hard = red · campeonato = gold */
.cat-tag,.cat-badge{
  font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.04em;
  font-size:.66rem;padding:.24rem .64rem;border-radius:5px;display:inline-block;white-space:nowrap;
}
/* soft tinted variant — on light surfaces (hero, event-info) */
.cat-tag.cat-moto {background:var(--blue-tint);color:var(--blue-deep)}
.cat-tag.cat-both {background:#d6efed;color:#0a615f}
.cat-tag.cat-hard {background:var(--red-tint);color:#b3231f}
.cat-tag.cat-champ{background:#f7ecd0;color:#8a5e07}
/* solid variant — on the calendar rows */
.cat-badge{color:#fff}
.cat-badge.cat-moto {background:var(--blue)}
.cat-badge.cat-both {background:#0f8a8a}
.cat-badge.cat-hard {background:var(--red)}
.cat-badge.cat-champ{background:var(--gold)}

/* ============ EVENT ROWS (race-results style) ============ */
.calendar-list{width:min(var(--maxw),calc(100% - 2.8rem));margin:0 auto 5rem;padding:0;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:var(--shadow-sm)}
.month-bar{
  background:var(--bluebar);color:#fff;font-family:var(--font-disp);font-weight:700;
  text-transform:uppercase;letter-spacing:.04em;font-size:1.4rem;line-height:1;
  padding:.7rem 1.4rem;
}
/* past-races divider: clearly bigger than a month bar so it reads as a new section */
.month-bar.past{background:var(--panel);font-size:clamp(2rem,5vw,2.8rem);padding:1.6rem 1.4rem 1.3rem;border-top:4px solid var(--bluebar);text-align:center}
.erow{
  display:flex;align-items:center;gap:1.2rem;justify-content:space-between;
  background:var(--rowlight);color:var(--ink);cursor:pointer;position:relative;overflow:hidden;
  padding:1.05rem 1.4rem;border-top:1px solid var(--line-2);transition:background .16s;
}
.erow.alt{background:var(--rowalt)}
.erow::before{content:"";position:absolute;left:0;top:0;bottom:0;width:0;background:var(--red);transition:width .16s}
.erow:hover{background:var(--blue-tint)}
.erow:hover::before{width:5px}
.erow.is-recap .erow-title{color:#2a3942}
.erow-left{min-width:0;flex:1;display:flex;flex-direction:column;gap:.32rem}
.erow-title{
  font-family:var(--font-disp);font-weight:700;text-transform:uppercase;line-height:.9;
  font-size:clamp(1.45rem,3vw,2.4rem);color:var(--ink);letter-spacing:.004em;
}
.erow-meta{
  display:flex;align-items:center;gap:.55rem;flex-wrap:wrap;
  font-family:var(--font-cond);font-weight:600;text-transform:uppercase;letter-spacing:.02em;
  font-size:.95rem;color:var(--ink-soft);
}
.erow-date{font-weight:700;color:var(--blue-deep)}
.erow-sep{color:var(--ink-faint)}
.erow-loc{color:var(--ink-soft)}
.erow-right{display:flex;flex-direction:column;align-items:flex-end;gap:.55rem;flex:none}
/* organizer status next to the event name (calendar "Próximos" view) */
.vstat{display:inline-flex;align-items:center;vertical-align:middle;margin-left:.45rem;position:relative;top:-.08em}
.vstat--ok svg{width:.8em;height:.8em;display:block}
.vstat--ok .vb-seal{fill:var(--blue)}
.vstat--ok .vb-tick{fill:none;stroke:#fff;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.vstat--soon{font-family:var(--font-cond);font-weight:700;font-size:.72rem;line-height:1;letter-spacing:.05em;
  text-transform:uppercase;padding:.28rem .5rem;border-radius:5px;white-space:nowrap}
.vstat--soon{background:#fff3d6;color:#8a5a00;border:1px solid #f0c867}
:root[data-theme="dark"] .vstat--soon{background:rgba(245,178,40,.14);color:#f5c55a;border-color:rgba(245,197,90,.45)}
/* same status on the Info del Evento poster cards, next to the countdown pill */
.ei-tags .vstat{margin:.5rem 0 0;top:0;box-shadow:0 2px 8px rgba(0,0,0,.35)}
.ei-tags .vstat--ok{background:#fff;border-radius:50%;padding:3px}
.ei-tags .vstat--ok svg{width:1.3rem;height:1.3rem}
.ei-tags .vstat--soon{font-size:.74rem;padding:.34rem .6rem;border-radius:999px}
/* events without a verified page: rows and cards don't navigate */
.erow.is-locked{cursor:default}
.ei-card.is-locked:not([href]){cursor:default}
.erow-actions{display:flex;gap:.4rem;align-items:center}
.erow-actions a{
  font-family:var(--font-cond);font-weight:600;text-transform:uppercase;letter-spacing:.02em;font-size:.78rem;
  padding:.34rem .64rem;border-radius:6px;border:1px solid var(--line-strong);color:var(--ink);background:var(--paper);transition:.16s;white-space:nowrap;
}
.erow-actions a:hover{background:var(--blue);border-color:var(--blue);color:#fff}
.erow-actions a.ev-info{background:var(--blue);color:#fff;border-color:var(--blue)}
.erow-actions a.ev-info:hover{background:var(--blue-deep);border-color:var(--blue-deep)}
/* "Grupo oficial": the event's WhatsApp group, a label-sized button right next to the
   category label */
.erow-tags{display:flex;align-items:center;gap:.4rem}
.ev-group{display:inline-flex;align-items:center;gap:.3rem;white-space:nowrap;
  font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.04em;
  font-size:.66rem;padding:.24rem .64rem;min-height:24px;border-radius:5px;background:#25d366;color:#06311b;transition:background .16s}   /* 24px: WCAG minimum tap target */
.ev-group:hover{background:#1fbf5b;color:#06311b}
.ev-group .ico-wa{width:13px;height:13px;fill:currentColor;stroke:none;flex:none}

/* map dropdown — Google / Waze / Other in one menu */
/* let the open row escape its own clip + sit above later rows */
.erow:has(.map-menu[open]){overflow:visible;z-index:30}
.calendar-list:has(.map-menu[open]){overflow:visible}
.map-menu{position:relative}
.map-menu summary{
  list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:.32rem;
  font-family:var(--font-cond);font-weight:600;text-transform:uppercase;letter-spacing:.02em;font-size:.78rem;
  padding:.34rem .6rem;border-radius:6px;border:1px solid var(--line-strong);color:var(--ink);background:var(--paper);transition:.16s;white-space:nowrap;
}
.map-menu summary::-webkit-details-marker{display:none}
/* calendar rows: icon-only location button (symbol, no text), sized to match
   the "Info" button beside it */
.map-menu-icon{gap:.15rem;padding:.34rem .64rem}
.map-menu-icon .mm-pin{width:17px;height:17px}
.map-menu-icon .mm-caret{width:13px;height:13px}
.erow-actions .map-menu-icon,.erow-actions .ev-info{display:inline-flex;align-items:center;justify-content:center;min-height:2.05rem}
.map-menu summary:hover,.map-menu[open] summary{background:var(--blue-tint);border-color:var(--blue);color:var(--blue-deep)}
/* generic "directions" pin in Google Maps red, like the other brand-colored buttons; the menu lists the apps */
.map-menu .mm-pin{width:14px;height:14px;fill:#ea4335;stroke:none}
.map-menu .mm-pin circle{fill:#fff}
.map-menu .mm-caret{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;transition:transform .18s}
.map-menu[open] .mm-caret{transform:rotate(180deg)}
.map-menu-list{
  position:absolute;top:calc(100% + .4rem);right:0;z-index:20;min-width:180px;
  background:var(--paper);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);
  padding:.35rem;display:flex;flex-direction:column;gap:.15rem;
  animation:mmpop .14s ease;
}
@keyframes mmpop{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.map-menu-list a{
  display:flex;align-items:center;gap:.5rem;font-family:var(--font-cond);font-weight:600;text-transform:none;letter-spacing:0;
  font-size:.9rem;padding:.5rem .7rem;border-radius:7px;border:0;color:var(--ink);background:var(--paper);text-align:left;white-space:nowrap;
}
.map-menu-list a:hover{background:var(--blue-tint);color:var(--blue-deep)}
.mm-app-ico{display:inline-flex;flex:none}
.mm-app-ico svg{width:18px;height:18px;display:block}

/* ============ EVENT INFO GRID ============ */
/* event-info search toolbar (top-right, above the grid) */
.ei-toolbar{max-width:var(--maxw);margin:0 auto;padding:.2rem 1.4rem 0;display:flex;flex-direction:column;align-items:center;gap:1rem}
.ei-controls{padding:0;width:100%}
.eventinfo-grid .ei-group{grid-column:1/-1;border-radius:12px;margin-top:.4rem}
.eventinfo-grid .ei-group:first-child{margin-top:0}
.ei-search{position:relative;width:min(340px,100%)}
.ei-search-ico{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:18px;height:18px;
  fill:none;stroke:var(--ink-faint);stroke-width:2;stroke-linecap:round;pointer-events:none}
.ei-search-input{width:100%;padding:.7rem 1rem .7rem 2.6rem;border-radius:999px;
  border:1px solid var(--line-strong);background:var(--paper);color:var(--ink);
  font-family:var(--font-body);font-size:.98rem;transition:border-color .16s,box-shadow .16s}
.ei-search-input::placeholder{color:var(--ink-faint)}
.ei-search-input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-tint)}
.eventinfo-grid{max-width:var(--maxw);margin:0 auto;padding:1.5rem 1.4rem 5rem;display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:1.4rem}
/* poster-shaped tiles: the whole card is the poster, text overlaid at the bottom */
.ei-card{
  display:block;text-decoration:none;color:inherit;
  position:relative;aspect-ratio:3/4;border-radius:var(--r);overflow:hidden;cursor:pointer;
  background-size:cover;background-position:center top;background-color:var(--ink);
  box-shadow:var(--shadow-sm);transition:transform .28s,box-shadow .28s;
}
.ei-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.ei-card:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
/* dark scrim only across the lower portion so the poster art reads at the top */
.ei-card::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(0deg,rgba(6,9,13,.94) 3%,rgba(6,9,13,.74) 24%,rgba(6,9,13,.2) 46%,transparent 60%)}
.ei-datebadge{position:absolute;top:.85rem;left:.85rem;z-index:3;background:var(--paper);color:var(--ink);font-family:var(--font-disp);font-weight:700;text-transform:uppercase;letter-spacing:.02em;font-size:1rem;padding:.2rem .6rem;border-radius:7px;box-shadow:var(--shadow-sm)}
.ei-overlay{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:1.1rem 1.1rem 1.15rem;display:flex;flex-direction:column;gap:.5rem}
.ei-tags{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap}
.ei-name{font-family:var(--font-disp);font-weight:700;font-size:1.5rem;line-height:.98;text-transform:uppercase;color:#fff;text-shadow:0 2px 14px rgba(0,0,0,.5)}
.ei-loc{color:rgba(255,255,255,.88);font-size:.92rem;display:flex;align-items:center;gap:.4rem;font-weight:500}
.ei-loc svg{width:14px;height:14px;fill:none;stroke:#fff;stroke-width:2;flex:none}

/* ---- province flags (replaces the generic CR flag per event location) ---- */
svg.prov-flag{
  width:1.5em;height:1em;border-radius:3px;overflow:hidden;flex:none;stroke:none;
  display:inline-block;vertical-align:-.16em;box-shadow:0 0 0 1px rgba(0,0,0,.22);
}
.cr-flag{font-family:'Geist',sans-serif;line-height:1}
.detail-date svg.prov-flag,.detail-date .cr-flag{margin-right:.45em;vertical-align:-.18em}
.ei-loc svg.prov-flag{width:1.5em;height:1em}
.ei-foot{margin-top:auto;padding-top:1rem;display:flex;align-items:center;justify-content:space-between}
.ei-link{font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--blue);font-size:.85rem}

/* ============ EVENT DETAIL ============ */
.detail-hero{position:relative;min-height:48vh;display:flex;align-items:flex-end;overflow:hidden;border-bottom:1px solid var(--line)}
.detail-hero .dh-bg{position:absolute;inset:0;background-size:cover;background-position:center}
.detail-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(255,255,255,.97),rgba(255,255,255,.55) 55%,rgba(255,255,255,.15))}
/* poster hero: the image is a pre-baked hero canvas (full poster over a blurred
   fill, correctly sized) — just cover it. Grid cards keep their own styling.
   A dark bottom scrim + light text keep the title legible over any poster. */
.detail-hero.has-poster{min-height:clamp(380px,52vh,540px)}
.detail-hero.has-poster::after{background:linear-gradient(0deg,rgba(8,12,16,.92),rgba(8,12,16,.4) 42%,rgba(8,12,16,0) 78%)}
.detail-hero.has-poster .detail-name{color:#fff}
.detail-hero.has-poster .detail-date{color:#7fb3ff}
.detail-hero.has-poster .back-link{color:#e6edf3}
.detail-hero.has-poster .back-link:hover{color:#fff}
/* ready-made 16:9 banner hero: show the WHOLE banner (natural height, scrolls
   with the page like the about hero). The banner already carries the event
   name, so the site title is hidden but kept in the DOM for SEO; the date and
   countdown stay visible over a bottom scrim. */
.detail-hero.has-banner{display:block;min-height:0;align-items:initial}
.detail-hero.has-banner .dh-banner{display:block;width:100%;height:auto}
.detail-hero.has-banner::after{top:auto;height:min(72%,360px);
  background:linear-gradient(0deg,rgba(8,12,16,.94),rgba(8,12,16,.5) 55%,transparent)}
.detail-hero.has-banner .dh-inner{position:absolute;left:50%;transform:translateX(-50%);bottom:0}
.detail-hero.has-banner .detail-name{position:absolute!important;width:1px;height:1px;margin:-1px;
  padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.detail-hero.has-banner .detail-date{color:#fff}
.detail-hero.has-banner .back-link{color:#e6edf3}
.detail-hero.has-banner .back-link:hover{color:#fff}
.detail-hero .dh-inner{position:relative;z-index:2;max-width:var(--maxw);margin:0 auto;width:100%;padding:2.4rem 1.4rem}
.back-link{display:inline-flex;align-items:center;gap:.4rem;font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-soft);margin-bottom:1rem;cursor:pointer}
.back-link:hover{color:var(--blue)}
/* On event-detail heroes the "Volver" button sits over artwork of unknown color,
   so give it a dark contrast pill that reads over any banner/poster. */
.detail-hero .back-link{color:#fff;background:rgba(12,17,22,.6);padding:.5rem .95rem;border-radius:999px;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.detail-hero .back-link:hover{color:#fff;background:rgba(12,17,22,.82)}
.detail-hero .back-link svg{stroke:#fff}
.back-link svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.dh-status{margin-bottom:.7rem}
.detail-name{font-family:var(--font-disp);text-transform:uppercase;font-size:clamp(2.2rem,5.5vw,4.2rem);line-height:.9;color:var(--ink)}
.detail-date{font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--blue-deep);font-size:1.05rem;margin-top:.5rem}

/* ============ LIVE COUNTDOWN ============ */
/* shared pulsing dot for the "live now" states */
@keyframes cdpulse{0%{box-shadow:0 0 0 0 rgba(224,49,46,.5)}70%{box-shadow:0 0 0 7px rgba(224,49,46,0)}100%{box-shadow:0 0 0 0 rgba(224,49,46,0)}}
.cd-dot{width:8px;height:8px;border-radius:50%;background:var(--red);animation:cdpulse 1.6s infinite}

/* --- compact pill (event-info cards) --- */
.cd-pill{display:inline-flex;align-items:baseline;gap:.4rem;align-self:flex-start;margin-top:.5rem;
  padding:.22rem .6rem;border-radius:999px;background:var(--blue-tint);
  font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.05em;
  font-size:.66rem;color:var(--blue-deep)}
.cd-pill .cd-num{font-family:var(--font-disp);font-weight:800;font-size:1.15rem;line-height:1;color:var(--blue);letter-spacing:.01em}
.cd-pill.cd-today{background:var(--red-tint);color:#b3231f}
.cd-pill.cd-live{display:inline-flex;align-items:center;background:var(--red-tint);color:#b3231f}
.cd-pill.cd-done{background:var(--paper-3);color:var(--ink-faint)}

/* --- segmented clock (detail hero) --- */
.cd-hero{display:inline-flex;align-items:center;gap:.45rem;margin-top:1.1rem;flex-wrap:wrap}
/* the countdown card is ALWAYS light (it sits on the dark hero image in both
   themes), so its text is fixed-dark — never var(--ink)/--ink-faint, which
   invert in dark theme and made the numbers vanish (white-on-white). */
.cd-hero .cd-seg{display:flex;flex-direction:column;align-items:center;min-width:3.5rem;
  padding:.5rem .45rem .42rem;border-radius:11px;background:rgba(255,255,255,.92);
  border:1px solid rgba(12,17,22,.1);box-shadow:var(--shadow-sm);backdrop-filter:blur(2px)}
.cd-hero .cd-seg b{font-family:var(--font-disp);font-weight:800;font-size:2.1rem;line-height:.82;
  color:#0c1116;font-variant-numeric:tabular-nums}
.cd-hero .cd-seg i{font-family:var(--font-cond);font-style:normal;font-weight:700;text-transform:uppercase;
  letter-spacing:.12em;font-size:.58rem;color:#5c656e;margin-top:.35rem}
.cd-hero .cd-colon{font-family:var(--font-disp);font-weight:800;font-size:1.5rem;color:rgba(12,17,22,.3);align-self:flex-start;margin-top:.35rem}
.cd-hero.cd-live,.cd-hero.cd-done{padding:.5rem .85rem;border-radius:999px;background:rgba(255,255,255,.92);
  border:1px solid rgba(12,17,22,.1);box-shadow:var(--shadow-sm)}
.cd-hero .cd-banner{font-family:var(--font-cond);font-weight:800;text-transform:uppercase;letter-spacing:.07em;
  font-size:1rem;color:var(--red)}
.cd-hero .cd-banner-done{color:var(--red)}
.cd-hero.cd-done{background:var(--red-tint);border-color:rgba(179,35,31,.4)}
@media(max-width:520px){
  .cd-hero .cd-seg{min-width:3rem}
  .cd-hero .cd-seg b{font-size:1.7rem}
}

/* banner heroes relocate the countdown to a compact strip UNDER the image,
   just before the description — the banner is short on phones, so an overlaid
   clock covered the whole poster. Here it reads as a small countdown title and,
   sitting on the page background, uses theme-aware colors (not the fixed-light
   card the overlaid version needs over a dark image). */
.detail-cd-strip{margin:0;padding:0}
/* countdown + "Compartir evento" on one row (the button shares the /e/<id> preview page) */
.cd-row{display:flex;align-items:center;flex-wrap:wrap;gap:.8rem 1.1rem}
.detail-hero .cd-row{margin-top:1.1rem}
.cd-row .cd-hero{margin-top:0}
.share-btn{display:inline-flex;align-items:center;gap:.55rem;padding:.6rem 1.15rem;border-radius:999px;cursor:pointer;
  border:1px solid var(--line);background:var(--paper-2);color:var(--ink);transition:border-color .2s,background .2s,color .2s;
  font-family:var(--font-cond);font-weight:700;font-size:.85rem;letter-spacing:.06em;text-transform:uppercase}
.share-btn:hover,.share-btn:focus-visible{border-color:var(--blue);background:var(--paper)}
.share-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.share-btn{white-space:nowrap}
/* share sheet (computers): WhatsApp · Facebook · X · Telegram · email · copy link */
.share-sheet{position:fixed;inset:0;z-index:2100;display:grid;place-items:center;padding:1rem;
  background:rgba(6,9,12,.62);backdrop-filter:blur(3px);animation:ss-fade .16s ease-out}
.ss-panel{width:min(440px,100%);background:var(--paper);color:var(--ink);border:1px solid var(--line);
  border-radius:18px;box-shadow:0 30px 70px -20px rgba(0,0,0,.55);padding:1.2rem 1.25rem 1.3rem;animation:ss-rise .2s cubic-bezier(.2,.7,.2,1)}
.ss-head{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.ss-title{margin:0;font-family:var(--font-disp);font-weight:800;font-size:1.6rem;text-transform:uppercase;letter-spacing:.01em}
.ss-close{width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:var(--paper-2);color:var(--ink);
  display:grid;place-items:center;cursor:pointer}
.ss-close svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
.ss-close:hover,.ss-close:focus-visible{border-color:var(--blue)}
.ss-what{margin:.35rem 0 1.1rem;color:var(--ink-soft);font-size:.95rem;line-height:1.4}
.ss-targets{display:grid;grid-template-columns:repeat(3,1fr);gap:.9rem .5rem}
.ss-target{display:flex;flex-direction:column;align-items:center;gap:.45rem;padding:.35rem .2rem;border:0;background:none;
  color:var(--ink);font:600 .8rem/1.2 var(--font-body,inherit);text-decoration:none;cursor:pointer;border-radius:12px;text-align:center}
.ss-target:hover,.ss-target:focus-visible{background:var(--paper-2)}
.ss-ico{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;color:#fff;transition:transform .15s}
.ss-target:hover .ss-ico{transform:translateY(-2px)}
.ss-ico svg{width:26px;height:26px;fill:currentColor}
.ss-wa .ss-ico{background:#25d366}
.ss-fb .ss-ico{background:#1877f2}
.ss-x .ss-ico{background:#000;border:1px solid rgba(255,255,255,.25)}
.ss-tg .ss-ico{background:#229ed9}
.ss-mail .ss-ico{background:#6b7785}
.ss-copy .ss-ico{background:var(--blue)}
.ss-copy.is-done .ss-ico{background:#2a9d44}
.ss-link{margin-top:1.1rem}
.ss-link input{width:100%;box-sizing:border-box;padding:.65rem .8rem;border-radius:10px;border:1px solid var(--line);
  background:var(--paper-2);color:var(--ink-soft);font:500 .85rem/1.2 ui-monospace,monospace}
@keyframes ss-fade{from{opacity:0}}
@keyframes ss-rise{from{opacity:0;transform:translateY(14px) scale(.98)}}
@media (prefers-reduced-motion:reduce){.share-sheet,.ss-panel{animation:none}}
/* section share button under each page title */
.page-share{display:flex;justify-content:center;margin-top:1rem}
.page-share:empty{display:none}
/* phones: compact "Compartir" so it fits beside the countdown */
@media(max-width:520px){
  .cd-row{column-gap:.6rem}
  .share-extra{display:none}
  .share-btn{padding:.5rem .75rem;gap:.4rem;font-size:.8rem}
  .share-btn svg{width:16px;height:16px}
}
.detail-cd-strip .detail-date{color:var(--ink);margin:0 0 .9rem}
.detail-cd-strip .cd-hero{margin-top:0}
.detail-cd-strip .cd-seg{min-width:2.9rem;padding:.42rem .45rem .34rem;
  background:var(--paper-3);border-color:var(--line-strong);backdrop-filter:none}
.detail-cd-strip .cd-seg b{font-size:1.55rem;color:var(--ink)}
.detail-cd-strip .cd-seg i{font-size:.55rem;color:var(--ink-soft)}
.detail-cd-strip .cd-colon{font-size:1.3rem;color:var(--ink-faint)}
.detail-cd-strip .cd-hero.cd-live,.detail-cd-strip .cd-hero.cd-done{
  background:var(--paper-3);border-color:var(--line-strong)}
.detail-cd-strip .cd-banner-done{color:var(--red);font-size:1.05rem}
.detail-cd-strip .cd-hero.cd-done{background:var(--red-tint);border-color:rgba(179,35,31,.4)}

.detail-body{max-width:var(--maxw);margin:0 auto;padding:2.5rem 1.4rem 5rem;display:grid;grid-template-columns:1.6fr 1fr;gap:2rem}
.detail-main{display:flex;flex-direction:column;gap:2rem}
.info-block h2{font-family:var(--font-disp);text-transform:uppercase;font-size:1.6rem;margin-bottom:.6rem;color:var(--ink)}
.info-block h2 .ib-bar{display:inline-block;width:26px;height:4px;background:var(--red);margin-right:.6rem;vertical-align:middle;border-radius:3px}
.tire-rec-gif{flex:none;height:44px;width:auto;border-radius:10px;display:block}
.info-block p{color:var(--ink-soft)}
.instr-list{list-style:none;display:flex;flex-direction:column;gap:.6rem;margin-top:.4rem}
.instr-list li{display:flex;gap:.7rem;align-items:flex-start;color:var(--ink-soft)}
.instr-list li::before{content:"";width:9px;height:9px;border-radius:2px;background:var(--blue);margin-top:.55rem;flex:none;transform:rotate(45deg)}
.includes-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.6rem;margin-top:.4rem}
.inc-item{display:flex;align-items:center;gap:.5rem;color:var(--ink)}
.inc-item svg{width:18px;height:18px;fill:none;stroke:var(--green);stroke-width:2.6}
/* standardized "What's Offered" amenity tiles */
.offers-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.6rem;margin-top:.5rem}
.offers-side .offers-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}
.offers-side .offer-label{font-size:.85rem}
.offer-item{
  display:flex;align-items:center;gap:.6rem;padding:.6rem .75rem;
  background:var(--paper-2);border:1px solid var(--line);border-radius:10px;transition:.18s;
}
.offer-item:hover{border-color:var(--blue);background:var(--paper);box-shadow:var(--shadow-sm)}
/* amenity icons as racing badges: blue gradient plate, checkered-flag
   corner, red "race stripe" along the bottom — matches the banners/brand */
.offer-ico{
  position:relative;overflow:hidden;display:grid;place-items:center;flex:none;
  width:50px;height:50px;border-radius:14px;color:#fff;
  background:linear-gradient(145deg,var(--blue) 0%,var(--blue-deep) 100%);
  box-shadow:0 6px 14px -6px rgba(10,95,208,.7),inset 0 1px 0 rgba(255,255,255,.28);
  transition:transform .2s,box-shadow .2s;
}
.offer-ico::before{   /* checkered-flag corner */
  content:"";position:absolute;top:0;right:0;width:18px;height:18px;opacity:.55;
  background:conic-gradient(#fff 25%,transparent 0 50%,#fff 0 75%,transparent 0) 0 0/9px 9px;
  -webkit-mask:linear-gradient(225deg,#000 45%,transparent 75%);mask:linear-gradient(225deg,#000 45%,transparent 75%);
}
.offer-ico::after{    /* red race stripe */
  content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:var(--red);
}
.offer-ico svg{position:relative;z-index:1;width:30px;height:30px;fill:currentColor;stroke:none;filter:drop-shadow(0 1px 1px rgba(0,0,0,.25))}
.offer-item:hover .offer-ico{transform:rotate(-6deg) scale(1.07);box-shadow:0 8px 18px -6px rgba(224,49,46,.6),inset 0 1px 0 rgba(255,255,255,.28)}
.offer-label{min-width:0;overflow-wrap:break-word;font-family:var(--font-cond);font-weight:600;color:var(--ink);font-size:.92rem;line-height:1.15}
.offers-note{font-size:.8rem;color:var(--ink-faint);margin-top:.8rem;font-style:normal}
/* official event shirt thumbnails — own sidebar card (shirtBlock) */
.offer-shirt-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.4rem}
.offer-shirt-grid .ev-gallery-item{aspect-ratio:3/5;background:#fff}
.offer-shirt-grid .ev-gallery-item img{height:100%;object-fit:contain}
/* shirtLarge: one tile scaled 1.25 × 1.25 (two 25% steps) over the standard size; it spills into the empty next column */
.offer-shirt-grid--lg .ev-gallery-item{width:calc(100% * 1.25 * 1.25)}
/* one or two shirt photos (e.g. front + back): two columns, tiles shaped to the photo */
.offer-shirt-grid--pair{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}
.offer-shirt-grid--pair .ev-gallery-item{aspect-ratio:auto}
.offer-shirt-grid--pair .ev-gallery-item img{height:auto}
/* front only (no back photo): center the one shirt at the same half width */
.offer-shirt-grid--pair .ev-gallery-item:only-child{grid-column:1/-1;justify-self:center;width:calc(50% - .25rem)}
/* one wide image (front + back in a single mockup) fills the card */
.offer-shirt-grid--pair .ev-gallery-item--wide:only-child{justify-self:stretch;width:auto}
.offer-shirt-note{font-size:.85rem;font-weight:600;color:var(--ink);margin-top:.6rem}
/* per-event photo sections: signage, local businesses, prizes */
.ev-gallery-note{font-size:.9rem;margin:-.2rem 0 .7rem}
.ev-gallery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;align-items:start}
.ev-gallery-item{display:block;border-radius:10px;overflow:hidden;border:1px solid var(--line);background:var(--paper);box-shadow:var(--shadow-sm);transition:border-color .2s,box-shadow .2s}
.ev-gallery-item:hover{border-color:var(--blue);box-shadow:var(--shadow)}
.ev-gallery-item img{display:block;width:100%;height:auto}
.ev-gallery--signage .ev-gallery-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:.5rem}
.ev-gallery--signage .ev-gallery-item{aspect-ratio:3/2;background:#111}
.ev-gallery--signage .ev-gallery-item img{height:100%;object-fit:contain}
.ev-gallery--prizes .ev-gallery-grid{max-width:560px}
.ev-gallery-item--wide{grid-column:1/-1}
.ev-gallery-caption{font-size:.9rem;font-style:italic;color:var(--ink-faint);margin-top:.6rem}
.detail-body.is-done .ev-gallery-item img{filter:grayscale(.9)}
@media(max-width:680px){.ev-gallery--signage .ev-gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.ev-gallery--places .ev-gallery-grid,.offers-side .offers-grid{grid-template-columns:1fr}}

/* ---- terrain & weather cards ---- */
.tw-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:.5rem}
.tw-card{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--paper);box-shadow:var(--shadow-sm)}
.tw-head{display:flex;align-items:center;gap:.7rem;padding:.85rem 1.05rem;color:#fff;position:relative}
.tw-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;flex:none;background:rgba(255,255,255,.2)}
.tw-icon svg{width:22px;height:22px;fill:none;stroke:#fff;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.tw-kicker{font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.12em;font-size:.62rem;opacity:.85;display:block}
.tw-title{font-family:var(--font-disp);text-transform:uppercase;font-size:1.18rem;line-height:1;margin-top:.1rem}
.tw-sub{margin-left:auto;font-family:var(--font-disp);font-size:1.25rem;letter-spacing:.01em;text-shadow:0 1px 4px rgba(0,0,0,.3)}
.tw-body{padding:.9rem 1.05rem 1.05rem}
.tw-body p{color:var(--ink-soft);font-size:.92rem;line-height:1.5}
.tw-tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.7rem}
.tw-tags span{font-family:var(--font-cond);font-weight:600;text-transform:uppercase;letter-spacing:.04em;font-size:.66rem;padding:.24rem .55rem;border-radius:6px;background:var(--paper-2);border:1px solid var(--line);color:var(--ink-soft)}
/* terrain header tones */
.terr-extreme .tw-head{background:linear-gradient(120deg,#4a5560,#2b333b)}
.terr-mud     .tw-head{background:linear-gradient(120deg,#5e4a2b,#37291a)}
.terr-dry     .tw-head{background:linear-gradient(120deg,#c98a14,#9a6410)}
.terr-rally   .tw-head{background:linear-gradient(120deg,#0a5fd0,#0846a3)}
.terr-mixed   .tw-head{background:linear-gradient(120deg,#2a8f57,#1c633c)}
/* weather header tones */
.wx-hot   .tw-head{background:linear-gradient(120deg,#e8902f,#d2491f)}
.wx-humid .tw-head{background:linear-gradient(120deg,#159a8e,#0c6e66)}
.wx-cool  .tw-head{background:linear-gradient(120deg,#4f7fa8,#34536e)}
.wx-warm  .tw-head{background:linear-gradient(120deg,#e0a02f,#c46a1f)}

/* ---- recommended tires ---- */
.tire-rec{display:flex;align-items:center;gap:.8rem;margin:.5rem 0 .9rem;padding:.7rem .9rem;border-radius:12px;background:var(--panel);color:#fff}
.tire-rec-ico{display:grid;place-items:center;width:40px;height:40px;border-radius:10px;flex:none;background:rgba(255,255,255,.12)}
.tire-rec-ico svg{width:24px;height:24px;fill:none;stroke:#fff;stroke-width:1.7}
.tire-rec-kicker{font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-size:.62rem;color:#9fc6ff;display:block}
.tire-rec-type{font-family:var(--font-disp);text-transform:uppercase;font-size:1.3rem;letter-spacing:.01em;line-height:1}
.tire-tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem}
.tire-tier{position:relative;border:1px solid var(--line);border-radius:13px;padding:1rem .95rem;background:var(--paper-2);display:flex;flex-direction:column}
.tt-head{display:flex;align-items:baseline;justify-content:space-between;gap:.5rem}
.tt-name{font-family:var(--font-disp);text-transform:uppercase;font-size:1.22rem;color:var(--ink);line-height:1}
.tt-price{font-family:var(--font-disp);letter-spacing:.04em;color:var(--gold)}
.tt-price-value{font-size:.95rem}.tt-price-balanced{font-size:1.1rem}.tt-price-premium{font-size:1.25rem}
.tt-fit{font-family:var(--font-cond);font-weight:600;text-transform:uppercase;letter-spacing:.03em;font-size:.66rem;color:var(--ink-faint);margin:.15rem 0 .7rem}
.tt-brands{list-style:none;display:flex;flex-direction:column;gap:.55rem}
.tt-brands li{display:flex;align-items:center;gap:.55rem;font-size:.86rem;color:var(--ink);line-height:1.2}
.tt-brand-wrap{display:flex;flex-direction:column;gap:.05rem;min-width:0}
.tt-brand{font-weight:600}
.tt-model{font-size:.75rem;color:var(--ink-faint);line-height:1.2}
.tt-knob{flex:none;margin-top:1px;width:14px;height:14px;display:inline-grid;place-items:center}
.tt-knob svg{width:14px;height:14px;fill:none;stroke:var(--blue-deep);stroke-width:1.8}
/* brand logo chip — white plate keeps every logo legible in light + dark theme */
.tt-knob:has(.tt-logo){width:58px;height:58px;margin-top:0}
.tt-logo{width:58px;height:58px;border-radius:10px;object-fit:contain;background:#fff;padding:5px;box-sizing:border-box;box-shadow:0 0 0 1px rgba(0,0,0,.1)}
.tire-setup{font-size:.86rem;color:var(--ink-soft);margin-top:.9rem;line-height:1.5}
.tire-setup strong{color:var(--ink)}

/* ---- recommended gear ---- */
.gear-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.7rem;margin-top:.5rem}
.gear-item{display:flex;gap:.7rem;align-items:flex-start;padding:.75rem .85rem;border:1px solid var(--line);border-radius:11px;background:var(--paper);transition:.18s}
.gear-item:hover{border-color:var(--blue);box-shadow:var(--shadow-sm)}
.gear-ico{display:grid;place-items:center;width:36px;height:36px;border-radius:9px;flex:none;background:var(--red-tint);color:#b3231f}
.gear-ico svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.gear-text{display:flex;flex-direction:column;min-width:0}
.gear-label{font-family:var(--font-cond);font-weight:700;color:var(--ink);font-size:.95rem;line-height:1.15}
.gear-why{font-size:.8rem;color:var(--ink-faint);line-height:1.3;margin-top:.15rem}

/* ---- organizer updates feed (compact photo strip) ---- */
.updates-sub{color:var(--ink-soft);font-size:.9rem;margin:-.1rem 0 .75rem}
.updates-strip{display:flex;gap:.7rem;overflow-x:auto;padding-bottom:.5rem;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
.updates-strip::-webkit-scrollbar{height:6px}
.updates-strip::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:3px}
.upd-card{flex:none;width:148px;scroll-snap-align:start}
.upd-media{position:relative;aspect-ratio:4/5;border-radius:11px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow-sm);background-size:cover;background-position:center;transition:.22s}
.upd-card:not(.upd-add):hover .upd-media{transform:translateY(-3px);box-shadow:var(--shadow)}
.upd-date{position:absolute;top:.45rem;left:.45rem;font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.04em;font-size:.58rem;background:rgba(8,12,16,.72);color:#fff;padding:.2rem .5rem;border-radius:100px;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.upd-cap{font-family:var(--font-cond);font-weight:600;color:var(--ink);font-size:.82rem;margin-top:.45rem;line-height:1.2}
.upd-add{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.55rem;text-align:center;aspect-ratio:4/5;border:1.5px dashed var(--line-strong);border-radius:11px;color:var(--ink-faint);font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.03em;font-size:.7rem;line-height:1.25;padding:.7rem;transition:.18s}
.upd-add:hover{border-color:var(--blue);color:var(--blue);background:var(--blue-tint)}
.upd-add-ico{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:1.6px solid currentColor;flex:none}
.upd-add-ico svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round}

/* ---- event social links (sidebar box, under sponsors) ---- */
.social-note{color:var(--ink-soft);font-size:.88rem;margin-bottom:.85rem}
.ev-socials{display:flex;gap:.5rem}
.ev-soc{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;border:1px solid var(--line-strong);color:var(--ink);background:var(--paper);transition:.2s}
.ev-soc svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.9}
.ev-soc .ico-wa{fill:currentColor;stroke:none}
.ev-soc:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm)}
.ev-soc.instagram:hover{background:#e1306c;color:#fff;border-color:#e1306c}
.ev-soc.facebook:hover{background:#1877f2;color:#fff;border-color:#1877f2}
.ev-soc.whatsapp:hover{background:#25d366;color:#fff;border-color:#25d366}

/* ---- rider briefing — full-width section at the bottom of an event ---- */
.detail-body-event{padding-bottom:1.8rem}
.detail-extra{
  max-width:var(--maxw);margin:0 auto;padding:2.6rem 1.4rem 5rem;
  display:flex;flex-direction:column;gap:1.8rem;border-top:1px solid var(--line);
}
.extra-head{margin-bottom:.2rem}
.extra-head .section-title{font-size:clamp(2rem,4.5vw,3rem)}
.extra-sub{color:var(--ink-soft);font-size:1.02rem;max-width:60ch;margin-top:.4rem}

.detail-side{display:flex;flex-direction:column;gap:1.2rem}
.side-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:1.4rem;box-shadow:var(--shadow-sm)}
.side-card h3{font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:.9rem;color:var(--blue);margin-bottom:.8rem}
.map-embed{width:100%;height:200px;border:0;border-radius:10px;margin-bottom:.8rem}
/* ---- completed events: muted look (calendar + detail) + alert banner ---- */
.erow.is-done{opacity:.72}
.erow.is-done:hover{opacity:1}
.detail-hero.is-done .dh-banner,.detail-hero.is-done .dh-bg{filter:grayscale(1)}
.detail-body.is-done .location-map,
.detail-body.is-done .side-card img,
.detail-body.is-done .sponsor-tile img,
.detail-body.is-done .tt-logo,
.detail-body.is-done .tire-rec-gif,
.detail-body.is-done .cat-badge{filter:grayscale(.9)}
/* full event poster (shows all the on-image info) */
.poster-zoom{display:block;position:relative;border-radius:10px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow-sm);transition:.25s}
.poster-zoom:hover{box-shadow:var(--shadow);transform:translateY(-2px)}
.event-poster{width:100%;height:auto;display:block}
.poster-note{font-size:.8rem;color:var(--ink-faint);margin-top:.7rem;line-height:1.45}
.nav-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}
.nav-app{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.35rem;font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.02em;font-size:.72rem;padding:.6rem .3rem;border-radius:8px;text-align:center;border:1px solid var(--line-strong);background:var(--paper);color:var(--ink);transition:.18s}
.nav-app:hover{background:var(--blue);color:#fff;border-color:var(--blue)}
.nav-app-ico{display:inline-flex;align-items:center;justify-content:center}
.nav-app-ico svg{width:22px;height:22px;display:block}
.nav-app-name{line-height:1}
.pay-line{display:flex;justify-content:space-between;padding:.55rem 0;border-bottom:1px dashed var(--line);font-size:.95rem;gap:1rem}
.pay-line:last-child{border-bottom:0}
.pay-line span:first-child{color:var(--ink-faint)}
.pay-line span:last-child{font-weight:600;color:var(--ink);text-align:right}
/* numbered registration steps (paySteps): label on top, steps below */
.pay-steps{padding:.55rem 0;border-bottom:1px dashed var(--line);font-size:.95rem}
.pay-steps > span{color:var(--ink-faint)}
.pay-steps ol{margin:.45rem 0 0;padding-left:1.4rem;display:grid;gap:.3rem;color:var(--ink);font-weight:600}
.pay-steps li::marker{color:var(--blue);font-weight:700}
.location-map{margin-top:1rem}
.location-map .map-embed{height:240px;margin-bottom:.6rem}
.pay-card{margin-top:1.4rem;background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r);padding:1.1rem 1.3rem}
.pay-card-head{font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:.9rem;color:var(--blue);margin-bottom:.5rem}
.pay-alert{display:flex;gap:.6rem;align-items:flex-start;margin:.55rem 0;padding:.7rem .85rem;background:#fff5e6;border:1px solid #f0c674;border-radius:9px;font-size:.9rem;line-height:1.4;color:#7a4a00}
.pay-alert-ico{flex:none;width:20px;height:20px;border-radius:50%;background:#e8971a;color:#fff;font-weight:700;display:grid;place-items:center;font-size:.85rem;line-height:1}
.date-alert{max-width:620px;margin:.7rem 0 .9rem;font-weight:600}
/* name + its labels: labels sit beside the name and drop to their own line cleanly when they don't fit */
.erow-title{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .5rem}
.erow-title > .vstat{top:0;margin-left:0}
/* name + verified/status + flag stay inline, so the flag follows the last word */
.erow-name{min-width:0}
/* "Fecha por confirmar": bigger, red, with a calendar-alert icon so it stands apart from the status labels */
.vstat--date{gap:.4rem;font-family:var(--font-cond);font-weight:800;font-size:.9rem;line-height:1;letter-spacing:.06em;text-transform:uppercase;
  padding:.42rem .75rem;border-radius:999px;white-space:nowrap;background:linear-gradient(135deg,#e0312e,#b3121f);color:#fff;
  border:1px solid rgba(255,255,255,.35);box-shadow:0 2px 10px rgba(224,49,46,.35);animation:dateTbcPulse 2.4s ease-in-out infinite}
.vstat--date svg{width:1.05em;height:1.05em;flex:none}
/* longer wording wraps inside the chip on narrow screens instead of overflowing */
@media (max-width:560px){.vstat--date{white-space:normal;line-height:1.15;border-radius:14px;text-align:left}}
.ei-tags .vstat--date{font-size:.92rem;padding:.44rem .8rem}
@keyframes dateTbcPulse{0%,100%{box-shadow:0 2px 10px rgba(224,49,46,.35)}50%{box-shadow:0 2px 10px rgba(224,49,46,.35),0 0 0 5px rgba(224,49,46,.18)}}
@media (prefers-reduced-motion:reduce){.vstat--date{animation:none}}
/* "Prepárate para la próxima edición" and "En proceso de organización": a quiet line, not a badge —
   small icon + sentence-case text in a soft amber, so rows stay calm */
.vstat--line{gap:.4rem;align-items:flex-start;font-family:var(--font-cond);font-weight:600;font-size:.86rem;line-height:1.25;
  letter-spacing:.02em;text-transform:none;white-space:normal;text-align:left;max-width:100%;color:#a86a00}
:root[data-theme="dark"] .vstat--line{color:#e8b44f}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .vstat--line{color:#e8b44f}}
.vstat--line svg{width:1em;height:1em;flex:none;margin-top:.12em}
.vstat--line em{font-style:normal;opacity:.75}
/* calendar: always its own line under the name, so it reads the same on phone and desktop */
.erow-title .vstat--line{flex-basis:100%}
/* Afiches card: small frosted tag, same family as the other card tags */
.ei-tags .vstat--line{font-size:.76rem;padding:.34rem .62rem;border-radius:10px;color:#f3c969;
  background:rgba(12,16,22,.62);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(243,201,105,.35)}
/* checkered flag after a concluded event's name (calendar) */
.detail-cta{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1.1rem}
/* event WhatsApp buttons (register, group, organizers): one compact stack on the left,
   every button as wide as the longest label rather than the full column */
.detail-cta--wa{display:grid;grid-template-columns:minmax(0,max-content);justify-content:start;gap:.55rem}
.detail-cta--wa .btn{justify-content:flex-start;padding:.7rem 1.2rem;font-size:.84rem}
.detail-cta--wa .btn-primary,.detail-cta--wa .btn-wa{border:1px solid transparent}   /* same height as the outlined organizer buttons */
.detail-cta .btn .ico-wa{flex:none}

/* ============ REGISTER ============ */
.register-wrap{max-width:var(--maxw);margin:0 auto;padding:1.5rem 1.4rem 5rem;display:grid;grid-template-columns:1.1fr .9fr;gap:2rem;align-items:start}
.register-form,.contact-form{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:2rem;box-shadow:var(--shadow-sm)}
.form-row,.form-grid{margin-bottom:1rem}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.register-form label,.contact-form label{display:flex;flex-direction:column;gap:.4rem;font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.04em;font-size:.8rem;color:var(--ink-soft)}
.hint{text-transform:none;letter-spacing:0;font-family:var(--font-body);font-weight:400;color:var(--ink-faint);font-size:.78rem}
.register-form input,.register-form select,.contact-form input,.contact-form textarea{
  background:var(--paper-2);border:1px solid var(--line-strong);border-radius:9px;
  padding:.75rem .9rem;color:var(--ink);font-family:var(--font-body);font-size:1rem;
}
.register-form input::placeholder,.contact-form input::placeholder,.contact-form textarea::placeholder{color:var(--ink-faint)}
.register-form input:focus,.register-form select:focus,.contact-form input:focus,.contact-form textarea:focus{outline:none;border-color:var(--blue);background:var(--paper);box-shadow:0 0 0 3px var(--blue-tint)}
.file-label{margin:1rem 0 1.4rem}
.file-label input[type=file]{display:none}
.file-display{font-family:var(--font-body);text-transform:none;letter-spacing:0;font-weight:500;display:flex;align-items:center;gap:.6rem;background:var(--paper-2);border:1px dashed var(--line-strong);border-radius:9px;padding:.8rem .9rem;color:var(--ink-faint);cursor:pointer;transition:.2s}
.file-display:hover{border-color:var(--blue);color:var(--ink-soft)}
.file-display.has-file{color:var(--green);border-color:var(--green);border-style:solid;background:var(--paper)}
.form-note{font-size:.82rem;color:var(--ink-faint);margin-top:.9rem;text-align:center}

.participants-panel{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:1.6rem;position:sticky;top:90px;box-shadow:var(--shadow-sm)}
.participants-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;gap:.5rem;flex-wrap:wrap}
.participants-head h3{font-family:var(--font-disp);text-transform:uppercase;font-size:1.4rem;display:flex;align-items:center;gap:.5rem;color:var(--ink)}
.count-badge{font-family:var(--font-cond);font-weight:700;background:var(--blue);color:#fff;font-size:.82rem;padding:.05rem .55rem;border-radius:100px}
.participants-actions{display:flex;gap:.9rem}
.link-btn{background:none;border:0;color:var(--blue);font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.03em;font-size:.8rem;cursor:pointer}
.link-btn:hover{text-decoration:underline}
.link-btn.danger{color:var(--red)}
.participants-body{display:flex;flex-direction:column;gap:.5rem;max-height:520px;overflow-y:auto}
.part-empty{color:var(--ink-faint);text-align:center;padding:2rem 0;font-style:normal}
.part-item{background:var(--paper-2);border:1px solid var(--line);border-radius:10px;padding:.7rem .9rem}
.part-event{font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.04em;font-size:.7rem;color:var(--blue-deep)}
.part-name{font-weight:600;margin-top:.1rem;color:var(--ink)}
.part-detail{font-size:.82rem;color:var(--ink-faint);display:flex;gap:.8rem;flex-wrap:wrap;margin-top:.25rem}
.part-receipt{color:var(--green)}

/* ============ MEDIA ============ */
.media-grid{max-width:var(--maxw);margin:0 auto;padding:1.5rem 1.4rem 5rem;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.2rem}
.media-item{position:relative;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);aspect-ratio:3/4;background:var(--paper-2);box-shadow:var(--shadow-sm)}
.media-item .mi-media{width:100%;height:100%;object-fit:cover}
.media-item.wide{grid-column:span 2;aspect-ratio:16/9}
.media-item::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,12,16,.82),transparent 52%);pointer-events:none}
.mi-cap{position:absolute;bottom:0;left:0;right:0;z-index:2;padding:1rem;font-family:var(--font-disp);font-weight:700;text-transform:uppercase;font-size:1.2rem;color:#fff}
.mi-tag{display:block;font-family:var(--font-cond);font-size:.7rem;letter-spacing:.08em;color:#ffd27a}

/* ============ PARTNERS ============ */
.partners-grid{max-width:var(--maxw);margin:0 auto;padding:1.5rem 1.4rem 5rem;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1.2rem}
.partner-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:2rem 1.6rem;text-align:center;transition:.28s;box-shadow:var(--shadow-sm)}
.partner-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--blue)}
.partner-logo{width:78px;height:78px;margin:0 auto 1rem;border-radius:16px;display:grid;place-items:center;font-family:var(--font-disp);font-size:2rem;color:#fff;transform:rotate(-4deg)}
.partner-name{font-family:var(--font-disp);font-weight:700;text-transform:uppercase;font-size:1.3rem;color:var(--ink)}
.partner-cat{color:var(--ink-faint);font-size:.88rem;margin-top:.2rem}
.partner-phone{color:var(--blue);font-weight:600;margin-top:.5rem}

/* ============ CONTACT ============ */
/* contact: three ways to work with us */
.contact-purposes{max-width:var(--maxw);margin:0 auto;padding:1rem 1.4rem 0;display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.purpose-card{display:flex;flex-direction:column;padding:1.6rem 1.4rem;border:1px solid var(--line);border-top:4px solid var(--blue);border-radius:var(--r);background:var(--paper-2)}
.purpose-title{font-family:var(--font-disp);text-transform:uppercase;font-size:1.35rem;line-height:1.05;color:var(--ink);margin:0 0 .5rem}
.purpose-desc{color:var(--ink-soft);font-size:.95rem;line-height:1.55;margin:0 0 1.2rem;flex:1}
.purpose-cta{align-self:center;background:var(--blue);color:#fff;border-radius:999px;padding:.7rem 1.4rem;font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.04em;font-size:.85rem}
.purpose-cta:hover{background:var(--blue-deep);transform:translateY(-2px)}
@media(max-width:820px){.contact-purposes{grid-template-columns:1fr}}
.contact-wrap{max-width:var(--maxw);margin:0 auto;padding:1.5rem 1.4rem 5rem;display:grid;grid-template-columns:1.3fr .7fr;gap:2rem;align-items:start}
.contact-form textarea{resize:vertical}
.contact-cards{display:flex;flex-direction:column;gap:1rem}
.contact-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:1.4rem;display:flex;flex-direction:column;gap:.2rem;transition:.2s;box-shadow:var(--shadow-sm)}
a.contact-card:hover{border-color:var(--blue);transform:translateX(4px)}
.cc-label{font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:.76rem;color:var(--ink-faint)}
.cc-val{font-size:1.12rem;font-weight:600;color:var(--ink)}
/* social row on the Contact "Seguinos" card */
.contact-social .social-row{display:flex;gap:.6rem;margin-top:.4rem}
.contact-social .social-row a{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;border:1px solid var(--line-strong);color:var(--ink);background:var(--paper);transition:.2s}
.contact-social .social-row a:hover{background:var(--blue);color:#fff;border-color:var(--blue);transform:translateY(-2px)}
.contact-social .social-row svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ============ FOOTER (dark anchor) ============ */
.site-footer{border-top:3px solid var(--blue);background:var(--panel);margin-top:2rem;color:#aeb6bd}
.footer-inner{max-width:var(--maxw);margin:0 auto;padding:3rem 1.4rem;display:flex;justify-content:space-between;gap:2rem;flex-wrap:wrap}
.footer-brand{max-width:38ch}
/* footer sits on a near-black panel — keep the wordmark white + heavy so it stays legible */
.footer-brand .brand-word{font-size:1.8rem;color:#fff;font-weight:900}
.footer-brand .brand-word em,
.footer-brand .brand-word b{color:#fff}
.footer-brand p{color:#8b939a;margin-top:.5rem}
.footer-email{display:inline-block;margin-top:1rem;color:#c2c9cf;font-size:.92rem;transition:color .2s}
.footer-email:hover{color:#fff}
.footer-social{display:flex;gap:.6rem;margin-top:.75rem}
.footer-social a{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.18);color:#fff;transition:.2s}
.footer-social a:hover{background:var(--blue);border-color:var(--blue);transform:translateY(-2px)}
.footer-social svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.footer-nav{display:flex;flex-direction:column;gap:.55rem;align-items:flex-start}
.footer-nav a{font-family:var(--font-cond);font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:#c2c9cf;transition:.2s}
.footer-nav a:hover{color:#fff}
.footer-col-head{font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-size:.72rem;color:#7c848b;margin-bottom:.2rem}
.footer-contact{display:flex;flex-direction:column;gap:.55rem;align-items:flex-start}
.footer-contact a{color:#c2c9cf;font-size:.92rem;transition:.2s}
.footer-contact a:hover{color:#fff}
.footer-col-note{color:#7c848b;font-size:.88rem}
.footer-base{border-top:1px solid rgba(255,255,255,.1);max-width:var(--maxw);margin:0 auto;padding:1.2rem 1.4rem;display:flex;justify-content:space-between;flex-wrap:wrap;gap:.5rem;color:#777f86;font-size:.85rem}

/* ============ TOAST ============ */
.toast{
  position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%) translateY(120%);
  background:var(--blue);color:#fff;font-family:var(--font-cond);font-weight:700;
  text-transform:uppercase;letter-spacing:.04em;padding:.9rem 1.6rem;border-radius:100px;
  z-index:200;transition:transform .4s cubic-bezier(.2,1.2,.3,1);box-shadow:var(--shadow);
}
.toast.show{transform:translateX(-50%) translateY(0)}

/* ============ SPONSORS (event detail) ============
   A grid of --cols (2 or 3) columns sized to the logos it has (see
   sponsorsBlock in app.js). Every row is one column-width tall, so a row of
   stretched/wide tiles lines up with the square ones; no empty boxes. */
.ev-slides--sponsors .ev-slide{container-type:inline-size}
/* anything that opens in the full-screen photo viewer */
[data-lightbox] [data-lb],.detail-hero.has-banner{cursor:zoom-in}
.detail-hero.has-banner [data-back]{cursor:pointer}
/* data-fit cards: pages keep their own height and the frame eases to the one on screen */
[data-fit] .ev-slides-track{align-items:flex-start}
[data-fit] .ev-slides-frame{transition:height .45s cubic-bezier(.2,.7,.2,1)}
@media (prefers-reduced-motion: reduce){ [data-fit] .ev-slides-frame{transition:none} }
.sponsor-grid{--cols:3;display:grid;grid-template-columns:repeat(calc(var(--cols) * 2),minmax(0,1fr));gap:.5rem;align-content:start;
  grid-auto-rows:calc((100cqw - (var(--cols) - 1) * .5rem) / var(--cols))}
.sponsor-tile{position:relative;min-width:0;display:grid;place-items:center;padding:.3rem;overflow:hidden;
  background:#fff;border:1px solid var(--line);border-radius:9px;box-shadow:var(--shadow-sm)}
/* the logo is taken out of flow so a tall or wide image always shrinks to its tile instead of stretching the row */
.sponsor-tile img{position:absolute;inset:.3rem;width:calc(100% - .6rem);height:calc(100% - .6rem);object-fit:contain;display:block}
.sponsor-tile--text{padding:.4rem;text-align:center;line-height:1.1;box-shadow:none;
  font-family:var(--font-cond);font-weight:600;font-size:.72rem;letter-spacing:.05em;text-transform:uppercase;
  background:var(--paper-2);color:var(--ink-soft)}
/* browsers without container units: square cells from the tiles themselves */
@supports not (width:1cqw){
  .sponsor-grid{grid-auto-rows:auto}
  .sponsor-tile{aspect-ratio:1}
  .sponsor-tile--wide{aspect-ratio:auto}
}
.shirt-alert{margin:0 0 .75rem;font-weight:600}
/* sidebar slideshows (sponsors, event banners) */
.ev-slides-frame{position:relative;overflow:hidden}
.ev-slides--banners .ev-slides-frame{border-radius:var(--r);background:#0b0f12;border:1px solid var(--line);box-shadow:var(--shadow)}
.ev-slides--banners .ev-slides-frame::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;z-index:2;pointer-events:none;
  background:linear-gradient(90deg,var(--red) 0 30%,var(--blue) 30% 100%)}
.ev-slides-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
.ev-slides-track::-webkit-scrollbar{display:none}
.ev-slide{flex:0 0 100%;min-width:0;scroll-snap-align:start}
.ev-slides--banners .ev-slide{aspect-ratio:2/3}
/* fitted banner slideshows: each slide takes its own image shape (set inline on the link) */
.ev-slides--banners[data-fit] .ev-slide{aspect-ratio:auto}
.ev-slides--banners[data-fit] .ev-slide-link{height:auto}
/* in the main column the portrait banners are capped so they don't fill the whole width */
.info-block.ev-slides--banners .ev-slides-frame,.info-block.ev-slides--banners .ev-slides-dots{max-width:440px}
.ev-slide-link{display:block;width:100%;height:100%}
.ev-slide-link img{width:100%;height:100%;object-fit:contain;display:block}
/* sponsors not confirmed yet: a plain sign in the sponsors card */
.sponsors-pending-sign{margin:.2rem 0 0;padding:1.4rem 1rem;text-align:center;border:1.5px dashed var(--line-strong);border-radius:10px;
  font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-faint)}
/* "Por revelarse pronto": caution tape across a dark panel (stripes = assets/ui/caution-stripes.svg) */
.pending-tape{position:relative;overflow:hidden;margin:.2rem 0 0;min-height:7.5rem;display:grid;place-items:center;border-radius:10px;
  background:repeating-linear-gradient(-45deg,#15181b 0 14px,#1b1f23 14px 28px);border:1.5px solid #2a2f34}
.pending-tape-band{position:relative;z-index:1;margin:0;width:120%;transform:rotate(-4deg);padding:24px 0;text-align:center;
  background:url(assets/ui/caution-stripes.svg) 0 0/22px 22px repeat-x,url(assets/ui/caution-stripes.svg) 0 100%/22px 22px repeat-x,#ffc400;
  box-shadow:0 6px 16px rgba(0,0,0,.45);animation:tape-slide 1.6s linear infinite}
.pending-tape-band span{display:block;padding:.15rem .5rem;color:#111;
  font-family:var(--font-disp);font-weight:900;font-size:clamp(1.25rem,3.4vw,1.7rem);letter-spacing:.08em;text-transform:uppercase;line-height:1}
.pending-tape-band span::before,.pending-tape-band span::after{content:"\26A0";margin:0 .55em;font-size:.85em}
.pending-tape-band--back{position:absolute;inset:auto;width:130%;height:22px;padding:0;transform:rotate(9deg);opacity:.55;
  background:url(assets/ui/caution-stripes.svg) 0 0/22px 22px repeat-x;box-shadow:none;z-index:0}
@keyframes tape-slide{to{background-position:22px 0,-22px 100%,0 0}}
@media (prefers-reduced-motion:reduce){.pending-tape-band{animation:none}}
.ev-slides-btn{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:36px;height:36px;border-radius:50%;border:0;
  display:grid;place-items:center;background:rgba(11,15,18,.62);color:#fff;cursor:pointer;transition:background .2s}
.ev-slides-btn:hover,.ev-slides-btn:focus-visible{background:var(--blue)}
.ev-slides-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.ev-slides-btn.prev{left:.5rem}.ev-slides-btn.next{right:.5rem}
.ev-slides-dots{display:flex;justify-content:center;gap:.45rem;margin-top:.7rem}
.ev-slides-dots button{width:9px;height:9px;padding:0;border-radius:50%;border:0;background:var(--line);cursor:pointer;transition:width .25s,background .25s}
.ev-slides-dots button.on{width:24px;border-radius:5px;background:var(--red)}
/* "auto" slideshows: passive page indicator under the grid (fixed height so every card matches) */
.ev-slides-nav{display:flex;align-items:center;justify-content:center;margin-top:.7rem;min-height:12px}
.ev-slides-nav .ev-slides-dots{margin-top:0;flex-wrap:wrap}
.ev-slides-dots span{width:9px;height:9px;border-radius:50%;background:var(--line);transition:width .25s,background .25s}
.ev-slides-dots span.on{width:24px;border-radius:5px;background:var(--red)}
/* "Lo Que Se Viene" teaser video (16:9, fills the card) */
.ev-video-frame{position:relative;border-radius:var(--r);overflow:hidden;background:#000;border:1px solid var(--line);box-shadow:var(--shadow)}
.ev-video-frame::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,var(--red) 0 30%,var(--blue) 30% 100%)}
.ev-video-frame video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#000}

/* ============ PHOTO VIEWER (lightbox, see openLightbox in app.js) ============ */
html.lb-open{overflow:hidden}
.lightbox{position:fixed;inset:0;z-index:2000;display:flex;flex-direction:column;background:rgba(6,9,12,.97);animation:lb-in .18s ease-out}
@keyframes lb-in{from{opacity:0}}
.lb-bar{flex:none;display:flex;align-items:center;justify-content:space-between;padding:.8rem 1rem;color:#fff}
.lb-count{font-family:var(--font-cond);font-weight:600;font-size:.95rem;letter-spacing:.08em}
.lb-close,.lb-btn{width:44px;height:44px;border-radius:50%;border:0;display:grid;place-items:center;
  background:rgba(255,255,255,.14);color:#fff;cursor:pointer;transition:background .2s,opacity .2s}
.lb-close:hover,.lb-close:focus-visible,.lb-btn:hover,.lb-btn:focus-visible{background:var(--blue)}
.lb-close svg,.lb-btn svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.lb-btn{position:absolute;top:50%;transform:translateY(-50%)}
.lb-btn.prev{left:1rem}.lb-btn.next{right:1rem}
.lb-btn:disabled{opacity:.25;cursor:default}
.lb-track{flex:1;min-height:0;display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior:contain}
.lb-track::-webkit-scrollbar{display:none}
.lb-slide{flex:0 0 100%;min-width:0;margin:0;padding:0 4.5rem 1.5rem;scroll-snap-align:center;display:grid;place-items:center}
.lb-slide img{max-width:100%;max-height:calc(100vh - 110px);max-height:calc(100dvh - 110px);object-fit:contain}
@media (max-width:640px){
  .lb-slide{padding:0 .75rem 1rem}
  .lb-btn{width:38px;height:38px;background:rgba(6,9,12,.55)}
  .lb-btn.prev{left:.4rem}.lb-btn.next{right:.4rem}
}
@media (prefers-reduced-motion:reduce){.lightbox{animation:none}}

/* ============ AREA SERVICES DIRECTORY (event detail) ============ */
.services-intro{color:var(--ink-soft);margin:-.15rem 0 1rem;font-size:.96rem}
.services-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.svc-cat{border:1px solid var(--line);border-radius:12px;background:var(--paper);padding:1rem 1.1rem;box-shadow:var(--shadow-sm)}
.svc-cat-head{
  display:flex;align-items:center;gap:.55rem;
  font-family:var(--font-disp);text-transform:uppercase;font-size:1.18rem;color:var(--ink);
  margin-bottom:.6rem;padding-bottom:.55rem;border-bottom:2px solid var(--line);
}
.svc-cat-head svg{width:22px;height:22px;fill:none;stroke:var(--blue);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.svc-list{display:flex;flex-direction:column}
.svc-item{display:flex;align-items:center;justify-content:space-between;gap:.8rem;padding:.55rem 0;border-bottom:1px dashed var(--line)}
.svc-item:last-child{border-bottom:0}
.svc-info{min-width:0;display:flex;flex-direction:column}
.svc-name{font-weight:600;color:var(--ink);line-height:1.25}
.svc-kind{font-size:.79rem;color:var(--ink-faint)}
.svc-actions{display:flex;align-items:center;gap:.4rem;flex:none}
.svc-phone{
  display:inline-flex;align-items:center;gap:.35rem;white-space:nowrap;
  font-family:var(--font-cond);font-weight:700;font-size:.82rem;color:var(--blue);
  padding:.32rem .5rem;border-radius:7px;transition:.18s;
}
.svc-phone svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.svc-phone:hover{background:var(--blue-tint);color:var(--blue-deep)}
.svc-wa{display:inline-grid;place-items:center;width:33px;height:33px;border-radius:8px;background:#25d366;color:#fff;flex:none;transition:.18s}
.svc-wa:hover{transform:translateY(-1px);filter:brightness(1.06)}
.svc-wa svg{width:18px;height:18px;fill:currentColor;stroke:none}
.svc-dir{display:inline-grid;place-items:center;width:33px;height:33px;border-radius:8px;background:var(--paper-3);color:var(--ink-soft);border:1px solid var(--line);flex:none;transition:.18s}
.svc-dir:hover{background:var(--blue-tint);color:var(--blue-deep)}
.svc-dir svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.svc-join{
  display:inline-flex;align-items:center;gap:.45rem;margin-top:1.1rem;
  font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.04em;
  font-size:.82rem;color:var(--blue);
}
.svc-join svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
.svc-join:hover{color:var(--blue-deep)}
.svc-join:hover svg{transform:translateX(3px)}

/* ============ ORGANIZERS CTA (home) ============ */
.organizers{padding-top:1rem}
.org-card{
  display:grid;grid-template-columns:1.25fr .9fr;gap:2.4rem;align-items:center;
  background:var(--panel);border-radius:18px;padding:2.8rem;position:relative;overflow:hidden;
}
.org-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:linear-gradient(#9ca3af,#6b7280)}
.org-card::after{
  content:"";position:absolute;right:-10%;top:-30%;width:60%;height:160%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(10,95,208,.28),transparent 70%);
}
.org-copy{position:relative;z-index:2}
/* grid items must be allowed to shrink below their content min-width, or the
   1fr track overflows the padded card and overflow:hidden clips text on phones */
.org-copy,.org-form{min-width:0}
.org-form input{min-width:0}
.org-kicker{color:#ff8d6b;margin-bottom:.4rem}
.org-copy .section-title{color:#fff}
.org-copy .section-title .ital{color:#6db0ff}
.org-copy>p{color:#aeb6bd;margin-top:.6rem;max-width:52ch}
.org-points{list-style:none;margin-top:1.1rem;display:flex;flex-direction:column;gap:.5rem}
.org-points li{display:flex;gap:.6rem;align-items:flex-start;color:#c9d0d6;font-size:.95rem}
.org-points li::before{content:"";width:9px;height:9px;border-radius:2px;background:var(--blue);margin-top:.45rem;flex:none;transform:rotate(45deg)}
.org-form{
  position:relative;z-index:2;display:flex;flex-direction:column;gap:.7rem;
  background:#0a0f13;border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:1.6rem;
}
.org-form-title{font-family:var(--font-disp);text-transform:uppercase;font-size:1.45rem;color:#fff;margin-bottom:.1rem}
.org-form input{
  background:#11181d;border:1px solid rgba(255,255,255,.16);border-radius:10px;
  padding:.8rem .9rem;color:#fff;font-family:var(--font-body);font-size:1rem;
}
.org-form input::placeholder{color:#7b848c}
.org-form input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(10,95,208,.25)}

/* custom inline form validation (replaces native browser tooltips) */
.field-error{display:block;color:#ff6b6b;font-size:.82rem;line-height:1.35;margin:.3rem 0 .1rem;font-weight:500}
.org-form input.invalid,
.register-form input.invalid,.register-form select.invalid,
.contact-form input.invalid,.contact-form textarea.invalid{
  border-color:#ff6b6b;box-shadow:0 0 0 3px rgba(255,107,107,.20)
}
.org-form .btn-block{margin-top:.3rem}
.org-wa,.org-email{display:block;text-align:center;font-family:var(--font-cond);font-weight:600;color:#8fb9ff;font-size:.88rem;transition:.18s}
.org-wa:hover,.org-email:hover{color:#fff}
.org-email{margin-top:.5rem;color:#9aa3b2}

/* ============ DIRECTORY (shops + services) ============ */
.store-filters{max-width:var(--maxw);margin:0 auto;padding:.4rem 1.4rem 0;display:flex;flex-direction:column;gap:.7rem}
.store-filter-group{display:flex;align-items:flex-start;gap:.7rem;flex-wrap:wrap}
.store-filter-group .control-label{padding-top:.5rem;flex:none;width:74px}
.store-chips{display:flex;flex-wrap:wrap;gap:.5rem}
.store-list{max-width:var(--maxw);margin:0 auto;padding:1.4rem 1.4rem 5rem;display:flex;flex-direction:column;gap:.9rem}
.store-banner{
  position:relative;overflow:hidden;border-radius:14px;min-height:130px;
  padding:1.5rem 1.8rem;display:flex;align-items:center;justify-content:space-between;gap:1.2rem;
  color:#fff;box-shadow:var(--shadow-sm);transition:.28s;
}
.store-banner::after{content:"";position:absolute;inset:0;z-index:1;border-radius:inherit;background:linear-gradient(100deg,rgba(6,10,16,.82),rgba(6,10,16,.34) 58%,rgba(6,10,16,.6))}
/* faded store logo / category icon watermark — sits over the scrim, under the text */
.store-bannerart{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden;border-radius:inherit}
.store-bannerart.sba-logo{background-repeat:no-repeat;background-position:62% center;background-size:auto 60%;opacity:.2;filter:brightness(0) invert(1)}
.store-bannerart.sba-icon{display:flex;align-items:center;justify-content:flex-end;padding-right:20%}
.store-bannerart.sba-icon svg{width:172px;height:172px;opacity:.16;fill:none;stroke:#fff;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;transform:rotate(-9deg)}
.store-banner:hover .store-bannerart.sba-icon svg{transform:rotate(-9deg) scale(1.06);transition:transform .4s}
.store-banner:hover{transform:translateX(5px);box-shadow:var(--shadow)}
/* let the open directions menu escape the banner clip */
.store-banner:has(.map-menu[open]){overflow:visible;z-index:6}
/* emblem + name lead */
.store-lead{position:relative;z-index:3;display:flex;align-items:center;gap:1.1rem;max-width:66%;min-width:0}
.store-emblem{
  flex:none;width:64px;height:64px;border-radius:15px;overflow:hidden;
  display:grid;place-items:center;background:rgba(255,255,255,.94);
  box-shadow:0 10px 24px -10px rgba(0,0,0,.7);
}
.store-emblem img{width:100%;height:100%;object-fit:contain;padding:7px}
.store-emblem-mono{font-family:var(--font-disp);font-weight:900;font-size:2.1rem;color:var(--ink);line-height:1}
.store-main{position:relative;z-index:3;min-width:0;flex:1}
.store-tags{display:flex;align-items:center;gap:.55rem;flex-wrap:wrap;margin-bottom:.3rem}
.store-type{
  font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.07em;
  font-size:.66rem;padding:.26rem .65rem;border-radius:100px;
  background:var(--red);color:#fff;box-shadow:0 5px 14px -5px rgba(0,0,0,.6);
}
/* category-coded badge colours */
.store-banner.type-parts     .store-type{background:var(--blue)}
.store-banner.type-repairs   .store-type{background:var(--red)}
.store-banner.type-service   .store-type{background:var(--gold)}
.store-banner.type-wash      .store-type{background:#17a2c4}
.store-banner.type-tires     .store-type{background:#11181d}
.store-banner.type-gear      .store-type{background:var(--green)}
.store-banner.type-transport .store-type{background:#b5651d}
.store-banner.type-media     .store-type{background:#0e8c86}
.store-meta{display:inline-flex;align-items:center;gap:.4rem;font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-size:.72rem;color:#e7eefb;text-shadow:0 1px 4px rgba(0,0,0,.5)}
.store-meta .prov-flag{box-shadow:0 0 0 1px rgba(255,255,255,.55)}
.store-name{font-family:var(--font-disp);font-weight:800;text-transform:uppercase;font-size:clamp(1.6rem,3.4vw,2.6rem);line-height:.95;margin-top:.15rem;text-shadow:0 2px 12px rgba(0,0,0,.5)}
.store-cat{color:#d4dade;font-size:.92rem;margin-top:.3rem;text-shadow:0 1px 4px rgba(0,0,0,.55)}
/* tap-to-call number */
.store-phone{
  display:inline-flex;align-items:center;gap:.4rem;margin-top:.6rem;
  font-family:var(--font-cond);font-weight:700;letter-spacing:.02em;font-size:.84rem;color:#fff;
  background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.3);
  padding:.32rem .7rem;border-radius:100px;transition:.18s;
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
}
.store-phone svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.9}
.store-phone:hover{background:var(--paper);color:var(--ink)}
.store-actions{position:relative;z-index:4;display:flex;flex-direction:row;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:.6rem;flex:none}
/* one "Directions" button → dropdown of every available map app (dark banner) */
.store-nav summary{
  background:var(--paper);border:0;color:var(--ink);
  padding:.55rem .95rem;border-radius:100px;gap:.42rem;
  letter-spacing:.05em;font-size:.78rem;font-weight:700;text-transform:uppercase;
  box-shadow:0 8px 20px -8px rgba(0,0,0,.6);
}
.store-nav summary>svg:first-of-type{width:16px;height:16px;fill:var(--blue);stroke:none;transition:.2s}
.store-nav summary:hover,.store-nav[open] summary{background:var(--blue);color:#fff}
.store-nav summary:hover>svg:first-of-type,.store-nav[open] summary>svg:first-of-type{fill:#fff;transform:rotate(8deg)}
.store-nav .mm-caret{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;transition:transform .18s}
.store-nav[open] .mm-caret{transform:rotate(180deg)}
.store-socials{display:flex;gap:.5rem;flex:none}
.store-soc{
  width:35px;height:35px;border-radius:9px;display:grid;place-items:center;
  background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.3);
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#fff;transition:.2s;
}
.store-soc:hover{transform:translateY(-3px);background:var(--paper);color:var(--ink);border-color:#fff}
.store-soc svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.9}
.store-soc .ico-wa{fill:currentColor;stroke:none}
.store-soc.whatsapp:hover{background:#25d366;color:#fff;border-color:#25d366}
.store-soc.instagram:hover{background:#e1306c;color:#fff;border-color:#e1306c}
.store-soc.facebook:hover{background:#1877f2;color:#fff;border-color:#1877f2}

/* ---- join-the-directory CTA (bottom of the store view) ---- */
.store-join{max-width:var(--maxw);margin:2.6rem auto 0;padding:0 1.4rem}
.store-join-inner{
  position:relative;overflow:hidden;border-radius:20px;
  padding:3rem 1.6rem 3.4rem;text-align:center;color:#fff;
  background:radial-gradient(130% 150% at 50% -25%,#14457e 0%,#0c2c52 42%,var(--ink) 100%);
  border:1px solid rgba(255,255,255,.08);box-shadow:var(--shadow);
}
/* pine tree-line along the bottom — same forest motif as the header */
.store-join-inner::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:54px;pointer-events:none;opacity:.55;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='90' viewBox='0 0 240 90'%3E%3Cpath fill='%231f7a46' d='M0 90 L16 90 L30 46 L44 90 L60 90 L80 30 L100 90 L112 90 L126 54 L140 90 L156 90 L178 36 L200 90 L212 90 L226 52 L240 90 Z'/%3E%3C/svg%3E");
  background-repeat:repeat-x;background-position:center bottom;background-size:auto 100%;
  -webkit-mask-image:linear-gradient(to top,#000,transparent);mask-image:linear-gradient(to top,#000,transparent);
}
.store-join-kicker{color:var(--gold);justify-content:center}
.store-join-title{font-family:var(--font-disp);text-transform:uppercase;font-size:clamp(2rem,4.4vw,3.2rem);line-height:.95;margin:.3rem 0 .8rem}
.store-join-title .ital{color:#6db0ff}
.store-join-sub{max-width:52ch;margin:0 auto 1.7rem;color:#c2ccd6;font-size:1.02rem;line-height:1.55}
.btn-wa{background:#25d366;color:#06311b;box-shadow:0 14px 30px -12px rgba(37,211,102,.6)}
.btn-wa:hover{background:#1fbf5b;transform:translateY(-2px)}
/* secondary WhatsApp button (e.g. "Preguntas con el Organizador"): outlined, green icon */
.btn-wa-ghost .ico-wa{color:#25d366}
/* phones: registration / WhatsApp buttons stay on one line */
@media(max-width:520px){.detail-cta .btn{font-size:.84rem;letter-spacing:.03em;padding:.8rem 1.05rem;white-space:nowrap}}
.store-join-wa{position:relative;z-index:1}
.store-join-email{display:block;margin-top:1.1rem;position:relative;z-index:1;color:#9fb2c4;font-size:.9rem}
.store-join-email:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}

/* ============ MERCHANDISE ============ */
.merch-grid{
  max-width:var(--maxw);margin:0 auto;padding:1.4rem 1.4rem 5rem;
  display:grid;grid-template-columns:repeat(auto-fill,minmax(248px,1fr));gap:1.4rem;
}
.merch-card{
  background:var(--paper);border:1px solid var(--line);border-radius:16px;overflow:hidden;
  box-shadow:var(--shadow-sm);transition:.26s;display:flex;flex-direction:column;
}
.merch-card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:var(--blue)}
/* product "photo" — CSS-printed garment on a soft studio backdrop */
.merch-media{
  position:relative;aspect-ratio:1/1;display:grid;place-items:center;overflow:hidden;
  background:
    radial-gradient(120% 90% at 50% 8%, #ffffff, var(--paper-2) 62%, var(--paper-3) 100%);
  border-bottom:1px solid var(--line);
}
.merch-media::after{content:"";position:absolute;inset:0;background:radial-gradient(60% 50% at 50% 105%,rgba(12,17,22,.10),transparent 70%)}
.merch-kindtag{
  position:absolute;top:.7rem;left:.7rem;z-index:3;
  font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.07em;font-size:.62rem;
  background:#11181d;color:#fff;padding:.24rem .6rem;border-radius:100px;
}
.garment{width:80%;height:80%;position:relative;z-index:1;filter:drop-shadow(0 16px 22px rgba(12,17,22,.22))}
.garment-cap{width:78%;height:auto;margin-top:8%}
.g-fill{fill:var(--base)}
.g-seam{fill:none;stroke:rgba(255,255,255,.16);stroke-width:1.4;stroke-linecap:round}
.g-brim{fill:var(--base);filter:brightness(.82)}
/* the printed design, overlaid on the chest / front panel */
.merch-print{position:absolute;z-index:2;display:flex;flex-direction:column;align-items:center;text-align:center;color:var(--ink);pointer-events:none}
.kind-tee .merch-print,.kind-hoodie .merch-print{top:46%;left:50%;transform:translate(-50%,-50%);width:42%}
.kind-cap .merch-print{top:42%;left:48%;transform:translate(-50%,-50%);width:34%}
.mp-design{font-family:var(--font-disp);font-weight:900;text-transform:uppercase;color:var(--ink);line-height:.86;letter-spacing:.01em;display:flex;flex-direction:column}
.kind-tee .mp-design,.kind-hoodie .mp-design{font-size:1.55rem}
.kind-cap .mp-design{font-size:1.2rem}
.mp-sub{font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:.5rem;margin-top:.3rem;opacity:.85}
.kind-cap .mp-sub{display:none}
.merch-body{padding:1.1rem 1.1rem 1.2rem;display:flex;flex-direction:column;gap:.7rem;flex:1}
.merch-head{display:flex;justify-content:space-between;align-items:baseline;gap:.6rem}
.merch-name{font-family:var(--font-disp);text-transform:uppercase;font-size:1.32rem;line-height:.98;color:var(--ink)}
.merch-price{font-family:var(--font-disp);font-size:1.32rem;color:var(--blue);flex:none}
.merch-sizes{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:auto}
.merch-size{
  font-family:var(--font-cond);font-weight:700;font-size:.78rem;min-width:34px;
  padding:.32rem .5rem;border-radius:7px;cursor:pointer;transition:.16s;
  background:var(--paper-2);border:1px solid var(--line-strong);color:var(--ink-soft);
}
.merch-size:hover{border-color:var(--ink)}
.merch-size.is-active{background:var(--panel);color:#fff;border-color:var(--ink)}
.merch-order{margin-top:.2rem}
.merch-order svg{width:18px;height:18px}

/* ============ RIDERS ============ */
.riders-grid{
  max-width:var(--maxw);margin:0 auto;padding:1.4rem 1.4rem 5rem;
  display:grid;grid-template-columns:repeat(auto-fill,minmax(228px,1fr));gap:1.2rem;
}
.rider-card{
  background:var(--paper);border:1px solid var(--line);border-top:4px solid var(--bc);
  border-radius:15px;overflow:hidden;box-shadow:var(--shadow-sm);transition:.26s;
  display:flex;flex-direction:column;
}
.rider-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.rider-photo-wrap{position:relative;aspect-ratio:1/1;overflow:hidden;background:#0b0f14}
.rider-photo{position:absolute;inset:0;background-color:#0b0f14;transition:transform .4s}
.rider-card:hover .rider-photo{transform:scale(1.05)}
.rider-photo-mono{display:grid;place-items:center;background:radial-gradient(120% 90% at 50% 20%,var(--bc),#0a0e13 78%)}
.rider-initials{font-family:var(--font-disp);font-weight:900;font-size:3.3rem;color:rgba(255,255,255,.94);letter-spacing:.02em;text-shadow:0 6px 20px rgba(0,0,0,.45)}
.rider-flag{position:absolute;top:.55rem;left:.6rem;z-index:2;font-size:1.35rem;line-height:1;filter:drop-shadow(0 1px 3px rgba(0,0,0,.5))}
.rider-num{position:absolute;top:.5rem;right:.7rem;z-index:2;font-family:var(--font-disp);font-size:1.6rem;color:#fff;line-height:1;text-shadow:0 2px 10px rgba(0,0,0,.65)}
.rider-local{position:absolute;bottom:.6rem;left:.6rem;z-index:2;font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:.6rem;background:var(--red);color:#fff;padding:.22rem .55rem;border-radius:100px;box-shadow:var(--shadow-sm)}
.rider-brandmark{position:absolute;bottom:.55rem;right:.55rem;z-index:2;width:48px;height:31px;object-fit:contain;background:rgba(255,255,255,.94);border-radius:8px;padding:3px 6px;box-shadow:var(--shadow-sm)}
.rider-body{padding:.9rem 1rem 1.1rem;display:flex;flex-direction:column}
.rider-disc{font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-size:.62rem;color:var(--bc)}
.rider-name{font-family:var(--font-disp);text-transform:uppercase;font-size:1.5rem;line-height:.95;color:var(--ink);margin-top:.12rem}
.rider-team{font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.03em;font-size:.76rem;color:var(--ink-soft);margin-top:.25rem}
.rider-note{color:var(--ink-soft);font-size:.86rem;line-height:1.4;margin-top:.45rem}

/* ============ RESPONSIVE ============ */
@media(max-width:1100px){
  .nav-toggle{display:flex;order:2;margin-left:auto}
  /* logo sits top-left; hamburger moves to the right */
  .header-inner-centered .brand-center{position:static;transform:none;margin:0;order:1}
  .header-inner-centered .main-nav{flex:none;width:auto}
  .main-nav{
    position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;
    background:#000;border-bottom:1px solid rgba(255,255,255,.12);padding:1rem;gap:.2rem;
    transform:translateY(-130%);transition:.35s;box-shadow:var(--shadow);max-height:calc(100vh - 100%);overflow:auto;
  }
  .main-nav.open{transform:translateY(0)}
  /* stack both tab groups in the dropdown */
  .nav-side{flex-direction:column;align-items:stretch;gap:.2rem;width:100%}
  .nav-tab{font-size:1.05rem;padding:.8rem 1rem}
  .nav-tab::after{display:none}
  .nav-cta{margin-left:0;margin-top:.4rem;text-align:center}
  .detail-body{grid-template-columns:minmax(0,1fr)}
  .register-wrap,.contact-wrap{grid-template-columns:1fr}
  .participants-panel{position:static}
  .org-card{grid-template-columns:1fr;gap:1.6rem;padding:2.2rem}
}
@media(max-width:680px){
  body{font-size:16px}
  .stats-strip{grid-template-columns:1fr 1fr}
  .stat:nth-child(2){border-right:0}
  .coverage-grid{grid-template-columns:1fr}
  .form-grid{grid-template-columns:1fr}
  /* calendar controls: let the sort chips wrap instead of running off-screen,
     and give the month picker its own full-width line */
  .calendar-controls{gap:1rem 1.1rem}
  .control-group{flex-wrap:wrap;gap:.4rem .5rem}
  #monthFilterWrap,.ei-month-wrap{width:100%}
  #monthFilterWrap .month-select,.ei-month-wrap .month-select{flex:1;min-width:0}
  .chip{padding:.4rem .85rem;font-size:.8rem}
  /* calendar rows: more breathing room, stacked full-width actions */
  .erow{flex-direction:column;align-items:flex-start;gap:.7rem;padding:1.1rem 1.2rem}
  .erow-right{align-items:center;width:100%;flex-direction:row;justify-content:space-between;flex-wrap:wrap;gap:.5rem}
  .erow-actions{gap:.4rem}
  .erow-title{font-size:1.55rem}
  .erow-meta{font-size:.9rem;gap:.4rem}
  .hero-prev{left:auto;right:4.4rem}.hero-next{right:.7rem}
  .hero-arrow{width:42px;height:42px}
  .media-item.wide{grid-column:span 1;aspect-ratio:3/4}
  .footer-base{flex-direction:column}
  .services-grid{grid-template-columns:1fr}
  .tw-grid{grid-template-columns:1fr}
  .tire-tiers{grid-template-columns:1fr}
  .store-banner{flex-direction:column;align-items:flex-start;gap:1rem;padding:1.3rem 1.4rem}
  .store-lead{max-width:100%;width:100%}
  .store-emblem{width:54px;height:54px}
  .store-actions{flex-direction:row;align-items:center;flex-wrap:wrap;width:100%}
  .store-socials{flex-wrap:wrap}
}

/* ============================================================
   LANGUAGE TOGGLE · FOOTER PRIVACY · PRIVACY PAGE
   ============================================================ */
.lang-toggle{
  display:inline-flex;align-items:center;gap:.42rem;
  font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.05em;
  font-size:.92rem;cursor:pointer;border:1.6px solid rgba(255,255,255,.6);
  background:rgba(255,255,255,.08);color:#fff;border-radius:999px;
  padding:.5rem 1rem;line-height:1;margin-left:.55rem;
  transition:background .18s,color .18s,border-color .18s,transform .18s;
}
.lang-toggle:hover{background:var(--paper);color:#000;border-color:#fff;transform:translateY(-1px)}
.lang-globe{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}

.footer-base-links{display:inline-flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.footer-base-links a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.footer-base-links a:hover{color:var(--red)}
.footer-dot{opacity:.5}

.privacy-wrap{max-width:760px;margin:0 auto;padding:0 1.2rem 3rem}
.privacy-card{
  background:var(--paper);border:1px solid var(--line);border-radius:16px;
  padding:1.6rem 1.8rem;box-shadow:0 1px 0 var(--line-2);
}
.privacy-card h3{
  font-family:var(--font-disp);font-size:1.15rem;letter-spacing:.01em;
  color:var(--ink);margin:1.3rem 0 .35rem;
}
.privacy-card h3:first-child{margin-top:0}
.privacy-card p{color:var(--ink-soft);line-height:1.6;margin:0}
.privacy-card a{color:var(--blue);text-decoration:underline;text-underline-offset:2px}

/* ============ CONSENT MICROCOPY (under forms) ============ */
.form-consent{
  font-size:.72rem;line-height:1.45;color:var(--ink-faint);
  margin:.85rem 0 0;max-width:46ch;
}
.form-consent a{color:var(--blue);text-decoration:underline;text-underline-offset:2px}
.org-form .form-consent{text-align:left}

/* ============ FOOTER DISCLAIMER ============ */
.footer-disclaimer{
  max-width:var(--maxw);margin:1.4rem auto 0;padding:1rem 1.4rem 0;
  border-top:1px solid rgba(255,255,255,.08);
  font-size:.72rem;line-height:1.5;color:rgba(255,255,255,.5);
}

/* ============ EVENT-DETAIL RISK NOTE ============ */
.detail-risk{
  font-size:.74rem;line-height:1.5;color:var(--ink-faint);
  margin:.9rem 0 0;padding-top:.85rem;border-top:1px dashed var(--line);
}

/* ============ COOKIE CONSENT BANNER ============ */
.cookie-banner{
  position:fixed;left:0;right:0;bottom:0;z-index:1200;
  background:var(--panel);color:#fff;
  border-top:2px solid var(--blue);
  box-shadow:0 -8px 30px rgba(0,0,0,.35);
  padding:.9rem 1.1rem calc(.9rem + env(safe-area-inset-bottom,0px));
  animation:ea-rise .35s ease both;
}
.cookie-inner{
  max-width:var(--maxw);margin:0 auto;
  display:flex;align-items:center;gap:1.1rem;flex-wrap:wrap;
}
.cookie-text{
  flex:1 1 320px;min-width:260px;margin:0;
  font-size:.82rem;line-height:1.5;color:rgba(255,255,255,.86);
}
.cookie-actions{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}
.cookie-more{
  color:rgba(255,255,255,.7);font-size:.8rem;text-decoration:underline;
  text-underline-offset:2px;margin-right:.2rem;
}
.cookie-more:hover{color:#fff}
.cookie-btn{padding:.55rem 1.1rem;font-size:.82rem;white-space:nowrap}
#cookieReject{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.35)}
#cookieReject:hover{background:rgba(255,255,255,.1)}
@media(max-width:560px){
  .cookie-actions{width:100%}
  .cookie-btn{flex:1}
}

/* ===== v1 launch: static home hero, upcoming list, reference note, page note ===== */
/* full-bleed hero with a centered quote + CTA, ripped edge into the page below */
.home-hero{position:relative;min-height:min(78vh,660px);display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--panel);margin-top:calc(-1 * var(--header-h,66px));padding-top:var(--header-h,66px)}
.home-hero-art{position:absolute;inset:0;width:100%;height:100%;display:block}
.home-hero-photo{position:absolute;inset:0;z-index:0;background-image:url('assets/hero-home-1200.webp');background-size:cover;background-position:center 38%;transform-origin:34% 44%;will-change:transform;animation:heroZoom 20s ease-in-out infinite alternate}
/* Animated hero loop — sits over the still photo, under the scrim/text. */
.home-hero-video{position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover;object-position:center 38%;display:block;opacity:0;transition:opacity .6s}
.home-hero-video.is-playing{opacity:1}
/* phones/tablets get the 1200px hero (sharp up to 3x screens); wide desktops the 2000px one */
@media (min-width:1201px){.home-hero-photo{background-image:url('assets/hero-home.webp')}}
html.deep-link .home-hero-photo{background-image:none}   /* share links: no home photo until Inicio opens */
/* Diagonal speed streaks sweeping past — race motion. */
.home-hero-speed{position:absolute;inset:-25%;z-index:1;pointer-events:none;mix-blend-mode:screen;opacity:.45;will-change:transform;background:repeating-linear-gradient(115deg,transparent 0 26px,rgba(255,255,255,.06) 26px 28px,transparent 28px 64px);animation:heroStreak 2.4s linear infinite}
/* Kicked-up dirt/dust rising through the frame. */
.home-hero-dust{position:absolute;inset:0;z-index:1;pointer-events:none;mix-blend-mode:screen;opacity:.4;background-repeat:repeat;background-size:340px 340px;background-image:radial-gradient(2.4px 2.4px at 18% 82%,rgba(224,214,192,.95),transparent 60%),radial-gradient(1.6px 1.6px at 42% 92%,rgba(224,214,192,.75),transparent 60%),radial-gradient(2px 2px at 66% 74%,rgba(224,214,192,.85),transparent 60%),radial-gradient(1.4px 1.4px at 80% 96%,rgba(224,214,192,.7),transparent 60%),radial-gradient(2.6px 2.6px at 8% 60%,rgba(224,214,192,.8),transparent 60%),radial-gradient(1.5px 1.5px at 54% 66%,rgba(224,214,192,.6),transparent 60%);animation:heroDust 6.5s linear infinite}
.home-hero-scrim{position:absolute;inset:0;z-index:2;background:radial-gradient(ellipse 62% 58% at 50% 46%,rgba(6,9,12,.55) 0%,rgba(6,9,12,0) 70%),linear-gradient(180deg,rgba(6,9,12,.32) 0%,rgba(6,9,12,.26) 45%,rgba(6,9,12,.56) 100%)}
@keyframes heroZoom{from{transform:scale(1.04) translate(0,0)}to{transform:scale(1.18) translate(-1.6%,-1.2%)}}
@keyframes heroStreak{from{transform:translate(0,0)}to{transform:translate(-27.1px,58.0px)}}
@keyframes heroDust{from{background-position:0 0}to{background-position:0 -340px}}
@media (prefers-reduced-motion:reduce){.home-hero-photo{animation:none;transform:none}.home-hero-speed,.home-hero-dust,.home-hero-video{display:none}}
.home-hero-inner{position:relative;z-index:2;max-width:var(--maxw);margin:0 auto;width:100%;padding:2rem 1.4rem 4rem;display:flex;flex-direction:column;align-items:center;text-align:center;gap:1.7rem}
.home-hero-quote{font-family:var(--font-disp);font-weight:800;color:#fff;line-height:.9;letter-spacing:.01em;text-transform:uppercase;font-size:clamp(2.8rem,9vw,7rem);margin:0;max-width:16ch;text-shadow:0 6px 34px rgba(0,0,0,.55)}
.home-hero-cta{background:#fff;color:#0c1116;border-radius:999px;padding:.9rem 2.2rem;font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:.95rem;box-shadow:0 14px 34px -14px rgba(0,0,0,.7)}
.home-hero-cta:hover{background:var(--blue);color:#fff;transform:translateY(-2px)}
.home-hero-torn{position:absolute;left:0;right:0;bottom:-2px;width:100%;height:auto;z-index:3;display:block;pointer-events:none}
.home-hero-torn path,.home-hero-torn circle{fill:var(--paper)}
/* intro copy strip (was in the hero) — sits above the calendar */
.home-intro{text-align:center;max-width:820px;margin-left:auto;margin-right:auto;padding-top:2.6rem;padding-bottom:2.6rem}
/* Enduro Army social profiles, above the intro copy */
.home-socials{display:flex;justify-content:center;flex-wrap:wrap;gap:1rem;margin:0 auto 1.8rem}
.home-socials:empty{display:none}
.home-social{width:60px;height:60px;border-radius:50%;display:grid;place-items:center;color:#fff;
  box-shadow:var(--shadow-sm);transition:transform .2s,box-shadow .2s}
.home-social:hover,.home-social:focus-visible{transform:translateY(-3px);box-shadow:var(--shadow)}
.home-social svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.8}
.home-social--instagram{background:radial-gradient(circle at 30% 107%,#fdf497 0%,#fd5949 45%,#d6249f 60%,#285aeb 90%)}
.home-social--facebook{background:#1877f2}
.home-social--tiktok{background:#010101;border:1px solid rgba(255,255,255,.18)}
:root[data-theme="dark"] .home-social--tiktok{border:2px solid rgba(255,255,255,.55)}
.home-social--youtube{background:#ff0000}
@media (max-width:600px){ .home-social{width:54px;height:54px} .home-social svg{width:26px;height:26px} }
.home-intro-lead{font-size:clamp(1.05rem,1.7vw,1.3rem);line-height:1.65;color:var(--ink);margin:0 auto;max-width:70ch}
.home-intro-note{font-size:.95rem;line-height:1.55;color:var(--ink-soft);margin:1.1rem auto 0;max-width:64ch;padding-top:1rem;border-top:1px solid var(--line)}
.about-disclaimer{color:var(--ink-soft);font-size:.96rem;border-top:1px solid var(--line);padding-top:1.1rem;margin-top:2rem}

.home-upcoming-list{width:100%;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:var(--shadow-sm)}
.home-upcoming-list .erow:first-child{border-top:0}
.home-upcoming-all{display:inline-flex;margin-top:1.6rem}

.ref-badge{font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:.62rem;color:#fff;background:var(--ink-faint);padding:.2rem .5rem;border-radius:5px;white-space:nowrap}
.ref-note{display:flex;gap:.85rem;align-items:flex-start;background:var(--paper-2);border:1px dashed var(--line-strong);border-radius:12px;padding:1rem 1.15rem;margin-bottom:1.2rem}
.ref-note p{margin:0;color:var(--ink-soft);font-size:.96rem;line-height:1.5}

.page-note{color:var(--ink-faint);font-size:.92rem;line-height:1.5;max-width:64ch;margin-top:.7rem;font-style:normal}

/* subtle inline countdown on calendar rows (kept muted so rows stay uncrowded) */
.cd-mini{display:inline-flex;align-items:center;gap:.28rem;font-family:var(--font-cond);font-weight:700;font-size:.72rem;letter-spacing:.01em;color:var(--ink-faint);white-space:nowrap}
.cd-mini.cd-today,.cd-mini.cd-live{color:var(--red)}
.cd-mini .cd-dot{width:6px;height:6px}
.erow-sep-cd{opacity:.6}
@media(max-width:560px){ .erow-sep-cd,.cd-mini{display:none} }
.footer-made{opacity:1}

/* ============================================================
   TEMPORADA 2027 PREVIEW — poster wall + "en construcción" tape
   ============================================================ */
.pv-kicker{display:inline-block;margin-bottom:.7rem;padding:.3rem .75rem;border-radius:999px;background:var(--blue-tint);color:var(--blue-deep);
  font-family:var(--font-cond);font-weight:700;font-size:.74rem;letter-spacing:.12em;text-transform:uppercase}
:root[data-theme="dark"] .pv-kicker{color:#9cc3ff}
.pv-tape{position:relative;overflow:hidden;margin:1.2rem 0 .4rem;transform:rotate(-1.2deg);
  background:repeating-linear-gradient(-45deg,#f5c518 0 22px,#1a1a1a 22px 44px);padding:5px 0;box-shadow:0 6px 18px rgba(0,0,0,.18)}
.pv-tape-track{display:inline-block;white-space:nowrap;background:#f5c518;color:#141414;padding:.42rem 0;width:max-content;
  font-family:var(--font-cond);font-weight:800;font-size:.86rem;letter-spacing:.14em;text-transform:uppercase;animation:pvTape 38s linear infinite}
@keyframes pvTape{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.pv-tape-track{animation:none}}
.pv-grid{max-width:var(--maxw);margin:0 auto;padding:2rem 1.4rem 5rem;display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:1.4rem;align-items:start}
.pv-card{position:relative;display:flex;flex-direction:column;border-radius:14px;overflow:hidden;background:var(--paper-2);
  border:1px solid var(--line);box-shadow:0 10px 28px rgba(0,0,0,.18);color:inherit;text-decoration:none;transition:transform .25s ease,box-shadow .25s ease}
a.pv-card:hover{transform:translateY(-4px);box-shadow:0 16px 36px rgba(0,0,0,.26)}
.pv-card img{display:block;width:100%;height:auto}   /* whole poster, square or portrait */
.pv-ribbon{position:absolute;top:26px;right:-46px;z-index:1;transform:rotate(40deg);width:180px;text-align:center;padding:.3rem 0;
  background:linear-gradient(135deg,#f5a524,#d97706);color:#1a1200;font-family:var(--font-cond);font-weight:800;font-size:.7rem;
  letter-spacing:.12em;text-transform:uppercase;box-shadow:0 2px 8px rgba(0,0,0,.3)}
.pv-info{display:flex;flex-direction:column;gap:.25rem;padding:.85rem 1rem 1rem}
.pv-name{font-family:var(--font-disp);font-weight:700;text-transform:uppercase;font-size:1.3rem;line-height:1;color:var(--ink)}
.pv-meta{font-family:var(--font-cond);font-weight:600;font-size:.88rem;letter-spacing:.02em;color:var(--ink-soft)}
.pv-card--build{justify-content:center;align-items:center;text-align:center;gap:.55rem;min-height:320px;padding:1.6rem;box-shadow:none;
  border:2px dashed var(--line);background:repeating-linear-gradient(-45deg,transparent 0 16px,rgba(245,197,24,.06) 16px 32px)}
.pv-build-ico{color:#d99a1c}
.pv-build-ico svg{width:2.2rem;height:2.2rem}
.pv-build-t{font-family:var(--font-disp);font-weight:700;text-transform:uppercase;font-size:1.35rem;color:var(--ink)}
.pv-build-s{font-size:.92rem;color:var(--ink-soft);max-width:24ch}
.view-preview{overflow-x:clip}   /* the tilted tape never causes sideways scroll */
/* several "Lo Que Se Viene" clips: numbered poster thumbs under the player */
.ev-video-frame video[style*="aspect-ratio"]{max-height:70vh;object-fit:contain}
.ev-video-picks{display:grid;grid-template-columns:repeat(4,1fr);gap:.45rem;margin-top:.6rem}
.ev-video-pick{position:relative;padding:0;border:2px solid transparent;border-radius:8px;overflow:hidden;background:#000;cursor:pointer;aspect-ratio:16/10}
.ev-video-pick img{display:block;width:100%;height:100%;object-fit:cover;opacity:.7;transition:opacity .2s}
.ev-video-pick span{position:absolute;left:5px;bottom:4px;font-family:var(--font-cond);font-weight:800;font-size:.8rem;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.8)}
.ev-video-pick:hover img,.ev-video-pick.on img{opacity:1}
.ev-video-pick.on{border-color:var(--blue)}
/* "Lo Que Se Viene" as a slideshow (photos + clips): each page keeps its own shape */
.ev-slides--teaser .ev-slides-frame{border-radius:var(--r);background:#000;border:1px solid var(--line);box-shadow:var(--shadow)}
.ev-slides--teaser .ev-slide video{display:block;width:100%;height:auto;max-height:70vh;object-fit:contain;background:#000}
.ev-slides--teaser .ev-slide-link,.ev-slides--teaser .ev-slide-link img{height:auto}
.ev-slides--teaser .ev-slides-dots{flex-wrap:wrap}
/* sponsor tile with a Facebook page: the logo link fills the tile, the badge sits in its corner */
.sponsor-tile-lb{position:absolute;inset:0;display:block}
.sponsor-fb{position:absolute;right:7px;bottom:7px;z-index:1;width:39px;height:39px;display:grid;place-items:center;border-radius:50%;
  background:#1877f2;color:#fff;box-shadow:0 2px 6px rgba(0,0,0,.35);transition:transform .15s}
.sponsor-fb svg{width:22px;height:22px}
.sponsor-fb:hover,.sponsor-fb:focus-visible{transform:scale(1.12)}
/* prizes written as text */
.ev-prizes-text strong{color:var(--ink)}
.prizes-raffle-title{margin:1rem 0 .2rem;font-weight:600;color:var(--ink)}
/* several SINPE numbers: one per row, right-aligned like the other values */
.pay-line--multi{align-items:flex-start}
.pay-multi{display:flex;flex-direction:column;gap:.3rem;text-align:right}
.pay-multi b{font-weight:600;color:var(--ink)}
.ev-gallery .ev-prizes-text{margin-top:1rem}
.ev-prizes-text > .prizes-raffle-title:first-child{margin-top:0}
.prizes-after{margin-top:.9rem;font-weight:600;color:var(--ink)}

/* ============ GRUPOS OFICIALES ============ */
.gr-wrap{max-width:var(--maxw);margin:0 auto;padding:1.6rem 1.4rem 5rem}
.gr-block + .gr-block{margin-top:2.4rem}
.gr-head{font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.04em;font-size:1.05rem;color:var(--ink);margin:0 0 1rem}
.gr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:1rem}
.gr-card{display:grid;grid-template-columns:84px 1fr;grid-template-areas:"logo body" "join join";gap:.8rem 1rem;align-items:center;
  padding:1rem;border-radius:14px;background:var(--paper-2);border:1px solid var(--line)}
.gr-logo{grid-area:logo;width:84px;height:84px;border-radius:12px;object-fit:cover;object-position:center top;background:var(--paper)}
.gr-logo--none{display:grid;place-items:center;font-family:var(--font-cond);font-weight:800;font-size:1.3rem;text-transform:uppercase;
  color:#fff;background:linear-gradient(135deg,var(--blue),var(--blue-deep))}
.gr-body{grid-area:body;min-width:0}
.gr-name{margin:0;font-family:var(--font-disp);font-weight:700;text-transform:uppercase;font-size:1.45rem;line-height:1;color:var(--ink)}
.gr-meta{margin:.3rem 0 0;font-size:.82rem;color:var(--ink-faint);line-height:1.35}
.gr-join{grid-area:join;display:flex;align-items:center;justify-content:center;gap:.45rem;min-height:44px;border-radius:10px;
  background:#25d366;color:#06311b;font-family:var(--font-cond);font-weight:700;text-transform:uppercase;letter-spacing:.03em;font-size:.88rem;transition:background .16s}
.gr-join:hover{background:#1fbf5b}
.gr-join .ico-wa{width:18px;height:18px;fill:currentColor;stroke:none;flex:none}
.gr-empty{text-align:center}
/* the search hides cards with [hidden]; their display:grid would otherwise win over it */
.gr-card[hidden],.gr-block[hidden],.gr-empty[hidden]{display:none}
@media (max-width:420px){ .gr-grid{grid-template-columns:1fr} }

/* ============ AFICHES: buttons on the poster (Grupo oficial · directions · share) ============
   The poster card is one link, so the bar is a sibling laid over the card's dark lower
   scrim; the card's overlay text gets room above it. The lift-on-hover moves to the item so
   card and buttons travel together. */
.ei-item{position:relative;min-width:0;container-type:inline-size;transition:transform .28s}
.ei-item:hover{transform:translateY(-5px)}
.ei-item .ei-card:hover{transform:none}
.ei-item:has(.map-menu[open]){z-index:30}
.ei-item .ei-overlay{padding-bottom:3.5rem}
.ei-actions{position:absolute;left:.85rem;right:.85rem;bottom:.85rem;z-index:4;display:flex;align-items:center;gap:.4rem}
.ei-actions .ev-group{min-height:2rem;font-size:.7rem;padding:.3rem .65rem;border-radius:6px;box-shadow:0 2px 10px rgba(0,0,0,.35)}
.ei-actions .map-menu-icon{min-height:2rem;background:rgba(255,255,255,.94);color:#0c1116;border-color:transparent;box-shadow:0 2px 10px rgba(0,0,0,.35)}
.ei-actions .ei-share{margin-left:auto;min-height:2rem;padding:.35rem .75rem;gap:.35rem;font-size:.7rem;
  background:rgba(255,255,255,.94);color:#0c1116;border-color:transparent;box-shadow:0 2px 10px rgba(0,0,0,.35)}
.ei-actions .ei-share svg{width:14px;height:14px}
.ei-actions .ei-share:hover{background:var(--blue);color:#fff}
.ei-actions .map-menu summary:hover,.ei-actions .map-menu[open] summary{background:#fff;color:#0c1116;filter:brightness(.92)}
/* "Compartir" always keeps its word; on narrow cards the WhatsApp group button shrinks to its icon instead */
@container (max-width:350px){ .ei-actions .ev-group-label{display:none} .ei-actions .ev-group{padding:.3rem .5rem} }
/* very narrow cards with social buttons: the bar wraps to two rows and the card text makes room */
@container (max-width:320px){
  .ei-item:has(.ei-soc) .ei-overlay{padding-bottom:6rem}
  .ei-actions:has(.ei-soc){flex-wrap:wrap}
}
/* event Instagram / Facebook: compact buttons in each network's own colors, between the group and the map button */
.ei-actions .ei-soc{flex:none;width:2rem;height:2rem;display:grid;place-items:center;border-radius:6px;color:#fff;
  box-shadow:0 2px 10px rgba(0,0,0,.35);transition:filter .2s}
.ei-actions .ei-soc svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.9}
.ei-actions .ei-soc.instagram{background:radial-gradient(circle at 30% 107%,#fdf497 0,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285aeb 90%)}
.ei-actions .ei-soc.facebook{background:#1877f2}
.ei-actions .ei-soc:hover{filter:brightness(1.12) saturate(1.1)}
/* sponsor tile badge to Instagram / TikTok / Google Maps (sponsorLinks) */
.sponsor-link{position:absolute;right:7px;bottom:7px;z-index:1;width:34px;height:34px;display:grid;place-items:center;border-radius:50%;
  color:#fff;box-shadow:0 2px 6px rgba(0,0,0,.35);transition:transform .15s}
.sponsor-link svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2}
.sponsor-link--instagram{background:linear-gradient(45deg,#f58529,#dd2a7b 55%,#8134af)}
.sponsor-link--tiktok{background:#111}
.sponsor-link--map{background:#1a73e8}
.sponsor-link:hover,.sponsor-link:focus-visible{transform:scale(1.12)}
/* gallery photo with a caption (name + what it offers) */
.ev-gallery-fig{margin:0;display:flex;flex-direction:column;gap:.45rem}
.ev-gallery-fig figcaption{display:flex;flex-direction:column;gap:.1rem;font-size:.92rem;line-height:1.3}
.ev-gallery-fig figcaption b{color:var(--ink)}
.ev-gallery-fig figcaption span{color:var(--ink-faint)}
/* "Hospedaje y Lugares Cerca" link list */
.nearby-list{list-style:none;margin:.4rem 0 0;padding:0;display:grid;gap:.6rem}
.nearby-item{display:flex;align-items:center;gap:.8rem;padding:.75rem .9rem;border:1px solid var(--line);border-radius:10px;
  background:var(--paper);box-shadow:var(--shadow-sm);color:inherit;text-decoration:none;transition:border-color .2s}
.nearby-item:hover,.nearby-item:focus-visible{border-color:var(--blue)}
.nearby-ico{flex:none;width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:var(--blue);color:#fff}
.nearby-ico svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2}
.nearby-img{flex:none;width:96px;height:96px;border-radius:10px;object-fit:cover;background:var(--line)}
.nearby-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:.1rem;line-height:1.3}
.nearby-text b{color:var(--ink)}
.nearby-text span{color:var(--ink-faint);font-size:.9rem}
.nearby-go{flex:none;width:18px;height:18px;fill:none;stroke:var(--ink-faint);stroke-width:2}
/* sponsors without a logo but with a link badge: the name scales with its tile so a big tile doesn't look empty */
.sponsor-tile--text:has(.sponsor-link){font-size:clamp(.72rem,4.2cqw,1.5rem);padding:.6rem .6rem 2.6rem}
/* captioned business photos stay two per row on phones (the captions carry the names) */
@media(max-width:520px){.ev-gallery--places .ev-gallery-grid:has(.ev-gallery-fig){grid-template-columns:repeat(2,minmax(0,1fr))}}
/* phones: long WhatsApp contact labels ("Enviar comprobante — María Aragón López") wrap to a
   second line instead of pushing the page wider than the screen */
@media(max-width:520px){.detail-cta--wa .btn{white-space:normal;text-align:left;line-height:1.25}}

/* registration deadline banner (deadline in EVENT_PAGE_EXTRAS): orange race-plate look with
   a calendar tile and a countdown pill; same colours in light and dark theme */
.deadline-banner{position:relative;overflow:hidden;display:flex;align-items:center;gap:.8rem;margin:.6rem 0 .8rem;
  padding:.75rem .85rem;border-radius:12px;color:#1b0d02;
  background:repeating-linear-gradient(-45deg,rgba(255,255,255,.09) 0 10px,transparent 10px 20px),linear-gradient(120deg,#ffb020,#ff6a13 60%,#f0440f);
  box-shadow:0 10px 24px -14px rgba(240,68,15,.75),inset 0 0 0 1px rgba(255,255,255,.25)}
.deadline-cal{flex:none;width:52px;border-radius:8px;overflow:hidden;background:#fff;text-align:center;line-height:1;
  box-shadow:0 4px 10px -4px rgba(0,0,0,.45)}
.deadline-cal b{display:block;padding:.22rem 0;background:#14181d;color:#fff;font:700 .68rem/1 var(--font-cond);letter-spacing:.12em;text-transform:uppercase}
.deadline-cal i{display:block;padding:.28rem 0 .32rem;font:900 1.55rem/1 var(--font-disp);font-style:normal;color:#14181d}
.deadline-text{flex:1;min-width:0;display:grid;gap:.12rem}
.deadline-label{font:700 .7rem/1.25 var(--font-cond);letter-spacing:.09em;text-transform:uppercase}
.deadline-date{font:900 clamp(1.25rem,4.2vw,1.6rem)/1 var(--font-disp);text-transform:uppercase;letter-spacing:.02em}
.deadline-pill{justify-self:start;margin-top:.3rem;padding:.32rem .6rem;border-radius:999px;background:#14181d;color:#fff;
  font:700 .74rem/1 var(--font-cond);letter-spacing:.04em;white-space:nowrap}
.deadline-banner.is-urgent .deadline-pill{background:#c0100a;animation:deadline-pulse 1.4s ease-in-out infinite}
.deadline-banner.is-closed{filter:grayscale(1);opacity:.75}
@keyframes deadline-pulse{50%{transform:scale(1.07)}}
@media (prefers-reduced-motion:reduce){.deadline-banner.is-urgent .deadline-pill{animation:none}}

/* ============ ALLIES (home) + SERIART STRIP (shirt cards) ============
   Seriart, Enduro Army's shirt ally. Its logo is neon cyan/magenta, so both
   blocks sit on their own dark, glowing panel in light and dark theme alike. */
.allies{padding-top:1rem;padding-bottom:1rem}
.ally-card{position:relative;overflow:hidden;display:grid;grid-template-columns:.85fr 1.15fr;gap:2.4rem;align-items:center;
  padding:2.6rem;border-radius:18px;color:#eef2f6;
  background:radial-gradient(60% 80% at 0% 0%,rgba(25,211,255,.22),transparent 70%),
             radial-gradient(60% 80% at 100% 100%,rgba(214,60,255,.24),transparent 70%),#0b0f19;
  box-shadow:0 26px 56px -30px rgba(120,60,255,.7),inset 0 0 0 1px rgba(255,255,255,.08)}
.ally-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:linear-gradient(#19d3ff,#d63cff)}
.ally-logo img{display:block;width:100%;max-width:420px;height:auto;margin:0 auto;filter:drop-shadow(0 12px 30px rgba(25,211,255,.25))}
.ally-copy .section-title{color:#fff;margin-top:.2rem}
.ally-copy .section-title .ital{background:linear-gradient(90deg,#19d3ff,#d63cff);-webkit-background-clip:text;background-clip:text;color:transparent}
.ally-kicker{color:#19d3ff}
.ally-copy>p{color:#c9d3df;line-height:1.6;margin:.6rem 0 1rem}
.ally-points{list-style:none;margin:0 0 1.4rem;padding:0;display:grid;gap:.55rem}
.ally-points li{position:relative;padding-left:1.6rem;color:#c9d3df;line-height:1.45}
.ally-points li::before{content:"";position:absolute;left:0;top:.42em;width:.8rem;height:.8rem;border-radius:3px;
  background:linear-gradient(135deg,#19d3ff,#d63cff);transform:rotate(45deg) scale(.75)}
.ally-points b{color:#fff}
.ally-org{margin:0 0 1.2rem;padding:.85rem 1rem;border-radius:12px;background:rgba(255,255,255,.06);box-shadow:inset 3px 0 0 #19d3ff;color:#c9d3df;line-height:1.5}
.ally-org b{color:#fff}
@media (max-width:820px){
  .ally-card{grid-template-columns:1fr;gap:1.2rem;padding:1.8rem 1.3rem 2rem;text-align:left}
  .ally-logo img{max-width:300px}
}

.seriart-strip{display:flex;align-items:center;gap:.85rem;margin:.1rem 0 .85rem;padding:.75rem .85rem;border-radius:12px;color:#eef2f6;
  background:radial-gradient(80% 140% at 0% 0%,rgba(25,211,255,.2),transparent 70%),
             radial-gradient(80% 140% at 100% 100%,rgba(214,60,255,.22),transparent 70%),#0b0f19;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.seriart-strip img{flex:none;width:150px;height:auto;filter:drop-shadow(0 4px 12px rgba(25,211,255,.3))}
.seriart-strip{flex-wrap:wrap;justify-content:center}
.seriart-strip-copy{flex:1 1 200px;min-width:0;display:grid;gap:.18rem}
.seriart-strip-kicker{font:700 .68rem/1.2 var(--font-cond);letter-spacing:.1em;text-transform:uppercase;color:#19d3ff}
.seriart-strip-text{font-size:.84rem;line-height:1.35;color:#d7dee7}

/* finished events: big checkered flag where the Info button was (row no longer opens the event page) */
.erow-finish{display:inline-flex;align-items:center;gap:.45rem;padding:.2rem .7rem .2rem .35rem;border-radius:999px;
  background:var(--paper-3);box-shadow:inset 0 0 0 1px var(--line);color:var(--ink)}
.erow-finish .cflag{width:2.5rem;height:auto;display:block;filter:drop-shadow(0 2px 3px rgba(0,0,0,.35))}
.erow-finish b{font:800 .78rem/1 var(--font-cond);letter-spacing:.1em;text-transform:uppercase}
.erow.is-done{cursor:default}