


/* FONT INFORMATION */

/* libre-baskerville-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Libre Baskerville';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/libre-baskerville-v24-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* libre-baskerville-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Libre Baskerville';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/libre-baskerville-v24-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* libre-baskerville-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Libre Baskerville';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/libre-baskerville-v24-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* libre-baskerville-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Libre Baskerville';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/libre-baskerville-v24-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}



/* poppins-100 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 100;
  src: url('../fonts/poppins-v24-latin-100.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* poppins-200 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 200;
  src: url('../fonts/poppins-v24-latin-200.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* poppins-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/poppins-v24-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* poppins-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/poppins-v24-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* poppins-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/poppins-v24-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* poppins-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/poppins-v24-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* poppins-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/poppins-v24-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* poppins-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 800;
  src: url('../fonts/poppins-v24-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* poppins-900 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 900;
  src: url('../fonts/poppins-v24-latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}



/* ==========================================================================
   DESIGN TOKENS
   Change the brand look from here. Everything else references these.
   ========================================================================== */
:root {
  /* Color — clean, white-first, elegant editorial palette */
  --bg: #ffffff;
  --surface: #f3f6fc;      /* faint cool wash — airy, not flat white */
  --ink: #14181f;          /* primary text (near-black) */
  --ink-soft: #4a515c;     /* secondary/muted text */
  --line: #e6e8ec;         /* hairline borders */

  /* Acquire Local program palette — straight from that program's own brand
     guidelines (Documentation/Acquire-Local-Brand-Guidelines.pdf). Scoped to the
     Current Programs card; the rest of the site stays on the lapope palette. */
  --al-wine:  #5c1f30;     /* "Acquire", headings, primary ink */
  --al-slate: #425563;     /* "local" — the wordmark's one accent */
  --al-gold:  #c69214;     /* divider rule + diamond, awning bars */
  --al-navy:  #0c2340;     /* tagline */
  --al-cream: #fbf4e8;     /* warm cream ground */
  --navy: #0f1b2d;         /* dark bar / footer */
  --accent: #2456c9;       /* corporate blue — harmonizes with the event imagery */
  --accent-dark: #1b429b;  /* hover / pressed */
  --accent-soft: #eaf0fb;  /* pale blue tint for soft fills / badges */
  --white: #ffffff;

  /* Type — fallbacks are shape-matched to reduce layout shift (CLS) */
  --font-head: 'Libre Baskerville', Georgia, 'Times New Roman', serif;
  --font-body: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;

  /* Layout */
  --container: 1240px;
  --gutter: 1.25rem;       /* side padding on phones */

  /* Rounding — soft & generous, echoing the Voiceovers site */
  --radius: 8px;
  --radius-lg: 20px;       /* cards & the floating header */
  --radius-pill: 999px;    /* buttons & filter tabs */

  /* Soft ambient shadows — that floating, airy feel */
  --shadow-soft: 0 18px 40px -22px rgba(15, 27, 45, 0.25);
  --shadow-float: 0 26px 60px -28px rgba(15, 27, 45, 0.32);
}


/* ==========================================================================
   RESET / BASE
   ========================================================================== */
*,
*::before,
*::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: 7rem; /* keeps anchored sections clear of the fixed header */
}

body {
  margin: 0;
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.65;
  color: var(--ink);
  background-color: var(--bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

img,
picture,
svg,
video {
  display: block;
  max-width: 100%;
  height: auto;
}

a { color: inherit; text-decoration: none; }

ul { margin: 0; padding: 0; list-style: none; }

button {
  font: inherit;
  color: inherit;
  background: none;
  border: 0;
  cursor: pointer;
}

h1, h2, h3, h4, h5, h6 {
  margin: 0;
  font-family: var(--font-head);
  font-weight: 600; /* Libre Baskerville SemiBold — per client request */
  line-height: 1.15;
  color: var(--ink);
}

p { margin: 0; }

:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}


/* ==========================================================================
   REUSABLE UTILITIES
   ========================================================================== */
.container {
  width: 100%;
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

/* Small uppercase eyebrow above headings */
.topper {
  display: inline-block;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 0.8125rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--accent);
}

/* Brand wordmark:  lapope // experiential
   - "lapope"       serif, inherits the surrounding text color
   - "//"           accent blue (the differently-colored slash)
   - "experiential" small sans, letter-spaced, muted — a different treatment
   Size scales with the parent's font-size (set per context: nav, footer, hero). */
.wordmark {
  display: inline-flex;
  align-items: baseline;
  gap: 0.18em;
  font-family: var(--font-head);
  font-weight: 600;
  letter-spacing: 0.01em;
  text-transform: none;
  white-space: nowrap;
  line-height: 1;
}
.wordmark__name { color: inherit; }
.wordmark__slash {
  color: var(--accent);
  font-weight: 400;
}
.wordmark__tag {
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 0.6em;
  letter-spacing: 0.14em;
  text-transform: lowercase;
  color: inherit;
  opacity: 0.72;         /* muted in both light & dark contexts */
}

/* Buttons — fully-rounded pills, matching the Voiceovers site */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.9rem 1.65rem;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 0.9375rem;
  line-height: 1;
  letter-spacing: 0.02em;
  border-radius: var(--radius-pill);
  border: 2px solid transparent;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}
.btn:hover { transform: translateY(-2px); }

/* Circular arrow badge — the signature "Get Started ↗" element from the Voiceovers
   site. Add .btn--arrow to solid buttons only (the white badge needs a colored bg). */
.btn--arrow {
  padding-left: 1.6rem;
  padding-right: 0.45rem;
  gap: 0.7rem;
}
.btn--arrow::after {
  content: "";
  flex-shrink: 0;
  width: 1.85rem;
  height: 1.85rem;
  border-radius: 50%;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232456c9' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M8 7h9v9'/%3E%3C/svg%3E") center / 0.85rem no-repeat;
  transition: transform 0.25s ease;
}
.btn--arrow:hover::after { transform: translate(2px, -2px); }

.btn--solid {
  background-color: var(--accent);
  border-color: var(--accent);
  color: var(--white);
}
.btn--solid:hover {
  background-color: var(--accent-dark);
  border-color: var(--accent-dark);
}

.btn--ghost {
  background-color: transparent;
  border-color: var(--ink);
  color: var(--ink);
}
.btn--ghost:hover {
  background-color: var(--ink);
  color: var(--white);
}

/* Screen-reader-only text (accessible labels without visible clutter) */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
