:root {
  --ink: #201d19;
  --muted: #6f685f;
  --paper: #fffaf2;
  --cream: #f7eddf;
  --orange: #ff5a1f;
  --orange-dark: #d83f0b;
  --peach: #ffb38f;
  --lime: #d9ff67;
  --line: rgba(32, 29, 25, 0.14);
  --shadow: 0 24px 70px rgba(80, 35, 12, 0.12);
  --radius: 28px;
  --max: 1240px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; overflow-x: clip; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: "DM Sans", system-ui, sans-serif;
  font-size: 16px;
  line-height: 1.6;
  /* `clip` instead of `hidden`: hidden makes body a scroll container, which
     stops position:sticky sidebars from sticking. */
  overflow-x: clip;
}
/* html is the scrolling element, so it must be locked too or the page
   keeps scrolling behind the open mobile menu. */
html.menu-open, body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
img, svg { display: block; max-width: 100%; }
button, input, textarea { font: inherit; }

.skip-link {
  position: fixed;
  z-index: 1000;
  top: 10px;
  left: 10px;
  padding: 10px 16px;
  background: var(--ink);
  color: white;
  transform: translateY(-150%);
}
.skip-link:focus { transform: none; }

.container { width: min(calc(100% - 40px), var(--max)); margin-inline: auto; }
.section { padding: 110px 0; position: relative; }
.section--dark { color: white; background: var(--ink); }
.section--orange { color: white; background: var(--orange); }
.section--cream { background: var(--cream); }

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin: 0 0 18px;
  color: var(--orange-dark);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.eyebrow::before {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: currentColor;
  content: "";
}
.section--dark .eyebrow, .section--orange .eyebrow { color: var(--lime); }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3, .display {
  font-family: "Manrope", system-ui, sans-serif;
  letter-spacing: -0.055em;
  line-height: 0.98;
}
h1 { font-size: clamp(3.35rem, 8vw, 7.8rem); }
h2 { max-width: 900px; font-size: clamp(2.4rem, 5vw, 5rem); }
h3 { font-size: clamp(1.35rem, 2vw, 1.9rem); }
.lead { max-width: 700px; color: var(--muted); font-size: clamp(1.05rem, 1.6vw, 1.32rem); }
.section--dark .lead, .section--orange .lead { color: rgba(255,255,255,.72); }
.accent { color: var(--orange); }
.scribble { position: relative; white-space: nowrap; }
.scribble::after {
  position: absolute;
  right: 0;
  bottom: -0.08em;
  left: 0;
  height: 0.12em;
  border-radius: 99px;
  background: var(--orange);
  content: "";
  transform: rotate(-1.2deg);
}

.site-header {
  position: fixed;
  z-index: 100;
  top: 0;
  right: 0;
  left: 0;
  transition: background .25s, box-shadow .25s;
}
.site-header.scrolled {
  background: rgba(255, 250, 242, 0.9);
  box-shadow: 0 8px 30px rgba(32,29,25,.06);
  backdrop-filter: blur(18px);
}
.nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 84px;
}
.brand {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 11px;
  font-family: "Manrope", system-ui, sans-serif;
  font-size: 1.5rem;
  font-weight: 800;
  letter-spacing: -.055em;
}
.brand-mark { width: 54px; height: 54px; transition: transform .3s cubic-bezier(.34,1.56,.64,1); }
.brand-mark-ink { fill: var(--brand-ink, #201d19); transition: fill .25s ease; }
.brand:hover .brand-mark { transform: rotate(-6deg) scale(1.08); }
.site-footer .brand { --brand-ink: #fffaf2; color: white; }
.nav-links { display: flex; align-items: center; gap: 30px; font-size: .92rem; font-weight: 700; }
.nav-links a:not(.button) { position: relative; }
.nav-links a:not(.button)::after {
  position: absolute;
  right: 0;
  bottom: -5px;
  left: 0;
  height: 2px;
  background: var(--orange);
  content: "";
  transform: scaleX(0);
  transform-origin: right;
  transition: transform .25s;
}
.nav-links a:hover::after { transform: scaleX(1); transform-origin: left; }
.nav-phone {
  color: var(--orange);
  white-space: nowrap;
  letter-spacing: -.02em;
  font-variant-numeric: tabular-nums;
}
.menu-toggle { display: none; border: 0; background: transparent; font-weight: 800; }

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 52px;
  padding: 0 22px;
  border: 1px solid var(--ink);
  border-radius: 999px;
  background: var(--ink);
  color: white;
  font-weight: 800;
  transition: transform .2s, box-shadow .2s, background .2s;
}
.button:hover { transform: translateY(-3px); box-shadow: 0 12px 25px rgba(32,29,25,.15); }
.button--orange { border-color: var(--orange); background: var(--orange); }
.button--light { border-color: white; background: white; color: var(--ink); }
.button--ghost { background: transparent; color: var(--ink); }
.button--arrow::after { content: "↗"; }
.button-row { display: flex; flex-wrap: wrap; gap: 12px; }

.hero { min-height: 100svh; padding: 145px 0 70px; display: grid; align-items: center; }
.hero-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 50px; align-items: center; }
.hero h1 { margin-bottom: 28px; }
.hero .lead { max-width: 620px; margin-bottom: 32px; }
.hero-proof { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 38px; color: var(--muted); font-size: .82rem; font-weight: 700; }
.hero-proof span { display: inline-flex; align-items: center; gap: 8px; }
.hero-proof span::before { color: var(--orange); content: "●"; }

.hero-art { position: relative; display: grid; min-height: 590px; place-items: center; }
.orbit {
  position: absolute;
  inset: 5% 0 0 0;
  margin: auto;
  width: min(100%, 570px);
  height: min(100%, 570px);
  border: 1px solid var(--line);
  border-radius: 50%;
  animation: spin 28s linear infinite;
}
.orbit::before, .orbit::after {
  position: absolute;
  border: 1px solid var(--line);
  border-radius: 50%;
  content: "";
}
.orbit::before { inset: 13%; }
.orbit::after { inset: 28%; border-color: var(--orange); }
.orbit-dot { position: absolute; width: 15px; height: 15px; border: 4px solid var(--paper); border-radius: 50%; background: var(--orange); box-shadow: 0 0 0 1px var(--line); }
.orbit-dot:nth-child(1) { top: 7%; left: 24%; }
.orbit-dot:nth-child(2) { right: 3%; bottom: 35%; background: var(--lime); }
.orbit-dot:nth-child(3) { bottom: 8%; left: 23%; background: var(--ink); }
@keyframes spin { to { transform: rotate(360deg); } }
.dashboard {
  position: relative;
  z-index: 2;
  width: min(85%, 430px);
  padding: 24px;
  border: 1px solid rgba(255,255,255,.7);
  border-radius: 32px;
  background: rgba(255,255,255,.78);
  box-shadow: var(--shadow);
  /* Standalone `rotate` keeps the tilt out of `transform`, which GSAP animates. */
  rotate: -2deg;
  backdrop-filter: blur(18px);
}
.dash-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 22px; }
.dash-label { font-size: .77rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.status { padding: 5px 9px; border-radius: 999px; background: #e8ffd6; color: #247416; font-size: .7rem; font-weight: 800; }
.big-number { margin-bottom: 4px; font-family: "Manrope"; font-size: 3.3rem; font-weight: 800; letter-spacing: -.08em; line-height: 1; }
.delta { color: #247416; font-size: .85rem; font-weight: 800; }
.chart { height: 145px; margin: 24px 0; overflow: hidden; }
.chart svg { width: 100%; height: 100%; }
.dash-cards { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
.mini-stat { padding: 12px; border-radius: 15px; background: var(--cream); }
.mini-stat strong { display: block; font-size: 1rem; }
.mini-stat small { color: var(--muted); font-size: .65rem; }
.float-card {
  position: absolute;
  z-index: 3;
  padding: 13px 16px;
  border: 1px solid white;
  border-radius: 17px;
  background: rgba(255,255,255,.88);
  box-shadow: 0 14px 45px rgba(80,35,12,.13);
  font-size: .78rem;
  font-weight: 800;
  backdrop-filter: blur(12px);
  animation: float 4s ease-in-out infinite;
}
.float-card--one { top: 12%; right: 1%; }
.float-card--two { bottom: 14%; left: 0; animation-delay: -2s; }
@keyframes float { 50% { transform: translateY(-12px) rotate(1deg); } }

.logo-strip { overflow: hidden; border-block: 1px solid var(--line); background: white; }
.marquee { display: flex; width: max-content; animation: marquee 25s linear infinite; }
.marquee span { padding: 20px 32px; color: var(--muted); font-size: .78rem; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; white-space: nowrap; }
.marquee span::after { margin-left: 64px; color: var(--orange); content: "✦"; }
@keyframes marquee { to { transform: translateX(-50%); } }

.intro-grid { display: grid; grid-template-columns: .75fr 1.25fr; gap: 80px; }
.sticky-label { position: sticky; top: 120px; align-self: start; }
.statement { font-family: "Manrope"; font-size: clamp(2rem, 4.2vw, 4.2rem); font-weight: 800; letter-spacing: -.06em; line-height: 1.05; }

.cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; margin-top: 55px; }
.service-card {
  position: relative;
  min-height: 390px;
  padding: 34px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: white;
  transition: transform .25s, box-shadow .25s;
}
.service-card:hover { z-index: 2; box-shadow: var(--shadow); transform: translateY(-8px) rotate(-.5deg); }
.service-card:nth-child(4n+2), .service-card:nth-child(4n+3) { background: var(--cream); }
.card-index { color: var(--orange); font-size: .75rem; font-weight: 900; letter-spacing: .1em; }
.service-card h3 { margin: 70px 0 16px; font-size: clamp(1.9rem,3vw,3.2rem); }
.service-card p { max-width: 420px; color: var(--muted); }
.card-link { position: absolute; right: 30px; bottom: 28px; font-weight: 800; }
.card-icon { position: absolute; top: 22px; right: 25px; width: 82px; height: 82px; }
.service-card:hover .card-icon { transform: rotate(5deg) scale(1.08); }
.card-icon { transition: transform .3s ease; }

.trust-strip {
  overflow: hidden;
  padding: 30px 0;
}
.trust-label {
  margin-bottom: 20px;
  color: var(--muted);
  font-size: .74rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-align: center;
  text-transform: uppercase;
}
.trust-track {
  display: flex;
  width: max-content;
  animation: trust-marquee 48s linear infinite;
}
.trust-track:hover { animation-play-state: paused; }
.trust-set { display: flex; align-items: center; gap: 20px; padding-right: 20px; }
.trust-logo {
  display: grid;
  width: 208px;
  height: 104px;
  padding: 20px 26px;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: white;
  transition: border-color .25s, box-shadow .25s, transform .25s;
}
.trust-logo img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  /* Supplied marks ship on solid white; multiply drops the box onto the card. */
  mix-blend-mode: multiply;
  filter: grayscale(1);
  opacity: .68;
  transition: filter .3s, opacity .3s, transform .3s;
}
.trust-logo:hover { border-color: var(--orange); box-shadow: 0 14px 35px rgba(80,35,12,.1); transform: translateY(-5px); }
.trust-logo:hover img { filter: grayscale(0); opacity: 1; transform: scale(1.06); }
@keyframes trust-marquee { to { transform: translateX(-50%); } }

.landing-hero {
  min-height: 94svh;
  padding: 155px 0 90px;
  display: grid;
  align-items: center;
}
.landing-hero-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 65px; align-items: center; }
.landing-hero h1 { margin-bottom: 28px; font-size: clamp(3.2rem, 7vw, 7rem); }
.landing-hero .lead { margin-bottom: 32px; }
.landing-visual {
  position: relative;
  display: grid;
  min-height: 560px;
  place-items: center;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 40px;
  background: var(--cream);
}
.landing-visual::before {
  position: absolute;
  width: 390px;
  height: 390px;
  border: 1px dashed rgba(32,29,25,.2);
  border-radius: 50%;
  content: "";
  animation: spin 24s linear infinite;
}
.phone-mockup {
  position: relative;
  z-index: 2;
  width: 240px;
  min-height: 445px;
  padding: 46px 18px 20px;
  border: 9px solid var(--ink);
  border-radius: 42px;
  background: white;
  box-shadow: var(--shadow);
  transition: transform .35s ease;
}
.landing-visual:hover .phone-mockup { transform: translateY(-8px) rotate(-2deg); }
.phone-mockup::before {
  position: absolute;
  top: 12px;
  left: 50%;
  width: 78px;
  height: 18px;
  border-radius: 999px;
  background: var(--ink);
  content: "";
  transform: translateX(-50%);
}
.message {
  max-width: 88%;
  margin-bottom: 12px;
  padding: 12px 14px;
  border-radius: 17px 17px 17px 5px;
  background: var(--cream);
  font-size: .73rem;
  line-height: 1.35;
  transition: transform .25s ease;
}
.message--brand { margin-left: auto; border-radius: 17px 17px 5px; background: var(--orange); color: white; }
.message:hover { transform: translateX(4px); }
.linkedin-card {
  position: relative;
  z-index: 2;
  width: min(82%, 390px);
  padding: 25px;
  border: 1px solid var(--line);
  border-radius: 27px;
  background: white;
  box-shadow: var(--shadow);
  transition: transform .35s ease;
}
.landing-visual:hover .linkedin-card { transform: translateY(-8px) rotate(1.5deg); }
.profile-row { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; }
.profile-avatar { display: grid; width: 48px; height: 48px; place-items: center; border-radius: 50%; background: var(--orange); color: white; font-weight: 900; }
.profile-row small { display: block; color: var(--muted); }
.post-lines i { display: block; height: 10px; margin: 10px 0; border-radius: 99px; background: var(--cream); }
.post-lines i:nth-child(2) { width: 84%; }
.post-lines i:nth-child(3) { width: 60%; }
.engagement-row { display: flex; justify-content: space-between; margin-top: 22px; padding-top: 16px; border-top: 1px solid var(--line); color: var(--muted); font-size: .76rem; font-weight: 700; }
.channel-badge {
  position: absolute;
  z-index: 3;
  padding: 11px 15px;
  border-radius: 999px;
  background: white;
  box-shadow: 0 12px 30px rgba(80,35,12,.13);
  font-size: .74rem;
  font-weight: 800;
  animation: float 4s ease-in-out infinite;
}
.channel-badge--one { top: 12%; right: 5%; }
.channel-badge--two { bottom: 12%; left: 4%; animation-delay: -2s; }
.benefit-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 48px; }
.benefit-card { min-height: 245px; padding: 28px; border: 1px solid var(--line); border-radius: 24px; background: white; transition: transform .25s, box-shadow .25s, border-color .25s; }
.benefit-card:hover { border-color: var(--orange); box-shadow: var(--shadow); transform: translateY(-7px); }
.benefit-card b { display: grid; width: 38px; height: 38px; margin-bottom: 55px; place-items: center; border-radius: 50%; background: var(--orange); color: white; }
.benefit-card p { margin: 0; color: var(--muted); }

