@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,300;12..96,400;12..96,500;12..96,600;12..96,700;12..96,800&family=Inter:wght@300;400;500;600;700&display=swap');

.index-page,
.pj-page,
.rc-page,
.crear-perfil-page,
.legal-page,
.noticia-detalle-page {
  --dch-bg: #0a0d12;
  --dch-bg-2: #11151c;
  --dch-paper: #f5f2ec;
  --dch-paper-2: #ebe6dc;
  --dch-ink: #0a0d12;
  --dch-ink-2: #1c2027;
  --dch-fg: #f6f4ef;
  --dch-muted: rgba(246, 244, 239, .78);
  --dch-muted-ink: rgba(10, 13, 18, .72);
  --dch-line: rgba(246, 244, 239, .12);
  --dch-line-ink: rgba(10, 13, 18, .12);
  --dch-accent: #2CB037;
  --dch-accent-soft: #5bcf67;
  --dch-accent-2: #1a7a24;
  --dch-display: 'Bricolage Grotesque', 'Questrial', sans-serif;
  --dch-text: 'Inter', 'Noto Sans', system-ui, sans-serif;
  --dch-radius: 22px;
  --dch-radius-sm: 12px;
  --ease: cubic-bezier(.22, .8, .26, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --shadow-1: 0 1px 2px rgba(0, 0, 0, .04), 0 8px 24px rgba(0, 0, 0, .06);
  --shadow-2: 0 2px 4px rgba(0, 0, 0, .05), 0 30px 60px -20px rgba(0, 0, 0, .25);
}

.index-page {
  background: var(--dch-paper);
  color: var(--dch-ink);
  font-family: var(--dch-text);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.index-page .main { overflow: hidden; }

/* Container util scoped */
.index-page .dch-wrap {
  width: 100%;
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 28px;
}
@media (max-width: 720px) { .index-page .dch-wrap { padding: 0 20px; } }

/* =====================================================
   HEADER — Home: tipografía refinada, diseño igual al resto
   ===================================================== */
/* Header fijo sobre el hero — no empuja el contenido hacia abajo */
.index-page #header {
  position: fixed;
  top: 0; left: 0; right: 0;
  width: 100%;
  background-color: transparent;
  box-shadow: none;
  transition: background-color .35s ease, box-shadow .35s ease;
  z-index: 997;
}

.index-page #header .sitename {
  font-family: var(--dch-display);
  letter-spacing: -.02em;
  font-weight: 600;
}
.index-page #navmenu a,
.pj-page #navmenu a,
.rc-page #navmenu a,
.crear-perfil-page #navmenu a,
.legal-page #navmenu a,
.noticia-detalle-page #navmenu a {
  font-family: var(--dch-text);
  font-weight: 500;
  letter-spacing: 0;
  font-size: 14.5px;
  position: relative;
}

/* Fondo del header (área exterior al pill) transparente al hacer scroll en páginas interiores */
.pj-page.scrolled .header,
.rc-page.scrolled .header,
.crear-perfil-page.scrolled .header,
.legal-page.scrolled .header,
.noticia-detalle-page.scrolled .header {
  background-color: transparent;
  box-shadow: none;
}

/* =====================================================
   1. HERO
   ===================================================== */
/* =====================================================
   1. HERO — Full-bleed editorial image
   Imagen principal: assets/img/hero-bg.webp
   (mientras no exista la imagen, usa assets/img/sports/3.jpg como fallback)
   ===================================================== */
.index-page .dch-hero {
  position: relative;
  min-height: 100svh;
  background: #0c1008; /* fallback mientras carga la imagen */
  color: #fff;
  overflow: hidden;
  isolation: isolate;
  display: flex;
  align-items: flex-end;
  padding: 0;
}

/* Línea accent verde en la base del hero */
.index-page .dch-hero::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent 0%, rgba(44,176,55,.45) 30%, rgba(44,176,55,.2) 70%, transparent 100%);
  z-index: 5;
}

/* ── Background layers ── */
.dch-hero__bg {
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
}

/* VÍDEO DE FONDO — loop sin sonido, optimizado para autoplay */
.dch-hero__vid {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center 30%;
  /* Fade-in suave al cargar */
  opacity: 0;
  animation: hero-vid-fadein 1.2s cubic-bezier(.16, 1, .3, 1) .1s forwards;
  will-change: opacity;
  /* Evitar destellos blancos en algunos navegadores */
  background: #0c1008;
}
@keyframes hero-vid-fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}
/* Fallback: si el vídeo no carga, mostrar el frame del video como imagen estática */
.index-page .dch-hero { background-image: url('../img/sports/3.jpg'); background-size: cover; background-position: center 30%; }

/* OVERLAY para legibilidad del texto */
.dch-hero__overlay {
  position: absolute; inset: 0;
  background:
    /* oscuridad progresiva desde abajo — zona de texto */
    linear-gradient(
      to top,
      rgba(4, 7, 4, .92)  0%,
      rgba(4, 7, 4, .68)  30%,
      rgba(4, 7, 4, .30)  60%,
      rgba(4, 7, 4, .08)  100%
    ),
    /* viñeta lateral izquierda */
    linear-gradient(
      to right,
      rgba(4, 7, 4, .50)  0%,
      transparent         55%
    ),
    /* toque verde institucional en la base */
    linear-gradient(
      to top,
      rgba(44, 176, 55, .12) 0%,
      transparent            40%
    );
  z-index: 1;
}

/* GRAIN — textura de película muy sutil */
.dch-hero__grain {
  position: absolute; inset: 0;
  opacity: .04; mix-blend-mode: screen; z-index: 2; pointer-events: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)' opacity='.6'/></svg>");
  animation: grain 12s steps(10) infinite;
}
@keyframes grain {
  0%, 100% { transform: translate(0, 0); }
  10%       { transform: translate(-3%, -2%); }
  30%       { transform: translate(2%, -4%); }
  50%       { transform: translate(-1%, 3%); }
  70%       { transform: translate(3%, 2%); }
  90%       { transform: translate(-2%, 1%); }
}

/* ── Inner layout ── */
.dch-hero__inner {
  position: relative; z-index: 3;
  width: 100%; max-width: 1320px; margin: 0 auto;
  padding: 160px 60px 100px;
  min-height: 100svh;
  display: flex;
  align-items: flex-end;
}
@media (max-width: 1024px) {
  .dch-hero__inner { padding: 140px 40px 90px; }
}
@media (max-width: 720px) {
  .index-page .dch-hero { align-items: center; }
  .dch-hero__inner { padding: 120px 20px 80px; align-items: center; }
}

/* ── Content block ── */
.dch-hero__content { max-width: 700px; }

/* EYEBROW */
.dch-hero__eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
  color: rgba(255, 255, 255, .7);
  margin-bottom: 30px;
  opacity: 0; transform: translateY(14px);
  transition: opacity .6s cubic-bezier(.16,1,.3,1), transform .6s cubic-bezier(.16,1,.3,1);
}
.dch-hero.is-revealed .dch-hero__eyebrow { opacity: 1; transform: translateY(0); transition-delay: 0s; }

/* Live dot */
.dch-live-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: #3de07a;
  box-shadow: 0 0 0 3px rgba(61, 224, 122, .22);
  animation: pulse-live 2.2s ease infinite;
  flex-shrink: 0;
}
@keyframes pulse-live {
  0%, 100% { box-shadow: 0 0 0 3px rgba(61, 224, 122, .22); }
  50%       { box-shadow: 0 0 0 8px rgba(61, 224, 122, .04); }
}

