@font-face {
  font-family: 'Figtree';
  src: url('../fonts/figtree-latin-var.woff2') format('woff2-variations');
  font-weight: 300 900;
  font-style: normal;
  font-display: swap;
}

:root {
  color-scheme: light;

  --brand-primary: #2B3A72;
  --brand-accent: #B5683F;
  --brand-neutral: #4C5A7A;
  --brand-bg: #FAFAFD;
  --brand-on-primary: #FFFFFF;

  --color-primary: #2B3A72;
  --color-primary-hover: #1F2A57;
  --color-primary-soft: #3D4E8F;
  --color-accent: #B5683F;
  --color-accent-text: #9A5532;        /* 4.50:1 on #EEEFFA */
  --color-accent-fill: #B5683F;        /* 3.61:1 on #FAFAFD */
  --color-accent-on-dark: #EBC0A8;     /* 6.48:1 on #2B3A72; on the hero photo only above 64rem */
  --focus-ring: #2B3A72;               /* 11.43:1 on #FAFAFD */
  --focus-ring-width: 3px;
  --focus-ring-offset: 3px;

  --color-text: #23272F;               /* 12.92:1 on #FAFAFD */
  --color-text-muted: #4C5A7A;         /* 5.33:1 on #EEEFFA */
  --color-text-invert: #FFFFFF;
  --color-text-on-dark-muted: #D9DEF3; /* 8.69:1 on #2B3A72 */
  --color-bg: #FAFAFD;
  --color-bg-alt: #FFFFFF;
  --color-bg-warm: #EEEFFA;
  --color-bg-deep: #2B3A72;
  --color-border: #8A8EAB;             /* 3.00:1 on #FFFFFF */
  --color-border-soft: #E1E3F2;

  --font-display: 'Figtree', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --font-sans: 'Figtree', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;

  --sp-1: 0.25rem;  --sp-2: 0.5rem;   --sp-3: 0.75rem;  --sp-4: 1rem;
  --sp-5: 1.25rem;  --sp-6: 1.5rem;   --sp-7: 1.75rem;  --sp-8: 2rem;
  --sp-9: 2.25rem;  --sp-10: 2.5rem;  --sp-12: 3rem;    --sp-14: 3.5rem;
  --sp-16: 4rem;    --sp-20: 5rem;    --sp-24: 6rem;    --sp-32: 8rem;

  --content-max: 74rem;
  --reading-max: 40rem;

  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;

  --shadow-card: 0 1px 2px rgba(43, 58, 114, .05), 0 8px 22px rgba(43, 58, 114, .06);
  --shadow-lift: 0 2px 8px rgba(43, 58, 114, .07), 0 20px 46px rgba(43, 58, 114, .11);

  --dur-fast: 140ms;
  --dur-base: 260ms;
  --ease: cubic-bezier(.4, 0, .2, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
}

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; scroll-padding-top: 6rem; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  margin: 0;
  background: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-sans);
  font-size: 1.0625rem;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: 800;
  line-height: 1.12;
  letter-spacing: -0.03em;
  color: var(--color-primary);
  text-wrap: balance;
  margin: 0 0 var(--sp-4);
}
h1 { font-size: clamp(2.15rem, 1.35rem + 2.9vw, 3.5rem); }
h2 { font-size: clamp(1.7rem, 1.25rem + 1.8vw, 2.5rem); }
h3 { font-size: clamp(1.2rem, 1.05rem + 0.6vw, 1.45rem); letter-spacing: -0.02em; }
h4 { font-size: 1.0625rem; letter-spacing: -0.01em; }

p { margin: 0 0 var(--sp-5); }
p:last-child { margin-bottom: 0; }

a { color: var(--color-accent-text); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--color-primary); }

