/* ==========================================================================
   Equidata Solutions — site styles
   Brand: Blue #1B75BC / Black #231F20 (per Brand Guidelines 0.3)
   Type:  Avenir where licensed, else Nunito Sans (per Brand Guidelines 0.2)
   ==========================================================================

   TYPEFACE NOTE
   Brand Guidelines 0.2 specify Avenir LT Std — Medium for emphasis, Book for
   body text. Avenir ships with macOS/iOS but is not web-licensed and no font
   files were supplied, so Windows and Android visitors cannot render it.

   Nunito Sans is self-hosted as the cross-platform stand-in: an open-licensed
   geometric sans with the same single-storey 'a' and near-identical
   proportions to Avenir. Weight 400 stands in for Book, 600 for Medium.

   Apple devices still get real Avenir — it is listed first in --font.
   If an Avenir LT Std web licence is purchased later, drop the woff2 files
   into assets/fonts/ and add @font-face blocks named "Avenir LT Std" above
   this stack; everything else picks it up with no further changes.
   -------------------------------------------------------------------------- */

@font-face {
  font-family: "Nunito Sans";
  src: url("../fonts/nunito-sans-var.woff2") format("woff2-variations");
  font-weight: 200 1000;
  font-style: normal;
  font-display: swap;
  /* Latin subset — matches the Latin-only copy on this site */
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
                 U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F,
                 U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
                 U+FEFF, U+FFFD;
}

:root {
  --blue: #1b75bc;
  --blue-dark: #145a91;
  --blue-darker: #0f4570;
  --blue-tint: #eaf3fa;
  --blue-tint-2: #f5f9fd;
  --black: #231f20;
  --ink: #231f20;
  --ink-2: #4a4547;
  --ink-3: #6f6a6c;
  --line: #e2e5e8;
  --line-soft: #eef1f4;
  --bg: #ffffff;
  --bg-alt: #f7f9fb;

  --wrap: 1180px;
  --gutter: 24px;

  --r: 6px;
  --r-lg: 10px;

  --shadow-sm: 0 1px 2px rgba(35, 31, 32, .06), 0 1px 3px rgba(35, 31, 32, .04);
  --shadow-md: 0 4px 16px rgba(35, 31, 32, .07), 0 1px 3px rgba(35, 31, 32, .05);
  --shadow-lg: 0 12px 40px rgba(35, 31, 32, .10);

  /* Real Avenir first (Apple devices), then the self-hosted stand-in */
  --font: "Avenir Next", "Avenir", "Nunito Sans", -apple-system, BlinkMacSystemFont,
          "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  --ease: cubic-bezier(.2, .7, .3, 1);

  --header-bg: rgba(255, 255, 255, .92);
  --card-bg: #ffffff;
  --footer-bg: #231f20;
  --hero-glow: #e9f3fb;
  --hero-top: #fbfdfe;
  color-scheme: light;
}

/* ------------------------------------------------------------ dark mode ---
   Palette is defined once in .dark-vars and applied both when the OS asks for
   dark and when the visitor forces it with the header toggle. The brand blue
   is lifted slightly for contrast against dark surfaces (#1B75BC on near-black
   falls below AA for body text; #4d9fdc clears it).
   -------------------------------------------------------------------------- */

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --blue: #4d9fdc;
    --blue-dark: #6bb2e6;
    --blue-darker: #1b75bc;
    --blue-tint: #17293a;
    --blue-tint-2: #14202c;
    --ink: #f2f4f6;
    --ink-2: #c2c8ce;
    --ink-3: #929aa2;
    --line: #33383d;
    --line-soft: #262a2e;
    --bg: #17181a;
    --bg-alt: #1d1f22;
    --header-bg: rgba(23, 24, 26, .92);
    --card-bg: #1d1f22;
    --footer-bg: #0f1011;
    --hero-glow: #1e2e3d;
    --hero-top: #1b1d20;
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, .45);
    --shadow-lg: 0 12px 40px rgba(0, 0, 0, .55);
    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --blue: #4d9fdc;
  --blue-dark: #6bb2e6;
  --blue-darker: #1b75bc;
  --blue-tint: #17293a;
  --blue-tint-2: #14202c;
  --ink: #f2f4f6;
  --ink-2: #c2c8ce;
  --ink-3: #929aa2;
  --line: #33383d;
  --line-soft: #262a2e;
  --bg: #17181a;
  --bg-alt: #1d1f22;
  --header-bg: rgba(23, 24, 26, .92);
  --card-bg: #1d1f22;
  --footer-bg: #0f1011;
  --hero-glow: #1e2e3d;
  --hero-top: #1b1d20;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, .45);
  --shadow-lg: 0 12px 40px rgba(0, 0, 0, .55);
  color-scheme: dark;
}

