/* Header, overlay nav, footer, language toggle. No page sections. */

.site-header {
  position: sticky;
  top: 0;
  z-index: 40;
  height: calc(var(--header-h) + var(--safe-t));
  padding-top: var(--safe-t);
  background: transparent;
  border-bottom: 1px solid transparent;
}

.site-header.is-solid {
  background: var(--header-solid);
  border-bottom-color: var(--gold-hairline);
}

.site-header__inner {
  height: var(--header-h);
  max-width: var(--bleed);
  margin: 0 auto;
  padding: 0 max(var(--s5), var(--safe-r)) 0 max(var(--s5), var(--safe-l));
  display: flex;
  align-items: center;
  gap: var(--s5);
  min-width: 0;
}

.site-logo {
  display: flex;
  align-items: center;
  gap: var(--s3);
  min-height: var(--tap);
  min-width: 0;
  flex: 1 1 auto;
  color: var(--ivory);
}

.site-logo:hover {
  color: var(--ivory);
}

.site-logo__img {
  width: 52px;
  height: 52px;
  object-fit: contain;
  flex: 0 0 auto;
}

.site-logo__text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.site-logo__name {
  font-family: var(--font-display);
  font-size: 1rem;
  line-height: 1.2;
  font-weight: 600;
}

.site-logo__lockup {
  font-size: 10px;
  line-height: 1.2;
  letter-spacing: 0.04em;
  color: var(--gold);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nav-desktop {
  display: none;
  flex: 1 1 auto;
  justify-content: flex-end;
  gap: var(--s2);
  flex-wrap: wrap;
}

.nav-desktop__link {
  display: inline-flex;
  align-items: center;
  min-height: var(--tap);
  padding: 0 var(--s2);
  font-size: var(--fs-label);
  letter-spacing: var(--ls-label);
  text-transform: uppercase;
  color: var(--ivory-70);
}

.nav-desktop__link:hover,
.nav-desktop__link[aria-current="page"] {
  color: var(--gold);
}

.site-header__end {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: var(--s3);
  flex: 0 0 auto;
}

.lang-toggle {
  display: flex;
  align-items: center;
  gap: var(--s2);
  min-height: var(--tap);
}

.lang-toggle__opt {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: var(--tap);
  min-height: var(--tap);
  font-size: var(--fs-label);
  letter-spacing: var(--ls-label);
  text-transform: uppercase;
  color: var(--text-muted);
}

.lang-toggle__opt[aria-current="true"] {
  color: var(--ivory);
}

.lang-toggle__rule {
  color: var(--gold-hairline);
  pointer-events: none;
}

.nav-open {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--tap);
  height: var(--tap);
}

.nav-open__bars,
.nav-open__bars::before,
.nav-open__bars::after {
  display: block;
  width: 18px;
  height: 1px;
  background: var(--ivory);
  position: relative;
}

.nav-open__bars::before,
.nav-open__bars::after {
  content: "";
  position: absolute;
  left: 0;
}

.nav-open__bars::before { top: -6px; }
.nav-open__bars::after { top: 6px; }

/* Full-screen overlay — not a dropdown */
.nav-overlay {
  position: fixed;
  inset: 0;
  z-index: 80;
  background: var(--ink-deep);
  display: flex;
  flex-direction: column;
  border-top: 1px solid var(--gold-hairline);
  padding-top: var(--safe-t);
  padding-left: var(--safe-l);
  padding-right: var(--safe-r);
  overscroll-behavior: contain;
}

.nav-overlay[hidden] {
  display: none;
}

.nav-overlay:not([hidden]) {
  animation: overlay-in var(--dur) var(--ease);
}

@keyframes overlay-in {
  from { opacity: 0; }
}

.nav-overlay__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: var(--header-h);
  padding: 0 var(--s4) 0 var(--s5);
  border-bottom: 1px solid var(--gold-hairline);
}

.nav-overlay__title {
  font-size: var(--fs-label);
  letter-spacing: var(--ls-label);
  text-transform: uppercase;
  color: var(--gold);
}

.nav-overlay__close {
  width: var(--tap);
  height: var(--tap);
  font-size: 1.75rem;
  line-height: 1;
  color: var(--ivory);
}

.nav-overlay__body {
  flex: 1 1 auto;
  overflow: auto;
  overscroll-behavior: contain;
}

.nav-overlay__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: var(--nav-row);
  padding: 0 var(--s5);
  font-size: 1.5rem; /* 24px */
  text-align: left;
  color: var(--ivory);
  border-bottom: 1px solid var(--gold-hairline);
}