/* TITULAR */
.dch-hero__heading {
  font-family: var(--dch-display);
  font-weight: 700;
  font-size: clamp(3.2rem, 7.5vw, 6.8rem);
  line-height: 1.0;
  letter-spacing: -.04em;
  margin: 0 0 30px;
  color: #fff;
}
.dch-hero__heading .line { display: block; overflow: hidden; }
.dch-hero__heading .line > span {
  display: block;
  transform: translateY(110%);
  transition: transform 1.05s cubic-bezier(.16, 1, .3, 1);
  will-change: transform;
}
.dch-hero__heading .line > span em {
  font-style: normal;
  background: linear-gradient(110deg, #2CB037 0%, #5bcf67 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.dch-hero.is-revealed .dch-hero__heading .line > span { transform: translateY(0); }
.dch-hero.is-revealed .dch-hero__heading .line:nth-child(1) > span { transition-delay: .10s; }
.dch-hero.is-revealed .dch-hero__heading .line:nth-child(2) > span { transition-delay: .22s; }

/* SUBTEXTO */
.dch-hero__sub {
  font-size: clamp(1rem, 2vw, 1.15rem);
  line-height: 1.58;
  color: rgba(255, 255, 255, .68);
  max-width: 540px;
  margin: 0 0 44px;
  opacity: 0; transform: translateY(18px);
  transition: opacity .8s cubic-bezier(.16,1,.3,1) .42s,
              transform .8s cubic-bezier(.16,1,.3,1) .42s;
}
.dch-hero.is-revealed .dch-hero__sub { opacity: 1; transform: translateY(0); }

/* ACCIONES — botones CTA */
.dch-hero__actions {
  display: flex; flex-wrap: wrap; gap: 14px; align-items: center;
  margin-bottom: 40px;
  opacity: 0; transform: translateY(20px);
  transition: opacity .8s cubic-bezier(.16,1,.3,1) .56s,
              transform .8s cubic-bezier(.16,1,.3,1) .56s;
}
.dch-hero.is-revealed .dch-hero__actions { opacity: 1; transform: translateY(0); }

.dch-hero__btn {
  display: inline-flex; align-items: center; gap: 9px;
  font-family: var(--dch-text); font-size: 15px; font-weight: 600;
  padding: 14px 28px; border-radius: 999px;
  text-decoration: none; cursor: pointer; border: none;
  transition: transform .35s cubic-bezier(.22,.8,.26,1),
              box-shadow .35s cubic-bezier(.22,.8,.26,1),
              background .35s cubic-bezier(.22,.8,.26,1),
              border-color .35s cubic-bezier(.22,.8,.26,1);
}
.dch-hero__btn i { transition: transform .35s cubic-bezier(.22,.8,.26,1); }
.dch-hero__btn:hover i { transform: translateX(4px); }

.dch-hero__btn--primary {
  background: var(--dch-accent, #2CB037); color: #fff;
  box-shadow: 0 4px 24px rgba(44, 176, 55, .35);
}
.dch-hero__btn--primary:hover {
  background: #22902f; color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 10px 40px rgba(44, 176, 55, .5);
}

.dch-hero__btn--ghost {
  background: rgba(255, 255, 255, .12); color: rgba(255, 255, 255, .92);
  border: 1px solid rgba(255, 255, 255, .28);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
}
.dch-hero__btn--ghost:hover {
  background: rgba(255, 255, 255, .22); color: #fff;
  border-color: rgba(255, 255, 255, .45);
  transform: translateY(-2px);
}

/* TRUST STRIP — avatares + texto */
.dch-hero__trust {
  display: flex; align-items: center; gap: 12px;
  opacity: 0; transform: translateY(16px);
  transition: opacity .8s cubic-bezier(.16,1,.3,1) .70s,
              transform .8s cubic-bezier(.16,1,.3,1) .70s;
}
.dch-hero.is-revealed .dch-hero__trust { opacity: 1; transform: translateY(0); }

.dch-hero__trust-avatars { display: flex; }
.dch-hero__trust-avatars img {
  width: 34px; height: 34px; border-radius: 50%;
  border: 2.5px solid rgba(255, 255, 255, .4);
  object-fit: cover;
  margin-left: -10px;
}
.dch-hero__trust-avatars img:first-child { margin-left: 0; }
.dch-hero__trust span {
  font-size: 13px; color: rgba(255, 255, 255, .62); font-weight: 500;
}

/* ── Scroll indicator ── */
.dch-hero__scroll {
  position: absolute; bottom: 28px; left: 50%; transform: translateX(-50%);
  font-size: 11px; letter-spacing: .2em; text-transform: uppercase;
  color: rgba(255, 255, 255, .38);
  display: flex; align-items: center; gap: 10px;
  z-index: 4;
}
.dch-hero__scroll span {
  width: 1px; height: 32px; background: rgba(255, 255, 255, .2);
  position: relative; overflow: hidden;
}
.dch-hero__scroll span::after {
  content: ''; position: absolute; left: 0; top: -32px; width: 100%; height: 32px;
  background: #2CB037; animation: scrollLine 1.8s cubic-bezier(.22,.8,.26,1) infinite;
}
@keyframes scrollLine {
  0%   { top: -32px; }
  100% { top: 32px; }
}

/* ── Responsive ── */
@media (max-width: 640px) {
  .dch-hero__heading { font-size: clamp(2.8rem, 10.5vw, 3.6rem); }
  .dch-hero__actions { flex-direction: column; align-items: stretch; }
  .dch-hero__btn { justify-content: center; padding: 15px 28px; }
  .dch-hero__content { max-width: 100%; }
}

/* ── Reduce motion ── */
@media (prefers-reduced-motion: reduce) {
  /* Pausar el vídeo con CSS (JS también pausa, pero CSS es inmediato) */
  .dch-hero__vid       { animation: none; opacity: 1; }
  .dch-live-dot        { animation: none; }
  .dch-hero__grain     { animation: none; }
  .dch-hero__scroll span::after { animation: none; }
  .dch-hero__heading .line > span,
  .dch-hero__eyebrow,
  .dch-hero__sub,
  .dch-hero__actions,
  .dch-hero__trust { transition: none; transform: none; opacity: 1; }
}

/* =====================================================
   2. SECTION SYSTEM (heads, paddings, reveal)
   ===================================================== */
.index-page .dch-section {
  padding: 120px 0;
  position: relative;
}
@media (max-width: 720px) { .index-page .dch-section { padding: 80px 0; } }

.dch-section--ink { background: var(--dch-ink); color: var(--dch-fg); }
.dch-section--paper { background: var(--dch-paper); }
.dch-section--paper-2 { background: var(--dch-paper-2); }

.dch-section-head {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 32px;
  margin-bottom: 60px;
}
.dch-section-head--center { justify-content: center; text-align: center; flex-direction: column; align-items: center; }
.dch-section-head h2 {
  font-family: var(--dch-display); font-weight: 500;
  font-size: clamp(2rem, 4.5vw, 3.6rem);
  line-height: 1; letter-spacing: -.03em;
  margin: 12px 0 0; color: inherit;
  max-width: 18ch;
}
.dch-section--ink .dch-section-head h2 { color: var(--dch-fg); }
.dch-section-head p {
  margin: 14px 0 0; max-width: 46ch; color: var(--dch-muted-ink);
  font-size: 1.02rem; line-height: 1.55;
}
.dch-section--ink .dch-section-head p { color: var(--dch-muted); }

.dch-tag {
  font-size: 11.5px; letter-spacing: .22em; text-transform: uppercase;
  font-weight: 600; color: var(--dch-accent);
  display: inline-flex; align-items: center; gap: 8px;
}
.dch-tag::before {
  content: ''; width: 24px; height: 1px; background: var(--dch-accent);
}

.dch-link-arrow {
  display: inline-flex; align-items: center; gap: 12px;
  color: inherit; text-decoration: none;
  font-weight: 500; font-size: 14.5px;
  border-bottom: 1px solid currentColor;
  padding-bottom: 4px;
  transition: gap .35s var(--ease), color .35s var(--ease);
}
.dch-link-arrow span {
  width: 22px; height: 1px; background: currentColor; position: relative; transition: width .35s var(--ease);
}
.dch-link-arrow span::after {
  content: ''; position: absolute; right: 0; top: -3px;
  width: 8px; height: 8px; border-top: 1px solid currentColor; border-right: 1px solid currentColor;
  transform: rotate(45deg);
}
.dch-link-arrow:hover { color: var(--dch-accent); gap: 18px; }
.dch-link-arrow:hover span { width: 32px; }

/* Reveal scroll system */
[data-reveal] { opacity: 0; transform: translateY(40px); transition: opacity 1s var(--ease-out), transform 1s var(--ease-out); }
[data-reveal].is-in { opacity: 1; transform: translateY(0); }
[data-reveal-children] > * { opacity: 0; transform: translateY(28px); transition: opacity .9s var(--ease-out), transform .9s var(--ease-out); }
[data-reveal-children].is-in > * { opacity: 1; transform: translateY(0); }
[data-reveal-children].is-in > *:nth-child(1) { transition-delay: .05s; }
[data-reveal-children].is-in > *:nth-child(2) { transition-delay: .12s; }
[data-reveal-children].is-in > *:nth-child(3) { transition-delay: .19s; }
[data-reveal-children].is-in > *:nth-child(4) { transition-delay: .26s; }
[data-reveal-children].is-in > *:nth-child(5) { transition-delay: .33s; }
[data-reveal-children].is-in > *:nth-child(6) { transition-delay: .40s; }
[data-reveal-children].is-in > *:nth-child(7) { transition-delay: .47s; }
[data-reveal-children].is-in > *:nth-child(8) { transition-delay: .54s; }

/* =====================================================
   2b. INTRODUCCIÓN — Qué es DeporteConecta
   ===================================================== */
.dch-intro {
  background: var(--dch-paper);
  border-bottom: 1px solid var(--dch-line-ink);
  overflow: hidden;
}

/* ---- Bloque superior: split ---- */
.dch-intro__top { padding: 100px 0 80px; }
@media (max-width: 768px) { .dch-intro__top { padding: 72px 0 56px; } }

.dch-intro__split {
  display: grid;
  grid-template-columns: 1fr 1.05fr;
  gap: 72px;
  align-items: center;
}
@media (max-width: 1024px) {
  .dch-intro__split { grid-template-columns: 1fr; gap: 56px; }
}

/* Texto */
.dch-intro__heading {
  font-family: var(--dch-display);
  font-size: clamp(2.2rem, 4.5vw, 3.6rem);
  font-weight: 700;
  line-height: 1.06;
  letter-spacing: -.04em;
  color: var(--dch-ink);
  margin: 16px 0 0;
  max-width: 15ch;
}
.dch-intro__heading em {
  font-style: normal;
  background: linear-gradient(110deg, var(--dch-accent) 0%, #5bcf67 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.dch-intro__sub {
  margin: 24px 0 0;
  font-size: 1.04rem;
  line-height: 1.65;
  color: rgba(10,13,18,.58);
  max-width: 44ch;
}

/* Avatar stack + proof */
.dch-intro__proof {
  display: flex;
  align-items: center;
  gap: 0;
  margin-top: 32px;
}
.dch-intro__avatars { display: flex; }
.dch-intro__avatars img {
  width: 38px; height: 38px;
  border-radius: 50%;
  border: 2px solid var(--dch-paper);
  object-fit: cover;
  margin-right: -10px;
  box-shadow: 0 2px 8px rgba(10,13,18,.14);
}
.dch-intro__proof p {
  margin: 0;
  font-size: 13px;
  font-weight: 500;
  color: rgba(10,13,18,.52);
  padding-left: 20px;
}

.dch-intro__cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 36px;
  font-family: var(--dch-text);
  font-size: 14.5px;
  font-weight: 600;
  color: var(--dch-accent);
  text-decoration: none;
  border-bottom: 1px solid rgba(44,176,55,.25);
  padding-bottom: 5px;
  transition: gap .3s var(--ease), border-color .3s var(--ease);
}
.dch-intro__cta:hover { gap: 16px; border-color: var(--dch-accent); }
.dch-intro__cta i { font-size: 1rem; }

/* Visual */
.dch-intro__visual { position: relative; }
.dch-intro__img-wrap {
  position: relative;
  margin: 0;
  border-radius: 28px;
}
.dch-intro__img {
  width: 100%;
  height: 540px;
  object-fit: cover;
  border-radius: 28px;
  display: block;
  box-shadow: 0 32px 80px rgba(10,13,18,.18);
}
.dch-intro__img-overlay {
  position: absolute;
  inset: 0;
  border-radius: 28px;
  background: linear-gradient(
    160deg,
    rgba(44,176,55,.18) 0%,
    transparent 45%,
    rgba(10,13,18,.28) 100%
  );
  pointer-events: none;
}
@media (max-width: 1024px) { .dch-intro__img { height: 420px; } }
@media (max-width: 600px) { .dch-intro__img { height: 280px; border-radius: 18px; } }

/* Chips flotantes */
.dch-intro__chip {
  position: absolute;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255,255,255,.95);
  border-radius: 16px;
  padding: 14px 20px;
  box-shadow: 0 8px 32px rgba(10,13,18,.13), 0 2px 8px rgba(10,13,18,.07);
  display: flex;
  align-items: center;
  gap: 10px;
}
.dch-intro__chip--clubs {
  bottom: -20px;
  left: -24px;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  animation: chip-float 5s ease-in-out infinite;
}
.dch-intro__chip--clubs strong {
  font-family: var(--dch-display);
  font-size: 1.65rem;
  font-weight: 700;
  letter-spacing: -.04em;
  color: var(--dch-ink);
  line-height: 1;
}
.dch-intro__chip--clubs span {
  font-size: 11px;
  color: rgba(10,13,18,.48);
  text-transform: uppercase;
  letter-spacing: .14em;
  font-weight: 600;
}
.dch-intro__chip--map {
  top: 28px;
  right: -20px;
  animation: chip-float 5s ease-in-out infinite;
  animation-delay: 1.6s;
}
.dch-intro__chip--map i { color: var(--dch-accent); font-size: 1.05rem; }
.dch-intro__chip--map span { font-size: 13px; font-weight: 600; color: var(--dch-ink); }
.dch-intro__chip--sports {
  bottom: 112px;
  right: -20px;
  animation: chip-float 5s ease-in-out infinite;
  animation-delay: 3s;
}
.dch-intro__chip--sports i { color: #f59e0b; font-size: 1.05rem; }
.dch-intro__chip--sports span { font-size: 13px; font-weight: 600; color: var(--dch-ink); }

@keyframes chip-float {
  0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(-9px); }
}

@media (max-width: 600px) { .dch-intro__chip { display: none; } }

/* ---- Feature rows ---- */
.dch-intro__features { border-top: 1px solid var(--dch-line-ink); }

.dch-intro__row {
  display: grid;
  grid-template-columns: 52px 52px 1fr auto;
  gap: 0 28px;
  align-items: center;
  padding: 28px 0;
  border-bottom: 1px solid var(--dch-line-ink);
  position: relative;
  cursor: default;
  transition: background .4s var(--ease), padding-left .45s var(--ease);
}
.dch-intro__row::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 0;
  background: var(--dch-accent);
  transition: width .45s var(--ease);
  border-radius: 0 4px 4px 0;
}
.dch-intro__row:hover::before { width: 4px; }
.dch-intro__row:hover {
  background: rgba(44,176,55,.025);
  padding-left: 20px;
}

.dch-intro__row-num {
  font-family: var(--dch-display);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .18em;
  color: rgba(10,13,18,.28);
  text-transform: uppercase;
  user-select: none;
}

.dch-intro__row-icon {
  width: 48px; height: 48px;
  border-radius: 14px;
  background: rgba(44,176,55,.07);
  display: flex; align-items: center; justify-content: center;
  color: var(--dch-accent);
  font-size: 1.15rem;
  flex-shrink: 0;
  transition: background .35s var(--ease), color .35s var(--ease), transform .4s var(--ease);
}
.dch-intro__row:hover .dch-intro__row-icon {
  background: var(--dch-accent);
  color: #fff;
  transform: rotate(-6deg) scale(1.1);
}

.dch-intro__row-body h3 {
  font-family: var(--dch-display);
  font-size: 1.08rem;
  font-weight: 600;
  color: var(--dch-ink);
  margin: 0 0 5px;
  letter-spacing: -.02em;
  transition: color .3s var(--ease);
}
.dch-intro__row:hover .dch-intro__row-body h3 { color: var(--dch-accent); }
.dch-intro__row-body p {
  font-size: 13.5px;
  line-height: 1.6;
  color: rgba(10,13,18,.5);
  margin: 0;
  max-width: 58ch;
}

.dch-intro__row-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  color: rgba(10,13,18,.3);
  text-decoration: none;
  white-space: nowrap;
  flex-shrink: 0;
  transition: color .3s var(--ease), gap .3s var(--ease);
}
.dch-intro__row:hover .dch-intro__row-link {
  color: var(--dch-accent);
  gap: 14px;
}

