/* ============================================================
   Sparc Group homepage — clean hand-written rebuild
   All values extracted 1:1 from the original Tailwind-compiled
   stylesheet (css/site-DiYRXPeP.css). Nothing invented.
   Breakpoints (Tailwind defaults used by the source):
     sm 640px / md 768px / lg 1024px / xl 1280px / 2xl 1536px / 3xl 1760px
   ============================================================ */

:root {
  /* colors (from --color-* tokens) */
  --black: #000;
  --white: #fff;
  --blue-950: #0b1418;
  --dark-blue: #14363f;
  --green-50: #f5f9f8;
  --green-100: #eff5f3;
  --green-200: #dceae4;
  --green-300: #cce0d7;
  --green-400: #bcd7cb;
  --green-500: #abccbd;
  --green-600: #7db099;
  --red-700: oklch(50.5% .213 27.518);

  --font-poppins: "Poppins", sans-serif;

  /* spacing base */
  --spacing: .25rem;

  /* radii */
  --radius-md: .375rem;
  --radius-lg: .5rem;
  --radius-2xl: 1rem;
  --radius-4xl: 2rem;

  /* container max widths */
  --container-size-lg: 110rem;
  --container-size-xl: 120rem;
  --container-size-full: 100%;

  /* tracking */
  --tracking-wider: .05em;

  /* responsive design tokens — base values */
  --header-height: 3.5rem;
  --header-height-scrolled: var(--header-height);
  --section-spacing-lg: calc(var(--spacing) * 10); /* 2.5rem */
  --border-radius: var(--radius-md);
  --container-padding-x: calc(var(--spacing) * 4); /* 1rem */
}

@media (min-width: 640px) {
  :root {
    --header-height: 4rem;
    --section-spacing-lg: calc(var(--spacing) * 16); /* 4rem */
    --border-radius: var(--radius-lg);
  }
}
@media (min-width: 768px) {
  :root {
    --header-height: 4.5rem;
    --container-padding-x: calc(var(--spacing) * 8); /* 2rem */
  }
}
@media (min-width: 1024px) {
  :root {
    --header-height: 6rem;
    --header-height-scrolled: 4.5rem;
    --section-spacing-lg: calc(var(--spacing) * 24); /* 6rem */
    --border-radius: var(--radius-2xl);
  }
}
@media (min-width: 1280px) {
  :root {
    --header-height: 7rem;
    --header-height-scrolled: 5rem;
  }
}
@media (min-width: 1536px) {
  :root {
    --header-height: 8rem;
    --header-height-scrolled: 6rem;
    --section-spacing-lg: calc(var(--spacing) * 32); /* 8rem */
    --border-radius: var(--radius-4xl);
    --container-padding-x: calc(var(--spacing) * 16); /* 4rem */
  }
}

/* ---------- reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; line-height: 1.5; }
body {
  font-family: var(--font-poppins);
  background-color: var(--green-100);
  color: var(--dark-blue);
  font-size: 1rem;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img, svg, video, picture { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
ul { list-style: none; padding: 0; }
h1, h2, h3, h4 { font-weight: inherit; }
[hidden] { display: none !important; }

/* ---------- layout helpers ---------- */
.container-lg, .container-xl, .container-full {
  width: 100%;
  margin-inline: auto;
  padding-inline: var(--container-padding-x);
}
.container-lg { max-width: var(--container-size-lg); }
.container-xl { max-width: var(--container-size-xl); }
.container-full { max-width: var(--container-size-full); }
/* the source uses container-lg for "container-lg" hero wrapper too */

.section-spacing-lg { margin-bottom: var(--section-spacing-lg); }

.px-block { padding-inline: 1rem; }
@media (min-width: 768px) { .px-block { padding-inline: 2rem; } }

/* ---------- typography utilities (exact px from source) ---------- */
.heading-3xl { font-size: 30px; font-weight: 400; line-height: 1.3; }
.heading-2xl { font-size: 28px; font-weight: 400; line-height: 1.35; }
.heading-md  { font-size: 18px; font-weight: 400; line-height: 1.2; }
.title-xl    { font-size: 17px; font-weight: 500; line-height: 1.5; }
.title-lg    { font-size: 16px; font-weight: 500; line-height: 1.5; }
.title-base  { font-size: 14px; font-weight: 500; line-height: 1.5; }
.title-sm    { font-size: 13px; font-weight: 500; line-height: 1.5; }
.body-text-2xl { font-size: 17px; font-weight: 400; line-height: 1.55; }
.body-text-lg  { font-size: 16px; font-weight: 400; line-height: 1.55; }
.body-text-base{ font-size: 14px; font-weight: 400; line-height: 1.55; }
.tag {
  text-transform: uppercase;
  letter-spacing: var(--tracking-wider);
  font-size: 13px; font-weight: 500; line-height: 1.4;
}

@media (min-width: 640px) {
  .heading-3xl { font-size: 40px; }
  .heading-2xl { font-size: 30px; }
  .title-xl    { font-size: 19px; }
  .title-lg    { font-size: 18px; }
  .title-base  { font-size: 15px; }
  .title-sm    { font-size: 14px; }
  .body-text-2xl { font-size: 20px; }
  .body-text-lg  { font-size: 17px; }
}
@media (min-width: 768px) {
  .heading-3xl { font-size: 50px; }
  .heading-2xl { font-size: 34px; }
  .heading-md  { font-size: 24px; }
  .body-text-lg { font-size: 18px; }
}
@media (min-width: 1024px) {
  .heading-3xl { font-size: 60px; }
  .heading-2xl { font-size: 44px; line-height: 1.25; }
  .title-xl    { font-size: 20px; }
  .title-base  { font-size: 16px; }
  .title-sm    { font-size: 15px; }
  .body-text-2xl { font-size: 22px; }
  .body-text-lg  { font-size: 19px; }
  .body-text-base{ font-size: 16px; }
  .tag { font-size: 14px; }
}
@media (min-width: 1280px) {
  .heading-3xl { font-size: 70px; line-height: 1.2; }
  .heading-2xl { font-size: 50px; }
  .heading-md  { font-size: 30px; }
  .title-xl    { font-size: 21px; }
  .title-lg    { font-size: 20px; }
  .title-base  { font-size: 18px; }
  .title-sm    { font-size: 17px; }
  .body-text-2xl { font-size: 26px; line-height: 1.5; }
  .body-text-lg  { font-size: 20px; }
  .body-text-base{ font-size: 18px; }
}
@media (min-width: 1536px) {
  .heading-3xl { font-size: 80px; }
  .heading-2xl { font-size: 54px; }
  .body-text-2xl { font-size: 28px; }
}
@media (min-width: 1760px) {
  .heading-2xl { font-size: 60px; }
  .body-text-2xl { font-size: 30px; line-height: 1.45; }
}