.nav-overlay__row + .nav-overlay__row {
  margin-top: 0;
}

.nav-overlay__row[aria-current="page"] {
  color: var(--gold);
}

.nav-overlay__section {
  padding: var(--s4) var(--s5) var(--s2);
  font-size: var(--fs-label);
  letter-spacing: var(--ls-label);
  text-transform: uppercase;
  color: var(--gold);
}

.nav-overlay__chevron {
  width: 8px;
  height: 8px;
  border-right: 1px solid var(--gold);
  border-top: 1px solid var(--gold);
  transform: rotate(45deg);
  flex: 0 0 auto;
}

.nav-overlay__chevron--back {
  transform: rotate(-135deg);
  margin-right: var(--s3);
}

.nav-overlay__row--back {
  justify-content: flex-start;
  gap: var(--s2);
  color: var(--text-muted);
  font-size: 1rem;
}

.nav-overlay__foot {
  padding: var(--s4) var(--s5) max(var(--s4), var(--safe-b));
  border-top: 1px solid var(--gold-hairline);
  min-height: calc(var(--tap) + var(--s5));
}

.site-footer {
  background: var(--ink-deep);
  border-top: 1px solid var(--gold-hairline);
  padding: var(--s7) max(var(--s5), var(--safe-r)) max(var(--s8), var(--safe-b)) max(var(--s5), var(--safe-l));
}

.site-footer__contact {
  max-width: var(--measure);
  margin: 0 auto var(--s6);
}

.site-footer__kicker {
  font-size: var(--fs-label);
  letter-spacing: var(--ls-label);
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: var(--s2);
}

.site-footer__whatsapp {
  display: inline-flex;
  align-items: center;
  min-height: var(--tap);
  font-size: 1rem;
  color: var(--ivory);
}

.footer-cols {
  max-width: var(--measure);
  margin: 0 auto;
  display: grid;
  gap: var(--s4);
}

.footer-col {
  border-bottom: 1px solid var(--gold-hairline);
}

.footer-col__title {
  list-style: none;
  min-height: var(--tap);
  display: flex;
  align-items: center;
  font-size: var(--fs-label);
  letter-spacing: var(--ls-label);
  text-transform: uppercase;
  color: var(--ivory);
  cursor: pointer;
}

.footer-col__title::-webkit-details-marker {
  display: none;
}

.footer-col ul {
  list-style: none;
  margin: 0 0 var(--s4);
  padding: 0;
}

.footer-col a {
  display: inline-flex;
  align-items: center;
  min-height: var(--tap);
  color: var(--text-caption);
}

.site-footer__credit {
  max-width: var(--measure);
  margin: var(--s6) auto 0;
  color: var(--text-caption);
  font-family: var(--font-display);
  font-size: var(--fs-caption);
  display: flex;
  align-items: center;
  gap: var(--s3);
}

.site-footer__logo {
  width: 36px;
  height: 36px;
  object-fit: contain;
  flex: 0 0 auto;
}

@media (min-width: 720px) {
  .footer-cols {
    grid-template-columns: repeat(4, 1fr);
    gap: var(--s6);
  }

  .footer-col {
    border-bottom: 0;
  }

  .footer-col__title {
    cursor: default;
    pointer-events: none;
    margin-bottom: var(--s3);
  }
}

@media (max-width: 419px) {
  .site-logo__img { width: 40px; height: 40px; }
  .site-header__inner { gap: var(--s3); }
}

@media (min-width: 1100px) {
  .nav-desktop {
    display: flex;
  }

  .nav-open {
    display: none;
  }

  .lang-toggle--header {
    margin-left: var(--s2);
  }
}

@media (prefers-reduced-motion: reduce) {
  .nav-overlay__chevron,
  .nav-overlay__chevron--back {
    transform: none;
    border: 0;
    width: auto;
    height: auto;
  }

  .nav-overlay__chevron::before {
    content: ">";
    color: var(--gold);
  }

  .nav-overlay__chevron--back::before {
    content: "<";
  }
}