::selection { background: var(--color-primary); color: #fff; }
strong { font-weight: 700; }
hr { border: 0; border-top: 1px solid var(--color-border-soft); margin: var(--sp-12) 0; }

.container {
  width: 100%;
  max-width: var(--content-max);
  margin-inline: auto;
  padding-inline: var(--sp-6);
}
@media (max-width: 40rem) { .container { padding-inline: var(--sp-5); } }

section { padding-block: clamp(3.5rem, 2rem + 6vw, 6.5rem); }

.eyebrow {
  display: block;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--color-accent-text);
  margin-bottom: var(--sp-4);
}

.section-title { margin-bottom: var(--sp-8); }

.lead {
  font-size: clamp(1.125rem, 1.05rem + 0.4vw, 1.3rem);
  line-height: 1.6;
  color: var(--color-text-muted);
  max-width: var(--reading-max);
}

.prose { max-width: var(--reading-max); }
.prose--wide { max-width: 54rem; }
.prose > * + * { margin-top: var(--sp-5); }
.prose h2 { margin-top: var(--sp-12); }
.prose .eyebrow + h2 { margin-top: 0; }
.prose h3 { margin-top: var(--sp-8); margin-bottom: var(--sp-2); }
.prose ul, .prose ol { padding-left: var(--sp-6); }
.prose li { margin-bottom: var(--sp-2); }

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-2);
  padding: 0.8125rem var(--sp-6);
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  font-family: var(--font-sans);
  font-size: 0.9375rem;
  font-weight: 700;
  letter-spacing: -0.005em;
  text-decoration: none;
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease),
              border-color var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease),
              box-shadow var(--dur-fast) var(--ease);
}
.btn:active { transform: translateY(1px); }

