:root,
body {
  --font-header: "Exo 2", "Open Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-subhead: "Bitter", serif;
  --font-body: "open-sans", "Open Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-condensed: "open-sans-condensed", "Open Sans", "Arial Narrow", system-ui, sans-serif;
  --font-semicondensed: "open-sans-semicondensed", "Open Sans", system-ui, sans-serif;
  --control-teal: #2f859b;
  --control-teal-dark: #236878;
  --control-teal-light: #70b3c2;
  --response-orange: #ff6327;
  --orange: var(--control-teal);
  --teal: #43a5b8;
  --teal-dark: var(--control-teal-dark);
  --amber: var(--control-teal-light);
}

body {
  background:
    linear-gradient(180deg, rgba(47, 133, 155, .12) 0%, rgba(8, 13, 18, 0) 360px),
    linear-gradient(120deg, rgba(67, 165, 184, .08), rgba(95, 158, 215, .04) 48%, rgba(8, 13, 18, 0) 80%),
    var(--surface);
  font-family: var(--font-body);
  font-weight: 400;
}

:root[data-theme="light"] {
  --control-teal: #2f859b;
  --control-teal-dark: #205f70;
  --control-teal-light: #70b3c2;
  --response-orange: #b63f13;
  --orange: var(--control-teal);
  --teal: #287e91;
  --teal-dark: var(--control-teal-dark);
  --amber: #4f9bad;
}

:root[data-theme="light"] body {
  background:
    linear-gradient(180deg, rgba(255, 99, 39, .025) 0%, rgba(255, 255, 255, 0) 300px),
    var(--surface);
}

body.outcome-page .page-hero:after,
body.outcome-page .service-hero-grid:after {
  background: linear-gradient(90deg, var(--control-teal), var(--control-teal-light));
}

body.outcome-page .feature-band,
body.outcome-page .cta {
  background:
    linear-gradient(135deg, rgba(47, 133, 155, .24), rgba(67, 165, 184, .1) 48%, rgba(95, 158, 215, .08)),
    var(--panel);
}

body.outcome-page .btn.primary {
  background: var(--control-teal-dark);
}

.proof-hero {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(320px, 1.08fr);
  gap: clamp(28px, 5vw, 64px);
  align-items: center;
}

.proof-hero:after {
  grid-column: 1;
}

.proof-hero-copy {
  min-width: 0;
}

.proof-hero-visual {
  position: relative;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(47, 133, 155, .34);
  border-radius: 22px;
  background:
    linear-gradient(135deg, rgba(47, 133, 155, .18), rgba(255, 99, 39, .08)),
    var(--panel);
  box-shadow: 0 28px 80px rgba(0, 0, 0, .36), inset 0 0 0 1px rgba(255, 255, 255, .04);
}

.proof-hero-visual:after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(8, 13, 18, .18), transparent 34%),
    radial-gradient(circle at 24% 22%, rgba(47, 133, 155, .28), transparent 34%);
}

.proof-hero-visual img {
  display: block;
  width: 100%;
  min-height: 390px;
  object-fit: cover;
  object-position: center;
}

p,
li,
input,
textarea,
select {
  font-family: var(--font-body);
}

h1,
h2,
h3,
.hero h1,
.page-hero h1,
.feature-copy h2,
.cta h2,
.card h3,
.faq-group-heading h3,
.ato-path-result h3,
.brand,
.nav-pillar-button,
.nav-cta,
.btn,
.top-alert strong {
  font-family: var(--font-header);
  font-weight: 700;
}

h2 em,
h3 em,
.hero-subtitle em,
.page-hero p em {
  font-family: var(--font-subhead);
  font-style: italic;
}

.hero-subtitle,
.page-hero p,
.lead-stack p,
.feature-copy p,
.card p,
.faq-list p,
.ato-path-intro p,
.ato-path-result p {
  font-family: var(--font-body);
  font-weight: 400;
}

.eyebrow,
.card-kicker,
.mega-label,
.compact-menu-label,
.blog-meta,
.blog-meta span {
  font-family: "IPBitter", var(--font-body) !important;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .14em;
}

.nav-links,
.mega-columns a span,
.compact-menu a span,
.signal-strip span,
.footer-links,
.top-alert span {
  font-family: var(--font-semicondensed);
  font-stretch: semi-condensed;
}

.mega-feature strong,
.mega-columns a strong,
.compact-menu a strong,
.signal-strip strong,
.agent-board strong,
.metric-panel strong,
.mini-list strong,
.timeline strong {
  font-family: var(--font-header);
  font-weight: 700;
}

.brand-logo {
  content: url("logos/Logo_Teal.png");
}