/* Standalone industry landing pages */
.industry-landing .landing-hero { overflow: hidden; }
.industry-art {
  position: relative;
  display: grid;
  min-height: 560px;
  place-items: center;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 40px;
  background:
    radial-gradient(circle at 20% 18%, rgba(255,179,143,.45), transparent 30%),
    radial-gradient(circle at 85% 80%, rgba(217,255,103,.5), transparent 32%),
    var(--cream);
}
.industry-art::before {
  position: absolute;
  width: 430px;
  height: 430px;
  border: 1px dashed rgba(32,29,25,.2);
  border-radius: 50%;
  content: "";
  animation: spin 28s linear infinite;
}
.journey-board {
  position: relative;
  z-index: 2;
  width: min(84%, 410px);
  padding: 26px;
  border: 1px solid rgba(255,255,255,.8);
  border-radius: 28px;
  background: rgba(255,255,255,.88);
  box-shadow: var(--shadow);
  backdrop-filter: blur(14px);
  transition: transform .35s cubic-bezier(.34,1.56,.64,1);
}
.industry-art:hover .journey-board { transform: translateY(-8px) rotate(-1deg); }
.journey-board-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 26px; }
.journey-board-head svg { width: 58px; height: 58px; padding: 10px; border-radius: 18px; background: var(--orange); color: white; }
.journey-board-head small { display: block; color: var(--muted); font-weight: 700; }
.journey-board-head strong { font-family: "Manrope"; font-size: 1.12rem; }
.journey-stage {
  display: grid;
  grid-template-columns: 34px 1fr auto;
  gap: 12px;
  align-items: center;
  padding: 13px 0;
  border-top: 1px solid var(--line);
  font-size: .82rem;
  font-weight: 800;
  transition: padding-left .2s, color .2s;
}
.journey-stage:hover { padding-left: 6px; color: var(--orange-dark); }
.journey-stage b { display: grid; width: 28px; height: 28px; place-items: center; border-radius: 50%; background: var(--cream); color: var(--orange-dark); font-size: .68rem; }
.journey-stage em { color: var(--muted); font-size: .67rem; font-style: normal; font-weight: 700; }
.industry-signal {
  position: absolute;
  z-index: 3;
  padding: 10px 14px;
  border: 1px solid rgba(255,255,255,.9);
  border-radius: 999px;
  background: rgba(255,255,255,.9);
  box-shadow: 0 12px 30px rgba(80,35,12,.13);
  font-size: .72rem;
  font-weight: 800;
  animation: float 4.5s ease-in-out infinite;
  backdrop-filter: blur(10px);
}
.industry-signal--top { top: 9%; right: 4%; }
.industry-signal--bottom { bottom: 10%; left: 3%; animation-delay: -2.2s; }
.outcome-list { display: grid; grid-template-columns: repeat(2,1fr); gap: 12px; margin-top: 42px; }
.outcome-item { padding: 22px; border: 1px solid var(--line); border-radius: 20px; background: white; transition: transform .25s, border-color .25s; }
.outcome-item:hover { border-color: var(--orange); transform: translateY(-5px); }
.outcome-item strong { display: block; margin-bottom: 7px; font-family: "Manrope"; font-size: 1.18rem; }
.outcome-item p { margin: 0; color: var(--muted); font-size: .9rem; }
.service-paths { display: grid; grid-template-columns: repeat(2,1fr); gap: 16px; margin-top: 46px; }
.service-path {
  position: relative;
  min-height: 250px;
  padding: 28px;
  border: 1px solid rgba(255,255,255,.17);
  border-radius: 24px;
  background: rgba(255,255,255,.035);
  transition: transform .25s, border-color .25s, background .25s;
}
.service-path:hover { border-color: var(--lime); background: rgba(255,255,255,.07); transform: translateY(-6px); }
.service-path small { color: var(--lime); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.service-path h3 { margin-top: 45px; }
.service-path p { color: rgba(255,255,255,.65); }
.service-path a { position: absolute; right: 26px; bottom: 24px; color: var(--lime); font-weight: 800; }
.industry-breadcrumbs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 25px; color: var(--muted); font-size: .78rem; font-weight: 700; }
.industry-breadcrumbs a:hover { color: var(--orange-dark); }
.industry-breadcrumbs span::before { margin-right: 8px; content: "→"; }
.related-industries { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 32px; }
.location-disclosure {
  margin-top: 32px;
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 22px;
  background: rgba(255,255,255,.46);
  box-shadow: 0 1px 0 rgba(255,255,255,.9) inset, 0 18px 44px rgba(68,43,26,.08);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.location-disclosure summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 20px 24px;
  cursor: pointer;
  list-style: none;
  font-family: "Manrope";
  font-weight: 800;
}
.location-disclosure summary::-webkit-details-marker { display: none; }
.location-disclosure summary span { color: var(--orange); font-size: 1.5rem; line-height: 1; transition: transform .2s ease; }
.location-disclosure[open] summary span { transform: rotate(45deg); }
.location-disclosure > .related-industries,
.location-disclosure > .service-paths { margin: 0; padding: 4px 24px 24px; }
.location-disclosure--dark {
  border-color: rgba(255,255,255,.2);
  background: rgba(255,255,255,.06);
  color: white;
}
.location-disclosure--dark summary span { color: var(--lime); }
.campaign-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 16px; margin-top: 48px; }
.campaign-card {
  position: relative;
  min-height: 330px;
  padding: 29px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 25px;
  background: white;
  transition: transform .25s, box-shadow .25s, border-color .25s;
}
.campaign-card::after {
  position: absolute;
  right: -45px;
  bottom: -65px;
  width: 150px;
  height: 150px;
  border-radius: 50%;
  background: rgba(255,90,31,.08);
  content: "";
  transition: transform .35s;
}
.campaign-card:hover { border-color: var(--orange); box-shadow: var(--shadow); transform: translateY(-7px); }
.campaign-card:hover::after { transform: scale(1.35); }
.campaign-type { color: var(--orange-dark); font-size: .69rem; font-weight: 900; letter-spacing: .11em; text-transform: uppercase; }
.campaign-icon {
  position: absolute;
  top: 23px;
  right: 24px;
  display: grid;
  width: 54px;
  height: 54px;
  padding: 11px;
  place-items: center;
  border-radius: 17px;
  background: var(--cream);
  color: var(--orange-dark);
  transition: transform .3s cubic-bezier(.34,1.56,.64,1), background .25s, color .25s;
}
.campaign-icon svg { width: 100%; height: 100%; }
.campaign-card:hover .campaign-icon { background: var(--orange); color: white; transform: rotate(7deg) scale(1.08); }
.campaign-card h3 { max-width: calc(100% - 50px); margin: 45px 0 20px; font-size: clamp(1.55rem,2.4vw,2.35rem); }
.campaign-detail { display: grid; grid-template-columns: 83px 1fr; gap: 12px; margin-top: 13px; font-size: .86rem; }
.campaign-detail b { color: var(--ink); font-size: .7rem; letter-spacing: .07em; text-transform: uppercase; }
.campaign-detail p { position: relative; z-index: 1; margin: 0; color: var(--muted); line-height: 1.5; }
.audit-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; margin-top: 48px; }
.audit-card { padding: 26px; border: 1px solid rgba(255,255,255,.17); border-radius: 23px; transition: transform .25s, border-color .25s, background .25s; }
.audit-card:hover { border-color: var(--lime); background: rgba(255,255,255,.05); transform: translateY(-6px); }
.audit-card b { display: grid; width: 36px; height: 36px; margin-bottom: 65px; place-items: center; border-radius: 50%; background: var(--lime); color: var(--ink); }
.audit-card p { margin: 0; color: rgba(255,255,255,.66); font-size: .9rem; }
.workflow-canvas {
  position: relative;
  min-height: 430px;
  margin-top: 52px;
  padding: 58px 38px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 34px;
  background:
    radial-gradient(circle at 10% 10%, rgba(255,179,143,.35), transparent 28%),
    radial-gradient(circle at 90% 90%, rgba(217,255,103,.35), transparent 28%),
    white;
}
.workflow-lines { position: absolute; inset: 35px 4%; width: 92%; height: calc(100% - 70px); pointer-events: none; }
.workflow-line-base { fill: none; stroke: rgba(32,29,25,.12); stroke-width: 5; stroke-linecap: round; }
.workflow-line-motion {
  fill: none;
  stroke: var(--orange);
  stroke-width: 5;
  stroke-linecap: round;
  stroke-dasharray: 10 18;
  animation: workflow-flow 2.5s linear infinite;
}
@keyframes workflow-flow { to { stroke-dashoffset: -56; } }
.workflow-nodes { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(5,1fr); gap: 18px; align-items: center; min-height: 310px; }
.workflow-node {
  position: relative;
  min-height: 190px;
  padding: 23px 20px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: rgba(255,255,255,.93);
  box-shadow: 0 15px 35px rgba(80,35,12,.08);
  transition: transform .25s, border-color .25s, box-shadow .25s;
}
.workflow-node:nth-child(even) { transform: translateY(48px); }
.workflow-node:hover { z-index: 3; border-color: var(--orange); box-shadow: var(--shadow); transform: translateY(-7px); }
.workflow-node:nth-child(even):hover { transform: translateY(40px) scale(1.025); }
.workflow-number { display: grid; width: 34px; height: 34px; margin-bottom: 36px; place-items: center; border-radius: 50%; background: var(--orange); color: white; font-size: .7rem; font-weight: 900; }
.workflow-node h3 { margin-bottom: 10px; font-size: 1.18rem; line-height: 1.05; }
.workflow-node p { margin: 0; color: var(--muted); font-size: .78rem; line-height: 1.45; }
.workflow-legend { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.workflow-legend span { padding: 7px 11px; border-radius: 999px; background: var(--cream); color: var(--muted); font-size: .68rem; font-weight: 800; }

.lifecycle-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 70px; align-items: center; }
.steps { margin-top: 40px; border-top: 1px solid rgba(255,255,255,.17); }
.step { display: grid; grid-template-columns: 42px 1fr; gap: 12px; padding: 20px 0; border-bottom: 1px solid rgba(255,255,255,.17); }
.step b { color: var(--lime); }
.step p { margin: 0; color: rgba(255,255,255,.67); }
.step { transition: padding-left .25s ease, background .25s ease; }
.step:hover { padding-left: 10px; background: rgba(255,255,255,.035); }
.loop-art { position: relative; display: grid; aspect-ratio: 1; place-items: center; }
.loop-art::before, .loop-art::after { position: absolute; border-radius: 50%; content: ""; }
.loop-art::before { inset: 7%; border: 1px dashed rgba(255,255,255,.3); animation: spin 24s linear infinite reverse; }
.loop-art::after { inset: 25%; background: var(--orange); box-shadow: 0 0 0 28px rgba(255,90,31,.14); }
.loop-word { z-index: 2; max-width: 220px; text-align: center; font-family: "Manrope"; font-size: clamp(1.7rem,4vw,3.6rem); font-weight: 800; letter-spacing: -.06em; line-height: .95; }
.loop-node { position: absolute; z-index: 3; padding: 11px 16px; border-radius: 999px; background: white; color: var(--ink); font-size: .78rem; font-weight: 800; box-shadow: 0 10px 35px rgba(0,0,0,.2); }
.loop-node:nth-child(2) { top: 5%; left: 40%; }
.loop-node:nth-child(3) { top: 40%; right: 0; }
.loop-node:nth-child(4) { right: 14%; bottom: 8%; }
.loop-node:nth-child(5) { bottom: 16%; left: 4%; }
.loop-node:nth-child(6) { top: 28%; left: 0; }