.btn-primary { background: var(--color-primary); color: #fff; }
.btn-primary:hover { background: var(--color-primary-hover); color: #fff; box-shadow: var(--shadow-card); }

.btn-ghost { background: transparent; color: var(--color-primary); border-color: var(--color-border); }
.btn-ghost:hover { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }

.btn-lg { padding: 1rem var(--sp-8); font-size: 1rem; }

.cc-on-dark .btn-primary { background: #fff; color: var(--color-primary); }
.cc-on-dark .btn-primary:hover { background: var(--color-accent-on-dark); color: #1F2A57; }
.cc-on-dark .btn-ghost { color: #fff; border-color: rgba(255, 255, 255, .5); }
.cc-on-dark .btn-ghost:hover { background: #fff; color: var(--color-primary); border-color: #fff; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(250, 250, 253, .9);
  backdrop-filter: saturate(160%) blur(12px);
  border-bottom: 1px solid var(--color-border-soft);
}
.site-header__inner {
  max-width: var(--content-max);
  margin-inline: auto;
  padding: var(--sp-3) var(--sp-6);
  display: flex;
  align-items: center;
  gap: var(--sp-6);
}
@media (max-width: 40rem) { .site-header__inner { padding-inline: var(--sp-5); } }

.brand { display: inline-flex; align-items: center; gap: var(--sp-3); text-decoration: none; margin-right: auto; }
.brand__mark { display: inline-flex; }
.brand__mark img { display: block; width: 48px; height: 48px; }
.site-footer .brand__mark img { width: 56px; height: 56px; }
@media (max-width: 40rem) { .brand__mark img { width: 40px; height: 40px; } }
.brand__name {
  font-family: var(--font-display);
  font-size: 1.3125rem;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: var(--brand-primary);
  white-space: nowrap;
}

.nav-desktop ul { display: flex; align-items: center; gap: var(--sp-1); list-style: none; margin: 0; padding: 0; }
.nav-desktop a {
  display: block;
  padding: var(--sp-2) var(--sp-3);
  border-radius: var(--radius-sm);
  font-size: 0.9375rem;
  font-weight: 600;
  color: #353C52;
  text-decoration: none;
  white-space: nowrap;
  transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
}
.nav-desktop a:hover { background: var(--color-bg-warm); color: var(--brand-primary); }
.nav-desktop a[aria-current="page"] { color: var(--brand-primary); background: var(--color-bg-warm); }
.nav-desktop a.cta {
  background: var(--brand-primary);
  color: #fff;
  padding-inline: var(--sp-5);
  margin-left: var(--sp-2);
}
.nav-desktop a.cta:hover { background: #1F2A57; color: #fff; }
.nav-desktop a.cta[aria-current="page"] { background: #1F2A57; color: #fff; }

.has-dropdown { position: relative; }
.dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 13rem;
  display: none;
  flex-direction: column;
  padding: var(--sp-2);
  background: #fff;
  border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-lift);
}
.has-dropdown:hover .dropdown, .has-dropdown:focus-within .dropdown { display: flex; }

.nav-toggle {
  display: none;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  padding: 0;
  background: transparent;
  border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-sm);
  color: var(--brand-primary);
  cursor: pointer;
}
.nav-toggle svg { width: 22px; height: 22px; }
@media (max-width: 60rem) { .nav-desktop { display: none; } .nav-toggle { display: inline-flex; } }

.nav-mobile {
  background: var(--brand-bg);
  color: var(--brand-primary);
  border: 0;
  border-left: 1px solid var(--color-border-soft);
  padding: var(--sp-16) var(--sp-6) var(--sp-8);
}
.nav-mobile ul { list-style: none; margin: 0; padding: 0; }
.nav-mobile > ul > li + li { border-top: 1px solid var(--color-border-soft); }
.nav-mobile a, .nav-mobile summary {
  display: block;
  padding: var(--sp-4) var(--sp-1);
  font-size: 1.0625rem;
  font-weight: 700;
  color: var(--brand-primary);
  text-decoration: none;
  cursor: pointer;
}
.nav-mobile a[aria-current="page"] { color: var(--color-accent-text); }
.nav-mobile__close {
  position: absolute;
  top: var(--sp-4);
  right: var(--sp-4);
  width: 46px;
  height: 46px;
  font-size: 1.75rem;
  line-height: 1;
  background: transparent;
  border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-sm);
  color: var(--brand-primary);
  cursor: pointer;
}

.cc-hero { position: relative; background: var(--color-bg-deep); }
.cc-hero__media { position: absolute; inset: 0; overflow: hidden; }
.cc-hero__media img { width: 100%; height: 100%; object-fit: cover; object-position: 62% 46%; display: block; }
/* Desktop overlay, lightened 2026-10-20 (option B, Sean said the photo looked too dark).
   It stays dark only behind the copy, which sits over the white gable and tree, and is
   clear from about 60% across. Measured worst case behind the glyphs at 1440 / 1100:
   eyebrow 6.0, h1 9.0, sub 5.5 / 5.2. Lighten the 30-44% stops and the sub fails 4.5. */
.cc-hero__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(100deg,
      rgba(20, 27, 58, .90) 0%,
      rgba(20, 27, 58, .82) 30%,
      rgba(20, 27, 58, .62) 44%,
      rgba(20, 27, 58, .10) 60%,
      rgba(20, 27, 58, 0) 72%);
}
@media (min-width: 64.0625rem) {
  .cc-hero__media img { filter: brightness(1.14) saturate(1.06); }
}
/* CONTRAST REQUIREMENT (WCAG 1.4.3), not decoration. Below 64rem the hero copy
   wrapped across the light sky in the photo (sub 1.59:1, eyebrow 1.62:1, h1 2.26:1
   at 390px). On phones and tablets the photo sits on top at full brightness and the
   copy moves onto solid --color-bg-deep (#2B3A72): #D9DEF3 8.04, #EBC0A8 6.48, #FFF
   about 10.8. Option B, chosen by Chance 2026-10-20. Do not put the text back over
   the photo here. */
@media (max-width: 64rem) {
  .cc-hero:not(.cc-hero--plain) { padding-top: 0; }
  .cc-hero__media { position: relative; inset: auto; aspect-ratio: 16 / 10; }
  .cc-hero__media::after { background: none; }
  .cc-hero:not(.cc-hero--plain) > .container { min-height: 0; padding-block: var(--sp-8) clamp(2.5rem, 2rem + 4vw, 4rem); }
}
.cc-hero > .container {
  position: relative;
  z-index: 1;
  padding-block: clamp(3.5rem, 2.5rem + 6vw, 6rem);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: clamp(21rem, 16rem + 14vw, 27rem);
}
.cc-hero h1 { color: #fff; max-width: 15ch; }
.cc-hero .eyebrow { color: var(--color-accent-on-dark); }
.cc-hero__sub {
  max-width: 44ch;
  font-size: clamp(1.1rem, 1.02rem + 0.4vw, 1.28rem);
  line-height: 1.6;
  color: #D9DEF3;
  margin-bottom: var(--sp-8);
}
.cc-hero__actions { display: flex; flex-wrap: wrap; gap: var(--sp-4); }

.cc-hero--plain > .container { min-height: 0; padding-block: clamp(3.5rem, 2rem + 6vw, 6rem); }

.cc-timesbar { background: #1F2A57; color: #fff; padding-block: var(--sp-5); }
.cc-timesbar ul { display: flex; flex-wrap: wrap; gap: var(--sp-4) var(--sp-10); list-style: none; margin: 0; padding: 0; }
.cc-timesbar li { display: flex; align-items: baseline; gap: var(--sp-3); font-size: 0.9688rem; }
.cc-timesbar__k {
  font-weight: 800;
  color: var(--color-accent-on-dark);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-size: 0.75rem;
}
.cc-timesbar__v { color: #fff; }

.cc-split {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: clamp(2rem, 1rem + 4vw, 4.5rem);
  align-items: center;
}
.cc-split--flip > .cc-split__media { order: -1; }
@media (max-width: 56rem) {
  .cc-split { grid-template-columns: 1fr; }
  .cc-split--flip > .cc-split__media { order: 0; }
}
.cc-split__media img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
}

.cc-figure { margin: 0; }
.cc-figure img { display: block; width: 100%; height: auto; border-radius: var(--radius-lg); box-shadow: var(--shadow-card); }
.cc-figure figcaption { margin-top: var(--sp-3); font-size: 0.875rem; color: var(--color-text-muted); }

/* Two archive photos side by side (Our Story, then and now) */
.cc-figure-pair { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-4); align-items: start; }
@media (max-width: 30rem) { .cc-figure-pair { grid-template-columns: 1fr; } }

/* Leadership: portrait beside the prose, the pair centred in the container */
.cc-leaders { display: grid; grid-template-columns: 15rem minmax(0, var(--reading-max)); justify-content: center; gap: clamp(2rem, 1rem + 3vw, 3.5rem); align-items: start; }
.cc-leaders .cc-figure { max-width: 15rem; }
@media (max-width: 48rem) { .cc-leaders { grid-template-columns: 1fr; } }

.cc-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: var(--sp-6); }
.cc-card {
  background: var(--color-bg-alt);
  border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-md);
  padding: var(--sp-8) var(--sp-7);
  box-shadow: var(--shadow-card);
  transition: transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out);
}
.cc-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lift); }
.cc-card h3 { margin-bottom: var(--sp-3); }
.cc-card p { color: var(--color-text-muted); margin-bottom: 0; }
.cc-card__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  margin-bottom: var(--sp-5);
  border-radius: var(--radius-md);
  background: var(--color-bg-warm);
  color: var(--color-accent-text);
}
.cc-card__icon svg { width: 26px; height: 26px; }