.top-alert {
  color: #fff;
  background: linear-gradient(90deg, var(--control-teal-dark), var(--control-teal));
  box-shadow: inset 0 -2px 0 rgba(255, 99, 39, .72);
}

.nav-pillar-menu {
  background:
    linear-gradient(135deg, rgba(47, 133, 155, .18), rgba(67, 165, 184, .08) 52%, rgba(17, 27, 35, .98)),
    rgba(17, 27, 35, .98);
}

:root[data-theme="light"] body .nav-pillar-menu {
  background:
    linear-gradient(135deg, rgba(47, 133, 155, .14), rgba(67, 165, 184, .08) 52%, rgba(255, 255, 255, .98)),
    rgba(255, 255, 255, .98);
}

.mega-columns a,
.compact-menu a {
  border-color: rgba(47, 133, 155, .34);
  background: linear-gradient(145deg, rgba(47, 133, 155, .13), transparent 62%);
}

.nav-pillar-menu a:hover {
  border-color: rgba(47, 133, 155, .7);
  background: linear-gradient(145deg, rgba(47, 133, 155, .22), rgba(47, 133, 155, .06));
  box-shadow: inset 0 0 0 1px rgba(47, 133, 155, .12);
}

.nav-pillar:hover .nav-pillar-button,
.nav-pillar:focus-within .nav-pillar-button,
.nav-links > a:hover,
.nav-links [aria-current="page"],
.nav-pillar-menu .mega-label,
.nav-pillar-menu .mega-columns a strong,
.nav-pillar-menu .compact-menu a strong {
  color: var(--response-orange);
}

