:root {
  --midnight: #1E2430;
  --midnight-deep: #0D1622;
  --graphite: #2F3744;
  --precision: #C47B0F;
  --precision-dark: #9f6109;
  --steel: #6B8094;
  --slate: #8C98A5;
  --stone: #D7D3CE;
  --canvas: #F5F3EE;
  --paper: #FFFDF8;
  --white: #FFFFFF;
  --line: rgba(47, 55, 68, 0.16);
  --dark-line: rgba(255, 255, 255, 0.16);
  --shadow: 0 24px 70px rgba(13, 22, 34, 0.16);
  --shadow-small: 0 12px 34px rgba(13, 22, 34, 0.11);
  --radius: 18px;
  --radius-small: 12px;
  --max: 1180px;
  --font-display: 'Instrument Serif', Georgia, 'Times New Roman', serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--canvas);
  color: var(--graphite);
  font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 16px;
  line-height: 1.65;
  text-rendering: optimizeLegibility;
}
body.nav-open { overflow: hidden; }
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
.container { width: min(var(--max), calc(100% - 48px)); margin: 0 auto; }

.skip-link {
  position: absolute;
  left: 18px;
  top: -60px;
  background: var(--paper);
  color: var(--midnight);
  padding: 10px 14px;
  z-index: 100;
  border-radius: 8px;
}
.skip-link:focus { top: 18px; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(255, 253, 248, 0.92);
  border-bottom: 1px solid rgba(47, 55, 68, 0.10);
  backdrop-filter: blur(16px);
}
.nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  min-height: 86px;
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: var(--midnight);
  min-width: 248px;
}
.brand__mark {
  width: 48px;
  height: 48px;
  object-fit: contain;
  flex: 0 0 auto;
}
.brand__text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  line-height: 1.08;
  letter-spacing: 0.055em;
  text-transform: uppercase;
  font-weight: 600;
  font-size: 14px;
  white-space: nowrap;
}
.brand__the { font-size: 11px; letter-spacing: 0.14em; color: var(--precision); }
.nav-links {
  display: flex;
  align-items: center;
  gap: 26px;
  color: var(--midnight);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}
.nav-links a { transition: color 160ms ease; }
.nav-links a:hover, .nav-links a[aria-current='page'] { color: var(--precision); }
.nav-cta { margin-left: 4px; }
.menu-toggle {
  display: none;
  background: transparent;
  border: 1px solid var(--line);
  color: var(--midnight);
  border-radius: 999px;
  width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
}
.menu-toggle span,
.menu-toggle span::before,
.menu-toggle span::after {
  display: block;
  width: 18px;
  height: 2px;
  background: currentColor;
  content: '';
  position: relative;
}
.menu-toggle span::before { position: absolute; top: -6px; }
.menu-toggle span::after { position: absolute; top: 6px; }

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border: 1px solid transparent;
  border-radius: 8px;
  padding: 14px 22px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  transition: transform 160ms ease, border-color 160ms ease, background 160ms ease, color 160ms ease;
  cursor: pointer;
  min-height: 48px;
}
.btn:hover { transform: translateY(-1px); }
.btn--primary { background: var(--precision); color: var(--white); box-shadow: 0 14px 28px rgba(196, 123, 15, 0.24); }
.btn--primary:hover { background: var(--precision-dark); }
.btn--secondary { border-color: rgba(47,55,68,.45); color: var(--graphite); background: transparent; }
.btn--secondary:hover { border-color: var(--precision); color: var(--midnight); }
.btn--dark { background: var(--midnight-deep); color: var(--white); }
.btn--outline-light { color: var(--white); border-color: rgba(255,255,255,.34); background: rgba(255,255,255,.02); }
.btn--outline-light:hover { border-color: var(--precision); }
.btn--small { padding: 11px 16px; min-height: 42px; font-size: 12px; }

 .hero {
  position: relative;
  overflow: hidden;
  background: radial-gradient(circle at 68% 16%, rgba(196,123,15,.10), transparent 30%), linear-gradient(110deg, var(--paper) 0%, var(--canvas) 100%);
  color: var(--midnight);
  min-height: 620px;
  display: flex;
  align-items: center;
  border-bottom: 1px solid var(--line);
}
.hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: radial-gradient(rgba(196,123,15,.16) 1px, transparent 1px);
  background-size: 22px 22px;
  mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.08) 45%, rgba(0,0,0,.45) 76%, transparent 100%);
}
.hero::after {
  content: '';
  position: absolute;
  right: -140px;
  top: 96px;
  width: 460px;
  height: 460px;
  border: 1px solid rgba(196,123,15,.22);
  border-radius: 50%;
}
.hero__grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 0.92fr 1.08fr;
  align-items: center;
  gap: 64px;
  padding: 74px 0 82px;
}
.eyebrow {
  color: var(--precision);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin: 0 0 18px;
}
.hero h1, .page-hero h1, .section-title, .cta-card h2, .about-copy h2 {
  font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-weight: 700;
  margin: 0;
  color: inherit;
  letter-spacing: normal;
}
.hero h1, .page-hero h1 {
  line-height: 1.12;
}
.section-title, .cta-card h2, .about-copy h2 {
  line-height: 1.16;
}
.hero h1 { font-size: clamp(42px, 5vw, 68px); max-width: 720px; }
.hero h1 .accent { color: var(--precision); }
.hero__lead {
  color: rgba(47,55,68,.84);
  font-size: clamp(17px, 1.45vw, 21px);
  max-width: 650px;
  margin: 28px 0 34px;
}
.hero__actions { display: flex; flex-wrap: wrap; gap: 16px; }
.hero-abstract {
  position: relative;
  min-height: 500px;
  overflow: hidden;
}
.hero-abstract::before {
  content: '';
  position: absolute;
  right: 34px;
  bottom: 38px;
  width: 520px;
  height: 520px;
  border: 1px solid rgba(196,123,15,.22);
  border-radius: 50%;
}
.hero-abstract::after {
  content: '';
  position: absolute;
  inset: auto 0 0 auto;
  width: 86%;
  height: 70%;
  background-image: radial-gradient(rgba(47,55,68,.10) 1px, transparent 1px);
  background-size: 18px 18px;
  opacity: .45;
}
.abstract-panel {
  position: absolute;
  bottom: -80px;
  width: 116px;
  height: 470px;
  transform: skewX(-30deg);
  border-radius: 2px;
}
.abstract-panel--soft {
  right: 390px;
  height: 330px;
  background: rgba(215,211,206,.34);
}
.abstract-panel--outline {
  right: 250px;
  bottom: -50px;
  background: transparent;
  border: 1.5px solid rgba(196,123,15,.58);
  height: 420px;
}
.abstract-panel--gold {
  right: 168px;
  height: 390px;
  background: linear-gradient(180deg, rgba(196,123,15,.70), rgba(196,123,15,.35));
  border: 1px solid rgba(196,123,15,.38);
}
.abstract-panel--dark {
  right: -10px;
  height: 560px;
  width: 160px;
  background: linear-gradient(180deg, var(--midnight), var(--midnight-deep));
  box-shadow: var(--shadow-small);
}
.dashboard-visual { position: relative; min-height: 520px; }
.orbit { position: absolute; right: 0; bottom: 0; width: 520px; height: 520px; border: 1px solid rgba(196,123,15,.38); border-radius: 50%; }
.orbit::before, .orbit::after { content: ''; position: absolute; border: 1px solid rgba(107,128,148,.25); border-radius: 50%; }
.orbit::before { inset: 82px; }
.orbit::after { inset: 168px; }
.bar-stack { position: absolute; right: 70px; bottom: 56px; display: flex; align-items: flex-end; gap: 18px; height: 360px; }
.bar { width: 70px; border: 1px solid rgba(255,255,255,.18); background: linear-gradient(180deg, rgba(255,255,255,.2), rgba(255,255,255,.04)); box-shadow: inset 0 0 40px rgba(255,255,255,.05), 0 22px 55px rgba(0,0,0,.22); }
.bar:nth-child(1){ height: 42%; background-color: rgba(107,128,148,.35); }
.bar:nth-child(2){ height: 56%; background-color: rgba(215,211,206,.34); }
.bar:nth-child(3){ height: 75%; background-color: rgba(196,123,15,.58); }
.bar:nth-child(4){ height: 90%; background-color: rgba(30,36,48,.75); }
.metric-float { position: absolute; right: 2px; top: 150px; width: 204px; background: rgba(13,22,34,.78); border: 1px solid rgba(215,211,206,.20); backdrop-filter: blur(10px); border-radius: 12px; padding: 18px; box-shadow: var(--shadow-small); }
.metric-float .label, .mini-card .label, .data-card .label { color: var(--slate); text-transform: uppercase; letter-spacing: .08em; font-size: 11px; font-weight: 700; }
.metric-float strong { display: block; font-size: 30px; line-height: 1; margin: 13px 0 8px; }
.spark { display: flex; align-items: flex-end; gap: 8px; height: 46px; margin-top: 12px; }
.spark i { display: block; width: 6px; border-radius: 4px 4px 0 0; background: var(--precision); opacity: .9; }
.spark i:nth-child(1){ height: 18%; opacity:.45; }
.spark i:nth-child(2){ height: 34%; opacity:.55; }
.spark i:nth-child(3){ height: 28%; opacity:.65; }
.spark i:nth-child(4){ height: 55%; opacity:.75; }
.spark i:nth-child(5){ height: 42%; opacity:.85; }
.spark i:nth-child(6){ height: 78%; }

.pillars {
  background: linear-gradient(135deg, var(--midnight-deep), var(--midnight));
  color: var(--white);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.pillars__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}
.pillar {
  padding: 46px 30px;
  border-right: 1px solid rgba(255,255,255,.16);
  text-align: center;
}
.pillar:first-child { border-left: 1px solid rgba(255,255,255,.16); }
.icon-line {
  width: 52px;
  height: 52px;
  margin: 0 auto 18px;
  color: var(--precision);
}
.icon-line svg { width: 100%; height: 100%; stroke: currentColor; fill: none; stroke-width: 1.55; }
.pillar h3 { margin: 0 0 10px; color: var(--white); font-size: 15px; text-transform: uppercase; letter-spacing: .08em; }
.pillar p { margin: 0; font-size: 15px; color: rgba(255,255,255,.78); }

.section { padding: 92px 0; }
.section--tight { padding: 66px 0; }
.section--dark { background: var(--midnight); color: var(--white); }
.section-title { font-size: clamp(34px, 4.2vw, 56px); max-width: 820px; }
.section-title + .section-lead { margin-top: 22px; }
.section-lead { font-size: 18px; max-width: 760px; color: rgba(47,55,68,.78); }
.section--dark .section-lead { color: rgba(255,255,255,.72); }
.split {
  display: grid;
  grid-template-columns: 0.86fr 1.14fr;
  gap: 64px;
  align-items: center;
}
.structure-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow: hidden;
}
.structure-card__header {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-bottom: 1px solid var(--line);
}
.data-card { padding: 22px; border-right: 1px solid var(--line); }
.data-card:last-child { border-right: none; }
.data-card strong { display:block; font-size: 28px; color: var(--midnight); margin-top: 7px; line-height: 1; }
.data-card small { color: var(--precision); font-weight: 700; }
.structure-card__body { display: grid; grid-template-columns: 1fr 1fr; }
.chart-panel { padding: 28px; min-height: 260px; border-right: 1px solid var(--line); }
.chart-panel:last-child { border-right: none; }
.chart-panel h3 { margin: 0 0 22px; color: var(--midnight); }
.line-chart { height: 160px; position: relative; border-left: 1px solid var(--stone); border-bottom: 1px solid var(--stone); }
.line-chart::before,
.line-chart::after { content:''; position:absolute; left:0; right:0; border-top:1px solid rgba(47,55,68,.10); }
.line-chart::before { top: 38%; }
.line-chart::after { top: 70%; }
.line-chart svg { width: 100%; height: 100%; overflow: visible; }
.donut-wrap { display:flex; gap:24px; align-items:center; }
.donut { width: 130px; height: 130px; border-radius: 50%; background: conic-gradient(var(--midnight) 0 34%, var(--steel) 34% 58%, var(--precision) 58% 77%, var(--stone) 77% 100%); position: relative; }
.donut::after { content:''; position:absolute; inset:29px; border-radius:50%; background: var(--paper); }
.legend { display:grid; gap:9px; font-size:13px; }
.legend span { display:flex; align-items:center; gap:9px; }
.legend i { width:10px; height:10px; display:inline-block; background:var(--midnight); }
.legend span:nth-child(2) i{ background:var(--steel); }
.legend span:nth-child(3) i{ background:var(--precision); }
.legend span:nth-child(4) i{ background:var(--stone); }

.cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 42px; }
.cards--two { grid-template-columns: repeat(2, 1fr); }
.card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 30px;
  box-shadow: 0 1px 0 rgba(255,255,255,.6);
}
.card h3 { color: var(--midnight); margin: 0 0 12px; font-size: 20px; }
.card p { margin: 0; color: rgba(47,55,68,.78); }
.card ul { margin: 18px 0 0; padding-left: 18px; color: rgba(47,55,68,.82); }
.card li + li { margin-top: 8px; }
.card--dark { background: rgba(255,255,255,.045); border-color: var(--dark-line); color: var(--white); }
.card--dark h3 { color: var(--white); }
.card--dark p, .card--dark li { color: rgba(255,255,255,.74); }
.card__meta { color: var(--precision); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 12px; }
.link-arrow { display:inline-flex; align-items:center; gap:8px; color: var(--precision); font-weight:700; font-size:13px; letter-spacing:.06em; text-transform:uppercase; margin-top:22px; }


.ops-overview { background: var(--canvas); }
.ops-overview--sales { background: var(--paper); border-top: 1px solid var(--line); }
.ops-overview__grid { align-items: start; }
.ops-issue-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}
.ops-issue-card { box-shadow: var(--shadow-soft); }
.ops-issue-card h3 { font-size: 19px; line-height: 1.25; }
.ops-issue-card p { font-size: 15px; line-height: 1.65; }

.about {
  background: linear-gradient(180deg, var(--paper), var(--canvas));
}
.about-grid {
  display: grid;
  grid-template-columns: 0.74fr 1.26fr;
  gap: 56px;
  align-items: start;
}
.about-visual {
  border-radius: var(--radius);
  border: 1px solid var(--line);
  background: var(--midnight);
  min-height: 450px;
  display: grid;
  place-items: center;
  overflow: hidden;
  position: relative;
}
.about-visual::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 70% 20%, rgba(196,123,15,.24), transparent 34%), radial-gradient(circle at 18% 85%, rgba(107,128,148,.24), transparent 34%);
}
.about-visual img.about-photo { width: 100%; height: 100%; object-fit: cover; }
.about-placeholder { position: relative; z-index: 1; width: 180px; opacity: .84; }
.about-copy h2 { color: var(--midnight); font-size: clamp(34px,3.7vw,50px); }
.about-copy p { font-size: 17px; color: rgba(47,55,68,.82); }
.proof-grid { display:grid; grid-template-columns: repeat(2,1fr); gap: 12px; margin-top: 28px; }
.proof-item { border: 1px solid var(--line); border-radius: 12px; padding: 16px; background: rgba(255,255,255,.42); }
.proof-item strong { display:block; color: var(--midnight); font-size:22px; line-height:1; }
.proof-item span { color: rgba(47,55,68,.7); font-size: 13px; }

.cta-band { padding: 76px 0; }
.cta-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-small);
  padding: 44px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 32px;
  align-items: center;
}
.cta-icon { width: 88px; height: 88px; background: var(--midnight-deep); border-radius: 50%; display:grid; place-items:center; }
.cta-icon img { width: 52px; height: 52px; object-fit: contain; }
.cta-card h2 { color: var(--midnight); font-size: clamp(32px,3.4vw,46px); }
.cta-card p { margin: 10px 0 0; color: var(--precision); text-transform: uppercase; letter-spacing: .09em; font-weight:700; font-size: 12px; }

.page-hero {
  background: radial-gradient(circle at 75% 25%, rgba(196,123,15,.18), transparent 28%), linear-gradient(145deg, var(--midnight-deep), var(--midnight));
  color: var(--white);
  padding: 96px 0 82px;
  overflow: hidden;
  position: relative;
}
.page-hero::before { content:''; position:absolute; inset:0; background-image: radial-gradient(rgba(215,211,206,.13) 1px, transparent 1px); background-size: 24px 24px; opacity:.42; mask-image: linear-gradient(90deg, transparent, black 70%, transparent); }
.page-hero .container { position:relative; z-index:1; }
.page-hero__grid { display:grid; grid-template-columns: 1fr .78fr; gap: 64px; align-items:center; }
.page-hero h1 { font-size: clamp(42px, 5.4vw, 68px); max-width: 900px; }
.page-hero p { color: rgba(255,255,255,.78); font-size: 20px; max-width: 760px; }
.mini-dashboard { background: rgba(255,255,255,.06); border:1px solid var(--dark-line); border-radius:var(--radius); padding:22px; box-shadow: var(--shadow-small); backdrop-filter: blur(8px); }
.mini-card { background: rgba(13,22,34,.55); border:1px solid var(--dark-line); border-radius:12px; padding:18px; margin-bottom:12px; }
.mini-card strong { display:block; font-size:28px; line-height:1; color:var(--white); margin-top:8px; }
.process-list { display:grid; gap:16px; margin-top: 34px; }
.process-item { display:grid; grid-template-columns: 44px 1fr; gap:16px; align-items:start; }
.process-num { width:44px; height:44px; border-radius:50%; display:grid; place-items:center; background:rgba(196,123,15,.12); color:var(--precision); border:1px solid rgba(196,123,15,.28); font-weight:700; }
.process-item h3 { margin:0 0 4px; color:var(--midnight); }
.process-item p { margin:0; color:rgba(47,55,68,.72); }

.form-section { background: var(--midnight); color: var(--white); }
.contact-grid { display:grid; grid-template-columns: .8fr 1.2fr; gap:58px; align-items:start; }
.contact-card { background: rgba(255,255,255,.055); border:1px solid var(--dark-line); border-radius:var(--radius); padding:34px; }
.contact-card p { color: rgba(255,255,255,.72); }
.contact-form { display:grid; gap:16px; }
.form-row { display:grid; grid-template-columns: repeat(2, 1fr); gap:16px; }
label { display:grid; gap:7px; color: rgba(255,255,255,.74); font-size: 13px; font-weight:600; letter-spacing:.03em; }
input, textarea {
  width:100%;
  border:1px solid rgba(255,255,255,.18);
  background: rgba(13,22,34,.58);
  color: var(--white);
  border-radius: 10px;
  padding: 13px 14px;
  outline: none;
}
textarea { min-height: 144px; resize: vertical; }
input:focus, textarea:focus { border-color: var(--precision); }
.form-note { color: rgba(255,255,255,.58); font-size: 13px; margin: 0; }

.site-footer { background: var(--midnight-deep); color: rgba(255,255,255,.66); padding: 36px 0; border-top: 1px solid rgba(255,255,255,.08); }
.footer-grid { display:flex; justify-content:space-between; gap:24px; align-items:center; flex-wrap:wrap; }
.footer-links { display:flex; gap:20px; font-size:13px; }

@media (max-width: 980px) {
  .menu-toggle { display:flex; }
  .nav-links { position: fixed; inset: 86px 0 auto 0; background: rgba(255,253,248,.98); display: none; flex-direction: column; align-items: flex-start; padding: 26px 24px 32px; gap: 22px; border-bottom: 1px solid rgba(47,55,68,.1); }
  body.nav-open .nav-links { display:flex; }
  .nav-cta { margin-left:0; }
  .hero__grid, .page-hero__grid, .split, .about-grid, .contact-grid { grid-template-columns: 1fr; }
  .dashboard-visual, .hero-abstract { min-height: 420px; }
  .pillars__grid { grid-template-columns: repeat(2, 1fr); }
  .cards, .cards--two, .ops-issue-grid { grid-template-columns: 1fr; }
  .cta-card { grid-template-columns: 1fr; }
  .structure-card__header, .structure-card__body { grid-template-columns: 1fr; }
  .data-card, .chart-panel { border-right: none; border-bottom: 1px solid var(--line); }
  .data-card:last-child, .chart-panel:last-child { border-bottom: none; }
}
@media (max-width: 640px) {
  .container { width: min(100% - 32px, var(--max)); }
  .brand { min-width: auto; }
  .brand__mark { width: 40px; height: 40px; }
  .brand__text { font-size: 12.5px; line-height: 1.1; letter-spacing: 0.045em; }
  .brand__the { font-size: 10.5px; }
  .hero { min-height: auto; }
  .hero__grid { padding: 54px 0 62px; }
  .hero__proof { grid-template-columns: 1fr; }
  .dashboard-visual, .hero-abstract { display: none; }
  .pillars__grid { grid-template-columns: 1fr; }
  .pillar { border-left: 1px solid rgba(255,255,255,.16); }
  .section { padding: 68px 0; }
  .form-row, .proof-grid { grid-template-columns: 1fr; }
  .cta-card { padding: 28px; }
  .page-hero { padding: 68px 0; }
}

/* Dark homepage top treatment */
.site-header {
  background: rgba(13, 22, 34, 0.94);
  border-bottom: 1px solid rgba(255, 255, 255, 0.10);
  box-shadow: 0 10px 34px rgba(13, 22, 34, 0.18);
}
.brand,
.nav-links {
  color: var(--white);
}
.brand__mark {
  filter: brightness(0) invert(1);
}
.menu-toggle {
  border-color: rgba(255, 255, 255, 0.24);
  color: var(--white);
}

.hero.hero--light {
  background:
    radial-gradient(circle at 74% 18%, rgba(196, 123, 15, 0.20), transparent 30%),
    radial-gradient(circle at 18% 82%, rgba(107, 128, 148, 0.18), transparent 32%),
    linear-gradient(135deg, var(--midnight-deep) 0%, var(--midnight) 56%, #252d3b 100%);
  color: var(--white);
  border-bottom: 1px solid rgba(255, 255, 255, 0.10);
}
.hero.hero--light::before {
  background-image: radial-gradient(rgba(215, 211, 206, 0.14) 1px, transparent 1px);
  opacity: 0.72;
  mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.18) 35%, rgba(0,0,0,.70) 76%, transparent 100%);
}
.hero.hero--light::after {
  border-color: rgba(196, 123, 15, 0.32);
}
.hero.hero--light .hero__lead {
  color: rgba(255, 255, 255, 0.78);
}
.hero.hero--light .btn--secondary {
  color: var(--white);
  border-color: rgba(255, 255, 255, 0.38);
  background: rgba(255, 255, 255, 0.02);
}
.hero.hero--light .btn--secondary:hover {
  color: var(--white);
  border-color: var(--precision);
}
.hero.hero--light .hero-abstract::before {
  border-color: rgba(196, 123, 15, 0.34);
}
.hero.hero--light .hero-abstract::after {
  background-image: radial-gradient(rgba(215, 211, 206, 0.16) 1px, transparent 1px);
  opacity: 0.48;
}
.hero.hero--light .abstract-panel--soft {
  background: rgba(215, 211, 206, 0.18);
}
.hero.hero--light .abstract-panel--outline {
  border-color: rgba(196, 123, 15, 0.66);
}
.hero.hero--light .abstract-panel--dark {
  background: linear-gradient(180deg, rgba(255,255,255,0.12), rgba(255,255,255,0.03));
  border: 1px solid rgba(255,255,255,0.12);
}

@media (max-width: 980px) {
  .nav-links {
    background: rgba(13, 22, 34, 0.98);
    border-bottom: 1px solid rgba(255, 255, 255, 0.10);
  }
}