.cc-times { display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: var(--sp-6); }
.cc-time {
  background: var(--color-bg-alt);
  border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-md);
  padding: var(--sp-7);
  box-shadow: var(--shadow-card);
}
.cc-time__day {
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-accent-text);
  margin-bottom: var(--sp-2);
}
.cc-time__hour {
  font-family: var(--font-display);
  font-size: 1.875rem;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: var(--color-primary);
  line-height: 1.1;
  margin-bottom: var(--sp-2);
}
.cc-time__what { color: var(--color-text-muted); font-size: 0.9688rem; margin: 0; }

.cc-band { background: var(--color-bg-deep); color: #fff; }
.cc-band h2, .cc-band h3 { color: #fff; }
.cc-band .eyebrow { color: var(--color-accent-on-dark); }
.cc-band p { color: var(--color-text-on-dark-muted); }
.cc-band a:not(.btn) { color: var(--color-accent-on-dark); }

.cc-warm { background: var(--color-bg-warm); }
.cc-white { background: var(--color-bg-alt); }

.cc-quote {
  max-width: 34rem;
  margin: 0;
  padding-left: var(--sp-7);
  border-left: 3px solid var(--color-accent-fill);
  font-size: clamp(1.25rem, 1.1rem + 0.7vw, 1.6rem);
  font-weight: 600;
  line-height: 1.45;
  letter-spacing: -0.02em;
  color: var(--color-primary);
}

.cc-timeline { list-style: none; margin: 0; padding: 0; max-width: 46rem; }
.cc-storyline { display: grid; gap: var(--sp-10); }
@media (min-width: 64rem) {
  .cc-storyline { grid-template-columns: 0.8fr 1.2fr; gap: var(--sp-16); align-items: start; }
  .cc-storyline > .section-title { position: sticky; top: 6.5rem; margin-bottom: 0; }
}
.cc-timeline > li {
  position: relative;
  padding: 0 0 var(--sp-10) var(--sp-10);
  border-left: 1px solid var(--color-border-soft);
}
.cc-timeline > li:last-child { padding-bottom: 0; border-left-color: transparent; }
.cc-timeline > li::before {
  content: "";
  position: absolute;
  left: -6px;
  top: 0.45rem;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: var(--color-accent-fill);
}
.cc-timeline__year {
  display: block;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-accent-text);
  margin-bottom: var(--sp-2);
}
.cc-timeline h3 { margin-bottom: var(--sp-2); }
.cc-timeline p { color: var(--color-text-muted); margin-bottom: 0; }

.cc-list { list-style: none; margin: 0; padding: 0; }
@media (min-width: 64rem) {
  .cc-list { display: grid; grid-template-columns: 1fr 1fr; column-gap: var(--sp-12); }
  .cc-list > li:first-child + li { border-top: 1px solid var(--color-border-soft); }
}
.cc-list > li { padding: var(--sp-6) 0; border-bottom: 1px solid var(--color-border-soft); }
.cc-list > li:first-child { border-top: 1px solid var(--color-border-soft); }
.cc-list h3 { margin-bottom: var(--sp-2); }
.cc-list p { color: var(--color-text-muted); margin-bottom: 0; }
.cc-list--icon > li { display: grid; grid-template-columns: 2.75rem 1fr; gap: var(--sp-5); align-items: start; }
.cc-list__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  margin-top: 0.15rem;
  border-radius: var(--radius-md);
  background: var(--color-bg-warm);
  color: var(--color-accent-text);
}
.cc-list__icon svg { width: 24px; height: 24px; }
@media (max-width: 34rem) { .cc-list--icon > li { grid-template-columns: 1fr; gap: var(--sp-3); } }