.metric-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 55px; background: var(--line); border: 1px solid var(--line); }
.metric { padding: 40px; background: var(--paper); }
.metric strong { display: block; margin-bottom: 12px; color: var(--orange); font-family: "Manrope"; font-size: clamp(2.8rem,5vw,5.5rem); letter-spacing: -.08em; line-height: 1; }
.metric p { margin: 0; color: var(--muted); }

.industry-head { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-bottom: 40px; }
.industry-cloud { display: flex; flex-wrap: wrap; gap: 10px; }
.industry-pill {
  padding: 13px 18px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: white;
  font-weight: 700;
  transition: background .2s, color .2s, transform .2s;
}
.industry-pill:hover { background: var(--orange); color: white; transform: translateY(-3px); }

.process-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: 50px; }
.process-card { padding: 26px; border: 1px solid rgba(255,255,255,.18); border-radius: 23px; }
.process-card b { display: grid; width: 34px; height: 34px; margin-bottom: 70px; place-items: center; border-radius: 50%; background: var(--lime); color: var(--ink); }
.process-card p { color: rgba(255,255,255,.64); font-size: .9rem; }
.process-card { transition: transform .25s ease, border-color .25s ease, background .25s ease; }
.process-card:hover { border-color: var(--lime); background: rgba(255,255,255,.05); transform: translateY(-7px); }