/* Homepage Marketing Operations feature section */
.homepage-ops-section {
  position: relative;
  overflow: hidden;
  padding: 112px 0;
  background:
    radial-gradient(circle at 82% 72%, rgba(196, 123, 15, 0.16), transparent 28%),
    radial-gradient(circle at 20% 20%, rgba(107, 128, 148, 0.16), transparent 36%),
    linear-gradient(135deg, #071322 0%, #0a1828 48%, #06111e 100%);
  color: var(--white);
}

.homepage-ops-section::before {
  content: "";
  position: absolute;
  right: -220px;
  bottom: -260px;
  width: 720px;
  height: 720px;
  border-radius: 50%;
  background:
    repeating-radial-gradient(
      circle,
      rgba(196, 123, 15, 0.16) 0,
      rgba(196, 123, 15, 0.16) 1px,
      transparent 1px,
      transparent 18px
    );
  opacity: 0.45;
  pointer-events: none;
}

.ops-feature-inner {
  position: relative;
  z-index: 1;
  width: min(var(--max), calc(100% - 48px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(520px, 1fr);
  gap: 86px;
  align-items: center;
}

.ops-feature-copy {
  max-width: 600px;
}

.ops-feature-copy .section-eyebrow {
  margin: 0 0 30px;
  color: #f3b84f;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.ops-feature-copy .section-eyebrow::after {
  content: "";
  display: block;
  width: 44px;
  height: 2px;
  margin-top: 18px;
  background: #f3b84f;
}

.ops-feature-copy h2 {
  margin: 0;
  color: var(--white);
  font-family: 'Instrument Serif', Georgia, 'Times New Roman', serif;
  font-size: clamp(3.1rem, 5.5vw, 5.7rem);
  line-height: 0.95;
  letter-spacing: -0.02em;
  font-weight: 400;
}

.ops-feature-copy h2 span {
  display: block;
  color: #f3b84f;
}

.ops-feature-intro {
  max-width: 540px;
  margin: 32px 0 0;
  color: rgba(255, 255, 255, 0.72);
  font-size: 1.16rem;
  line-height: 1.6;
}

.ops-feature-button {
  margin-top: 36px;
  display: inline-flex;
  align-items: center;
  gap: 18px;
  background: linear-gradient(135deg, #f7c766 0%, #e4a93d 100%);
  color: #071322;
  border: 1px solid rgba(255, 217, 139, 0.72);
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.22);
}

.ops-feature-button:hover {
  background: linear-gradient(135deg, #ffd779 0%, #edae43 100%);
  color: #071322;
}

.ops-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
}

.ops-card {
  min-height: 230px;
  padding: 34px 32px;
  border: 1px solid rgba(190, 205, 224, 0.22);
  border-radius: 14px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.025)),
    rgba(14, 29, 47, 0.78);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 24px 54px rgba(0, 0, 0, 0.22);
}

.ops-card-icon {
  width: 70px;
  height: 70px;
  margin-bottom: 28px;
  display: grid;
  place-items: center;
  border: 2px solid rgba(243, 184, 79, 0.82);
  border-radius: 50%;
  color: #f3b84f;
  background: rgba(255, 255, 255, 0.03);
}

.ops-card-icon svg {
  width: 36px;
  height: 36px;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ops-card h3 {
  margin: 0;
  color: var(--white);
  font-size: 1.35rem;
  line-height: 1.25;
  letter-spacing: -0.02em;
}

.ops-card p {
  margin: 12px 0 0;
  color: rgba(255, 255, 255, 0.64);
  font-size: 1rem;
  line-height: 1.55;
}

@media (max-width: 980px) {
  .homepage-ops-section {
    padding: 84px 0;
  }

  .ops-feature-inner {
    grid-template-columns: 1fr;
    gap: 52px;
  }

  .ops-card-grid {
    max-width: 720px;
  }
}

@media (max-width: 640px) {
  .homepage-ops-section {
    padding: 72px 0;
  }

  .ops-feature-inner {
    width: min(100% - 32px, var(--max));
  }

  .ops-card-grid {
    grid-template-columns: 1fr;
  }

  .ops-card {
    min-height: auto;
  }
}

/* Homepage headline line controls */
.marketing-ops-feature .marketing-headline,
.sales-ops-feature .sales-headline {
  display: flex;
  flex-direction: column;
  gap: 0.04em;
  max-width: 760px;
  line-height: 0.98;
}

.marketing-ops-feature .marketing-headline {
  font-size: clamp(3.2rem, 4.4vw, 5.2rem);
}

.sales-ops-feature .sales-headline {
  font-size: clamp(3rem, 4.35vw, 5.1rem);
}

.marketing-ops-feature .marketing-headline span,
.sales-ops-feature .sales-headline span {
  display: block;
  white-space: nowrap;
  color: var(--white);
}

.marketing-ops-feature .marketing-headline span:last-child,
.sales-ops-feature .sales-headline span:last-child {
  color: #f3b84f;
}

/* Sales Operations homepage vertical pathway */
.sales-ops-feature {
  background:
    radial-gradient(circle at 18% 70%, rgba(207, 151, 54, 0.11), transparent 34%),
    radial-gradient(circle at 85% 20%, rgba(64, 103, 135, 0.18), transparent 34%),
    linear-gradient(135deg, #071322 0%, #0a1828 48%, #06111e 100%);
}

.sales-feature-inner {
  position: relative;
  z-index: 1;
  width: min(var(--max), calc(100% - 48px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 0.88fr) minmax(560px, 1fr);
  gap: 88px;
  align-items: center;
}

.sales-pathway {
  position: relative;
  display: grid;
  gap: 18px;
  padding: 8px 0 8px 54px;
}

.sales-pathway-line {
  position: absolute;
  top: 34px;
  bottom: 34px;
  left: 22px;
  width: 2px;
  background: linear-gradient(
    180deg,
    rgba(243, 184, 79, 0.1),
    rgba(243, 184, 79, 0.95),
    rgba(243, 184, 79, 0.1)
  );
}

.sales-pathway-item {
  position: relative;
  display: grid;
  grid-template-columns: 46px 1fr;
  gap: 20px;
  align-items: center;
}

.sales-step-number {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: linear-gradient(135deg, #f7c766 0%, #e4a93d 100%);
  color: #071322;
  font-size: 0.88rem;
  font-weight: 800;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.24);
}

.sales-step-number::after {
  content: "";
  position: absolute;
  left: 46px;
  width: 28px;
  height: 1px;
  background: rgba(243, 184, 79, 0.72);
}

.sales-pathway-card {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: 22px;
  align-items: center;
  min-height: 118px;
  padding: 22px 28px 22px 22px;
  border: 1px solid rgba(190, 205, 224, 0.22);
  border-radius: 14px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.025)),
    rgba(14, 29, 47, 0.78);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 24px 54px rgba(0, 0, 0, 0.22);
}

.sales-pathway-icon {
  width: 64px;
  height: 64px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  color: #f3b84f;
  background: rgba(3, 12, 22, 0.42);
  border: 1px solid rgba(243, 184, 79, 0.42);
}

.sales-pathway-icon svg {
  width: 34px;
  height: 34px;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.sales-pathway-card h3 {
  margin: 0;
  color: var(--white);
  font-size: 1.24rem;
  line-height: 1.2;
  letter-spacing: -0.02em;
}

.sales-pathway-card p {
  margin: 8px 0 0;
  color: rgba(255, 255, 255, 0.66);
  font-size: 0.98rem;
  line-height: 1.5;
}

@media (max-width: 1100px) {
  .sales-feature-inner {
    grid-template-columns: 1fr;
    gap: 54px;
  }

  .sales-pathway {
    max-width: 760px;
  }
}

@media (max-width: 720px) {
  .sales-feature-inner {
    width: min(100% - 32px, var(--max));
  }

  .marketing-ops-feature .marketing-headline span,
  .sales-ops-feature .sales-headline span {
    white-space: normal;
  }

  .sales-pathway {
    padding-left: 0;
  }

  .sales-pathway-line,
  .sales-step-number::after {
    display: none;
  }

  .sales-pathway-item {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .sales-step-number {
    width: 38px;
    height: 38px;
    font-size: 0.8rem;
  }

  .sales-pathway-card {
    grid-template-columns: 1fr;
    gap: 16px;
    min-height: auto;
  }
}

/* v12: section rhythm, standardized typography, and credibility/about section */
:root {
  --ownership-blue: #eaf1f7;
  --soft-canvas: #f8f6f1;
}

body {
  font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

.hero h1,
.page-hero h1,
.section-title,
.ops-feature-copy h2,
.ownership-title,
.cta-card h2 {
  font-family: 'Instrument Serif', Georgia, 'Times New Roman', serif;
  font-weight: 400;
  letter-spacing: -0.02em;
}

.card h3,
.pillar h3,
.ops-card h3,
.sales-pathway-card h3,
.ownership-card h3,
.nav-links,
.btn,
.eyebrow,
.section-eyebrow,
.card__meta {
  font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* Alternating homepage backgrounds */
.pillars {
  background: linear-gradient(180deg, var(--paper), var(--canvas));
  color: var(--midnight);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.pillar {
  border-right: 1px solid var(--line);
}

.pillar:first-child {
  border-left: 1px solid var(--line);
}

.pillar h3 {
  color: var(--midnight);
}

.pillar p {
  color: rgba(47, 55, 68, 0.74);
}

/* Keep Sales as the primary dark service block */
.sales-ops-feature {
  background:
    radial-gradient(circle at 18% 70%, rgba(196, 123, 15, 0.11), transparent 34%),
    radial-gradient(circle at 85% 20%, rgba(107, 128, 148, 0.18), transparent 34%),
    linear-gradient(135deg, #071322 0%, #0a1828 48%, #06111e 100%);
}

/* Shift Marketing to a lighter companion section so it does not visually merge with Sales */
.marketing-ops-feature {
  background:
    radial-gradient(circle at 86% 74%, rgba(196, 123, 15, 0.10), transparent 30%),
    radial-gradient(circle at 15% 22%, rgba(107, 128, 148, 0.14), transparent 34%),
    linear-gradient(135deg, var(--paper) 0%, var(--soft-canvas) 55%, #eef1f2 100%);
  color: var(--midnight);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.marketing-ops-feature::before {
  opacity: 0.22;
}

.marketing-ops-feature .ops-feature-copy .section-eyebrow {
  color: var(--precision);
}

.marketing-ops-feature .ops-feature-copy .section-eyebrow::after {
  background: var(--precision);
}

.marketing-ops-feature .ops-feature-inner {
  grid-template-columns: minmax(0, 1.1fr) minmax(500px, 0.9fr);
  gap: 64px;
}

.marketing-ops-feature .ops-feature-intro {
  max-width: 620px;
  color: rgba(47, 55, 68, 0.76);
}

.marketing-ops-feature .marketing-headline span {
  color: var(--midnight);
}

.marketing-ops-feature .marketing-headline span:last-child {
  color: var(--precision);
}

.marketing-ops-feature .ops-card {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(255, 253, 248, 0.78)),
    var(--paper);
  border-color: rgba(47, 55, 68, 0.14);
  box-shadow: 0 22px 54px rgba(13, 22, 34, 0.10);
}

.marketing-ops-feature .ops-card-icon {
  color: var(--precision);
  border-color: rgba(196, 123, 15, 0.42);
  background: rgba(196, 123, 15, 0.07);
}

.marketing-ops-feature .ops-card h3 {
  color: var(--midnight);
}

.marketing-ops-feature .ops-card p {
  color: rgba(47, 55, 68, 0.68);
}

@media (max-width: 1100px) {
  .marketing-ops-feature .ops-feature-inner {
    grid-template-columns: 1fr;
    gap: 52px;
  }
}

/* Temporary combined About + differentiation section */
.ownership-section {
  background: linear-gradient(180deg, var(--white), var(--ownership-blue));
  color: var(--midnight);
  padding: 104px 0 0;
  border-bottom: 1px solid var(--line);
}

.ownership-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(540px, 1.08fr);
  gap: 72px;
  align-items: start;
}

.ownership-copy {
  max-width: 620px;
}

.ownership-title {
  margin: 0;
  color: var(--midnight);
  font-size: clamp(3rem, 5vw, 5.5rem);
  line-height: 0.98;
}

.ownership-title span {
  display: block;
  color: var(--precision);
}

.ownership-lead {
  margin: 34px 0 0;
  color: rgba(47, 55, 68, 0.78);
  font-size: 1.16rem;
  line-height: 1.72;
}

.ownership-button {
  margin-top: 32px;
}

.ownership-note {
  margin-top: 30px;
  display: grid;
  grid-template-columns: 52px 1fr;
  gap: 16px;
  align-items: center;
  color: rgba(47, 55, 68, 0.76);
}

.ownership-note p {
  margin: 0;
  line-height: 1.55;
}

.ownership-note-icon,
.ownership-led-icon {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: var(--midnight);
  background: rgba(107, 128, 148, 0.12);
  border: 1px solid rgba(107, 128, 148, 0.22);
}

.ownership-note-icon svg,
.ownership-led-icon svg,
.ownership-card-icon svg {
  width: 28px;
  height: 28px;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ownership-cards {
  display: grid;
  gap: 22px;
}

.ownership-card {
  display: grid;
  grid-template-columns: 84px 1fr;
  gap: 26px;
  align-items: start;
  padding: 32px;
  border: 1px solid rgba(47, 55, 68, 0.12);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.74);
  box-shadow: 0 18px 46px rgba(13, 22, 34, 0.08);
}

.ownership-card-icon {
  width: 74px;
  height: 74px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: var(--midnight);
  background: rgba(107, 128, 148, 0.13);
  border: 1px solid rgba(107, 128, 148, 0.22);
}

.ownership-card h3 {
  margin: 0 0 10px;
  color: var(--midnight);
  font-size: 1.35rem;
  line-height: 1.22;
  letter-spacing: -0.02em;
}

.ownership-card h3::after {
  content: "";
  display: block;
  width: 48px;
  height: 2px;
  margin-top: 14px;
  background: var(--precision);
}

.ownership-card p {
  margin: 0;
  color: rgba(47, 55, 68, 0.74);
  font-size: 1.02rem;
  line-height: 1.62;
}

.ownership-led-by {
  margin-top: 58px;
  padding: 28px 0;
  display: grid;
  grid-template-columns: 52px 1fr;
  gap: 20px;
  align-items: center;
  border-top: 1px solid rgba(47, 55, 68, 0.10);
}

.ownership-led-by p {
  margin: 0;
  color: rgba(47, 55, 68, 0.78);
  font-size: 1.04rem;
  line-height: 1.58;
}

.ownership-led-by strong {
  color: var(--midnight);
}

/* Darken final CTA to close the page rhythm */
.cta-band {
  padding: 0;
  background: var(--ownership-blue);
}

.cta-card {
  width: 100%;
  max-width: none;
  border-radius: 0;
  border-left: none;
  border-right: none;
  background: linear-gradient(135deg, var(--midnight-deep), #07345f);
  color: var(--white);
  box-shadow: none;
}

.cta-card h2 {
  color: var(--white);
}

.cta-card p {
  color: #f3b84f;
}

.cta-icon {
  background: rgba(255, 255, 255, 0.10);
  border: 1px solid rgba(255, 255, 255, 0.16);
}

.cta-card .btn--dark {
  background: var(--paper);
  color: var(--midnight);
}

@media (max-width: 1100px) {
  .ownership-grid {
    grid-template-columns: 1fr;
    gap: 48px;
  }

  .ownership-cards {
    max-width: 820px;
  }
}

@media (max-width: 720px) {
  .ownership-section {
    padding-top: 78px;
  }

  .ownership-card {
    grid-template-columns: 1fr;
    gap: 18px;
    padding: 26px;
  }

  .ownership-led-by,
  .ownership-note {
    grid-template-columns: 1fr;
  }

  .ownership-title span {
    display: inline;
  }
}

/* v13: content refinements, section contrast, and connected contact flow */
.pillars {
  padding: 82px 0 0;
}

.pillars__intro {
  max-width: 780px;
  text-align: center;
  padding-bottom: 36px;
}

.pillars__intro h2 {
  margin: 0;
  color: var(--midnight);
  font-family: 'Instrument Serif', Georgia, 'Times New Roman', serif;
  font-size: clamp(2.7rem, 4.8vw, 5rem);
  line-height: 1;
  letter-spacing: -0.02em;
  font-weight: 400;
}

.pillars__intro .eyebrow {
  margin-bottom: 18px;
}

.marketing-ops-feature {
  background:
    radial-gradient(circle at 86% 74%, rgba(196, 123, 15, 0.08), transparent 30%),
    radial-gradient(circle at 15% 22%, rgba(107, 128, 148, 0.11), transparent 34%),
    linear-gradient(135deg, #fffdf8 0%, #f7f4ed 56%, #eef1f2 100%);
}

.ownership-section {
  background:
    radial-gradient(circle at 18% 20%, rgba(196, 123, 15, 0.13), transparent 28%),
    radial-gradient(circle at 90% 82%, rgba(107, 128, 148, 0.14), transparent 32%),
    linear-gradient(135deg, #efe3d3 0%, #f7efe3 54%, #fbf7ef 100%);
  padding: 112px 0;
  border-top: 1px solid rgba(47, 55, 68, 0.10);
  border-bottom: 1px solid rgba(47, 55, 68, 0.12);
}

.ownership-button {
  margin-top: 34px;
}

.ownership-note,
.ownership-led-by {
  display: none !important;
}

.cta-band {
  padding: 96px 0 0;
  background:
    radial-gradient(circle at 84% 18%, rgba(196, 123, 15, 0.17), transparent 28%),
    linear-gradient(135deg, var(--midnight-deep), var(--midnight));
}

.cta-card {
  width: min(var(--max), calc(100% - 48px));
  max-width: var(--max);
  border-radius: 18px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.055);
  color: var(--white);
  box-shadow: none;
}

.cta-card h2 {
  color: var(--white);
}

.cta-card p {
  color: #f3b84f;
}

.cta-icon {
  background: rgba(255, 255, 255, 0.10);
  border: 1px solid rgba(255, 255, 255, 0.16);
}

.cta-card .btn--dark {
  background: var(--paper);
  color: var(--midnight);
}

.form-section {
  background:
    radial-gradient(circle at 18% 78%, rgba(107, 128, 148, 0.12), transparent 32%),
    linear-gradient(135deg, var(--midnight-deep), var(--midnight));
  color: var(--white);
  padding-top: 58px;
}

.form-section .section-title {
  color: var(--white);
}

.form-section .section-lead {
  color: rgba(255, 255, 255, 0.74);
}

@media (max-width: 720px) {
  .pillars {
    padding-top: 64px;
  }

  .pillars__intro {
    text-align: left;
    padding-bottom: 26px;
  }

  .ownership-section {
    padding: 82px 0;
  }

  .cta-band {
    padding-top: 72px;
  }

  .cta-card {
    width: min(100% - 32px, var(--max));
  }
}


/* v14: header polish, compact operating approach, About Katie, and refined contact */

/* Header */
.site-header {
  background: rgba(13, 22, 34, 0.96);
  border-bottom: 1px solid rgba(255, 255, 255, 0.10);
  backdrop-filter: blur(18px);
}

.nav {
  min-height: 92px;
  gap: 38px;
}

.brand {
  color: var(--white);
  min-width: 330px;
  gap: 18px;
}

.brand::after {
  content: "";
  width: 1px;
  height: 54px;
  margin-left: 8px;
  background: rgba(255, 255, 255, 0.16);
}

.brand__mark {
  width: 76px;
  height: 68px;
  object-fit: contain;
}

.brand__text {
  color: var(--white);
  font-size: 17px;
  gap: 3px;
  letter-spacing: 0.065em;
}

.brand__the {
  color: #f3b84f;
  font-size: 12px;
}

.nav-links {
  flex: 1;
  justify-content: flex-end;
  gap: 34px;
  color: rgba(255, 255, 255, 0.88);
  font-size: 13px;
}

.nav-links > a:not(.btn) {
  position: relative;
  padding: 34px 0 30px;
}

.nav-links > a:not(.btn)::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 22px;
  height: 2px;
  background: var(--precision);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 160ms ease;
}

.nav-links > a:not(.btn):hover::after,
.nav-links > a:not(.btn)[aria-current='page']::after {
  transform: scaleX(1);
}

.nav-links a:hover,
.nav-links a[aria-current='page'] {
  color: #f3b84f;
}

.nav-cta {
  margin-left: 12px;
  min-width: 132px;
  border-radius: 8px;
}

.menu-toggle {
  color: var(--white);
  border-color: rgba(255, 255, 255, 0.24);
}

/* Operating Approach */
.pillars {
  padding: 76px 0 0;
}

.pillars__intro {
  padding-bottom: 30px;
}

.pillars__intro .eyebrow {
  display: none;
}

.pillars__intro h2 {
  font-size: clamp(2.25rem, 3.4vw, 3.4rem);
  line-height: 1.05;
}

/* About Katie section */
.about-katie-section {
  background:
    radial-gradient(circle at 14% 12%, rgba(196, 123, 15, 0.12), transparent 28%),
    radial-gradient(circle at 82% 72%, rgba(107, 128, 148, 0.16), transparent 34%),
    linear-gradient(135deg, #071322 0%, #0a1828 50%, #06111e 100%);
  color: var(--white);
  padding: 104px 0;
}

.about-katie-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 0.72fr);
  gap: 72px;
  align-items: center;
  padding: 54px;
  border: 1px solid rgba(243, 184, 79, 0.38);
  border-radius: 24px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.018)),
    rgba(14, 29, 47, 0.56);
  box-shadow: 0 28px 72px rgba(0, 0, 0, 0.22);
}

.about-katie-section .eyebrow {
  color: #f3b84f;
}

.about-katie-section .section-title {
  color: var(--white);
  max-width: 700px;
  font-size: clamp(3rem, 5vw, 5rem);
  line-height: 0.98;
}

.about-katie-section .section-lead {
  color: rgba(255, 255, 255, 0.78);
  max-width: 690px;
}

.about-katie-list {
  list-style: none;
  padding: 0;
  margin: 30px 0 0;
  display: grid;
  gap: 12px;
  max-width: 700px;
}

.about-katie-list li {
  position: relative;
  padding: 13px 0 13px 42px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  color: rgba(255, 255, 255, 0.86);
}

.about-katie-list li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 11px;
  width: 25px;
  height: 25px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  border: 1px solid #f3b84f;
  color: #f3b84f;
  font-size: 14px;
  font-weight: 700;
}

.about-katie-button {
  margin-top: 32px;
}

.about-photo-placeholder {
  display: grid;
  place-items: center;
}

.about-photo-frame {
  width: min(100%, 390px);
  aspect-ratio: 4 / 5;
  border-radius: 18px;
  padding: 18px;
  background: linear-gradient(180deg, #f8f1e7, #e7ded2);
  border: 1px solid rgba(243, 184, 79, 0.58);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.24);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
}

.about-photo-frame::before {
  content: "";
  position: absolute;
  inset: 18px;
  border: 1px solid rgba(47, 55, 68, 0.18);
  border-radius: 12px;
  z-index: 2;
  pointer-events: none;
}

.about-photo-img {
  position: absolute;
  inset: 18px;
  width: calc(100% - 36px);
  height: calc(100% - 36px);
  object-fit: cover;
  object-position: center top;
  display: block;
  border-radius: 12px;
  z-index: 1;
}

/* Why leaders section follows About Katie, so keep it lighter and distinct */
.ownership-section {
  background:
    radial-gradient(circle at 16% 18%, rgba(196, 123, 15, 0.10), transparent 28%),
    linear-gradient(180deg, #fffdf8 0%, #f6efe4 100%);
}

/* Refined contact section */
.cta-band:not(.service-cta-band) {
  display: none;
}

.contact-redesign,
.form-section {
  background:
    radial-gradient(circle at 12% 80%, rgba(38, 91, 140, 0.20), transparent 32%),
    radial-gradient(circle at 82% 18%, rgba(196, 123, 15, 0.10), transparent 28%),
    linear-gradient(135deg, var(--midnight-deep), var(--midnight));
  color: var(--white);
  padding: 108px 0;
}

.contact-redesign .contact-grid {
  grid-template-columns: minmax(0, 0.78fr) minmax(520px, 1.08fr);
  gap: 78px;
  align-items: center;
}

.contact-copy .section-title {
  color: var(--white);
  max-width: 560px;
  font-size: clamp(3rem, 5vw, 5.4rem);
  line-height: 0.98;
}

.contact-redesign .contact-title-accent {
  display: block;
  color: #f0bb5d;
}

.contact-copy .section-lead {
  color: rgba(255, 255, 255, 0.76);
  max-width: 570px;
}

.contact-direct-note {
  margin-top: 50px;
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 18px;
  align-items: center;
  color: rgba(255, 255, 255, 0.82);
}

.contact-direct-note span {
  width: 56px;
  height: 56px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #f3b84f;
  border: 1px solid rgba(243, 184, 79, 0.72);
}

.contact-direct-note svg {
  width: 28px;
  height: 28px;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.contact-direct-note strong {
  color: var(--white);
  display: block;
  font-size: 1.05rem;
}

.contact-direct-note p {
  margin: 2px 0 0;
  color: rgba(255, 255, 255, 0.62);
}

.contact-card {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.035)),
    rgba(14, 29, 47, 0.78);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 22px;
  padding: 44px;
  box-shadow: 0 28px 76px rgba(0, 0, 0, 0.24);
}

.contact-form {
  gap: 20px;
}

label {
  color: rgba(255,255,255,.78);
}

input, textarea {
  min-height: 54px;
  border-color: rgba(255,255,255,.25);
  background: rgba(7, 19, 34, 0.56);
}

textarea {
  min-height: 150px;
}

textarea::placeholder {
  color: rgba(255,255,255,.42);
}

.contact-submit {
  width: 100%;
  margin-top: 4px;
  min-height: 58px;
  font-size: 0.86rem;
}

.form-note--privacy {
  position: relative;
  padding-left: 28px;
  color: rgba(255, 255, 255, 0.64);
}

.form-note--privacy::before {
  content: "▣";
  position: absolute;
  left: 0;
  color: #f3b84f;
}

/* Service page CTA band above contact */
.service-cta-band {
  padding: 72px 0 0;
  background:
    radial-gradient(circle at 84% 18%, rgba(196, 123, 15, 0.14), transparent 28%),
    linear-gradient(135deg, var(--midnight-deep), var(--midnight));
}

.service-cta-band .cta-card {
  width: min(var(--max), calc(100% - 48px));
  max-width: var(--max);
  border-radius: 18px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.055);
}

/* Mobile refinements */
@media (max-width: 1100px) {
  .brand {
    min-width: auto;
  }

  .brand::after {
    display: none;
  }

  .nav-links {
    gap: 22px;
  }

  .about-katie-card,
  .contact-redesign .contact-grid {
    grid-template-columns: 1fr;
  }

  .about-photo-placeholder {
    justify-content: start;
  }
}

@media (max-width: 980px) {
  .site-header {
    background: rgba(13, 22, 34, 0.98);
  }

  .nav-links {
    inset: 92px 0 auto 0;
    background: rgba(13, 22, 34, 0.98);
    color: rgba(255, 255, 255, 0.9);
  }

  .nav-links > a:not(.btn) {
    padding: 0 0 8px;
  }

  .nav-links > a:not(.btn)::after {
    bottom: 0;
  }
}

@media (max-width: 720px) {
  .nav {
    min-height: 82px;
  }

  .brand__mark {
    width: 54px;
    height: 50px;
  }

  .brand__text {
    font-size: 13px;
  }

  .about-katie-section,
  .contact-redesign,
  .form-section {
    padding: 76px 0;
  }

  .about-katie-card {
    padding: 28px;
    gap: 38px;
  }

  .about-photo-frame {
    width: 100%;
  }

  .contact-card {
    padding: 26px;
  }

  .contact-redesign .contact-grid {
    gap: 42px;
  }

  .contact-direct-note {
    grid-template-columns: 1fr;
    gap: 12px;
  }
}



/* v15 fixes: header logo visibility, operating spacing, and form label polish */

/* Use the existing color logo in the dark header without forcing a white-box look. */
.site-header .brand__mark {
  width: 62px;
  height: 62px;
  object-fit: contain;
  filter: none;
}

/* Tighten the space above Operating Approach. */
.pillars {
  padding-top: 52px;
}

.pillars__intro {
  padding-bottom: 26px;
}

.pillars__intro h2 {
  font-size: clamp(2.1rem, 3vw, 3.1rem);
}

/* Keep optional phone label on one line. */
.form-label-text {
  display: inline;
}

.form-optional {
  display: inline;
  color: rgba(255,255,255,.58);
  font-weight: 600;
  letter-spacing: 0;
  margin-left: 4px;
}

/* Make service/home forms inherit the same optional styling. */
label .form-optional {
  font-size: 0.92em;
}

@media (max-width: 720px) {
  .pillars {
    padding-top: 44px;
  }

  .site-header .brand__mark {
    width: 52px;
    height: 52px;
  }
}



/* v16: custom header logo, ways to work, footer separation, copy refinements */

/* The generated header logo has a matching dark field, so display it as a clean mark. */
.site-header .brand__mark {
  width: 66px;
  height: 66px;
  border-radius: 14px;
  object-fit: cover;
  background: transparent;
  box-shadow: none;
}

/* Ways to Work Together */
.ways-section {
  background:
    radial-gradient(circle at 12% 18%, rgba(196, 123, 15, 0.10), transparent 28%),
    radial-gradient(circle at 88% 78%, rgba(107, 128, 148, 0.12), transparent 32%),
    linear-gradient(180deg, var(--paper) 0%, var(--canvas) 100%);
  color: var(--midnight);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.ways-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.82fr) minmax(560px, 1.08fr);
  gap: 72px;
  align-items: start;
}

.ways-copy {
  max-width: 620px;
}

.ways-copy .section-title {
  color: var(--midnight);
  font-size: clamp(2.8rem, 4.8vw, 5rem);
  line-height: 0.98;
}

.ways-copy .section-lead {
  color: rgba(47, 55, 68, 0.76);
}

.ways-cards {
  display: grid;
  gap: 18px;
}

.ways-card {
  position: relative;
  padding: 30px 32px 30px 92px;
  border: 1px solid rgba(47, 55, 68, 0.13);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.76);
  box-shadow: 0 18px 44px rgba(13, 22, 34, 0.08);
}

.ways-number {
  position: absolute;
  left: 30px;
  top: 32px;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: rgba(196, 123, 15, 0.10);
  border: 1px solid rgba(196, 123, 15, 0.34);
  color: var(--precision);
  font-weight: 800;
  font-size: 0.82rem;
}

.ways-card h3 {
  margin: 0 0 8px;
  color: var(--midnight);
  font-size: 1.25rem;
  line-height: 1.2;
  letter-spacing: -0.02em;
}

.ways-card p {
  margin: 0;
  color: rgba(47, 55, 68, 0.72);
  line-height: 1.62;
}

/* Footer spacing */
.site-footer .footer-grid > div:first-child {
  display: grid;
  gap: 4px;
}

.site-footer .footer-grid > div:first-child span:first-child {
  color: rgba(255,255,255,.78);
}

.site-footer .footer-grid > div:first-child span:last-child {
  color: rgba(255,255,255,.56);
}

/* Service pages retain CTA and contact rhythm. */
.service-cta-band + .form-section {
  padding-top: 58px;
}

@media (max-width: 1100px) {
  .ways-grid {
    grid-template-columns: 1fr;
    gap: 42px;
  }

  .ways-cards {
    max-width: 820px;
  }
}

@media (max-width: 720px) {
  .site-header .brand__mark {
    width: 52px;
    height: 52px;
    border-radius: 12px;
  }

  .ways-card {
    padding: 26px;
  }

  .ways-number {
    position: static;
    margin-bottom: 16px;
  }
}



/* v17: Marketing Operations page redesign, implementation section, and Zapier-ready forms */

/* Marketing Operations page hero */
.marketing-page-hero {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 74% 42%, rgba(196, 123, 15, 0.18), transparent 28%),
    radial-gradient(circle at 88% 18%, rgba(255, 255, 255, 0.08), transparent 24%),
    radial-gradient(circle at 18% 76%, rgba(107, 128, 148, 0.18), transparent 34%),
    linear-gradient(135deg, #06111e 0%, #0a1b2d 42%, #102a43 68%, #06111e 100%);
  color: var(--white);
  padding: 104px 0 96px;
}

.marketing-page-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
  background-size: 42px 42px;
  opacity: 0.26;
  pointer-events: none;
}

.marketing-page-hero::after {
  content: "";
  position: absolute;
  right: 5%;
  top: 18%;
  width: 44%;
  height: 58%;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.08), transparent 64%);
  filter: blur(4px);
  pointer-events: none;
}

.marketing-page-hero__grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(520px, 1.08fr);
  gap: 72px;
  align-items: center;
}

.marketing-page-hero__copy {
  max-width: 620px;
}

.breadcrumb {
  margin: 0 0 26px;
  color: #f3b84f;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.marketing-page-hero h1 {
  margin: 0;
  color: var(--white);
  font-family: 'Instrument Serif', Georgia, 'Times New Roman', serif;
  font-size: clamp(3.4rem, 5.8vw, 6.25rem);
  line-height: 0.96;
  letter-spacing: -0.02em;
  font-weight: 400;
}

.marketing-page-hero p:not(.breadcrumb) {
  margin: 30px 0 0;
  color: rgba(255, 255, 255, 0.76);
  font-size: 1.12rem;
  line-height: 1.72;
}

.marketing-funnel-visual {
  position: relative;
  z-index: 1;
  min-height: 360px;
  padding: 28px;
  border-radius: 24px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.065), rgba(255, 255, 255, 0.025)),
    rgba(7, 19, 34, 0.34);
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 28px 72px rgba(0, 0, 0, 0.24);
  backdrop-filter: blur(6px);
}

.marketing-funnel-visual svg {
  width: 100%;
  height: auto;
  overflow: visible;
}

.funnel-dots circle {
  stroke: rgba(255,255,255,.72);
  stroke-width: 1.5;
  fill: rgba(255,255,255,.08);
}

.funnel-dots circle:nth-child(even) {
  stroke: #f3b84f;
}

