/* ============================================================
   FUNDACIÓN BANÚS · 2º OPEN DE ALOHA · TORNEO JUNIOR (evento)
   Solo maquetación de esta página. Ni un color ni un cuerpo se
   definen aquí: todo sale de los tokens del sistema. La página vive
   en superficie negra por defecto y la sección de categorías cae a
   arena sin tocar ni un componente.

   A diferencia del Festival de Ópera —que trae fotografía de escena a
   sangre completa—, aquí la pieza gráfica es el propio cartel del
   torneo, un formato vertical. En vez de recortarlo a un hero
   apaisado, se muestra entero y enmarcado a la derecha del rótulo:
   como una agenda presenta cada cita con su cartel, pero a tamaño de
   portada. El texto a la izquierda da a la página su propio título y
   sus datos; el cartel, la imagen de marca del evento.
   ============================================================ */

/* ============================================================
   HERO · RÓTULO + CARTEL
   Rótulo y datos a la izquierda con el margen de la página; el cartel
   entero, enmarcado, a la derecha. Todo sobre el negro cálido.
   ============================================================ */
.golf-hero {
  background: var(--fb-negro-calido);
  border-bottom: var(--linea) solid var(--borde);
}

.golf-hero__contenido {
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-pad);
  padding-block: var(--space-2xl) var(--space-xl);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 360px);
  column-gap: var(--space-2xl);
  row-gap: var(--space-xl);
  align-items: center;
}

.golf-hero .eyebrow { color: var(--fb-blanco-roto); opacity: 0.85; }

.golf-hero__titulo {
  font-family: var(--font-display);
  font-weight: var(--fw-thin);
  font-size: clamp(2.5rem, 8vw, 6rem);
  line-height: var(--lh-apretado);
  letter-spacing: var(--track-hero);
  text-transform: uppercase;
  color: var(--fb-blanco-roto);
  margin: var(--space-md) 0 0;
}

.golf-hero__subtitulo {
  font-family: var(--font-editorial);
  font-weight: var(--fw-regular);
  font-size: var(--text-display);
  line-height: var(--lh-titulo);
  color: var(--acento-display);
  margin: var(--space-sm) 0 0;
}

.golf-hero__sede {
  font-size: var(--text-menor);
  font-weight: var(--fw-lectura);
  letter-spacing: var(--track-eyebrow);
  text-transform: uppercase;
  color: var(--fb-blanco-roto);
  opacity: 0.78;
  margin: var(--space-lg) 0 0;
}

/* El cartel del torneo, entero y enmarcado. Filete fino del sistema,
   sin sombra difusa (estética editorial de filos rectos). La imagen es
   vertical: se muestra completa, nunca recortada. */
.golf-hero__cartel {
  margin: 0;
  border: var(--linea) solid var(--borde);
  background: var(--surface-panel);
  overflow: hidden;
}

.golf-hero__cartel img {
  display: block;
  width: 100%;
  height: auto;
}

/* Pie del hero: etiqueta de categoría y línea de cuándo/qué, bajo el
   rótulo, en la columna de texto. */
.golf-hero__pie {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-sm) var(--space-md);
  margin-top: var(--space-xl);
  padding-top: var(--space-lg);
  border-top: var(--linea) solid var(--borde);
}

.golf-hero__cuando {
  font-size: var(--text-cuerpo);
  font-weight: var(--fw-lectura);
  color: var(--fb-blanco-roto);
  margin: 0;
}

.golf-hero__cuando b {
  font-weight: var(--fw-medium);
  color: var(--fb-blanco-roto);
}

/* ============================================================
   INTRODUCCIÓN + FICHA DE DATOS
   La entradilla del torneo a la izquierda, la ficha de datos duros a
   la derecha: mismo reparto asimétrico que el Festival y "Quiénes
   somos".
   ============================================================ */
.intro {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  column-gap: var(--space-2xl);
  row-gap: var(--space-xl);
  align-items: start;
}

.intro__lead {
  font-family: var(--font-editorial);
  font-weight: var(--fw-regular);
  font-size: clamp(1.5rem, 2.4vw, 2.125rem);
  line-height: var(--lh-lead);
  color: var(--texto);
  margin: 0;
  text-wrap: balance;
}

.intro__texto { margin: var(--space-lg) 0 0; }
.intro__texto .cuerpo + .cuerpo { margin-top: var(--space-sm); }

/* ============================================================
   LAS DOS CATEGORÍAS (superficie arena)
   No es una tabla de precios: dos fichas editoriales, una por
   recorrido. Recorrido (Bodoni) e importe (Deuterium fina, en el
   acento) comparten línea base; la nota, debajo, en versalita. Fichas
   contenidas, no bloques enormes: el importe acompaña, no grita.
   ============================================================ */
