/* PANAMA CROSSROADS — /pc-2023/ (PC 2023). Loads after main.css.
   Values extracted from the inline Elementor CSS of reference/page-pc-2023.html
   (post 23217). Root font-size is 17px, so em → px: 1em=17, 1.5em=25.5, 1.882em=32,
   2.6em=44.2. Theme defaults (reference/css/__custom.css) + the page's wp-custom-css:
     h1 kikuta 2.6em/1.2127em 400 uppercase, ls 1px (wp-custom-css beats the 2px token)
     h2 kikuta 1.5em/1.1em bold uppercase ls 1px (wp-custom-css beats 2.353em/400)
     h3 config 1.882em/1.1em 600 uppercase ls 1px
   Global colours used here: --e-global-color-9957b56 #000000,
   --e-global-color-af62d69 #F8F8F8, --e-global-color-2d80ac0 #04D3CB.
   Schemes: P1 = scheme_dark, P2 = scheme_light (text #6D6F72, text_dark #11131A),
   P3 = scheme_default, the day/venue sections carry none and inherit the body's
   scheme_dark (text_dark #FFFFFF) over the page gradient. */

/* ---- P1 "en números" (19ef18e, opt-fondo-seccion-1.png, container 943px) ----- */

.pc-num .container { max-width: 943px; }

/* trx_sc_title h1 → .sc_item_title_text carries the explicit 45px, .sc_item_title #000 */
.pc-num__title {
  margin: 0;
  font-family: kikuta, sans-serif;
  font-size: 45px;
  font-weight: 400;
  line-height: 1.2127em;
  text-transform: uppercase;
  text-align: center;
  color: var(--white)   /* white over the body texture, like the other heroes */;
}

/* sc_layouts_hide_on_tablet + sc_layouts_hide_on_mobile → gone ≤1024px, unlike the
   shared .hide-mobile which only drops ≤767px. */
.pc-hide-t { display: block; }

/* ---- P2 stats (85506cc, scheme_light, bg #F8F8F8) --------------------------- */

.pc-stats { background: #F8F8F8; color: #6D6F72; }

/* trx_sc_price metro, seven trx_addons_column-1_3 cards + columns_padding_bottom,
   so the gutter is --theme-var-grid_gap (30px) both ways.
   Card + type values read off the live page's computed styles (theme
   __plugins-full.css .sc_price_metro): the card carries the section's own
   #F8F8F8, and the only thing that separates it from the background is the wide,
   very faint drop shadow — which is what reads as a white tile in a screenshot. */
.pc-stats__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 30px;
  margin: 0;
}
.pc-stat {
  padding: 65px 50px;
  overflow: hidden;
  text-align: center;
  background-color: #F8F8F8;
  box-shadow: 0 23px 90px rgba(0, 0, 0, .04);
}
.pc-stat__label {
  margin: 0;
  font-family: kikuta, sans-serif;
  font-size: 20px;
  font-weight: 400;
  line-height: 1.25em;
  text-transform: none;
  color: #11131A;
}
.pc-stat__value {
  margin: 15px 0 0;
  font-family: kikuta, sans-serif;
  font-size: 47px;
  font-weight: 400;
  line-height: 1;
  color: #11131A;
}
/* the plugin steps the metro card down at 1439 / 1279 / 1023 / 767 */
@media (max-width: 1439px) { .pc-stat__value { font-size: 38px; } }
@media (max-width: 1279px) {
  .pc-stat { padding: 55px 30px; }
  .pc-stat__value { font-size: 35px; }
}
@media (max-width: 1023px) {                  /* still three across on tablet */
  .pc-stat { padding: 35px 20px; }
  .pc-stat__label { font-size: 17px; }
  .pc-stat__value { font-size: 28px; }
}

/* ---- P3 recap video (0df2790, bg #F8F8F8) ---------------------------------- */