.font-medium { font-weight: 500; }
.text-balance { text-wrap: balance; }
.text-pretty { text-wrap: pretty; }
.tabular-nums { font-variant-numeric: tabular-nums; }

/* ============================================================
   HEADER
   ============================================================ */
.site-header {
  position: sticky;
  top: 0; left: 0;
  z-index: 50;
  display: flex;
  height: var(--header-height);
  width: 100%;
  margin-top: calc(-1 * var(--header-height));
  color: var(--white);
  transition: height .25s, background-color .25s, box-shadow .25s;
}
.site-header[data-scrolled="true"] {
  height: var(--header-height-scrolled);
  background-color: var(--green-100);
  color: var(--dark-blue);
  box-shadow: 0 25px 50px -12px rgba(0,0,0,.1);
}
.site-header[data-visible-bg="true"] { color: var(--dark-blue); }

.header-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  width: 100%;
  margin-inline: auto;
  max-width: var(--container-size-xl);
  padding-inline: var(--container-padding-x);
}
@media (min-width: 1280px) { .header-bar { gap: 2rem; } }
@media (min-width: 1536px) { .header-bar { justify-content: center; } }

.nav-desktop { display: none; }
@media (min-width: 1024px) {
  .nav-desktop { display: block; }
  .nav-left { margin-left: auto; }
  .nav-left, .nav-right { order: initial; }
}
@media (min-width: 1536px) {
  .nav-left, .nav-right { width: 100%; }
}
.nav-list { display: flex; align-items: center; gap: 1.5rem; }
.nav-list.right { justify-content: flex-end; }
@media (min-width: 1280px) { .nav-list { gap: 2rem; } }
@media (min-width: 1536px) { .nav-list { gap: 2.5rem; } }
.nav-item { position: relative; font-size: 1rem; font-weight: 500; }
@media (min-width: 1536px) { .nav-item { font-size: 1.125rem; } }
.nav-item > button, .nav-item > a { transition: color .15s; }
.nav-link:hover { color: var(--green-600); }

.brand { display: block; flex-shrink: 0; width: 5rem; }
@media (min-width: 640px) { .brand { width: 6rem; } }
@media (min-width: 1024px) { .brand { width: 6.5rem; } }
@media (min-width: 1280px) { .brand { width: 7rem; } }
@media (min-width: 1536px) { .brand { width: 8rem; } }
.brand svg { width: 100%; height: auto; }

.menu-toggle { width: 1.75rem; height: 1.75rem; display: block; order: 2; }
@media (min-width: 640px) { .menu-toggle { width: 2rem; height: 2rem; } }
@media (min-width: 1024px) { .menu-toggle { display: none; } }
.menu-toggle svg { width: 100%; height: 100%; }

/* button (CTA pill: contact us) */
.btn-pill {
  display: inline-flex;
  width: fit-content;
  border-radius: 9999px;
  font-weight: 500;
  transition: transform .3s, box-shadow .3s;
  padding: .75rem 1rem;
  font-size: .875rem;
  background-color: var(--dark-blue);
  color: var(--white);
}
.btn-pill:hover { transform: translateY(-1px); box-shadow: 0 20px 25px -5px rgba(0,0,0,.1); }
@media (min-width: 768px) { .btn-pill { font-size: 1rem; } }
@media (min-width: 1024px) { .btn-pill { padding-inline: 1.5rem; } }
@media (min-width: 1280px) { .btn-pill { padding: .875rem 1.75rem; } }
@media (min-width: 1536px) { .btn-pill { padding: 1rem 2rem; font-size: 1.125rem; } }

/* ---------- mega dropdown ---------- */
.dropdown-wrap {
  position: absolute;
  inset-inline: 0;
  top: 100%;
  padding-block: 2rem;
  color: var(--dark-blue);
}
@media (min-width: 1280px) { .dropdown-wrap { padding-block: 2.5rem; } }
@media (min-width: 1536px) { .dropdown-wrap { padding-block: 3rem; } }
.dropdown-wrap[hidden] { display: none; }
.dropdown-bg {
  position: absolute;
  inset: 0;
  top: calc(-1 * var(--header-height));
  z-index: -10;
  background-color: var(--green-100);
  box-shadow: 0 25px 50px -12px rgba(0,0,0,.1);
  /* original: x-transition scale-y-0 -> scale-y-100, origin-top, 250ms */
  transform: scaleY(0);
  transform-origin: top;
  transition: transform .25s ease-in-out;
}
.dropdown-wrap.is-open .dropdown-bg { transform: scaleY(1); }
.dropdown-hr { position: absolute; inset-inline: 0; top: 0; border: 0; border-top: 1px solid var(--green-300);
  /* original: opacity fade 250ms */
  opacity: 0; transition: opacity .25s; }
