/* ============================================================
   FRONTIER/1 — country page (F1/Netherlands, F1/Norway)
   Full-bleed photographic hero: bg image + scrim, copy lower-left,
   online date + reserve CTA lower-right. Ported from the redesign.
   Each page sets its own .chf-bg image in a small inline <style>.
   ============================================================ */
:root {
  --ink: #f4f4f2;
  --mute: #8a8a88;
  --hairline: #1c1c1c;
  --container: 1360px;
  --gutter: 32px;
  --font-jetbrains-mono: 'JetBrains Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;
}

.t-mono {
  font-family: var(--font-jetbrains-mono);
  font-size: 11px; font-weight: 500;
  color: var(--mute); text-transform: uppercase; letter-spacing: 0.18em;
}

.country-hero-full {
  position: relative; width: 100%; min-height: 100vh;
  display: flex; overflow: hidden;
}
.country-hero-full .chf-bg {
  position: absolute; inset: 0; z-index: 0;
  background-size: cover; background-position: center; background-repeat: no-repeat;
}
.country-hero-full .chf-scrim {
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(180deg,
    rgba(0,0,0,.34) 0%, rgba(0,0,0,0) 24%, rgba(0,0,0,0) 46%, rgba(0,0,0,.86) 100%);
}
.country-hero-full .chf-inner {
  position: relative; z-index: 2; width: 100%; max-width: var(--container);
  margin: 0 auto; padding: 120px var(--gutter) 120px; /* +60px bottom buffer before the footer */
  display: flex; align-items: flex-end; justify-content: space-between; gap: 48px;
}
.country-hero-full .chf-lead { max-width: none; flex: 1 1 auto; }
.country-hero-full .eyebrow { display: block; margin-bottom: 22px; color: rgba(255,255,255,.6); }
.country-hero-full h1 {
  font-weight: 500; font-size: clamp(34px, 4.6vw, 64px);
  letter-spacing: -0.03em; line-height: 1.02; color: #fff;
  margin-bottom: 24px; text-shadow: 0 2px 30px rgba(0,0,0,.5);
  text-wrap: balance;
}
.country-hero-full h1 .sub { display: block; color: var(--mute); }
.country-hero-full .summary {
  font-size: 14px; line-height: 1.6; color: rgba(255,255,255,.84); max-width: 66ch;
}
.country-hero-full .chf-meta {
  flex: 0 0 auto; display: flex; flex-direction: column;
  align-items: flex-start; gap: 26px; padding-bottom: 2px;
}
.country-hero-full .date-block { border-left: 1px solid #fff; padding: 2px 0 2px 16px; }
.country-hero-full .date-block .label {
  font-family: var(--font-jetbrains-mono);
  font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase;
  color: rgba(255,255,255,.66); margin-bottom: 8px;
}
.country-hero-full .date-block .value {
  font-family: var(--font-jetbrains-mono);
  font-size: 18px; letter-spacing: 0.06em; text-transform: uppercase; color: #fff;
}
.country-hero-full .cta {
  display: inline-flex; align-items: center; gap: 14px;
  border: 1px solid rgba(255,255,255,.42); background: rgba(0,0,0,.28); color: #fff;
  padding: 18px 26px; font-family: var(--font-jetbrains-mono);
  font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase;
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  transition: border-color .28s ease, background .28s ease;
}
.country-hero-full .cta:hover { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.7); }
.country-hero-full .cta .arrow { display: inline-block; transition: transform .24s ease; }
.country-hero-full .cta:hover .arrow { transform: translateX(4px); }

@media (max-width: 960px) {
  .country-hero-full .chf-inner {
    flex-direction: column; align-items: stretch; gap: 30px; padding: 104px var(--gutter) 104px;
  }
  /* stop the lead from sizing to the headline's max-content (which clipped off-screen) */
  .country-hero-full .chf-lead { flex: 0 1 auto; width: 100%; max-width: 100%; }
  .country-hero-full h1 { font-size: clamp(30px, 8vw, 44px); }
  /* dim the photo only here (mobile/stacked) for legibility; desktop stays full opacity */
  .country-hero-full .chf-bg { opacity: 0.4; }
  .country-hero-full .chf-meta { width: 100%; }
  .country-hero-full .cta { width: 100%; justify-content: space-between; }
}