.funnel-shape path,
.funnel-output path {
  stroke: rgba(243, 184, 79, 0.74);
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.funnel-output path {
  stroke: rgba(255,255,255,.52);
}

.output-card rect {
  fill: rgba(255,255,255,.045);
  stroke: rgba(255,255,255,.34);
}

.output-card path,
.output-card circle {
  stroke: #f3b84f;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.output-card text {
  fill: rgba(255,255,255,.88);
  font-family: 'IBM Plex Sans', system-ui, sans-serif;
  font-size: 13px;
  font-weight: 700;
}

.marketing-page-statement {
  padding: 28px 0;
  background: linear-gradient(90deg, var(--paper), var(--canvas));
  border-bottom: 1px solid var(--line);
  text-align: center;
}

.marketing-page-statement p {
  margin: 0;
  color: var(--midnight);
  font-family: 'Instrument Serif', Georgia, 'Times New Roman', serif;
  font-size: clamp(1.55rem, 2.3vw, 2.1rem);
  line-height: 1.3;
}

.marketing-buckets-section {
  background: var(--paper);
  color: var(--midnight);
}

.marketing-buckets-intro {
  text-align: center;
  max-width: 860px;
}

.marketing-buckets-intro .section-title {
  color: var(--midnight);
}

.marketing-buckets-intro .section-lead {
  margin-left: auto;
  margin-right: auto;
  color: rgba(47,55,68,.76);
}

.marketing-bucket-grid {
  margin-top: 56px;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 18px;
}

.marketing-bucket-card {
  padding: 28px 22px;
  border: 1px solid rgba(47,55,68,.13);
  border-radius: 14px;
  background: rgba(255,255,255,.74);
  box-shadow: 0 18px 46px rgba(13,22,34,.08);
}

.bucket-icon {
  width: 76px;
  height: 76px;
  margin-bottom: 28px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(196,123,15,.08);
  color: var(--midnight);
}

.bucket-icon svg {
  width: 38px;
  height: 38px;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.bucket-number {
  display: inline-grid;
  place-items: center;
  min-width: 34px;
  height: 24px;
  margin-bottom: 18px;
  border-radius: 5px;
  background: var(--precision);
  color: var(--white);
  font-size: 0.74rem;
  font-weight: 800;
}

.marketing-bucket-card h3 {
  margin: 0;
  color: var(--midnight);
  font-size: 1.28rem;
  line-height: 1.18;
  letter-spacing: -0.02em;
}

.marketing-bucket-card p {
  margin: 18px 0 0;
  color: rgba(47,55,68,.76);
  font-size: 0.96rem;
  line-height: 1.58;
}

.marketing-bucket-card ul {
  margin: 22px 0 0;
  padding-left: 18px;
  color: rgba(47,55,68,.76);
  font-size: 0.92rem;
  line-height: 1.55;
}

.marketing-bucket-card li + li {
  margin-top: 8px;
}

.marketing-bucket-card li::marker {
  color: var(--precision);
}

.attribution-callout {
  margin-top: 32px;
  display: grid;
  grid-template-columns: 88px 1fr;
  gap: 28px;
  align-items: center;
  padding: 28px 34px;
  border-radius: 14px;
  background:
    linear-gradient(90deg, rgba(196,123,15,.08), rgba(107,128,148,.08)),
    var(--canvas);
  border: 1px solid rgba(47,55,68,.12);
}

.attribution-callout__icon {
  width: 74px;
  height: 74px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: var(--precision);
  border: 1px solid rgba(196,123,15,.38);
  background: rgba(255,255,255,.62);
}

.attribution-callout__icon svg {
  width: 38px;
  height: 38px;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.attribution-callout h3 {
  margin: 0;
  color: var(--midnight);
  font-size: 1.45rem;
  line-height: 1.2;
}

.attribution-callout p {
  margin: 8px 0 0;
  color: rgba(47,55,68,.76);
  line-height: 1.62;
}

/* Marketing implementation section */
.marketing-implementation-section {
  background:
    radial-gradient(circle at 8% 10%, rgba(196, 123, 15, 0.18), transparent 26%),
    radial-gradient(circle at 86% 78%, rgba(107, 128, 148, 0.10), transparent 32%),
    linear-gradient(135deg, #071322 0%, #0a1828 50%, #06111e 100%);
  color: var(--white);
  border-top: 1px solid rgba(243, 184, 79, 0.25);
  border-bottom: 1px solid rgba(243, 184, 79, 0.18);
  position: relative;
  overflow: hidden;
}

.marketing-implementation-section::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    repeating-radial-gradient(circle at 12% 78%, rgba(243, 184, 79, 0.18) 0 1px, transparent 1px 22px),
    linear-gradient(125deg, transparent 0 56%, rgba(255,255,255,0.035) 56% 57%, transparent 57% 100%);
  opacity: 0.28;
  pointer-events: none;
}

.marketing-implementation-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 0.82fr) minmax(560px, 1.08fr);
  gap: 72px;
  align-items: center;
}

.marketing-implementation-copy {
  max-width: 620px;
}

.marketing-implementation-copy .eyebrow {
  color: #f3b84f;
}

.marketing-implementation-copy .section-title {
  color: var(--white);
  font-size: clamp(3rem, 5.2vw, 5.6rem);
  line-height: 0.98;
}

.marketing-implementation-copy .section-title span {
  color: #f3b84f;
}

.marketing-implementation-copy .section-lead {
  color: rgba(255, 255, 255, 0.76);
}

.marketing-implementation-cards {
  display: grid;
  gap: 16px;
}

.implementation-card {
  position: relative;
  display: grid;
  grid-template-columns: 112px 1fr 22px;
  gap: 28px;
  align-items: center;
  padding: 26px 28px;
  border: 1px solid rgba(47, 55, 68, 0.12);
  border-radius: 14px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(255, 253, 248, 0.86)),
    var(--paper);
  color: var(--midnight);
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.18);
}

.implementation-card::after {
  content: "›";
  color: var(--precision);
  font-size: 2.2rem;
  line-height: 1;
  justify-self: end;
}

.implementation-number {
  width: 54px;
  height: 54px;
  margin-bottom: 14px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: rgba(196, 123, 15, 0.08);
  border: 1px solid rgba(196, 123, 15, 0.32);
  color: var(--precision);
  font-family: 'Instrument Serif', Georgia, 'Times New Roman', serif;
  font-size: 1.8rem;
  line-height: 1;
}

.implementation-icon {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  color: var(--midnight);
}