/* Pages */
.wrap { max-width: var(--measure); margin: 0 auto; padding: 0 max(var(--s5), var(--safe-r)) 0 max(var(--s5), var(--safe-l)); min-width: 0; }
.page-main--home { padding: 0; max-width: none; min-height: 0; }
.section { padding: var(--section-pad-m) 0; min-width: 0; }
@media (min-width: 720px) { .section { padding: var(--s10) 0; } }
.section__title { font-size: var(--fs-h2); margin-bottom: var(--s5); }
.section__eyebrow { font-family: var(--font-display); color: var(--gold); margin-bottom: var(--s5); }
.eyebrow, .label { font-size: var(--fs-label); letter-spacing: var(--ls-label); text-transform: uppercase; color: var(--gold); }
.lede { color: var(--text-caption); max-width: 40rem; margin: var(--s4) 0 var(--s5); }
.page-hero { padding: calc(var(--header-h) + var(--safe-t) + var(--s7)) 0 var(--s6); }
.page-hero h1 { font-size: var(--fs-h1); }

.hero { position: relative; min-height: 78svh; display: flex; align-items: flex-end; overflow: hidden; }
@media (min-width: 720px) { .hero { min-height: 88vh; min-height: 88dvh; } }
.hero__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
@media (max-width: 719px) { .hero__img { object-position: center 20%; aspect-ratio: 4/5; height: 100%; } }
.hero__shade { position: absolute; inset: 0; background: linear-gradient(to top, rgba(11,11,12,0.85), rgba(11,11,12,0.25)); }
.hero__inner { position: relative; padding-bottom: max(var(--s8), var(--safe-b)); }
.hero__title { font-size: var(--fs-hero); margin: var(--s3) 0; }
.hero__sub { color: var(--gold); font-family: var(--font-display); margin-bottom: var(--s3); }
.hero__fact { color: var(--text-caption); margin-bottom: var(--s5); }
.hero__cta { display: flex; flex-direction: column; gap: var(--s3); max-width: 24rem; }
.hero__cta .btn { width: 100%; }
@media (min-width: 720px) {
  .hero__cta { flex-direction: row; max-width: none; }
  .hero__cta .btn { width: auto; }
}

.btn { display: inline-flex; align-items: center; justify-content: center; min-height: var(--btn-h); padding: 0 var(--s5); border-radius: var(--radius); font-size: 1rem; }
.btn--primary { background: var(--gold); color: var(--ink); }
@media (hover: hover) {
  .btn--primary:hover { color: var(--ink); background: var(--gold-light); }
}
.btn--ghost { border: 1px solid rgba(244,241,234,0.3); color: var(--ivory); }
.card { background: var(--ink-raised); border: 1px solid var(--gold-hairline); border-radius: var(--radius); padding: var(--s5); }
.card__source { font-family: var(--font-display); color: var(--text-caption); margin-top: var(--s4); font-size: var(--fs-caption); }
.grid-4, .grid-3, .grid-2 { display: grid; gap: var(--s4); }
@media (min-width: 720px) {
  .grid-2 { grid-template-columns: 1fr 1fr; }
  .grid-3 { grid-template-columns: repeat(3, 1fr); }
  .grid-4 { grid-template-columns: repeat(4, 1fr); }
}

.timeline { display: flex; gap: var(--s4); overflow-x: auto; scroll-snap-type: x mandatory; padding: var(--s5) 0 var(--s6); position: relative; width: 100%; min-width: 0; max-width: 100%; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; }
.timeline::before { content: ""; position: absolute; left: 0; right: 0; top: 1.15rem; height: 2px; background: var(--gold); pointer-events: none; }
.t-card { flex: 0 0 auto; width: min(18.5rem, calc(100% - var(--s6))); scroll-snap-align: start; background: var(--ink-raised); border: 1px solid var(--gold-hairline); border-radius: var(--radius); padding: var(--s5); position: relative; }
@media (min-width: 720px) { .t-card { width: 280px; } }
.t-card__year { font-size: var(--fs-h3); font-family: var(--font-display); color: var(--gold); }
.timeline__dots { display: flex; gap: var(--s2); justify-content: center; }
.timeline__dots span { width: 6px; height: 6px; border-radius: 50%; background: var(--gold-hairline); }
.text-link { color: var(--gold); display: inline-flex; min-height: var(--tap); align-items: center; }

.split { display: grid; }
@media (min-width: 900px) { .split { grid-template-columns: 1.1fr 0.9fr; } }
.split__img img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 4/5; }
.mini-win { display: flex; flex-direction: column; gap: var(--s2); padding: var(--s4) 0; border-bottom: 1px solid var(--gold-hairline); }
.thumb-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--s2); margin: var(--s5) 0; }
.thumb { padding: 0; border: 0; background: none; cursor: pointer; }
.thumb img, .masonry img { width: 100%; aspect-ratio: 3/2; object-fit: cover; }