.dropdown-wrap.is-open .dropdown-hr { opacity: 1; }
.dropdown-panel {
  position: relative;
  display: flex;
  justify-content: center;
  gap: 3rem;
  width: 100%;
  margin-inline: auto;
  max-width: var(--container-size-xl);
  padding-inline: var(--container-padding-x);
}
.dropdown-panel[hidden] { display: none; }
/* original panel enter: translate-y-4 opacity-0 -> translate-y-0 opacity-100, 250ms */
.dropdown-panel { transform: translateY(1rem); opacity: 0; transition: transform .25s ease-in-out, opacity .25s ease-in-out; }
.dropdown-wrap.is-open .dropdown-panel:not([hidden]) { transform: translateY(0); opacity: 1; }
@media (min-width: 1536px) { .dropdown-panel { justify-content: space-between; } }
@media (min-width: 1760px) { .dropdown-panel { gap: 4rem; } }
.dropdown-intro { display: none; width: 24rem; }
@media (min-width: 1536px) { .dropdown-intro { display: block; } }
.dropdown-intro h3 { margin-bottom: 1.5rem; }
.dropdown-intro p { font-size: 1rem; line-height: 1.5; }
.dropdown-links { flex-shrink: 0; }
.dropdown-links .tag { margin-bottom: 1rem; }
@media (min-width: 1536px) { .dropdown-links .tag { margin-top: .5rem; margin-bottom: 1.5rem; } }
.dropdown-links ul { display: flex; flex-direction: column; gap: .125rem; font-size: 1rem; }
.dropdown-links a { font-weight: 500; transition: color .15s; }
.dropdown-links a:hover { color: var(--green-600); }
.dropdown-cards { display: flex; flex-wrap: wrap; gap: 1rem; }
@media (min-width: 1280px) { .dropdown-cards { gap: 1.5rem; } }
@media (min-width: 1760px) { .dropdown-cards { gap: 2rem; } }

.image-card {
  position: relative;
  display: flex;
  align-items: flex-end;
  flex-shrink: 0;
  width: 12.5rem;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: var(--radius-md);
  padding: 1rem .75rem;
}
@media (min-width: 1280px) { .image-card { width: 13.5rem; padding: 1rem; } }
@media (min-width: 1760px) { .image-card { width: 16rem; padding: 1.25rem; } }
.image-card img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .3s;
}
.image-card:hover img { transform: scale(1.05); }
.image-card .overlay {
  position: absolute; inset: 0; width: 100%; height: 100%;
  background-image: linear-gradient(to top, rgba(11,20,24,.4), rgba(11,20,24,.05));
}
.image-card h4 {
  position: relative;
  font-size: 1rem; line-height: 1.375; font-weight: 500;
  color: var(--white);
}
@media (min-width: 1760px) { .image-card h4 { font-size: 1.125rem; } }

/* ============================================================
   HERO
   ============================================================ */
.hero {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 5rem;
  aspect-ratio: 16 / 9;
  max-height: 100dvh;
  width: 100%;
  padding-top: var(--header-height);
  padding-bottom: 1rem;
  color: var(--white);
  margin-bottom: var(--section-spacing-lg);
}
@media (min-width: 640px) { .hero { gap: 4rem; padding-bottom: 2rem; } }
@media (min-width: 1024px) { .hero { padding-bottom: 3rem; } }
@media (min-width: 1280px) { .hero { padding-bottom: 4rem; } }
.hero > video {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
}
.hero .scrim-1 { position: absolute; inset: 0; width: 100%; height: 100%;
  background-image: linear-gradient(to top, rgba(0,0,0,.1), rgba(0,0,0,.5)); }
.hero .scrim-2 { position: absolute; inset: 0; width: 100%; height: 100%;
  background-color: rgba(20,54,63,.2); }
.hero-content {
  position: relative;
  display: flex; flex-grow: 1;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 1rem;
}
@media (max-width: 1535px) { .hero-content { padding-top: 2.5rem; } }
@media (min-width: 640px) { .hero-content { gap: 1.5rem; } }
@media (min-width: 768px) { .hero-content { gap: 2rem; } }
@media (min-width: 1024px) { .hero-content { gap: 2.5rem; } }
@media (min-width: 1280px) { .hero-content { gap: 3rem; } }
.hero-content h1 { max-width: 32rem; }
@media (min-width: 1024px) { .hero-content h1 { max-width: 36rem; } }
@media (min-width: 1280px) { .hero-content h1 { max-width: 42rem; } }
@media (min-width: 1536px) { .hero-content h1 { max-width: 48rem; } }

/* arrow pill button ("Tell me more" / "Become a Sparc company") */
.btn-arrow {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 9999px;
  background-color: var(--dark-blue);
  color: var(--green-500);
  padding: .375rem;
  transition: color .3s;
  min-width: 10rem;
}
.btn-arrow:hover { color: var(--dark-blue); }
@media (min-width: 640px) { .btn-arrow { min-width: 15rem; } }
@media (min-width: 1024px) { .btn-arrow { min-width: 17.5rem; } }
@media (min-width: 1280px) { .btn-arrow { min-width: 20rem; } }
@media (min-width: 1536px) { .btn-arrow { padding: .5rem; } }
.btn-arrow .fill {
  position: absolute;
  inset: .375rem; right: 1.375rem;
  border-radius: 9999px 0 0 9999px;
  background-color: var(--green-500);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform .3s;
}
.btn-arrow:hover .fill { transform: scaleX(1); }
@media (min-width: 640px) { .btn-arrow .fill { right: 1.625rem; } }
@media (min-width: 1024px) { .btn-arrow .fill { right: 1.875rem; } }
@media (min-width: 1280px) { .btn-arrow .fill { right: 2.125rem; } }
@media (min-width: 1536px) { .btn-arrow .fill { inset: .5rem; right: 2.5rem; } }
.btn-arrow .label { position: relative; padding-inline: 1rem; }
@media (min-width: 1024px) { .btn-arrow .label { padding-inline: 1.5rem; } }
@media (min-width: 1536px) { .btn-arrow .label { padding-inline: 2rem; } }
.btn-arrow .circle {
  position: relative;
  display: flex; align-items: center; justify-content: center;
  width: 2rem; height: 2rem;
  border-radius: 9999px;
  background-color: var(--green-500);
  color: var(--dark-blue);
}
@media (min-width: 640px) { .btn-arrow .circle { width: 2.5rem; height: 2.5rem; } }
@media (min-width: 1024px) { .btn-arrow .circle { width: 3rem; height: 3rem; } }
@media (min-width: 1280px) { .btn-arrow .circle { width: 3.5rem; height: 3.5rem; } }
@media (min-width: 1536px) { .btn-arrow .circle { width: 4rem; height: 4rem; } }
.btn-arrow .circle svg { width: .75rem; height: .75rem; }
@media (min-width: 640px) { .btn-arrow .circle svg { width: 1rem; height: 1rem; } }
@media (min-width: 1024px) { .btn-arrow .circle svg { width: 1.25rem; height: 1.25rem; } }
@media (min-width: 1280px) { .btn-arrow .circle svg { width: 1.5rem; height: 1.5rem; } }
@media (min-width: 1536px) { .btn-arrow .circle svg { width: 1.75rem; height: 1.75rem; } }