.faq { max-width: 900px; margin: 50px auto 0; }
.faq details { border-top: 1px solid var(--line); transition: padding .25s ease, background .25s ease; }
.faq details:hover { padding-inline: 10px; background: rgba(255,90,31,.035); }
.faq details:last-child { border-bottom: 1px solid var(--line); }
.faq summary { padding: 23px 0; cursor: pointer; list-style: none; font-family: "Manrope"; font-size: 1.18rem; font-weight: 800; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { float: right; content: "+"; }
.faq details[open] summary::after { content: "−"; }
.faq details p { max-width: 760px; padding-bottom: 22px; color: var(--muted); }

.cta-panel {
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 50px;
  align-items: end;
  padding: clamp(35px, 6vw, 75px);
  overflow: hidden;
  border-radius: 40px;
  background: var(--orange);
  color: white;
}
.cta-panel h2 { margin: 0; color: #fffaf2; }
.cta-panel .eyebrow { color: #fff8f0; }
.cta-panel p,
.cta-panel .cta-actions p { color: #fff6ee; }
.cta-actions { text-align: right; }

.site-footer { padding: 70px 0 25px; background: var(--ink); color: white; }
.footer-grid { display: grid; grid-template-columns: 1.5fr repeat(3, 1fr); gap: 40px; }
.footer-brand p { max-width: 330px; color: rgba(255,255,255,.55); }
.footer-col b { display: block; margin-bottom: 16px; color: var(--peach); font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; }
.footer-col a { display: block; margin: 9px 0; color: rgba(255,250,242,.86); }
.footer-bottom { display: flex; flex-wrap: wrap; gap: 10px 28px; justify-content: space-between; margin-top: 60px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.13); color: rgba(255,250,242,.72); font-size: .78rem; }
.footer-legal { display: flex; flex-wrap: wrap; gap: 20px; }
.footer-legal a { color: rgba(255,250,242,.82); }
.footer-legal a:hover { color: var(--peach); }

.page-hero { padding: 170px 0 90px; }
.page-hero h1 { max-width: 1040px; font-size: clamp(3.1rem,7vw,6.7rem); }
.page-hero .lead { margin-top: 30px; }
.page-grid { display: grid; grid-template-columns: 280px 1fr; gap: 70px; }
.side-nav { position: sticky; top: 120px; align-self: start; padding: 22px; border: 1px solid var(--line); border-radius: 20px; background: white; }
.side-nav a { display: block; padding: 8px 0; color: var(--muted); font-weight: 700; }
.content-block { padding-bottom: 70px; }
.content-block h2 { font-size: clamp(2.2rem,4vw,4rem); }
.content-block p, .content-block li { color: var(--muted); }
.content-block li { margin-bottom: 10px; }
.resource-grid, .industry-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.resource-card, .industry-card { position: relative; min-height: 250px; padding: 27px; border: 1px solid var(--line); border-radius: 24px; background: white; }
.resource-card, .industry-card { transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.resource-card:hover, .industry-card:hover { border-color: var(--orange); box-shadow: var(--shadow); transform: translateY(-7px); }
.resource-card small, .industry-card small { color: var(--orange-dark); font-weight: 800; text-transform: uppercase; }
.resource-card h2, .industry-card h2 { margin: 55px 0 14px; font-size: 1.8rem; }
.resource-card p, .industry-card p { color: var(--muted); font-size: .9rem; }

.reveal { opacity: 0; transform: translateY(30px); }

@media (max-width: 900px) {
  /* Mobile browsers can throttle opacity tweens during long pages. Keep all
     conversion copy immediately readable; other motion remains active. */
  .reveal { opacity: 1 !important; transform: none !important; }
  .nav-links {
    position: fixed;
    inset: 0;
    z-index: 1;
    flex-direction: column;
    justify-content: center;
    overflow-y: auto;
    padding: 96px 28px 40px;
    background: var(--paper);
    font-size: 1.5rem;
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s;
  }
  .menu-open .nav-links { opacity: 1; pointer-events: auto; }
  .menu-toggle, .nav .brand { position: relative; z-index: 2; }
  .menu-toggle { display: block; }
  .hero-grid, .landing-hero-grid, .intro-grid, .lifecycle-grid, .cta-panel, .page-grid { grid-template-columns: 1fr; }
  .hero-art { min-height: 520px; }
  .landing-hero { padding-top: 130px; }
  .landing-visual { min-height: 520px; }
  .workflow-nodes { grid-template-columns: repeat(3,1fr); }
  .workflow-node:nth-child(even) { transform: none; }
  .workflow-node:nth-child(even):hover { transform: translateY(-7px); }
  .workflow-lines { display: none; }
  .sticky-label, .side-nav { position: static; }
  .process-grid, .audit-grid { grid-template-columns: repeat(2,1fr); }
  .resource-grid, .industry-grid, .benefit-grid, .service-paths, .campaign-grid { grid-template-columns: repeat(2,1fr); }
  .footer-grid { grid-template-columns: repeat(2,1fr); }
  .cta-actions { text-align: left; }
}

@media (max-width: 600px) {
  .container { width: min(calc(100% - 26px), var(--max)); }
  .section { padding: 78px 0; }
  .hero { padding-top: 115px; }
  .hero h1 { font-size: clamp(3rem,15vw,4.7rem); }
  .landing-hero { min-height: auto; padding: 115px 0 70px; }
  .landing-hero h1 { font-size: clamp(3rem, 14vw, 4.8rem); }
  .hero-art { min-height: 430px; }
  .landing-visual { min-height: 470px; border-radius: 28px; }
  .industry-art { min-height: 500px; border-radius: 28px; }
  .journey-board { width: 90%; padding: 21px; }
  .phone-mockup { width: 210px; min-height: 410px; }
  .linkedin-card { width: 88%; }
  .dashboard { width: 92%; padding: 18px; }
  .float-card--one { right: 0; }
  .float-card--two { left: 0; }
  .cards, .metric-grid, .process-grid, .audit-grid, .resource-grid, .industry-grid, .benefit-grid, .service-paths, .campaign-grid, .outcome-list, .footer-grid { grid-template-columns: 1fr; }
  .campaign-card { min-height: auto; }
  .campaign-detail { grid-template-columns: 72px 1fr; }
  .campaign-card h3 { margin-top: 50px; }
  .workflow-canvas { min-height: 0; padding: 25px 20px; border-radius: 26px; }
  .workflow-nodes { grid-template-columns: 1fr; gap: 12px; min-height: 0; padding-left: 24px; border-left: 2px dashed rgba(255,90,31,.28); }
  .workflow-node, .workflow-node:nth-child(even) { min-height: 0; transform: none; }
  .workflow-node::before { position: absolute; top: 30px; left: -31px; width: 12px; height: 12px; border: 3px solid white; border-radius: 50%; background: var(--orange); content: ""; }
  .workflow-number { margin-bottom: 24px; }
  .service-card { min-height: 330px; }
  .brand { font-size: 1.28rem; gap: 9px; }
  .brand-mark { width: 42px; height: 42px; }
  .trust-logo { width: 168px; height: 88px; padding: 16px 20px; }
  .industry-head, .footer-bottom { align-items: start; flex-direction: column; }
  .metric-grid { gap: 1px; }
  .process-card b { margin-bottom: 35px; }
}

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

/* ============================================================
   Premium translucent glass theme
   ============================================================ */
:root {
  --paper: #f8f6f2;
  --cream: rgba(245, 237, 226, .68);
  --line: rgba(73, 56, 43, .13);
  --glass: rgba(255, 255, 255, .58);
  --glass-strong: rgba(255, 255, 255, .76);
  --glass-soft: rgba(255, 255, 255, .38);
  --glass-line: rgba(255, 255, 255, .72);
  --glass-dark: rgba(27, 25, 23, .62);
  --glass-dark-line: rgba(255, 255, 255, .13);
  --shadow:
    0 1px 0 rgba(255,255,255,.72) inset,
    0 -1px 0 rgba(92,57,32,.04) inset,
    0 18px 50px rgba(76,44,24,.10),
    0 4px 14px rgba(76,44,24,.06);
  --shadow-hover:
    0 1px 0 rgba(255,255,255,.92) inset,
    0 28px 70px rgba(76,44,24,.16),
    0 8px 22px rgba(255,90,31,.08);
}

body {
  position: relative;
  background:
    radial-gradient(circle at 8% 8%, rgba(255, 154, 102, .20), transparent 27rem),
    radial-gradient(circle at 94% 24%, rgba(217, 255, 103, .14), transparent 26rem),
    radial-gradient(circle at 42% 72%, rgba(255, 179, 143, .13), transparent 32rem),
    linear-gradient(145deg, #fbfaf7 0%, #f4f0e9 48%, #faf7f1 100%);
  background-attachment: fixed;
}
body::before {
  position: fixed;
  z-index: -1;
  inset: 0;
  background:
    radial-gradient(ellipse at 78% 5%, rgba(255,255,255,.8), transparent 30%),
    radial-gradient(ellipse at 16% 56%, rgba(255,90,31,.055), transparent 30%),
    linear-gradient(115deg, rgba(255,255,255,.18), transparent 44%, rgba(255,255,255,.12));
  content: "";
  pointer-events: none;
}
.section--cream {
  border-block: 1px solid rgba(255,255,255,.54);
  background:
    linear-gradient(135deg, rgba(255,255,255,.34), rgba(245,234,219,.52)),
    rgba(247,237,223,.46);
  box-shadow: 0 1px 0 rgba(255,255,255,.68) inset;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.section--dark {
  background:
    radial-gradient(circle at 12% 8%, rgba(255,90,31,.12), transparent 32rem),
    radial-gradient(circle at 90% 86%, rgba(217,255,103,.055), transparent 28rem),
    linear-gradient(145deg, #24211e 0%, #161513 100%);
}
.section--orange {
  background:
    radial-gradient(circle at 85% 8%, rgba(255,255,255,.22), transparent 25rem),
    linear-gradient(135deg, #ff6a2f, #ec470f 68%, #d83f0b);
  box-shadow: 0 1px 0 rgba(255,255,255,.24) inset;
}

.site-header { padding: 10px 0; }
.nav {
  min-height: 68px;
  padding: 0 18px;
  border: 1px solid rgba(255,255,255,.68);
  border-radius: 22px;
  background: rgba(255,255,255,.54);
  box-shadow:
    0 1px 0 rgba(255,255,255,.92) inset,
    0 12px 34px rgba(54,37,25,.08);
  backdrop-filter: blur(24px) saturate(145%);
  -webkit-backdrop-filter: blur(24px) saturate(145%);
}
.site-header.scrolled { background: transparent; box-shadow: none; backdrop-filter: none; }
.site-header.scrolled .nav {
  border-color: rgba(255,255,255,.82);
  background: rgba(252,249,244,.74);
  box-shadow:
    0 1px 0 white inset,
    0 16px 44px rgba(49,31,19,.12);
}
.brand-mark { filter: drop-shadow(0 5px 10px rgba(255,90,31,.14)); }

.button {
  position: relative;
  overflow: hidden;
  border-color: rgba(32,29,25,.16);
  background: rgba(32,29,25,.90);
  box-shadow:
    0 1px 0 rgba(255,255,255,.18) inset,
    0 8px 20px rgba(32,29,25,.12);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  transition: transform .28s cubic-bezier(.2,.8,.2,1), box-shadow .28s, border-color .28s, background .28s;
}
.button::before {
  position: absolute;
  inset: 0;
  background: linear-gradient(115deg, transparent 12%, rgba(255,255,255,.22) 46%, transparent 68%);
  content: "";
  transform: translateX(-120%);
  transition: transform .55s ease;
}
.button:hover::before { transform: translateX(120%); }
.button:hover { box-shadow: 0 16px 36px rgba(32,29,25,.18); transform: translateY(-2px) scale(1.012); }
.button--orange {
  border-color: rgba(255,255,255,.34);
  background: linear-gradient(145deg, #ff6c34, #f24b12);
  box-shadow:
    0 1px 0 rgba(255,255,255,.42) inset,
    0 10px 28px rgba(255,90,31,.27);
}
.button--orange:hover { box-shadow: 0 16px 38px rgba(255,90,31,.35); }
.button--light { border-color: rgba(255,255,255,.75); background: rgba(255,255,255,.78); color: var(--ink); }
.button--ghost { border-color: rgba(32,29,25,.16); background: rgba(255,255,255,.36); color: var(--ink); }

.dashboard,
.journey-board,
.linkedin-card,
.phone-mockup,
.float-card,
.channel-badge,
.industry-signal {
  border-color: var(--glass-line);
  background: var(--glass-strong);
  box-shadow: var(--shadow);
  backdrop-filter: blur(24px) saturate(135%);
  -webkit-backdrop-filter: blur(24px) saturate(135%);
}
.mini-stat,
.message,
.post-lines i { background: rgba(247,237,223,.62); }
.landing-visual,
.industry-art {
  border-color: rgba(255,255,255,.68);
  background:
    radial-gradient(circle at 18% 16%, rgba(255,150,98,.30), transparent 34%),
    radial-gradient(circle at 82% 84%, rgba(217,255,103,.27), transparent 35%),
    linear-gradient(145deg, rgba(255,255,255,.56), rgba(242,233,222,.50));
  box-shadow:
    0 1px 0 rgba(255,255,255,.9) inset,
    0 32px 80px rgba(77,45,26,.10);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

.service-card,
.benefit-card,
.campaign-card,
.outcome-item,
.resource-card,
.industry-card,
.trust-logo,
.workflow-node,
.side-nav {
  border-color: var(--glass-line);
  background:
    linear-gradient(145deg, rgba(255,255,255,.70), rgba(255,255,255,.42));
  box-shadow: var(--shadow);
  backdrop-filter: blur(20px) saturate(125%);
  -webkit-backdrop-filter: blur(20px) saturate(125%);
}
.service-card:nth-child(4n+2),
.service-card:nth-child(4n+3) {
  background: linear-gradient(145deg, rgba(249,242,233,.78), rgba(255,255,255,.42));
}
.service-card,
.benefit-card,
.campaign-card,
.outcome-item,
.resource-card,
.industry-card,
.trust-logo,
.workflow-node {
  transition:
    transform .32s cubic-bezier(.2,.8,.2,1),
    box-shadow .32s ease,
    border-color .32s ease,
    background .32s ease;
}
.service-card:hover,
.benefit-card:hover,
.campaign-card:hover,
.outcome-item:hover,
.resource-card:hover,
.industry-card:hover,
.trust-logo:hover,
.workflow-node:hover {
  border-color: rgba(255,125,72,.54);
  background: linear-gradient(145deg, rgba(255,255,255,.82), rgba(255,249,241,.55));
  box-shadow: var(--shadow-hover);
  transform: translateY(-5px) scale(1.006);
}
.workflow-node:nth-child(even):hover { transform: translateY(43px) scale(1.012); }
.campaign-card::after {
  background:
    radial-gradient(circle, rgba(255,126,71,.18), rgba(255,90,31,.04) 60%, transparent 70%);
  filter: blur(3px);
}
.campaign-icon {
  border: 1px solid rgba(255,255,255,.7);
  background: rgba(247,237,223,.62);
  box-shadow: 0 1px 0 white inset, 0 8px 18px rgba(76,44,24,.07);
  backdrop-filter: blur(10px);
}
.workflow-canvas {
  border-color: rgba(255,255,255,.72);
  background:
    radial-gradient(circle at 9% 10%, rgba(255,144,88,.22), transparent 32%),
    radial-gradient(circle at 91% 91%, rgba(217,255,103,.22), transparent 32%),
    rgba(255,255,255,.45);
  box-shadow:
    0 1px 0 rgba(255,255,255,.92) inset,
    0 28px 70px rgba(77,45,26,.09);
  backdrop-filter: blur(22px) saturate(125%);
  -webkit-backdrop-filter: blur(22px) saturate(125%);
}
.workflow-legend span,
.industry-pill {
  border: 1px solid rgba(255,255,255,.58);
  background: rgba(255,255,255,.45);
  box-shadow: 0 1px 0 rgba(255,255,255,.86) inset, 0 5px 14px rgba(64,40,24,.05);
  backdrop-filter: blur(12px);
}
.industry-pill:hover { border-color: rgba(255,90,31,.45); background: rgba(255,90,31,.90); }

.section--dark .service-path,
.section--dark .audit-card,
.section--dark .process-card,
.section--orange .process-card {
  border-color: var(--glass-dark-line);
  background:
    linear-gradient(145deg, rgba(255,255,255,.10), rgba(255,255,255,.035));
  box-shadow:
    0 1px 0 rgba(255,255,255,.11) inset,
    0 20px 50px rgba(0,0,0,.16);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.section--dark .service-path:hover,
.section--dark .audit-card:hover,
.section--dark .process-card:hover,
.section--orange .process-card:hover {
  border-color: rgba(217,255,103,.45);
  background: linear-gradient(145deg, rgba(255,255,255,.15), rgba(255,255,255,.06));
  box-shadow: 0 1px 0 rgba(255,255,255,.16) inset, 0 26px 55px rgba(0,0,0,.22);
  transform: translateY(-4px);
}
.loop-node {
  border: 1px solid rgba(255,255,255,.55);
  background: rgba(255,255,255,.78);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
.faq details {
  margin: 8px 0;
  padding-inline: 20px;
  border: 1px solid rgba(255,255,255,.62);
  border-radius: 18px;
  background: rgba(255,255,255,.42);
  box-shadow: 0 1px 0 rgba(255,255,255,.8) inset, 0 8px 22px rgba(68,43,26,.045);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.faq details:last-child { border-bottom: 1px solid rgba(255,255,255,.62); }
.faq details:hover { padding-inline: 22px; border-color: rgba(255,125,72,.38); background: rgba(255,255,255,.60); }
.cta-panel {
  position: relative;
  border: 1px solid rgba(255,255,255,.30);
  background:
    radial-gradient(circle at 85% 12%, rgba(255,255,255,.25), transparent 31%),
    linear-gradient(135deg, rgba(255,106,47,.96), rgba(225,60,4,.94));
  box-shadow:
    0 1px 0 rgba(255,255,255,.42) inset,
    0 36px 80px rgba(181,52,5,.20);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.logo-strip {
  border-color: rgba(255,255,255,.68);
  background: rgba(255,255,255,.40);
  box-shadow: 0 1px 0 rgba(255,255,255,.82) inset;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.site-footer {
  border-top: 1px solid rgba(255,255,255,.1);
  background:
    radial-gradient(circle at 14% 10%, rgba(255,90,31,.10), transparent 28rem),
    linear-gradient(145deg, #24211e, #141311);
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .nav,
  .dashboard,
  .journey-board,
  .service-card,
  .benefit-card,
  .campaign-card,
  .workflow-node,
  .resource-card,
  .industry-card,
  .faq details,
  .location-disclosure { background: rgba(255,255,255,.94); }
  .location-disclosure--dark { background: rgba(54,50,46,.94); }
  .section--dark .service-path,
  .section--dark .audit-card,
  .section--dark .process-card { background: rgba(54,50,46,.94); }
}

@media (max-width: 900px) {
  .site-header { padding: 7px 0; }
  /* backdrop-filter on .nav makes it the containing block for position:fixed,
     which trapped the mobile overlay inside the 68px header. */
  .nav,
  .site-header.scrolled .nav {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    background: rgba(252,249,244,.96);
  }
  .nav { min-height: 62px; border-radius: 18px; }
  .nav-links {
    margin: 0;
    border: 1px solid rgba(255,255,255,.74);
    border-radius: 24px;
    background:
      radial-gradient(circle at 15% 12%, rgba(255,140,82,.18), transparent 28rem),
      rgba(248,246,242,.90);
    box-shadow: 0 1px 0 white inset, 0 24px 70px rgba(41,28,20,.16);
    backdrop-filter: blur(26px) saturate(130%);
    -webkit-backdrop-filter: blur(26px) saturate(130%);
  }
}
@media (max-width: 600px) {
  :root {
    --shadow: 0 1px 0 rgba(255,255,255,.76) inset, 0 12px 30px rgba(76,44,24,.08);
    --shadow-hover: 0 1px 0 rgba(255,255,255,.9) inset, 0 16px 36px rgba(76,44,24,.11);
  }
  body { background-attachment: scroll; }
  .service-card,
  .benefit-card,
  .campaign-card,
  .outcome-item,
  .resource-card,
  .industry-card,
  .workflow-node,
  .workflow-canvas,
  .journey-board { backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
  .service-card:hover,
  .benefit-card:hover,
  .campaign-card:hover,
  .outcome-item:hover,
  .resource-card:hover,
  .industry-card:hover,
  .workflow-node:hover { transform: translateY(-2px); }
}

/* Long-form resources and methodology pages */
.truth-note,
.article-note {
  margin: 0 0 42px;
  padding: 22px 24px;
  border: 1px solid rgba(255,255,255,.72);
  border-left: 4px solid var(--orange);
  border-radius: 18px;
  background: rgba(255,255,255,.52);
  box-shadow: var(--shadow);
  color: var(--muted);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
.truth-note strong, .article-note strong { color: var(--ink); }
.truth-note p { margin: 6px 0 0; }
.article-hero { padding: 155px 0 80px; }
.article-hero h1 {
  max-width: 1080px;
  margin-bottom: 28px;
  font-size: clamp(3rem, 7vw, 6.7rem);
}
.article-layout {
  display: grid;
  grid-template-columns: 250px minmax(0, 760px);
  justify-content: center;
  gap: 78px;
  padding-bottom: 100px;
}
.article-toc {
  position: sticky;
  top: 110px;
  align-self: start;
  padding: 22px;
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 20px;
  background: rgba(255,255,255,.52);
  box-shadow: var(--shadow);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.article-toc b { display: block; margin-bottom: 12px; color: var(--orange-dark); font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; }
.article-toc a { display: block; padding: 7px 0; color: var(--muted); font-size: .82rem; font-weight: 700; line-height: 1.35; }
.article-toc a:hover { color: var(--orange-dark); }
.article-prose { min-width: 0; }
.article-prose section { padding: 25px 0 38px; border-bottom: 1px solid var(--line); }
.article-prose h2 { margin-bottom: 24px; font-size: clamp(2rem, 4vw, 3.65rem); }
.article-prose p, .article-prose li { color: #514a43; font-size: 1.08rem; line-height: 1.82; }
.article-prose p + p { margin-top: 20px; }
.article-prose a { color: var(--orange-dark); font-weight: 700; text-decoration: underline; text-decoration-color: rgba(216,63,11,.3); text-underline-offset: 3px; }
.article-prose .faq { margin-top: 25px; }
.article-related {
  margin-top: 55px;
  padding: 32px;
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 28px;
  background: rgba(255,255,255,.48);
  box-shadow: var(--shadow);
}
.article-related h2 { font-size: clamp(1.8rem,3vw,2.8rem); }
.resource-card > a {
  position: absolute;
  inset: 0;
  z-index: 2;
  border-radius: inherit;
}
.resource-card .card-link { position: static; display: inline-block; margin-top: 12px; color: var(--orange-dark); }

/* Essentials, utility pages, and printable retention tools */
.error-document {
  min-height: 100vh;
  background:
    radial-gradient(circle at 18% 22%, rgba(255,90,31,.22), transparent 34rem),
    radial-gradient(circle at 82% 72%, rgba(217,255,103,.18), transparent 28rem),
    var(--cream);
}
.error-page { min-height: 100vh; padding: 145px 0 90px; display: grid; place-items: center; }
.error-glass {
  padding: clamp(34px,6vw,78px);
  border: 1px solid rgba(255,255,255,.82);
  border-radius: 36px;
  background: rgba(255,255,255,.64);
  box-shadow: var(--shadow);
  backdrop-filter: blur(22px);
  -webkit-backdrop-filter: blur(22px);
}
.error-code { margin-bottom: 5px; color: var(--orange); font: 800 clamp(4rem,13vw,10rem)/.8 "Manrope",sans-serif; letter-spacing: -.09em; }
.error-glass h1 { max-width: 900px; font-size: clamp(3rem,7vw,6.5rem); }
.error-glass .button-row { margin-top: 30px; }
.worksheet-section {
  margin-bottom: 28px;
  padding: 28px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: rgba(255,255,255,.78);
  box-shadow: 0 12px 35px rgba(80,35,12,.07);
}
.worksheet-section h2 { font-size: clamp(1.8rem,3vw,2.6rem); }
.check-row { display: flex; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); cursor: pointer; }
.check-row input { width: 20px; height: 20px; flex: 0 0 auto; accent-color: var(--orange); }
.worksheet-notes { display: grid; gap: 8px; margin-top: 22px; font-weight: 800; }
.worksheet-notes textarea { width: 100%; padding: 14px; border: 1px solid var(--line); border-radius: 14px; background: var(--paper); resize: vertical; }
.worksheet-priority { padding: 28px; border: 2px solid var(--orange); border-radius: 24px; }
.worksheet-priority h2 { font-size: clamp(1.8rem,3vw,2.6rem); }
.worksheet-priority li { margin: 20px 0; }

@media print {
  @page { margin: 14mm; }
  .site-header, .site-footer, .no-print { display: none !important; }
  body, .resource-article { background: #fff !important; color: #111 !important; font-size: 11pt; }
  .article-hero { padding: 0 0 18px; }
  .article-hero h1 { font-size: 30pt; }
  .article-layout { display: block; }
  .article-prose { max-width: none; }
  .article-note, .worksheet-section, .worksheet-priority { break-inside: avoid; background: #fff; box-shadow: none; }
  .worksheet-section { padding: 16px; margin-bottom: 14px; }
  .worksheet-section h2, .worksheet-priority h2 { font-size: 17pt; }
  textarea { min-height: 62px; }
}

@media (max-width: 900px) {
  .article-layout { grid-template-columns: 1fr; gap: 34px; }
  .article-toc { position: static; }
}
@media (max-width: 600px) {
  .article-hero { padding: 120px 0 55px; }
  .article-hero h1 { font-size: clamp(2.65rem, 13vw, 4.4rem); }
  .article-layout { padding-bottom: 60px; }
  .article-prose p, .article-prose li { font-size: 1rem; line-height: 1.72; }
  .article-related { padding: 23px; }
}

/* High-intent authority and audit pages */
.authority-hero { overflow: hidden; }
.authority-visual {
  position: relative;
  display: grid;
  min-height: 560px;
  padding: 44px;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 40px;
  background:
    radial-gradient(circle at 16% 18%, rgba(255,137,79,.28), transparent 34%),
    radial-gradient(circle at 87% 84%, rgba(217,255,103,.28), transparent 34%),
    linear-gradient(145deg, rgba(255,255,255,.65), rgba(244,234,223,.48));
  box-shadow: var(--shadow);
  backdrop-filter: blur(22px) saturate(130%);
}
.authority-visual::before {
  position: absolute;
  width: 410px;
  height: 410px;
  border: 1px dashed rgba(32,29,25,.18);
  border-radius: 50%;
  content: "";
  animation: spin 27s linear infinite;
}
.authority-symbol {
  position: relative;
  z-index: 2;
  width: 210px;
  padding: 28px;
  border: 1px solid rgba(255,255,255,.82);
  border-radius: 46px;
  background: rgba(255,255,255,.68);
  box-shadow: var(--shadow);
  color: var(--orange);
  backdrop-filter: blur(18px);
}
.authority-symbol circle { fill: rgba(255,90,31,.055); stroke: rgba(255,90,31,.22); stroke-width: 2; }
.authority-symbol path { fill: none; stroke: currentColor; stroke-width: 5; stroke-linecap: round; stroke-linejoin: round; }
.authority-flow {
  position: absolute;
  z-index: 3;
  right: 7%;
  bottom: 9%;
  left: 7%;
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 8px;
}
.authority-stage {
  padding: 13px;
  border: 1px solid rgba(255,255,255,.8);
  border-radius: 16px;
  background: rgba(255,255,255,.72);
  box-shadow: 0 10px 28px rgba(76,44,24,.09);
  backdrop-filter: blur(14px);
}
.authority-stage b { display: block; color: var(--orange-dark); font-size: .65rem; }
.authority-stage span { font-weight: 800; font-size: .78rem; }
.authority-signal {
  position: absolute;
  z-index: 4;
  padding: 10px 14px;
  border: 1px solid rgba(255,255,255,.82);
  border-radius: 999px;
  background: rgba(255,255,255,.78);
  box-shadow: 0 12px 30px rgba(80,35,12,.12);
  font-size: .72rem;
  font-weight: 800;
  animation: float 4s ease-in-out infinite;
  backdrop-filter: blur(12px);
}
.authority-signal--one { top: 10%; right: 5%; }
.authority-signal--two { bottom: 26%; left: 4%; animation-delay: -2s; }
.authority-workflow { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.16); }
.authority-workflow .workflow-node { background: rgba(255,255,255,.86); }
.audit-inline {
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 45px;
  align-items: center;
  padding: clamp(30px,5vw,58px);
  border: 1px solid rgba(255,255,255,.75);
  border-radius: 32px;
  background:
    radial-gradient(circle at 92% 10%, rgba(217,255,103,.22), transparent 30%),
    linear-gradient(145deg, rgba(255,255,255,.72), rgba(248,238,226,.48));
  box-shadow: var(--shadow);
  backdrop-filter: blur(20px);
}
.audit-inline h2 { margin-bottom: 18px; font-size: clamp(2rem,4vw,3.8rem); }
.audit-inline p { max-width: 720px; color: var(--muted); }
.audit-inline .button-row { justify-content: flex-end; }
.authority-links { margin-top: 22px; }

@media (max-width: 900px) {
  .authority-visual { min-height: 500px; }
  .audit-inline { grid-template-columns: 1fr; }
  .audit-inline .button-row { justify-content: flex-start; }
}
@media (max-width: 600px) {
  .authority-visual { min-height: 470px; padding: 24px; border-radius: 28px; }
  .authority-symbol { width: 175px; }
  .authority-flow { right: 4%; left: 4%; }
  .authority-stage { padding: 9px 7px; }
  .authority-stage span { font-size: .68rem; }
  .authority-signal--two { bottom: 29%; }
  .audit-inline { padding: 25px 20px; border-radius: 25px; }
}

/* ============================================================
   Homepage: collapsed industry disclosure + brand profile marquee
   Additive only — every selector is scoped to a homepage-specific
   class so shared components keep their existing styling.
   ============================================================ */

/* Extends .location-disclosure with a two-line summary and a chevron.
   The summary is laid out as a grid so it holds no bare <span>, which
   would otherwise pick up the shared "+" marker styling. */
.location-disclosure.industry-disclosure { margin-top: 44px; }
.location-disclosure.industry-disclosure summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 3px 22px;
  padding: 22px 26px;
  border-radius: 22px;
}
.industry-disclosure summary::marker { content: ""; }
.industry-disclosure summary:focus-visible { outline: 3px solid var(--orange); outline-offset: 3px; }
.industry-disclosure summary b {
  grid-area: 1 / 1;
  font-family: "Manrope", system-ui, sans-serif;
  font-size: clamp(1.12rem, 2.2vw, 1.5rem);
  font-weight: 800;
  letter-spacing: -.03em;
  line-height: 1.2;
}
.industry-disclosure summary small {
  grid-area: 2 / 1;
  color: var(--muted);
  font-family: "DM Sans", system-ui, sans-serif;
  font-size: .85rem;
  font-weight: 600;
  line-height: 1.4;
}
.industry-disclosure .disclosure-chevron {
  grid-area: 1 / 2 / span 2 / auto;
  width: 38px;
  height: 38px;
  flex: 0 0 auto;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.7);
  border-radius: 50%;
  background: rgba(255,255,255,.55);
  box-shadow: 0 1px 0 rgba(255,255,255,.85) inset, 0 5px 14px rgba(64,40,24,.06);
  color: var(--orange);
  transition: transform .28s cubic-bezier(.2,.8,.2,1), background .28s ease, border-color .28s ease;
}
.industry-disclosure summary:hover .disclosure-chevron { border-color: rgba(255,90,31,.45); background: rgba(255,255,255,.88); }
.industry-disclosure[open] .disclosure-chevron { transform: rotate(180deg); }
.industry-disclosure > .industry-cloud { margin: 0; padding: 4px 26px 8px; }
.industry-disclosure > .industry-note {
  margin: 0;
  padding: 0 26px 26px;
  color: var(--muted);
  font-size: .8rem;
  font-weight: 600;
}

/* Brand mark strip: one short label plus the logo tiles, no supporting copy. The
   band itself stays fully transparent so the page gradient runs through it
   uninterrupted; only the label pill and the tiles carry surface treatment. */
.trust-strip {
  padding: 34px 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
/* Section label for the marquee: an eyebrow-weight glass pill rather than a card,
   so it reads as a caption over the page gradient. Insets and a hairline ring
   only — the tiles below stay the only thing near the gaps. */
.trust-heading {
  display: flex;
  justify-content: center;
  max-width: none;
  margin: 0 0 24px;
  padding: 0 20px;
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: normal;
  line-height: 1;
}
.trust-heading span {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 9px 18px;
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 999px;
  background: linear-gradient(157deg, rgba(255,255,255,.72), rgba(255,255,255,.44));
  box-shadow:
    0 1px 0 rgba(255,255,255,1) inset,
    0 0 0 1px rgba(73,56,43,.05);
  color: var(--muted);
  font-family: "DM Sans", system-ui, sans-serif;
  font-size: inherit;
  letter-spacing: .13em;
  text-transform: uppercase;
  backdrop-filter: blur(16px) saturate(140%);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
}
.trust-heading span::before {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--orange);
  box-shadow: 0 0 0 3px rgba(255,90,31,.13);
  content: "";
}
/* Reverse of the shared trust-marquee keyframes, so the strip travels
   left-to-right. The duplicated track keeps the loop seamless either way. */
.trust-strip .trust-track { animation-direction: reverse; }
/* Edge fade via alpha mask rather than painted gradient overlays: a coloured
   overlay would tint the band against the page gradient behind it. */
.trust-marquee {
  position: relative;
  overflow: hidden;
  mask-image: linear-gradient(90deg, transparent 0, black 86px, black calc(100% - 86px), transparent 100%);
  -webkit-mask-image: linear-gradient(90deg, transparent 0, black 86px, black calc(100% - 86px), transparent 100%);
}
.trust-strip:hover .trust-track,
.trust-strip:focus-within .trust-track { animation-play-state: paused; }
/* Transparent path-based SVGs: drop multiply, keep grayscale@72%. The marks ship
   with ink-tight viewBoxes on a shared vertical band, so a single height cap
   normalises their optical weight and keeps one baseline across the strip. The
   tile padding below is the only source of breathing room; width stays auto so
   nothing is stretched edge to edge. */
.trust-strip .trust-logo {
  position: relative;
  width: 252px;
  height: 108px;
  padding: 38px 40px;
  overflow: hidden;
  /* Frosted glass rather than milk: the fill stays translucent so the page
     gradient reads through the tile. Depth is inset-only plus a 1px ink ring and
     a 2px contact shadow — the shared card shadow blurs 50px and, across the
     20px gaps, neighbouring tiles' shadows merge into one continuous warm bar,
     so nothing here is allowed to cast wider than the tile's own edge. */
  border-color: rgba(255,255,255,.72);
  background: linear-gradient(157deg, rgba(255,255,255,.78), rgba(255,255,255,.54));
  box-shadow:
    0 1px 0 rgba(255,255,255,1) inset,
    0 0 0 1px rgba(255,255,255,.34) inset,
    0 -1px 0 rgba(92,57,32,.07) inset,
    0 0 0 1px rgba(73,56,43,.06),
    0 1px 2px rgba(76,44,24,.05);
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
}
/* Specular top-edge catch, painted inside the tile so it cannot reach the gaps. */
.trust-strip .trust-logo::before {
  position: absolute;
  z-index: 0;
  inset: 0;
  background:
    linear-gradient(152deg, rgba(255,255,255,.52) 0, rgba(255,255,255,.10) 40%, transparent 64%),
    radial-gradient(120% 88% at 50% -22%, rgba(255,255,255,.46), transparent 62%);
  content: "";
  pointer-events: none;
}
.trust-strip .trust-logo:hover {
  border-color: rgba(255,125,72,.54);
  background: linear-gradient(157deg, rgba(255,255,255,.92), rgba(255,250,244,.68));
  box-shadow:
    0 1px 0 rgba(255,255,255,1) inset,
    0 0 0 1px rgba(255,255,255,.42) inset,
    0 0 0 1px rgba(255,125,72,.16),
    0 1px 3px rgba(76,44,24,.07);
  transform: translateY(-3px);
}
.trust-strip .trust-logo img {
  position: relative;
  z-index: 1;
  display: block;
  width: auto;
  height: 32px;
  max-width: 100%;
  max-height: 100%;
  mix-blend-mode: normal;
  opacity: .72;
}
.trust-strip .trust-logo:hover img { opacity: 1; }

/* Locations hub: long industry CTAs inside a disclosure need normal flow,
   not the absolute corner link used on short "Explore service" cards. */
.location-disclosure .service-paths {
  align-items: stretch;
}
.location-disclosure .service-path {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 0;
  padding-bottom: 22px;
}
.location-disclosure .service-path h3 { margin-top: 8px; }
.location-disclosure .service-path p {
  flex: 1;
  margin: 0;
  padding-bottom: 0;
}
.location-disclosure .service-path a {
  position: static;
  align-self: flex-start;
  margin-top: 4px;
  max-width: 100%;
  line-height: 1.3;
  text-wrap: balance;
}

@media (max-width: 600px) {
  .location-disclosure.industry-disclosure summary { padding: 18px; gap: 3px 14px; }
  .industry-disclosure > .industry-cloud { padding: 4px 18px 8px; }
  .industry-disclosure > .industry-note { padding: 0 18px 22px; }
  .industry-disclosure .disclosure-chevron { width: 34px; height: 34px; padding: 9px; }
  .trust-marquee {
    mask-image: linear-gradient(90deg, transparent 0, black 40px, black calc(100% - 40px), transparent 100%);
    -webkit-mask-image: linear-gradient(90deg, transparent 0, black 40px, black calc(100% - 40px), transparent 100%);
  }
  .trust-heading { margin-bottom: 18px; font-size: .68rem; }
  .trust-heading span { gap: 8px; padding: 8px 14px; letter-spacing: .11em; }
  /* Smaller tiles on phones, with the padding-to-artwork ratio held steady.
     Lighter blur matches the phone treatment used on the other glass cards. */
  .trust-strip .trust-logo {
    width: 210px;
    height: 94px;
    padding: 30px 32px;
    backdrop-filter: blur(12px) saturate(135%);
    -webkit-backdrop-filter: blur(12px) saturate(135%);
  }
  .trust-strip .trust-logo img { height: 27px; }
}

@media (prefers-reduced-motion: reduce) {
  .industry-disclosure .disclosure-chevron { transition: none; }
  /* Fall back to a static wrapped grid instead of a frozen, half-clipped track. */
  .trust-marquee {
    overflow: visible;
    mask-image: none;
    -webkit-mask-image: none;
  }
  .trust-track {
    width: 100%;
    flex-wrap: wrap;
    justify-content: center;
    animation: none;
  }
  .trust-set {
    flex-wrap: wrap;
    justify-content: center;
    gap: 16px;
    padding-right: 0;
  }
  .trust-set[aria-hidden="true"] { display: none; }
}

/* ============================================================
   Paid-search state landing pages (/ads/states/)
   ============================================================ */
.ads-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 0 26px;
  padding: 0;
  list-style: none;
}
.ads-badges li {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 15px;
  border: 1px solid var(--glass-line);
  border-radius: 999px;
  background: var(--glass);
  box-shadow: 0 1px 0 rgba(255,255,255,.86) inset, 0 10px 24px rgba(76,44,24,.07);
  font-size: .76rem;
  font-weight: 800;
  backdrop-filter: blur(16px) saturate(130%);
  -webkit-backdrop-filter: blur(16px) saturate(130%);
}
.ads-badges li::before { color: var(--orange); font-size: .9em; content: "✦"; }

.ads-landing section[id] { scroll-margin-top: 124px; }

.ads-map-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 48px; align-items: start; }
.ads-map {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 560px;
  padding: 28px 18px 22px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.68);
  border-radius: 36px;
  background:
    radial-gradient(circle at 22% 16%, rgba(255,150,98,.28), transparent 40%),
    radial-gradient(circle at 82% 84%, rgba(217,255,103,.24), transparent 40%),
    linear-gradient(145deg, rgba(255,255,255,.58), rgba(242,233,222,.50));
  box-shadow: 0 1px 0 rgba(255,255,255,.9) inset, 0 30px 70px rgba(77,45,26,.10);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
.ads-map svg { width: min(100%, 440px); height: auto; }
.ads-map-shape {
  fill: url(#ads-ca-fill);
  stroke: var(--orange);
  stroke-width: 2.6;
  stroke-linejoin: round;
  stroke-linecap: round;
}
.ads-map-halo {
  fill: rgba(255,90,31,.22);
  transform-box: fill-box;
  transform-origin: center;
  animation: ads-pulse 3.2s ease-out infinite;
}
.ads-map-marker:nth-child(2) .ads-map-halo { animation-delay: -.5s; }
.ads-map-marker:nth-child(3) .ads-map-halo { animation-delay: -1s; }
.ads-map-marker:nth-child(4) .ads-map-halo { animation-delay: -1.5s; }
.ads-map-marker:nth-child(5) .ads-map-halo { animation-delay: -2s; }
.ads-map-marker:nth-child(6) .ads-map-halo { animation-delay: -2.5s; }
@keyframes ads-pulse {
  0%, 100% { transform: scale(1); opacity: .7; }
  55% { transform: scale(2.35); opacity: 0; }
}
.ads-map-pin { fill: var(--orange); stroke: #fffaf2; stroke-width: 1.6; }
.ads-map-num {
  fill: #fffaf2;
  font-family: "Manrope", system-ui, sans-serif;
  font-size: 8px;
  font-weight: 800;
}
.ads-map-city {
  fill: var(--ink);
  font-family: "DM Sans", system-ui, sans-serif;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .01em;
}
.ads-map-kicker {
  fill: var(--muted);
  font-family: "DM Sans", system-ui, sans-serif;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .14em;
}

.ads-region-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-top: 28px; }
.ads-region {
  padding: 18px 20px 20px;
  border: 1px solid var(--glass-line);
  border-radius: 20px;
  background: linear-gradient(145deg, rgba(255,255,255,.70), rgba(255,255,255,.42));
  box-shadow: var(--shadow);
  backdrop-filter: blur(18px) saturate(125%);
  -webkit-backdrop-filter: blur(18px) saturate(125%);
  transition: transform .28s cubic-bezier(.2,.8,.2,1), border-color .28s, box-shadow .28s;
}
.ads-region:hover { border-color: rgba(255,125,72,.54); box-shadow: var(--shadow-hover); transform: translateY(-4px); }
.ads-region b {
  display: grid;
  width: 26px;
  height: 26px;
  margin-bottom: 10px;
  place-items: center;
  border-radius: 50%;
  background: var(--orange);
  color: white;
  font-size: .68rem;
  font-weight: 900;
}
.ads-region strong { display: block; margin-bottom: 5px; color: var(--ink); font-family: "Manrope"; font-size: 1.04rem; }
.ads-region p { margin: 0; color: #4d463e; font-size: .86rem; line-height: 1.45; }

/* Dark-section scenario cards: never inherit the cream-card + white-heading combo. */
.ads-scenario {
  min-height: 245px;
  padding: 28px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 24px;
  background: linear-gradient(145deg, rgba(42,38,34,.92), rgba(28,25,22,.88));
  box-shadow: 0 1px 0 rgba(255,255,255,.08) inset, 0 18px 44px rgba(0,0,0,.22);
  color: #f3ebe0;
  transition: transform .25s, border-color .25s, background .25s;
}
.ads-scenario:hover {
  border-color: rgba(217,255,103,.4);
  background: linear-gradient(145deg, rgba(50,46,41,.96), rgba(32,29,25,.92));
  transform: translateY(-6px);
}
.ads-scenario b {
  display: grid;
  width: 38px;
  height: 38px;
  margin-bottom: 28px;
  place-items: center;
  border-radius: 50%;
  background: var(--lime);
  color: var(--ink);
}
.ads-scenario h3 { margin: 0 0 16px; color: #fffaf2; }
.ads-scenario p {
  margin: 0 0 12px;
  color: #f3ebe0;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.55;
}
.ads-scenario p:last-child { margin-bottom: 0; }
.ads-scenario strong { color: #fffaf2; font-weight: 800; }

.ads-map-grid + .truth-note { margin-top: 36px; }

.ads-checklist { display: grid; gap: 14px; margin: 36px 0 0; padding: 0; list-style: none; }
.ads-checklist li { display: grid; grid-template-columns: 28px 1fr; gap: 14px; align-items: start; color: var(--muted); }
.ads-checklist li::before {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border-radius: 50%;
  background: var(--orange);
  color: white;
  font-size: .72rem;
  font-weight: 900;
  content: "✓";
}
.ads-checklist strong { display: block; margin-bottom: 3px; color: var(--ink); font-family: "Manrope"; font-size: 1.06rem; }
.ads-checklist + .button-row { margin-top: 36px; }

/* Persistent phone CTA: paid traffic should never have to scroll to convert. */
.ads-cta-bar { display: none; }
@media (max-width: 860px) {
  .ads-map-grid { grid-template-columns: 1fr; gap: 28px; }
  .ads-map { min-height: 0; }
}
@media (max-width: 760px) {
  body.ads-landing { padding-bottom: 108px; }
  .ads-cta-bar {
    position: fixed;
    z-index: 95;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 11px 16px calc(11px + env(safe-area-inset-bottom));
    border-top: 1px solid rgba(255,255,255,.72);
    background: rgba(252,249,244,.88);
    box-shadow: 0 -12px 34px rgba(49,31,19,.13);
    backdrop-filter: blur(22px) saturate(140%);
    -webkit-backdrop-filter: blur(22px) saturate(140%);
  }
  .ads-cta-bar b { display: block; font-family: "Manrope"; font-size: .95rem; line-height: 1.15; }
  .ads-cta-bar small { display: block; color: var(--muted); font-size: .72rem; font-weight: 700; }
  .ads-cta-actions { display: flex; flex: 0 0 auto; align-items: center; gap: 8px; }
  .ads-cta-bar .button { flex: 0 0 auto; padding: 12px 17px; font-size: .84rem; }
  .ads-cta-actions .button--ghost {
    min-height: 44px;
    border-color: rgba(32,29,25,.18);
    background: rgba(255,255,255,.55);
    color: var(--ink);
  }
  .menu-open .ads-cta-bar { display: none; }
}
@media (max-width: 600px) {
  .ads-region-grid { grid-template-columns: 1fr; }
  .ads-map { padding: 18px 8px 12px; border-radius: 26px; }
  .ads-map-city { font-size: 9px; }
}
#insights .lead {
  max-width: 760px;
  color: #2f2a25;
}
.ads-insights-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-top: 36px;
}
a.ads-insight {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  grid-template-rows: auto auto auto;
  column-gap: 16px;
  row-gap: 8px;
  min-width: 0;
  min-height: 0;
  padding: 22px 24px 20px;
  overflow: hidden;
  border: 1px solid rgba(32, 29, 25, .12);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 1px 0 rgba(255,255,255,.9) inset, 0 16px 36px rgba(49,31,19,.08);
  color: var(--ink);
  text-decoration: none;
  transition: transform .28s cubic-bezier(.2,.8,.2,1), border-color .28s, box-shadow .28s;
}
a.ads-insight:hover {
  border-color: rgba(255,90,31,.45);
  box-shadow: 0 1px 0 rgba(255,255,255,.95) inset, 0 22px 48px rgba(49,31,19,.12);
  transform: translateY(-3px);
}
.ads-insight b {
  grid-row: 1 / span 3;
  display: grid;
  width: 40px;
  height: 40px;
  margin: 0;
  place-items: center;
  border-radius: 50%;
  background: var(--lime);
  color: var(--ink);
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .02em;
}
.ads-insight strong {
  display: block;
  min-width: 0;
  margin: 2px 0 0;
  overflow-wrap: anywhere;
  color: var(--ink);
  font-family: "Manrope";
  font-size: 1.18rem;
  line-height: 1.28;
}
.ads-insight p {
  min-width: 0;
  margin: 0;
  overflow-wrap: anywhere;
  color: #2f2a25;
  font-size: .94rem;
  font-weight: 500;
  line-height: 1.5;
}
.ads-insight span {
  min-width: 0;
  margin-top: 6px;
  overflow-wrap: anywhere;
  color: #8f2408;
  font-size: .86rem;
  font-weight: 800;
}
.ads-insights-cta { margin-top: 32px; }
@media (max-width: 720px) {
  .ads-insights-grid { grid-template-columns: 1fr; }
  a.ads-insight {
    grid-template-columns: 36px minmax(0, 1fr);
    padding: 18px 18px 16px;
  }
  .ads-insight b { width: 36px; height: 36px; }
}

body.ads-guide-article .article-hero .lead { color: #2f2a25; }
body.ads-guide-article .article-note,
body.ads-guide-article .article-toc,
body.ads-guide-article .article-related {
  border: 1px solid rgba(32, 29, 25, .12);
  background: #fff;
  box-shadow: 0 12px 32px rgba(49,31,19,.06);
  color: #2f2a25;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
body.ads-guide-article .article-note { color: #2f2a25; }
body.ads-guide-article .article-toc a { color: #2f2a25; }
body.ads-guide-article .article-prose p,
body.ads-guide-article .article-prose li { color: #2f2a25; }
body.ads-guide-article .article-takeaways {
  margin: 8px 0 36px;
  padding: 26px 28px;
  border: 1px solid rgba(32, 29, 25, .12);
  border-radius: 22px;
  background: #fffaf2;
}
body.ads-guide-article .article-takeaways b {
  display: block;
  margin-bottom: 12px;
  color: #8f2408;
  font-size: .72rem;
  letter-spacing: .1em;
  text-transform: uppercase;
}
body.ads-guide-article .article-takeaways ul {
  margin: 0;
  padding-left: 1.15em;
}
body.ads-guide-article .article-takeaways li {
  margin: 8px 0;
  color: #2f2a25;
  font-size: 1.02rem;
  font-weight: 500;
  line-height: 1.55;
}
body.ads-guide-article .article-next {
  margin-top: 8px;
  padding: 26px 28px;
  border: 1px solid rgba(32, 29, 25, .12);
  border-radius: 22px;
  background: #fff;
}
body.ads-guide-article .article-next ol {
  margin: 0;
  padding-left: 1.2em;
}
body.ads-guide-article .article-next li,
body.seo-blog-article .article-next li {
  margin: 10px 0;
  color: #2f2a25;
}

.seo-hub-group { margin: 36px 0 56px; }
.seo-subhead {
  margin: 0 0 18px;
  font-size: 1.35rem;
}
.seo-table-wrap { overflow-x: auto; margin: 18px 0 8px; }
.seo-decision-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 1rem;
}
.seo-decision-table th,
.seo-decision-table td {
  border: 1px solid rgba(32, 29, 25, .12);
  padding: 12px 14px;
  text-align: left;
  vertical-align: top;
}
.seo-decision-table th { background: #fffaf2; color: #8f2408; }
.seo-checklist { margin: 0; padding-left: 1.15em; }
.seo-checklist li { margin: 10px 0; }
.seo-all-wrap h2 { margin-top: 48px; }
.seo-all-wrap h2 small {
  display: inline-block;
  margin-left: 8px;
  color: var(--muted);
  font-size: 1rem;
  font-weight: 600;
}
.seo-all-list {
  columns: 2;
  column-gap: 40px;
  padding-left: 1.1em;
}
.seo-all-list li { margin: 6px 0; break-inside: avoid; }
@media (max-width: 720px) {
  .seo-all-list { columns: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .ads-map-halo { animation: none; }
}

/* Industry Ads landings: segment board (customer contexts, not geography). */
.ads-industry-page .ads-map { min-height: 480px; }
.ads-industry-page .ads-map-city { font-size: 10px; }

/* Homepage — Apple-style marketing composition, scoped to body.home.
   Soft neutrals, large type, hairlines, restrained glass. Ads/geo pages untouched. */
body.home {
  --home-surface: #f5f5f7;
  --home-surface-2: #ffffff;
  --home-ink: #1d1d1f;
  --home-muted: #5c5c61;
  --home-line: rgba(29, 29, 31, 0.12);
  --home-radius: 18px;
  --home-radius-lg: 28px;
  color: var(--home-ink);
  background:
    radial-gradient(90% 55% at 82% 0%, rgba(255, 90, 31, 0.045), transparent 52%),
    var(--home-surface);
}
body.home .section--cream { background: var(--home-surface); }
body.home .eyebrow {
  margin-bottom: 16px;
  color: var(--orange);
  letter-spacing: 0.08em;
  font-weight: 700;
}
body.home .eyebrow::before {
  width: 6px;
  height: 6px;
  background: var(--orange);
}
body.home .lead { color: var(--home-muted); }
body.home .accent { color: var(--orange); }

body.home .hero {
  min-height: auto;
  padding: 132px 0 72px;
  align-items: center;
  overflow: clip;
}
body.home .hero .eyebrow,
body.home .hero h1,
body.home .hero .lead,
body.home .hero .button-row,
body.home .hero-phone,
body.home .hero .dashboard {
  opacity: 1;
  transform: none;
  will-change: transform, opacity;
}
body.home .hero-grid {
  gap: 48px 64px;
  align-items: center;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
}
body.home .hero-copy {
  min-width: 0;
  max-width: 40rem;
}
body.home .hero .eyebrow {
  margin-bottom: 20px;
  color: var(--orange);
  font-size: 0.78rem;
  letter-spacing: 0.14em;
}
body.home .hero h1 {
  max-width: 11.5ch;
  margin-bottom: 24px;
  color: var(--home-ink);
  font-family: "Manrope", system-ui, sans-serif;
  font-size: clamp(2.85rem, 6.2vw, 5.35rem);
  font-weight: 800;
  letter-spacing: -0.065em;
  line-height: 0.96;
  text-wrap: balance;
}
body.home .hero .lead {
  max-width: 32rem;
  margin-bottom: 32px;
  font-size: clamp(1.08rem, 1.4vw, 1.28rem);
  font-weight: 500;
  line-height: 1.55;
  letter-spacing: -0.015em;
}
body.home .hero .button-row {
  gap: 12px;
  margin-bottom: 20px;
}
body.home .hero .button {
  min-height: 48px;
  padding: 0 22px;
  border-radius: 980px;
  font-size: 0.95rem;
  font-weight: 700;
  box-shadow: none;
}
body.home .hero .button:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 20px rgba(29, 29, 31, 0.1);
}
body.home .hero .button--ghost {
  border-color: var(--home-line);
  background: rgba(255, 255, 255, 0.72);
  color: var(--home-ink);
}
body.home .hero-phone {
  margin: 0;
  color: var(--home-muted);
  font-size: 0.92rem;
  font-weight: 600;
}
body.home .hero-phone a {
  color: var(--orange);
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 90, 31, 0.35);
}
body.home .hero-phone a:hover { border-bottom-color: var(--orange); }

/* Product-like hero panel: flat sheet, hairline rows — not a dashboard collage. */
body.home .hero-art {
  min-height: 0;
  place-items: center end;
  justify-items: end;
}
body.home .dashboard.hero-system {
  position: relative;
  width: min(100%, 380px);
  padding: 28px 28px 22px;
  border: 1px solid rgba(255, 255, 255, 0.95);
  border-radius: var(--home-radius-lg);
  background:
    linear-gradient(165deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.9)),
    #fff;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 1) inset,
    0 28px 60px rgba(29, 29, 31, 0.1),
    0 8px 24px rgba(255, 90, 31, 0.06);
  backdrop-filter: blur(20px) saturate(140%);
  -webkit-backdrop-filter: blur(20px) saturate(140%);
  rotate: 0deg;
}
body.home .dashboard.hero-system::before {
  position: absolute;
  z-index: -1;
  inset: 12% -8% -10% 18%;
  border-radius: 40% 60% 55% 45%;
  background: radial-gradient(circle at 40% 40%, rgba(255, 90, 31, 0.18), transparent 68%);
  content: "";
  filter: blur(28px);
  pointer-events: none;
}
body.home .hero-system-kicker {
  margin: 0 0 20px;
  color: #6e6e73;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
body.home .hero-lanes {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--home-line);
}
body.home .hero-lanes li {
  display: grid;
  grid-template-columns: 2.2rem 1fr;
  gap: 8px;
  align-items: center;
  padding: 16px 0;
  border: 0;
  border-bottom: 1px solid var(--home-line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  transition: color 0.25s ease;
}
body.home .hero-lanes li.is-active {
  border-color: var(--home-line);
  background: transparent;
  box-shadow: none;
}
body.home .hero-lanes li.is-active strong { color: var(--orange); }
body.home .lane-num {
  color: var(--home-muted);
  font-family: "Manrope", system-ui, sans-serif;
  font-size: 0.78rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}
body.home .hero-lanes li.is-active .lane-num { color: var(--orange); }
body.home .hero-lanes strong {
  display: block;
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.2;
}
body.home .hero-system-foot {
  margin: 18px 0 0;
  color: var(--home-muted);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

body.home .logo-strip {
  overflow: hidden;
  border-color: var(--home-line);
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
body.home .logo-strip .marquee {
  width: max-content;
  will-change: transform;
}
body.home .logo-strip .marquee span {
  padding: 14px 28px;
  color: var(--home-muted);
  font-size: 0.68rem;
  letter-spacing: 0.14em;
}
body.home .marquee span::after { color: rgba(255, 90, 31, 0.55); }

body.home .trust-strip { padding: 28px 0 8px; }
body.home .trust-heading { margin-bottom: 18px; }
body.home .trust-heading span {
  border-color: var(--home-line);
  background: rgba(255, 255, 255, 0.7);
  box-shadow: none;
  color: var(--home-muted);
  letter-spacing: 0.1em;
}
body.home .trust-strip .trust-logo {
  width: 180px;
  height: 72px;
  padding: 20px 24px;
  border-color: var(--home-line);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.78);
  box-shadow: none;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
body.home .trust-strip .trust-logo::before { display: none; }
body.home .trust-strip .trust-logo:hover {
  border-color: rgba(255, 90, 31, 0.35);
  background: #fff;
  box-shadow: none;
  transform: translateY(-2px);
}
body.home .trust-strip .trust-logo img { height: 22px; }

body.home .section { padding: 88px 0; }
body.home .section--problem { padding-top: 72px; padding-bottom: 72px; }
body.home .section--cta { padding-top: 40px; padding-bottom: 96px; }
body.home h2 {
  max-width: 18ch;
  margin-bottom: 16px;
  color: var(--home-ink);
  font-size: clamp(2.1rem, 4vw, 3.6rem);
  font-weight: 800;
  letter-spacing: -0.055em;
  line-height: 1.02;
}
body.home .intro-grid { gap: 48px; align-items: start; }
body.home .statement {
  margin-bottom: 0;
  color: var(--home-ink);
  font-size: clamp(1.55rem, 2.8vw, 2.6rem);
  font-weight: 800;
  letter-spacing: -0.045em;
  line-height: 1.15;
}

body.home .cards {
  gap: 14px;
  margin-top: 36px;
}
body.home .service-card {
  min-height: 220px;
  padding: 26px;
  border-color: var(--home-line);
  border-radius: var(--home-radius);
  background: var(--home-surface-2);
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
body.home .service-card:nth-child(4n+2),
body.home .service-card:nth-child(4n+3) {
  background: rgba(255, 255, 255, 0.72);
}
body.home .service-card:hover {
  border-color: rgba(255, 90, 31, 0.4);
  background: #fff;
  box-shadow: 0 16px 40px rgba(29, 29, 31, 0.08);
  transform: translateY(-3px);
}
body.home .service-card h3 {
  margin: 28px 0 10px;
  font-size: clamp(1.2rem, 1.7vw, 1.65rem);
  letter-spacing: -0.04em;
  line-height: 1.1;
}
body.home .service-card p {
  max-width: 34ch;
  margin-bottom: 40px;
  color: var(--home-muted);
  font-size: 0.92rem;
  line-height: 1.5;
}
body.home .card-index {
  font-size: 0.68rem;
  letter-spacing: 0.12em;
}
body.home .card-icon {
  top: 20px;
  right: 20px;
  width: 44px;
  height: 44px;
}
body.home .card-link {
  right: 22px;
  bottom: 20px;
  font-size: 0.86rem;
  color: var(--orange);
}

body.home .lifecycle-grid { gap: 48px; }
/* Dark lifecycle panel: home ink/muted overrides must not win. All copy stays white. */
body.home .section--dark {
  color: #fffaf2;
  background:
    radial-gradient(circle at 14% 10%, rgba(255, 90, 31, 0.22), transparent 28rem),
    radial-gradient(circle at 88% 82%, rgba(255, 250, 242, 0.05), transparent 24rem),
    linear-gradient(155deg, #1a1816 0%, #0f0e0d 100%);
}
body.home .section--dark .eyebrow {
  color: rgba(255, 250, 242, 0.92);
}
body.home .section--dark .eyebrow::before {
  background: #fffaf2;
}
body.home .section--dark h2,
body.home .section--dark .loop-word,
body.home .section--dark .step strong,
body.home .section--dark .step b {
  color: #fffaf2;
}
body.home .section--dark .lead,
body.home .section--dark .step p {
  color: rgba(255, 250, 242, 0.88);
}
body.home .section--dark .steps {
  border-top-color: rgba(255, 250, 242, 0.18);
}
body.home .section--dark .step {
  border-bottom-color: rgba(255, 250, 242, 0.18);
}
body.home .steps { margin-top: 28px; }
body.home .step {
  padding: 16px 0;
  border-color: rgba(255, 255, 255, 0.14);
}
body.home .loop-art {
  border: 1px solid rgba(255, 250, 242, 0.14);
  border-radius: var(--home-radius-lg);
  background:
    radial-gradient(circle at 50% 50%, rgba(255, 90, 31, 0.2), transparent 55%),
    rgba(255, 250, 242, 0.03);
}
body.home .loop-word {
  color: #fffaf2;
  font-size: clamp(1.3rem, 2.6vw, 2.2rem);
  letter-spacing: -0.04em;
}
body.home .loop-node {
  background: #fffaf2;
  color: #1a1816;
}
body.home .metric-grid {
  gap: 14px;
  margin-top: 36px;
  border: 0;
  background: transparent;
}
body.home .metric {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  padding: 28px;
  border: 1px solid var(--home-line);
  border-radius: var(--home-radius);
  background: #ffffff;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 1) inset, 0 12px 32px rgba(29, 29, 31, 0.05);
}
body.home .metric::before {
  position: absolute;
  z-index: 0;
  inset: 0;
  background:
    radial-gradient(90% 70% at 100% -10%, rgba(255, 90, 31, 0.07), transparent 52%);
  content: "";
  pointer-events: none;
}
body.home .metric > * {
  position: relative;
  z-index: 1;
}
body.home .metric strong {
  margin-bottom: 10px;
  color: var(--home-ink);
  font-size: clamp(2rem, 3.2vw, 3.2rem);
  letter-spacing: -0.06em;
}
body.home .metric p {
  margin: 0;
  max-width: 28ch;
  color: var(--home-muted);
  font-size: 0.95rem;
  line-height: 1.5;
}

body.home .section--orange h2,
body.home .section--orange .process-card h3 {
  color: #fffaf2;
}
body.home .section--orange .process-card p {
  color: rgba(255, 250, 242, 0.9);
}
body.home .section--orange .eyebrow {
  color: rgba(255, 250, 242, 0.92);
}
body.home .section--orange .eyebrow::before {
  background: #fffaf2;
}
body.home .industry-head { margin-bottom: 28px; gap: 20px; }
body.home .location-disclosure {
  border-color: var(--home-line);
  border-radius: var(--home-radius);
  background: rgba(255, 255, 255, 0.72);
  box-shadow: none;
}
body.home .process-grid {
  gap: 12px;
  margin-top: 36px;
}
body.home .process-card {
  padding: 24px;
  border-radius: var(--home-radius);
}
body.home .process-card h3 {
  margin: 12px 0 8px;
  font-size: 1.15rem;
  letter-spacing: -0.03em;
}
body.home .process-card p {
  margin: 0;
  font-size: 0.92rem;
  line-height: 1.45;
  opacity: 0.9;
}
body.home .faq { margin-top: 12px; max-width: 820px; }
body.home .faq details {
  border-color: var(--home-line);
  background: transparent;
  box-shadow: none;
}
body.home .faq summary {
  padding: 18px 0;
  color: var(--home-ink);
  font-size: 1.08rem;
  font-weight: 700;
  letter-spacing: -0.02em;
}
body.home .faq p {
  color: var(--home-muted);
  font-size: 0.98rem;
  line-height: 1.55;
}

body.home .cta-panel {
  gap: 32px;
  padding: clamp(36px, 5vw, 56px);
  border-radius: var(--home-radius-lg);
  background: var(--orange);
  box-shadow: none;
}
body.home .cta-panel h2 {
  max-width: 14ch;
  color: #fff;
  font-size: clamp(1.85rem, 3.2vw, 3rem);
}
body.home .cta-panel .eyebrow { color: rgba(255, 250, 242, 0.85); }
body.home .cta-actions p { color: rgba(255, 250, 242, 0.88); }
body.home .cta-phone {
  margin: 14px 0 0;
  font-size: 0.9rem;
  font-weight: 600;
}
body.home .cta-phone a {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 3px;
}

body.home .site-footer { padding: 48px 0 20px; }
body.home .footer-grid { gap: 32px; }
body.home .footer-brand p {
  margin: 12px 0 0;
  color: rgba(255, 250, 242, 0.58);
  font-size: 0.9rem;
  line-height: 1.45;
}
body.home .footer-col b { margin-bottom: 12px; }
body.home .footer-col a {
  margin: 7px 0;
  font-size: 0.9rem;
}
body.home .footer-bottom {
  margin-top: 32px;
  padding-top: 18px;
  border-top-color: rgba(255, 255, 255, 0.1);
}


/* Quieter chrome on home — less warm glass, fewer competing surfaces. */
body.home .site-header {
  padding: 8px 0;
}
body.home .site-header.scrolled {
  background: rgba(245, 245, 247, 0.86);
  box-shadow: 0 1px 0 var(--home-line);
}
body.home .nav {
  min-height: 72px;
  border-color: transparent;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
body.home .site-header.scrolled .nav {
  border-color: rgba(255, 255, 255, 0.7);
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.9) inset;
  backdrop-filter: blur(16px) saturate(140%);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
}
body.home .nav-links {
  gap: clamp(14px, 1.8vw, 28px);
}
body.home .button--orange {
  box-shadow: none;
}
body.home .service-card:hover,
body.home .trust-strip .trust-logo:hover {
  background-image: none;
}

@media (prefers-reduced-motion: reduce) {
  body.home .hero .button:hover,
  body.home .service-card:hover,
  body.home .trust-strip .trust-logo:hover {
    transform: none;
  }
  body.home .logo-strip .marquee { animation: none; }
  body.home .dashboard.hero-system::before { display: none; }
}

@media (max-width: 1100px) {
  body.home .nav-links {
    gap: 16px;
    font-size: 0.86rem;
  }
  body.home .nav-links .button {
    min-height: 42px;
    padding: 0 16px;
    font-size: 0.86rem;
  }
}

@media (max-width: 900px) {
  body.home .hero {
    padding: 108px 0 44px;
    align-items: start;
  }
  body.home .hero-grid {
    grid-template-columns: 1fr;
    gap: 36px;
    align-items: start;
  }
  body.home .hero-copy { max-width: none; }
  body.home .hero h1 { max-width: 14ch; }
  body.home .hero-art {
    min-height: 0;
    justify-items: stretch;
    place-items: start stretch;
  }
  body.home .dashboard.hero-system {
    width: min(100%, 400px);
    max-width: 100%;
    margin-inline: 0;
  }
  body.home .section { padding: 72px 0; }
  body.home h2 { max-width: none; }
  body.home .nav,
  body.home .site-header.scrolled .nav {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    background: rgba(245, 245, 247, 0.96);
  }
}

@media (max-width: 600px) {
  body.home .section { padding: 56px 0; }
  body.home .section--problem { padding-top: 48px; padding-bottom: 48px; }
  body.home .section--cta { padding-bottom: 64px; }
  body.home .hero { padding: 112px 0 36px; }
  body.home .hero h1 {
    max-width: none;
    margin-bottom: 16px;
    font-size: clamp(2.45rem, 10.5vw, 3.35rem);
    letter-spacing: -0.055em;
    overflow-wrap: break-word;
  }
  body.home .hero .lead {
    margin-bottom: 20px;
    font-size: 1rem;
    line-height: 1.5;
  }
  body.home .hero .button-row { gap: 8px; margin-bottom: 14px; }
  body.home .hero-phone { font-size: 0.88rem; }
  body.home .hero-art { margin-top: 8px; }
  body.home .dashboard.hero-system {
    width: 100%;
    padding: 22px 20px 18px;
    border-radius: 22px;
  }
  body.home .dashboard.hero-system::before { display: none; }
  body.home .hero-lanes li { padding: 14px 0; }
  body.home .hero-lanes strong { font-size: 0.98rem; }
  body.home .service-card { min-height: 0; padding: 22px; }
  body.home .service-card p { margin-bottom: 32px; }
  body.home .trust-strip { padding: 20px 0 4px; }
  body.home .trust-strip .trust-logo {
    width: 152px;
    height: 64px;
    padding: 16px 18px;
  }
  body.home .trust-strip .trust-logo img { height: 20px; }
  body.home .cta-panel { padding: 28px 22px; }
  body.home .cta-actions { text-align: left; }
  body.home .metric { padding: 22px; }
  body.home .logo-strip .marquee span { padding: 12px 20px; }
}