/* --------------------------------------------------------------- base ---- */

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

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

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

body {
  margin: 0;
  font-family: var(--font);
  font-size: 17px;
  line-height: 1.65;
  color: var(--ink-2);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img { max-width: 100%; height: auto; display: block; }

a { color: var(--blue); text-decoration: none; }
a:hover { text-decoration: underline; }

h1, h2, h3, h4 {
  color: var(--ink);
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: -.015em;
  margin: 0 0 .5em;
}

h1 { font-size: clamp(2.15rem, 1.4rem + 3.1vw, 3.6rem); letter-spacing: -.025em; }
h2 { font-size: clamp(1.7rem, 1.25rem + 1.9vw, 2.5rem); letter-spacing: -.022em; }
h3 { font-size: 1.2rem; font-weight: 600; letter-spacing: -.01em; }
h4 { font-size: 1.02rem; font-weight: 600; }

p { margin: 0 0 1.1em; }
p:last-child { margin-bottom: 0; }

strong { font-weight: 600; color: var(--ink); }

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

.wrap {
  width: 100%;
  max-width: var(--wrap);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 200;
  background: var(--blue);
  color: #fff;
  padding: 12px 20px;
  border-radius: 0 0 var(--r) 0;
  font-weight: 600;
}
.skip-link:focus { left: 0; text-decoration: none; }

/* ------------------------------------------------------------- buttons ---- */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .55em;
  padding: 14px 26px;
  border: 1px solid transparent;
  border-radius: var(--r);
  font-family: inherit;
  font-size: .97rem;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: .005em;
  text-align: center;
  cursor: pointer;
  transition: background-color .2s var(--ease), border-color .2s var(--ease),
              color .2s var(--ease), transform .2s var(--ease),
              box-shadow .2s var(--ease);
}
.btn:hover { text-decoration: none; transform: translateY(-1px); }
.btn:active { transform: translateY(0); }

.btn-primary {
  background: var(--blue);
  color: #fff;
  box-shadow: var(--shadow-sm);
}
.btn-primary:hover { background: var(--blue-dark); box-shadow: var(--shadow-md); }

.btn-secondary {
  background: transparent;
  color: var(--blue);
  border-color: color-mix(in srgb, var(--blue) 38%, transparent);
}
.btn-secondary:hover { background: var(--blue-tint); border-color: var(--blue); }

.btn-ghost-light {
  background: rgba(255, 255, 255, .1);
  color: #fff;
  border-color: rgba(255, 255, 255, .45);
  backdrop-filter: blur(4px);
}
.btn-ghost-light:hover { background: rgba(255, 255, 255, .2); border-color: #fff; }

.btn-white { background: #fff; color: var(--blue); box-shadow: var(--shadow-md); }
.btn-white:hover { background: #f2f8fd; }

.btn-lg { padding: 16px 32px; font-size: 1.02rem; }

.btn-row {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 2rem;
}

/* ---------------------------------------------------------------- nav ----- */

.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--header-bg);
  backdrop-filter: saturate(180%) blur(12px);
  border-bottom: 1px solid var(--line-soft);
  transition: box-shadow .25s var(--ease), border-color .25s var(--ease);
}
.site-header.is-stuck {
  box-shadow: var(--shadow-sm);
  border-color: var(--line);
}

.nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: 76px;
}