.btn.primary,
.nav-cta,
.mega-cta {
  color: #fff !important;
  background: var(--control-teal-dark);
  transition: background .2s ease, border-color .2s ease, color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.btn.primary:hover,
.btn.primary:focus-visible,
.btn.secondary:hover,
.btn.secondary:focus-visible,
.nav-cta:hover,
.nav-cta:focus-visible,
.mega-cta:hover,
.mega-cta:focus-visible {
  color: #fff !important;
  border-color: rgba(255, 99, 39, .62);
  background:
    linear-gradient(135deg, rgba(255, 99, 39, .7), rgba(47, 133, 155, .92) 56%, var(--control-teal-dark)),
    var(--control-teal-dark);
  box-shadow: 0 14px 34px rgba(47, 133, 155, .22), 0 0 0 1px rgba(255, 99, 39, .12);
  transform: translateY(-1px);
}

.text-link,
.card a,
.footer-links a,
.blog-body a,
.podcast-card a,
.insights-tabs a {
  transition: color .2s ease, text-decoration-color .2s ease, background .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.text-link:hover,
.text-link:focus-visible,
.card a:hover,
.card a:focus-visible,
.footer-links a:hover,
.footer-links a:focus-visible,
.blog-body a:hover,
.blog-body a:focus-visible,
.podcast-card a:hover,
.podcast-card a:focus-visible {
  color: var(--response-orange);
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}

.signal-strip a,
.nav-pillar-menu a {
  cursor: pointer;
}

.signal-strip a:hover,
.signal-strip a:focus-visible {
  color: var(--ink);
  border-color: rgba(255, 99, 39, .5);
  background:
    linear-gradient(135deg, rgba(255, 99, 39, .18), rgba(47, 133, 155, .16) 48%, rgba(17, 27, 35, .96)),
    rgba(47, 133, 155, .1);
  box-shadow: inset 0 -3px 0 rgba(255, 99, 39, .55);
  outline: 0;
}

.signal-strip a:hover span,
.signal-strip a:focus-visible span,
.signal-strip a:hover strong,
.signal-strip a:focus-visible strong {
  color: var(--ink);
}

.card {
  transition: border-color .2s ease, background .2s ease, box-shadow .2s ease, transform .2s ease;
}

.card:hover {
  border-color: var(--line);
  background: linear-gradient(180deg, rgba(22, 35, 45, .96), rgba(17, 27, 35, .96));
  box-shadow: 0 1px 0 rgba(255, 255, 255, .03);
  transform: none;
}

:root[data-theme="light"] body .card:hover {
  background: linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(244, 249, 249, .96));
  box-shadow: 0 1px 0 rgba(20, 38, 51, .05);
}

.card:has(a[href]):hover,
.card:has(a[href]):focus-within {
  border-color: rgba(255, 99, 39, .48);
  background:
    linear-gradient(145deg, rgba(255, 99, 39, .09), rgba(47, 133, 155, .13) 54%, transparent),
    linear-gradient(180deg, rgba(28, 44, 55, .98), rgba(17, 27, 35, .98));
  box-shadow: 0 18px 46px rgba(47, 133, 155, .12), inset 0 -3px 0 rgba(255, 99, 39, .38);
  transform: translateY(-2px);
}

:root[data-theme="light"] body .card:has(a[href]):hover,
:root[data-theme="light"] body .card:has(a[href]):focus-within {
  background:
    linear-gradient(145deg, rgba(255, 99, 39, .08), rgba(47, 133, 155, .1) 54%, transparent),
    linear-gradient(180deg, rgba(255, 255, 255, 1), rgba(235, 245, 245, .98));
}

.card:has(a[href]):hover a,
.card:has(a[href]):focus-within a {
  color: var(--response-orange);
}

.feature-band {
  background:
    linear-gradient(135deg, rgba(47, 133, 155, .24), rgba(67, 165, 184, .1) 40%, rgba(95, 158, 215, .08)),
    #0b1117;
}

:root[data-theme="light"] body .feature-band {
  background:
    linear-gradient(135deg, rgba(47, 133, 155, .18), rgba(67, 165, 184, .1) 40%, rgba(35, 106, 159, .06)),
    #fff;
}

.cta {
  background:
    linear-gradient(135deg, rgba(47, 133, 155, .2), rgba(67, 165, 184, .08)),
    var(--panel);
}

.card-kicker,
.cta .eyebrow,
.faq-list summary:after {
  color: var(--response-orange);
}

.footer-social {
  border-color: rgba(47, 133, 155, .55);
  background: linear-gradient(145deg, rgba(47, 133, 155, .16), transparent);
}

.footer-social:hover,
.footer-social:focus-visible {
  border-color: var(--control-teal-light);
  background: rgba(47, 133, 155, .23);
  box-shadow: 0 10px 28px rgba(47, 133, 155, .2);
}

.team-card {
  border-color: rgba(47, 133, 155, .42);
  box-shadow: var(--shadow), inset 0 0 0 1px rgba(47, 133, 155, .1);
}

.team-card:hover {
  box-shadow: 0 24px 60px rgba(0, 0, 0, .38), 0 0 0 1px rgba(47, 133, 155, .24);
}

.team-card div {
  background:
    linear-gradient(135deg, rgba(47, 133, 155, .16), transparent 58%),
    var(--panel);
}

.team-card-memorial {
  border-color: rgba(255, 99, 39, .72);
  box-shadow:
    0 24px 64px rgba(0, 0, 0, .4),
    0 0 0 1px rgba(255, 99, 39, .28),
    0 0 34px rgba(255, 99, 39, .12);
}

.team-card-memorial:hover {
  border-color: var(--response-orange);
  box-shadow:
    0 28px 70px rgba(0, 0, 0, .44),
    0 0 0 1px rgba(255, 99, 39, .46),
    0 0 42px rgba(255, 99, 39, .18);
}

.team-card-memorial div {
  border-top-color: var(--response-orange);
  background:
    linear-gradient(135deg, rgba(255, 99, 39, .18), rgba(47, 133, 155, .08) 64%),
    var(--panel);
}

.team-card-memorial p:after {
  background: var(--response-orange);
}

.team-card-memorial h3 span {
  color: var(--response-orange);
}

.team-dialog,
.team-dialog-close,
.team-dialog-linkedin {
  border-color: rgba(47, 133, 155, .62);
}

.ato-path-finder {
  position: relative;
  overflow: hidden;
  margin-top: 0;
  border-block: 1px solid rgba(47, 133, 155, .28);
  background:
    radial-gradient(circle at 14% 18%, rgba(47, 133, 155, .2), transparent 30%),
    radial-gradient(circle at 92% 16%, rgba(255, 99, 39, .12), transparent 28%),
    linear-gradient(135deg, rgba(47, 133, 155, .12), rgba(8, 13, 18, .22) 62%);
}

:root[data-theme="light"] body .ato-path-finder {
  background:
    radial-gradient(circle at 14% 18%, rgba(47, 133, 155, .16), transparent 30%),
    radial-gradient(circle at 92% 16%, rgba(255, 99, 39, .1), transparent 28%),
    linear-gradient(135deg, rgba(47, 133, 155, .08), rgba(255, 255, 255, .72) 62%);
}

.ato-path-intro {
  max-width: 820px;
  margin-bottom: 34px;
}

.ato-path-intro h2 {
  margin: 10px 0 14px;
  font-size: clamp(34px, 4.8vw, 58px);
  letter-spacing: -.055em;
}

.ato-path-intro p {
  margin: 0;
  color: var(--muted);
  font-size: 1.05rem;
  line-height: 1.75;
}

.ato-path-shell {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(340px, .65fr);
  gap: 28px;
  align-items: start;
}

.ato-path-form {
  display: grid;
  gap: 16px;
}

.ato-path-question {
  min-width: 0;
  margin: 0;
  padding: 20px;
  border: 1px solid rgba(47, 133, 155, .32);
  border-radius: 14px;
  background:
    linear-gradient(135deg, rgba(47, 133, 155, .11), transparent 60%),
    rgba(12, 20, 27, .76);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .025);
}