.hero-sub {
  position: relative;
  display: flex; align-items: flex-end;
  width: 100%;
  padding-inline: 1rem;
}
@media (min-width: 768px) { .hero-sub { padding-inline: 2rem; } }
@media (min-width: 1536px) { .hero-sub { padding-inline: 3rem; } }
.hero-sub h2 { width: 16rem; max-width: 100%; }
.discover-more {
  margin-left: auto;
  display: none;
  align-items: center;
  gap: 1rem;
  transition: color .15s;
}
.discover-more:hover { color: var(--green-500); }
@media (min-width: 768px) { .discover-more { display: flex; } }
.discover-more svg { width: 1.25rem; height: 1.25rem; }

/* ============================================================
   MARQUEE (subsidiary logos)
   ============================================================ */
.marquee-root {
  --gap: 48px;
  --speed: 40s;
  position: relative;
  display: flex;
  flex-direction: row;
  min-width: 0; max-width: 100%;
  overflow: hidden;
}
@media (min-width: 768px) { .marquee-root { --gap: 64px; } }
.marquee-content {
  display: flex;
  gap: var(--gap);
  flex-shrink: 0;
  width: max-content;
  min-width: 100%;
}
.marquee-content:first-child { animation: marquee-first var(--speed) linear infinite; }
.marquee-content:last-child {
  animation: marquee-last var(--speed) linear infinite;
  position: absolute; top: 0; left: 0;
}
@keyframes marquee-first { 0% { transform: translateX(0); } 100% { transform: translateX(calc(-100% - var(--gap))); } }
@keyframes marquee-last { 0% { transform: translateX(calc(100% + var(--gap))); } 100% { transform: translateX(0); } }
.marquee-content img {
  height: 2.5rem; width: 4rem;
  flex-shrink: 0;
  object-fit: contain;
  opacity: .5;
  filter: grayscale(1);
}
@media (min-width: 640px) { .marquee-content img { height: 3rem; width: 6rem; } }
@media (min-width: 1024px) { .marquee-content img { height: 3.5rem; width: 9.5rem; } }

/* ============================================================
   STATS BLOCK
   ============================================================ */
.panel-rounded { border-radius: var(--radius-lg); }
@media (min-width: 1280px) { .panel-rounded { border-radius: 1rem; } }
.bg-green-200 { background-color: var(--green-200); color: var(--dark-blue); }
.bg-dark-blue { background-color: var(--dark-blue); color: var(--white); }

.stats-inner { padding-block: 2rem; }
@media (min-width: 768px) { .stats-inner { padding-block: 4rem; } }
@media (min-width: 1280px) { .stats-inner { padding-block: 6rem; } }
@media (min-width: 1536px) { .stats-inner { padding-block: 8.5rem; } }
@media (min-width: 1760px) { .stats-inner { padding-block: 9.5rem; } }
.stats-row {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2rem;
  text-align: center;
}
@media (min-width: 640px) { .stats-row { gap: 3rem; } }
@media (min-width: 1024px) {
  .stats-row {
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    text-align: left;
    padding-top: 1rem;
  }
}
@media (min-width: 1760px) { .stats-row { padding-top: 2rem; } }
.stats-lead { }
@media (min-width: 1024px) { .stats-lead { max-width: 32rem; } }
@media (min-width: 1280px) { .stats-lead { max-width: 42rem; } }
.stats-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem;
}
@media (min-width: 640px) { .stats-grid { gap: 2rem; } }
@media (min-width: 1024px) { .stats-grid { column-gap: 1.5rem; } }
@media (min-width: 1280px) { .stats-grid { row-gap: 2.5rem; } }
@media (min-width: 1536px) { .stats-grid { row-gap: 3.5rem; } }
@media (min-width: 1760px) { .stats-grid { row-gap: 5rem; } }
.stat .num {
  position: relative;
  margin-bottom: .5rem;
  font-size: 2.25rem; /* text-4xl */
  line-height: 1.1;
}
@media (min-width: 640px) { .stat .num { margin-bottom: .75rem; } }
@media (min-width: 768px) { .stat .num { font-size: 3rem; } }
@media (min-width: 1024px) { .stat .num { margin-bottom: 1rem; } }
@media (min-width: 1280px) { .stat .num { font-size: 3.75rem; } }
@media (min-width: 1536px) { .stat .num { font-size: 4.5rem; } }
@media (min-width: 1760px) { .stat .num { font-size: 6rem; } }

/* ============================================================
   BUSINESS AREAS (icon list)
   ============================================================ */
.areas-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.5rem;
}
@media (min-width: 768px) { .areas-grid { grid-template-columns: 1fr 1fr; gap: 3.5rem; } }
@media (min-width: 1024px) { .areas-grid { gap: 5rem; } }
@media (min-width: 1280px) { .areas-grid { gap: 7.5rem; } }
.area {
  display: flex;
  gap: 1rem;
  border-bottom: 2px solid var(--green-300);
  padding-bottom: 2.5rem;
}
@media (min-width: 768px) { .area { gap: 1.5rem; } }
@media (min-width: 1024px) { .area { gap: 2rem; padding-bottom: 3rem; } }
@media (min-width: 1280px) { .area { gap: 3rem; } }
/* last row borderless on narrow (matches max-md:last:border-0) */
@media (max-width: 767px) { .area:last-child { border-bottom: 0; } }
.area-icon {
  margin-top: -.25rem;
  width: 2.5rem; height: 2.5rem;
  flex-shrink: 0;
  color: var(--green-500);
}
.area-icon svg { width: 100%; height: 100%; }
@media (min-width: 768px) { .area-icon { width: 3.5rem; height: 3.5rem; } }
@media (min-width: 1024px) { .area-icon { width: 4rem; height: 4rem; } }
@media (min-width: 1280px) { .area-icon { width: 5rem; height: 5rem; } }
.area-body { display: flex; flex-direction: column; gap: .5rem; }
@media (min-width: 768px) { .area-body { gap: 1rem; } }
@media (min-width: 1024px) { .area-body { gap: 1.5rem; } }