.nav-logo { display: flex; align-items: center; flex: 0 0 auto; }
.nav-logo:hover { text-decoration: none; }
.nav-logo img { height: 42px; width: auto; }

/* The wordmark is near-black, so swap to the white-out version in dark mode
   (Brand Guidelines 0.4: "White Out ... on coloured backgrounds"). */
.logo-dark { display: none; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .logo-light { display: none; }
  :root:not([data-theme="light"]) .logo-dark { display: block; }
}
:root[data-theme="dark"] .logo-light { display: none; }
:root[data-theme="dark"] .logo-dark { display: block; }
:root[data-theme="light"] .logo-light { display: block; }
:root[data-theme="light"] .logo-dark { display: none; }

/* --------------------------------------------------------- nav actions --- */

.nav-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 0 0 auto;
}

.theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  background: none;
  border: 1px solid var(--line);
  border-radius: var(--r);
  color: var(--ink-2);
  cursor: pointer;
  transition: color .18s var(--ease), border-color .18s var(--ease),
              background-color .18s var(--ease);
}
.theme-toggle:hover {
  color: var(--blue);
  border-color: var(--blue);
  background: var(--blue-tint-2);
}
.theme-toggle svg { width: 19px; height: 19px; stroke: currentColor; fill: none; stroke-width: 1.7; }

/* Show the icon for the theme you would switch TO */
.theme-toggle .icon-sun { display: none; }
.theme-toggle .icon-moon { display: block; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .theme-toggle .icon-sun { display: block; }
  :root:not([data-theme="light"]) .theme-toggle .icon-moon { display: none; }
}
:root[data-theme="dark"] .theme-toggle .icon-sun { display: block; }
:root[data-theme="dark"] .theme-toggle .icon-moon { display: none; }
:root[data-theme="light"] .theme-toggle .icon-sun { display: none; }
:root[data-theme="light"] .theme-toggle .icon-moon { display: block; }

.nav-links {
  display: flex;
  align-items: center;
  gap: 4px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.nav-links a {
  display: block;
  padding: 9px 14px;
  border-radius: var(--r);
  color: var(--ink-2);
  font-size: .95rem;
  font-weight: 500;
  transition: color .18s var(--ease), background-color .18s var(--ease);
}
.nav-links a:hover { color: var(--blue); background: var(--blue-tint-2); text-decoration: none; }
.nav-links a[aria-current="page"] { color: var(--blue); font-weight: 600; }

.nav-cta { flex: 0 0 auto; }
.nav-cta .btn { padding: 11px 20px; font-size: .92rem; }

/* The in-menu CTA is for the collapsed mobile menu only — the header already
   shows .nav-cta at desktop widths. */
.nav-cta-mobile { display: none; }

.nav-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 44px;
  height: 44px;
  padding: 0;
  background: none;
  border: 1px solid var(--line);
  border-radius: var(--r);
  cursor: pointer;
}
.nav-toggle span {
  display: block;
  width: 20px;
  height: 2px;
  margin-inline: auto;
  background: var(--ink);
  border-radius: 2px;
  transition: transform .25s var(--ease), opacity .2s var(--ease);
}
.nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 960px) {
  .nav-toggle { display: flex; }
  .nav-cta { display: none; }

  .nav-links {
    position: absolute;
    inset: 100% 0 auto 0;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 10px var(--gutter) 22px;
    background: var(--card-bg);
    border-bottom: 1px solid var(--line);
    box-shadow: var(--shadow-md);
    /* Collapsed by default; JS toggles .is-open */
    display: none;
  }
  .nav-links.is-open { display: flex; }
  .nav-links a { padding: 13px 4px; border-bottom: 1px solid var(--line-soft); border-radius: 0; }
  .nav-links li:last-child a { border-bottom: none; }
  .nav-links .nav-cta-mobile { display: block; margin-top: 14px; }
  /* Must out-specify `.nav-links a`, which would otherwise repaint the
     button's label in body-text colour. */
  .nav-links .nav-cta-mobile a.btn {
    width: 100%;
    padding: 14px 26px;
    border-bottom: none;
    border-radius: var(--r);
    color: #fff;
  }
  .nav-links .nav-cta-mobile a.btn:hover { background: var(--blue-dark); }
}