.cc-band .cc-timeline > li { border-left-color: rgba(255, 255, 255, .24); }
.cc-band .cc-timeline__year { color: var(--color-accent-on-dark); }
.cc-band .cc-timeline > li::before { background: var(--color-accent-on-dark); }
.cc-band .cc-timeline h3, .cc-band .cc-list h3, .cc-band .cc-steps h3 { color: #fff; }
.cc-band .cc-timeline p, .cc-band .cc-list p, .cc-band .cc-steps p, .cc-band .lead { color: var(--color-text-on-dark-muted); }
.cc-band .cc-list > li, .cc-band .cc-list > li:first-child { border-color: rgba(255, 255, 255, .24); }
.cc-band .cc-list__icon { background: rgba(255, 255, 255, .12); color: var(--color-accent-on-dark); }
.cc-band .cc-steps > li::before { background: var(--color-accent-on-dark); color: #1F2A57; }
.cc-band .cc-card h3 { color: var(--color-primary); }
.cc-band .cc-card p { color: var(--color-text-muted); }
.cc-band .cc-quote { color: #fff; border-left-color: var(--color-accent-on-dark); }
.cc-band .cc-figure figcaption { color: var(--color-text-on-dark-muted); }

.cc-checks { list-style: none; margin: 0 0 var(--sp-6); padding: 0; }
.cc-checks li { position: relative; padding-left: var(--sp-8); margin-bottom: var(--sp-3); }
.cc-checks li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.6rem;
  width: 14px;
  height: 8px;
  border-left: 2px solid var(--color-accent-fill);
  border-bottom: 2px solid var(--color-accent-fill);
  transform: rotate(-45deg);
}
.cc-band .cc-checks li::before { border-color: var(--color-accent-on-dark); }

.cc-steps { list-style: none; counter-reset: s; margin: 0; padding: 0; }
@media (min-width: 60rem) {
  .cc-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: var(--sp-10); }
  .cc-steps > li { margin-bottom: 0; }
}
.cc-steps > li { counter-increment: s; position: relative; padding-left: var(--sp-12); margin-bottom: var(--sp-8); }
.cc-steps > li::before {
  content: counter(s);
  position: absolute;
  left: 0;
  top: 0;
  width: 2.25rem;
  height: 2.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--color-primary);
  color: #fff;
  font-size: 1.0625rem;
  font-weight: 800;
}
.cc-steps h3 { margin-bottom: var(--sp-2); }
.cc-steps p { color: var(--color-text-muted); margin-bottom: 0; }
.cc-steps p + p { margin-top: var(--sp-3); }