/* ============================================================
   SPARC MODEL (accordion + image)
   ============================================================ */
.model {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2.5rem;
}
@media (min-width: 1024px) { .model { flex-direction: row; gap: 3.5rem; } }
@media (min-width: 1280px) { .model { gap: 5rem; } }
.model-col { width: 100%; max-width: 56rem; }
.model-col h1.heading-2xl { margin-bottom: 1.25rem; max-width: 42rem; }
@media (min-width: 1024px) { .model-col h1.heading-2xl { margin-bottom: 2rem; max-width: none; } }
@media (min-width: 1536px) { .model-col h1.heading-2xl { margin-bottom: 3rem; } }
@media (min-width: 1760px) { .model-col h1.heading-2xl { margin-bottom: 4rem; } }

.accordion { border-bottom: 2px solid var(--green-300); }
@media (min-width: 1536px) { .accordion { max-width: 48rem; } }
.accordion-head {
  display: flex;
  align-items: center;
  gap: 1rem;
  cursor: pointer;
  padding-block: 1.25rem;
}
@media (min-width: 1024px) { .accordion-head { padding-block: 1.5rem; } }
@media (min-width: 1280px) { .accordion-head { padding-block: 2rem; } }
.accordion-num {
  width: 2.25rem; flex-shrink: 0;
  padding-left: .5rem;
  font-size: 20px; line-height: 1.2;
  color: var(--green-500);
  font-variant-numeric: tabular-nums;
}
@media (min-width: 640px) { .accordion-num { width: 3rem; padding-left: .75rem; font-size: 18px; } }
@media (min-width: 1280px) { .accordion-num { width: 4rem; padding-left: 1rem; font-size: 24px; } }
@media (min-width: 768px) and (max-width:1279px) { .accordion-num { font-size: 18px; } }
@media (min-width: 1280px) { .accordion-num { font-size: 30px; } }
.accordion-head h3 { text-wrap: pretty; }
.accordion-icon {
  margin-left: auto;
  width: 1.25rem; height: 1.25rem;
  transition: transform .25s;
}
@media (min-width: 1024px) { .accordion-icon { width: 1.375rem; height: 1.375rem; } }
@media (min-width: 1280px) { .accordion-icon { width: 1.5rem; height: 1.5rem; } }
.accordion[aria-expanded="true"] .accordion-icon { transform: rotate(180deg); }
.accordion-body {
  display: grid;
  grid-template-rows: 0fr;
  overflow: hidden;
  transition: grid-template-rows .25s;
}
.accordion[aria-expanded="true"] .accordion-body { grid-template-rows: 1fr; }
.accordion-body > .inner { min-height: 0; }
.accordion-body .content {
  padding-bottom: 2rem;
  max-width: 42rem;
  padding-left: 3.25rem;
}
@media (min-width: 640px) { .accordion-body .content { padding-left: 4rem; } }
@media (min-width: 1280px) { .accordion-body .content { padding-left: 5rem; } }
.content p { margin-bottom: 1.25em; }
.content p:last-child { margin-bottom: 0; }

.model-image { position: relative; width: 100%; flex-shrink: 0; }
@media (min-width: 768px) { .model-image { margin-left: auto; } }
@media (min-width: 1024px) { .model-image { width: 40%; } }
@media (min-width: 1760px) { .model-image { width: 42rem; } }
.model-image img {
  aspect-ratio: 3 / 4;
  width: 100%;
  border-radius: var(--radius-md);
  object-fit: cover;
}
.model-image .float-btn { position: absolute; right: .5rem; bottom: 1rem; }
@media (min-width: 640px) { .model-image .float-btn { right: .75rem; bottom: 1.5rem; } }

/* ============================================================
   STORY (dark) — video + Vimeo
   ============================================================ */
.story-inner {
  display: flex;
  flex-direction: column-reverse;
  padding-block: 1.5rem;
}
@media (min-width: 768px) { .story-inner { padding-block: 2rem; } }
@media (min-width: 1024px) { .story-inner { flex-direction: column; padding-block: 3.5rem; } }
@media (min-width: 1280px) { .story-inner { padding-block: 5rem; } }
@media (min-width: 1536px) { .story-inner { padding-block: 6.25rem; } }
.story-top {
  margin-top: 1.5rem;
  display: flex;
  justify-content: flex-end;
  width: 100%;
  margin-inline: auto;
  max-width: var(--container-size-full);
  padding-inline: var(--container-padding-x);
}
@media (min-width: 1024px) { .story-top { margin-top: -1.5rem; margin-bottom: 1.5rem; } }
@media (min-width: 1536px) { .story-top { margin-top: -2rem; margin-bottom: 1rem; } }
.link-arrow {
  display: flex; align-items: center; gap: .875rem;
}
@media (min-width: 640px) { .link-arrow { gap: 1.25rem; } }
.link-arrow svg { width: 1.25rem; height: 1.25rem; flex-shrink: 0; }
.story-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
}
@media (min-width: 768px) { .story-grid { gap: 2.5rem; } }
@media (min-width: 1024px) { .story-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1280px) { .story-grid { gap: 3rem; } }
.story-video {
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: var(--radius-md);
}
.story-video > video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.story-play-wrap { position: absolute; right: 1rem; bottom: 1rem; }
@media (min-width: 768px) { .story-play-wrap { right: 1.5rem; bottom: 1.5rem; } }
@media (min-width: 1280px) { .story-play-wrap { right: 2rem; bottom: 2rem; } }
.play-btn {
  display: flex; align-items: center; justify-content: center;
  width: 3rem; height: 3rem;
  border-radius: 9999px;
  background-color: var(--green-500);
  color: var(--dark-blue);
  transition: background-color .15s;
}
.play-btn:hover { background-color: var(--green-400); }
@media (min-width: 1280px) { .play-btn { width: 4rem; height: 4rem; } }
.play-btn svg { width: 1.5rem; height: 1.5rem; }
@media (min-width: 1280px) { .play-btn svg { width: 2rem; height: 2rem; } }
.story-quote { max-width: 36rem; }
@media (min-width: 1024px) { .story-quote { margin: auto; } }
.story-quote .eyebrow {
  margin-bottom: 1rem;
  font-size: .75rem; font-weight: 500;
  letter-spacing: .15em; text-transform: uppercase;
  color: var(--green-500);
}
@media (min-width: 640px) { .story-quote .eyebrow { margin-bottom: 1.5rem; } }
@media (min-width: 768px) { .story-quote .eyebrow { font-size: .875rem; } }
@media (min-width: 1024px) { .story-quote .eyebrow { margin-bottom: 1.75rem; } }
@media (min-width: 1536px) { .story-quote .eyebrow { margin-bottom: 2.5rem; } }
.story-quote .big { margin-bottom: .75rem; }
@media (min-width: 640px) { .story-quote .big { margin-bottom: 1rem; } }
@media (min-width: 1024px) { .story-quote .big { margin-bottom: 1.25rem; } }
@media (min-width: 1536px) { .story-quote .big { margin-bottom: 2rem; } }
.story-quote .attr { font-size: .875rem; font-weight: 500; }