/* -------------------------------------------------------------- layout --- */

.section { padding: clamp(64px, 8vw, 104px) 0; }
.section-tight { padding: clamp(48px, 6vw, 76px) 0; }
.section-alt { background: var(--bg-alt); }
.section-line { border-top: 1px solid var(--line-soft); }
.section-after-hero { padding-top: clamp(20px, 3vw, 36px); }

.intro-equidata {
  text-align: center;
  margin: 0 0 36px;
  font-size: clamp(1.45rem, 1.15rem + 1.2vw, 2rem);
  font-weight: 500;
  letter-spacing: -.02em;
}

.section-head { max-width: 720px; margin-bottom: 52px; }
.section-head.centered { margin-inline: auto; text-align: center; }
.section-head p {
  font-size: 1.1rem;
  color: var(--ink-3);
  margin-bottom: 0;
}

.eyebrow {
  display: block;
  margin-bottom: 14px;
  color: var(--blue);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.lede {
  font-size: clamp(1.06rem, 1rem + .4vw, 1.22rem);
  line-height: 1.62;
  color: var(--ink-2);
}

/* ---------------------------------------------------------------- hero --- */

.hero {
  position: relative;
  overflow: hidden;
  padding: clamp(72px, 10vw, 132px) 0 clamp(40px, 5vw, 64px);
  background:
    radial-gradient(1100px 520px at 88% -8%, var(--hero-glow) 0%, transparent 62%),
    linear-gradient(180deg, var(--hero-top) 0%, var(--bg) 100%);
}

/* Oversized brand mark, cropped off the right edge */
.hero::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -110px;
  width: 480px;
  height: 594px;
  transform: translateY(-50%);
  background: url("../img/equidata-icon.png") no-repeat center / contain;
  opacity: .05;
  pointer-events: none;
}

.hero-inner { position: relative; z-index: 1; max-width: 760px; }

.hero h1 { margin-bottom: .38em; }
.hero h1 .accent { color: var(--blue); display: block; }

.hero-sub {
  font-size: clamp(1.1rem, 1rem + .55vw, 1.32rem);
  line-height: 1.55;
  color: var(--ink);
  font-weight: 500;
  margin-bottom: 1.4em;
  max-width: 30ch;
}

.hero-body { max-width: 62ch; color: var(--ink-2); }

@media (max-width: 860px) {
  .hero::after { display: none; }
}

/* Compact hero for interior pages */
.page-hero {
  position: relative;
  overflow: hidden;
  padding: clamp(60px, 7vw, 92px) 0 clamp(48px, 6vw, 72px);
  background:
    radial-gradient(900px 440px at 92% -20%, var(--hero-glow) 0%, transparent 60%),
    linear-gradient(180deg, var(--hero-top) 0%, var(--bg) 100%);
  border-bottom: 1px solid var(--line-soft);
}
.page-hero-inner { position: relative; z-index: 1; max-width: 760px; }
.page-hero h1 { margin-bottom: .35em; }
.page-hero h1 .accent { color: var(--blue); display: block; }

/* --------------------------------------------------------------- video --- */

.video-embed {
  position: relative;
  max-width: 940px;
  margin-inline: auto;
  aspect-ratio: 16 / 9;
  background: var(--bg-alt);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  overflow: hidden;
  box-shadow: var(--shadow-md);
}
.video-embed iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

.video-play {
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
}
.video-play img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s var(--ease), filter .3s var(--ease);
}
.video-play:hover img { transform: scale(1.02); filter: brightness(.92); }