@media (max-width: 860px) {
  .dch-intro__row {
    grid-template-columns: 40px 44px 1fr;
    gap: 0 20px;
  }
  .dch-intro__row-link { display: none; }
}
@media (max-width: 560px) {
  .dch-intro__row { grid-template-columns: 36px 1fr; }
  .dch-intro__row-icon { display: none; }
  .dch-intro__row-body { grid-column: 2; }
}

/* ---- Trust strip ---- */
.dch-intro__trust {
  padding: 22px 0;
}
.dch-intro__trust ul {
  list-style: none;
  padding: 0; margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 12px 32px;
  justify-content: center;
}
.dch-intro__trust li {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 500;
  color: rgba(10,13,18,.58);
}
.dch-intro__trust li i { color: var(--dch-accent); font-size: .9rem; }

/* =====================================================
   3. STAT BAND (oversized magazine)
   ===================================================== */
.dch-stats { background: var(--dch-paper); border-bottom: 1px solid var(--dch-line-ink); }
.dch-stats__inner {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 0;
}
.dch-stat {
  padding: 28px 24px; position: relative;
  display: flex; flex-direction: column; gap: 10px;
}
.dch-stat + .dch-stat { border-left: 1px solid var(--dch-line-ink); }
.dch-stat small {
  font-size: 10.5px; letter-spacing: .2em; text-transform: uppercase;
  color: var(--dch-muted-ink); font-weight: 600;
}
.dch-stat strong {
  font-family: var(--dch-display); font-weight: 500;
  font-size: clamp(2.4rem, 5vw, 4rem); line-height: 1;
  letter-spacing: -.04em; color: var(--dch-ink);
}
.dch-stat span { color: var(--dch-muted-ink); font-size: 14px; }
@media (max-width: 720px) {
  .dch-stats__inner { grid-template-columns: repeat(2, 1fr); }
  .dch-stat:nth-child(2n+1) { border-left: 0; }
  .dch-stat:nth-child(n+3) { border-top: 1px solid var(--dch-line-ink); }
}

/* =====================================================
   4. CÓMO FUNCIONA — switch + steps
   ===================================================== */
.dch-how__switch {
  display: inline-flex; gap: 4px; padding: 5px;
  background: var(--dch-paper-2); border-radius: 999px;
  border: 1px solid var(--dch-line-ink);
  margin: 0 0 48px;
}
.dch-how__switch button {
  background: transparent; border: 0; cursor: pointer; font: inherit;
  padding: 10px 22px; border-radius: 999px; font-size: 14px; font-weight: 500;
  color: var(--dch-muted-ink); transition: all .35s var(--ease);
}
.dch-how__switch button.is-active { background: var(--dch-ink); color: var(--dch-fg); }

.dch-how__pane { display: none; }
.dch-how__pane.is-active { display: block; animation: paneIn .55s var(--ease-out); }
@keyframes paneIn {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}