/* Vimeo modal */
.vimeo-modal {
  position: fixed; inset: 0;
  z-index: 50;
  display: flex; align-items: center; justify-content: center;
  width: 100%; height: 100%;
  background-color: rgba(0,0,0,.95);
  /* original: x-transition.opacity.duration.250ms */
  opacity: 0; transition: opacity .25s;
}
.vimeo-modal.is-open { opacity: 1; }
.vimeo-modal[hidden] { display: none; }
.vimeo-close {
  position: absolute; top: 0; right: 0;
  z-index: 60;
  display: flex; align-items: center; justify-content: center;
  width: 3rem; height: 3rem;
  color: var(--white);
}
@media (min-width: 640px) { .vimeo-close { width: 3.5rem; height: 3.5rem; } }
.vimeo-close svg { width: 1.75rem; height: 1.75rem; }
@media (min-width: 640px) { .vimeo-close svg { width: 2rem; height: 2rem; } }
.vimeo-frame {
  position: relative;
  aspect-ratio: 16 / 9;
  max-height: 100dvh;
  width: 100%; max-width: 100%;
}
.vimeo-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* ============================================================
   LATEST NEWS
   ============================================================ */
.news-head {
  display: flex;
  flex-direction: column;
  gap: .75rem;
  margin-bottom: 2rem;
}
@media (min-width: 640px) {
  .news-head { flex-direction: row; align-items: center; justify-content: space-between; gap: 1.5rem; }
}
@media (min-width: 1280px) { .news-head { margin-bottom: 2.5rem; } }
@media (min-width: 1536px) { .news-head { margin-bottom: 3rem; } }
@media (min-width: 1760px) { .news-head { margin-bottom: 3.5rem; } }
.news-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
}
@media (min-width: 640px) { .news-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 768px) { .news-grid { gap: 2.5rem; } }
@media (min-width: 1024px) { .news-grid { gap: 3rem; } }
@media (min-width: 1280px) { .news-grid { grid-template-columns: repeat(3, 1fr); gap: 3.5rem; } }
.news-card { display: flex; height: 100%; flex-direction: column; justify-content: space-between; }
/* hide 3rd card between sm and xl (matches sm:max-xl:last:hidden) */
@media (min-width: 640px) and (max-width: 1279px) { .news-card:last-child { display: none; } }
.news-card .media { display: flex; flex-direction: column; gap: 1rem; }
@media (min-width: 1024px) { .news-card .media { gap: 1.5rem; } }
@media (min-width: 1280px) { .news-card .media { gap: 2rem; } }
.news-card img { aspect-ratio: 12 / 8; width: 100%; border-radius: var(--radius-md); object-fit: cover; }
.news-card .date { margin-top: .75rem; font-size: .875rem; }
@media (min-width: 1024px) { .news-card .date { margin-top: 1rem; } }
@media (min-width: 1280px) { .news-card .date { margin-top: 1.5rem; } }

/* ============================================================
   NEWSLETTER
   ============================================================ */
