/* Champions Sport · Padrón */
@font-face { font-family: "Barlow"; font-weight: 400; font-display: swap; src: url(../fonts/barlow-400.woff2) format("woff2"); }
@font-face { font-family: "Barlow"; font-weight: 500; font-display: swap; src: url(../fonts/barlow-500.woff2) format("woff2"); }
@font-face { font-family: "Barlow"; font-weight: 600; font-display: swap; src: url(../fonts/barlow-600.woff2) format("woff2"); }
@font-face { font-family: "Barlow"; font-weight: 700; font-display: swap; src: url(../fonts/barlow-700.woff2) format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-weight: 600; font-display: swap; src: url(../fonts/barlow-condensed-600.woff2) format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-weight: 800; font-display: swap; src: url(../fonts/barlow-condensed-800.woff2) format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-weight: 800; font-style: italic; font-display: swap; src: url(../fonts/barlow-condensed-800i.woff2) format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-weight: 900; font-style: italic; font-display: swap; src: url(../fonts/barlow-condensed-900i.woff2) format("woff2"); }

:root {
  --rojo: #e3061b;
  --rojo-osc: #b50516;
  --rojo-claro: #ff2a3d;
  --negro: #0b0b0c;
  --negro-2: #141416;
  --negro-3: #1d1d20;
  --gris-borde: #2a2a2e;
  --blanco: #ffffff;
  --papel: #f4f4f2;
  --tinta: #151517;
  --tinta-suave: #5d5d63;
  --texto-claro: #e9e9ec;
  --texto-claro-suave: #a3a3ab;
  --radio: 14px;
  --sombra: 0 10px 30px -12px rgb(0 0 0 / .35);
  --ancho: 1200px;
  --fuente: "Barlow", system-ui, -apple-system, "Segoe UI", sans-serif;
  --fuente-titulo: "Barlow Condensed", "Arial Narrow", sans-serif;
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 84px; -webkit-text-size-adjust: 100%; }
body {
  margin: 0; font-family: var(--fuente); font-size: 1.0625rem; line-height: 1.6;
  background: var(--negro); color: var(--texto-claro);
  -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
h1, h2, h3 { line-height: 1.05; margin: 0; }
p { margin: 0 0 1em; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.i { width: 1.2em; height: 1.2em; flex: none; }
:focus-visible { outline: 3px solid var(--rojo-claro); outline-offset: 3px; border-radius: 4px; }

.contenedor { width: 100%; max-width: var(--ancho); margin: 0 auto; padding: 0 20px; }
@media (min-width: 768px) { .contenedor { padding: 0 32px; } }

/* ---------- Logo ---------- */
.logo { display: inline-flex; align-items: center; gap: .3rem; text-decoration: none; font-family: var(--fuente-titulo); font-style: italic; font-weight: 900; font-size: 1.6rem; line-height: 1; letter-spacing: -.01em; }
.logo__caja { background: var(--rojo); color: #fff; padding: .28em .45em .22em; transform: skewX(-10deg); box-shadow: inset 0 0 0 2px rgb(255 255 255 / .12); text-shadow: 0 2px 0 rgb(0 0 0 / .35); }
.logo__sport { color: #fff; }
.logo--pie { font-size: 2rem; margin-bottom: 1rem; }

/* ---------- Cabecera ---------- */
.cabecera { position: sticky; top: 0; z-index: 50; background: rgb(11 11 12 / .86); backdrop-filter: saturate(1.4) blur(12px); -webkit-backdrop-filter: saturate(1.4) blur(12px); border-bottom: 1px solid transparent; transition: border-color .2s; }
.cabecera.scroll { border-bottom-color: var(--gris-borde); }
.cabecera__fila { display: flex; align-items: center; justify-content: space-between; height: 72px; }
.menu { display: flex; align-items: center; gap: .25rem; }
.menu a:not(.btn) { text-decoration: none; font-weight: 600; font-size: .98rem; padding: .5rem .85rem; border-radius: 999px; color: var(--texto-claro-suave); transition: color .15s, background .15s; }
.menu a:not(.btn):hover { color: #fff; background: var(--negro-3); }
.menu a[aria-current="page"] { color: #fff; }
.menu a[aria-current="page"]::after { content: ""; display: block; height: 3px; margin-top: 2px; background: var(--rojo); border-radius: 3px; transform: skewX(-20deg); }
.menu__cta { margin-left: .75rem; }
.menu-btn { display: none; background: none; border: 0; color: #fff; padding: .5rem; margin-right: -.5rem; cursor: pointer; }
.menu-btn .i { width: 28px; height: 28px; }
.menu-btn__cerrar { display: none; }
@media (max-width: 860px) {
  .menu-btn { display: block; }
  .menu { position: fixed; inset: 72px 0 auto 0; flex-direction: column; align-items: stretch; gap: 0; padding: .75rem 20px 1.5rem; background: var(--negro); border-bottom: 1px solid var(--gris-borde); transform: translateY(-8px); opacity: 0; visibility: hidden; transition: .2s; }
  .menu a:not(.btn) { padding: 1rem .25rem; border-radius: 0; font-size: 1.15rem; border-bottom: 1px solid var(--gris-borde); }
  .menu a:not(.btn):hover { background: none; }
  .menu a[aria-current="page"]::after { display: none; }
  .menu a[aria-current="page"] { color: var(--rojo-claro); }
  .menu__cta { margin: 1.25rem 0 0; justify-content: center; }
  .abierto .menu { transform: none; opacity: 1; visibility: visible; }
  .abierto .menu-btn__abrir { display: none; }
  .abierto .menu-btn__cerrar { display: inline; }
}

/* ---------- Botones ---------- */
.botones { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.75rem; }
.botones--centro { justify-content: center; }
.btn { display: inline-flex; align-items: center; gap: .55rem; padding: .9rem 1.4rem; border-radius: 10px; font-weight: 700; font-size: 1rem; text-decoration: none; border: 2px solid transparent; cursor: pointer; transition: transform .15s, background .15s, border-color .15s, color .15s; line-height: 1.1; }
.btn:hover { transform: translateY(-2px); }
.btn--peq { padding: .6rem 1rem; font-size: .95rem; }
.btn--rojo { background: var(--rojo); color: #fff; }
.btn--rojo:hover { background: var(--rojo-claro); }
.btn--claro { background: rgb(255 255 255 / .1); color: #fff; border-color: rgb(255 255 255 / .35); backdrop-filter: blur(6px); }
.btn--claro:hover { background: rgb(255 255 255 / .2); }
.btn--blanco { background: #fff; color: var(--rojo-osc); }
.btn--borde-claro { color: #fff; border-color: rgb(255 255 255 / .6); }
.btn--borde-claro:hover { background: rgb(255 255 255 / .12); }
.btn--borde { color: inherit; border-color: currentColor; }
.btn--borde:hover { background: rgb(127 127 127 / .12); }
.enlace-flecha { display: inline-flex; align-items: center; gap: .4rem; font-weight: 700; text-decoration: none; color: var(--rojo-claro); }
.enlace-flecha .i { transition: transform .15s; }
.enlace-flecha:hover .i { transform: translateX(4px); }

/* ---------- Tipografía ---------- */
.antetitulo { font-family: var(--fuente-titulo); font-weight: 800; font-style: italic; text-transform: uppercase; letter-spacing: .08em; font-size: .95rem; color: var(--rojo-claro); margin-bottom: .6rem; }
.antetitulo--claro { color: #fff; opacity: .9; }
.titulo { font-family: var(--fuente-titulo); font-weight: 800; font-style: italic; text-transform: uppercase; font-size: clamp(2rem, 4.5vw, 3rem); letter-spacing: -.005em; margin-bottom: 1rem; }
.titulo--grande { font-size: clamp(2.4rem, 6vw, 4.2rem); }
.texto-suave { color: var(--texto-claro-suave); }
.prosa { color: var(--texto-claro-suave); font-size: 1.08rem; }
.prosa p:last-child { margin-bottom: 0; }
.prosa strong { color: var(--texto-claro); }
.prosa ul { padding-left: 1.2rem; }

/* ---------- Hero ---------- */
.hero { position: relative; min-height: min(88vh, 760px); display: flex; align-items: flex-end; overflow: hidden; isolation: isolate; }
.hero__fondo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transform: scale(1.04); }
.hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgb(11 11 12 / .25) 0%, rgb(11 11 12 / .55) 45%, var(--negro) 100%), linear-gradient(90deg, rgb(11 11 12 / .8) 0%, transparent 70%); }
.hero__texto { padding-top: 6rem; padding-bottom: 4.5rem; max-width: var(--ancho); }
.hero__titulo { font-family: var(--fuente-titulo); font-style: italic; font-weight: 900; text-transform: uppercase; font-size: clamp(3rem, 10vw, 7rem); line-height: .9; letter-spacing: -.01em; max-width: 11ch; text-shadow: 0 4px 30px rgb(0 0 0 / .4); }
.hero__sub { font-size: clamp(1.05rem, 1.6vw, 1.25rem); max-width: 40rem; margin-top: 1.25rem; color: #ddd; }

/* ---------- Cifras ---------- */
.cifras { background: var(--rojo); color: #fff; position: relative; }
.cifras__fila { display: grid; grid-template-columns: repeat(4, 1fr); }
.cifras__fila > div { padding: 1.4rem .5rem; text-align: center; display: flex; flex-direction: column; }
.cifras__fila > div + div { border-left: 1px solid rgb(255 255 255 / .25); }
.cifras strong { font-family: var(--fuente-titulo); font-style: italic; font-weight: 900; font-size: clamp(1.8rem, 4vw, 2.8rem); line-height: 1; }
.cifras span { font-weight: 600; font-size: .9rem; opacity: .9; text-transform: uppercase; letter-spacing: .04em; margin-top: .3rem; }
@media (max-width: 600px) {
  .cifras__fila { grid-template-columns: repeat(2, 1fr); }
  .cifras__fila > div:nth-child(3) { border-left: 0; }
  .cifras__fila > div:nth-child(n+3) { border-top: 1px solid rgb(255 255 255 / .25); }
}

/* ---------- Secciones ---------- */
.seccion { padding: clamp(4rem, 8vw, 6.5rem) 0; }
.seccion--compacta { padding: 0 0 clamp(3rem, 6vw, 5rem); }
.seccion--oscura { background: var(--negro-2); }
.seccion--sin-arriba { padding-top: 0; }
.cabecera-seccion { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem 2rem; flex-wrap: wrap; margin-bottom: 2.25rem; }
.cabecera-seccion .titulo { margin-bottom: 0; }
.cabecera-seccion--centro { justify-content: center; text-align: center; }
.cabecera-seccion--centro .texto-suave { margin: 1rem auto 0; max-width: 34rem; }
.dos-col { display: grid; gap: 3rem; align-items: center; }
@media (min-width: 900px) { .dos-col { grid-template-columns: 1fr 1fr; gap: 4.5rem; } }
.dos-col .enlace-flecha { margin-top: 1.5rem; }
.foto-marco { position: relative; }
.foto-marco img { border-radius: var(--radio); aspect-ratio: 4/3; object-fit: cover; width: 100%; box-shadow: var(--sombra); }
.foto-marco::before { content: ""; position: absolute; inset: 1.25rem -1.25rem -1.25rem 1.25rem; border: 3px solid var(--rojo); border-radius: var(--radio); z-index: -1; transform: skewX(-4deg); }
@media (max-width: 600px) { .foto-marco::before { inset: .75rem -.6rem -.75rem .6rem; } }

.cabecera-pagina { position: relative; padding: clamp(4rem, 10vw, 7rem) 0 clamp(2.5rem, 5vw, 3.5rem); background: linear-gradient(180deg, rgb(11 11 12 / .55), var(--negro)), var(--fondo) center / cover no-repeat; }
.cabecera-pagina .titulo { max-width: 18ch; margin-bottom: .75rem; }
.cabecera-pagina__sub { color: #d6d6da; font-size: 1.15rem; max-width: 40rem; margin: 0; }
.cabecera-pagina--tienda { padding-bottom: 2.5rem; }
.subnav { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: 1.75rem; }
.subnav a { text-decoration: none; font-weight: 600; padding: .45rem 1rem; border: 1px solid rgb(255 255 255 / .3); border-radius: 999px; font-size: .95rem; backdrop-filter: blur(6px); background: rgb(0 0 0 / .25); }
.subnav a:hover { border-color: var(--rojo); background: var(--rojo); }

/* ---------- Actividades ---------- */
.rejilla-actividades { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }
.actividad { display: flex; gap: 1rem; align-items: flex-start; padding: 1.25rem; border-radius: var(--radio); background: var(--negro-3); border: 1px solid var(--gris-borde); transition: border-color .2s, transform .2s; }
.actividad:hover { border-color: var(--rojo); transform: translateY(-2px); }
.seccion--oscura .actividad { background: var(--negro); }
.actividad__icono { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 12px; background: var(--rojo); color: #fff; flex: none; transform: skewX(-6deg); }
.actividad__icono .i { width: 24px; height: 24px; transform: skewX(6deg); }
.actividad__nombre { font-family: var(--fuente-titulo); font-weight: 800; font-size: 1.35rem; text-transform: uppercase; font-style: italic; margin-bottom: .3rem; }
.actividad p { margin: 0; color: var(--texto-claro-suave); font-size: .98rem; line-height: 1.5; }
.rejilla-actividades--tarjetas .actividad { flex-direction: column; padding: 1.5rem; }

/* ---------- Banner tienda ---------- */
.banner-tienda { position: relative; padding: clamp(5rem, 10vw, 8rem) 0; overflow: hidden; isolation: isolate; }
.banner-tienda__fondo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.banner-tienda::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgb(11 11 12 / .95) 0%, rgb(11 11 12 / .8) 45%, rgb(227 6 27 / .35) 100%); }
.banner-tienda__texto { max-width: var(--ancho); }
.banner-tienda__texto > p { max-width: 36rem; color: #ddd; font-size: 1.1rem; }
.marcas { list-style: none; padding: 0; margin: 1.5rem 0 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.marcas li { font-family: var(--fuente-titulo); font-weight: 800; font-style: italic; text-transform: uppercase; letter-spacing: .03em; border: 1px solid rgb(255 255 255 / .35); padding: .35rem .8rem; border-radius: 6px; font-size: .95rem; background: rgb(0 0 0 / .3); }
.banner-tienda .btn { margin-top: 2rem; }

/* ---------- Productos ---------- */
.rejilla-productos { display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); }
@media (max-width: 520px) { .rejilla-productos { grid-template-columns: repeat(2, 1fr); gap: .75rem; } }
.tarjeta-prod { background: #fff; color: var(--tinta); border-radius: var(--radio); overflow: hidden; box-shadow: 0 1px 2px rgb(0 0 0 / .08); transition: transform .2s, box-shadow .2s; }
.tarjeta-prod:hover { transform: translateY(-4px); box-shadow: var(--sombra); }
.tarjeta-prod__enlace { display: flex; flex-direction: column; height: 100%; text-decoration: none; }
.tarjeta-prod__foto { position: relative; aspect-ratio: 1; background: #eee; }
.tarjeta-prod__foto img { width: 100%; height: 100%; object-fit: cover; }
.tarjeta-prod--agotado .tarjeta-prod__foto img { filter: grayscale(1); opacity: .6; }
.tarjeta-prod__cuerpo { padding: .9rem 1rem 1.1rem; display: flex; flex-direction: column; flex: 1; }
.tarjeta-prod__marca { font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--rojo); }
.tarjeta-prod__nombre { font-size: 1.02rem; font-weight: 600; line-height: 1.3; margin: .2rem 0 .6rem; flex: 1; }
.sin-foto { display: grid; place-items: center; width: 100%; height: 100%; color: #bbb; }
.sin-foto .i { width: 30%; height: 30%; }
.etiquetas { position: absolute; top: .6rem; left: .6rem; display: flex; gap: .35rem; flex-wrap: wrap; }
.etq { font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: .25rem .55rem; border-radius: 6px; background: var(--negro); color: #fff; }
.etq--rojo { background: var(--rojo); }
.etq--gris { background: #6b6b70; }
.precio { margin: 0; display: flex; align-items: baseline; gap: .5rem; flex-wrap: wrap; }
.precio__actual { font-family: var(--fuente-titulo); font-weight: 800; font-size: 1.45rem; line-height: 1; }
.precio__actual--oferta { color: var(--rojo); }
.precio__antes { color: var(--tinta-suave); font-size: .95rem; }
.precio__consultar { font-weight: 600; color: var(--tinta-suave); }

.rejilla-categorias { display: grid; gap: .75rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); }
.categoria-chip { display: flex; flex-direction: column; text-decoration: none; padding: 1.1rem 1.25rem; border-radius: var(--radio); border: 1px solid var(--gris-borde); background: var(--negro-2); transition: border-color .2s, background .2s; position: relative; overflow: hidden; }
.categoria-chip::after { content: "→"; position: absolute; right: 1.1rem; top: 50%; transform: translateY(-50%); color: var(--rojo-claro); font-weight: 700; transition: transform .2s; }
.categoria-chip:hover { border-color: var(--rojo); background: var(--negro-3); }
.categoria-chip:hover::after { transform: translate(4px, -50%); }
.categoria-chip strong { font-family: var(--fuente-titulo); font-style: italic; font-weight: 800; text-transform: uppercase; font-size: 1.2rem; }
.categoria-chip span { color: var(--texto-claro-suave); font-size: .9rem; }

/* ---------- Tienda (fondo claro) ---------- */
.seccion--tienda { background: var(--papel); color: var(--tinta); color-scheme: light; }
.seccion--tienda .titulo { color: var(--tinta); }
.seccion--tienda .prosa { color: var(--tinta-suave); }
.seccion--tienda .prosa strong { color: var(--tinta); }
.seccion--tienda .antetitulo { color: var(--rojo); }
.aviso { background: var(--negro-2); border-bottom: 1px solid var(--gris-borde); }
.aviso__fila { display: flex; gap: .85rem; align-items: center; padding-top: 1rem; padding-bottom: 1rem; }
.aviso__fila .i { color: var(--rojo-claro); width: 26px; height: 26px; }
.aviso p { margin: 0; font-size: .98rem; color: var(--texto-claro-suave); }
.tienda { display: grid; gap: 2rem; }
@media (min-width: 900px) { .tienda { grid-template-columns: 250px 1fr; gap: 2.5rem; align-items: start; } .tienda__filtros { position: sticky; top: 96px; } }
.buscador { display: flex; background: #fff; border: 1px solid #ddd; border-radius: 10px; overflow: hidden; }
.buscador:focus-within { border-color: var(--rojo); box-shadow: 0 0 0 3px rgb(227 6 27 / .15); }
.buscador input { flex: 1; min-width: 0; border: 0; padding: .8rem 1rem; font: inherit; font-size: 1rem; background: none; color: var(--tinta); outline: none; }
.buscador button { border: 0; background: none; padding: 0 .9rem; color: var(--tinta-suave); cursor: pointer; }
.lista-categorias { display: flex; flex-direction: column; margin-top: 1.25rem; }
.lista-categorias a { display: flex; justify-content: space-between; text-decoration: none; padding: .6rem .8rem; border-radius: 8px; font-weight: 600; color: var(--tinta-suave); }
.lista-categorias a span { color: #999; font-weight: 500; }
.lista-categorias a:hover { background: #fff; color: var(--tinta); }
.lista-categorias a[aria-current="page"] { background: var(--rojo); color: #fff; }
.lista-categorias a[aria-current="page"] span { color: rgb(255 255 255 / .8); }
.lista-categorias hr { border: 0; border-top: 1px solid #ddd; width: 100%; margin: .5rem 0; }
@media (max-width: 899px) {
  .lista-categorias { flex-direction: row; overflow-x: auto; gap: .4rem; margin: 1rem -20px 0; padding: 0 20px .25rem; scrollbar-width: none; }
  .lista-categorias::-webkit-scrollbar { display: none; }
  .lista-categorias a { flex: none; background: #fff; border: 1px solid #e3e3e3; border-radius: 999px; padding: .45rem .9rem; gap: .4rem; }
  .lista-categorias hr { display: none; }
}
.tienda__barra { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.25rem; }
.tienda__barra > p { margin: 0; color: var(--tinta-suave); font-weight: 600; }
.orden { display: flex; align-items: center; gap: .5rem; font-size: .95rem; color: var(--tinta-suave); }
.orden select { font: inherit; padding: .5rem .75rem; border-radius: 8px; border: 1px solid #ddd; background: #fff; color: var(--tinta); }
.vacio { text-align: center; padding: 4rem 1rem; color: var(--tinta-suave); background: #fff; border-radius: var(--radio); }
.vacio .i { width: 48px; height: 48px; margin: 0 auto 1rem; color: #ccc; }
.vacio a { color: var(--rojo); font-weight: 600; }

/* ---------- Ficha de producto ---------- */
.seccion--producto { padding-top: 2rem; }
.migas { font-size: .92rem; color: var(--tinta-suave); margin-bottom: 1.5rem; display: flex; flex-wrap: wrap; gap: .4rem; }
.migas a { color: var(--tinta-suave); text-decoration: none; font-weight: 600; }
.migas a:hover { color: var(--rojo); }
.migas [aria-current] { color: var(--tinta); }
.ficha { display: grid; gap: 2rem; }
@media (min-width: 900px) { .ficha { grid-template-columns: 1.05fr 1fr; gap: 3.5rem; align-items: start; } .ficha__fotos { position: sticky; top: 96px; } }
.ficha__principal { position: relative; background: #fff; border-radius: var(--radio); overflow: hidden; aspect-ratio: 1; }
.ficha__principal img { width: 100%; height: 100%; object-fit: contain; }
.ficha__miniaturas { display: flex; gap: .6rem; margin-top: .75rem; overflow-x: auto; }
.ficha__miniaturas button { flex: none; width: 76px; height: 76px; padding: 0; border: 2px solid transparent; border-radius: 10px; overflow: hidden; cursor: pointer; background: #fff; }
.ficha__miniaturas button[aria-current] { border-color: var(--rojo); }
.ficha__miniaturas img { width: 100%; height: 100%; object-fit: cover; }
.ficha__nombre { font-family: var(--fuente-titulo); font-weight: 800; font-style: italic; text-transform: uppercase; font-size: clamp(2rem, 4vw, 2.9rem); margin-bottom: .75rem; }
.ficha__resumen { font-size: 1.15rem; color: var(--tinta-suave); }
.ficha__precio .precio__actual { font-size: 2.4rem; }
.ficha__precio .precio__antes { font-size: 1.15rem; }
.ficha__datos { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: .75rem; margin: 1.5rem 0; }
.ficha__datos div { background: #fff; border-radius: 10px; padding: .7rem 1rem; }
.ficha__datos dt { font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--tinta-suave); }
.ficha__datos dd { margin: 0; font-weight: 600; }
.variantes__titulo { font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--tinta-suave); margin-bottom: .5rem; }
.variantes ul { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: .45rem; }
.variantes li { border: 1px solid #d5d5d5; background: #fff; border-radius: 8px; padding: .4rem .8rem; font-weight: 600; font-size: .95rem; }
.ficha__disponible { display: flex; gap: .9rem; align-items: center; margin-top: 1.75rem; padding: 1rem 1.15rem; border-radius: 12px; background: #e9f7ee; color: #14532d; }
.ficha__disponible .i { width: 28px; height: 28px; }
.ficha__disponible div { display: flex; flex-direction: column; line-height: 1.35; }
.ficha__disponible span { font-size: .95rem; opacity: .85; }
.ficha__disponible--no { background: #f3f3f3; color: var(--tinta-suave); }
.ficha .botones { margin-top: 1.25rem; }
.ficha__descripcion { margin-top: 2.25rem; padding-top: 2rem; border-top: 1px solid #ddd; }

/* ---------- Persona ---------- */
.persona { display: grid; gap: 2.5rem; align-items: center; }
@media (min-width: 900px) { .persona { grid-template-columns: 420px 1fr; gap: 4rem; } }
.persona__foto { position: relative; max-width: 420px; }
.persona__foto img { border-radius: var(--radio); aspect-ratio: 1; object-fit: cover; width: 100%; }
.persona__foto::after { content: ""; position: absolute; left: -12px; bottom: -12px; width: 45%; height: 45%; background: var(--rojo); border-radius: var(--radio); z-index: -1; }
.persona__foto { isolation: isolate; }
.logros { list-style: none; padding: 0; margin: 1.75rem 0 0; display: grid; gap: .5rem; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
.logros li { display: flex; gap: .6rem; align-items: center; font-weight: 600; padding: .65rem .9rem; border-radius: 10px; background: var(--negro); border: 1px solid var(--gris-borde); }
.logros .i { color: var(--rojo-claro); }

/* ---------- Tarifas ---------- */
.rejilla-tarifas { display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); align-items: stretch; }
.tarifa { position: relative; display: flex; flex-direction: column; padding: 2rem 1.5rem 1.5rem; border-radius: var(--radio); background: var(--negro-2); border: 1px solid var(--gris-borde); }
.tarifa--destacada { border: 2px solid var(--rojo); background: linear-gradient(180deg, rgb(227 6 27 / .14), var(--negro-2) 60%); }
.tarifa__sello { position: absolute; top: -.85rem; left: 1.5rem; background: var(--rojo); color: #fff; font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; padding: .3rem .7rem; border-radius: 6px; }
.tarifa__nombre { font-family: var(--fuente-titulo); font-weight: 800; font-style: italic; text-transform: uppercase; font-size: 1.5rem; }
.tarifa__precio { margin: .75rem 0 1.25rem; }
.tarifa__precio strong { font-family: var(--fuente-titulo); font-weight: 900; font-style: italic; font-size: 2.8rem; line-height: 1; }
.tarifa__precio span { color: var(--texto-claro-suave); font-weight: 600; }
.tarifa ul { list-style: none; padding: 0; margin: 0 0 1.75rem; display: grid; gap: .6rem; flex: 1; color: var(--texto-claro-suave); }
.tarifa li { display: flex; gap: .55rem; align-items: flex-start; line-height: 1.4; }
.tarifa li .i { color: var(--rojo-claro); margin-top: .1em; }
.tarifa .btn { justify-content: center; }

/* ---------- Galería ---------- */
.mosaico { display: grid; gap: .75rem; grid-template-columns: repeat(2, 1fr); grid-auto-rows: 200px; }
@media (min-width: 800px) { .mosaico { grid-template-columns: repeat(4, 1fr); grid-auto-rows: 220px; } .mosaico figure:first-child { grid-column: span 2; grid-row: span 2; } }
.mosaico figure:first-child { grid-column: span 2; }
.galeria { display: grid; gap: .75rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); grid-auto-rows: 220px; }
.mosaico figure, .galeria figure { margin: 0; position: relative; border-radius: 12px; overflow: hidden; background: var(--negro-3); }
.mosaico img, .galeria img { width: 100%; height: 100%; object-fit: cover; cursor: zoom-in; transition: transform .4s; }
.mosaico figure:hover img, .galeria figure:hover img { transform: scale(1.05); }
.mosaico figcaption, .galeria figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 2rem .9rem .7rem; background: linear-gradient(transparent, rgb(0 0 0 / .75)); font-weight: 600; font-size: .95rem; pointer-events: none; }
.visor { padding: 0; border: 0; background: none; max-width: 94vw; max-height: 92vh; }
.visor::backdrop { background: rgb(0 0 0 / .88); }
.visor img { max-width: 94vw; max-height: 92vh; object-fit: contain; border-radius: 8px; cursor: zoom-out; }

/* ---------- CTA final ---------- */
.cta-final__caja { display: grid; gap: 2rem; padding: clamp(2rem, 5vw, 3.5rem); border-radius: calc(var(--radio) * 1.5); background: linear-gradient(120deg, var(--rojo) 0%, var(--rojo-osc) 100%); color: #fff; position: relative; overflow: hidden; }
.cta-final__caja::after { content: "CHAMPIONS"; position: absolute; right: -1rem; bottom: -2.5rem; font-family: var(--fuente-titulo); font-weight: 900; font-style: italic; font-size: 9rem; line-height: 1; color: rgb(255 255 255 / .07); pointer-events: none; }
@media (min-width: 900px) { .cta-final__caja { grid-template-columns: 1.4fr 1fr; align-items: center; } }
.cta-final__caja .titulo { margin-bottom: .5rem; }
.cta-final__caja p { font-size: 1.1rem; max-width: 32rem; }
.cta-final__horario { background: rgb(0 0 0 / .2); border-radius: var(--radio); padding: 1.5rem; position: relative; z-index: 1; }
.cta-final__horario h3 { font-family: var(--fuente-titulo); font-weight: 800; font-style: italic; text-transform: uppercase; font-size: 1.4rem; margin-bottom: .75rem; }
.cta-final__horario .horario dt { color: rgb(255 255 255 / .85); }

/* ---------- Horario ---------- */
.horario { margin: 0; display: grid; gap: .45rem; }
.horario div { display: flex; justify-content: space-between; gap: 1rem; border-bottom: 1px dashed rgb(255 255 255 / .18); padding-bottom: .45rem; }
.horario div:last-child { border-bottom: 0; }
.horario dt { color: var(--texto-claro-suave); }
.horario dd { margin: 0; font-weight: 700; text-align: right; white-space: nowrap; }

/* ---------- Contacto ---------- */
.contacto { display: grid; gap: 2.5rem; }
@media (min-width: 900px) { .contacto { grid-template-columns: 1fr 1.3fr; align-items: start; } }
.contacto__datos { display: grid; gap: .75rem; }
.contacto__item { display: flex; gap: 1rem; align-items: center; padding: 1rem 1.15rem; border-radius: var(--radio); background: var(--negro-2); border: 1px solid var(--gris-borde); text-decoration: none; transition: border-color .2s; }
.contacto__item:hover { border-color: var(--rojo); }
.contacto__item > span:last-child { display: flex; flex-direction: column; color: var(--texto-claro-suave); line-height: 1.35; overflow-wrap: anywhere; }
.contacto__item strong { color: #fff; font-size: 1.05rem; }
.contacto__horario { padding: 1.25rem 1.15rem; border-radius: var(--radio); background: var(--negro-2); border: 1px solid var(--gris-borde); margin-top: .5rem; }
.contacto__mapa iframe { width: 100%; aspect-ratio: 4/3; min-height: 320px; border: 0; border-radius: var(--radio); background: var(--negro-3); filter: grayscale(.2); }
.contacto__mapa .enlace-flecha { margin-top: 1rem; }

/* ---------- 404 ---------- */
.error404 { text-align: center; }
.error404__codigo { font-family: var(--fuente-titulo); font-weight: 900; font-style: italic; font-size: clamp(6rem, 20vw, 11rem); line-height: 1; color: var(--rojo); margin: 0; }

/* ---------- Pie ---------- */
.pie { background: #070708; border-top: 4px solid var(--rojo); padding-top: 4rem; color: var(--texto-claro-suave); font-size: .98rem; }
.pie a { text-decoration: none; }
.pie a:hover { color: #fff; }
.pie__rejilla { display: grid; gap: 2.5rem; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); }
.pie__titulo { font-family: var(--fuente-titulo); font-weight: 800; font-style: italic; text-transform: uppercase; font-size: 1.2rem; color: #fff; margin-bottom: 1rem; letter-spacing: .02em; }
.pie__lema { max-width: 18rem; }
.pie__enlaces { list-style: none; padding: 0; margin: 0; display: grid; gap: .45rem; }
.redes { display: flex; gap: .5rem; }
.redes a { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 10px; background: var(--negro-3); color: #fff; transition: background .15s; }
.redes a:hover { background: var(--rojo); }
.pie__legal { display: flex; justify-content: space-between; flex-wrap: wrap; gap: .5rem 1.5rem; margin-top: 3rem; padding-top: 1.5rem; padding-bottom: 1.5rem; border-top: 1px solid var(--gris-borde); font-size: .88rem; }
.pie__legal a { color: #fff; }

/* ---------- WhatsApp flotante ---------- */
.wa-flotante { position: fixed; right: 18px; bottom: 18px; z-index: 40; width: 58px; height: 58px; border-radius: 50%; display: grid; place-items: center; background: #25d366; color: #fff; box-shadow: 0 8px 24px rgb(0 0 0 / .35); transition: transform .2s; }
.wa-flotante:hover { transform: scale(1.08); }
.wa-flotante .i { width: 30px; height: 30px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; scroll-behavior: auto !important; }
}

/* La fila desplazable de categorías no debe ensanchar la columna en móvil */
.tienda > * { min-width: 0; }
.seccion--tienda:not(.seccion--producto):not(.seccion--sin-arriba) { padding-top: 2.5rem; }