.cc-faq { max-width: 56rem; }
.cc-faq details { border-bottom: 1px solid var(--color-border-soft); }
.cc-faq details:first-child { border-top: 1px solid var(--color-border-soft); }
.cc-faq summary {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--sp-5);
  padding: var(--sp-6) 0;
  font-size: clamp(1.05rem, 1rem + 0.3vw, 1.22rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--color-primary);
  cursor: pointer;
  list-style: none;
}
.cc-faq summary::-webkit-details-marker { display: none; }
.cc-faq summary::after {
  content: "";
  flex: none;
  width: 12px;
  height: 12px;
  margin-top: 0.45rem;
  border-right: 2px solid var(--color-accent-text);
  border-bottom: 2px solid var(--color-accent-text);
  transform: rotate(45deg);
  transition: transform var(--dur-base) var(--ease);
}
.cc-faq details[open] summary::after { transform: rotate(-135deg); }
.cc-faq__a { padding: 0 0 var(--sp-6); max-width: 60ch; }
.cc-faq__a p { color: var(--color-text-muted); }

.cc-info { display: grid; gap: var(--sp-6); }
/* Two columns so a long details list reads as two short groups, not one tall ladder.
   Column flow + a fixed row count puts the first four items in column 1 and the
   service times in column 2, so the source order carries the grouping. */
@media (min-width: 48rem) {
  .cc-info--two {
    grid-auto-flow: column;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(4, auto);
    column-gap: var(--sp-10);
  }
}
.cc-info dt {
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-accent-text);
  margin-bottom: var(--sp-1);
}
.cc-info dd { margin: 0; font-size: 1.0625rem; }
.cc-band .cc-info dt { color: var(--color-accent-on-dark); }

.cc-map { width: 100%; aspect-ratio: 16 / 10; border: 0; border-radius: var(--radius-lg); box-shadow: var(--shadow-card); }

