/* ==========================================================================
   AREA UNITED · Parte 2 · 4.7 Fight Club (negro puro #000)
   Lockup SVG arriba, texto + datos + horario a la izquierda, fotos a la
   derecha (más contraste y algo más oscuras que el resto).
   ========================================================================== */

.p2-fc {
  background: var(--black-pure);
  border-top: 1px solid var(--surface-2) !important;
}

.p2-fc-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px 32px;
  padding-bottom: 28px;
  margin-bottom: 40px;
  border-bottom: 1px solid var(--surface-2);
}
.p2-fc-lockup { height: 44px; width: auto; }

.p2-fc-grid { display: grid; gap: 48px; }
.p2-fc .section-head { margin-bottom: 36px; }

/* --- Tres datos --- */
.p2-fc-facts {
  display: grid;
  border-top: 1px solid var(--surface-2);
}
.p2-fc-facts li {
  display: grid;
  gap: 6px;
  padding: 18px 0;
  border-bottom: 1px solid var(--surface-2);
}
.p2-fc-fact { font-size: clamp(24px, 2.6vw, 30px); line-height: 1; }
.p2-fc-fact small { font-size: .55em; color: var(--yellow); margin-left: 4px; }
.p2-fc-fact-sub { font-size: 13px; color: var(--gray-text); }

/* --- Horario compacto con pictogramas --- */
.p2-fc-schedule { margin-top: 32px; display: grid; gap: 16px; }
.p2-fc-legend {
  display: flex;
  gap: 24px;
  font-family: var(--font-display);
  font-size: 14px;
  letter-spacing: var(--ls-label);
  text-transform: uppercase;
  color: var(--gray-text);
}
.p2-fc-legend span { display: inline-flex; align-items: center; gap: 8px; }
.p2-fc-legend .p2-icon-24 { width: 20px; height: 20px; color: var(--white); }
.p2-fc-days { margin: 0; display: grid; }
.p2-fc-day {
  display: grid;
  gap: 10px;
  padding: 14px 0;
  border-top: 1px solid var(--surface-2);
}
.p2-fc-day:last-child { border-bottom: 1px solid var(--surface-2); }
.p2-fc-day dt { font-size: 22px; line-height: 1; }
.p2-fc-day dd { margin: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.p2-fc-slot {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 36px;
  padding-inline: 10px;
  border: 1px solid var(--surface-2);
  font-size: 14px;
  color: var(--white);
}
.p2-fc-slot b { font-family: var(--font-display); font-weight: 400; font-size: 17px; letter-spacing: .02em; }
.p2-fc-slot .p2-icon-24 { width: 20px; height: 20px; }
.p2-fc-slot--mat { border-color: var(--yellow); }
.p2-fc-slot-label { font-family: var(--font-display); font-size: 14px; letter-spacing: var(--ls-label); text-transform: uppercase; color: var(--yellow); }

.p2-fc-actions { margin-top: 36px; }

/* --- Fotos: más contraste y más oscuras --- */
.p2-fc-media {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  align-items: end;
}
.p2-fc-photo { display: block; border-radius: var(--radius-card); }
.p2-fc-photo img { filter: saturate(.7) contrast(1.18) brightness(.82); }
.p2-fc-photo--big { aspect-ratio: 4 / 5; grid-column: 1 / -1; }
.p2-fc-photo--small { aspect-ratio: 1 / 1; grid-column: 2; margin-top: -28%; margin-right: -8px; z-index: 2; border: 1px solid var(--surface-2); }
.p2-fc-photo--small .p2-play { left: 50%; top: 50%; translate: -50% -50%; }
.p2-fc-photo-label {
  position: absolute;
  left: 20px; right: 20px; bottom: 18px;
  z-index: 2;
  display: flex;
  justify-content: space-between;
  gap: 12px;
}
.p2-fc-photo-label .p2-tag { color: var(--white); }
.p2-fc-photo-label .p2-tag:last-child::before { display: none; }

/* --- Tablet --- */
@media (min-width: 768px) {
  .p2-fc-lockup { height: 56px; }
  .p2-fc-facts { grid-template-columns: repeat(3, 1fr); }
  .p2-fc-facts li { border-right: 1px solid var(--surface-2); padding: 20px 16px; }
  .p2-fc-facts li:first-child { padding-left: 0; }
  .p2-fc-facts li:last-child { border-right: 0; }
  .p2-fc-day { grid-template-columns: 120px 1fr; align-items: center; }
  .p2-fc-media { grid-template-columns: 1fr 1fr; max-width: 640px; }
  .p2-fc-photo--small { margin-top: -40%; }
}

/* --- Escritorio: copy 7 / fotos 5 --- */
@media (min-width: 1024px) {
  .p2-fc-grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 64px; align-items: start; }
  .p2-fc-media { max-width: none; grid-template-columns: 1fr 1fr; position: sticky; top: calc(var(--header-h) + 24px); }
  .p2-fc-photo--big { grid-column: 1 / -1; }
  .p2-fc-photo--small { width: 58%; justify-self: end; margin-top: -36%; margin-right: -24px; }
  .p2-fc-lockup { height: 64px; }
}
@media (min-width: 1280px) {
  .p2-fc-grid { gap: 96px; }
}