.video-play-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 76px;
  height: 76px;
  background: var(--blue);
  border-radius: 50%;
  box-shadow: 0 6px 26px rgba(0, 0, 0, .3);
  transition: transform .25s var(--ease), background-color .2s var(--ease);
}
.video-play:hover .video-play-btn {
  transform: translate(-50%, -50%) scale(1.08);
  background: var(--blue-dark);
}
.video-play-btn svg { width: 30px; height: 30px; fill: #fff; margin-left: 3px; }

@media (max-width: 560px) {
  .video-play-btn { width: 60px; height: 60px; }
  .video-play-btn svg { width: 24px; height: 24px; }
}

/* --------------------------------------------------------------- cards --- */

.grid {
  display: grid;
  gap: 22px;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}
.grid-2 { grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); }
.grid-4 { grid-template-columns: repeat(auto-fit, minmax(238px, 1fr)); }

.card {
  display: flex;
  flex-direction: column;
  padding: 30px 28px;
  background: var(--card-bg);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  transition: border-color .22s var(--ease), box-shadow .22s var(--ease),
              transform .22s var(--ease);
}
.card:hover {
  border-color: color-mix(in srgb, var(--blue) 38%, transparent);
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}
.card h3 { margin-bottom: .5em; }
.card p { color: var(--ink-3); font-size: .96rem; margin-bottom: 0; }
.card p + p { margin-top: .8em; }

a.card { text-decoration: none; color: inherit; }
a.card:hover { text-decoration: none; }

.explore-cards {
  grid-template-columns: 1fr;
  align-items: stretch;
}
.explore-cards .card {
  height: 100%;
  min-height: 148px;
}
@media (min-width: 720px) {
  .explore-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.card-note {
  margin-top: 1em !important;
  padding-top: .9em;
  border-top: 1px solid var(--line-soft);
  font-size: .88rem !important;
  color: var(--ink-3) !important;
}

/* Numbered / iconed card badge */
.card-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin-bottom: 20px;
  border-radius: var(--r);
  background: var(--blue-tint);
  color: var(--blue);
  font-size: 1.05rem;
  font-weight: 700;
}
.card-mark svg { width: 22px; height: 22px; stroke: currentColor; fill: none; stroke-width: 1.8; }

/* -------------------------------------------------------- service block -- */

.service-block {
  padding: 34px 32px;
  background: var(--card-bg);
  border: 1px solid var(--line);
  border-left: 3px solid var(--blue);
  border-radius: var(--r-lg);
  transition: box-shadow .22s var(--ease);
}
.service-block:hover { box-shadow: var(--shadow-md); }
.service-block > p { color: var(--ink-3); }

.tag-list {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin: 22px 0 0;
  padding: 0;
  list-style: none;
}
.tag-list li {
  padding: 7px 15px;
  background: var(--blue-tint-2);
  border: 1px solid color-mix(in srgb, var(--blue) 20%, transparent);
  border-radius: 100px;
  color: var(--ink-2);
  font-size: .89rem;
  font-weight: 500;
}

/* --------------------------------------------------------------- steps --- */

.steps {
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: step;
}
.step {
  position: relative;
  padding: 26px 22px;
  background: var(--card-bg);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  counter-increment: step;
}
.step::before {
  content: counter(step, decimal-leading-zero);
  display: block;
  margin-bottom: 12px;
  color: var(--blue);
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .1em;
}
.step h3 { font-size: 1.06rem; margin-bottom: .4em; }
.step p { margin: 0; color: var(--ink-3); font-size: .92rem; }

/* ---------------------------------------------------------- industries --- */

.pill-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.pill-grid li {
  padding: 13px 24px;
  background: var(--card-bg);
  border: 1px solid var(--line);
  border-radius: 100px;
  color: var(--ink);
  font-weight: 500;
  font-size: .97rem;
  transition: border-color .2s var(--ease), color .2s var(--ease),
              background-color .2s var(--ease);
}
.pill-grid li:hover { border-color: var(--blue); color: var(--blue); background: var(--blue-tint-2); }