.dch-steps {
  list-style: none; margin: 0; padding: 0;
  display: grid; gap: 0;
}
.dch-steps li {
  display: grid;
  grid-template-columns: 80px 1fr auto;
  gap: 28px; align-items: center;
  padding: 32px 0;
  border-top: 1px solid var(--dch-line-ink);
  transition: padding .4s var(--ease);
  cursor: default;
}
.dch-steps li:last-child { border-bottom: 1px solid var(--dch-line-ink); }
.dch-steps li:hover { padding-left: 16px; }
.dch-steps li:hover .dch-step__num { color: var(--dch-accent); }
.dch-step__num {
  font-family: var(--dch-display); font-weight: 400;
  font-size: 2.4rem; color: var(--dch-muted-ink);
  letter-spacing: -.02em;
  transition: color .35s var(--ease);
}
.dch-step__body h3 {
  font-family: var(--dch-display); font-weight: 500;
  font-size: 1.5rem; margin: 0 0 6px; letter-spacing: -.02em;
  color: var(--dch-ink);
}
.dch-step__body p { margin: 0; color: var(--dch-muted-ink); max-width: 60ch; line-height: 1.55; font-size: 15px; }
.dch-step__icon {
  width: 56px; height: 56px; border-radius: 50%;
  display: grid; place-items: center;
  background: var(--dch-paper-2); color: var(--dch-ink);
  font-size: 1.4rem; transition: background .35s var(--ease), color .35s var(--ease);
}
.dch-steps li:hover .dch-step__icon { background: var(--dch-accent); color: #fff; }
@media (max-width: 720px) {
  .dch-steps li { grid-template-columns: 56px 1fr; gap: 18px; padding: 24px 0; }
  .dch-step__icon { display: none; }
  .dch-step__num { font-size: 1.8rem; }
}

/* =====================================================
   4b. ÚNETE — Dual-path conversion section
   ===================================================== */
.dch-join {
  background: var(--dch-bg);
  color: var(--dch-fg);
  overflow: hidden;
}

/* ── Encabezado ── */
.dch-join__intro {
  padding: 100px 0 64px;
  text-align: center;
}
.dch-tag--center { display: inline-flex; margin: 0 auto; justify-content: center; }
.dch-tag--center::before { display: none; }
.dch-join__heading {
  font-family: var(--dch-display);
  font-size: clamp(2.4rem, 5vw, 4rem);
  font-weight: 700;
  letter-spacing: -.04em;
  line-height: 1.06;
  color: var(--dch-fg);
  margin: 18px 0 0;
}
.dch-join__heading em {
  font-style: normal;
  background: linear-gradient(110deg, var(--dch-accent) 0%, #70d080 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.dch-join__lead {
  margin: 22px auto 0;
  max-width: 56ch;
  font-size: 1.04rem;
  line-height: 1.7;
  color: var(--dch-muted);
}

/* ── Grid de dos tarjetas ── */
.dch-join__paths { padding: 0 0 80px; }
.dch-join__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
@media (max-width: 900px) { .dch-join__grid { grid-template-columns: 1fr; } }

/* ── Tarjeta base ── */
.dch-join__card {
  position: relative;
  border-radius: 28px;
  overflow: hidden;
  isolation: isolate;
}
.dch-join__card-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  transition: transform 1.2s var(--ease-out);
}
.dch-join__card:hover .dch-join__card-bg { transform: scale(1.04); }

/* Club — fondo oscuro con textura */
.dch-join__card--club .dch-join__card-bg {
  background:
    radial-gradient(ellipse 80% 60% at 90% 10%, rgba(44,176,55,.18) 0%, transparent 65%),
    radial-gradient(ellipse 60% 80% at 10% 90%, rgba(26,122,36,.12) 0%, transparent 65%),
    var(--dch-bg-2);
}
/* Player — fondo azul saturado */
.dch-join__card--player .dch-join__card-bg {
  background:
    radial-gradient(ellipse 80% 60% at 10% 10%, rgba(77,111,255,.55) 0%, transparent 65%),
    radial-gradient(ellipse 60% 80% at 90% 90%, rgba(44,176,55,.8) 0%, transparent 65%),
    var(--dch-accent);
}

.dch-join__card-inner {
  position: relative;
  z-index: 1;
  padding: 48px 44px 44px;
  display: flex;
  flex-direction: column;
  gap: 0;
}
@media (max-width: 600px) { .dch-join__card-inner { padding: 36px 28px 32px; } }

/* Header de tarjeta: número + ícono */
.dch-join__card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 28px;
}
.dch-join__card-num {
  font-family: var(--dch-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: rgba(246,244,239,.35);
}
.dch-join__card--player .dch-join__card-num { color: rgba(255,255,255,.45); }

.dch-join__card-icon {
  width: 54px; height: 54px;
  border-radius: 16px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.4rem;
}
.dch-join__card--club .dch-join__card-icon {
  background: rgba(44,176,55,.15);
  color: var(--dch-accent-soft);
  border: 1px solid rgba(44,176,55,.25);
}
.dch-join__card--player .dch-join__card-icon {
  background: rgba(255,255,255,.18);
  color: #fff;
  border: 1px solid rgba(255,255,255,.25);
}

/* Título y descripción */
.dch-join__card-title {
  font-family: var(--dch-display);
  font-size: clamp(1.6rem, 2.8vw, 2.2rem);
  font-weight: 700;
  letter-spacing: -.04em;
  line-height: 1.08;
  color: var(--dch-fg);
  margin: 0 0 14px;
}
.dch-join__card--player .dch-join__card-title { color: #fff; }
.dch-join__card-desc {
  font-size: 1rem;
  line-height: 1.65;
  color: var(--dch-muted);
  margin: 0 0 32px;
  max-width: 42ch;
}
.dch-join__card--player .dch-join__card-desc { color: rgba(255,255,255,.72); }

/* ── Lista de beneficios ── */
.dch-join__perks {
  list-style: none;
  padding: 0; margin: 0 0 32px;
  display: flex;
  flex-direction: column;
  gap: 0;
  border-top: 1px solid rgba(246,244,239,.08);
}
.dch-join__card--player .dch-join__perks { border-top-color: rgba(255,255,255,.14); }

.dch-join__perks li {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 0 14px;
  align-items: start;
  padding: 16px 0;
  border-bottom: 1px solid rgba(246,244,239,.07);
  transition: background .25s var(--ease);
}
.dch-join__card--player .dch-join__perks li { border-bottom-color: rgba(255,255,255,.10); }
.dch-join__perks li:hover { background: rgba(246,244,239,.03); }
.dch-join__card--player .dch-join__perks li:hover { background: rgba(255,255,255,.06); }

.dch-join__perk-icon {
  width: 36px; height: 36px;
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1rem;
  flex-shrink: 0;
  margin-top: 2px;
}
.dch-join__card--club .dch-join__perk-icon {
  background: rgba(44,176,55,.12);
  color: var(--dch-accent-soft);
}
.dch-join__card--player .dch-join__perk-icon {
  background: rgba(255,255,255,.15);
  color: #fff;
}

.dch-join__perks li strong {
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: var(--dch-fg);
  margin-bottom: 3px;
  font-family: var(--dch-display);
  letter-spacing: -.01em;
}
.dch-join__card--player .dch-join__perks li strong { color: #fff; }
.dch-join__perks li span {
  font-size: 12.5px;
  color: var(--dch-muted);
  line-height: 1.5;
}
.dch-join__card--player .dch-join__perks li span { color: rgba(255,255,255,.6); }

/* ── Social proof ── */
.dch-join__proof {
  display: flex;
  align-items: center;
  gap: 0;
  margin-bottom: 28px;
}
.dch-join__proof-avatars { display: flex; }
.dch-join__proof-avatars img {
  width: 34px; height: 34px;
  border-radius: 50%;
  border: 2px solid var(--dch-bg-2);
  object-fit: cover;
  margin-right: -8px;
}
.dch-join__card--player .dch-join__proof-avatars img { border-color: var(--dch-accent); }
.dch-join__proof p {
  margin: 0;
  font-size: 13px;
  font-weight: 500;
  color: var(--dch-muted);
  padding-left: 18px;
}
.dch-join__proof p strong { color: var(--dch-fg); }
.dch-join__card--player .dch-join__proof p { color: rgba(255,255,255,.65); }
.dch-join__card--player .dch-join__proof p strong { color: #fff; }

/* ── CTAs ── */
.dch-join__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  padding: 18px 28px;
  border-radius: 14px;
  font-family: var(--dch-display);
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: -.01em;
  text-decoration: none;
  transition: gap .35s var(--ease), transform .35s var(--ease), box-shadow .35s var(--ease);
}
.dch-join__btn:hover { gap: 20px; transform: translateY(-3px); }
.dch-join__btn--dark {
  background: var(--dch-accent);
  color: #fff;
  box-shadow: 0 8px 32px rgba(44,176,55,.35);
}
.dch-join__btn--dark:hover { box-shadow: 0 16px 48px rgba(44,176,55,.5); color: #fff; }
.dch-join__btn--accent {
  background: #fff;
  color: var(--dch-accent);
  box-shadow: 0 8px 32px rgba(0,0,0,.15);
}
.dch-join__btn--accent:hover { box-shadow: 0 16px 48px rgba(0,0,0,.25); color: var(--dch-accent); }

.dch-join__fine {
  text-align: center;
  font-size: 12px;
  color: rgba(246,244,239,.28);
  margin: 12px 0 0;
}
.dch-join__card--player .dch-join__fine { color: rgba(255,255,255,.4); }

/* ── Tabla de comparación ── */
.dch-join__compare {
  background: rgba(246,244,239,.04);
  border-top: 1px solid rgba(246,244,239,.07);
  padding: 64px 0 80px;
}
.dch-join__compare-title {
  font-family: var(--dch-display);
  font-size: clamp(1.3rem, 2.5vw, 1.8rem);
  font-weight: 600;
  letter-spacing: -.03em;
  color: var(--dch-fg);
  text-align: center;
  margin: 0 0 40px;
}

.dch-join__compare-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  border: 1px solid rgba(246,244,239,.09);
  border-radius: 20px;
  overflow: hidden;
}

.dch-join__compare-col {
  padding: 16px 22px;
  font-size: 13.5px;
  color: var(--dch-muted);
  border-bottom: 1px solid rgba(246,244,239,.06);
  display: flex;
  align-items: center;
  gap: 8px;
}
.dch-join__compare-col:nth-child(3n+2),
.dch-join__compare-col:nth-child(3n+3) {
  justify-content: center;
  text-align: center;
}
/* Headers */
.dch-join__compare-col--header {
  background: rgba(246,244,239,.05);
  font-family: var(--dch-display);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: rgba(246,244,239,.5);
  padding: 18px 22px;
  border-bottom: 1px solid rgba(246,244,239,.10);
}
/* Filas alternas */
.dch-join__compare-grid > .dch-join__compare-col:nth-child(6n+4),
.dch-join__compare-grid > .dch-join__compare-col:nth-child(6n+5),
.dch-join__compare-grid > .dch-join__compare-col:nth-child(6n+6) {
  background: rgba(246,244,239,.02);
}

.dch-join__yes { color: var(--dch-accent-soft); font-size: 1.1rem; }
.dch-join__no  { color: rgba(246,244,239,.2);   font-size: 1.1rem; }

@media (max-width: 720px) {
  .dch-join__intro { padding: 72px 0 48px; }
  .dch-join__compare-grid { grid-template-columns: 1.6fr 1fr 1fr; }
  .dch-join__compare-col { font-size: 12px; padding: 14px 14px; }
  .dch-join__compare-title { margin-bottom: 28px; }
}
@media (max-width: 480px) {
  .dch-join__compare-grid { grid-template-columns: 1fr 42px 42px; }
  .dch-join__compare-col:first-child { font-size: 11.5px; }
}

/* =====================================================
   5. CLUBES DESTACADOS — slider premium
   ===================================================== */

.dch-clubs-body {
  margin-top: 56px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px 64px;
  align-items: start;
  padding-bottom: 64px;
  border-bottom: 1.5px solid rgba(10,13,18,.08);
}
@media (max-width: 1024px) { .dch-clubs-body { grid-template-columns: 1fr; gap: 52px; padding-bottom: 52px; } }

/* ── Columna izquierda ── */
.dch-clubs-left { display: flex; flex-direction: column; gap: 44px; }

.dch-clubs-lead {
  font-size: 1.05rem;
  line-height: 1.75;
  color: rgba(10,13,18,.64);
  margin: 0;
  max-width: 52ch;
}
.dch-clubs-lead strong { color: var(--dch-ink); font-weight: 600; }

/* Stats en fila */
.dch-clubs-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border: 1.5px solid rgba(10,13,18,.08);
  border-radius: 18px;
  overflow: hidden;
  background: rgba(255,255,255,.6);
  backdrop-filter: blur(10px);
}
@media (max-width: 600px) { .dch-clubs-stats { grid-template-columns: repeat(2, 1fr); } }

.dch-clubs-stat {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 24px 20px;
  border-right: 1.5px solid rgba(10,13,18,.07);
  position: relative;
}
.dch-clubs-stat:last-child { border-right: none; }
.dch-clubs-stat::after {
  position: absolute;
  top: 0; left: 18px; right: 18px;
  height: 3px;
  border-radius: 0 0 4px 4px;
  background: rgba(10,13,18,.08);
  transition: background .3s var(--ease);
}
.dch-clubs-stat:hover::after { background: var(--dch-accent); }
.dch-clubs-stat--live::after { background: #22c55e; }

.dch-clubs-stat strong {
  font-family: var(--dch-display);
  font-size: 1.65rem;
  font-weight: 700;
  letter-spacing: -.04em;
  color: var(--dch-ink);
  line-height: 1;
}
.dch-clubs-stat span {
  font-size: 11.5px;
  color: rgba(10,13,18,.44);
  font-weight: 500;
  line-height: 1.3;
}

/* Tab bar de filtros */
.dch-clubs-tabbar {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.dch-clubs-tabbar__group {
  display: flex;
  align-items: center;
  background: rgba(10,13,18,.05);
  border-radius: 14px;
  padding: 4px;
  gap: 2px;
  flex-wrap: wrap;
}
.dch-ctab {
  flex: 1;
  min-width: max-content;
  padding: 8px 14px;
  border-radius: 10px;
  border: none;
  background: transparent;
  font-family: var(--dch-text);
  font-size: 13px;
  font-weight: 500;
  color: rgba(10,13,18,.52);
  cursor: pointer;
  transition: all .22s var(--ease);
  white-space: nowrap;
}
.dch-ctab:hover { color: var(--dch-ink); background: rgba(10,13,18,.05); }
.dch-ctab.is-active {
  background: #fff;
  color: var(--dch-ink);
  font-weight: 600;
  box-shadow: 0 2px 10px rgba(0,0,0,.1), 0 1px 3px rgba(0,0,0,.08);
}

/* ── Columna derecha: feed ── */
.dch-clubs-feed {
  border: 1.5px solid rgba(10,13,18,.08);
  border-radius: 22px;
  overflow: hidden;
  background: rgba(255,255,255,.7);
  backdrop-filter: blur(12px);
  box-shadow: 0 4px 24px rgba(0,0,0,.06);
}

.dch-clubs-feed__head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 16px 20px 14px;
  border-bottom: 1.5px solid rgba(10,13,18,.07);
  font-size: 12.5px;
  font-weight: 600;
  color: rgba(10,13,18,.5);
  letter-spacing: .05em;
  text-transform: uppercase;
  background: rgba(10,13,18,.02);
}
.dch-clubs-feed__more {
  margin-left: auto;
  font-size: 12px;
  font-weight: 500;
  color: var(--dch-accent);
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 4px;
  text-transform: none;
  letter-spacing: 0;
  transition: gap .2s var(--ease);
}
.dch-clubs-feed__more:hover { gap: 8px; color: var(--dch-accent); }

/* Dot parpadeante "live" */
.dch-live-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 0 0 rgba(34,197,94,.4);
  animation: live-pulse 2s infinite;
  flex-shrink: 0;
}
@keyframes live-pulse {
  0%   { box-shadow: 0 0 0 0   rgba(34,197,94,.5); }
  70%  { box-shadow: 0 0 0 8px rgba(34,197,94,0);  }
  100% { box-shadow: 0 0 0 0   rgba(34,197,94,0);  }
}

.dch-clubs-feed__list { display: flex; flex-direction: column; }

.dch-clubs-feed__item {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 14px;
  padding: 20px 22px;
  border-bottom: 1px solid rgba(10,13,18,.055);
  border-left: 3px solid transparent;
  transition: background .2s var(--ease), border-color .2s var(--ease);
  align-items: start;
}
.dch-clubs-feed__item:last-child { border-bottom: none; }
.dch-clubs-feed__item:hover { background: rgba(10,13,18,.025); }

/* Colores por tipo */
.dch-clubs-feed__item--fixture:hover     { border-left-color: var(--dch-accent); }
.dch-clubs-feed__item--fichaje:hover     { border-left-color: #22c55e; }
.dch-clubs-feed__item--convocatoria:hover { border-left-color: #f59e0b; }
.dch-clubs-feed__item--nuevo:hover       { border-left-color: #a78bfa; }

.dch-clubs-feed__icon {
  width: 40px; height: 40px;
  border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.05rem;
  flex-shrink: 0;
  margin-top: 1px;
}
.dch-clubs-feed__item--fixture     .dch-clubs-feed__icon { background: rgba(44,176,55,.09);  color: var(--dch-accent); }
.dch-clubs-feed__item--fichaje      .dch-clubs-feed__icon { background: rgba(34,197,94,.1);   color: #16a34a; }
.dch-clubs-feed__item--convocatoria .dch-clubs-feed__icon { background: rgba(245,158,11,.1);  color: #d97706; }
.dch-clubs-feed__item--nuevo        .dch-clubs-feed__icon { background: rgba(167,139,250,.15); color: #7c3aed; }

.dch-clubs-feed__content { display: flex; flex-direction: column; gap: 8px; }
.dch-clubs-feed__content p {
  font-size: 13.5px;
  line-height: 1.45;
  color: rgba(10,13,18,.72);
  margin: 0;
}
.dch-clubs-feed__content p strong { color: var(--dch-ink); font-weight: 600; }

.dch-clubs-feed__meta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.dch-clubs-feed__badge {
  font-size: 10.5px;
  font-weight: 600;
  padding: 2px 9px;
  border-radius: 99px;
  letter-spacing: .03em;
  text-transform: uppercase;
}
.dch-clubs-feed__badge--green  { background: rgba(34,197,94,.12);   color: #15803d; }
.dch-clubs-feed__badge--blue   { background: rgba(44,176,55,.1);    color: var(--dch-accent); }
.dch-clubs-feed__badge--amber  { background: rgba(245,158,11,.12);  color: #b45309; }
.dch-clubs-feed__badge--violet { background: rgba(167,139,250,.18); color: #6d28d9; }

.dch-clubs-feed__region {
  font-size: 11.5px;
  color: rgba(10,13,18,.4);
  display: flex;
  align-items: center;
  gap: 3px;
}
.dch-clubs-feed__region i { font-size: 10px; }

.dch-clubs-feed__meta time {
  font-size: 11.5px;
  color: rgba(10,13,18,.32);
  margin-left: auto;
}

@media (max-width: 480px) {
  .dch-clubs-feed__item { grid-template-columns: 38px 1fr; gap: 10px; padding: 14px 16px; }
  .dch-clubs-feed__meta time { margin-left: 0; }
}

/* Contenedor general del slider */
.dch-slider {
  position: relative;
  overflow: visible;
}
/* El viewport clip solo el track horizontalmente;
   el slider padre queda visible para que las sombras respiren */
.dch-slider__viewport {
  overflow: hidden;
  padding: 20px 4px 64px;
  margin: -20px -4px -64px;
}
/* Track: los items en fila, se mueven con transform */
.dch-slider__track {
  display: flex;
  gap: 24px;
  transition: transform .72s cubic-bezier(.22,.8,.26,1);
  will-change: transform;
  user-select: none;
}

/* Cada slide — clubes: 3 visibles en desktop, 2 en tablet, 1 en móvil */
.dch-slider__track .dch-club-feat {
  flex: 0 0 calc((100% - 48px) / 3);
  scroll-snap-align: none;
}
@media (max-width: 1024px) {
  .dch-slider__track .dch-club-feat {
    flex: 0 0 calc((100% - 24px) / 2);
  }
}
@media (max-width: 640px) {
  .dch-slider__track .dch-club-feat {
    flex: 0 0 100%;
  }
}

/* NAV — flechas + dots */
.dch-slider__nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin-top: 36px;
}

.dch-slider__arrow {
  width: 52px; height: 52px;
  border-radius: 50%;
  border: 1px solid var(--dch-line-ink);
  background: transparent;
  color: var(--dch-ink);
  display: grid; place-items: center;
  font-size: 1.15rem;
  cursor: pointer;
  transition:
    background .35s var(--ease),
    border-color .35s var(--ease),
    color .35s var(--ease),
    transform .35s var(--ease),
    box-shadow .35s var(--ease);
  flex-shrink: 0;
}
.dch-slider__arrow:hover {
  background: var(--dch-ink);
  color: var(--dch-fg);
  border-color: var(--dch-ink);
  transform: scale(1.08);
  box-shadow: 0 6px 24px rgba(0,0,0,.18);
}
.dch-slider__arrow:active { transform: scale(.96); }
.dch-slider__arrow:disabled {
  opacity: .28; cursor: not-allowed; transform: none;
  box-shadow: none;
}

/* Dots */
.dch-slider__dots {
  display: flex; align-items: center; gap: 8px;
}
.dch-slider__dot {
  width: 8px; height: 8px;
  border-radius: 99px;
  background: var(--dch-line-ink);
  border: 0; cursor: pointer; padding: 0;
  transition: width .4s var(--ease), background .4s var(--ease);
  flex-shrink: 0;
}
.dch-slider__dot.is-active {
  width: 28px;
  background: var(--dch-ink);
}

/* Progreso autoplay en el dot activo */
.dch-slider__dot.is-active::after { display: none; }

/* ─ Sección paper-2: flechas con borde oscuro sobre fondo claro ─ */
.dch-section--paper-2 .dch-slider__arrow {
  border-color: rgba(10,13,18,.18);
  color: var(--dch-ink);
}
.dch-section--paper-2 .dch-slider__arrow:hover {
  background: var(--dch-ink);
  color: #fff;
}
.dch-section--paper-2 .dch-slider__dot.is-active {
  background: var(--dch-accent);
}

/* Cards de clubes */
.dch-club-feat {
  position: relative; border-radius: var(--dch-radius);
  overflow: hidden; aspect-ratio: 4/5;
  background: var(--dch-ink);
  transition:
    transform .55s var(--ease),
    box-shadow .55s var(--ease);
  box-shadow:
    0 4px 16px rgba(0,0,0,.18),
    0 0 0 1px rgba(0,0,0,.08);
  flex-shrink: 0;
}
.dch-club-feat:hover {
  transform: translateY(-8px) scale(1.012);
  box-shadow:
    0 0 0 1px rgba(44,176,55,.3),
    0 0 30px -8px rgba(44,176,55,.22);
}
.dch-club-feat img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform 1.4s var(--ease), filter 1.4s var(--ease);
  filter: contrast(1.05) saturate(.95);
}
.dch-club-feat:hover img {
  transform: scale(1.07);
  filter: contrast(1.08) saturate(1.1);
}
.dch-club-feat::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(180deg, transparent 28%, rgba(10,13,18,.92) 100%);
  transition: background .55s var(--ease);
}
.dch-club-feat:hover::after {
  background: linear-gradient(180deg, transparent 18%, rgba(10,13,18,.96) 100%);
}
.dch-club-feat__body {
  position: absolute; inset: auto 0 0 0; padding: 28px;
  color: #fff; z-index: 2;
}
.dch-club-feat__meta {
  display: flex; gap: 10px; font-size: 11.5px; letter-spacing: .12em; text-transform: uppercase;
  color: rgba(255,255,255,.68); margin-bottom: 10px;
  flex-wrap: wrap;
}
.dch-club-feat__meta span::before { content: '·'; margin-right: 10px; opacity: .5; }
.dch-club-feat__meta span:first-child::before { content: ''; margin: 0; }
.dch-club-feat h3 {
  font-family: var(--dch-display); font-weight: 600; font-size: 1.5rem; margin: 0 0 16px;
  letter-spacing: -.02em; line-height: 1.08;
  color: #fff;
}
.dch-club-feat__cta {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 13px; font-weight: 500;
  color: #fff; text-decoration: none;
  border: 1px solid rgba(255,255,255,.35); padding: 9px 18px; border-radius: 999px;
  transition: all .35s var(--ease);
  background: rgba(255,255,255,.08);
}
.dch-club-feat:hover .dch-club-feat__cta {
  background: var(--dch-accent);
  border-color: var(--dch-accent);
  color: #fff;
  gap: 12px;
}
.dch-club-feat__badge {
  position: absolute; top: 16px; left: 16px;
  background: rgba(10,13,18,.72); backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,.16);
  font-size: 10.5px; padding: 5px 12px; border-radius: 999px;
  color: #fff; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; z-index: 2;
}
.dch-club-feat__fav {
  position: absolute; top: 14px; right: 14px;
  width: 36px; height: 36px; border-radius: 50%;
  background: rgba(10,13,18,.62); backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,.16);
  color: rgba(255,255,255,.7); display: grid; place-items: center;
  cursor: pointer; z-index: 2;
  transition: background .35s var(--ease), color .35s var(--ease), transform .35s var(--ease);
}
.dch-club-feat__fav:hover { transform: scale(1.1); color: #fff; }
.dch-club-feat__fav.is-active { background: var(--dch-accent); border-color: var(--dch-accent); color: #fff; }

/* =====================================================
   6. DEPORTES — Bento  (rediseño completo)
   ===================================================== */
.dch-bento {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-auto-rows: 162px;
  grid-auto-flow: row dense;
  gap: 10px;
}

/* ── Celda base ── */
.dch-bento__cell {
  --sa: var(--dch-accent);
  --sar: 12,65,255;
  position: relative;
  padding: 20px 22px;
  background: var(--dch-paper-2);
  border-radius: var(--dch-radius-sm);
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  text-decoration: none;
  color: var(--dch-ink);
  overflow: hidden;
  border: none;
  transition:
    background .08s linear,
    color .08s linear,
    box-shadow .08s linear;
  transition-delay: 0s !important;
}

/* Glow de fondo — radial centrado en esquina inferior-derecha */
.dch-bento__cell::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(ellipse at 110% 115%, rgba(var(--sar), .22) 0%, transparent 55%);
  opacity: 0;
  transition: opacity .09s linear;
  pointer-events: none;
}
.dch-bento__cell:hover::before { opacity: 1; }

/* Estado hover base */
.dch-bento__cell:hover {
  background: #fff;
  color: var(--dch-ink);
  box-shadow: 0 0 0 2px var(--sa);
  transition-delay: 0s !important;
}

/* ── Texto ── */
.dch-bento__label { position: relative; z-index: 1; }
.dch-bento__label h3 {
  font-family: var(--dch-display);
  font-weight: 600;
  margin: 0;
  font-size: 1.15rem;
  letter-spacing: -.025em;
  line-height: 1.1;
}
.dch-bento__label small {
  display: block;
  margin-top: 5px;
  font-size: 10.5px;
  opacity: .52;
  letter-spacing: .05em;
  font-weight: 500;
  text-transform: uppercase;
}

/* ── Icono decorativo (fondo) ── */
.dch-bento__ico {
  position: absolute;
  bottom: -4px;
  right: 10px;
  font-size: 4.2rem;
  line-height: 1;
  color: var(--dch-ink);
  opacity: .12;
  pointer-events: none;
  transition:
    opacity .09s linear,
    color .09s linear,
    transform .09s var(--ease-out);
}
.dch-bento__cell:hover .dch-bento__ico {
  opacity: .45;
  color: var(--sa);
  transform: scale(1.12) translate(3px, 3px);
}

/* ── Tamaños ── */
.dch-bento__cell.is-md { grid-column: span 2; }
.dch-bento__cell.is-sm { grid-column: span 1; }
.dch-bento__cell.is-sm .dch-bento__ico { font-size: 3rem; right: 8px; }
.dch-bento__cell.is-sm .dch-bento__label h3 { font-size: 1rem; }

/* ── XL — fútbol, héroe de la grilla ── */
.dch-bento__cell.is-xl {
  grid-column: span 3;
  grid-row: span 2;
  background: #0a0d12;
  color: #fff;
  padding: 28px 30px;
  justify-content: flex-end;
  border: none;
}
/* glow permanente detrás del icono */
.dch-bento__cell.is-xl::before {
  background: radial-gradient(ellipse at 78% 50%, rgba(var(--sar), .28) 0%, transparent 60%);
  opacity: .55;
}
.dch-bento__cell.is-xl:hover::before { opacity: 1; }
.dch-bento__cell.is-xl .dch-bento__ico {
  font-size: 9.5rem;
  bottom: auto;
  right: 22px;
  top: 50%;
  transform: translateY(-50%);
  opacity: .38;
  color: var(--sa);
}
.dch-bento__cell.is-xl:hover .dch-bento__ico {
  opacity: .65;
  color: var(--sa);
  transform: translateY(-50%);
}
.dch-bento__cell.is-xl .dch-bento__label h3 {
  font-size: 2.4rem;
  color: #fff;
}
.dch-bento__cell.is-xl .dch-bento__label small {
  color: rgba(255,255,255,.65);
  opacity: 1;
}
.dch-bento__cell.is-xl:hover {
  background: #0a0d12;
  color: #fff;
  box-shadow: 0 0 0 2px var(--sa);
}

/* ── CTA "Ver todas" ── */
.dch-bento__more {
  grid-column: span 3;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 20px;
  border-radius: var(--dch-radius-sm);
  background: var(--dch-paper-2);
  border: 2px solid var(--dch-accent);
  text-decoration: none;
  color: var(--dch-accent);
  font-size: .95rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  transition: background .08s linear, color .08s linear;
}
.dch-bento__more:hover {
  background: var(--dch-accent);
  color: #fff;
}
.dch-bento__more .bi-arrow-right {
  transition: transform .18s var(--ease-out);
}
.dch-bento__more:hover .bi-arrow-right { transform: translateX(4px); }

/* ── Responsive ── */
@media (max-width: 1100px) {
  .dch-bento {
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: 148px;
  }
  .dch-bento__cell.is-xl { grid-column: span 2; grid-row: span 2; }
  .dch-bento__cell.is-xl .dch-bento__label h3 { font-size: 1.9rem; }
  .dch-bento__cell.is-xl .dch-bento__ico { font-size: 6rem; right: 20px; }
  .dch-bento__more { grid-column: span 4; }
}
@media (max-width: 640px) {
  .dch-bento {
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: 130px;
    gap: 8px;
  }
  .dch-bento__cell.is-xl,
  .dch-bento__cell.is-md { grid-column: span 2; grid-row: auto; }
  .dch-bento__cell.is-xl .dch-bento__label h3 { font-size: 1.6rem; }
  .dch-bento__cell.is-xl .dch-bento__ico { font-size: 4.5rem; top: 50%; right: 16px; }
  .dch-bento__cell.is-sm { grid-column: span 1; }
  .dch-bento__more { grid-column: span 2; }
}

/* =====================================================
   7. REGIONES — SVG map interactivo
   ===================================================== */

/* ── Aura decorativa ── */
.dch-mapa { position: relative; overflow: hidden; }
.dch-mapa__aura {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(ellipse 60% 50% at 75% 42%, rgba(44,176,55,.07) 0%, transparent 70%),
    radial-gradient(ellipse 40% 55% at 15% 62%, rgba(26,122,36,.04) 0%, transparent 70%);
}

/* ── Top header ── */
.dch-mapa__top {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px 80px;
  align-items: end;
  margin-bottom: 72px;
}
.dch-mapa__top-text .dch-tag { color: var(--dch-accent-soft); }
.dch-mapa__heading {
  font-family: var(--dch-display);
  font-weight: 700;
  font-size: clamp(3rem, 5.5vw, 5rem);
  line-height: .92;
  letter-spacing: -.045em;
  color: var(--dch-fg);
  margin: 16px 0 20px;
}
.dch-mapa__heading em {
  font-style: normal;
  background: linear-gradient(120deg, var(--dch-accent) 20%, #60d070 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.dch-mapa__top-text p {
  color: var(--dch-muted);
  max-width: 38ch;
  line-height: 1.65;
  font-size: .97rem;
  margin: 0;
}
.dch-mapa__top-text p strong { color: var(--dch-fg); font-weight: 600; }

.dch-mapa__top-kpis {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: rgba(246,244,239,.08);
  border: 1px solid rgba(246,244,239,.08);
  border-radius: var(--dch-radius-sm);
  overflow: hidden;
}
.dch-mapa__top-kpi {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 24px 28px;
  background: rgba(17,21,28,.6);
  transition: background .2s linear;
}
.dch-mapa__top-kpi:hover { background: rgba(44,176,55,.07); }
.dch-mapa__top-kpi strong {
  font-family: var(--dch-display);
  font-size: clamp(1.65rem, 2.4vw, 2.1rem);
  font-weight: 700;
  color: var(--dch-fg);
  letter-spacing: -.04em;
  line-height: 1;
}
.dch-mapa__top-kpi span {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: rgba(246,244,239,.35);
}

/* ── Body: panel + mapa ── */
.dch-mapa__body {
  display: grid;
  grid-template-columns: 340px 1fr;
  gap: 64px;
  align-items: start;
}
.dch-mapa__panel {
  justify-self: stretch;
}

/* ── Panel ── */
.dch-mapa__panel {
  position: sticky;
  top: 100px;
  min-height: 500px;
}

/* Estado reposo */
.dch-mapa__panel-idle {
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.dch-mapa__panel-prompt {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  padding: 40px 24px;
  background: rgba(246,244,239,.03);
  border: 1px solid rgba(246,244,239,.08);
  border-radius: var(--dch-radius-sm);
  text-align: center;
}
.dch-mapa__panel-prompt .bi {
  font-size: 1.75rem;
  color: var(--dch-accent);
  animation: panel-blink 2.4s ease-in-out infinite;
}
@keyframes panel-blink {
  0%, 100% { opacity: 1; }
  50% { opacity: .3; }
}
.dch-mapa__panel-prompt p {
  font-size: .88rem;
  color: rgba(246,244,239,.45);
  margin: 0;
  max-width: 26ch;
  line-height: 1.55;
}
.dch-mapa__panel-chips { display: flex; flex-direction: column; gap: 6px; }
.dch-mapa__chips-label {
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(246,244,239,.28);
  margin: 0 0 8px;
}
.dch-mapa__chip {
  display: grid;
  grid-template-columns: 28px 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  background: rgba(246,244,239,.04);
  border: 1px solid rgba(246,244,239,.07);
  border-radius: var(--dch-radius-sm);
  cursor: pointer;
  transition: background .12s linear, border-color .12s linear, transform .1s var(--ease-out);
  text-align: left;
  color: var(--dch-fg);
}
.dch-mapa__chip:hover,
.dch-mapa__chip--feat {
  background: rgba(44,176,55,.1);
  border-color: rgba(44,176,55,.25);
}
.dch-mapa__chip:active { transform: scale(.98); }
.dch-mapa__chip-num {
  font-family: var(--dch-display);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .06em;
  color: rgba(246,244,239,.3);
}
.dch-mapa__chip-name {
  font-family: var(--dch-display);
  font-size: .88rem;
  font-weight: 500;
  color: rgba(246,244,239,.72);
}
.dch-mapa__chip-val {
  font-family: var(--dch-display);
  font-size: .92rem;
  font-weight: 700;
  color: var(--dch-accent-soft);
  letter-spacing: -.02em;
}

/* Estado detalle */
.dch-mapa__panel-detail {
  display: flex;
  flex-direction: column;
  gap: 22px;
  animation: panel-in .22s var(--ease-out);
}
@keyframes panel-in {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}
.dch-mapa__detail-head {
  display: flex;
  align-items: center;
  gap: 12px;
}
.dch-mapa__detail-num {
  font-family: var(--dch-display);
  font-size: 2.6rem;
  font-weight: 800;
  color: var(--dch-accent);
  letter-spacing: -.06em;
  line-height: 1;
}
.dch-mapa__detail-pill {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  background: rgba(44,176,55,.15);
  border: 1px solid rgba(44,176,55,.3);
  border-radius: 999px;
  color: var(--dch-accent-soft);
  padding: 4px 10px;
}
.dch-mapa__detail-name {
  font-family: var(--dch-display);
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 700;
  color: var(--dch-fg);
  margin: 0;
  letter-spacing: -.03em;
  line-height: 1.05;
}
.dch-mapa__detail-kpis {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: rgba(246,244,239,.08);
  border: 1px solid rgba(246,244,239,.08);
  border-radius: var(--dch-radius-sm);
  overflow: hidden;
}
.dch-mapa__detail-kpi {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 16px 14px;
  background: rgba(17,21,28,.5);
}
.dch-mapa__detail-kpi strong {
  font-family: var(--dch-display);
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--dch-fg);
  letter-spacing: -.03em;
  line-height: 1;
}
.dch-mapa__detail-kpi span {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: rgba(246,244,239,.3);
}
.dch-mapa__detail-sport-head {
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(246,244,239,.28);
}
.dch-mapa__detail-sport {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  background: rgba(44,176,55,.08);
  border-radius: var(--dch-radius-sm);
  border: 1px solid rgba(44,176,55,.18);
}
.dch-mapa__detail-sport .bi {
  color: var(--dch-accent-soft);
  font-size: .95rem;
}
.dch-mapa__detail-sport span {
  font-family: var(--dch-display);
  font-size: .92rem;
  font-weight: 600;
  color: var(--dch-fg);
}
.dch-mapa__detail-bar-wrap { display: flex; flex-direction: column; gap: 8px; }
.dch-mapa__detail-bar-labels {
  display: flex;
  justify-content: space-between;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .05em;
  color: rgba(246,244,239,.4);
}
.dch-mapa__detail-bar {
  height: 4px;
  background: rgba(246,244,239,.08);
  border-radius: 2px;
  overflow: hidden;
}
.dch-mapa__detail-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--dch-accent), var(--dch-accent-soft));
  border-radius: 2px;
  transition: width .6s var(--ease-out);
  box-shadow: 0 0 8px rgba(44,176,55,.5);
  width: 0;
}
.dch-mapa__detail-cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 14px 22px;
  background: var(--dch-accent);
  border-radius: var(--dch-radius-sm);
  color: #fff;
  font-family: var(--dch-display);
  font-weight: 600;
  font-size: .9rem;
  letter-spacing: .02em;
  text-decoration: none;
  align-self: flex-start;
  transition: background .15s linear, gap .15s var(--ease-out), box-shadow .15s linear;
}
.dch-mapa__detail-cta:hover {
  background: #188a20;
  gap: 16px;
  box-shadow: 0 8px 24px rgba(44,176,55,.4);
  color: #fff;
}

/* ── SVG container ── */
.dch-mapa__svg-wrap {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
  padding: 0 5%;
}

/* Loader spinner */
.dch-mapa__svg-loader {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  color: rgba(246,244,239,.25);
  font-size: .78rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.dch-mapa__svg-loader p { margin: 0; }
.dch-mapa__svg-pulse {
  width: 38px; height: 38px;
  border: 2px solid rgba(44,176,55,.25);
  border-top-color: var(--dch-accent);
  border-radius: 50%;
  animation: spin .75s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* SVG inyectado inline */
.dch-mapa__svg-wrap svg {
  width: min(380px, 100%);
  height: auto;
  display: block;
  margin: 0 auto;
  /* Sobreescribe el fill verde de simplemaps */
  fill: rgba(77,111,255,.10);
  stroke: rgba(77,111,255,.24);
  stroke-width: 0.8;
  filter: drop-shadow(0 0 40px rgba(44,176,55,.12));
  overflow: visible;
}

/* Paths de regiones (simplemaps: IDs sin guión, ej. CLRM) */
.dch-mapa__svg-wrap svg path[id^="CL"] {
  fill: rgba(77,111,255,.13);
  stroke: rgba(77,111,255,.28);
  stroke-width: 0.8;
  cursor: pointer;
  transition:
    fill .18s var(--ease),
    stroke .18s var(--ease),
    filter .18s var(--ease);
  outline: none;
  paint-order: stroke fill;
}
.dch-mapa__svg-wrap svg path[id^="CL"]:hover,
.dch-mapa__svg-wrap svg path[id^="CL"].is-hovered {
  fill: rgba(44,176,55,.46);
  stroke: rgba(77,111,255,.80);
  stroke-width: 1.4;
  filter: drop-shadow(0 0 7px rgba(44,176,55,.60));
}
.dch-mapa__svg-wrap svg path[id^="CL"].is-active {
  fill: rgba(44,176,55,.62);
  stroke: #5bcf67;
  stroke-width: 1.8;
  filter: drop-shadow(0 0 14px rgba(44,176,55,.80));
}
/* Metropolitana siempre un poco destacada */
.dch-mapa__svg-wrap svg path#CLRM {
  fill: rgba(44,176,55,.22);
  stroke: rgba(77,111,255,.42);
}

/* ── Tooltip flotante ── */
.dch-mapa__tooltip {
  position: fixed;
  pointer-events: none;
  z-index: 9999;
  background: rgba(10,13,18,.94);
  border: 1px solid rgba(44,176,55,.32);
  border-radius: var(--dch-radius-sm);
  padding: 10px 14px;
  font-family: var(--dch-display);
  font-size: .82rem;
  color: var(--dch-fg);
  white-space: nowrap;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 8px 32px rgba(0,0,0,.55), 0 0 16px rgba(44,176,55,.18);
  transform: translate(-50%, calc(-100% - 14px));
  opacity: 0;
  transition: opacity .1s linear;
}
.dch-mapa__tooltip.is-visible { opacity: 1; }
.dch-mapa__tooltip strong {
  display: block;
  font-weight: 700;
  font-size: .88rem;
  margin-bottom: 2px;
  color: #fff;
}
.dch-mapa__tooltip span {
  color: var(--dch-accent-soft);
  font-weight: 600;
  font-size: .78rem;
}

/* ── CTA link (reutiliza clase antigua) ── */
.dch-regiones__cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--dch-display);
  font-size: .92rem;
  font-weight: 600;
  letter-spacing: .03em;
  color: rgba(246,244,239,.5);
  text-decoration: none;
  padding: 16px 0 0;
  border-top: 1px solid rgba(246,244,239,.1);
  margin-top: 48px;
  transition: color .12s linear, gap .15s var(--ease-out);
}
.dch-regiones__cta:hover { color: var(--dch-accent-soft); gap: 16px; }
.dch-regiones__cta .bi { font-size: 1rem; }

/* ── Responsive ── */
@media (max-width: 1280px) {
  .dch-mapa__top { gap: 32px 60px; }
  .dch-mapa__body { grid-template-columns: 300px 1fr; gap: 40px; }
}
@media (max-width: 1024px) {
  .dch-mapa__top { grid-template-columns: 1fr; }
  .dch-mapa__top-kpis { grid-template-columns: repeat(4, 1fr); }
  .dch-mapa__body { grid-template-columns: 1fr; gap: 48px; }
  .dch-mapa__panel { position: static; min-height: auto; justify-self: stretch; }
  .dch-mapa__svg-wrap {
    order: -1;
    width: 100%;
    padding: 0;
    justify-content: center;
  }
  .dch-mapa__svg-wrap svg {
    width: min(340px, 80%);
    height: auto;
    max-width: 100%;
  }
}
@media (max-width: 640px) {
  .dch-mapa__top-kpis { grid-template-columns: 1fr 1fr; }
  .dch-mapa__detail-kpis { grid-template-columns: repeat(3, 1fr); }
  .dch-mapa__heading { font-size: clamp(2.4rem, 10vw, 3.5rem); }
  .dch-mapa__svg-wrap {
    padding: 0;
    justify-content: center;
  }
  .dch-mapa__svg-wrap svg {
    width: min(280px, 70vw);
    height: auto;
    max-width: 100%;
    margin: 0 auto;
  }
}

/* =====================================================
   8. NOTICIAS — editorial redesign
   ===================================================== */
.dch-news-section { background: var(--dch-paper); }

/* Cabecera con filtros */
.dch-news-section__head {
  align-items: flex-end;
  flex-wrap: wrap;
  gap: 20px 32px;
  margin-bottom: 40px !important;
}
.dch-news-section__right {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
}
.dch-news-cats {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.dch-news-cat {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: 6px 14px;
  border-radius: 999px;
  border: 1px solid rgba(10,13,18,.12);
  color: rgba(10,13,18,.45);
  cursor: pointer;
  transition: background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease);
  user-select: none;
}
.dch-news-cat:hover { color: var(--dch-ink); border-color: rgba(10,13,18,.3); }
.dch-news-cat.is-active {
  background: var(--dch-ink);
  color: var(--dch-fg);
  border-color: var(--dch-ink);
}

/* Layout principal */
.dch-news-layout {
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: 0;
  border: 1px solid rgba(10,13,18,.10);
  border-radius: 24px;
  overflow: hidden;
}
@media (max-width: 1024px) {
  .dch-news-layout { grid-template-columns: 1fr; }
}

/* ---- Noticia destacada (izquierda) ---- */
.dch-news-feat {
  position: relative;
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  background: var(--dch-ink);
  min-height: 520px;
  overflow: hidden;
}
.dch-news-feat__img {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.dch-news-feat__img img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform 1.4s var(--ease);
}
.dch-news-feat:hover .dch-news-feat__img img { transform: scale(1.06); }
.dch-news-feat__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(10,13,18,.96) 0%,
    rgba(10,13,18,.65) 40%,
    rgba(10,13,18,.10) 100%
  );
  z-index: 1;
}
.dch-news-feat__body {
  position: relative;
  z-index: 2;
  margin-top: auto;
  padding: 36px 40px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
@media (max-width: 600px) { .dch-news-feat__body { padding: 28px 24px; } }

.dch-news-feat__meta {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 11.5px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: rgba(246,244,239,.5);
}
.dch-news-feat h3 {
  font-family: var(--dch-display);
  font-weight: 600;
  font-size: clamp(1.5rem, 2.8vw, 2rem);
  line-height: 1.12;
  letter-spacing: -.03em;
  color: #fff;
  margin: 0;
  max-width: 28ch;
}
.dch-news-feat p {
  color: rgba(246,244,239,.6);
  font-size: 14.5px;
  line-height: 1.55;
  margin: 0;
  max-width: 42ch;
}
.dch-news-feat__read {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  color: rgba(246,244,239,.55);
  margin-top: 4px;
  transition: color .3s var(--ease), gap .3s var(--ease);
}
.dch-news-feat:hover .dch-news-feat__read { color: #fff; gap: 14px; }

/* ---- Lista lateral (derecha) ---- */
.dch-news-list {
  display: flex;
  flex-direction: column;
  border-left: 1px solid rgba(10,13,18,.10);
  background: #fff;
}
@media (max-width: 1024px) {
  .dch-news-list {
    border-left: none;
    border-top: 1px solid rgba(10,13,18,.10);
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 600px) {
  .dch-news-list { grid-template-columns: 1fr; }
}

.dch-news-item {
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: 16px;
  padding: 22px 28px;
  text-decoration: none;
  color: inherit;
  border-bottom: 1px solid rgba(10,13,18,.07);
  transition: background .3s var(--ease);
  align-items: start;
}
.dch-news-item:last-child { border-bottom: none; }
.dch-news-item:hover { background: rgba(44,176,55,.028); }
@media (max-width: 600px) { .dch-news-item { grid-template-columns: 80px 1fr; padding: 18px 20px; } }

.dch-news-item__thumb {
  border-radius: 10px;
  overflow: hidden;
  aspect-ratio: 1;
  flex-shrink: 0;
}
.dch-news-item__thumb img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .8s var(--ease);
}
.dch-news-item:hover .dch-news-item__thumb img { transform: scale(1.06); }

.dch-news-item__meta {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: rgba(10,13,18,.4);
  margin-bottom: 6px;
}

.dch-news-item__body h4 {
  font-family: var(--dch-display);
  font-size: .93rem;
  font-weight: 600;
  letter-spacing: -.015em;
  line-height: 1.25;
  color: var(--dch-ink);
  margin: 0 0 5px;
  transition: color .25s var(--ease);
}
.dch-news-item:hover .dch-news-item__body h4 { color: var(--dch-accent); }
.dch-news-item__body p {
  font-size: 12.5px;
  color: rgba(10,13,18,.45);
  line-height: 1.5;
  margin: 0;
}

/* ---- Badges de categoría con colores propios ---- */
.dch-news-badge {
  display: inline-flex;
  align-items: center;
  padding: 3px 9px;
  border-radius: 5px;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
  flex-shrink: 0;
}
.dch-news-badge--resultados  { background: rgba(44,176,55,.13);  color: var(--dch-accent); }
.dch-news-badge--fichajes    { background: rgba(22,163,74,.12);  color: #16a34a; }
.dch-news-badge--eventos     { background: rgba(217,119,6,.12);  color: #d97706; }
.dch-news-badge--comunidad   { background: rgba(124,58,237,.12); color: #7c3aed; }
.dch-news-badge--comercial   { background: rgba(6,148,66,.12);  color: #069442; }
/* Badge en contexto oscuro (noticia destacada) */
.dch-news-feat .dch-news-badge--resultados  { background: rgba(77,111,255,.3); color: #a5b8ff; }

/* =====================================================
   9. JUGADORES — slider
   ===================================================== */

/* Jugadores: 4 por fila en desktop, 2 en tablet, 1 en móvil */
/* gap del track = 24px  →  (N-1)×24 px de gaps totales */
.dch-slider--players .dch-slider__track .dch-player-c {
  flex: 0 0 calc((100% - 72px) / 4); /* 3 gaps × 24px */
}
@media (max-width: 1100px) {
  .dch-slider--players .dch-slider__track .dch-player-c {
    flex: 0 0 calc((100% - 24px) / 2); /* 1 gap × 24px */
  }
}
@media (max-width: 580px) {
  .dch-slider--players .dch-slider__track .dch-player-c {
    flex: 0 0 100%;
  }
}

/* ─ Flechas sobre fondo paper-2 ─ heredadas del bloque anterior ─ */

.dch-player-c {
  scroll-snap-align: none;
  background: var(--dch-paper); color: var(--dch-ink);
  border-radius: var(--dch-radius);
  padding: 26px 24px; text-decoration: none;
  border: 1px solid transparent;
  box-shadow: 0 0 0 1px var(--dch-line-ink);
  display: flex; flex-direction: column; gap: 16px;
  transition:
    transform .45s var(--ease),
    box-shadow .45s var(--ease);
  flex-shrink: 0;
}
.dch-player-c:hover {
  transform: translateY(-6px);
  box-shadow:
    0 0 0 1.5px var(--dch-accent),
    0 20px 50px -12px rgba(0,0,0,.2),
    0 0 24px -6px rgba(44,176,55,.18);
}
.dch-player-c__head { display: flex; align-items: center; gap: 14px; }
.dch-player-c__avatar {
  width: 56px; height: 56px; border-radius: 50%; object-fit: cover;
  border: 2px solid var(--dch-paper-2);
}
.dch-player-c__head h3 {
  font-family: var(--dch-display); font-weight: 500; font-size: 1.15rem;
  margin: 0 0 2px; letter-spacing: -.01em; color: var(--dch-ink);
}
.dch-player-c__head span { font-size: 12.5px; color: var(--dch-muted-ink); }
.dch-player-c__status {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase;
  font-weight: 600;
}
.dch-player-c__status::before {
  content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--dch-accent);
}
.dch-player-c__status.is-conclub::before { background: #2da44e; }
.dch-player-c__status.is-buscando::before { background: var(--dch-accent); }
.dch-player-c__status.is-disponible::before { background: var(--dch-accent-2); }
.dch-player-c__stats {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0;
  padding-top: 16px; border-top: 1px solid var(--dch-line-ink);
}
.dch-player-c__stats div { padding: 4px 0; }
.dch-player-c__stats div + div { border-left: 1px solid var(--dch-line-ink); padding-left: 16px; }
.dch-player-c__stats strong {
  font-family: var(--dch-display); font-weight: 500; font-size: 1.4rem;
  display: block; line-height: 1; color: var(--dch-ink);
}
.dch-player-c__stats span { font-size: 11.5px; color: var(--dch-muted-ink); letter-spacing: .04em; }

/* =====================================================
   10. TESTIMONIO editorial
   ===================================================== */
.dch-quote {
  background: var(--dch-ink); color: var(--dch-fg);
  padding: 140px 0;
  position: relative; overflow: hidden;
}
.dch-quote::before {
  content: '“';
  position: absolute; left: 6%; top: 10%;
  font-family: var(--dch-display); font-size: 28rem; line-height: 1;
  color: rgba(44,176,55,.08); pointer-events: none;
}
.dch-quote blockquote {
  margin: 0 auto; max-width: 980px; padding: 0 28px; position: relative; z-index: 1;
}
.dch-quote p {
  font-family: var(--dch-display); font-weight: 400;
  font-size: clamp(1.6rem, 3.2vw, 2.6rem); line-height: 1.25;
  letter-spacing: -.02em; margin: 0; color: var(--dch-fg);
}
.dch-quote footer {
  display: flex; align-items: center; gap: 16px; margin-top: 40px;
  padding-top: 28px; border-top: 1px solid var(--dch-line);
}
.dch-quote footer img {
  width: 56px; height: 56px; border-radius: 50%; object-fit: cover;
}
.dch-quote footer strong {
  display: block; color: var(--dch-fg);
  font-family: var(--dch-display); font-weight: 500; font-size: 1.05rem;
}
.dch-quote footer span { color: var(--dch-muted); font-size: 13px; }

/* =====================================================
   11. SPONSORS — marquee
   ===================================================== */
.dch-sponsors { padding: 60px 0; border-top: 1px solid var(--dch-line-ink); border-bottom: 1px solid var(--dch-line-ink); background: var(--dch-paper-2); }
.dch-sponsors__lead {
  text-align: center; font-size: 12px; letter-spacing: .2em; text-transform: uppercase;
  color: var(--dch-muted-ink); margin-bottom: 36px; font-weight: 600;
}
.dch-marquee {
  overflow: hidden; mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
}
.dch-marquee__track {
  display: inline-flex; gap: 60px; align-items: center;
  white-space: nowrap;
  animation: marquee 38s linear infinite;
}
.dch-marquee:hover .dch-marquee__track { animation-play-state: paused; }
.dch-marquee__track span {
  font-family: var(--dch-display); font-weight: 500; font-size: 1.6rem;
  color: var(--dch-ink); letter-spacing: -.01em; opacity: .55;
  transition: opacity .35s var(--ease);
}
.dch-marquee__track span:hover { opacity: 1; color: var(--dch-accent); }
.dch-marquee__track .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--dch-line-ink); opacity: 1; }
@keyframes marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

/* =====================================================
   12. CTA FINAL — split panels diagonal
   ===================================================== */
.dch-cta { padding: 0; background: var(--dch-paper); }
.dch-cta__split {
  display: grid; grid-template-columns: 1fr 1fr;
  min-height: 60vh;
}
@media (max-width: 720px) { .dch-cta__split { grid-template-columns: 1fr; } }
.dch-cta__panel {
  position: relative; padding: 80px 60px;
  text-decoration: none; overflow: hidden;
  display: flex; flex-direction: column; justify-content: space-between;
  transition: all .55s var(--ease);
  isolation: isolate;
}
@media (max-width: 720px) { .dch-cta__panel { padding: 60px 28px; min-height: 50vh; } }
.dch-cta__panel--club { background: var(--dch-ink); color: var(--dch-fg); }
.dch-cta__panel--club:hover { color: var(--dch-fg); }
.dch-cta__panel--player { background: var(--dch-accent); color: #fff; }
.dch-cta__panel--player:hover { color: #fff; }
.dch-cta__panel::before {
  content: ''; position: absolute; inset: auto -20% -40% auto;
  width: 70%; aspect-ratio: 1; border-radius: 50%;
  background: rgba(255,255,255,.06); transition: transform .8s var(--ease); z-index: -1;
}
.dch-cta__panel--player::before { background: rgba(255,255,255,.12); }
.dch-cta__panel:hover::before { transform: scale(1.4); }
.dch-cta__panel:hover { padding-left: 70px; }
@media (max-width: 720px) { .dch-cta__panel:hover { padding-left: 28px; } }

.dch-cta__num {
  font-family: var(--dch-display); font-size: 14px; font-weight: 500;
  letter-spacing: .14em; opacity: .7;
}
.dch-cta__panel h3 {
  font-family: var(--dch-display); font-weight: 500;
  font-size: clamp(2.2rem, 4.5vw, 3.8rem); line-height: 1;
  letter-spacing: -.03em; margin: 24px 0 16px; color: inherit;
}
.dch-cta__panel p { font-size: 1.05rem; max-width: 36ch; opacity: .8; line-height: 1.5; margin: 0 0 32px; }
.dch-cta__go {
  display: inline-flex; align-items: center; gap: 14px;
  font-family: var(--dch-display); font-size: 1.1rem; font-weight: 500;
  letter-spacing: -.01em;
}
.dch-cta__go::after {
  content: ''; width: 36px; height: 1px; background: currentColor;
  position: relative; transition: width .4s var(--ease);
}
.dch-cta__panel:hover .dch-cta__go::after { width: 72px; }

/* Reduced motion fallbacks */
@media (prefers-reduced-motion: reduce) {
  .index-page *, .index-page *::before, .index-page *::after {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
  }
  .dch-display .line > span { transform: none !important; }
  .dch-hero__grain { display: none; }
  .dch-marquee__track { animation: none; }
}

/* =====================================================
   FOOTER — dark branded
   ===================================================== */
:is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer {
  background: var(--dch-bg);
  color: var(--dch-fg);
  border-top: 1px solid rgba(246,244,239,.08);
  padding: 0;
  box-shadow: none;
  font-family: var(--dch-text);
}

/* ---- Brand column ---- */
:is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .footer-brand {
  padding: 64px 0 48px;
  border-bottom: 1px solid rgba(246,244,239,.07);
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 32px;
  flex-wrap: wrap;
}
@media (max-width: 768px) {
  :is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .footer-brand { grid-template-columns: 1fr; gap: 24px; padding: 48px 0 36px; }
}

:is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .footer-logo {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
}
:is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .footer-logo img {
  height: 36px;
  width: auto;
  filter: brightness(0) invert(1);
}
:is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .footer-logo .sitename {
  font-family: var(--dch-display);
  font-size: 1.35rem;
  font-weight: 600;
  color: var(--dch-fg);
  margin: 0;
  letter-spacing: -.03em;
}

:is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .footer-tagline {
  margin: 14px 0 0;
  font-size: 13.5px;
  line-height: 1.6;
  color: rgba(246,244,239,.45);
  max-width: 34ch;
}

:is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .footer-socials {
  display: flex;
  gap: 10px;
  margin-top: 28px;
}
:is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .footer-socials a {
  width: 38px; height: 38px;
  border-radius: 50%;
  border: 1px solid rgba(246,244,239,.14);
  display: flex; align-items: center; justify-content: center;
  color: rgba(246,244,239,.55);
  font-size: 15px;
  text-decoration: none;
  transition: background .3s var(--ease), border-color .3s var(--ease), color .3s var(--ease), transform .3s var(--ease);
}
:is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .footer-socials a:hover {
  background: var(--dch-accent);
  border-color: var(--dch-accent);
  color: #fff;
  transform: translateY(-3px);
}

/* Tagline derecha (opcional) */
:is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .footer-brand-right {
  text-align: right;
}
@media (max-width: 768px) {
  :is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .footer-brand-right { text-align: left; }
}
:is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .footer-brand-right p {
  font-family: var(--dch-display);
  font-size: clamp(1.4rem, 3vw, 2rem);
  font-weight: 600;
  letter-spacing: -.04em;
  color: rgb(255, 255, 255);
  margin: 0;
  line-height: 1.2;
}

/* ---- Nav columns ---- */
:is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .footer-nav {
  padding: 56px 0 48px;
  border-bottom: 1px solid rgba(246,244,239,.07);
}

:is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .footer-nav h4 {
  font-family: var(--dch-display);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--dch-accent);
  margin: 0 0 20px;
  padding: 0;
}

:is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .footer-nav ul {
  list-style: none;
  padding: 0; margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

:is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .footer-nav ul li {
  font-size: 13.5px;
  color: rgba(246,244,239,.45);
  display: flex;
  align-items: center;
  gap: 7px;
}
:is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .footer-nav ul li i {
  font-size: 12px;
  color: rgba(246,244,239,.3);
  flex-shrink: 0;
}

:is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .footer-nav ul li a {
  color: rgba(246,244,239,.55);
  text-decoration: none;
  font-size: 13.5px;
  transition: color .25s var(--ease), padding-left .25s var(--ease);
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
:is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .footer-nav ul li a:hover {
  color: #fff;
  padding-left: 4px;
}

/* ---- Bottom bar ---- */
:is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .footer-bottom {
  padding: 22px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

:is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .footer-bottom .copyright {
  font-size: 12.5px;
  color: rgba(246,244,239,.3);
  margin: 0;
}

:is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .footer-bottom .credits {
  font-size: 12.5px;
  color: rgba(246,244,239,.3);
  margin: 0;
}
:is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .footer-bottom .credits a {
  color: rgba(246,244,239,.5);
  text-decoration: none;
  font-weight: 600;
  letter-spacing: .04em;
  transition: color .25s;
}
:is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .footer-bottom .credits a:hover {
  color: var(--dch-accent);
}

/* ---- Override Bootstrap default footer hr ---- */
:is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer hr {
  border-color: rgba(246,244,239,.07);
  margin: 0;
}

/* Overrides para Bootstrap social-links heredados del main.css */
:is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .social-links {
  display: none !important; /* reemplazamos con .footer-socials */
}

@media (max-width: 576px) {
  :is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .footer-nav { padding: 40px 0 32px; }
  :is(.index-page, .pj-page, .rc-page, .crear-perfil-page, .legal-page, .noticia-detalle-page) .footer .footer-bottom { flex-direction: column; align-items: flex-start; gap: 8px; }
}