.cc-watch {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-5) var(--sp-8);
  margin-top: var(--sp-8);
  padding: var(--sp-6) var(--sp-7);
  background: var(--color-bg-alt);
  border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-card);
}
.cc-watch h3 { margin-bottom: var(--sp-1); }
.cc-watch p { margin: 0; color: var(--color-text-muted); max-width: 58ch; }
.cc-watch__actions { display: flex; flex-wrap: wrap; gap: var(--sp-3); }

.cta-band {
  background: var(--color-bg-deep);
  color: #fff;
  text-align: center;
  padding-block: clamp(3rem, 2rem + 3.5vw, 4.75rem);
}
.cta-band h2 { color: #fff; }
.cta-band p { color: var(--color-text-on-dark-muted); max-width: 46ch; margin-inline: auto; }
.cta-band .cc-hero__actions { justify-content: center; margin-top: var(--sp-8); }

/* Honeypot. Present for bots, never seen or reachable by a person. */
.hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }

.form { max-width: var(--reading-max); }
.form-row { margin-bottom: var(--sp-5); }
.form-row label { display: block; margin-bottom: var(--sp-2); font-size: 0.9375rem; font-weight: 700; color: var(--color-primary); }
.form input[type="text"],
.form input[type="email"],
.form input[type="tel"],
.form input[type="url"],
.form input[type="number"],
.form input[type="date"],
.form select,
.form textarea {
  width: 100%;
  padding: 0.8125rem var(--sp-4);
  font-family: var(--font-sans);
  font-size: 1rem;
  color: var(--color-text);
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  transition: border-color var(--dur-fast) var(--ease);
}
.form textarea { min-height: 9rem; resize: vertical; }
.form input:focus, .form select:focus, .form textarea:focus { border-color: var(--color-primary); }
.form input[type="checkbox"], .form input[type="radio"] { width: auto; margin-right: var(--sp-2); }
.form-help { font-size: 0.875rem; color: var(--color-text-muted); margin-top: var(--sp-2); }
.form-status { margin-top: var(--sp-5); font-weight: 700; }

/* Two-up field grid. Short fields pair off, long ones span, and the row gap does
   the spacing so it stays clearly larger than the label-to-input gap. */