.newsletter-inner { padding-block: 2.5rem; }
@media (min-width: 1024px) { .newsletter-inner { padding-block: 4rem; } }
@media (min-width: 1280px) { .newsletter-inner { padding-block: 4.5rem; } }
@media (min-width: 1536px) { .newsletter-inner { padding-block: 5rem; } }
.newsletter-row {
  display: flex; flex-direction: column;
  gap: 2rem;
}
@media (min-width: 640px) { .newsletter-row { gap: 2.5rem; } }
@media (min-width: 1024px) { .newsletter-row { flex-direction: row; justify-content: space-between; gap: 4rem; } }
.newsletter-text { max-width: 65ch; }
.newsletter-text h2 { margin-bottom: 1rem; }
@media (min-width: 1024px) { .newsletter-text h2 { margin-bottom: 1.5rem; } }
.newsletter-form { margin-top: auto; flex-shrink: 0; }
@media (max-width: 1023px) { .newsletter-form { max-width: 28rem; } }
@media (min-width: 1024px) { .newsletter-form { width: 24rem; } }
@media (min-width: 1280px) { .newsletter-form { width: 28rem; } }
.field { position: relative; }
.field input[type="email"] {
  width: 100%;
  border-radius: 9999px;
  border: 1px solid var(--green-100);
  background-color: var(--green-100);
  padding: 1.25rem 5rem 1.25rem 1.75rem;
  font-size: 1rem; font-weight: 500;
  color: var(--dark-blue);
}
.field input[type="email"]::placeholder { color: var(--dark-blue); font-size: .875rem; }
.field input[type="email"]:focus { border-color: var(--green-500); outline: 0; }
@media (min-width: 640px) {
  .field input[type="email"] { padding: 1.5rem 5rem 1.5rem 2.25rem; }
  .field input[type="email"]::placeholder { font-size: 1rem; }
}
@media (min-width: 1280px) { .field input[type="email"] { padding-block: 1.75rem; } }
.field .submit {
  position: absolute;
  top: 50%; right: .375rem;
  transform: translateY(-50%);
  display: flex; align-items: center; justify-content: center;
  aspect-ratio: 1;
  height: calc(100% - .75rem);
  border-radius: 9999px;
  background-color: var(--green-500);
  color: var(--dark-blue);
  transition: background-color .15s;
}
.field .submit:hover { background-color: var(--green-400); }
@media (min-width: 640px) { .field .submit { height: calc(100% - 1rem); } }
.field .submit svg { width: 1.25rem; height: 1.25rem; }
@media (min-width: 1280px) { .field .submit svg { width: 1.5rem; height: 1.5rem; } }
.consent { margin-top: 1.5rem; padding-left: 1rem; }
@media (min-width: 1280px) { .consent { margin-top: 2rem; } }
.consent label {
  position: relative;
  display: flex; align-items: baseline;
  gap: 1.25rem;
  cursor: pointer;
  font-size: .875rem; line-height: 1.5;
}
.consent input { position: absolute; opacity: 0; width: 0; height: 0; }
.consent .box {
  position: relative; top: .25rem;
  display: flex; align-items: center; justify-content: center;
  width: 1.5rem; height: 1.5rem;
  flex-shrink: 0;
  background-color: var(--green-100);
}
.consent .box svg { width: 1rem; height: 1rem; color: var(--dark-blue); opacity: 0; transition: opacity .15s; }
.consent input:checked + .box svg { opacity: 1; }

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer { width: 100%; margin-inline: auto; max-width: var(--container-size-lg); padding-inline: var(--container-padding-x); padding-bottom: 1.5rem; }
@media (min-width: 768px) { .site-footer { padding-bottom: 2.5rem; } }
@media (min-width: 1280px) { .site-footer { padding-bottom: 3.5rem; } }
.footer-logo { display: flex; margin-bottom: 1.5rem; }
@media (min-width: 768px) { .footer-logo { margin-bottom: 2rem; } }
@media (min-width: 1280px) { .footer-logo { margin-bottom: 2.75rem; } }
.footer-logo a { display: block; width: 9rem; }
@media (min-width: 768px) { .footer-logo a { width: 11.5rem; } }
@media (min-width: 1280px) { .footer-logo a { width: 13rem; } }
.footer-top {
  display: flex; flex-direction: column;
  gap: 2rem;
}
@media (min-width: 768px) { .footer-top { gap: 3rem; } }
@media (min-width: 1280px) { .footer-top { flex-direction: row; justify-content: space-between; gap: 6rem; } }
.footer-intro { display: flex; flex-direction: column; max-width: 28rem; gap: 1.5rem; }
@media (min-width: 768px) { .footer-intro { align-items: flex-start; gap: 2rem; } }
@media (min-width: 1280px) { .footer-intro { gap: 2.5rem; } }
.footer-nav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  width: 100%;
}
@media (min-width: 768px) {
  .footer-nav { display: flex; max-width: 56rem; flex-direction: row; justify-content: space-between; gap: 3rem; text-align: left; }
}
.footer-nav h3 { margin-bottom: .75rem; }
@media (min-width: 768px) { .footer-nav h3 { margin-bottom: 1rem; } }
.footer-nav ul { display: flex; flex-direction: column; gap: .125rem; font-size: .875rem; }
@media (min-width: 768px) { .footer-nav ul { font-size: 1rem; } }
.footer-nav a { font-weight: 500; transition: color .15s; }
.footer-nav a:hover { color: var(--green-600); }
.footer-integrity-mobile { display: block; }
@media (min-width: 768px) { .footer-integrity-mobile { display: none; } }
.footer-bottom {
  margin-top: 2rem;
  display: flex; flex-direction: column-reverse;
  gap: 1.5rem;
}
@media (min-width: 768px) {
  .footer-bottom {
    margin-top: 2.5rem;
    flex-direction: row; align-items: center; justify-content: space-between;
    gap: 1.5rem;
    border-top: 1px solid var(--green-300);
    padding-top: 2.5rem;
  }
}
@media (min-width: 1280px) { .footer-bottom { margin-top: 3.25rem; padding-top: 3.25rem; } }
.lang-pill {
  display: inline-flex; align-items: center; gap: .5rem;
  border-radius: 9999px;
  border: 1px solid var(--green-300);
  padding: .5rem;
  font-size: .75rem; font-weight: 600;
  transition: background-color .15s;
}
.lang-pill:hover { background-color: var(--green-200); }
@media (min-width: 768px) { .lang-pill { gap: .75rem; } }
.lang-pill .flag { width: 1.125rem; height: 1.125rem; border-radius: 9999px; }
@media (min-width: 768px) { .lang-pill .flag { width: 1.25rem; height: 1.25rem; } }
.lang-pill .arr { margin-right: .25rem; width: .75rem; height: .75rem; color: var(--dark-blue); }
.footer-legal { display: flex; align-items: center; gap: 1rem; }
@media (min-width: 1024px) { .footer-legal { gap: 2.5rem; } }
.legal-links { display: none; }
@media (min-width: 768px) { .legal-links { display: flex; flex-direction: row; gap: 1rem; font-size: .875rem; } }
@media (min-width: 1024px) { .legal-links { gap: 2.5rem; font-size: 1rem; } }
.legal-links a { font-weight: 500; transition: color .15s; }
.legal-links a:hover { color: var(--green-600); }

/* ============================================================
   MOBILE EXPANDED MENU
   ============================================================ */