.pc-video { background: #F8F8F8; }

/* Desktop-only band: column bdf5363 = optIx.jpg cover + #02040B @ 0.7 overlay,
   15px left margin, 2×50px spacers above and below the (invisible) PLAY button.
   ≤1024px the original drops the band entirely and shows the bare video widget. */
.pc-video__band { width: calc(100% - 15px); margin-left: 15px; }
@media (min-width: 1025px) {
  .pc-video__band {
    padding: 100px 0;
    background: linear-gradient(rgba(2, 4, 11, .7), rgba(2, 4, 11, .7)),
                url(/assets/optIx.webp) center center / cover no-repeat;
  }
}

/* ---- day headings (484a4bf / 061f5ce / 9bed6e3 / c44f837) ------------------- */

.pc-day .container { min-height: 91px; justify-content: center; }

/* trx_sc_title, h1 tag in the source (the page ships five) → theme h1 token, teal.
   Demoted to h2 here so the document keeps a single h1. */
.pc-day__title {
  margin: 0;
  font-family: kikuta, sans-serif;
  font-size: 2.6em;              /* 44.2px */
  font-weight: 400;
  line-height: 1.2127em;
  text-transform: uppercase;
  color: #04D3CB;
}
/* divider widget: 1px solid #F8F8F8, full column width, padding-block 15px */
.pc-rule {
  width: 100%;
  height: 0;
  margin: 15px 0;
  border-top: 1px solid #F8F8F8;
}

/* ---- venue rows (980917d / fac9b7f / 38cc0cb / d93b7fb / 7093ecb / 0efd755 /
        e7980ac) — 25% label + 75% carousel, column-gap-no, overflow hidden ----- */

.pc-venue { overflow: hidden; }
.pc-venue__row {
  display: grid;
  grid-template-columns: 25% 75%;
  align-items: start;
}
/* trx_sc_title, h2 tag → wp-custom-css h2 = 1.5em; demoted to h3 (single-h1 rule) */
.pc-venue__title {
  margin: 0;
  font-family: kikuta, sans-serif;
  font-size: 1.5em;              /* 25.5px */
  font-weight: 700;              /* kikuta ships Regular only, so this synthesises —
                                    which is exactly what the live page renders */
  line-height: 1.1em;
  text-transform: uppercase;
  color: var(--white);
}

/* Elementor image-carousel: 3 slides desktop, 2 tablet, 1 mobile, 20px spacing,
   arrows inside + dots outside, autoplay 5000. The track needs its own class so the
   single-carousel binding in main.js stays inert; the page script wires all seven.
   ponytail: the widgets are stretched to 131.631% of their column, which pushes the
   right half of the strip (and Elementor's next arrow) past the section's clip box.
   Kept at 100% so both arrows stay reachable — slides render 309px instead of 411px. */
.pc-car__track {
  display: flex;
  gap: 20px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
}
.pc-car__track::-webkit-scrollbar { display: none; }
.pc-car__track > li {
  flex: 0 0 calc((100% - 2 * 20px) / 3);
  scroll-snap-align: start;
}
.pc-car__track img { display: block; width: 100%; }

/* ---- responsive: tablet ≤1024px -------------------------------------------- */

@media (max-width: 1024px) {
  .pc-hide-t { display: none; }
  .pc-num .container { padding: 20px; }       /* column padding 377d1fe */
  .pc-num__title { font-size: 52px; line-height: 1em; }

  .pc-video__band { width: 100%; margin-left: 0; }

  .pc-venue__row { grid-template-columns: 1fr; }
  .pc-car__track > li { flex-basis: calc((100% - 20px) / 2); }
}

/* ---- responsive: mobile ≤767px --------------------------------------------- */

@media (max-width: 767px) {
  .pc-num__title { font-size: 38px; padding: 25px; }

  .pc-stats__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
  .pc-stat { padding: 25px 20px; }

  .pc-car__track > li { flex-basis: 100%; }
}

/* ---- responsive: small mobile ≤479px ---------------------------------------- */

@media (max-width: 479px) {
  .pc-stats__grid { grid-template-columns: 1fr; }
}