.moments { display: grid; gap: var(--s4); }
@media (min-width: 720px) { .moments { grid-template-columns: repeat(2, 1fr); } }
.moment { background: var(--ink-raised); border: 1px solid var(--gold-hairline); padding: var(--s5); }
.moment__img { filter: grayscale(1) sepia(0.25); width: 100%; aspect-ratio: 3/2; object-fit: cover; margin-bottom: var(--s4); }
@media (hover: hover) {
  .moment:hover .moment__img { filter: none; }
}
@media (prefers-reduced-motion: reduce) { .moment__img { filter: none; } }

.lta-strip { list-style: none; padding: 0; margin: 0 0 var(--s5); display: grid; gap: var(--s3); }
.lta-band { padding: var(--s8) 0; border-top: 1px solid var(--gold-hairline); border-bottom: 1px solid var(--gold-hairline); }
.citation { font-family: var(--font-display); color: var(--text-caption); max-width: 40rem; margin-top: var(--s4); }

.chips { display: flex; flex-wrap: wrap; gap: var(--s2); margin-top: var(--s3); }
.chip { border: 1px solid var(--gold-hairline); min-height: var(--tap); padding: 0 var(--s3); color: var(--text-caption); background: none; cursor: pointer; display: inline-flex; align-items: center; }
.masonry { columns: 2; gap: var(--s3); }
@media (min-width: 900px) { .masonry { columns: 4; } }
.masonry__item { width: 100%; margin: 0 0 var(--s3); padding: 0; border: 0; background: none; break-inside: avoid; cursor: pointer; }
.partners { color: var(--text-caption); filter: grayscale(1); }
.partner-tier { margin-bottom: var(--s4); }
.prose p { margin-bottom: var(--s4); max-width: 40rem; }
.boundary { font-family: var(--font-display); border-left: 1px solid var(--gold); padding-left: var(--s5); color: var(--ivory); max-width: 40rem; }
.plain { padding-left: var(--s5); }
.stages { max-width: 40rem; }
.stages li { margin-bottom: var(--s4); }
.facts, .winners-dl { display: grid; gap: var(--s3); }
.facts div, .winners-dl div { display: grid; gap: var(--s1); border-bottom: 1px solid var(--gold-hairline); padding-bottom: var(--s3); }
@media (min-width: 720px) {
  .facts div { grid-template-columns: 10rem 1fr; }
}
.edition-pager { display: flex; justify-content: space-between; gap: var(--s3); flex-wrap: wrap; padding: var(--s7) max(var(--s5), var(--safe-r)) var(--s7) max(var(--s5), var(--safe-l)); }
.archive { display: grid; gap: var(--s6); padding-bottom: var(--s8); min-width: 0; }
.archive > * { min-width: 0; max-width: 100%; }
@media (min-width: 900px) { .archive { grid-template-columns: 16rem minmax(0, 1fr); } }
.archive__search { display: flex; align-items: center; gap: var(--s3); min-width: 0; max-width: 100%; position: sticky; top: calc(var(--header-h) + var(--safe-t)); z-index: 15; background: var(--ink); padding: var(--s3) 0; }
.archive__search input { flex: 1 1 0; width: 0; min-width: 0; min-height: var(--btn-h); padding: 0 var(--s4); color: var(--ivory); background: var(--ink-raised); border: 1px solid var(--gold-hairline); border-radius: var(--radius); }
.check { display: flex; align-items: center; gap: var(--s2); min-height: var(--tap); }
.filter-acc { border-bottom: 1px solid var(--gold-hairline); }
.result { padding: var(--s4) 0; border-bottom: 1px solid var(--gold-hairline); max-width: 100%; }
.result h3 { font-size: 1.375rem; font-family: var(--font-display); overflow-wrap: anywhere; }
.result h3 { font-size: 1.375rem; font-family: var(--font-display); }
.empty { padding: var(--s7) 0; max-width: 36rem; }
.filters-open { display: inline-flex; flex: 0 0 auto; }
@media (max-width: 899px) {
  .archive__filters { display: none; }
}
@media (min-width: 900px) { .filters-open { display: none; } }
.sheet { position: fixed; inset: 0; background: rgba(11,11,12,0.7); z-index: 90; display: flex; align-items: flex-end; }
.sheet[hidden] { display: none; }
.sheet__panel { position: relative; display: flex; flex-direction: column; background: var(--ink-deep); width: 100%; max-height: min(80vh, 80dvh); overflow: auto; padding: var(--s4) max(var(--s5), var(--safe-r)) max(var(--s5), var(--safe-b)) max(var(--s5), var(--safe-l)); border-top: 1px solid var(--gold-hairline); overscroll-behavior: contain; }
.sheet:not([hidden]) .sheet__panel { animation: sheet-up var(--dur-enter) var(--ease); }
@keyframes sheet-up { from { transform: translateY(12%); } }
.sheet__handle { width: 36px; height: 4px; border-radius: 2px; background: var(--gold-hairline); margin: 0 auto var(--s4); }
.sheet__close { position: absolute; top: var(--s3); right: max(var(--s3), var(--safe-r)); }
.sheet__body { overflow: auto; flex: 1 1 auto; min-height: 0; }
.sheet__apply { width: 100%; margin-top: var(--s4); flex: 0 0 auto; }
.retro-rail { display: flex; gap: var(--s4); overflow-x: auto; scroll-snap-type: x mandatory; padding: 0 max(var(--s5), var(--safe-r)) var(--s6) max(var(--s5), var(--safe-l)); min-width: 0; max-width: 100%; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; }
.retro-card { flex: 0 0 auto; width: min(16.5rem, calc(100% - var(--s8))); scroll-snap-align: start; background: var(--ink-raised); border: 1px solid var(--gold-hairline); padding: var(--s5); min-height: 12rem; }
@media (min-width: 720px) { .retro-card { width: 220px; } }
.badge { font-size: var(--fs-caption); color: var(--gold); }
.lite-yt { position: relative; display: block; width: 100%; aspect-ratio: 16/9; padding: 0; border: 1px solid var(--gold-hairline); background: var(--ink-raised); cursor: pointer; }
.lite-yt img, .lite-yt iframe { width: 100%; height: 100%; object-fit: cover; border: 0; }
.lite-yt__play { position: absolute; inset: 0; margin: auto; width: 0; height: 0; border-style: solid; border-width: 14px 0 14px 24px; border-color: transparent transparent transparent var(--gold); }
.lite-yt__title { position: absolute; left: var(--s4); bottom: var(--s4); color: var(--ivory); }
.video-grid { display: grid; gap: var(--s4); }
@media (min-width: 720px) { .video-grid { grid-template-columns: 1fr 1fr; } }
.lightbox { position: fixed; inset: 0; background: rgba(8,8,10,0.94); z-index: 100; display: grid; place-items: center; padding: var(--safe-t) var(--safe-r) var(--safe-b) var(--safe-l); overscroll-behavior: contain; }
.lightbox[hidden] { display: none; }
.lightbox__img { max-width: 92vw; max-height: 78vh; max-height: 78dvh; }
.lightbox__cap { display: flex; justify-content: space-between; color: var(--text-caption); margin-top: var(--s3); }
.lightbox__close, .lightbox__nav { position: absolute; min-width: var(--tap); min-height: var(--tap); color: var(--ivory); font-size: 1.75rem; }
.lightbox__close { top: max(var(--s4), var(--safe-t)); right: max(var(--s4), var(--safe-r)); }
.lightbox__nav--prev { left: max(var(--s3), var(--safe-l)); }
.lightbox__nav--next { right: max(var(--s3), var(--safe-r)); }
.lightbox__dl { position: absolute; bottom: max(var(--s4), var(--safe-b)); right: max(var(--s5), var(--safe-r)); color: var(--text-caption); font-size: var(--fs-caption); }
.contact-form { display: grid; gap: var(--s4); max-width: 28rem; }
.contact-form input, .contact-form textarea { width: 100%; background: var(--ink-raised); border: 1px solid var(--gold-hairline); color: var(--ivory); padding: var(--s3); min-height: var(--tap); font: inherit; }
.cat-groups { display: grid; gap: var(--s5); }
@media (min-width: 720px) { .cat-groups { grid-template-columns: 1fr 1fr; } }
.edition-index { list-style: none; padding: 0; }
.edition-index a { display: flex; align-items: center; min-height: var(--tap); gap: var(--s3); border-bottom: 1px solid var(--gold-hairline); }
.archive-teaser input { width: 100%; min-height: var(--btn-h); background: var(--ink-raised); border: 1px solid var(--gold-hairline); color: var(--ivory); padding: 0 var(--s4); font: inherit; }
.page-404 { text-align: center; }
.page-404 img { margin: 0 auto var(--s4); }
.legacy-post { padding-bottom: var(--s10); }
.legacy-post .post-body { color: var(--ivory); }
.legacy-post .post-body img { margin: var(--s4) 0; }
.page-404 { text-align: center; }
.page-404 img { margin: 0 auto var(--s4); }