/* Client wordmarks sit on a light tile in both themes so brand colours stay true. */
.logo-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
  gap: 14px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.logo-grid li {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 92px;
  padding: 16px 18px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
}
.logo-grid img {
  max-width: 100%;
  max-height: 48px;
  width: auto;
  height: auto;
  object-fit: contain;
}
.logo-grid li.is-on-dark {
  background: #1d1f22;
  border-color: #1d1f22;
}

/* --------------------------------------------------------- beliefs list -- */

.belief-list { margin: 0; padding: 0; list-style: none; display: grid; gap: 2px; }
.belief-list li {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 20px 4px;
  border-bottom: 1px solid var(--line-soft);
  font-size: 1.12rem;
  font-weight: 500;
  color: var(--ink);
}
.belief-list li:last-child { border-bottom: none; }
.belief-list li::before {
  content: "";
  flex: 0 0 auto;
  width: 9px;
  height: 9px;
  margin-top: .58em;
  background: var(--blue);
  border-radius: 2px;
  transform: rotate(45deg);
}

/* ------------------------------------------------------------- insights -- */

.insight-card {
  display: flex;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
}
.insight-thumb {
  height: 7px;
  background: linear-gradient(90deg, var(--blue) 0%, #4b9bd8 100%);
}
.insight-body { padding: 28px; display: flex; flex-direction: column; flex: 1; }
.insight-cat {
  display: inline-block;
  align-self: flex-start;
  margin-bottom: 14px;
  padding: 4px 11px;
  background: var(--blue-tint);
  border-radius: 4px;
  color: var(--blue);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.insight-card h3 { font-size: 1.14rem; line-height: 1.35; margin-bottom: .55em; }
.insight-card p { flex: 1; }

/* Non-clickable "coming soon" marker for unpublished content */
.soon {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: 18px;
  color: var(--ink-3);
  font-size: .82rem;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.soon::before {
  content: "";
  width: 6px;
  height: 6px;
  background: var(--ink-3);
  border-radius: 50%;
}

/* Cards that are placeholders should not look interactive */
.card.is-static:hover,
.insight-card.is-static:hover {
  transform: none;
  border-color: var(--line);
  box-shadow: none;
}

/* ------------------------------------------------------------ downloads -- */

.download-card {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 24px 24px;
  background: var(--card-bg);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
}
.download-icon {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  background: var(--blue-tint);
  border-radius: var(--r);
  color: var(--blue);
}
.download-icon svg { width: 20px; height: 20px; stroke: currentColor; fill: none; stroke-width: 1.7; }
.download-card h3 { font-size: 1.02rem; margin-bottom: .3em; }
.download-card .soon { margin-top: 10px; }

/* ----------------------------------------------------------------- CTA --- */

.cta-band {
  position: relative;
  overflow: hidden;
  padding: clamp(60px, 7.5vw, 96px) 0;
  background: linear-gradient(135deg, var(--blue) 0%, var(--blue-darker) 100%);
  color: #fff;
  text-align: center;
}
.cta-band::after {
  content: "";
  position: absolute;
  top: 50%;
  left: -90px;
  width: 380px;
  height: 470px;
  transform: translateY(-50%);
  background: url("../img/equidata-icon-white.png") no-repeat center / contain;
  opacity: .07;
  pointer-events: none;
}
.cta-band .wrap { position: relative; z-index: 1; }
.cta-band h2 { color: #fff; margin-bottom: .4em; }
.cta-band p {
  max-width: 54ch;
  margin-inline: auto;
  color: rgba(255, 255, 255, .9);
  font-size: 1.1rem;
}
.cta-band .btn-row { justify-content: center; }

/* ---------------------------------------------------------------- form --- */

.contact-layout {
  display: grid;
  gap: 56px;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  align-items: start;
}
@media (max-width: 900px) {
  .contact-layout { grid-template-columns: 1fr; gap: 44px; }
}

.form-card {
  padding: 36px;
  background: var(--card-bg);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-sm);
}

.field { margin-bottom: 20px; }
.field label {
  display: block;
  margin-bottom: 7px;
  color: var(--ink);
  font-size: .9rem;
  font-weight: 600;
}
.field .opt { color: var(--ink-3); font-weight: 400; }

.field input,
.field textarea {
  width: 100%;
  padding: 13px 15px;
  font-family: inherit;
  font-size: 1rem;
  color: var(--ink);
  background: var(--card-bg);
  border: 1px solid var(--line);
  border-radius: var(--r);
  transition: border-color .18s var(--ease), box-shadow .18s var(--ease);
}
.field input::placeholder,
.field textarea::placeholder { color: var(--ink-3); }
.field input:focus,
.field textarea:focus {
  outline: none;
  border-color: var(--blue);
  box-shadow: 0 0 0 3px rgba(27, 117, 188, .15);
}
.field textarea { min-height: 148px; resize: vertical; }

/* Honeypot — must stay visually hidden but reachable by bots */
.hp {
  position: absolute !important;
  left: -9999px !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.form-note {
  margin-top: 18px;
  color: var(--ink-3);
  font-size: .86rem;
}

.contact-aside h3 { margin-bottom: .6em; }

.contact-methods { margin: 0; padding: 0; list-style: none; }
.contact-methods li {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 18px 0;
  border-bottom: 1px solid var(--line-soft);
}
.contact-methods li:last-child { border-bottom: none; }
.contact-methods .m-icon {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  background: var(--blue-tint);
  border-radius: var(--r);
  color: var(--blue);
}
.contact-methods .m-icon svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 1.7; }
.contact-methods .m-label {
  display: block;
  color: var(--ink-3);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.contact-methods .m-value { color: var(--ink); font-weight: 500; }
.contact-methods a.m-value:hover { color: var(--blue); }

/* -------------------------------------------------------------- footer --- */

.site-footer {
  padding: 64px 0 0;
  background: var(--footer-bg);
  color: rgba(255, 255, 255, .62);
  font-size: .93rem;
}
.footer-top {
  display: grid;
  gap: 44px;
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) minmax(0, 1fr);
  padding-bottom: 48px;
}
@media (max-width: 820px) {
  .footer-top { grid-template-columns: 1fr; gap: 34px; }
}

.footer-logo img { height: 54px; width: auto; margin-bottom: 20px; }
.footer-blurb { max-width: 42ch; line-height: 1.7; margin: 0; }

.site-footer h4 {
  margin-bottom: 16px;
  color: #fff;
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.footer-nav { margin: 0; padding: 0; list-style: none; }
.footer-nav li { margin-bottom: 10px; }
.footer-nav a { color: rgba(255, 255, 255, .62); }
.footer-nav a:hover { color: #fff; text-decoration: none; }

.footer-bottom {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 22px 0 28px;
  border-top: 1px solid rgba(255, 255, 255, .12);
  font-size: .86rem;
}
.footer-legal { display: flex; flex-wrap: wrap; gap: 20px; margin: 0; padding: 0; list-style: none; }
.footer-legal a { color: rgba(255, 255, 255, .62); }
.footer-legal a:hover { color: #fff; text-decoration: none; }
.footer-copy { margin: 0; }

/* --------------------------------------------------------- legal pages --- */

.prose { max-width: 74ch; }
.prose h2 { font-size: 1.5rem; margin-top: 2.2em; }
.prose h2:first-child { margin-top: 0; }
.prose h3 { margin-top: 1.8em; }
.prose ul { padding-left: 1.3em; margin: 0 0 1.2em; }
.prose li { margin-bottom: .5em; }
.prose .updated { color: var(--ink-3); font-size: .92rem; }

/* --------------------------------------------------------- scroll reveal - */

.reveal {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .6s var(--ease), transform .6s var(--ease);
}
.reveal.is-visible { opacity: 1; transform: none; }

/* Never leave content hidden if JS fails or motion is reduced */
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; }
}
.no-js .reveal { opacity: 1; transform: none; }