.form--grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: var(--sp-6);
  row-gap: var(--sp-6);
  align-items: start;
  margin-top: var(--sp-8);
}
.form--grid > * { grid-column: 1 / -1; }
.form--grid .form-row { margin-bottom: 0; }
.form--grid .form-row--half { grid-column: span 1; }
.form--grid .form-status { margin-top: 0; }
.form-actions { margin-top: var(--sp-2); }
@media (max-width: 40rem) {
  .form--grid { grid-template-columns: 1fr; }
  .form--grid .form-row--half { grid-column: 1 / -1; }
}
.field-error { color: #A31515; font-size: 0.875rem; margin-top: var(--sp-2); }

.breadcrumbs { padding-block: var(--sp-5); font-size: 0.875rem; color: var(--color-text-muted); }
.breadcrumbs ol { display: flex; flex-wrap: wrap; gap: var(--sp-2); list-style: none; margin: 0; padding: 0; }
.breadcrumbs li + li::before { content: "/"; margin-right: var(--sp-2); color: var(--color-border); }

.site-footer { background: var(--brand-primary); color: #fff; padding-top: clamp(3rem, 2rem + 4vw, 5rem); }
.site-footer__grid {
  max-width: var(--content-max);
  margin-inline: auto;
  padding: 0 var(--sp-6) var(--sp-12);
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-10);
}
.site-footer__brand { flex: 1 1 20rem; min-width: 0; }
.site-footer__grid > div:not(.site-footer__brand) { flex: 1 1 9rem; min-width: 0; }
@media (max-width: 34rem) {
  .site-footer__grid { gap: var(--sp-8); }
  .site-footer__brand, .site-footer__grid > div { flex-basis: 100%; }
}
.site-footer .brand__name { color: #fff; }
.site-footer__tagline { margin: var(--sp-4) 0 var(--sp-5); color: var(--color-text-on-dark-muted); max-width: 34ch; }
.site-footer__address { font-style: normal; line-height: 1.9; color: var(--color-text-on-dark-muted); font-size: 0.9375rem; }
.site-footer__address a { color: #fff; text-decoration: none; font-weight: 700; }
.site-footer__address a:hover { text-decoration: underline; }
.site-footer h2 {
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-accent-on-dark);
  margin-bottom: var(--sp-4);
}
.site-footer ul { list-style: none; margin: 0; padding: 0; }
.site-footer li { margin-bottom: var(--sp-3); }
.site-footer__grid a { color: var(--color-text-on-dark-muted); text-decoration: none; font-size: 0.9375rem; }
.site-footer__grid a:hover { color: #fff; text-decoration: underline; }
.site-footer__social { display: flex; gap: var(--sp-3); margin-top: var(--sp-5); }
.site-footer__social li { margin: 0; }
.site-footer__social a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(255, 255, 255, .3);
  border-radius: var(--radius-sm);
  color: #fff;
}
.site-footer__social a:hover { background: rgba(255, 255, 255, .12); }
.site-footer__social svg { width: 18px; height: 18px; }
.site-footer__bottom {
  max-width: var(--content-max);
  margin-inline: auto;
  padding: var(--sp-6);
  border-top: 1px solid rgba(255, 255, 255, .18);
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-3) var(--sp-6);
  justify-content: space-between;
  align-items: center;
  font-size: 0.8125rem;
  color: var(--color-text-on-dark-muted);
}
.site-footer__credit { display: inline-flex; align-items: center; gap: 0.35rem; }
.site-footer__credit a { color: #fff; font-weight: 700; }
.spark-mark { display: inline-block; width: 2.2em; height: 2.2em; flex: none; margin-left: 0.15em; vertical-align: middle; }

.consent-banner {
  position: fixed;
  left: var(--sp-4);
  right: var(--sp-4);
  bottom: var(--sp-4);
  z-index: 90;
  max-width: 34rem;
  margin-inline: auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--sp-4);
  padding: var(--sp-5) var(--sp-6);
  background: #fff;
  border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-lift);
}
.consent-banner[hidden] { display: none; }
.consent-banner {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 280ms var(--ease-out), transform 280ms var(--ease-out);
}
.consent-banner.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .consent-banner { transition: none; }
}
.consent-banner__text { font-size: 0.9375rem; color: var(--color-text); flex: 1 1 16rem; margin: 0; }
.consent-banner__actions { display: flex; gap: var(--sp-3); }

[data-reveal-ready] .cc-reveal { opacity: 0; transform: translateY(18px); }
[data-reveal-ready] .cc-reveal.is-in {
  opacity: 1; transform: none;
  transition: opacity 620ms var(--ease-out), transform 620ms var(--ease-out);
}
[data-reveal-ready] .cc-reveal-seq > * { opacity: 0; transform: translateY(22px); }
[data-reveal-ready] .cc-reveal-seq > *.is-in {
  opacity: 1; transform: none;
  transition: opacity 700ms var(--ease-out), transform 700ms var(--ease-out);
}

@media (prefers-reduced-motion: reduce) {
  [data-reveal-ready] .cc-reveal,
  [data-reveal-ready] .cc-reveal-seq > * {
    opacity: 1 !important; transform: none !important; transition: none !important;
  }
  .cc-card:hover { transform: none; }
}

.cc-stack > * + * { margin-top: var(--sp-6); }
.cc-mt-8 { margin-top: var(--sp-8); }

/* A dark closing band sits directly on the footer, which is the same green.
   Trim its bottom padding so the two do not stack into one dead slab. */
.cc-band--closing { padding-bottom: clamp(2.5rem, 1.5rem + 2vw, 3.5rem); }
.cc-narrow { max-width: var(--reading-max); }
.cc-center { text-align: center; }
.cc-center .lead, .cc-center .cc-narrow { margin-inline: auto; }