.mobile-menu {
  position: fixed; inset: 0;
  z-index: 50;
  width: 100%; margin-inline: auto;
  max-width: var(--container-size-full);
  padding-inline: var(--container-padding-x);
  background-color: var(--green-100);
}
@media (min-width: 1024px) { .mobile-menu { display: none !important; } }
.mobile-menu[hidden] { display: none; }
/* original: overlay opacity fade 250ms */
.mobile-menu { opacity: 0; transition: opacity .25s; }
.mobile-menu.is-open { opacity: 1; }
.mobile-menu-header {
  position: relative; z-index: 20;
  display: flex; align-items: center; justify-content: space-between;
  height: var(--header-height);
  background-color: var(--green-100);
}
.mobile-menu-header .brand-m { display: block; width: 5rem; flex-shrink: 0; }
@media (min-width: 640px) { .mobile-menu-header .brand-m { width: 6rem; } }
.mobile-back { display: flex; align-items: center; gap: .25rem; font-size: .75rem; font-weight: 500; }
@media (min-width: 640px) { .mobile-back { font-size: .875rem; } }
.mobile-back svg { width: 1.25rem; height: 1.25rem; }
.mobile-menu hr { border: 0; border-top: 1px solid var(--green-200); }
.mobile-scroll {
  position: absolute; inset: 0;
  width: 100%; margin-inline: auto;
  max-width: var(--container-size-full);
  padding-inline: var(--container-padding-x);
  padding-top: var(--header-height);
  overflow-x: hidden; overflow-y: auto;
}
.mobile-pane { margin-top: 1.5rem; padding-bottom: 1.5rem; }
.mobile-pane[hidden] { display: none; }
/* original pane slide: root enters from -translate-x-full, sub-panes from translate-x-full, 300ms */
.mobile-pane.pane-enter { transition: transform .3s ease-out; }
.mobile-pane.pane-enter-from-left { transform: translateX(-100%); }
.mobile-pane.pane-enter-from-right { transform: translateX(100%); }
.mobile-pane.pane-enter-active { transform: translateX(0); }
.mobile-main-grid { margin-bottom: 2rem; display: flex; flex-direction: column; gap: 2rem; }
@media (min-width: 640px) { .mobile-main-grid { flex-direction: row; } }
.mobile-col-grow { flex-grow: 1; }
.mobile-col-half { width: 50%; flex-shrink: 0; }
.mobile-pane h3.tag { margin-bottom: 1rem; }
.mobile-list { display: flex; flex-direction: column; gap: .75rem; }
@media (min-width: 640px) { .mobile-list { gap: 1rem; } }
.mobile-list > li { font-size: 1rem; font-weight: 500; }
@media (min-width: 640px) { .mobile-list > li { font-size: 1.125rem; } }
.mobile-list button, .mobile-list a { display: inline-flex; align-items: center; gap: .5rem; }
.mobile-list button svg { margin-top: 1px; width: 1.25rem; height: 1.25rem; }
@media (min-width: 640px) { .mobile-list button svg { width: 1.5rem; height: 1.5rem; } }
.mobile-panel-block { display: flex; flex-direction: column; gap: 2rem; }
@media (min-width: 640px) { .mobile-panel-block { gap: 2.5rem; } }
.mobile-panel-block .intro { max-width: 65ch; }
.mobile-panel-block .intro p { font-size: .875rem; line-height: 1.5; }
@media (min-width: 640px) { .mobile-panel-block .intro p { font-size: 1rem; } }
.mobile-discover .tag { margin-bottom: 1rem; }
.mobile-discover ul { display: flex; flex-direction: column; gap: .25rem; font-size: .875rem; }
@media (min-width: 640px) { .mobile-discover ul { font-size: 1rem; } }
.mobile-discover a { font-weight: 500; transition: color .15s; }
.mobile-discover a:hover { color: var(--green-600); }
.mobile-card-grid {
  display: grid; gap: .75rem;
  grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 640px) { .mobile-card-grid { gap: 1rem; grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 768px) { .mobile-card-grid { grid-template-columns: repeat(4, 1fr); } }
.mobile-card-grid.cols-1 { grid-template-columns: 1fr; }
@media (min-width: 640px) { .mobile-card-grid.cols-1 { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 768px) { .mobile-card-grid.cols-1 { grid-template-columns: repeat(4, 1fr); } }
.mobile-image-card {
  position: relative;
  display: flex; align-items: flex-end;
  width: 100%; aspect-ratio: 1/1;
  flex-shrink: 0;
  overflow: hidden;
  border-radius: var(--radius-md);
  padding: .75rem;
}
.mobile-image-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mobile-image-card .overlay { position: absolute; inset: 0; width: 100%; height: 100%;
  background-image: linear-gradient(to top, rgba(11,20,24,.4), rgba(11,20,24,.05)); }
.mobile-image-card h4 { position: relative; font-size: .875rem; line-height: 1.375; font-weight: 500; color: var(--white); }
@media (min-width: 640px) { .mobile-image-card h4 { font-size: 1rem; } }
.mobile-bottom-pill { margin-top: 1.5rem; }

body.no-scroll { overflow: hidden; }

/* utility text colors used inline */
.text-green-500 { color: var(--green-500); }
.text-dark-blue { color: var(--dark-blue); }
.text-white { color: var(--white); }

/* ============================================================
   SCROLL REVEALS
   Uses the site's own entrance vocabulary (the dropdown panels enter
   with translate-y-4 opacity-0 -> translate-y-0 opacity-100). Applied to
   sections/content blocks as they enter the viewport. JS adds .reveal-in.
   ============================================================ */
.reveal {
  opacity: 0;
  transform: translateY(1.5rem);
  transition: opacity .6s ease-out, transform .6s ease-out;
  will-change: opacity, transform;
}
.reveal.reveal-in {
  opacity: 1;
  transform: translateY(0);
}
/* staggered children within a revealing group */
.reveal-group > .reveal { transition-delay: 0s; }
.reveal-group.reveal-in > .reveal:nth-child(2) { transition-delay: .08s; }
.reveal-group.reveal-in > .reveal:nth-child(3) { transition-delay: .16s; }
.reveal-group.reveal-in > .reveal:nth-child(4) { transition-delay: .24s; }

/* reduced motion */
@media (prefers-reduced-motion: reduce) {
  .marquee-content:first-child,
  .marquee-content:last-child { animation: none; }
  .marquee-content:last-child { display: none; }
  *, *::before, *::after { transition-duration: .01ms !important; }
  .reveal { opacity: 1 !important; transform: none !important; }
}