.implementation-icon svg {
  width: 34px;
  height: 34px;
  stroke: currentColor;
  stroke-width: 1.55;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.implementation-card h3 {
  margin: 0 0 8px;
  color: var(--midnight);
  font-size: 1.55rem;
  line-height: 1.1;
  letter-spacing: -0.02em;
}

.implementation-card p {
  margin: 0;
  color: rgba(47, 55, 68, 0.72);
  line-height: 1.58;
}

/* Marketing contact section */
.marketing-contact-section {
  background:
    radial-gradient(circle at 86% 20%, rgba(196, 123, 15, 0.08), transparent 26%),
    linear-gradient(180deg, var(--paper), var(--canvas));
  color: var(--midnight);
  border-top: 1px solid var(--line);
}

.marketing-contact-section .contact-grid {
  grid-template-columns: minmax(0, 0.78fr) minmax(520px, 1.08fr);
  gap: 78px;
  align-items: center;
}

.marketing-contact-section .eyebrow {
  color: var(--precision);
}

.marketing-contact-section .section-title {
  color: var(--midnight);
  font-size: clamp(3rem, 5vw, 5.2rem);
  line-height: 1;
}

.marketing-contact-section .section-title span {
  display: block;
  color: var(--precision);
}

.marketing-contact-section .section-lead {
  color: rgba(47, 55, 68, 0.72);
}

.marketing-contact-section .contact-direct-note {
  margin-top: 46px;
  display: grid;
  grid-template-columns: 58px 1fr;
  gap: 18px;
  align-items: center;
  padding: 18px;
  border-radius: 14px;
  background: rgba(196, 123, 15, 0.08);
  border: 1px solid rgba(196, 123, 15, 0.22);
  color: var(--midnight);
}

.marketing-contact-section .contact-direct-note span {
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: var(--precision);
  border: 1px solid rgba(196, 123, 15, 0.42);
  background: rgba(255, 255, 255, 0.48);
}

.marketing-contact-section .contact-direct-note svg {
  width: 28px;
  height: 28px;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.marketing-contact-section .contact-direct-note strong {
  display: block;
  color: var(--midnight);
}

.marketing-contact-section .contact-direct-note p {
  margin: 2px 0 0;
  color: rgba(47, 55, 68, 0.62);
}

.marketing-contact-section .contact-card {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(255, 253, 248, 0.86)),
    var(--paper);
  border-color: rgba(47, 55, 68, 0.12);
  box-shadow: 0 22px 58px rgba(13, 22, 34, 0.10);
}

.marketing-contact-section label {
  color: rgba(47, 55, 68, 0.72);
}

.marketing-contact-section input,
.marketing-contact-section textarea {
  color: var(--midnight);
  background: rgba(255,255,255,0.72);
  border-color: rgba(47, 55, 68, 0.18);
}

.marketing-contact-section .form-optional {
  color: rgba(47, 55, 68, 0.52);
}

.marketing-contact-section .form-note--privacy {
  color: rgba(47, 55, 68, 0.58);
}

@media (max-width: 1180px) {
  .marketing-bucket-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .marketing-bucket-card:last-child {
    grid-column: span 2;
  }
}

@media (max-width: 980px) {
  .marketing-page-hero__grid,
  .marketing-implementation-grid,
  .marketing-contact-section .contact-grid {
    grid-template-columns: 1fr;
  }

  .marketing-funnel-visual {
    max-width: 680px;
  }

  .marketing-implementation-cards {
    max-width: 820px;
  }
}

@media (max-width: 680px) {
  .marketing-page-hero {
    padding: 76px 0;
  }

  .marketing-bucket-grid {
    grid-template-columns: 1fr;
  }

  .marketing-bucket-card:last-child {
    grid-column: auto;
  }

  .attribution-callout,
  .implementation-card {
    grid-template-columns: 1fr;
  }

  .implementation-card::after {
    display: none;
  }

  .implementation-number {
    margin-bottom: 10px;
  }

  .marketing-contact-section .contact-direct-note {
    grid-template-columns: 1fr;
  }
}



/* v18: Marketing page implementation-card layout fix + funnel-order refinements */

/* Fix implementation cards so the title/body are not squeezed into the arrow column. */
.marketing-implementation-cards {
  gap: 18px;
}

.implementation-card {
  grid-template-columns: 64px 58px minmax(0, 1fr) 22px;
  gap: 22px;
  min-height: 144px;
  align-items: center;
}

.implementation-card > div:last-of-type {
  min-width: 0;
  padding-right: 8px;
}

.implementation-number {
  margin-bottom: 0;
  justify-self: center;
}

.implementation-icon {
  justify-self: center;
}

.implementation-card h3 {
  max-width: none;
}

.implementation-card p {
  max-width: 720px;
}

/* Slightly reduce the over-large blank feel inside the light implementation cards. */
.implementation-card {
  padding: 24px 28px;
}

/* Keep the five marketing buckets readable after reordering. */
.marketing-bucket-card {
  min-height: 100%;
}

@media (max-width: 680px) {
  .implementation-card {
    grid-template-columns: 1fr;
    gap: 14px;
    min-height: auto;
  }

  .implementation-number,
  .implementation-icon {
    justify-self: start;
  }

  .implementation-card > div:last-of-type {
    padding-right: 0;
  }
}



/* v19: Homepage hero copy emphasis and Marketing Operations split hero */

/* Homepage hero update */
.hero-v19 {
  background:
    radial-gradient(circle at 82% 28%, rgba(196, 123, 15, 0.11), transparent 26%),
    radial-gradient(circle at 18% 78%, rgba(107, 128, 148, 0.15), transparent 34%),
    linear-gradient(135deg, #071322 0%, #0a1828 52%, #06111e 100%);
  color: var(--white);
  min-height: 760px;
  display: grid;
  align-items: center;
}

.hero-v19 .hero__grid {
  grid-template-columns: minmax(0, 0.98fr) minmax(420px, 0.88fr);
}

.hero-v19 .eyebrow {
  color: #f3b84f;
  margin-bottom: 18px;
}

.hero-v19 h1 {
  color: var(--white);
  max-width: 900px;
  font-size: clamp(3.4rem, 6vw, 6.8rem);
  line-height: 0.96;
}

.hero-v19 h1 .accent {
  color: #f3b84f;
}

.hero-v19 .hero__lead {
  color: rgba(255,255,255,.78);
  max-width: 760px;
  font-size: 1.18rem;
  line-height: 1.72;
}

.hero-v19 .btn--secondary {
  color: var(--white);
  border-color: rgba(255,255,255,.38);
  background: rgba(255,255,255,.02);
}

.hero-v19 .btn--secondary:hover {
  border-color: rgba(243,184,79,.72);
}

.hero-abstract-v19 {
  min-height: 520px;
  opacity: 0.58;
}

.hero-abstract-v19 .abstract-panel {
  border-color: rgba(243,184,79,.20);
}

/* Marketing Operations top split hero */
.marketing-hero-split {
  display: grid;
  grid-template-columns: minmax(420px, 44vw) minmax(0, 1fr);
  min-height: 720px;
  overflow: hidden;
  background: #f2dfc9;
  border-bottom: 1px solid rgba(47, 55, 68, 0.14);
}

.marketing-hero-split__left {
  position: relative;
  z-index: 2;
  background:
    radial-gradient(circle at 18% 18%, rgba(255,255,255,.08), transparent 30%),
    linear-gradient(135deg, #071322 0%, #0b1d30 48%, #071322 100%);
  color: var(--white);
  border-right: 2px solid rgba(196, 123, 15, 0.72);
  border-radius: 0 55% 55% 0 / 0 100% 100% 0;
  margin-right: -8vw;
  display: flex;
  align-items: center;
}

.marketing-hero-split__content {
  width: min(620px, calc(100% - 96px));
  margin-left: max(48px, calc((100vw - var(--max)) / 2));
  padding: 84px 0;
}

.marketing-hero-eyebrow {
  margin: 0 0 30px;
  color: #f3b84f;
  font-size: clamp(1.05rem, 1.4vw, 1.38rem);
  line-height: 1.15;
  font-weight: 800;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

.marketing-hero-eyebrow::after {
  content: "";
  display: block;
  width: 86px;
  height: 2px;
  margin-top: 18px;
  background: #f3b84f;
}

.marketing-hero-split h1 {
  margin: 0;
  color: var(--white);
  font-family: 'Instrument Serif', Georgia, 'Times New Roman', serif;
  font-weight: 400;
  letter-spacing: -0.02em;
  font-size: clamp(3.6rem, 5.6vw, 6.4rem);
  line-height: 0.97;
}

.marketing-hero-split h1::first-line {
  color: var(--white);
}

.marketing-hero-split h1 {
  text-wrap: balance;
}

.marketing-hero-split h1::after {
  content: "";
  display: block;
  width: 78px;
  height: 2px;
  margin: 30px 0 0;
  background: #f3b84f;
}

.marketing-hero-split__content > p {
  margin: 34px 0 0;
  color: rgba(255,255,255,.78);
  font-size: 1.08rem;
  line-height: 1.72;
  max-width: 540px;
}

.marketing-hero-btn {
  margin-top: 42px;
  background: rgba(255,255,255,.06);
  color: #f3b84f;
  border-color: rgba(243,184,79,.74);
  box-shadow: none;
}

.marketing-hero-btn:hover {
  background: rgba(243,184,79,.14);
  color: var(--white);
}

.marketing-hero-split__right {
  position: relative;
  display: grid;
  grid-template-columns: minmax(340px, 0.78fr) minmax(260px, 0.5fr);
  align-items: center;
  gap: 38px;
  padding: 98px max(48px, calc((100vw - var(--max)) / 2)) 88px 14vw;
  background:
    radial-gradient(circle at 54% 42%, rgba(255,255,255,0.68), transparent 30%),
    linear-gradient(135deg, #f8ebd9 0%, #f2dfc9 100%);
}

.marketing-hero-split__right::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 86% 18%, rgba(255,255,255,.36), transparent 26%),
    linear-gradient(90deg, rgba(255,255,255,.20), transparent 36%);
  pointer-events: none;
}

.channel-row {
  position: absolute;
  top: 70px;
  left: 17vw;
  right: max(120px, calc((100vw - var(--max)) / 2));
  display: flex;
  justify-content: center;
  gap: clamp(24px, 3vw, 54px);
  z-index: 2;
}

.channel-row div {
  display: grid;
  place-items: center;
  gap: 8px;
  color: rgba(13, 22, 34, 0.86);
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.channel-row span {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: rgba(196, 123, 15, 0.88);
  border: 1px solid rgba(196, 123, 15, 0.36);
  background: rgba(255,255,255,.38);
  font-size: 1.35rem;
  line-height: 1;
}

.marketing-funnel-graphic {
  position: relative;
  z-index: 1;
  width: min(560px, 100%);
  height: 520px;
  align-self: center;
  margin-top: 80px;
}

.funnel-stream {
  position: absolute;
  top: -42px;
  width: 1px;
  height: 86px;
  border-left: 1.5px dashed rgba(196, 123, 15, 0.42);
  transform-origin: bottom center;
}

.funnel-stream::after {
  content: "";
  position: absolute;
  left: -4px;
  bottom: -3px;
  width: 8px;
  height: 8px;
  border-right: 1.5px solid rgba(196, 123, 15, 0.58);
  border-bottom: 1.5px solid rgba(196, 123, 15, 0.58);
  transform: rotate(45deg);
}

.funnel-stream--one { left: 36%; transform: rotate(-18deg); }
.funnel-stream--two { left: 50%; }
.funnel-stream--three { left: 64%; transform: rotate(18deg); }

.funnel-tier {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  height: 88px;
  border-radius: 50% / 28%;
  box-shadow:
    inset 0 10px 18px rgba(255,255,255,.22),
    inset 0 -12px 20px rgba(13,22,34,.18),
    0 12px 22px rgba(13,22,34,.13);
  border: 1px solid rgba(255,255,255,.34);
}

.funnel-tier--one {
  top: 52px;
  width: 100%;
  background: linear-gradient(180deg, #f3dfc5, #cfb391);
}

.funnel-tier--two {
  top: 132px;
  width: 84%;
  background: linear-gradient(180deg, #c89254, #9f6a2e);
}

.funnel-tier--three {
  top: 212px;
  width: 69%;
  background: linear-gradient(180deg, #a7aa98, #727864);
}

.funnel-tier--four {
  top: 292px;
  width: 54%;
  background: linear-gradient(180deg, #77828a, #47545d);
}

.funnel-tier--five {
  top: 372px;
  width: 38%;
  background: linear-gradient(180deg, #303941, #101922);
}

.funnel-labels {
  position: relative;
  z-index: 2;
  display: grid;
  gap: 38px;
  margin-top: 110px;
}

.funnel-labels div {
  position: relative;
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 14px;
  align-items: start;
  color: var(--midnight);
  min-height: 56px;
}

.funnel-labels div::before {
  content: "";
  position: absolute;
  right: calc(100% + 16px);
  top: 18px;
  width: 88px;
  height: 1px;
  background: rgba(196, 123, 15, 0.50);
}

.funnel-labels div::after {
  content: "";
  position: absolute;
  right: calc(100% + 98px);
  top: 14px;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--precision);
  box-shadow: 0 0 0 4px rgba(196,123,15,.11);
}

.funnel-labels span {
  color: var(--precision);
  font-size: 1.4rem;
  font-weight: 800;
  line-height: 1;
}

.funnel-labels p {
  margin: 0;
  color: var(--midnight);
  font-size: 1.02rem;
  line-height: 1.3;
  font-weight: 700;
}

@media (max-width: 1180px) {
  .marketing-hero-split {
    grid-template-columns: 1fr;
  }

  .marketing-hero-split__left {
    border-radius: 0;
    margin-right: 0;
    border-right: none;
    border-bottom: 1px solid rgba(196, 123, 15, 0.55);
  }

  .marketing-hero-split__content {
    width: min(var(--max), calc(100% - 48px));
    margin: 0 auto;
  }

  .marketing-hero-split__right {
    padding: 130px 48px 80px;
    grid-template-columns: minmax(320px, 520px) minmax(240px, 360px);
    justify-content: center;
  }

  .channel-row {
    left: 48px;
    right: 48px;
  }
}

@media (max-width: 820px) {
  .hero-v19 {
    min-height: auto;
  }

  .hero-v19 .hero__grid {
    grid-template-columns: 1fr;
  }

  .marketing-hero-split__right {
    grid-template-columns: 1fr;
    padding: 120px 24px 70px;
  }

  .marketing-funnel-graphic {
    margin: 60px auto 0;
    height: 460px;
  }

  .funnel-labels {
    margin-top: 0;
    max-width: 520px;
    margin-left: auto;
    margin-right: auto;
  }

  .funnel-labels div::before,
  .funnel-labels div::after {
    display: none;
  }

  .channel-row {
    top: 36px;
    left: 20px;
    right: 20px;
    gap: 12px;
    flex-wrap: wrap;
  }

  .channel-row span {
    width: 38px;
    height: 38px;
  }
}



/* v22 reset from v19: targeted refinements */

/* Homepage hero */
.hero-v22 {
  background:
    radial-gradient(circle at 78% 28%, rgba(196,123,15,.12), transparent 23%),
    linear-gradient(135deg, #06111e 0%, #0a1c30 46%, #06111e 100%);
  color: var(--white);
  min-height: 710px;
  display: grid;
  align-items: center;
  overflow: hidden;
  padding-top: 16px;
}

.hero-v22 .hero__grid {
  grid-template-columns: minmax(0, .98fr) minmax(420px, .88fr);
  align-items: center;
  gap: 52px;
}

.hero-copy-v22 {
  padding-top: 0;
}

.hero-copy-v22 h1 {
  margin: 0;
  color: var(--white);
  font-size: clamp(3.15rem, 5.35vw, 5.95rem);
  line-height: .98;
  letter-spacing: -0.02em;
  max-width: 920px;
}

.hero-copy-v22 h1 > span {
  display: block;
}

.hero-copy-v22 h1 .accent {
  color: #f0bb5d;
}

.hero-copy-v22 .hero__lead {
  max-width: 780px;
  margin-top: 34px;
  color: rgba(255,255,255,.80);
  font-size: 1.14rem;
  line-height: 1.72;
}

.hero-copy-v22 .hero__actions {
  margin-top: 34px;
}

.hero-v22 .btn--secondary.hero-service-link {
  color: var(--white);
  border-color: rgba(255,255,255,.36);
  background: rgba(255,255,255,.03);
  padding-left: 22px;
  padding-right: 22px;
  white-space: nowrap;
  min-width: fit-content;
}

.hero-v22 .btn--secondary.hero-service-link::after {
  display: none;
}

.hero-v22 .btn--secondary.hero-service-link:hover {
  border-color: rgba(240,187,93,.74);
  color: #f0bb5d;
}

/* Screenshot-style homepage background graphic */
.hero-background-graphic {
  position: relative;
  min-height: 590px;
  width: 100%;
}

.hero-orbit {
  position: absolute;
  border-radius: 50%;
  border: 1px solid rgba(240,187,93,.58);
  opacity: .82;
}

.hero-orbit--outer {
  width: 620px;
  height: 620px;
  right: -140px;
  top: 10px;
  border-color: rgba(255,255,255,.14);
}

.hero-orbit--middle {
  width: 490px;
  height: 490px;
  right: -42px;
  top: 70px;
  border-color: rgba(240,187,93,.44);
}

.hero-orbit--inner {
  width: 350px;
  height: 350px;
  right: 28px;
  top: 138px;
  border-color: rgba(255,255,255,.16);
}

.hero-graph-grid {
  position: absolute;
  right: 36px;
  bottom: 86px;
  width: min(410px, 86%);
  height: 275px;
  background:
    linear-gradient(rgba(255,255,255,.12), rgba(255,255,255,.12)) 0 24% / 100% 1px no-repeat,
    linear-gradient(rgba(255,255,255,.10), rgba(255,255,255,.10)) 0 50% / 100% 1px no-repeat,
    linear-gradient(rgba(255,255,255,.08), rgba(255,255,255,.08)) 0 76% / 100% 1px no-repeat,
    linear-gradient(90deg, rgba(255,255,255,.08), rgba(255,255,255,.08)) 20% 0 / 1px 100% no-repeat,
    linear-gradient(90deg, rgba(255,255,255,.08), rgba(255,255,255,.08)) 50% 0 / 1px 100% no-repeat,
    linear-gradient(90deg, rgba(255,255,255,.08), rgba(255,255,255,.08)) 80% 0 / 1px 100% no-repeat;
  border-left: 1px solid rgba(255,255,255,.12);
  border-bottom: 1px solid rgba(255,255,255,.12);
  opacity: .74;
}

.hero-graph-bars {
  position: absolute;
  right: 55px;
  bottom: 88px;
  width: min(370px, 78%);
  height: 250px;
  display: flex;
  align-items: end;
  gap: 14px;
  z-index: 2;
}

.hero-graph-bars span {
  flex: 1;
  height: var(--h);
  border-radius: 3px 3px 0 0;
  background: linear-gradient(180deg, rgba(255,255,255,.34), rgba(255,255,255,.12));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.2);
}

.hero-graph-bars span.gold {
  background: linear-gradient(180deg, rgba(240,187,93,.92), rgba(196,123,15,.52));
}

.hero-dot-matrix {
  position: absolute;
  width: 180px;
  height: 145px;
  right: 212px;
  top: 148px;
  background-image: radial-gradient(rgba(240,187,93,.58) 1.2px, transparent 1.2px);
  background-size: 13px 13px;
  opacity: .46;
}

/* About should remain in the same dark/blue visual world */
.about-katie-section {
  background:
    radial-gradient(circle at 20% 18%, rgba(196,123,15,.10), transparent 28%),
    linear-gradient(135deg, #071322 0%, #0a1c30 54%, #071322 100%);
}

.about-katie-section .about-katie-card {
  background: rgba(255,255,255,.05);
  border-color: rgba(255,255,255,.16);
}

.about-katie-section .section-title,
.about-katie-section .section-lead,
.about-katie-section .about-katie-list li,
.about-katie-section .about-photo-frame p {
  color: var(--white);
}

.about-katie-section .about-katie-list li::before {
  background: #f0bb5d;
}

.about-katie-section .about-photo-frame {
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.18);
}

.about-katie-section .about-photo-silhouette {
  background: rgba(255,255,255,.06);
  border-color: rgba(240,187,93,.24);
}

/* Contact direct note: blue emphasis, not tan */
.homepage-direct-note-v22 {
  background: linear-gradient(135deg, #0f2238, #162f4b);
  border: 1px solid rgba(240,187,93,.30);
  box-shadow: 0 20px 50px rgba(13,22,34,.14);
}

.homepage-direct-note-v22 span {
  background: rgba(240,187,93,.12);
  border-color: rgba(240,187,93,.28);
  color: #f0bb5d;
}

.homepage-direct-note-v22 strong {
  color: var(--white);
}

.homepage-direct-note-v22 p {
  color: rgba(255,255,255,.76);
}

/* Marketing hero: closer to reference funnel */
.marketing-hero-v22 {
  min-height: 730px;
  background: #f4e3d1;
}

.marketing-hero-v22 .marketing-hero-split__left {
  margin-right: -7vw;
  background:
    radial-gradient(circle at 16% 16%, rgba(255,255,255,.08), transparent 24%),
    linear-gradient(135deg, #06111e 0%, #0a1d33 48%, #071322 100%);
}

.marketing-hero-v22 .marketing-hero-split__content {
  max-width: 560px;
}

.marketing-hero-v22 .marketing-hero-eyebrow {
  color: #f0bb5d;
  font-size: clamp(1.18rem, 1.75vw, 1.62rem);
  letter-spacing: .18em;
}

.marketing-hero-v22 .marketing-hero-eyebrow::after {
  background: #f0bb5d;
  width: 96px;
}

.marketing-hero-v22 h1 {
  color: var(--white);
  font-size: clamp(3.55rem, 5.35vw, 6.05rem);
  line-height: .98;
  max-width: 560px;
}

.marketing-hero-v22 h1 span {
  display: block;
}

.marketing-hero-v22 h1 .accent {
  color: #f0bb5d;
}

.marketing-hero-v22 h1::after {
  display: none;
}

.marketing-hero-v22 .marketing-hero-split__content > p {
  max-width: 520px;
}

.marketing-hero-v22 .marketing-hero-split__right {
  padding: 84px max(48px, calc((100vw - var(--max)) / 2)) 78px 12.5vw;
  background:
    radial-gradient(circle at 46% 42%, rgba(255,255,255,.58), transparent 30%),
    linear-gradient(135deg, #f8eddf 0%, #f2dfcd 100%);
  display: block;
}

.marketing-funnel-reference {
  position: relative;
  width: min(820px, 100%);
  height: 590px;
  margin: 0 auto;
}

.channel-icons {
  position: absolute;
  left: 4%;
  right: 4%;
  top: 2px;
  display: flex;
  justify-content: center;
  gap: clamp(20px, 3vw, 48px);
  z-index: 3;
}

.channel-icons div {
  display: grid;
  place-items: center;
  gap: 8px;
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--midnight);
}

.channel-icons span {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: rgba(168,112,34,.96);
  border: 1px solid rgba(168,112,34,.32);
  background: rgba(255,255,255,.30);
  font-size: 1.45rem;
}

.funnel-lines {
  position: absolute;
  top: 82px;
  left: 12%;
  width: 45%;
  height: 92px;
  z-index: 1;
}

.funnel-line {
  position: absolute;
  top: 0;
  width: 1px;
  height: 105px;
  border-left: 1px dashed rgba(168,112,34,.48);
  transform-origin: bottom center;
}

.funnel-line::after {
  content: "";
  position: absolute;
  bottom: -2px;
  left: -4px;
  width: 8px;
  height: 8px;
  border-right: 1.4px solid rgba(168,112,34,.62);
  border-bottom: 1.4px solid rgba(168,112,34,.62);
  transform: rotate(45deg);
}

.funnel-line--1 { left: 13%; transform: rotate(-20deg); }
.funnel-line--2 { left: 30%; transform: rotate(-10deg); }
.funnel-line--3 { left: 49%; }
.funnel-line--4 { left: 68%; transform: rotate(10deg); }
.funnel-line--5 { left: 85%; transform: rotate(20deg); }

.funnel-stack {
  position: absolute;
  left: 3%;
  top: 170px;
  width: 56%;
  height: 390px;
}

.funnel-layer {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  border-radius: 50% / 28%;
  border: 1px solid rgba(255,255,255,.46);
  box-shadow:
    inset 0 12px 22px rgba(255,255,255,.30),
    inset 0 -16px 26px rgba(13,22,34,.16),
    0 18px 28px rgba(78,55,24,.13);
}

.funnel-layer--1 {
  top: 0;
  width: 100%;
  height: 86px;
  background: linear-gradient(180deg, #f0ddc7, #d4b28e);
}

.funnel-layer--2 {
  top: 74px;
  width: 84%;
  height: 84px;
  background: linear-gradient(180deg, #c98e50, #9d6428);
}

.funnel-layer--3 {
  top: 148px;
  width: 68%;
  height: 82px;
  background: linear-gradient(180deg, #aeb2a0, #78816d);
}

.funnel-layer--4 {
  top: 220px;
  width: 52%;
  height: 80px;
  background: linear-gradient(180deg, #74818a, #46535e);
}

.funnel-layer--5 {
  top: 292px;
  width: 36%;
  height: 76px;
  background: linear-gradient(180deg, #293543, #0d1724);
}

.funnel-callouts {
  position: absolute;
  left: 54%;
  right: 0;
  top: 130px;
  bottom: 0;
  z-index: 4;
}

.funnel-callouts div {
  position: absolute;
  top: var(--y);
  left: 0;
  display: grid;
  grid-template-columns: 36px 1fr;
  gap: 13px;
  align-items: start;
  color: var(--midnight);
}

.funnel-callouts div::before {
  content: "";
  position: absolute;
  right: calc(100% + 12px);
  top: 18px;
  width: 76px;
  height: 1px;
  background: rgba(168,112,34,.48);
}

.funnel-callouts div::after {
  content: "";
  position: absolute;
  right: calc(100% + 82px);
  top: 14px;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--precision);
  box-shadow: 0 0 0 4px rgba(196,123,15,.12);
}

.funnel-callouts span {
  color: var(--precision);
  font-size: 1.35rem;
  font-weight: 800;
  line-height: 1;
}

.funnel-callouts p {
  margin: 0;
  color: var(--midnight);
  font-weight: 750;
  line-height: 1.28;
  font-size: 1rem;
}

/* Marketing cards: number integrated with centered icon */
.bucket-icon-wrap {
  position: relative;
  width: 86px;
  height: 86px;
  margin-bottom: 22px;
}

.marketing-bucket-card .bucket-icon-wrap .bucket-icon {
  width: 86px;
  height: 86px;
  margin: 0;
  border-radius: 50%;
  background: rgba(196,123,15,.08);
  border: 1px solid rgba(196,123,15,.20);
}

.marketing-bucket-card .bucket-icon-wrap .bucket-icon svg {
  width: 40px;
  height: 40px;
}

.marketing-bucket-card .bucket-icon-wrap .bucket-number {
  position: absolute;
  right: -6px;
  top: -6px;
  width: 34px;
  height: 34px;
  min-width: 34px;
  margin: 0;
  display: grid;
  place-items: center;
  border-radius: 50%;
  font-size: .72rem;
  box-shadow: 0 10px 22px rgba(196,123,15,.18);
}

@media (max-width: 1180px) {
  .hero-v22 .hero__grid {
    grid-template-columns: 1fr;
  }

  .hero-background-graphic {
    min-height: 360px;
  }

  .marketing-hero-v22 .marketing-hero-split__left {
    margin-right: 0;
  }

  .marketing-hero-v22 .marketing-hero-split__right {
    padding-left: 48px;
  }
}

@media (max-width: 820px) {
  .hero-v22 {
    min-height: auto;
  }

  .hero-copy-v22 h1 {
    font-size: clamp(2.65rem, 9vw, 4.15rem);
  }

  .hero-background-graphic {
    min-height: 320px;
  }

  .hero-orbit--outer {
    width: 360px;
    height: 360px;
    right: -120px;
  }

  .hero-orbit--middle {
    width: 280px;
    height: 280px;
    right: -48px;
  }

  .hero-orbit--inner {
    width: 210px;
    height: 210px;
    right: 12px;
  }

  .hero-graph-bars {
    width: 250px;
    right: 24px;
    gap: 9px;
  }

  .hero-graph-grid {
    right: 18px;
    width: 280px;
  }

  .marketing-funnel-reference {
    height: 820px;
  }

  .channel-icons {
    gap: 10px;
    flex-wrap: wrap;
  }

  .channel-icons span {
    width: 40px;
    height: 40px;
    font-size: 1.1rem;
  }

  .funnel-stack {
    left: 50%;
    transform: translateX(-50%);
    top: 190px;
    width: 82%;
  }

  .funnel-lines {
    left: 20%;
    width: 60%;
  }

  .funnel-callouts {
    left: 8%;
    top: 560px;
  }

  .funnel-callouts div {
    position: relative;
    top: auto !important;
    margin-bottom: 18px;
  }

  .funnel-callouts div::before,
  .funnel-callouts div::after {
    display: none;
  }
}



/* v23: targeted homepage refinements */

/* Move the homepage hero content closer to the header */
.hero-v22 {
  min-height: 660px;
  align-items: start;
  padding-top: 52px;
  padding-bottom: 62px;
}

.hero-v22 .hero__grid {
  align-items: start;
}

/* Give the direct-Katie note more breathing room */
.homepage-direct-note-v22 {
  padding: 28px 30px;
  gap: 20px;
  margin-top: 48px;
  border-radius: 18px;
}

.homepage-direct-note-v22 span {
  width: 54px;
  height: 54px;
  flex: 0 0 54px;
}

.homepage-direct-note-v22 strong {
  display: block;
  margin-bottom: 4px;
  font-size: 1.02rem;
}

.homepage-direct-note-v22 p {
  margin: 0;
  font-size: .98rem;
}

@media (max-width: 820px) {
  .hero-v22 {
    padding-top: 36px;
    padding-bottom: 54px;
  }

  .homepage-direct-note-v22 {
    padding: 24px;
  }
}



/* v24: Ways to Work Together as editorial engagement menu */
.ways-section-v24 {
  background:
    radial-gradient(circle at 88% 16%, rgba(196, 123, 15, 0.08), transparent 26%),
    linear-gradient(180deg, #fffdf8 0%, #f5f0e8 100%);
  border-top: 1px solid rgba(47, 55, 68, 0.10);
  border-bottom: 1px solid rgba(47, 55, 68, 0.10);
}

.ways-v24 {
  display: grid;
  grid-template-columns: minmax(280px, 0.78fr) minmax(0, 1.18fr);
  gap: clamp(44px, 7vw, 96px);
  align-items: start;
}

.ways-v24__intro {
  position: sticky;
  top: 120px;
}

.ways-v24__intro .section-title {
  margin-bottom: 0;
}

.ways-v24__intro .section-lead {
  margin-top: 22px;
}

.ways-v24__list {
  background: rgba(255, 253, 248, 0.72);
  border-top: 1px solid rgba(47, 55, 68, 0.16);
}

.ways-v24__row {
  display: grid;
  grid-template-columns: 74px 1fr;
  gap: 28px;
  padding: 34px 0;
  border-bottom: 1px solid rgba(47, 55, 68, 0.16);
}

.ways-v24__number {
  color: var(--precision);
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  line-height: 1.2;
  padding-top: 7px;
}

.ways-v24__body h3 {
  margin: 0;
  color: var(--midnight);
  font-family: 'Instrument Serif', Georgia, 'Times New Roman', serif;
  font-size: clamp(2rem, 3vw, 3rem);
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.05;
}

.ways-v24__body p {
  margin: 14px 0 0;
  max-width: 720px;
  color: rgba(47, 55, 68, 0.76);
  font-size: 1.03rem;
  line-height: 1.68;
}

.ways-v24__row:first-child {
  padding-top: 38px;
}

.ways-v24__row:last-child {
  padding-bottom: 38px;
}

@media (max-width: 900px) {
  .ways-v24 {
    grid-template-columns: 1fr;
    gap: 34px;
  }

  .ways-v24__intro {
    position: static;
  }

  .ways-v24__row {
    grid-template-columns: 54px 1fr;
    gap: 18px;
    padding: 28px 0;
  }
}

@media (max-width: 560px) {
  .ways-v24__row {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .ways-v24__number {
    padding-top: 0;
  }
}


/* v26 homepage and ways refresh */
.about-katie-section .section-title{
  max-width: 760px;
}

.ownership-title{
  max-width: 720px;
}

.ownership-title span{
  color: #f0bb5d;
}

/* Ways to work together refreshed layout */
.ways-section-v26 {
  background:
    radial-gradient(circle at 50% -10%, rgba(196,123,15,.08), transparent 26%),
    linear-gradient(180deg, #f7f1e8 0%, #f4eee5 100%);
  border-top: 1px solid rgba(47,55,68,.10);
  border-bottom: 1px solid rgba(47,55,68,.10);
}

.ways-v26 {
  position: relative;
}

.eyebrow--centered,
.section-title--centered,
.section-lead--centered {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.eyebrow--centered {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
}

.eyebrow--centered::before,
.eyebrow--centered::after {
  content: "";
  width: 64px;
  height: 1px;
  background: rgba(196,123,15,.55);
}

.ways-v26__intro {
  max-width: 920px;
  margin: 0 auto 48px;
}

.ways-v26__intro .section-title {
  max-width: 980px;
}

.ways-v26__intro .section-lead {
  max-width: 760px;
}

.ways-v26__track {
  position: absolute;
  left: 7%;
  right: 7%;
  top: 278px;
  height: 1px;
  background: rgba(196,123,15,.55);
}

.ways-v26__grid {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 44px;
}

.ways-v26__item {
  position: relative;
  text-align: center;
  padding: 0 8px;
}

.ways-v26__item:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 40px;
  right: -22px;
  width: 1px;
  height: 320px;
  background: rgba(47,55,68,.10);
}

.ways-v26__icon-wrap {
  position: relative;
  width: 112px;
  margin: 0 auto 24px;
}

.ways-v26__icon {
  width: 92px;
  height: 92px;
  margin: 0 auto;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: linear-gradient(180deg, #0a1c30 0%, #06111e 100%);
  border: 2px solid rgba(240,187,93,.70);
  box-shadow: 0 18px 34px rgba(13,22,34,.12), inset 0 0 0 1px rgba(255,255,255,.06);
}

.ways-v26__icon svg {
  width: 46px;
  height: 46px;
  stroke: #f0bb5d;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ways-v26__number {
  position: absolute;
  left: 50%;
  bottom: -10px;
  transform: translateX(-50%) rotate(45deg);
  width: 34px;
  height: 34px;
  border-radius: 4px;
  background: #c48b2a;
  color: white;
  display: grid;
  place-items: center;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .06em;
  box-shadow: 0 12px 24px rgba(196,123,15,.18);
}

.ways-v26__number::before {
  content: attr(class);
}

.ways-v26__number { font-family: inherit; }
.ways-v26__number { line-height: 1; }
.ways-v26__number { padding-left: 1px; }
.ways-v26__number { transform: translateX(-50%) rotate(45deg); }
.ways-v26__number { }
.ways-v26__number { }
.ways-v26__number > * { transform: rotate(-45deg); }

/* rotate text via pseudo wrap not available; use inner text rotation */
.ways-v26__number {
  display: flex;
  align-items: center;
  justify-content: center;
}
.ways-v26__number {
  writing-mode: horizontal-tb;
}
.ways-v26__number {
  color: transparent;
}
.ways-v26__number::after {
  content: attr(data-num);
  color: #fff;
  transform: rotate(-45deg);
}

/* Set data numbers through nth-child */
.ways-v26__item:nth-child(1) .ways-v26__number::after { content: "01"; }
.ways-v26__item:nth-child(2) .ways-v26__number::after { content: "02"; }
.ways-v26__item:nth-child(3) .ways-v26__number::after { content: "03"; }

.ways-v26__item h3 {
  margin: 18px auto 12px;
  max-width: 280px;
  color: var(--midnight);
  font-family: 'Instrument Serif', Georgia, 'Times New Roman', serif;
  font-size: clamp(2rem, 2.8vw, 3rem);
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.03;
}

.ways-v26__mini-rule {
  display: block;
  width: 38px;
  height: 2px;
  border-radius: 999px;
  background: rgba(196,123,15,.72);
  margin: 0 auto 16px;
}

.ways-v26__item p {
  margin: 0 auto;
  max-width: 330px;
  color: rgba(47,55,68,.80);
  font-size: 1rem;
  line-height: 1.68;
}

@media (max-width: 1024px) {
  .ways-v26__track {
    left: 10%;
    right: 10%;
    top: 286px;
  }
  .ways-v26__grid {
    gap: 28px;
  }
}

@media (max-width: 900px) {
  .ways-v26__track { display:none; }
  .ways-v26__grid { grid-template-columns: 1fr; gap: 36px; }
  .ways-v26__item { padding: 0; }
  .ways-v26__item:not(:last-child)::after { display:none; }
  .ways-v26__item {
    background: rgba(255,255,255,.42);
    border: 1px solid rgba(47,55,68,.10);
    border-radius: 24px;
    padding: 28px 22px 26px;
  }
  .ways-v26__icon-wrap { margin-bottom: 18px; }
}



/* v27: header, hero, and Ways section refinements */

/* Keep the brand pinned left and navigation pinned right on wide screens */
.site-header .container.nav {
  width: calc(100% - 96px);
  max-width: none;
  margin-left: auto;
  margin-right: auto;
}

.site-header .brand {
  flex: 0 0 auto;
}

.site-header .nav-links {
  margin-left: auto;
  justify-content: flex-end;
}

/* Enforce the requested 4-line hero structure on desktop */
.hero-copy-v22 h1 > span {
  display: block;
  white-space: nowrap;
}

.hero-copy-v22 h1 {
  max-width: 980px;
}

@media (max-width: 860px) {
  .hero-copy-v22 h1 > span {
    white-space: normal;
  }
}

/* Why Leaders Bring Me In: do not emphasize the headcount headline in yellow */
.ownership-title span {
  color: var(--midnight) !important;
}

/* Ways to Work Together: remove numbering and tighten alignment */
.ways-v26__track {
  display: none;
}

.ways-v26__number {
  display: none !important;
}

.ways-v26__icon-wrap {
  width: 112px;
  min-height: 112px;
  margin-bottom: 22px;
}

.ways-v26__icon {
  width: 92px;
  height: 92px;
}

.ways-v26__item {
  display: grid;
  grid-template-rows: 112px 78px 18px auto;
  align-items: start;
}

.ways-v26__item h3 {
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 78px;
}

.ways-v26__mini-rule {
  align-self: start;
  margin-top: 0;
  margin-bottom: 18px;
}

.ways-v26__item p {
  align-self: start;
}

/* Keep the new first icon visually clean */
.ways-v26__item:first-child .ways-v26__icon svg {
  width: 48px;
  height: 48px;
}

@media (max-width: 900px) {
  .site-header .container.nav {
    width: min(var(--max), calc(100% - 48px));
  }

  .ways-v26__item {
    grid-template-rows: auto;
  }

  .ways-v26__item h3 {
    min-height: auto;
  }
}



/* v28: Ways title/description spacing + hero button spacing */

/* More breathing room between homepage hero buttons */
.hero-copy-v22 .hero__actions {
  gap: 26px;
}

/* Keep Ways icons and titles in place, but move the divider line and body copy down */
.ways-v26__item {
  grid-template-rows: 112px 94px 26px auto;
}

.ways-v26__item h3 {
  min-height: 94px;
  padding-bottom: 8px;
}

.ways-v26__mini-rule {
  margin-top: 10px;
  margin-bottom: 24px;
}

.ways-v26__item p {
  padding-top: 4px;
}

@media (max-width: 900px) {
  .ways-v26__item {
    grid-template-rows: auto;
  }

  .ways-v26__item h3 {
    min-height: auto;
    padding-bottom: 0;
  }

  .ways-v26__mini-rule {
    margin-top: 14px;
    margin-bottom: 18px;
  }
}



/* v29: Hard reset Ways to Work Together item spacing to prevent overlap */

/* Remove the rigid row layout that caused the line/paragraph to overlap titles */
.ways-v26__item {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  text-align: center;
  min-height: 0;
  padding: 0 14px;
}

/* Keep icon placement stable */
.ways-v26__icon-wrap {
  width: 112px;
  min-height: 112px;
  height: 112px;
  margin: 0 auto 24px;
  flex: 0 0 112px;
}

/* Give every title area enough height for 1–2 lines */
.ways-v26__item h3 {
  display: flex !important;
  align-items: center;
  justify-content: center;
  min-height: 92px !important;
  height: 92px;
  margin: 0 auto 18px !important;
  padding: 0 !important;
  max-width: 330px;
  flex: 0 0 92px;
}

/* Divider must sit below the complete heading */
.ways-v26__mini-rule {
  display: block;
  width: 38px;
  height: 2px;
  flex: 0 0 2px;
  margin: 0 auto 26px !important;
  position: static !important;
}

/* Descriptions start below the divider, aligned across all three columns */
.ways-v26__item p {
  margin: 0 auto !important;
  padding: 0 !important;
  max-width: 350px;
  flex: 0 0 auto;
}

/* Keep vertical dividers from intruding into text area */
.ways-v26__item:not(:last-child)::after {
  top: 124px;
  height: 300px;
}

@media (max-width: 900px) {
  .ways-v26__item {
    padding: 28px 22px 26px;
  }

  .ways-v26__icon-wrap {
    height: auto;
    min-height: 0;
    flex: 0 0 auto;
  }

  .ways-v26__item h3 {
    height: auto;
    min-height: 0 !important;
    flex: 0 0 auto;
    margin-bottom: 16px !important;
  }

  .ways-v26__mini-rule {
    margin-bottom: 18px !important;
  }
}



/* v30: Mobile-only compaction for homepage density.
   Desktop remains unchanged. */

@media (max-width: 760px) {
  /* Reduce vertical scroll across long homepage sections */
  .section {
    padding-top: 58px;
    padding-bottom: 58px;
  }

  /* Why Leaders Bring Me In: compact list-style treatment on mobile */
  .ownership-section {
    padding-top: 58px;
    padding-bottom: 58px;
  }

  .ownership-grid {
    gap: 28px;
  }

  .ownership-lead {
    margin-bottom: 0;
  }

  .ownership-cards {
    gap: 12px;
  }

  .ownership-card {
    display: grid;
    grid-template-columns: 34px 1fr;
    gap: 14px;
    padding: 18px 18px;
    border-radius: 16px;
  }

  .ownership-card-icon {
    width: 34px;
    height: 34px;
    border-radius: 11px;
  }

  .ownership-card-icon svg {
    width: 17px;
    height: 17px;
  }

  .ownership-card h3 {
    font-size: 1.06rem;
    line-height: 1.22;
    margin-bottom: 4px;
  }

  .ownership-card p {
    font-size: 0.92rem;
    line-height: 1.48;
    margin: 0;
  }

  .ownership-button {
    margin-top: 8px;
  }

  /* Ways to Work Together: compact mobile list while preserving full desktop design */
  .ways-section-v26 {
    padding-top: 58px;
    padding-bottom: 58px;
  }

  .ways-v26__intro {
    margin-bottom: 28px;
  }

  .ways-v26__intro .section-title {
    margin-bottom: 14px;
  }

  .ways-v26__intro .section-lead {
    font-size: 0.98rem;
    line-height: 1.55;
  }

  .ways-v26__grid {
    gap: 12px;
  }

  .ways-v26__item {
    display: grid !important;
    grid-template-columns: 1fr;
    align-items: start;
    text-align: left;
    padding: 18px 18px 18px;
    border-radius: 16px;
    background: rgba(255,255,255,.42);
    border: 1px solid rgba(47,55,68,.10);
  }

  /* Hide decorative icons on mobile to reduce scroll without changing desktop */
  .ways-v26__icon-wrap {
    display: none;
  }

  .ways-v26__item h3 {
    display: block !important;
    height: auto;
    min-height: 0 !important;
    flex: none;
    max-width: none;
    margin: 0 0 8px !important;
    padding: 0 !important;
    text-align: left;
    font-size: 1.55rem;
    line-height: 1.06;
  }

  .ways-v26__mini-rule {
    display: none;
  }

  .ways-v26__item p {
    max-width: none;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left;
    font-size: 0.93rem;
    line-height: 1.5;
  }

  /* Contact section: slightly tighter on mobile */
  .contact-section,
  .contact-v17 {
    padding-top: 58px;
    padding-bottom: 58px;
  }
}

@media (max-width: 480px) {
  .section {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .ownership-section,
  .ways-section-v26,
  .contact-section,
  .contact-v17 {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .ownership-card,
  .ways-v26__item {
    padding: 16px;
  }

  .ownership-card p,
  .ways-v26__item p {
    font-size: 0.9rem;
  }
}



/* v31: stronger mobile-only homepage shortening.
   Desktop remains unchanged. */

@media (max-width: 760px) {
  /* Overall mobile page rhythm */
  .hero-v22 {
    padding-top: 34px;
    padding-bottom: 46px;
  }

  .hero-copy-v22 h1 {
    font-size: clamp(3.05rem, 15vw, 4.45rem);
    line-height: 0.92;
    margin-bottom: 18px;
  }

  .hero-copy-v22 .hero__lead {
    font-size: 1rem;
    line-height: 1.55;
    margin-bottom: 22px;
  }

  .hero-copy-v22 .hero__actions {
    gap: 14px;
  }

  .hero-copy-v22 .btn {
    width: 100%;
    justify-content: center;
  }

  /* Hide the decorative hero graphic on mobile to reduce scroll and visual density */
  .hero-background-graphic {
    display: none;
  }

  .hero__grid {
    grid-template-columns: 1fr;
  }

  /* Compress service overview sections on mobile */
  .service-overview-section,
  .home-services-section,
  .ops-overview-section,
  .capabilities-section {
    padding-top: 46px;
    padding-bottom: 46px;
  }

  .service-card,
  .service-card-v22,
  .ops-card,
  .capability-card,
  .homepage-service-card {
    padding: 18px !important;
    border-radius: 16px;
  }

  .service-card p,
  .service-card-v22 p,
  .ops-card p,
  .capability-card p,
  .homepage-service-card p {
    font-size: 0.92rem;
    line-height: 1.45;
  }

  /* Turn icon-heavy homepage service groups into tighter rows where applicable */
  .services-grid,
  .service-grid,
  .ops-grid,
  .capabilities-grid,
  .homepage-services-grid {
    gap: 12px !important;
  }

  /* About Katie: keep credibility, reduce visual footprint */
  .about-katie-section {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .about-katie-card {
    gap: 24px;
    padding: 24px 20px;
    border-radius: 22px;
  }

  .about-katie-copy .section-title {
    font-size: clamp(2.15rem, 10vw, 3rem);
    line-height: 0.98;
    margin-bottom: 14px;
  }

  .about-katie-copy .section-lead {
    font-size: 0.98rem;
    line-height: 1.55;
    margin-bottom: 16px;
  }

  .about-katie-list {
    gap: 8px;
    margin-top: 14px;
  }

  .about-katie-list li {
    font-size: 0.92rem;
    line-height: 1.38;
    padding-left: 22px;
  }

  /* Hide photo placeholder on mobile only until a real photo is used */
  .about-photo-placeholder {
    display: none;
  }

  /* Why Leaders Bring Me In: make it a concise mobile scan section */
  .ownership-section {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .ownership-grid {
    gap: 22px;
  }

  .ownership-title {
    font-size: clamp(2.25rem, 11vw, 3.1rem);
    line-height: 0.98;
    margin-bottom: 12px;
  }

  .ownership-lead {
    font-size: 0.96rem;
    line-height: 1.5;
  }

  .ownership-cards {
    gap: 10px;
  }

  .ownership-card {
    display: block;
    padding: 16px 16px;
    border-radius: 15px;
  }

  .ownership-card-icon {
    display: none;
  }

  .ownership-card h3 {
    font-size: 1rem;
    line-height: 1.22;
    margin: 0;
  }

  /* Hide explanatory card paragraphs on mobile to reduce scroll */
  .ownership-card p {
    display: none;
  }

  .ownership-button {
    width: 100%;
    justify-content: center;
    margin-top: 4px;
  }

  /* Ways to Work Together: simple mobile list */
  .ways-section-v26 {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .ways-v26__intro {
    margin-bottom: 20px;
  }

  .ways-v26__intro .section-title {
    font-size: clamp(2.15rem, 10vw, 3rem);
    line-height: 0.98;
    margin-bottom: 12px;
  }

  /* Hide the intro paragraph on mobile; the three rows explain enough */
  .ways-v26__intro .section-lead {
    display: none;
  }

  .ways-v26__grid {
    gap: 10px;
  }

  .ways-v26__item {
    padding: 16px 16px;
    border-radius: 15px;
  }

  .ways-v26__item h3 {
    font-size: 1.28rem;
    line-height: 1.1;
    margin-bottom: 6px !important;
  }

  .ways-v26__item p {
    font-size: 0.9rem;
    line-height: 1.42;
  }

  /* Contact: reduce mobile height while keeping conversion clear */
  .contact-section,
  .contact-v17,
  .contact-v18,
  .contact-v19 {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .contact-card,
  .contact-panel,
  .contact-form-card {
    padding: 22px 18px !important;
    border-radius: 18px;
  }
}

@media (max-width: 480px) {
  .hero-v22 {
    padding-top: 28px;
    padding-bottom: 40px;
  }

  .hero-copy-v22 h1 {
    font-size: clamp(2.85rem, 15vw, 4rem);
  }

  .hero-copy-v22 .hero__lead {
    font-size: 0.96rem;
  }

  .section,
  .about-katie-section,
  .ownership-section,
  .ways-section-v26,
  .contact-section,
  .contact-v17,
  .contact-v18,
  .contact-v19 {
    padding-top: 44px;
    padding-bottom: 44px;
  }

  .about-katie-card {
    padding: 22px 18px;
  }
}



/* v32: Mobile-only editorial simplification.
   Desktop remains unchanged.
   Reduces repetitive stacked-card feeling on mobile. */

@media (max-width: 760px) {
  /* Use typography, dividers, and spacing instead of repeated boxed cards */
  .services-grid,
  .service-grid,
  .ops-grid,
  .capabilities-grid,
  .homepage-services-grid {
    gap: 0 !important;
  }

  .service-card,
  .service-card-v22,
  .ops-card,
  .capability-card,
  .homepage-service-card {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 20px 0 !important;
    border-bottom: 1px solid rgba(47, 55, 68, 0.16) !important;
  }

  .service-card:first-child,
  .service-card-v22:first-child,
  .ops-card:first-child,
  .capability-card:first-child,
  .homepage-service-card:first-child {
    border-top: 1px solid rgba(47, 55, 68, 0.16) !important;
  }

  .service-card h3,
  .service-card-v22 h3,
  .ops-card h3,
  .capability-card h3,
  .homepage-service-card h3 {
    margin-bottom: 6px !important;
  }

  .service-card p,
  .service-card-v22 p,
  .ops-card p,
  .capability-card p,
  .homepage-service-card p {
    max-width: none;
  }

  /* Hide decorative service icons on mobile where present */
  .service-card svg,
  .service-card-v22 svg,
  .ops-card svg,
  .capability-card svg,
  .homepage-service-card svg,
  .service-card-icon,
  .ops-card-icon,
  .capability-card-icon,
  .homepage-service-icon {
    display: none !important;
  }

  /* About Katie: reduce the "boxed" feel while keeping credibility prominent */
  .about-katie-card {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
  }

  .about-katie-list {
    border-top: 1px solid rgba(47, 55, 68, 0.16);
    border-bottom: 1px solid rgba(47, 55, 68, 0.16);
    padding: 12px 0;
  }

  .about-katie-list li {
    border-bottom: 1px solid rgba(47, 55, 68, 0.10);
    padding-top: 8px;
    padding-bottom: 8px;
  }

  .about-katie-list li:last-child {
    border-bottom: 0;
  }

  /* Why Leaders Bring Me In: simple proof list, no cards */
  .ownership-cards {
    gap: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.18);
    border-bottom: 1px solid rgba(255, 255, 255, 0.18);
  }

  .ownership-card {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 16px 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.14) !important;
  }

  .ownership-card:last-child {
    border-bottom: 0 !important;
  }

  .ownership-card h3 {
    color: #fffdf8;
    font-size: 1.04rem;
    letter-spacing: -0.01em;
    position: relative;
    padding-left: 18px;
  }

  .ownership-card h3::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.55em;
    width: 6px;
    height: 6px;
    border-radius: 999px;
    background: #f0bb5d;
  }

  /* Ways to Work Together: simple editorial rows, no boxes */
  .ways-v26__grid {
    gap: 0;
    border-top: 1px solid rgba(47, 55, 68, 0.16);
    border-bottom: 1px solid rgba(47, 55, 68, 0.16);
  }

  .ways-v26__item {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 18px 0 !important;
    border-bottom: 1px solid rgba(47, 55, 68, 0.14) !important;
  }

  .ways-v26__item:last-child {
    border-bottom: 0 !important;
  }

  .ways-v26__item h3 {
    font-size: 1.34rem;
    margin-bottom: 6px !important;
  }

  .ways-v26__item p {
    color: rgba(47, 55, 68, 0.76);
  }

  /* Keep the contact area as the primary card/conversion block */
  .contact-card,
  .contact-panel,
  .contact-form-card {
    background: inherit;
  }
}

@media (max-width: 480px) {
  .service-card,
  .service-card-v22,
  .ops-card,
  .capability-card,
  .homepage-service-card {
    padding: 18px 0 !important;
  }

  .ownership-card {
    padding: 14px 0 !important;
  }

  .ways-v26__item {
    padding: 16px 0 !important;
  }
}



/* v33: requested mobile refinements + Sales Operations desktop number removal */

/* Desktop update explicitly requested: remove Sales Operations numbers */
.sales-step-number {
  display: none !important;
}

.sales-pathway-item {
  grid-template-columns: 1fr !important;
}

/* Contact note moved in HTML, but keep desktop visual order unchanged */
.contact-copy {
  order: 1;
}

.contact-card {
  order: 2;
}

.contact-direct-note.homepage-direct-note-v22 {
  order: 1;
  grid-column: 1;
  grid-row: 1;
  align-self: end;
  margin-top: 330px;
}

/* About Katie bullet fix applies both desktop and mobile because the overlap exists in both */
.about-katie-list li {
  padding-left: 48px;
}

.about-katie-list li::before {
  left: 0;
  top: 12px;
  z-index: 0;
}

.about-katie-section .about-katie-list li {
  padding-left: 18px;
}

.about-katie-section .about-katie-list li::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  left: 0;
  top: 22px;
  border: 0;
  border-radius: 999px;
  background: #b47a2c;
}

/* Mobile-only refinements */
@media (max-width: 760px) {
  /* Shorter mobile-only hero headline. Desktop h1 remains unchanged. */
  .hero-copy-v22 h1 {
    font-size: clamp(2.55rem, 11.5vw, 3.5rem);
    line-height: 0.96;
    max-width: 10.5em;
  }

  .hero-copy-v22 h1 > span {
    display: none;
  }

  .hero-copy-v22 h1::before {
    content: attr(data-mobile-title);
    display: block;
  }

  /* Operating Approach: mirror the right-side line on the left */
  .pillars__grid {
    border-left: 1px solid rgba(47, 55, 68, 0.16);
  }

  .pillar {
    padding-left: 18px;
    padding-right: 18px;
  }

  /* About Katie: restore placeholder image on mobile below the title */
  .about-katie-card {
    display: flex !important;
    flex-direction: column;
  }

  .about-katie-copy {
    display: flex;
    flex-direction: column;
  }

  .about-photo-placeholder {
    display: grid !important;
    order: 3;
    margin: 8px 0 18px;
  }

  .about-katie-copy .eyebrow {
    order: 1;
  }

  .about-katie-copy .section-title {
    order: 2;
  }

  .about-katie-copy .section-lead {
    order: 4;
  }

  .about-katie-list {
    order: 5;
  }

  .about-katie-button {
    order: 6;
  }

  .about-photo-frame {
    width: min(100%, 260px);
    aspect-ratio: 4 / 4.6;
    margin: 0 auto;
  }

  .about-photo-frame p {
    bottom: 28px;
  }

  .about-katie-list li {
    padding-left: 18px;
  }

  .about-katie-list li::before {
    left: 0;
    top: 22px;
    width: 6px;
    height: 6px;
  }

  /* Why Leaders Bring Me In: black bullets, not white on tan */
  .ownership-card h3 {
    color: var(--midnight) !important;
  }

  .ownership-card h3::before {
    background: var(--midnight) !important;
  }

  /* Contact: note sits below the form on mobile */
  .contact-grid {
    display: flex !important;
    flex-direction: column;
  }

  .contact-copy {
    order: 1;
  }

  .contact-card {
    order: 2;
  }

  .contact-direct-note.homepage-direct-note-v22 {
    order: 3;
    width: 100%;
    grid-column: auto;
    grid-row: auto;
    align-self: stretch;
    margin-top: 18px !important;
  }
}

@media (max-width: 480px) {
  .hero-copy-v22 h1 {
    font-size: clamp(2.35rem, 11.8vw, 3.15rem);
    max-width: 10.2em;
  }

  .about-photo-frame {
    width: min(100%, 230px);
  }
}



/* v34: Restore desktop contact alignment.
   Contact copy + direct note left, form right. */

@media (min-width: 761px) {
  .contact-redesign .contact-grid,
  .contact-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 0.78fr) minmax(520px, 1.08fr) !important;
    gap: 78px !important;
    align-items: center !important;
  }

  .contact-copy {
    order: initial !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    text-align: left !important;
  }

  .contact-copy .eyebrow,
  .contact-copy .section-title,
  .contact-copy .section-lead {
    text-align: left !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .contact-card {
    order: initial !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
  }

  .contact-direct-note.homepage-direct-note-v22 {
    order: initial !important;
    grid-column: auto !important;
    grid-row: auto !important;
    align-self: auto !important;
    margin-top: 50px !important;
    text-align: left !important;
  }
}

/* Mobile: keep natural vertical flow after restoring the desktop structure */
@media (max-width: 760px) {
  .contact-grid {
    display: flex !important;
    flex-direction: column;
  }

  .contact-copy {
    order: 1 !important;
    text-align: left !important;
  }

  .contact-card {
    order: 2 !important;
  }

  .contact-direct-note.homepage-direct-note-v22 {
    order: initial !important;
    width: 100%;
    grid-column: auto !important;
    grid-row: auto !important;
    align-self: stretch;
    margin-top: 22px !important;
    text-align: left !important;
  }
}


/* v36: use static marketing hero image */
.marketing-hero-v22 .marketing-hero-eyebrow::after {
  margin-bottom: 14px;
}

.marketing-hero-v22 h1 {
  margin-top: 0;
}

.marketing-hero-v22 .marketing-hero-split__right {
  padding: 72px max(40px, calc((100vw - var(--max)) / 2)) 64px 8vw;
  background:
    radial-gradient(circle at 54% 42%, rgba(255,255,255,0.68), transparent 30%),
    linear-gradient(135deg, #f8ebd9 0%, #f2dfc9 100%);
  display: flex;
  align-items: center;
  justify-content: center;
}

.marketing-hero-image-wrap {
  width: min(860px, 100%);
  margin: 0 auto;
}

.marketing-hero-image {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}

@media (max-width: 980px) {
  .marketing-hero-v22 .marketing-hero-split__right {
    padding: 30px 22px 34px;
  }

  .marketing-hero-image-wrap {
    width: min(760px, 100%);
  }
}



/* v37: Marketing Operations AI section */
.marketing-ai-section {
  background:
    radial-gradient(circle at 76% 22%, rgba(255,255,255,.46), transparent 30%),
    linear-gradient(180deg, #f8ecdc 0%, #f4e6d3 100%);
  color: var(--midnight);
  border-top: 1px solid rgba(47,55,68,.10);
  border-bottom: 1px solid rgba(47,55,68,.10);
}

.marketing-ai-container {
  max-width: 1320px;
}

.marketing-ai-intro {
  max-width: 1180px;
}

.marketing-ai-eyebrow {
  color: #b47a2c;
  letter-spacing: .20em;
}

.marketing-ai-eyebrow::after {
  content: "";
  display: block;
  width: 72px;
  height: 2px;
  margin-top: 18px;
  background: #b47a2c;
}

.marketing-ai-intro .section-title {
  max-width: 1180px;
  margin-top: 28px;
  color: var(--midnight);
  font-size: clamp(3.25rem, 6vw, 6.2rem);
  line-height: .96;
  letter-spacing: -0.02em;
}

.marketing-ai-intro .section-lead {
  max-width: 1080px;
  margin-top: 28px;
  color: rgba(13,22,34,.82);
  font-size: 1.12rem;
  line-height: 1.65;
}

.marketing-ai-grid {
  margin-top: 58px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
}

.marketing-ai-card {
  position: relative;
  text-align: center;
  padding: 0 54px 12px;
}

.marketing-ai-card:not(:last-child) {
  border-right: 1px solid rgba(180,122,44,.28);
}

.marketing-ai-icon {
  width: 116px;
  height: 116px;
  margin: 0 auto 24px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: var(--midnight);
  background:
    radial-gradient(circle at 42% 34%, rgba(255,255,255,.40), transparent 42%),
    rgba(180,122,44,.10);
}

.marketing-ai-icon svg {
  width: 64px;
  height: 64px;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.marketing-ai-card h3 {
  margin: 0;
  color: var(--midnight);
  font-size: .98rem;
  line-height: 1.22;
  font-weight: 800;
  letter-spacing: .10em;
  text-transform: uppercase;
}

.marketing-ai-rule {
  display: block;
  width: 44px;
  height: 2px;
  margin: 18px auto 18px;
  background: #b47a2c;
}

.marketing-ai-card p {
  margin: 0 auto;
  max-width: 360px;
  color: rgba(13,22,34,.78);
  font-size: 1.03rem;
  line-height: 1.58;
}

.marketing-ai-note {
  margin-top: 50px;
  padding-top: 30px;
  border-top: 1px solid rgba(180,122,44,.24);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  color: rgba(13,22,34,.86);
}

.marketing-ai-note-icon {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  border: 1px solid rgba(180,122,44,.42);
  color: #b47a2c;
  font-weight: 800;
  letter-spacing: .04em;
  background: rgba(255,255,255,.22);
}

.marketing-ai-note p {
  margin: 0;
  max-width: 760px;
  font-size: 1.03rem;
  line-height: 1.45;
}

.marketing-ai-note strong {
  color: #b47a2c;
}

@media (max-width: 980px) {
  .marketing-ai-intro {
    max-width: 100%;
  }

  .marketing-ai-grid {
    grid-template-columns: 1fr;
    margin-top: 38px;
    border-top: 1px solid rgba(180,122,44,.24);
  }

  .marketing-ai-card {
    padding: 24px 0;
    display: grid;
    grid-template-columns: 64px 1fr;
    column-gap: 18px;
    text-align: left;
    align-items: start;
    border-right: 0 !important;
    border-bottom: 1px solid rgba(180,122,44,.20);
  }

  .marketing-ai-icon {
    width: 64px;
    height: 64px;
    margin: 0;
    grid-row: span 3;
  }

  .marketing-ai-icon svg {
    width: 38px;
    height: 38px;
  }

  .marketing-ai-card h3 {
    margin-top: 2px;
  }

  .marketing-ai-rule {
    margin: 10px 0 10px;
  }

  .marketing-ai-card p {
    max-width: none;
    margin: 0;
  }

  .marketing-ai-note {
    justify-content: flex-start;
    align-items: flex-start;
    gap: 16px;
  }
}

@media (max-width: 560px) {
  .marketing-ai-intro .section-title {
    font-size: clamp(2.75rem, 13vw, 4.2rem);
  }

  .marketing-ai-intro .section-lead,
  .marketing-ai-card p,
  .marketing-ai-note p {
    font-size: .96rem;
  }

  .marketing-ai-card {
    grid-template-columns: 1fr;
  }

  .marketing-ai-icon {
    margin-bottom: 14px;
  }
}


/* v39: marketing funnel image background matched to hero background */
.marketing-hero-v22 .marketing-hero-split__right {
  background:
    radial-gradient(circle at 54% 42%, rgba(255,255,255,0.68), transparent 30%),
    linear-gradient(135deg, #f8ebd9 0%, #f2dfc9 100%);
}



/* v40: Marketing Operations mobile-only page simplification.
   Desktop remains unchanged. */

@media (max-width: 760px) {
  /* Marketing hero: reduce height, image dominance, and stacked visual weight */
  .marketing-hero-split.marketing-hero-v22 {
    display: block;
    min-height: auto;
  }

  .marketing-hero-v22 .marketing-hero-split__left {
    margin-right: 0;
    border-radius: 0 0 34px 34px;
    border-right: 0;
    border-bottom: 2px solid rgba(196, 123, 15, 0.62);
  }

  .marketing-hero-v22 .marketing-hero-split__content {
    width: min(100% - 44px, 620px);
    margin: 0 auto;
    padding: 54px 0 42px;
  }

  .marketing-hero-v22 .marketing-hero-eyebrow {
    font-size: 0.9rem;
    letter-spacing: 0.18em;
    margin-bottom: 24px;
  }

  .marketing-hero-v22 .marketing-hero-eyebrow::after {
    width: 72px;
    margin-top: 14px;
    margin-bottom: 20px;
  }

  .marketing-hero-v22 h1 {
    font-size: clamp(3rem, 14vw, 4.5rem);
    line-height: 0.96;
    max-width: 100%;
  }

  .marketing-hero-v22 .marketing-hero-split__content > p {
    margin-top: 22px;
    font-size: 0.98rem;
    line-height: 1.55;
    max-width: 100%;
  }

  .marketing-hero-btn {
    width: 100%;
    justify-content: center;
    margin-top: 26px;
  }

  .marketing-hero-v22 .marketing-hero-split__right {
    padding: 20px 16px 26px;
    background:
      radial-gradient(circle at 54% 42%, rgba(255,255,255,0.58), transparent 30%),
      linear-gradient(135deg, #f8ebd9 0%, #f2dfc9 100%);
  }

  .marketing-hero-image-wrap {
    width: min(100%, 560px);
  }

  .marketing-hero-image {
    max-height: 430px;
    object-fit: contain;
    margin: 0 auto;
  }

  /* Statement section: keep it, but make it a compact transition */
  .marketing-page-statement {
    padding: 22px 22px;
  }

  .marketing-page-statement p {
    font-size: clamp(1.35rem, 6.6vw, 1.85rem);
    line-height: 1.18;
  }

  /* Five support areas: convert card grid into editorial rows */
  .marketing-buckets-section {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .marketing-buckets-intro {
    text-align: left;
  }

  .marketing-buckets-intro .section-title,
  .marketing-buckets-intro .section-lead {
    text-align: left;
    margin-left: 0;
    margin-right: 0;
  }

  .marketing-buckets-intro .section-title {
    font-size: clamp(2.45rem, 11vw, 3.55rem);
    line-height: 0.98;
  }

  .marketing-buckets-intro .section-lead {
    font-size: 0.96rem;
    line-height: 1.52;
  }

  .marketing-bucket-grid {
    display: block;
    margin-top: 30px;
    border-top: 1px solid rgba(47, 55, 68, 0.16);
  }

  .marketing-bucket-card {
    display: grid;
    grid-template-columns: 44px 1fr;
    column-gap: 14px;
    padding: 18px 0 !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(47, 55, 68, 0.14) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .marketing-bucket-card .bucket-icon-wrap,
  .marketing-bucket-card .bucket-icon {
    display: none !important;
  }

  .marketing-bucket-card .bucket-number {
    display: grid !important;
    grid-column: 1;
    grid-row: 1 / span 3;
    width: 34px;
    height: 34px;
    min-width: 34px;
    margin: 1px 0 0;
    border-radius: 999px;
    background: rgba(196, 123, 15, 0.12);
    color: var(--precision);
    border: 1px solid rgba(196, 123, 15, 0.28);
    font-size: 0.78rem;
    font-weight: 800;
  }

  .marketing-bucket-card h3 {
    grid-column: 2;
    margin: 0;
    font-size: 1.08rem;
    line-height: 1.22;
  }

  .marketing-bucket-card p {
    grid-column: 2;
    margin: 6px 0 0;
    font-size: 0.92rem;
    line-height: 1.45;
  }

  /* Hide detailed desktop bullet lists on mobile to reduce long scroll */
  .marketing-bucket-card ul {
    display: none;
  }

  /* Implementation Layer: compact editorial rows */
  .marketing-implementation-section {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .marketing-implementation-section .section-title {
    font-size: clamp(2.45rem, 11vw, 3.55rem);
    line-height: 0.98;
  }

  .implementation-grid,
  .implementation-card-grid,
  .marketing-implementation-grid,
  .implementation-layer-grid {
    display: block !important;
    margin-top: 28px;
    border-top: 1px solid rgba(255, 255, 255, 0.16);
  }

  .implementation-card,
  .implementation-item,
  .marketing-implementation-card,
  .implementation-layer-card {
    display: grid !important;
    grid-template-columns: 42px 1fr;
    column-gap: 14px;
    padding: 17px 0 !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .implementation-card h3,
  .implementation-item h3,
  .marketing-implementation-card h3,
  .implementation-layer-card h3 {
    margin: 0 0 5px !important;
    font-size: 1.02rem;
    line-height: 1.22;
  }

  .implementation-card p,
  .implementation-item p,
  .marketing-implementation-card p,
  .implementation-layer-card p {
    margin: 0 !important;
    font-size: 0.92rem;
    line-height: 1.45;
  }

  /* AI & Marketing Operations: compact list treatment on mobile */
  .marketing-ai-section {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .marketing-ai-intro,
  .marketing-ai-intro .section-title,
  .marketing-ai-intro .section-lead {
    max-width: 100%;
  }

  .marketing-ai-intro .section-title {
    font-size: clamp(2.55rem, 12vw, 3.85rem);
    line-height: 0.98;
  }

  .marketing-ai-intro .section-lead {
    font-size: 0.96rem;
    line-height: 1.52;
  }

  .marketing-ai-grid {
    display: block;
    margin-top: 30px;
    border-top: 1px solid rgba(180, 122, 44, 0.22);
  }

  .marketing-ai-card {
    display: grid;
    grid-template-columns: 42px 1fr;
    column-gap: 14px;
    text-align: left;
    padding: 17px 0 !important;
    border-right: 0 !important;
    border-bottom: 1px solid rgba(180, 122, 44, 0.18);
  }

  .marketing-ai-icon {
    width: 42px;
    height: 42px;
    margin: 0;
    grid-row: 1 / span 3;
    background: rgba(180, 122, 44, 0.10);
  }

  .marketing-ai-icon svg {
    width: 25px;
    height: 25px;
    stroke-width: 2;
  }

  .marketing-ai-card h3 {
    margin: 0;
    font-size: 0.88rem;
    line-height: 1.24;
  }

  .marketing-ai-rule {
    display: none;
  }

  .marketing-ai-card p {
    max-width: none;
    margin: 6px 0 0;
    font-size: 0.92rem;
    line-height: 1.45;
  }

  .marketing-ai-note {
    margin-top: 26px;
    padding-top: 20px;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 14px;
  }

  .marketing-ai-note-icon {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    border-radius: 12px;
  }

  .marketing-ai-note p {
    font-size: 0.92rem;
    line-height: 1.45;
  }

  /* Contact section: reduce height and keep form clear */
  .marketing-contact-section {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .marketing-contact-section .contact-grid {
    gap: 26px;
  }

  .marketing-contact-section .section-title {
    font-size: clamp(2.45rem, 11vw, 3.55rem);
    line-height: 0.98;
  }

  .marketing-contact-section .section-lead {
    font-size: 0.96rem;
    line-height: 1.52;
  }

  .marketing-contact-section .contact-card {
    padding: 22px 18px !important;
    border-radius: 18px;
  }

  .marketing-contact-section .form-row {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .marketing-contact-section .contact-direct-note {
    margin-top: 18px;
  }
}

@media (max-width: 480px) {
  .marketing-hero-v22 .marketing-hero-split__content,
  .marketing-hero-v22 .marketing-hero-split__right {
    width: 100%;
  }

  .marketing-hero-v22 h1 {
    font-size: clamp(2.8rem, 14vw, 3.75rem);
  }

  .marketing-hero-image {
    max-height: 365px;
  }

  .marketing-buckets-section,
  .marketing-implementation-section,
  .marketing-ai-section,
  .marketing-contact-section {
    padding-top: 44px;
    padding-bottom: 44px;
  }
}



/* v41: Marketing Operations mobile QA fixes.
   Desktop remains unchanged. */

@media (max-width: 760px) {
  /* Top Marketing Operations hero: add professional side buffer */
  .marketing-hero-v22 .marketing-hero-split__left {
    overflow: hidden;
  }

  .marketing-hero-v22 .marketing-hero-split__content {
    width: auto !important;
    max-width: none !important;
    margin-left: 24px !important;
    margin-right: 24px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Ensure all top hero text respects the side buffer */
  .marketing-hero-v22 .marketing-hero-eyebrow,
  .marketing-hero-v22 h1,
  .marketing-hero-v22 .marketing-hero-split__content > p,
  .marketing-hero-v22 .marketing-hero-btn {
    max-width: 100%;
  }

  /* Attribution statement: smaller icon and align beside the statement text */
  .attribution-callout,
  .marketing-attribution-callout,
  .marketing-page-callout {
    display: grid !important;
    grid-template-columns: 42px 1fr !important;
    gap: 14px !important;
    align-items: start !important;
  }

  .attribution-callout .bucket-icon,
  .attribution-callout .callout-icon,
  .marketing-attribution-callout .bucket-icon,
  .marketing-attribution-callout .callout-icon,
  .marketing-page-callout .bucket-icon,
  .marketing-page-callout .callout-icon {
    width: 42px !important;
    height: 42px !important;
    margin: 2px 0 0 !important;
  }

  .attribution-callout .bucket-icon svg,
  .attribution-callout .callout-icon svg,
  .marketing-attribution-callout .bucket-icon svg,
  .marketing-attribution-callout .callout-icon svg,
  .marketing-page-callout .bucket-icon svg,
  .marketing-page-callout .callout-icon svg {
    width: 24px !important;
    height: 24px !important;
  }

  /* If the attribution block uses a generic icon + copy layout */
  .attribution-callout > div:first-child,
  .marketing-attribution-callout > div:first-child,
  .marketing-page-callout > div:first-child {
    align-self: start;
  }

  /* Implementation Layer QA fix:
     v40 targeted broad/nonexistent implementation classes, so the existing numbered items
     kept their desktop styling on a dark background. This forces the actual implementation
     markup into readable mobile editorial rows. */
  .marketing-implementation-section {
    background: #071322;
    color: var(--white);
  }

  .marketing-implementation-section .eyebrow,
  .marketing-implementation-section .section-title,
  .marketing-implementation-section .section-lead {
    color: var(--white);
  }

  .marketing-implementation-section .section-lead {
    color: rgba(255, 255, 255, 0.76);
  }

  .implementation-list,
  .marketing-implementation-list,
  .implementation-steps,
  .marketing-implementation-steps {
    display: block !important;
    margin-top: 28px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.18);
  }

  /* Actual implementation items may use one of these class patterns depending on version */
  .implementation-list article,
  .marketing-implementation-list article,
  .implementation-steps article,
  .marketing-implementation-steps article,
  .implementation-row,
  .implementation-step,
  .marketing-implementation-row,
  .marketing-implementation-step {
    display: grid !important;
    grid-template-columns: 38px 1fr !important;
    column-gap: 14px !important;
    align-items: start !important;
    padding: 16px 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .implementation-list article > *,
  .marketing-implementation-list article > *,
  .implementation-steps article > *,
  .marketing-implementation-steps article > * {
    color: rgba(255, 255, 255, 0.86);
  }

  .implementation-number,
  .implementation-step-number,
  .marketing-implementation-number,
  .marketing-implementation-step-number,
  .implementation-list .bucket-number,
  .marketing-implementation-list .bucket-number,
  .implementation-steps .bucket-number,
  .marketing-implementation-steps .bucket-number {
    grid-column: 1 !important;
    grid-row: 1 / span 3 !important;
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    margin: 0 !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 999px !important;
    background: rgba(240, 187, 93, 0.12) !important;
    border: 1px solid rgba(240, 187, 93, 0.34) !important;
    color: #f0bb5d !important;
    font-size: 0.72rem !important;
    font-weight: 800 !important;
  }

  .implementation-list h3,
  .marketing-implementation-list h3,
  .implementation-steps h3,
  .marketing-implementation-steps h3,
  .implementation-row h3,
  .implementation-step h3,
  .marketing-implementation-row h3,
  .marketing-implementation-step h3 {
    grid-column: 2 !important;
    margin: 0 0 5px !important;
    color: var(--white) !important;
    font-size: 1.02rem !important;
    line-height: 1.22 !important;
  }

  .implementation-list p,
  .marketing-implementation-list p,
  .implementation-steps p,
  .marketing-implementation-steps p,
  .implementation-row p,
  .implementation-step p,
  .marketing-implementation-row p,
  .marketing-implementation-step p {
    grid-column: 2 !important;
    margin: 0 !important;
    color: rgba(255, 255, 255, 0.76) !important;
    font-size: 0.92rem !important;
    line-height: 1.45 !important;
  }
}

@media (max-width: 480px) {
  .marketing-hero-v22 .marketing-hero-split__content {
    margin-left: 20px !important;
    margin-right: 20px !important;
  }
}



/* v42: Marketing Operations mobile polish.
   Desktop remains unchanged. */

@media (max-width: 760px) {
  /* Attribution callout: icon directly inline to the left of the header;
     description starts flush left beneath icon/header row. */
  .attribution-callout {
    display: grid !important;
    grid-template-columns: 38px 1fr !important;
    column-gap: 12px !important;
    row-gap: 8px !important;
    align-items: center !important;
  }

  .attribution-callout .callout-icon,
  .attribution-callout .bucket-icon,
  .attribution-callout > div:first-child {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    margin: 0 !important;
    align-self: center !important;
  }

  .attribution-callout .callout-icon svg,
  .attribution-callout .bucket-icon svg,
  .attribution-callout > div:first-child svg {
    width: 22px !important;
    height: 22px !important;
  }

  .attribution-callout h2,
  .attribution-callout h3,
  .attribution-callout .section-title,
  .attribution-callout strong {
    grid-column: 2 !important;
    grid-row: 1 !important;
    margin: 0 !important;
    align-self: center !important;
  }

  .attribution-callout p,
  .attribution-callout .section-lead {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }

  /* If the attribution callout uses a simple two-div structure, flatten it predictably. */
  .attribution-callout > div:not(:first-child) {
    display: contents !important;
  }

  /* Implementation Layer: yellow label and readable mobile layout */
  .marketing-implementation-section .eyebrow {
    color: #f0bb5d !important;
  }

  .marketing-implementation-section .eyebrow::after {
    background: #f0bb5d !important;
  }

  /* The issue was inherited dark/blue card styling on dark background.
     Force all implementation content to high-contrast light text. */
  .marketing-implementation-section,
  .marketing-implementation-section * {
    color: rgba(255,255,255,0.82);
  }

  .marketing-implementation-section .section-title,
  .marketing-implementation-section h2,
  .marketing-implementation-section h3 {
    color: #fffdf8 !important;
  }

  .marketing-implementation-section p {
    color: rgba(255,255,255,0.76) !important;
  }

  /* Remove numbering on mobile. */
  .marketing-implementation-section .bucket-number,
  .marketing-implementation-section .implementation-number,
  .marketing-implementation-section .implementation-step-number,
  .marketing-implementation-section [class*="number"],
  .marketing-implementation-section [class*="Number"] {
    display: none !important;
  }

  /* Restore icons and make them visible if present. */
  .marketing-implementation-section .bucket-icon,
  .marketing-implementation-section .implementation-icon,
  .marketing-implementation-section [class*="icon"],
  .marketing-implementation-section [class*="Icon"] {
    display: grid !important;
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    margin: 0 !important;
    place-items: center !important;
    border-radius: 12px !important;
    background: rgba(240,187,93,0.12) !important;
    border: 1px solid rgba(240,187,93,0.28) !important;
    color: #f0bb5d !important;
  }

  .marketing-implementation-section .bucket-icon svg,
  .marketing-implementation-section .implementation-icon svg,
  .marketing-implementation-section [class*="icon"] svg,
  .marketing-implementation-section [class*="Icon"] svg {
    display: block !important;
    width: 20px !important;
    height: 20px !important;
    stroke: #f0bb5d !important;
  }

  /* Force implementation cards/items into clean icon + text rows. */
  .marketing-implementation-section .implementation-grid,
  .marketing-implementation-section .implementation-card-grid,
  .marketing-implementation-section .marketing-implementation-grid,
  .marketing-implementation-section .implementation-layer-grid,
  .marketing-implementation-section .implementation-list,
  .marketing-implementation-section .marketing-implementation-list,
  .marketing-implementation-section .implementation-steps,
  .marketing-implementation-section .marketing-implementation-steps {
    display: block !important;
    margin-top: 28px !important;
    border-top: 1px solid rgba(255,255,255,0.18) !important;
  }

  .marketing-implementation-section article,
  .marketing-implementation-section .implementation-card,
  .marketing-implementation-section .implementation-item,
  .marketing-implementation-section .marketing-implementation-card,
  .marketing-implementation-section .implementation-layer-card,
  .marketing-implementation-section .implementation-row,
  .marketing-implementation-section .implementation-step,
  .marketing-implementation-section .marketing-implementation-row,
  .marketing-implementation-section .marketing-implementation-step {
    display: grid !important;
    grid-template-columns: 36px 1fr !important;
    column-gap: 14px !important;
    align-items: start !important;
    padding: 16px 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,0.14) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .marketing-implementation-section article > h3,
  .marketing-implementation-section article > p,
  .marketing-implementation-section .implementation-card > h3,
  .marketing-implementation-section .implementation-card > p,
  .marketing-implementation-section .implementation-item > h3,
  .marketing-implementation-section .implementation-item > p,
  .marketing-implementation-section .marketing-implementation-card > h3,
  .marketing-implementation-section .marketing-implementation-card > p {
    grid-column: 2 !important;
  }

  .marketing-implementation-section article h3,
  .marketing-implementation-section .implementation-card h3,
  .marketing-implementation-section .implementation-item h3,
  .marketing-implementation-section .marketing-implementation-card h3 {
    margin: 0 0 5px !important;
    font-size: 1.04rem !important;
    line-height: 1.22 !important;
  }

  .marketing-implementation-section article p,
  .marketing-implementation-section .implementation-card p,
  .marketing-implementation-section .implementation-item p,
  .marketing-implementation-section .marketing-implementation-card p {
    margin: 0 !important;
    font-size: 0.92rem !important;
    line-height: 1.45 !important;
  }

  /* If no explicit icon exists in the implementation item, keep the row aligned without the number. */
  .marketing-implementation-section article > :first-child:not(.bucket-icon):not(.implementation-icon):not([class*="icon"]):not([class*="Icon"]) {
    grid-column: 2 !important;
  }
}



/* v43: Sales Operations page refresh */
.sales-hero-v43 {
  background:
    radial-gradient(circle at 78% 22%, rgba(196, 123, 15, 0.18), transparent 28%),
    linear-gradient(135deg, #071322 0%, #111f32 56%, #18263a 100%);
}

.sales-hero-v43 .page-hero__copy {
  max-width: 780px;
}

.sales-hero-eyebrow {
  color: #f0bb5d !important;
  letter-spacing: .20em;
}

.op-hero .marketing-hero-eyebrow,
.about-page-hero .eyebrow {
  color: #f0bb5d !important;
}

.about-page-hero .eyebrow::after {
  content: "";
  display: block;
  width: 72px;
  height: 2px;
  margin-top: 18px;
  margin-bottom: 24px;
  background: #f0bb5d;
}

.sales-hero-eyebrow::after {
  content: "";
  display: block;
  width: 72px;
  height: 2px;
  margin-top: 18px;
  margin-bottom: 24px;
  background: #f0bb5d;
}

.sales-hero-eyebrow + h1 > span {
  display: block;
}

.sales-hero-graphic-section {
  background:
    radial-gradient(circle at 74% 18%, rgba(196, 123, 15, 0.20), transparent 30%),
    radial-gradient(circle at 18% 82%, rgba(107, 128, 148, 0.18), transparent 32%),
    linear-gradient(135deg, var(--midnight-deep) 0%, var(--midnight) 56%, #252d3b 100%);
  color: var(--white);
  border-bottom: 1px solid rgba(255, 255, 255, 0.10);
}

.sales-hero-graphic-section::before {
  background-image: radial-gradient(rgba(215, 211, 206, 0.14) 1px, transparent 1px);
  background-size: 24px 24px;
  opacity: 0.72;
  mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.18) 35%, rgba(0,0,0,.70) 76%, transparent 100%);
}

.sales-hero-graphic-section::after {
  content: "";
  position: absolute;
  right: -140px;
  top: 96px;
  width: 460px;
  height: 460px;
  border: 1px solid rgba(196, 123, 15, 0.32);
  border-radius: 50%;
  pointer-events: none;
}

.sales-hero-graphic-section .container {
  position: relative;
  z-index: 1;
}

.sales-hero-graphic {
  position: absolute;
  top: -32px;
  right: max(-96px, calc((100vw - var(--max)) / 2 - 150px));
  width: clamp(480px, 42vw, 650px);
  min-width: 480px;
  aspect-ratio: 1 / 1;
  opacity: 0.74;
  overflow: visible;
  pointer-events: none;
  z-index: 0;
}

.sales-hero-graphic .hero-orbit--outer {
  inset: 0 !important;
  width: auto !important;
  height: auto !important;
  border-color: rgba(255, 255, 255, 0.13);
}

.sales-hero-graphic .hero-orbit--middle {
  inset: 14% !important;
  width: auto !important;
  height: auto !important;
  border-color: rgba(240, 187, 93, 0.40);
}

.sales-hero-graphic .hero-orbit--inner {
  inset: 28% !important;
  width: auto !important;
  height: auto !important;
  border-color: rgba(255, 255, 255, 0.15);
}

.sales-hero-graphic .hero-graph-grid {
  left: 19% !important;
  right: 16% !important;
  top: 38% !important;
  bottom: 19% !important;
  width: auto !important;
  height: auto !important;
}

.sales-hero-graphic .sales-hero-pipeline {
  left: 21% !important;
  right: 18% !important;
  bottom: 19% !important;
  top: auto !important;
  width: auto !important;
  height: 40% !important;
  position: absolute;
  z-index: 2;
}

.sales-hero-pipeline__stage {
  position: absolute;
  left: var(--x);
  top: var(--y);
  width: var(--w);
  height: var(--h);
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.15);
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.18), transparent 48%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.055));
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.18);
}

.sales-hero-pipeline__stage::before,
.sales-hero-pipeline__stage::after {
  content: "";
  position: absolute;
  left: 18px;
  height: 3px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.28);
}

.sales-hero-pipeline__stage::before {
  top: 18px;
  width: 42%;
}

.sales-hero-pipeline__stage::after {
  top: 31px;
  width: 64%;
  background: rgba(240, 187, 93, 0.44);
}

.sales-hero-pipeline__stage--one {
  --x: 0%;
  --y: 58%;
  --w: 52%;
  --h: 34%;
}

.sales-hero-pipeline__stage--two {
  --x: 14%;
  --y: 34%;
  --w: 60%;
  --h: 34%;
}

.sales-hero-pipeline__stage--three {
  --x: 30%;
  --y: 11%;
  --w: 55%;
  --h: 34%;
}

.sales-hero-pipeline__stage--four {
  --x: 54%;
  --y: 45%;
  --w: 42%;
  --h: 30%;
  background:
    linear-gradient(90deg, rgba(240, 187, 93, 0.28), transparent 50%),
    linear-gradient(180deg, rgba(240, 187, 93, 0.22), rgba(196, 123, 15, 0.08));
}

.sales-hero-pipeline__marker {
  position: absolute;
  width: 14px;
  height: 14px;
  border-radius: 999px;
  background: #f0bb5d;
  box-shadow:
    0 0 0 7px rgba(240, 187, 93, 0.13),
    0 0 24px rgba(240, 187, 93, 0.32);
}

.sales-hero-pipeline__marker--one {
  left: 9%;
  top: 51%;
}

.sales-hero-pipeline__marker--two {
  left: 48%;
  top: 27%;
}

.sales-hero-pipeline__marker--three {
  left: 82%;
  top: 39%;
}

.sales-hero-graphic .hero-dot-matrix {
  right: 20% !important;
  top: 29% !important;
  width: 178px;
  height: 126px;
}

@media (max-width: 980px) {
  .sales-hero-graphic {
    display: none;
  }
}

.sales-hero-panel {
  min-height: 430px;
  border-radius: 34px;
  padding: 30px;
  background:
    radial-gradient(circle at 72% 18%, rgba(240, 187, 93, 0.20), transparent 28%),
    linear-gradient(145deg, rgba(255,255,255,0.11), rgba(255,255,255,0.035));
  border: 1px solid rgba(255,255,255,0.14);
  box-shadow: 0 26px 80px rgba(0,0,0,.22);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.sales-hero-panel__top {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  color: rgba(255,255,255,.72);
  font-size: .78rem;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.sales-hero-panel__line {
  height: 1px;
  margin: 28px 0;
  background: linear-gradient(90deg, transparent, rgba(240,187,93,.8), transparent);
}

.sales-hero-focus {
  padding: 28px;
  border-radius: 24px;
  background: rgba(7, 19, 34, 0.58);
  border: 1px solid rgba(240,187,93,.22);
  color: #fff;
}

.sales-hero-focus__label {
  display: block;
  margin-bottom: 10px;
  color: #f0bb5d;
  font-size: .78rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  font-weight: 800;
}

.sales-hero-focus span:last-child {
  font-family: var(--font-display);
  font-size: clamp(1.55rem, 3vw, 2.4rem);
  line-height: 1.04;
}

.sales-hero-rows {
  display: grid;
  gap: 14px;
  margin-top: 28px;
}

.sales-hero-rows div {
  height: 42px;
  border-radius: 16px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.10);
  display: grid;
  grid-template-columns: 42px 1fr;
  align-items: center;
  gap: 12px;
  padding: 0 14px;
}

.sales-hero-rows span {
  width: 18px;
  height: 18px;
  border-radius: 999px;
  border: 1px solid rgba(240,187,93,.55);
}

.sales-hero-rows strong {
  height: 7px;
  border-radius: 999px;
  background: rgba(255,255,255,.22);
}

.sales-hero-rows div:nth-child(2) strong {
  width: 72%;
}

.sales-hero-rows div:nth-child(3) strong {
  width: 52%;
}

.sales-hero-signal-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-top: 24px;
}

.sales-hero-signal-grid span {
  height: 64px;
  border-radius: 18px;
  background: rgba(240,187,93,.10);
  border: 1px solid rgba(240,187,93,.15);
}

.sales-page-statement {
  padding: 58px 0;
  background: #f6ead9;
  border-bottom: 1px solid rgba(47, 55, 68, .10);
}

.sales-page-statement p {
  margin: 0;
  max-width: 1180px;
  color: var(--midnight);
  font-family: var(--font-display);
  font-size: clamp(2.2rem, 4vw, 4.8rem);
  line-height: 1.02;
  letter-spacing: -0.02em;
}

.sales-priorities-section {
  background: #fbf7ef;
}

.sales-priorities-intro {
  max-width: none;
}

.sales-priorities-grid {
  margin-top: 54px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
}

.sales-priority-card {
  position: relative;
  padding: 30px;
  border-radius: 24px;
  background: #fffaf1;
  border: 1px solid rgba(47, 55, 68, .10);
  box-shadow: 0 18px 50px rgba(20, 30, 45, .06);
}

.sales-priority-card--wide {
  grid-column: 1 / -1;
}

.priority-number {
  display: inline-grid;
  place-items: center;
  width: 38px;
  height: 38px;
  margin-bottom: 22px;
  border-radius: 999px;
  color: #b47a2c;
  background: rgba(180,122,44,.10);
  border: 1px solid rgba(180,122,44,.24);
  font-size: .78rem;
  font-weight: 800;
}

.sales-priority-card h3 {
  margin: 0;
  color: var(--midnight);
  font-size: 1.28rem;
  line-height: 1.16;
}

.sales-priority-card p {
  margin: 12px 0 0;
  color: rgba(13,22,34,.76);
  line-height: 1.55;
}

.sales-priority-card ul {
  margin: 20px 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 16px;
  list-style: none;
}

.sales-priority-card li {
  color: rgba(13,22,34,.72);
  font-size: .92rem;
}

.sales-priority-card li::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: 8px;
  border-radius: 999px;
  background: #b47a2c;
  vertical-align: .1em;
}

.sales-implementation-section {
  background:
    radial-gradient(circle at 8% 12%, rgba(240,187,93,.14), transparent 30%),
    linear-gradient(135deg, #071322 0%, #111f32 100%);
  color: #fff;
}

.sales-implementation-grid {
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  gap: 56px;
  align-items: start;
}

.sales-implementation-section .eyebrow {
  color: #f0bb5d;
}

.sales-implementation-section .eyebrow::after {
  background: #f0bb5d;
}

.sales-implementation-section .section-title {
  color: #fff;
}

.sales-implementation-section .section-lead {
  color: rgba(255,255,255,.76);
}

.sales-implementation-cards {
  display: grid;
  gap: 16px;
}

.sales-implementation-card {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: 16px;
  padding: 20px;
  border-radius: 20px;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.12);
}

.sales-implementation-icon,
.sales-ai-icon {
  display: grid;
  place-items: center;
  color: #f0bb5d;
  border: 1px solid rgba(240,187,93,.28);
  background: rgba(240,187,93,.10);
}

.sales-implementation-icon {
  width: 48px;
  height: 48px;
  border-radius: 16px;
}

.sales-implementation-icon svg {
  width: 24px;
  height: 24px;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.sales-implementation-card h3 {
  margin: 0;
  color: #fff;
  font-size: 1.05rem;
}

.sales-implementation-card p {
  margin: 6px 0 0;
  color: rgba(255,255,255,.72);
  line-height: 1.48;
}

.sales-ai-section {
  background:
    radial-gradient(circle at 76% 22%, rgba(255,255,255,.46), transparent 30%),
    linear-gradient(180deg, #f8ecdc 0%, #f4e6d3 100%);
  color: var(--midnight);
  border-top: 1px solid rgba(47,55,68,.10);
  border-bottom: 1px solid rgba(47,55,68,.10);
}

.sales-ai-container {
  max-width: 1440px;
}

.sales-ai-intro {
  max-width: 1120px;
}

.sales-ai-eyebrow {
  color: #b47a2c;
  letter-spacing: .20em;
}

.sales-ai-eyebrow::after {
  content: "";
  display: block;
  width: 72px;
  height: 2px;
  margin-top: 18px;
  background: #b47a2c;
}

.sales-ai-intro .section-title {
  max-width: 1120px;
  margin-top: 28px;
  color: var(--midnight);
  font-size: clamp(3.25rem, 6vw, 6.2rem);
  line-height: .96;
  letter-spacing: -0.02em;
}

.sales-ai-intro .section-lead {
  max-width: 1120px;
  margin-top: 28px;
  color: rgba(13,22,34,.82);
  font-size: 1.12rem;
  line-height: 1.65;
}

.sales-ai-grid {
  margin-top: 58px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
}

.sales-ai-card {
  position: relative;
  text-align: center;
  padding: 0 46px 12px;
}

.sales-ai-card:not(:last-child) {
  border-right: 1px solid rgba(180,122,44,.28);
}

.sales-ai-icon {
  width: 104px;
  height: 104px;
  margin: 0 auto 24px;
  border-radius: 50%;
}

.sales-ai-icon svg {
  width: 58px;
  height: 58px;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.sales-ai-card h3 {
  margin: 0;
  color: var(--midnight);
  font-size: .95rem;
  line-height: 1.22;
  font-weight: 800;
  letter-spacing: .10em;
  text-transform: uppercase;
}

.sales-ai-rule {
  display: block;
  width: 44px;
  height: 2px;
  margin: 18px auto;
  background: #b47a2c;
}

.sales-ai-card p {
  margin: 0 auto;
  max-width: 370px;
  color: rgba(13,22,34,.78);
  font-size: 1.01rem;
  line-height: 1.58;
}

.sales-ai-note {
  margin-top: 50px;
  padding-top: 30px;
  border-top: 1px solid rgba(180,122,44,.24);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  color: rgba(13,22,34,.86);
}

.sales-ai-note-icon {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  border: 1px solid rgba(180,122,44,.42);
  color: #b47a2c;
  font-weight: 800;
  letter-spacing: .04em;
  background: rgba(255,255,255,.22);
  flex: 0 0 52px;
}

.sales-ai-note p {
  margin: 0;
  max-width: 760px;
  font-size: 1.03rem;
  line-height: 1.45;
}

.sales-ai-note strong {
  color: #b47a2c;
}

.sales-proof-section {
  background: #fbf7ef;
}

@media (max-width: 980px) {
  .sales-hero-grid,
  .sales-implementation-grid {
    grid-template-columns: 1fr;
  }

  .sales-priorities-grid {
    grid-template-columns: 1fr;
  }

  .sales-priority-card--wide {
    grid-column: auto;
  }

  .sales-ai-grid {
    grid-template-columns: 1fr;
    margin-top: 38px;
    border-top: 1px solid rgba(180,122,44,.24);
  }

  .sales-ai-card {
    padding: 24px 0;
    display: grid;
    grid-template-columns: 64px 1fr;
    column-gap: 18px;
    text-align: left;
    align-items: start;
    border-right: 0 !important;
    border-bottom: 1px solid rgba(180,122,44,.20);
  }

  .sales-ai-icon {
    width: 64px;
    height: 64px;
    margin: 0;
    grid-row: span 3;
  }

  .sales-ai-icon svg {
    width: 38px;
    height: 38px;
  }

  .sales-ai-rule {
    margin: 10px 0;
  }

  .sales-ai-card p {
    max-width: none;
    margin: 0;
  }
}

@media (max-width: 760px) {
  .sales-hero-v43 {
    padding-top: 0;
  }

  .sales-hero-v43 .page-hero__copy {
    padding-top: 54px;
  }

  .sales-hero-v43 h1 {
    font-size: clamp(3rem, 14vw, 4.5rem);
    line-height: .96;
  }

  .sales-hero-v43 .page-hero__copy > p {
    font-size: .98rem;
    line-height: 1.55;
  }

  .sales-hero-panel {
    min-height: auto;
    padding: 22px;
    border-radius: 24px;
  }

  .sales-hero-focus {
    padding: 22px;
  }

  .sales-hero-signal-grid {
    display: none;
  }

  .sales-page-statement {
    padding: 30px 0;
  }

  .sales-page-statement p {
    font-size: clamp(1.55rem, 8vw, 2.55rem);
  }

  .sales-priorities-section,
  .sales-implementation-section,
  .sales-ai-section {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .sales-priorities-grid {
    display: block;
    margin-top: 30px;
    border-top: 1px solid rgba(47,55,68,.16);
  }

  .sales-priority-card {
    padding: 18px 0 !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(47,55,68,.14) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .priority-number {
    width: 32px;
    height: 32px;
    margin-bottom: 12px;
  }

  .sales-priority-card h3 {
    font-size: 1.08rem;
  }

  .sales-priority-card p {
    margin-top: 7px;
    font-size: .92rem;
  }

  .sales-priority-card ul {
    display: none;
  }

  .sales-implementation-cards {
    margin-top: 28px;
    border-top: 1px solid rgba(255,255,255,.18);
    gap: 0;
  }

  .sales-implementation-card {
    padding: 16px 0;
    border: 0;
    border-bottom: 1px solid rgba(255,255,255,.14);
    border-radius: 0;
    background: transparent;
    grid-template-columns: 36px 1fr;
    gap: 14px;
  }

  .sales-implementation-icon {
    width: 36px;
    height: 36px;
    border-radius: 12px;
  }

  .sales-implementation-icon svg {
    width: 20px;
    height: 20px;
  }

  .sales-ai-intro,
  .sales-ai-intro .section-title,
  .sales-ai-intro .section-lead {
    max-width: 100%;
  }

  .sales-ai-intro .section-title {
    font-size: clamp(2.55rem, 12vw, 3.85rem);
    line-height: .98;
  }

  .sales-ai-intro .section-lead {
    font-size: .96rem;
    line-height: 1.52;
  }

  .sales-ai-card {
    grid-template-columns: 42px 1fr;
    column-gap: 14px;
    padding: 17px 0 !important;
  }

  .sales-ai-icon {
    width: 42px;
    height: 42px;
  }

  .sales-ai-icon svg {
    width: 25px;
    height: 25px;
  }

  .sales-ai-card h3 {
    font-size: .88rem;
  }

  .sales-ai-rule {
    display: none;
  }

  .sales-ai-card p {
    margin-top: 6px;
    font-size: .92rem;
    line-height: 1.45;
  }

  .sales-ai-note {
    margin-top: 26px;
    padding-top: 20px;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 14px;
  }

  .sales-ai-note-icon {
    width: 42px;
    height: 42px;
    flex-basis: 42px;
  }

  .sales-ai-note p {
    font-size: .92rem;
    line-height: 1.45;
  }
}



/* v44: Sales Operations refinements */
.sales-hero-v44 {
  background:
    radial-gradient(circle at 78% 24%, rgba(196, 123, 15, 0.16), transparent 30%),
    linear-gradient(135deg, #071322 0%, #111f32 56%, #18263a 100%);
}

.sales-hero-grid--visual {
  grid-template-columns: 1fr .95fr;
  align-items: center;
  gap: 42px;
}

.sales-hero-v44 .page-hero__copy {
  max-width: 760px;
}

.btn--ghost-gold {
  border-color: rgba(240, 187, 93, 0.75) !important;
  color: #f4d089 !important;
  background: rgba(240, 187, 93, 0.06) !important;
}

.btn--ghost-gold:hover {
  background: rgba(240, 187, 93, 0.12) !important;
}

.sales-hero-visual {
  position: relative;
  min-height: 420px;
  overflow: hidden;
  border-radius: 36px;
  background:
    radial-gradient(circle at 78% 28%, rgba(240, 187, 93, 0.18), transparent 28%),
    linear-gradient(145deg, rgba(255,255,255,0.03), rgba(255,255,255,0.01));
  border: 1px solid rgba(255,255,255,0.10);
}

.sales-hero-visual__arc {
  position: absolute;
  border-radius: 50%;
  border: 1px solid rgba(240, 187, 93, 0.42);
  pointer-events: none;
}

.sales-hero-visual__arc--1 {
  width: 520px;
  height: 520px;
  right: -120px;
  top: 44px;
}

.sales-hero-visual__arc--2 {
  width: 390px;
  height: 390px;
  right: -34px;
  top: 104px;
  border-color: rgba(255,255,255,0.14);
}

.sales-hero-visual__arc--3 {
  width: 270px;
  height: 270px;
  right: 48px;
  top: 164px;
  border-color: rgba(240, 187, 93, 0.18);
}

.sales-hero-visual__glow {
  position: absolute;
  inset: auto 38px 46px auto;
  width: 260px;
  height: 190px;
  background: linear-gradient(180deg, rgba(240,187,93,0.18), rgba(240,187,93,0));
  transform: skewX(-24deg);
  filter: blur(1px);
}

.sales-hero-visual__bars {
  position: absolute;
  right: 92px;
  bottom: 82px;
  display: flex;
  align-items: end;
  gap: 16px;
}

.sales-hero-visual__bars span {
  width: 22px;
  border-radius: 10px 10px 0 0;
  background: linear-gradient(180deg, rgba(255,255,255,0.65), rgba(255,255,255,0.16));
  border: 1px solid rgba(255,255,255,0.10);
}

.sales-hero-visual__bars span:nth-child(1) { height: 62px; }
.sales-hero-visual__bars span:nth-child(2) { height: 102px; background: linear-gradient(180deg, rgba(240,187,93,0.85), rgba(240,187,93,0.24)); }
.sales-hero-visual__bars span:nth-child(3) { height: 142px; }
.sales-hero-visual__bars span:nth-child(4) { height: 176px; }
.sales-hero-visual__bars span:nth-child(5) { height: 222px; }

.sales-hero-visual__lines {
  position: absolute;
  left: 54px;
  right: 54px;
  bottom: 94px;
  display: grid;
  gap: 22px;
}

.sales-hero-visual__lines span {
  display: block;
  height: 1px;
  background: linear-gradient(90deg, rgba(255,255,255,0.06), rgba(240,187,93,0.28), rgba(255,255,255,0.06));
}

.sales-contact-section {
  background:
    radial-gradient(circle at 82% 14%, rgba(240,187,93,.12), transparent 28%),
    linear-gradient(135deg, #071322 0%, #111f32 100%);
}

.sales-contact-layout {
  display: grid;
  grid-template-columns: .92fr 1.08fr;
  gap: 42px;
  align-items: start;
}

.sales-contact-section .eyebrow {
  color: #f0bb5d;
}

.sales-contact-section .eyebrow::after {
  background: #f0bb5d;
}

.sales-contact-section .section-title {
  color: #fff;
}

.sales-contact-section .section-lead {
  color: rgba(255,255,255,.78);
}

.sales-contact-copy {
  display: grid;
  gap: 18px;
}

.sales-contact-copy .section-title {
  margin-bottom: 0;
}

.sales-contact-copy .section-lead {
  margin-top: 0;
}

.sales-contact-section .contact-card {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 24px 60px rgba(0,0,0,.18);
}

.sales-contact-section .contact-card label,
.sales-contact-section .form-note {
  color: rgba(255,255,255,.82);
}

.sales-contact-section .contact-card input,
.sales-contact-section .contact-card textarea {
  background: rgba(10, 18, 31, .72);
  border: 1px solid rgba(255,255,255,.16);
  color: #fff;
}

.sales-contact-section .contact-card input::placeholder,
.sales-contact-section .contact-card textarea::placeholder {
  color: rgba(255,255,255,.40);
}

.sales-contact-section .contact-card span {
  color: rgba(255,255,255,.58);
}

@media (max-width: 980px) {
  .sales-hero-grid--visual,
  .sales-contact-layout {
    grid-template-columns: 1fr;
  }

  .sales-hero-visual {
    min-height: 320px;
  }
}

@media (max-width: 760px) {
  .sales-hero-grid--visual {
    gap: 28px;
  }

  .sales-hero-visual {
    min-height: 260px;
    border-radius: 24px;
  }

  .sales-hero-visual__arc--1 {
    width: 340px;
    height: 340px;
    right: -70px;
    top: 20px;
  }

  .sales-hero-visual__arc--2 {
    width: 250px;
    height: 250px;
    right: -10px;
    top: 64px;
  }

  .sales-hero-visual__arc--3 {
    width: 170px;
    height: 170px;
    right: 38px;
    top: 114px;
  }

  .sales-hero-visual__bars {
    right: 58px;
    bottom: 44px;
    gap: 10px;
  }

  .sales-hero-visual__bars span {
    width: 14px;
  }

  .sales-hero-visual__bars span:nth-child(1) { height: 36px; }
  .sales-hero-visual__bars span:nth-child(2) { height: 58px; }
  .sales-hero-visual__bars span:nth-child(3) { height: 78px; }
  .sales-hero-visual__bars span:nth-child(4) { height: 98px; }
  .sales-hero-visual__bars span:nth-child(5) { height: 122px; }

  .sales-hero-visual__lines {
    left: 28px;
    right: 28px;
    bottom: 54px;
    gap: 14px;
  }

  .sales-contact-layout {
    gap: 28px;
  }
}



/* v45: homepage internal CTAs + Sales contact refinements */
.ops-feature-actions {
  display: flex;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
  margin-top: 28px;
}

.ops-feature-actions .ops-feature-button {
  margin-top: 0;
}

.ops-feature-text-link,
.ownership-text-link {
  color: var(--midnight);
  font-weight: 800;
  text-decoration: none;
  border-bottom: 1px solid rgba(180, 122, 44, 0.45);
  padding-bottom: 4px;
}

.ops-feature-text-link:hover,
.ownership-text-link:hover {
  color: #b47a2c;
}

.ownership-actions {
  display: flex;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
  margin-top: 28px;
}

.ownership-actions .ownership-button {
  margin-top: 0;
}

.sales-hero-actions {
  gap: 18px;
}

.sales-hero-actions .btn {
  margin-right: 0;
}

.sales-contact-section {
  background:
    radial-gradient(circle at 82% 14%, rgba(240,187,93,.12), transparent 28%),
    linear-gradient(135deg, #071322 0%, #111f32 100%);
}

.sales-contact-section .eyebrow {
  color: #f0bb5d;
}

.sales-contact-section .eyebrow::after {
  background: #f0bb5d;
}

.sales-contact-section .section-title {
  color: #fff;
}

.sales-contact-section .section-title span {
  display: block;
  color: #f0bb5d;
}

.sales-contact-section .section-lead {
  color: rgba(255,255,255,.78);
}

.sales-contact-section .contact-direct-note {
  margin-top: 30px;
  padding: 20px;
  border-radius: 20px;
  background: rgba(255,255,255,.075);
  border: 1px solid rgba(240,187,93,.24);
  box-shadow: 0 20px 50px rgba(0,0,0,.14);
}

.sales-contact-section .contact-direct-note > span {
  background: rgba(240,187,93,.12);
  border-color: rgba(240,187,93,.32);
  color: #f0bb5d;
}

.sales-contact-section .contact-direct-note svg {
  stroke: #f0bb5d;
}

.sales-contact-section .contact-direct-note strong {
  color: #fff;
}

.sales-contact-section .contact-direct-note p {
  color: rgba(255,255,255,.74);
}

.sales-contact-section .contact-card {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 24px 60px rgba(0,0,0,.18);
}

.sales-contact-section .contact-form label,
.sales-contact-section .form-note {
  color: rgba(255,255,255,.82);
}

.sales-contact-section .contact-form input,
.sales-contact-section .contact-form textarea {
  background: rgba(10, 18, 31, .72);
  border: 1px solid rgba(255,255,255,.16);
  color: #fff;
}

.sales-contact-section .contact-form input:focus,
.sales-contact-section .contact-form textarea:focus {
  border-color: rgba(240,187,93,.70);
  box-shadow: 0 0 0 3px rgba(240,187,93,.12);
}

.sales-contact-section .form-optional,
.sales-contact-section .contact-form span {
  color: rgba(255,255,255,.58);
}

.sales-contact-section .contact-submit {
  width: 100%;
  justify-content: center;
  margin-top: 6px;
}

.sales-contact-section .form-note--privacy {
  margin-top: 18px;
}

@media (max-width: 760px) {
  .ops-feature-actions,
  .ownership-actions {
    align-items: flex-start;
    flex-direction: column;
    gap: 14px;
  }

  .ops-feature-actions .ops-feature-button,
  .ownership-actions .ownership-button {
    width: 100%;
    justify-content: center;
  }

  .sales-hero-actions {
    gap: 14px;
  }

  .sales-hero-actions .btn {
    width: 100%;
    justify-content: center;
  }

  .sales-contact-section .contact-direct-note {
    padding: 18px;
    margin-top: 22px;
  }
}



/* v46: Sales Operations mobile-friendly refinements + single hero CTA */
.sales-hero-actions--single {
  gap: 0;
}

.sales-hero-actions--single .btn {
  margin-right: 0;
}

@media (max-width: 760px) {
  /* Hero: match Marketing page mobile discipline */
  .sales-hero-v44 {
    padding-top: 0;
  }

  .sales-hero-v44 .container,
  .sales-hero-v44 .page-hero__copy {
    width: auto;
  }

  .sales-hero-v44 .page-hero__copy {
    padding-top: 54px;
    padding-left: 0;
    padding-right: 0;
  }

  .sales-hero-grid--visual {
    display: block;
    margin-left: 22px;
    margin-right: 22px;
  }

  .sales-hero-v44 .sales-hero-eyebrow {
    font-size: 0.9rem;
    letter-spacing: 0.18em;
    margin-bottom: 24px;
  }

  .sales-hero-v44 .sales-hero-eyebrow::after {
    width: 72px;
    margin-top: 14px;
    margin-bottom: 20px;
  }

  .sales-hero-v44 h1 {
    font-size: clamp(3rem, 14vw, 4.5rem);
    line-height: 0.96;
    max-width: 100%;
  }

  .sales-hero-v44 .page-hero__copy > p {
    margin-top: 22px;
    font-size: 0.98rem;
    line-height: 1.55;
    max-width: 100%;
  }

  .sales-hero-actions--single {
    margin-top: 26px;
  }

  .sales-hero-actions--single .btn {
    width: 100%;
    justify-content: center;
  }

  .sales-hero-visual {
    min-height: 235px;
    margin-top: 26px;
    border-radius: 24px;
  }

  .sales-hero-visual__arc--1 {
    width: 330px;
    height: 330px;
    right: -82px;
    top: 10px;
  }

  .sales-hero-visual__arc--2 {
    width: 242px;
    height: 242px;
    right: -18px;
    top: 50px;
  }

  .sales-hero-visual__arc--3 {
    width: 165px;
    height: 165px;
    right: 36px;
    top: 96px;
  }

  .sales-hero-visual__bars {
    right: 48px;
    bottom: 38px;
    gap: 9px;
  }

  .sales-hero-visual__bars span {
    width: 13px;
  }

  .sales-hero-visual__bars span:nth-child(1) { height: 32px; }
  .sales-hero-visual__bars span:nth-child(2) { height: 52px; }
  .sales-hero-visual__bars span:nth-child(3) { height: 72px; }
  .sales-hero-visual__bars span:nth-child(4) { height: 92px; }
  .sales-hero-visual__bars span:nth-child(5) { height: 112px; }

  .sales-hero-visual__lines {
    left: 24px;
    right: 24px;
    bottom: 48px;
    gap: 13px;
  }

  /* Sales priorities: compact editorial rows on mobile */
  .sales-priorities-section {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .sales-priorities-intro {
    text-align: left;
  }

  .sales-priorities-intro .section-title,
  .sales-priorities-intro .section-lead {
    text-align: left;
    margin-left: 0;
    margin-right: 0;
  }

  .sales-priorities-intro .section-title {
    font-size: clamp(2.45rem, 11vw, 3.55rem);
    line-height: 0.98;
  }

  .sales-priorities-intro .section-lead {
    font-size: 0.96rem;
    line-height: 1.52;
  }

  .sales-priorities-grid {
    display: block;
    margin-top: 30px;
    border-top: 1px solid rgba(47, 55, 68, 0.16);
  }

  .sales-priority-card {
    display: grid;
    grid-template-columns: 42px 1fr;
    column-gap: 14px;
    padding: 18px 0 !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(47, 55, 68, 0.14) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .priority-number {
    grid-column: 1;
    grid-row: 1 / span 3;
    width: 34px;
    height: 34px;
    min-width: 34px;
    margin: 1px 0 0;
    font-size: 0.78rem;
  }

  .sales-priority-card h3 {
    grid-column: 2;
    margin: 0;
    font-size: 1.08rem;
    line-height: 1.22;
  }

  .sales-priority-card p {
    grid-column: 2;
    margin: 6px 0 0;
    font-size: 0.92rem;
    line-height: 1.45;
  }

  .sales-priority-card ul {
    display: none;
  }

  /* Implementation Layer: high-contrast icon + text rows */
  .sales-implementation-section {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .sales-implementation-section .eyebrow {
    color: #f0bb5d;
  }

  .sales-implementation-section .section-title {
    font-size: clamp(2.45rem, 11vw, 3.55rem);
    line-height: 0.98;
  }

  .sales-implementation-section .section-lead {
    font-size: 0.96rem;
    line-height: 1.52;
  }

  .sales-implementation-grid {
    display: block;
  }

  .sales-implementation-cards {
    margin-top: 28px;
    border-top: 1px solid rgba(255, 255, 255, 0.18);
    gap: 0;
  }

  .sales-implementation-card {
    display: grid;
    grid-template-columns: 36px 1fr;
    column-gap: 14px;
    padding: 16px 0 !important;
    margin: 0;
    border: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .sales-implementation-icon {
    width: 36px;
    height: 36px;
    min-width: 36px;
    border-radius: 12px;
    color: #f0bb5d;
    background: rgba(240, 187, 93, 0.12);
    border: 1px solid rgba(240, 187, 93, 0.28);
  }

  .sales-implementation-icon svg {
    width: 20px;
    height: 20px;
  }

  .sales-implementation-card h3 {
    margin: 0 0 5px;
    color: #fff;
    font-size: 1.04rem;
    line-height: 1.22;
  }

  .sales-implementation-card p {
    margin: 0;
    color: rgba(255, 255, 255, 0.76);
    font-size: 0.92rem;
    line-height: 1.45;
  }

  /* AI & Sales Operations: compact rows on mobile */
  .sales-ai-section {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .sales-ai-intro,
  .sales-ai-intro .section-title,
  .sales-ai-intro .section-lead {
    max-width: 100%;
  }

  .sales-ai-intro .section-title {
    font-size: clamp(2.55rem, 12vw, 3.85rem);
    line-height: 0.98;
  }

  .sales-ai-intro .section-lead {
    font-size: 0.96rem;
    line-height: 1.52;
  }

  .sales-ai-grid {
    display: block;
    margin-top: 30px;
    border-top: 1px solid rgba(180, 122, 44, 0.22);
  }

  .sales-ai-card {
    display: grid;
    grid-template-columns: 42px 1fr;
    column-gap: 14px;
    text-align: left;
    padding: 17px 0 !important;
    border-right: 0 !important;
    border-bottom: 1px solid rgba(180, 122, 44, 0.18);
  }

  .sales-ai-icon {
    width: 42px;
    height: 42px;
    margin: 0;
    grid-row: 1 / span 3;
    background: rgba(180, 122, 44, 0.10);
  }

  .sales-ai-icon svg {
    width: 25px;
    height: 25px;
    stroke-width: 2;
  }

  .sales-ai-card h3 {
    margin: 0;
    font-size: 0.88rem;
    line-height: 1.24;
  }

  .sales-ai-rule {
    display: none;
  }

  .sales-ai-card p {
    max-width: none;
    margin: 6px 0 0;
    font-size: 0.92rem;
    line-height: 1.45;
  }

  .sales-ai-note {
    margin-top: 26px;
    padding-top: 20px;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 14px;
  }

  .sales-ai-note-icon {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    border-radius: 12px;
  }

  .sales-ai-note p {
    font-size: 0.92rem;
    line-height: 1.45;
  }

  /* Contact: keep Marketing-style format and tighten mobile spacing */
  .sales-contact-section {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .sales-contact-section .contact-grid {
    gap: 28px;
  }

  .sales-contact-section .section-title {
    font-size: clamp(2.45rem, 11vw, 3.55rem);
    line-height: 0.98;
  }

  .sales-contact-section .section-lead {
    font-size: 0.96rem;
    line-height: 1.52;
  }

  .sales-contact-section .contact-card {
    padding: 22px 18px !important;
    border-radius: 18px;
  }

  .sales-contact-section .form-row {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .sales-contact-section .contact-direct-note {
    padding: 18px;
    margin-top: 22px;
  }

  .sales-contact-section .contact-submit {
    width: 100%;
    justify-content: center;
  }

  .sales-contact-section .form-note--privacy {
    margin-top: 18px;
  }
}

@media (max-width: 480px) {
  .sales-hero-grid--visual {
    margin-left: 20px;
    margin-right: 20px;
  }

  .sales-hero-v44 h1 {
    font-size: clamp(2.8rem, 14vw, 3.75rem);
  }

  .sales-hero-visual {
    min-height: 215px;
  }

  .sales-priorities-section,
  .sales-implementation-section,
  .sales-ai-section,
  .sales-contact-section {
    padding-top: 44px;
    padding-bottom: 44px;
  }
}



/* v47: headline spacing + homepage hero graphic grouping */
.hero h1,
.hero__headline,
.page-hero h1,
.section-title,
.ownership-title,
.sales-headline,
.marketing-headline,
.marketing-hero-v22 h1,
.sales-hero-v44 h1,
.sales-ai-intro .section-title,
.marketing-ai-intro .section-title {
  letter-spacing: -0.02em !important;
}

/* Keep the homepage hero bar graph and circular orbit graphic together
   as the desktop viewport narrows. */
.hero-background-graphic {
  min-width: 420px;
  aspect-ratio: 1 / 1;
  position: relative;
  overflow: visible;
  transform-origin: center center;
}

.hero-background-graphic .hero-orbit,
.hero-background-graphic .hero-graph-grid,
.hero-background-graphic .hero-graph-bars,
.hero-background-graphic .hero-dot-matrix {
  position: absolute;
}

@media (max-width: 1180px) and (min-width: 861px) {
  .hero-v22 .hero__inner,
  .hero--light .hero__inner {
    grid-template-columns: minmax(0, 1fr) minmax(360px, 0.82fr);
    align-items: center;
    gap: clamp(28px, 4vw, 54px);
  }

  .hero-background-graphic {
    min-width: 0;
    width: min(38vw, 440px);
    max-width: 440px;
    justify-self: center;
  }

  .hero-background-graphic .hero-graph-bars {
    transform-origin: center bottom;
  }
}

@media (max-width: 980px) and (min-width: 861px) {
  .hero-background-graphic {
    width: 360px;
    max-width: 360px;
  }
}

/* At tablet/mobile sizes, use the existing stacked/mobile behavior instead of
   allowing only part of the hero graphic to wrap or separate. */
@media (max-width: 860px) {
  .hero-background-graphic {
    width: min(100%, 360px);
    max-width: 360px;
    min-width: 0;
    margin-left: auto;
    margin-right: auto;
  }
}



/* v48: homepage copy/layout refinements */
.hero-v22 {
  padding-top: max(56px, calc(var(--section-pad) - 10px));
}

/* Keep homepage hero graphic as one locked composition across desktop widths. */
.hero-background-graphic {
  position: relative !important;
  width: clamp(360px, 38vw, 520px) !important;
  min-width: 360px !important;
  aspect-ratio: 1 / 1 !important;
  overflow: visible !important;
  isolation: isolate;
  flex: 0 0 auto !important;
  align-self: center !important;
}

.hero-background-graphic .hero-orbit,
.hero-background-graphic .hero-graph-grid,
.hero-background-graphic .hero-graph-bars,
.hero-background-graphic .hero-dot-matrix {
  position: absolute !important;
  flex: none !important;
  float: none !important;
}

.hero-background-graphic .hero-orbit--outer {
  inset: 2% !important;
}

.hero-background-graphic .hero-orbit--middle {
  inset: 14% !important;
}

.hero-background-graphic .hero-orbit--inner {
  inset: 27% !important;
}

.hero-background-graphic .hero-graph-grid {
  left: 17% !important;
  right: 14% !important;
  top: 26% !important;
  bottom: 20% !important;
}

.hero-background-graphic .hero-graph-bars {
  left: 18% !important;
  right: 15% !important;
  bottom: 18% !important;
  top: auto !important;
  display: flex !important;
  align-items: end !important;
  justify-content: center !important;
  gap: clamp(6px, 1vw, 12px) !important;
  width: auto !important;
  height: 48% !important;
  transform: none !important;
}

.hero-background-graphic .hero-graph-bars span {
  flex: 1 1 0 !important;
  max-width: 24px !important;
  min-width: 8px !important;
}

.hero-background-graphic .hero-dot-matrix {
  right: 4% !important;
  bottom: 9% !important;
}

@media (max-width: 1180px) and (min-width: 861px) {
  .hero-v22 .hero__inner,
  .hero--light .hero__inner {
    grid-template-columns: minmax(0, 1fr) minmax(360px, 420px) !important;
    align-items: center !important;
    gap: clamp(28px, 4vw, 48px) !important;
  }

  .hero-background-graphic {
    width: clamp(360px, 34vw, 420px) !important;
    min-width: 360px !important;
    max-width: 420px !important;
    justify-self: center !important;
  }
}

@media (max-width: 980px) and (min-width: 861px) {
  .hero-v22 .hero__inner,
  .hero--light .hero__inner {
    grid-template-columns: minmax(0, 1fr) 360px !important;
  }

  .hero-background-graphic {
    width: 360px !important;
    min-width: 360px !important;
  }
}

/* On smaller screens, stack the full graphic as one unit rather than allowing parts to separate. */
@media (max-width: 860px) {
  .hero-background-graphic {
    width: min(100%, 360px) !important;
    min-width: 0 !important;
    max-width: 360px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* Softer Ways to Work Together icon treatment */
.ways-v26__icon-wrap,
.ways-v26__icon {
  background: rgba(180, 122, 44, 0.10) !important;
  border-color: rgba(180, 122, 44, 0.24) !important;
}

.ways-v26__icon svg {
  color: #9f6b27 !important;
  stroke: #9f6b27 !important;
}

.ways-v26__item:hover .ways-v26__icon-wrap,
.ways-v26__item:hover .ways-v26__icon {
  background: rgba(180, 122, 44, 0.14) !important;
  border-color: rgba(180, 122, 44, 0.32) !important;
}



/* v49: Hide homepage hero graphic before the bar chart can drop below text */
@media (max-width: 1100px) {
  .hero-v22 .hero__inner,
  .hero--light .hero__inner {
    grid-template-columns: 1fr !important;
  }

  .hero-background-graphic {
    display: none !important;
  }
}



/* v55 clean rebuild: paired homepage CTAs.
   Keep paired buttons side by side on desktop and narrow desktop, including half-width browser windows.
   The older stylesheet stacked these at 760px; this keeps them paired until true mobile. */
.homepage-ops-section .ops-feature-actions,
.ownership-section .ownership-actions {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
}

.sales-ops-feature .ops-feature-actions .btn,
.marketing-ops-feature .ops-feature-actions .btn,
.ownership-section .ownership-actions .btn {
  margin-top: 0 !important;
  align-self: center !important;
  width: auto !important;
  justify-content: center !important;
}

/* Only stack these paired CTAs on true mobile. */
@media (max-width: 560px) {
  .homepage-ops-section .ops-feature-actions,
  .ownership-section .ownership-actions {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .homepage-ops-section .ops-feature-actions .btn,
  .ownership-section .ownership-actions .btn {
    width: 100% !important;
  }
}

/* v55: targeted square-rounded button style for Sales/Marketing/Why "ways to work" CTAs.
   This does not touch the homepage hero Explore Our Services button. */
.sales-ops-feature .ops-feature-actions .ops-feature-way-button,
.marketing-ops-feature .ops-feature-actions .ops-feature-way-button,
.ownership-section .ownership-actions .ownership-way-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  min-height: 48px !important;
  padding: 14px 20px !important;
  border-radius: 14px !important;
  box-shadow: none !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

/* Sales and Why Leaders are on dark blue sections: use gold/champagne text. */
.sales-ops-feature .ops-feature-actions .ops-feature-way-button,
.sales-ops-feature .ops-feature-actions .ops-feature-way-button:visited,
.ownership-section .ownership-actions .ownership-way-button,
.ownership-section .ownership-actions .ownership-way-button:visited {
  color: #f4d39a !important;
  border: 1.5px solid rgba(244, 211, 154, 0.78) !important;
  background: transparent !important;
}

/* Marketing is lighter/tan: use dark text so it does not disappear as gold-on-tan. */
.marketing-ops-feature .ops-feature-actions .ops-feature-way-button,
.marketing-ops-feature .ops-feature-actions .ops-feature-way-button:visited {
  color: #1d2c43 !important;
  border: 1.5px solid rgba(29, 44, 67, 0.42) !important;
  background: rgba(255, 255, 255, 0.42) !important;
}

.sales-ops-feature .ops-feature-actions .ops-feature-way-button:hover,
.ownership-section .ownership-actions .ownership-way-button:hover {
  color: #ffdca3 !important;
  border-color: rgba(255, 220, 163, 0.96) !important;
  background: rgba(213, 149, 49, 0.10) !important;
  transform: translateY(-1px);
}

.marketing-ops-feature .ops-feature-actions .ops-feature-way-button:hover {
  color: #102033 !important;
  border-color: rgba(29, 44, 67, 0.62) !important;
  background: rgba(255, 255, 255, 0.62) !important;
  transform: translateY(-1px);
}

.ops-feature-way-button span,
.ownership-way-button span {
  color: inherit !important;
}

/* v55: Ways to Work Together icon cleanup.
   No square/tile background should appear normally or on hover. */
#ways-to-work .ways-v26__icon-wrap,
#ways-to-work .ways-v26__icon,
#ways-to-work .ways-card-icon,
#ways-to-work .ways-icon,
#ways-to-work .ways-card__icon,
#ways-to-work .ways-card__icon-wrap,
#ways-to-work .ways-v26__item:hover .ways-v26__icon-wrap,
#ways-to-work .ways-v26__item:hover .ways-v26__icon,
#ways-to-work .ways-v26__card:hover .ways-v26__icon-wrap,
#ways-to-work .ways-v26__card:hover .ways-v26__icon,
#ways-to-work .ways-card:hover .ways-card-icon,
#ways-to-work .ways-to-work-card:hover .ways-card__icon {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

#ways-to-work .ways-v26__icon-wrap::before,
#ways-to-work .ways-v26__icon-wrap::after,
#ways-to-work .ways-v26__icon::before,
#ways-to-work .ways-v26__icon::after,
#ways-to-work .ways-card-icon::before,
#ways-to-work .ways-card-icon::after,
#ways-to-work .ways-icon::before,
#ways-to-work .ways-icon::after,
#ways-to-work .ways-v26__item:hover .ways-v26__icon-wrap::before,
#ways-to-work .ways-v26__item:hover .ways-v26__icon-wrap::after,
#ways-to-work .ways-v26__item:hover .ways-v26__icon::before,
#ways-to-work .ways-v26__item:hover .ways-v26__icon::after,
#ways-to-work .ways-v26__card:hover .ways-v26__icon-wrap::before,
#ways-to-work .ways-v26__card:hover .ways-v26__icon-wrap::after,
#ways-to-work .ways-v26__card:hover .ways-v26__icon::before,
#ways-to-work .ways-v26__card:hover .ways-v26__icon::after {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* Keep the icon linework visible and clean. */
#ways-to-work .ways-v26__icon svg,
#ways-to-work .ways-card-icon svg,
#ways-to-work .ways-icon svg,
#ways-to-work .ways-card__icon svg,
#ways-to-work .ways-v26__item:hover .ways-v26__icon svg,
#ways-to-work .ways-v26__card:hover .ways-v26__icon svg {
  color: #9f6b27 !important;
  stroke: #9f6b27 !important;
}

/* v55: targeted heading spacing refinement. */
.approach-title,
.operating-approach-title,
.approach-section h2,
.ways-v26__card h3,
.ways-v26__item h3,
.ways-card h3,
.ways-to-work-card h3,
#ways-to-work h3 {
  letter-spacing: -0.02em !important;
}



/* v56: shorter secondary CTA text + non-wrapping desktop button rows. */
@media (min-width: 561px) {
  .homepage-ops-section .ops-feature-actions,
  .ownership-section .ownership-actions {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 14px !important;
  }

  .homepage-ops-section .ops-feature-actions .btn,
  .ownership-section .ownership-actions .btn {
    width: auto !important;
    flex: 0 0 auto !important;
    margin-top: 0 !important;
  }
}

/* Keep the secondary CTA compact enough to sit beside the primary button. */
.sales-ops-feature .ops-feature-actions .ops-feature-way-button,
.marketing-ops-feature .ops-feature-actions .ops-feature-way-button,
.ownership-section .ownership-actions .ownership-way-button {
  padding: 14px 16px !important;
  white-space: nowrap !important;
}

/* Why Leaders section is on a light/tan background; use dark text and border for contrast. */
.ownership-section .ownership-actions .ownership-way-button,
.ownership-section .ownership-actions .ownership-way-button:visited {
  color: #1d2c43 !important;
  border: 1.5px solid rgba(29, 44, 67, 0.46) !important;
  background: rgba(255, 255, 255, 0.40) !important;
}

.ownership-section .ownership-actions .ownership-way-button:hover {
  color: #102033 !important;
  border-color: rgba(29, 44, 67, 0.66) !important;
  background: rgba(255, 255, 255, 0.64) !important;
  transform: translateY(-1px);
}

.ownership-section .ownership-actions .ownership-way-button span {
  color: inherit !important;
}



/* v57: unified button shape system.
   Standardizes size and shape across the full site. Color still adapts by context. */
:root {
  --button-height: 48px;
  --button-padding-x: 20px;
  --button-radius: 14px;
  --button-font-size: 0.78rem;
  --button-letter-spacing: 0.08em;
}

.btn,
a.btn,
button.btn,
.btn--primary,
.btn--secondary,
.hero-service-link,
.ops-feature-button,
.ops-feature-way-button,
.ownership-button,
.ownership-way-button,
.contact-button,
.form-submit,
button[type="submit"] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  min-height: var(--button-height) !important;
  height: var(--button-height) !important;
  padding: 0 var(--button-padding-x) !important;
  border-radius: var(--button-radius) !important;
  font-size: var(--button-font-size) !important;
  font-weight: 800 !important;
  letter-spacing: var(--button-letter-spacing) !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  box-sizing: border-box !important;
  white-space: nowrap !important;
}

.btn span,
.btn--primary span,
.btn--secondary span,
.hero-service-link span,
.ops-feature-button span,
.ops-feature-way-button span,
.ownership-button span,
.ownership-way-button span {
  color: inherit !important;
}

/* Primary buttons: consistent shape, original gold-forward treatment. */
.btn--primary,
a.btn--primary,
.ownership-button,
.contact-button,
.form-submit,
button[type="submit"] {
  border: 1.5px solid rgba(213, 149, 49, 0.95) !important;
  background: #d59531 !important;
  color: #111c2d !important;
}

/* Secondary buttons: same shape, outlined treatment. */
.btn--secondary,
a.btn--secondary,
.hero-service-link,
.ops-feature-way-button,
.ownership-way-button {
  border: 1.5px solid rgba(213, 149, 49, 0.78) !important;
  background: transparent !important;
  color: #d59531 !important;
}

/* Service buttons keep the same button shape as every other CTA. */
.ops-feature-button {
  border-radius: var(--button-radius) !important;
}

/* Dark sections: secondary buttons need champagne/gold contrast. */
.sales-ops-feature .ops-feature-way-button,
.sales-ops-feature .ops-feature-way-button:visited,
.hero--dark .btn--secondary,
.section--dark .btn--secondary,
.dark-section .btn--secondary {
  color: #f4d39a !important;
  border-color: rgba(244, 211, 154, 0.78) !important;
  background: transparent !important;
}

/* Light/tan sections: secondary buttons need dark text for readability. */
.marketing-ops-feature .ops-feature-way-button,
.marketing-ops-feature .ops-feature-way-button:visited,
.ownership-section .ownership-way-button,
.ownership-section .ownership-way-button:visited,
.section--light .btn--secondary,
.light-section .btn--secondary {
  color: #1d2c43 !important;
  border-color: rgba(29, 44, 67, 0.46) !important;
  background: rgba(255, 255, 255, 0.40) !important;
}

/* Preserve homepage hero secondary color intent if it sits on the light hero. */
.hero-v22 .hero-service-link,
.hero-v22 .btn--secondary.hero-service-link {
  border-radius: var(--button-radius) !important;
}

/* Unified hover behavior while respecting context colors. */
.btn:hover,
a.btn:hover,
button.btn:hover {
  transform: translateY(-1px);
}

.btn--primary:hover,
a.btn--primary:hover,
.ownership-button:hover,
.contact-button:hover,
.form-submit:hover,
button[type="submit"]:hover {
  background: #e0a241 !important;
  border-color: rgba(224, 162, 65, 1) !important;
  color: #111c2d !important;
}

.sales-ops-feature .ops-feature-way-button:hover,
.section--dark .btn--secondary:hover,
.dark-section .btn--secondary:hover {
  color: #ffdca3 !important;
  border-color: rgba(255, 220, 163, 0.96) !important;
  background: rgba(213, 149, 49, 0.10) !important;
}

.marketing-ops-feature .ops-feature-way-button:hover,
.ownership-section .ownership-way-button:hover,
.section--light .btn--secondary:hover,
.light-section .btn--secondary:hover {
  color: #102033 !important;
  border-color: rgba(29, 44, 67, 0.66) !important;
  background: rgba(255, 255, 255, 0.64) !important;
}

/* Keep paired CTAs aligned. */
@media (min-width: 561px) {
  .homepage-ops-section .ops-feature-actions,
  .ownership-section .ownership-actions,
  .hero-actions,
  .hero__actions,
  .page-hero__actions {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 14px !important;
    flex-wrap: nowrap !important;
  }

  .homepage-ops-section .ops-feature-actions .btn,
  .ownership-section .ownership-actions .btn,
  .hero-actions .btn,
  .hero__actions .btn,
  .page-hero__actions .btn {
    flex: 0 0 auto !important;
    width: auto !important;
    margin-top: 0 !important;
  }
}

/* Mobile keeps buttons readable and stacked. */
@media (max-width: 560px) {
  .homepage-ops-section .ops-feature-actions,
  .ownership-section .ownership-actions,
  .hero-actions,
  .hero__actions,
  .page-hero__actions {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
  }

  .homepage-ops-section .ops-feature-actions .btn,
  .ownership-section .ownership-actions .btn,
  .hero-actions .btn,
  .hero__actions .btn,
  .page-hero__actions .btn {
    width: 100% !important;
  }
}

/* v48: Sales page intro width and AI heading standardization */
.sales-priorities-intro {
  max-width: none !important;
  width: 100%;
}

.sales-priorities-intro .section-title,
.sales-priorities-intro .section-lead {
  max-width: none !important;
  width: 100%;
}

.sales-ai-intro .section-title {
  font-size: clamp(34px, 4.2vw, 56px) !important;
  line-height: 1.16 !important;
}


/* v62: Marketing hero visual aligned to Sales hero style */
.marketing-hero-v22 .marketing-hero-split__right {
  padding: 72px max(40px, calc((100vw - var(--max)) / 2)) 64px 8vw;
  background:
    radial-gradient(circle at 54% 42%, rgba(255,255,255,0.68), transparent 30%),
    linear-gradient(135deg, #f8ebd9 0%, #f2dfc9 100%);
  display: flex;
  align-items: center;
  justify-content: center;
}

.marketing-hero-visual {
  position: relative;
  width: min(520px, 100%);
  min-height: 420px;
  overflow: hidden;
  border-radius: 36px;
  background:
    radial-gradient(circle at 76% 26%, rgba(240, 187, 93, 0.20), transparent 28%),
    linear-gradient(145deg, rgba(255,255,255,0.42), rgba(255,255,255,0.16));
  border: 1px solid rgba(47,55,68,0.10);
  box-shadow: 0 26px 70px rgba(13,22,34,0.10);
}

.marketing-hero-visual__arc {
  position: absolute;
  border-radius: 50%;
  border: 1px solid rgba(196,123,15,0.36);
  pointer-events: none;
}

.marketing-hero-visual__arc--1 {
  width: 520px;
  height: 520px;
  right: -150px;
  top: 30px;
}

.marketing-hero-visual__arc--2 {
  width: 390px;
  height: 390px;
  right: -56px;
  top: 94px;
  border-color: rgba(47,55,68,0.14);
}

.marketing-hero-visual__arc--3 {
  width: 260px;
  height: 260px;
  right: 28px;
  top: 160px;
  border-color: rgba(196,123,15,0.16);
}

.marketing-hero-visual__glow {
  position: absolute;
  left: 38px;
  top: 54px;
  width: 220px;
  height: 150px;
  background: linear-gradient(180deg, rgba(240,187,93,0.16), rgba(240,187,93,0));
  transform: skewX(-24deg);
  filter: blur(1px);
}

.marketing-hero-visual__channels {
  position: absolute;
  left: 42px;
  top: 44px;
  display: flex;
  gap: 14px;
}

.marketing-hero-visual__channels span {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: rgba(255,255,255,0.64);
  border: 1px solid rgba(47,55,68,0.10);
  box-shadow: 0 0 0 8px rgba(255,255,255,0.16);
}

.marketing-hero-visual__channels span:nth-child(2),
.marketing-hero-visual__channels span:nth-child(4) {
  background: rgba(240,187,93,0.82);
}

.marketing-hero-visual__graph {
  position: absolute;
  left: 42px;
  right: 152px;
  bottom: 78px;
  height: 190px;
}

.marketing-hero-visual__graph-lines {
  position: absolute;
  inset: 0;
  display: grid;
  gap: 28px;
}

.marketing-hero-visual__graph-lines span {
  display: block;
  height: 1px;
  background: linear-gradient(90deg, rgba(47,55,68,0.08), rgba(196,123,15,0.28), rgba(47,55,68,0.08));
}

.marketing-hero-visual__graph svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.marketing-hero-visual__graph path {
  stroke: rgba(47,55,68,0.78);
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.marketing-hero-visual__graph circle {
  fill: #f0bb5d;
  stroke: rgba(255,255,255,0.85);
  stroke-width: 3;
}

.marketing-hero-visual__metrics {
  position: absolute;
  right: 58px;
  bottom: 84px;
  display: flex;
  align-items: end;
  gap: 12px;
}

.marketing-hero-visual__metric {
  width: 18px;
  border-radius: 10px 10px 0 0;
  background: linear-gradient(180deg, rgba(47,55,68,0.55), rgba(47,55,68,0.16));
  border: 1px solid rgba(47,55,68,0.08);
}

.marketing-hero-visual__metric:nth-child(1) { height: 58px; }
.marketing-hero-visual__metric:nth-child(2) { height: 96px; }
.marketing-hero-visual__metric:nth-child(3) { height: 138px; }

.marketing-hero-visual__metric--gold {
  background: linear-gradient(180deg, rgba(240,187,93,0.90), rgba(240,187,93,0.28));
}

.marketing-hero-visual__cards {
  position: absolute;
  right: 52px;
  top: 62px;
  display: grid;
  gap: 14px;
}

.marketing-hero-visual__card {
  width: 118px;
  height: 68px;
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(255,255,255,0.72), rgba(255,255,255,0.40));
  border: 1px solid rgba(47,55,68,0.08);
  box-shadow: 0 16px 40px rgba(13,22,34,0.08);
}

.marketing-hero-visual__card--large {
  width: 146px;
  height: 76px;
}

.marketing-hero-visual__card--short {
  width: 98px;
  height: 56px;
}

@media (max-width: 980px) {
  .marketing-hero-v22 .marketing-hero-split__right {
    padding: 30px 22px 34px;
  }

  .marketing-hero-visual {
    width: min(520px, 100%);
  }
}

@media (max-width: 760px) {
  .marketing-hero-v22 .marketing-hero-split__right {
    padding: 20px 16px 26px;
  }

  .marketing-hero-visual {
    min-height: 235px;
    border-radius: 24px;
  }

  .marketing-hero-visual__channels {
    left: 24px;
    top: 24px;
    gap: 10px;
  }

  .marketing-hero-visual__channels span {
    width: 12px;
    height: 12px;
    box-shadow: 0 0 0 5px rgba(255,255,255,0.14);
  }

  .marketing-hero-visual__arc--1 {
    width: 330px;
    height: 330px;
    right: -92px;
    top: 8px;
  }

  .marketing-hero-visual__arc--2 {
    width: 242px;
    height: 242px;
    right: -28px;
    top: 52px;
  }

  .marketing-hero-visual__arc--3 {
    width: 165px;
    height: 165px;
    right: 28px;
    top: 98px;
  }

  .marketing-hero-visual__glow {
    left: 22px;
    top: 34px;
    width: 120px;
    height: 84px;
  }

  .marketing-hero-visual__cards {
    right: 24px;
    top: 34px;
    gap: 8px;
  }

  .marketing-hero-visual__card {
    width: 70px;
    height: 38px;
    border-radius: 10px;
  }

  .marketing-hero-visual__card--large {
    width: 86px;
    height: 44px;
  }

  .marketing-hero-visual__card--short {
    width: 58px;
    height: 30px;
  }

  .marketing-hero-visual__graph {
    left: 24px;
    right: 88px;
    bottom: 42px;
    height: 108px;
  }

  .marketing-hero-visual__graph-lines {
    gap: 15px;
  }

  .marketing-hero-visual__graph path {
    stroke-width: 2.5;
  }

  .marketing-hero-visual__graph circle {
    stroke-width: 2.5;
  }

  .marketing-hero-visual__metrics {
    right: 26px;
    bottom: 42px;
    gap: 7px;
  }

  .marketing-hero-visual__metric {
    width: 11px;
  }

  .marketing-hero-visual__metric:nth-child(1) { height: 30px; }
  .marketing-hero-visual__metric:nth-child(2) { height: 52px; }
  .marketing-hero-visual__metric:nth-child(3) { height: 74px; }
}


/* v62: Align Marketing hero typography and spacing with Sales hero */
.marketing-hero-v22 .marketing-hero-split__content {
  width: min(620px, calc(100% - 96px));
  max-width: 760px;
  padding: 84px 0;
}

.marketing-hero-v22 h1 {
  font-size: clamp(42px, 5.4vw, 68px);
  line-height: 1.02;
  max-width: 760px;
}

.marketing-hero-v22 .marketing-hero-split__content > p {
  margin-top: 22px;
  color: rgba(255,255,255,.78);
  font-size: 20px;
  line-height: 1.6;
  max-width: 760px;
}

.marketing-hero-v22 .marketing-hero-btn {
  margin-top: 26px;
}

@media (max-width: 760px) {
  .marketing-hero-v22 .marketing-hero-split__content {
    width: min(100% - 44px, 620px);
    max-width: none;
    padding: 54px 0 42px;
  }

  .marketing-hero-v22 h1 {
    font-size: clamp(3rem, 14vw, 4.5rem);
    line-height: 0.96;
    max-width: 100%;
  }

  .marketing-hero-v22 .marketing-hero-split__content > p {
    margin-top: 22px;
    font-size: 0.98rem;
    line-height: 1.55;
    max-width: 100%;
  }

  .marketing-hero-v22 .marketing-hero-btn {
    margin-top: 26px;
  }
}


/* v63: Marketing Operations hero matches Sales Operations hero structure */
.marketing-hero-v63 {
  background:
    radial-gradient(circle at 78% 24%, rgba(196, 123, 15, 0.16), transparent 30%),
    linear-gradient(135deg, #071322 0%, #111f32 56%, #18263a 100%);
}

.marketing-hero-grid--visual {
  grid-template-columns: 1fr .95fr;
  align-items: center;
  gap: 42px;
}

.marketing-hero-v63 .page-hero__copy {
  max-width: 760px;
}

.marketing-hero-v63 .marketing-hero-eyebrow {
  color: #f0bb5d !important;
  letter-spacing: .20em;
}

.marketing-hero-v63 .marketing-hero-eyebrow::after {
  content: "";
  display: block;
  width: 72px;
  height: 2px;
  margin-top: 18px;
  margin-bottom: 24px;
  background: #f0bb5d;
}

.marketing-hero-v63 h1 {
  color: var(--white);
  font-family: 'Instrument Serif', Georgia, 'Times New Roman', serif;
  font-weight: 400;
  font-size: clamp(42px, 5.4vw, 68px);
  line-height: 1.02;
  max-width: 760px;
}

.marketing-hero-v63 .page-hero__copy > p:not(.eyebrow):not(.marketing-hero-statement) {
  color: rgba(255,255,255,.78);
  font-size: 20px;
  line-height: 1.6;
  max-width: 760px;
  margin-top: 22px;
}

.marketing-hero-actions--single {
  margin-top: 26px;
}

.marketing-hero-statement {
  margin-top: 28px !important;
  max-width: 700px !important;
  color: rgba(255,255,255,.82) !important;
  font-family: 'Instrument Serif', Georgia, 'Times New Roman', serif;
  font-size: clamp(1.5rem, 2.2vw, 2rem) !important;
  line-height: 1.28 !important;
}

.marketing-hero-v63 .marketing-hero-visual {
  width: 100%;
  min-height: 420px;
  background:
    radial-gradient(circle at 78% 28%, rgba(240, 187, 93, 0.18), transparent 28%),
    linear-gradient(145deg, rgba(255,255,255,0.12), rgba(255,255,255,0.04));
  border: 1px solid rgba(255,255,255,0.10);
  box-shadow: none;
}

.marketing-hero-v63 .marketing-hero-visual__card {
  background: linear-gradient(145deg, rgba(255,255,255,0.30), rgba(255,255,255,0.12));
  border-color: rgba(255,255,255,0.10);
}

.marketing-hero-v63 .marketing-hero-visual__graph path {
  stroke: rgba(255,255,255,0.70);
}

.marketing-hero-v63 .marketing-hero-visual__metric {
  background: linear-gradient(180deg, rgba(255,255,255,0.65), rgba(255,255,255,0.16));
  border-color: rgba(255,255,255,0.10);
}

.marketing-hero-v63 .marketing-hero-visual__metric--gold {
  background: linear-gradient(180deg, rgba(240,187,93,0.85), rgba(240,187,93,0.24));
}

.marketing-hero-v63 + .marketing-buckets-section {
  border-top: 1px solid rgba(47,55,68,.10);
}

@media (max-width: 1100px) {
  .marketing-hero-grid--visual {
    grid-template-columns: 1fr;
  }

  .marketing-hero-v63 .marketing-hero-visual {
    max-width: 760px;
  }
}

@media (max-width: 760px) {
  .marketing-hero-v63 {
    padding-top: 0;
  }

  .marketing-hero-v63 .container,
  .marketing-hero-v63 .page-hero__copy {
    width: auto;
  }

  .marketing-hero-grid--visual {
    display: block;
    margin-left: 22px;
    margin-right: 22px;
  }

  .marketing-hero-v63 .page-hero__copy {
    padding-top: 54px;
    padding-left: 0;
    padding-right: 0;
  }

  .marketing-hero-v63 .marketing-hero-eyebrow {
    font-size: 0.9rem;
    letter-spacing: 0.18em;
    margin-bottom: 24px;
  }

  .marketing-hero-v63 .marketing-hero-eyebrow::after {
    width: 72px;
    margin-top: 14px;
    margin-bottom: 20px;
  }

  .marketing-hero-v63 h1 {
    font-size: clamp(3rem, 14vw, 4.5rem);
    line-height: 0.96;
    max-width: 100%;
  }

  .marketing-hero-v63 .page-hero__copy > p:not(.eyebrow):not(.marketing-hero-statement) {
    margin-top: 22px;
    font-size: 0.98rem;
    line-height: 1.55;
    max-width: 100%;
  }

  .marketing-hero-actions--single {
    margin-top: 26px;
  }

  .marketing-hero-actions--single .btn {
    width: 100%;
    justify-content: center;
  }

  .marketing-hero-statement {
    margin-top: 24px !important;
    font-size: clamp(1.35rem, 7vw, 1.9rem) !important;
  }

  .marketing-hero-v63 .marketing-hero-visual {
    min-height: 235px;
    margin-top: 26px;
    border-radius: 24px;
  }
}

@media (max-width: 480px) {
  .marketing-hero-grid--visual {
    margin-left: 20px;
    margin-right: 20px;
  }

  .marketing-hero-v63 h1 {
    font-size: clamp(2.8rem, 14vw, 3.75rem);
  }

  .marketing-hero-v63 .marketing-hero-visual {
    min-height: 215px;
  }
}

.marketing-hero-graphic-section .container {
  position: relative;
  z-index: 1;
}

.marketing-hero-graphic {
  position: absolute;
  top: -32px;
  right: max(-96px, calc((100vw - var(--max)) / 2 - 150px));
  width: clamp(480px, 42vw, 650px);
  min-width: 480px;
  aspect-ratio: 1 / 1;
  opacity: 0.74;
  overflow: visible;
  pointer-events: none;
  z-index: 0;
}

.marketing-hero-graphic .hero-orbit--outer {
  inset: 0 !important;
  width: auto !important;
  height: auto !important;
  border-color: rgba(255, 255, 255, 0.13);
}

.marketing-hero-graphic .hero-orbit--middle {
  inset: 14% !important;
  width: auto !important;
  height: auto !important;
  border-color: rgba(240, 187, 93, 0.40);
}

.marketing-hero-graphic .hero-orbit--inner {
  inset: 28% !important;
  width: auto !important;
  height: auto !important;
  border-color: rgba(255, 255, 255, 0.15);
}

.marketing-hero-graphic .hero-graph-grid {
  left: 19% !important;
  right: 16% !important;
  top: 38% !important;
  bottom: 19% !important;
  width: auto !important;
  height: auto !important;
}

.marketing-hero-graphic .marketing-hero-funnel {
  left: 21% !important;
  right: 18% !important;
  bottom: 19% !important;
  top: auto !important;
  width: auto !important;
  height: 40% !important;
  position: absolute;
  display: grid;
  align-content: center;
  gap: 10px;
  z-index: 2;
}

.marketing-hero-funnel__flow {
  position: absolute;
  inset: -18px -28px;
  z-index: 0;
}

.marketing-hero-funnel__flow svg {
  width: 100%;
  height: 100%;
  overflow: visible;
}

.marketing-hero-funnel__flow path {
  stroke: rgba(255, 255, 255, 0.22);
  stroke-width: 2;
  stroke-linecap: round;
  stroke-dasharray: 7 9;
}

.marketing-hero-funnel span {
  position: relative;
  z-index: 2;
  display: block;
  height: 24px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.18), rgba(240, 187, 93, 0.88), rgba(255, 255, 255, 0.14));
  border: 1px solid rgba(255, 255, 255, 0.16);
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.18);
}

.marketing-hero-funnel span:nth-of-type(1) {
  width: 100%;
}

.marketing-hero-funnel span:nth-of-type(2) {
  width: 82%;
  justify-self: center;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.14), rgba(240, 187, 93, 0.74), rgba(255, 255, 255, 0.12));
}

.marketing-hero-funnel span:nth-of-type(3) {
  width: 64%;
  justify-self: center;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.12), rgba(240, 187, 93, 0.60), rgba(255, 255, 255, 0.10));
}

.marketing-hero-funnel span:nth-of-type(4) {
  width: 46%;
  justify-self: center;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.10), rgba(107, 128, 148, 0.72), rgba(255, 255, 255, 0.09));
}

.marketing-hero-funnel span:nth-of-type(5) {
  width: 28%;
  justify-self: center;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.08), rgba(107, 128, 148, 0.58), rgba(255, 255, 255, 0.08));
}

.marketing-hero-funnel__node {
  position: absolute;
  z-index: 3;
  width: 13px;
  height: 13px;
  border-radius: 999px;
  background: #f0bb5d;
  box-shadow:
    0 0 0 7px rgba(240, 187, 93, 0.13),
    0 0 22px rgba(240, 187, 93, 0.34);
}

.marketing-hero-funnel__node--one {
  left: 16%;
  top: 31%;
}

.marketing-hero-funnel__node--two {
  right: 20%;
  top: 45%;
}

.marketing-hero-funnel__node--three {
  left: 48%;
  bottom: 10%;
  background: rgba(107, 128, 148, 0.95);
}

.marketing-hero-graphic .hero-dot-matrix {
  right: 20% !important;
  top: 29% !important;
  width: 178px;
  height: 126px;
}

@media (max-width: 980px) {
  .marketing-hero-graphic {
    display: none;
  }
}

/* =========================================================
   About page additions — The Operating Point
   ========================================================= */
.about-page-hero .page-hero__copy { max-width: 880px; }
.section--dark .section-title { color: var(--white); }
.section--dark .eyebrow { color: var(--precision); }

.tp-figs { display:grid; grid-template-columns:repeat(4,1fr); gap:0; margin-top:40px; border-top:1px solid var(--line); }
.tp-fig { padding:26px 24px 0 0; border-right:1px solid var(--line); }
.tp-fig:last-child { border-right:none; }
.tp-fig .n { font-family: var(--font-display); font-size: clamp(2.6rem, 2rem + 3vw, 4rem); line-height:.95; color: var(--midnight); letter-spacing:-0.02em; }
.tp-fig .l { margin-top:14px; font-size:.9rem; color: var(--steel); line-height:1.4; }
.tp-note { margin-top:42px; font-size:1.05rem; max-width:100%; color: rgba(47,55,68,.82); }
.tp-note strong { color: var(--midnight); font-weight:600; }
.about-how-section .section-title,
.about-how-section .section-lead {
  max-width: 1000px;
}
@media (max-width:760px){ .tp-figs{ grid-template-columns:1fr 1fr; } .tp-fig:nth-child(2){border-right:none;} .tp-fig{ padding-bottom:24px; border-bottom:1px solid var(--line);} }
@media (max-width:460px){ .tp-figs{ grid-template-columns:1fr; } .tp-fig{ border-right:none; } }

/* AI moment + About preview (homepage) */
.ai-moment-actions { display:flex; gap:30px; align-items:center; flex-wrap:wrap; margin-top:32px; }
.ai-moment-actions .link-arrow { margin-top:0; }
.about-preview-button { margin-top:30px; }
.about-preview-section .section-lead { max-width: 760px; }

/* =========================================================
   Step 2 — visual signature (hero, dot motif, AI note)
   ========================================================= */
.op-hero { padding: clamp(74px, 9vw, 104px) 0 clamp(60px, 7vw, 84px); }
.op-hero--home {
  background:
    radial-gradient(circle at 74% 18%, rgba(196, 123, 15, 0.20), transparent 30%),
    radial-gradient(circle at 18% 82%, rgba(107, 128, 148, 0.18), transparent 32%),
    linear-gradient(135deg, var(--midnight-deep) 0%, var(--midnight) 56%, #252d3b 100%);
  color: var(--white);
  border-bottom: 1px solid rgba(255, 255, 255, 0.10);
}

.op-hero--home::before {
  background-image: radial-gradient(rgba(215, 211, 206, 0.14) 1px, transparent 1px);
  background-size: 24px 24px;
  opacity: 0.72;
  mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.18) 35%, rgba(0,0,0,.70) 76%, transparent 100%);
}

.op-hero--home::after {
  content: "";
  position: absolute;
  right: -140px;
  top: 96px;
  width: 460px;
  height: 460px;
  border: 1px solid rgba(196, 123, 15, 0.32);
  border-radius: 50%;
  pointer-events: none;
}

.op-hero .accent { color: var(--precision); }
.op-hero--home h1 > span { display: block; }
.op-hero--home .container {
  position: relative;
  z-index: 1;
}

.op-hero--home .hero-background-graphic {
  position: absolute !important;
  top: -42px;
  right: max(-118px, calc((100vw - var(--max)) / 2 - 178px));
  width: clamp(540px, 46vw, 710px) !important;
  min-width: 540px !important;
  min-height: 520px;
  aspect-ratio: 1 / 1 !important;
  opacity: 0.86;
  overflow: visible !important;
  pointer-events: none;
  z-index: 0;
}

.op-hero--home .hero-background-graphic .hero-orbit--outer {
  inset: 0 !important;
  width: auto !important;
  height: auto !important;
  border-color: rgba(255, 255, 255, 0.14);
}

.op-hero--home .hero-background-graphic .hero-orbit--middle {
  inset: 13% !important;
  width: auto !important;
  height: auto !important;
  border-color: rgba(240, 187, 93, 0.46);
}

.op-hero--home .hero-background-graphic .hero-orbit--inner {
  inset: 27% !important;
  width: auto !important;
  height: auto !important;
  border-color: rgba(255, 255, 255, 0.16);
}

.op-hero--home .hero-background-graphic .hero-graph-grid {
  left: 18% !important;
  right: 14% !important;
  top: 36% !important;
  bottom: 19% !important;
  width: auto !important;
  height: auto !important;
}

.op-hero--home .hero-background-graphic .hero-graph-bars {
  left: 20% !important;
  right: 16% !important;
  bottom: 19% !important;
  top: auto !important;
  width: auto !important;
  height: 42% !important;
  gap: clamp(8px, 1vw, 15px);
}

.op-hero--home .hero-background-graphic .hero-dot-matrix {
  right: 20% !important;
  top: 28% !important;
  width: 205px;
  height: 145px;
}

@media (max-width: 980px) {
  .op-hero--home .hero-background-graphic {
    display: none;
  }
}

.op-baseline { margin: clamp(26px, 4vw, 40px) 0; max-width: 720px; }
.op-baseline svg { width: 100%; height: 34px; display: block; }
.op-hero-lead { color: rgba(255,255,255,.8); font-size: 20px; max-width: 50ch; margin: 0; }
.op-hero--home .op-hero-lead { max-width: 68ch; }
.op-hero .marketing-hero-statement { color: var(--slate); margin: 22px 0 0; font-size: 15px; max-width: 54ch; }
.op-hero-cta { display: flex; gap: 14px; margin-top: 32px; flex-wrap: wrap; }
.op-hero .btn--secondary { background: transparent; border: 1.5px solid rgba(255,255,255,.42); color: #fff; box-shadow: none; }
.op-hero .btn--secondary:hover { border-color: var(--precision); color: var(--precision); background: transparent; }

.operating-definition {
  background: #efe3d2;
  border-bottom: 1px solid rgba(47,55,68,.12);
}

.operating-definition__inner {
  display: block;
  max-width: none;
  margin-left: auto;
  margin-right: auto;
  padding: clamp(20px, 3vw, 32px) 0;
}

.operating-definition__term,
.operating-definition__body {
  max-width: 860px;
}

.operating-definition__term h2 {
  margin: 0;
  color: var(--midnight);
  font-family: Georgia, 'Times New Roman', Times, serif;
  font-size: clamp(2rem, 3vw, 2.85rem);
  font-weight: 400;
  line-height: 1.05;
  letter-spacing: normal;
  text-transform: lowercase;
}

.operating-definition__term p {
  margin: 4px 0 0;
  color: rgba(47,55,68,.7);
  font-family: Georgia, 'Times New Roman', Times, serif;
  font-size: 1.08rem;
  font-style: italic;
  line-height: 1.2;
}

.operating-definition__body {
  max-width: 840px;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(47,55,68,.16);
}

.operating-definition__body p {
  margin: 0;
  color: rgba(47,55,68,.86);
  font-size: clamp(1rem, 1.35vw, 1.18rem);
  line-height: 1.7;
}

.operating-definition__body p:first-child {
  color: var(--midnight);
  font-size: clamp(1.08rem, 1.65vw, 1.35rem);
  line-height: 1.55;
}

.operating-definition__body p + p {
  margin-top: 12px;
}

/* wordmark "point" dot */
.brand__pt { display:inline-block; width:5px; height:5px; border-radius:50%; background:var(--precision); margin-left:5px; vertical-align: baseline; }

/* eyebrow dot (skip centered eyebrows, which carry their own rules) */
.eyebrow:not(.eyebrow--centered)::before,
.section-eyebrow:not(.eyebrow--centered)::before {
  content:""; display:inline-block; width:7px; height:7px; border-radius:50%;
  background: var(--precision); margin-right:.6em; vertical-align: middle; position: relative; top: -1px;
}

/* calibration section break */
.op-topcalib { position: relative; }
.op-topcalib::before {
  content:""; position:absolute; top:0; left:50%; transform:translateX(-50%);
  width:min(88%, var(--max)); height:1px;
  background: linear-gradient(to right, transparent, rgba(107,128,148,.45) 8%, rgba(107,128,148,.45) 92%, transparent);
}
.op-topcalib::after {
  content:""; position:absolute; top:-4px; left:62%; transform:translateX(-50%);
  width:9px; height:9px; border-radius:50%; background: var(--precision);
}

/* AI note — refined / quieter (replaces the circular AI badge) */
.ai-note-refined { border-left: 3px solid var(--precision); padding: 4px 0 4px 20px; max-width: none; width: 100%; margin-top: 12px; }
.ai-note-refined__label { display:inline-flex; align-items:center; gap:.55em; font-size:12px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color: var(--precision); margin-bottom: 8px; }
.ai-note-refined__dot { width:6px; height:6px; border-radius:50%; background: var(--precision); }
.ai-note-refined p { margin: 0; font-size: 15px; color: inherit; opacity: .9; }
.ai-note-refined strong { color: inherit; opacity: 1; font-weight: 600; }

/* Homepage color alternation */
.ai-moment-section {
  background:
    radial-gradient(circle at 82% 18%, rgba(196,123,15,.13), transparent 28%),
    linear-gradient(135deg, #071322 0%, #111f32 58%, #18263a 100%);
  color: var(--white);
}

.ai-moment-section .section-title,
.ai-moment-section .eyebrow {
  color: var(--white);
}

.ai-moment-section .section-lead {
  color: rgba(255,255,255,.78);
}

.ai-moment-section .link-arrow,
.ownership-section .ownership-way-button,
.ownership-section .ownership-way-button:visited {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 14px 20px;
  border: 1.5px solid rgba(244,211,154,.78) !important;
  border-radius: 14px;
  color: #f4d39a !important;
  background: transparent !important;
  box-shadow: none;
  text-decoration: none;
  white-space: nowrap;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  line-height: 1;
  text-transform: uppercase;
  transition: transform 160ms ease, border-color 160ms ease, background 160ms ease, color 160ms ease;
}

.ai-moment-section .link-arrow:hover,
.ownership-section .ownership-way-button:hover {
  color: #ffdca3 !important;
  border-color: rgba(255,220,163,.96) !important;
  background: rgba(213,149,49,.10) !important;
  transform: translateY(-1px);
}

.about-preview-section {
  background:
    radial-gradient(circle at 16% 18%, rgba(196,123,15,.12), transparent 28%),
    linear-gradient(135deg, #efe3d2 0%, #f7efe3 58%, #fbf7ef 100%);
  color: var(--midnight);
}

.about-preview-section .section-title {
  color: var(--midnight);
}

.about-preview-section .eyebrow {
  color: var(--precision);
}

.about-preview-section .section-lead {
  max-width: 1000px;
  color: rgba(47,55,68,.76);
}

.ownership-section {
  background:
    radial-gradient(circle at 18% 20%, rgba(196,123,15,.14), transparent 28%),
    radial-gradient(circle at 86% 82%, rgba(107,128,148,.14), transparent 32%),
    linear-gradient(135deg, #071322 0%, #111f32 58%, #18263a 100%);
  color: var(--white);
  border-top-color: rgba(255,255,255,.10);
  border-bottom-color: rgba(255,255,255,.12);
}

.ownership-section .eyebrow,
.ownership-section .ownership-title,
.ownership-card h3 {
  color: var(--white) !important;
}

.ownership-section .ownership-title span {
  color: var(--white) !important;
}

.ownership-lead,
.ownership-card p {
  color: rgba(255,255,255,.76);
}

/* Marketing Operations page: align section header scale with the top hero header. */
.marketing-buckets-intro .section-title,
.marketing-implementation-section .section-title,
.marketing-ai-intro .section-title,
.marketing-contact-section .section-title {
  font-size: clamp(42px, 5.4vw, 68px) !important;
  line-height: 1.02;
}

.ownership-card {
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.14);
  box-shadow: none;
}

.ownership-card-icon {
  color: #f0bb5d;
  background: rgba(240,187,93,.10);
  border-color: rgba(240,187,93,.24);
}

.ownership-section .ownership-actions a.btn.ownership-way-button,
.ownership-section .ownership-actions a.btn.ownership-way-button:visited {
  color: #f4d39a !important;
  border: 1.5px solid rgba(244,211,154,.78) !important;
  background: transparent !important;
  box-shadow: none !important;
}

.ownership-section .ownership-actions a.btn.ownership-way-button span {
  color: inherit !important;
}

.ownership-section .ownership-actions a.btn.ownership-way-button:hover {
  color: #ffdca3 !important;
  border-color: rgba(255,220,163,.96) !important;
  background: rgba(213,149,49,.10) !important;
}

/* ============================================================
   Hero headline typesetting refinement
   ============================================================ */

/* Desktop: balance any line that wraps inside the stacked headline
   so no single line runs noticeably longer than the others. */
.op-hero--home h1 {
  text-wrap: balance;
}

/* Mobile: collapse the three fixed desktop lines into one balanced
   headline (via data-mobile-title) so the desktop breaks don't wrap
   awkwardly on narrow screens. Placed at end of file so it reliably
   overrides the desktop `display: block` span rule. */
@media (max-width: 760px) {
  .op-hero--home h1 {
    font-size: clamp(2.55rem, 11.5vw, 3.5rem);
    line-height: 1.07;
    max-width: 14em;
  }
  /* Show the real headline so the amber accents on "sales execution" and
     "marketing performance" carry through to mobile. Spans flow inline and
     wrap as one sentence (the source whitespace supplies the word spacing),
     instead of swapping to plain data-mobile-title text. */
  .op-hero--home h1 > span { display: inline; }
  .op-hero--home h1::before { content: none; }
}

/* ============================================================
   Homepage redesign — hero definition, trimmed service grids,
   and dark-to-dark section seam
   ============================================================ */

/* Small "operating point" definition, folded into the hero under the lead.
   Quiet by design: steel keyline, dimmed body, serif term — it reads as a
   margin note, not a second headline. */
.op-hero-def {
  margin: 56px 0 0;
  max-width: 52ch;
  padding: 18px 22px 18px 20px;
  border: 1px solid rgba(107, 128, 148, 0.34);
  border-left: 3px solid var(--precision);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.035);
  color: rgba(255, 255, 255, 0.68);
  font-size: 15px;
  line-height: 1.62;
}
.op-hero-def__term {
  font-family: var(--font-display);
  font-style: italic;
  font-size: 19px;
  color: #fff;
  margin-right: 9px;
}
.op-hero-def__pos {
  color: var(--slate);
  font-style: italic;
  font-size: 13px;
  margin-right: 10px;
}

/* Crisp seam between the two consecutive dark sections (hero → Sales). */
.sales-ops-feature {
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

/* Sitewide major heading scale: match the homepage hero headline. */
.page-hero h1,
.hero h1,
.section-title,
.ops-feature-copy h2,
.sales-headline,
.marketing-headline,
.ownership-title,
.pillars__intro h2,
.cta-card h2,
.about-copy h2 {
  font-size: clamp(42px, 5.4vw, 68px) !important;
}

@media (max-width: 760px) {
  .page-hero h1,
  .hero h1,
  .section-title,
  .ops-feature-copy h2,
  .sales-headline,
  .marketing-headline,
  .ownership-title,
  .pillars__intro h2,
  .cta-card h2,
  .about-copy h2 {
    font-size: clamp(2.55rem, 11.5vw, 3.5rem) !important;
  }
}


/* ============================================================
   About headshot — fills the existing matted frame
   ============================================================ */
.about-photo-frame .about-photo-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 12px;
  display: block;
  align-self: stretch;
  justify-self: stretch;
}