:root[data-theme="light"] body .ato-path-question {
  background:
    linear-gradient(135deg, rgba(47, 133, 155, .1), transparent 60%),
    rgba(255, 255, 255, .8);
}

.ato-path-question legend {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  width: 100%;
  padding: 0;
  color: var(--ink);
  font-weight: 800;
  line-height: 1.35;
}

.ato-path-question legend span {
  flex: 0 0 auto;
  color: var(--response-orange);
  font-size: .8rem;
  letter-spacing: .16em;
}

.ato-path-options {
  display: grid;
  gap: 10px;
  margin-top: 15px;
}

.ato-path-options label {
  display: grid;
  grid-template-columns: 18px 1fr;
  gap: 10px;
  align-items: start;
  padding: 12px;
  border: 1px solid rgba(47, 133, 155, .2);
  border-radius: 10px;
  color: var(--muted);
  cursor: pointer;
  background: rgba(255, 255, 255, .025);
  transition: border-color .2s ease, background .2s ease, color .2s ease, transform .2s ease;
}

.ato-path-options label:hover {
  transform: translateY(-1px);
  border-color: rgba(47, 133, 155, .52);
  color: var(--ink);
  background: rgba(47, 133, 155, .1);
}

.ato-path-options input {
  width: 16px;
  height: 16px;
  margin: 2px 0 0;
  accent-color: var(--response-orange);
}

.ato-path-options label:has(input:checked) {
  border-color: rgba(255, 99, 39, .72);
  color: var(--ink);
  background:
    linear-gradient(135deg, rgba(255, 99, 39, .11), rgba(47, 133, 155, .08)),
    rgba(255, 255, 255, .035);
  box-shadow: inset 0 0 0 1px rgba(255, 99, 39, .1);
}

.ato-path-result {
  position: sticky;
  top: 96px;
  padding: 28px;
  border: 1px solid rgba(255, 99, 39, .48);
  border-radius: 18px;
  background:
    linear-gradient(145deg, rgba(255, 99, 39, .14), rgba(47, 133, 155, .12) 52%, rgba(13, 22, 29, .94)),
    var(--panel);
  box-shadow:
    0 24px 70px rgba(0, 0, 0, .35),
    inset 0 0 0 1px rgba(255, 255, 255, .035);
}

:root[data-theme="light"] body .ato-path-result {
  background:
    linear-gradient(145deg, rgba(255, 99, 39, .11), rgba(47, 133, 155, .1) 52%, rgba(255, 255, 255, .95)),
    var(--panel);
}

.ato-path-result h3 {
  margin: 12px 0;
  font-size: clamp(25px, 2.9vw, 38px);
  letter-spacing: -.04em;
}

.ato-path-result p {
  color: var(--muted);
  line-height: 1.7;
}

.ato-path-result ol {
  display: grid;
  gap: 10px;
  margin: 18px 0 0;
  padding-left: 20px;
  color: var(--ink);
}

.ato-path-result li::marker {
  color: var(--response-orange);
  font-weight: 800;
}

.ato-path-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 24px;
}

.ato-path-actions .btn {
  width: 100%;
  justify-content: center;
}

.faq-groups {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
  align-items: start;
}

.faq-group {
  min-width: 0;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(8, 13, 18, .42);
}

:root[data-theme="light"] body .faq-group {
  background: rgba(255, 255, 255, .66);
}

.faq-group-heading {
  min-height: 0;
  margin-bottom: 18px;
}

.faq-group-heading h3 {
  margin: 8px 0 0;
  font-size: clamp(23px, 2.2vw, 32px);
}

@media (max-width: 900px) {
  .proof-hero {
    grid-template-columns: 1fr;
  }

  .proof-hero:after {
    grid-column: auto;
  }

  .proof-hero-visual {
    order: -1;
  }

  .proof-hero-visual img {
    min-height: 280px;
  }

  .ato-path-shell {
    grid-template-columns: 1fr;
  }

  .ato-path-result {
    position: static;
  }

  .faq-groups {
    grid-template-columns: 1fr;
  }

  .faq-group-heading {
    min-height: 0;
  }
}