.golf-cats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-lg);
  margin-top: var(--space-2xl);
}

.golf-cat {
  border: var(--linea) solid var(--borde);
  padding: clamp(1.25rem, 2.5vw, var(--space-lg));
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: baseline;
  column-gap: var(--space-md);
  row-gap: var(--space-2xs);
  transition: border-color var(--dur-media) var(--ease);
}

.golf-cat:hover { border-color: var(--borde-fuerte); }

.golf-cat__recorrido {
  font-family: var(--font-editorial);
  font-weight: var(--fw-regular);
  font-size: var(--text-lead);
  line-height: var(--lh-titulo);
  color: var(--texto);
  margin: 0;
}

.golf-cat__precio {
  font-family: var(--font-display);
  font-weight: var(--fw-thin);
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  line-height: 1;
  color: var(--acento-display);
  margin: 0;
  justify-self: end;
}

.golf-cat__nota {
  grid-column: 1 / -1;
  font-size: var(--text-micro);
  letter-spacing: var(--track-eyebrow);
  text-transform: uppercase;
  color: var(--texto-tenue);
  margin: 0;
}

/* Requisitos: ficha en clave de colofón, separada de las fichas por su
   propio rótulo y un buen respiro para que no se lea pegada a ellas. */
.golf-requisitos {
  margin: var(--space-md) 0 0;
}

/* ============================================================
   CIERRE · INSCRIPCIÓN
   La llamada final, sobre negro: cómo apuntarse, el contacto y la
   línea de organizadores como pie de cartel. Sin caja: directamente
   sobre la superficie, como el cierre del Festival.
   ============================================================ */
.inscripcion__estado {
  margin: var(--space-lg) 0 0;
}

.inscripcion__lead {
  font-family: var(--font-editorial);
  font-weight: var(--fw-regular);
  font-size: clamp(1.375rem, 2.1vw, 1.875rem);
  line-height: var(--lh-lead);
  color: var(--texto-editorial);
  max-width: var(--medida);
  margin: var(--space-lg) 0 0;
  text-wrap: balance;
}

.inscripcion__ficha {
  margin-top: var(--space-2xl);
  max-width: 42rem;
}

.inscripcion__acciones {
  margin-top: var(--space-2xl);
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md) var(--space-lg);
  align-items: center;
}

/* Organizadores y hashtag: una línea fina de instituciones separada
   por puntos medios. Cierra la página como el pie del cartel. */
.organizadores {
  margin: var(--space-2xl) 0 0;
  padding-top: var(--space-lg);
  border-top: var(--linea) solid var(--borde);
  font-size: var(--text-micro);
  letter-spacing: var(--track-eyebrow);
  text-transform: uppercase;
  color: var(--texto-tenue);
  line-height: 1.9;
}

/* ============================================================
   FICHA DE DATOS (común: intro, requisitos y cierre)
   Reglas finas, pares etiqueta-valor, cifras/datos en Public Sans
   light. Idéntica en espíritu a .dotacion de las bases y del
   Festival; se define aquí para que la página no dependa de otra hoja.
   ============================================================ */
.dotacion { margin: 0; padding: 0; }

.dotacion__dato {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--space-md);
  align-items: baseline;
  padding-block: var(--space-sm);
}

.dotacion__dato + .dotacion__dato {
  border-top: var(--linea) solid var(--borde);
}

.dotacion dt {
  font-size: var(--text-micro);
  letter-spacing: var(--track-eyebrow);
  text-transform: uppercase;
  color: var(--texto-tenue);
}

.dotacion dd {
  margin: 0;
  font-family: var(--font-texto);
  /* Public Sans siempre en 200: la voz de lectura del sistema. */
  font-weight: var(--fw-lectura);
  font-size: var(--text-lead);
  line-height: 1.3;
  color: var(--texto);
  text-align: right;
}

.dotacion__dato--menor dd {
  font-size: var(--text-cuerpo);
  color: var(--texto-tenue);
}

/* ============================================================
   TABLETA Y MÓVIL
   ============================================================ */
@media (max-width: 900px) {
  /* El cartel baja bajo el texto y se centra, sin estirarse a todo el
     ancho: un póster gigante rompería el ritmo del encabezado. */
  .golf-hero__contenido {
    grid-template-columns: minmax(0, 1fr);
    row-gap: var(--space-xl);
  }
  .golf-hero__cartel {
    max-width: 300px;
    justify-self: start;
  }

  .intro {
    grid-template-columns: minmax(0, 1fr);
    row-gap: var(--space-lg);
  }
}

@media (max-width: 640px) {
  .golf-cats { grid-template-columns: minmax(0, 1fr); }

  .dotacion__dato {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-3xs);
  }
  .dotacion dd { text-align: left; }
}