
.next-case-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 64px clamp(24px, 4vw, 64px);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 32px;
  flex-wrap: wrap;
}
.next-label {
  font-family: var(--mono);
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.6);
  margin-bottom: 12px;
}
.next-title {
  font-family: var(--mono);
  font-size: clamp(1.5rem, 3vw, 2.5rem);
  font-weight: 700;
  letter-spacing: -0.03em;
  color: var(--white);
  transition: color 0.3s;
}
.next-case-inner:hover .next-title { color: var(--accent); }
.next-arrow { font-size: 2rem; color: var(--accent); }

/* CASE STUDY RESPONSIVE */
@media (max-width: 900px) {
  .case-body { grid-template-columns: 1fr; gap: 48px; }
  .case-sidebar { position: static; }
  .case-stats-inner { grid-template-columns: repeat(3, 1fr); gap: 32px; }
  .results-grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .case-stats-inner { grid-template-columns: 1fr; gap: 32px; }
  .next-case-inner { flex-direction: column; align-items: flex-start; }
}

/* ============================================
   CASE STUDY CTA FORM
   ============================================ */
.case-cta {
  background: var(--black);
  padding: 80px 24px;
  text-align: center;
  border-top: 1px solid rgba(255,255,255,0.06);
  position: relative;
  overflow: hidden;
}
.case-cta::before {
  content: '';
  position: absolute;
  width: 500px;
  height: 500px;
  border-radius: 50%;
  border: 1px solid rgba(212, 184, 138, 0.05);
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}
.case-cta .section-tag {
  font-family: var(--mono);
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--accent);
  margin-bottom: 16px;
  display: block;
}
.case-cta h2 {
  font-family: var(--serif);
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  font-weight: 400;
  color: var(--white);
  line-height: 1.2;
  margin-bottom: 16px;
}
.case-cta .cta-sub {
  font-size: 1rem;
  color: rgba(255,255,255,0.5);
  max-width: 480px;
  margin: 0 auto 40px;
  line-height: 1.7;
}
.case-cta .cta-form {
  max-width: 520px;
  margin: 0 auto 24px;
}
.case-cta .cta-email {
  display: block;
  text-align: center;
  font-size: 0.8125rem;
  color: rgba(255,255,255,0.6);
  text-decoration: none;
  transition: color 0.3s;
}
.case-cta .cta-email:hover {
  color: var(--accent);
}

/* ============================================
   REDUCED MOTION (Accessibility)
   ============================================ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  html { scroll-behavior: auto; }
}

/* ============================================
   ALL-SANS HEADLINES (team QA) — display headings
   bumped to bold + tight tracking to match the hero.
   Delete this block + revert the --serif var to restore Playfair.
   ============================================ */
.services-heading, .section-heading, .approach-heading, .about-text h2,
.cta h2, .cta-thanks-title, .faq-headline, .giving-headline, .article h2,
.sub-h, .ai-band-heading, .case-content h2, .case-cta h2, .case-hero h1,
.case-info h3, .case-small h4, .res-card h3, .value-cell h3, .ai-op h3 {
  font-weight: 700;
  letter-spacing: -0.02em;
}

/* ---- Brandwell portal: branded sign-in + live dashboard, two-up ---- */
.portal-duo {
  width: 100%;
  max-width: 1120px;
  margin: 8px auto 0;
  padding: 0 clamp(24px, 4vw, 64px);
  display: grid;
  grid-template-columns: 44fr 56fr;
  gap: clamp(14px, 2vw, 26px);
  align-items: start;
}
.portal-duo figure { margin: 0; }
.portal-duo img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 12px;
}
.portal-duo figcaption {
  margin-top: 12px;
  font-family: var(--mono);
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--accent);
  text-align: center;
}
.portal-duo-caption {
  max-width: 640px;
  margin: 18px auto 0;
  padding: 0 clamp(24px, 4vw, 64px) 28px;
  font-family: var(--sans);
  font-size: 0.9rem;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.5);
  text-align: center;
}
@media (max-width: 720px) {
  .portal-duo { grid-template-columns: 1fr; gap: 26px; }
}

/* ============================================
   AI OPERATOR FLOW (scroll-pinned timeline)
   ============================================ */
.agent-flow { position: relative; height: 320vh; background: var(--black); }
.agent-flow-sticky {
  position: sticky; top: 0;
  height: 100vh;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: clamp(36px, 6vh, 64px);
  padding: 0 clamp(24px, 5vw, 80px);
  text-align: center;
}
.agent-flow-eyebrow { display: block; }
.agent-flow-title {
  font-family: var(--serif);
  font-weight: 700;
  letter-spacing: -0.02em;
  font-size: clamp(1.9rem, 4.2vw, 3.1rem);
  line-height: 1.1;
  color: var(--white);
}
.agent-flow-title em { font-style: italic; color: var(--accent); }

.agent-flow-stage { width: 100%; max-width: 1080px; }
.agent-iconrow { position: relative; height: 96px; }
.agent-wave { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.agent-wave-track { fill: none; stroke: rgba(255,255,255,0.12); stroke-width: 2; }
.agent-wave-draw  { fill: none; stroke: var(--accent); stroke-width: 2.5; stroke-linecap: round; }

.agent-icons { position: relative; z-index: 2; height: 100%; display: grid; grid-template-columns: repeat(4, 1fr); }
.agent-icon {
  place-self: center;
  width: 60px; height: 60px; border-radius: 50%;
  display: grid; place-items: center;
  background: var(--black); border: 1.5px solid rgba(212,184,138,0.3);
  color: var(--accent);
  /* Progressive enhancement: visible by default; JS adds .animated to hide-then-reveal on scroll.
     If JS never runs (mobile/reduced-motion/load-narrow-then-widen) the content stays visible. */
  transition: transform .55s cubic-bezier(.16,1,.3,1), opacity .45s, border-color .45s, box-shadow .45s;
}
.agent-flow.animated .agent-icon { opacity: 0; transform: scale(0.5); }
.agent-icon svg { width: 28px; height: 28px; }
.agent-flow.animated .agent-icon.active { opacity: 1; transform: scale(1); border-color: var(--accent); box-shadow: 0 0 0 6px rgba(212,184,138,0.06); }

.agent-textrow { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(16px, 2.5vw, 40px); margin-top: clamp(28px, 4vh, 52px); }
.agent-node-text { transition: opacity .55s, transform .55s cubic-bezier(.16,1,.3,1); }
.agent-flow.animated .agent-node-text { opacity: 0; transform: translateY(22px); }
.agent-flow.animated .agent-node-text.active { opacity: 1; transform: none; }
.agent-node-text h3 { font-family: var(--serif); font-weight: 700; font-size: 1.15rem; color: var(--white); margin: 12px 0 8px; letter-spacing: -0.01em; }
.agent-node-text p { font-size: 0.9rem; line-height: 1.55; color: rgba(255,255,255,0.55); }

/* Mobile: un-pin, stack vertically, show all (no horizontal wave) */
@media (max-width: 760px) {
  .agent-flow { height: auto; }
  .agent-flow-sticky { position: static; height: auto; padding: 80px clamp(24px,6vw,40px); gap: 36px; }
  .agent-iconrow { display: none; }
  .agent-textrow { grid-template-columns: 1fr; gap: 28px; text-align: left; }
  .agent-node-text { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  /* Un-pin so reduced-motion users don't scroll ~220vh of dead space past a static view */
  .agent-flow { height: auto; }
  .agent-flow-sticky { position: static; height: auto; padding: clamp(80px,12vh,120px) clamp(24px,5vw,80px); gap: 40px; }
  .agent-icon, .agent-node-text { opacity: 1; transform: none; transition: none; }
  .agent-wave-draw { stroke-dashoffset: 0; } /* show the full connecting line statically */
}

/* ============================================
   AI OPERATOR ORBIT (services.html)
   ============================================ */
.orbit { padding: clamp(80px,12vh,140px) clamp(24px,5vw,80px); text-align: center; position: relative; }
.orbit-eyebrow { display: inline-block; }
.orbit-title { font-family: var(--serif); font-weight: 700; letter-spacing: -0.02em; font-size: clamp(1.9rem,4vw,3rem); line-height: 1.1; color: var(--white); margin: 16px 0 clamp(34px,5vh,60px); }
.orbit-title em { font-style: italic; color: var(--accent); }
.orbit-stage { position: relative; width: 660px; max-width: 94vw; aspect-ratio: 1/1; margin: 0 auto; }
.orbit-svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.orbit-ring { fill: none; stroke: rgba(255,255,255,0.1); stroke-width: 1.5; stroke-dasharray: 3 8; transform-origin: 240px 240px; animation: orbitspin 70s linear infinite; }
@keyframes orbitspin { to { transform: rotate(360deg); } }
.orbit-conn { stroke: rgba(212,184,138,0.22); stroke-width: 1.5; stroke-dasharray: 1; stroke-dashoffset: 1; }
.orbit.in .orbit-conn { stroke-dashoffset: 0; transition: stroke-dashoffset 1s ease .3s; }
.orbit-pulse { fill: var(--accent); opacity: 0; filter: drop-shadow(0 0 5px rgba(212,184,138,0.8)); }
.orbit.in .orbit-pulse { opacity: 1; transition: opacity .6s 1s; }
.orbit-core { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 200px; height: 200px; border-radius: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; background: radial-gradient(circle at 50% 40%, rgba(212,184,138,0.14), rgba(10,10,10,0.92) 70%); border: 1.5px solid rgba(212,184,138,0.45); animation: corepulse 3.4s ease-in-out infinite; }
@keyframes corepulse { 0%,100% { box-shadow: 0 0 40px rgba(212,184,138,0.12); } 50% { box-shadow: 0 0 64px rgba(212,184,138,0.24); } }
.orbit-core-glyph { display: block; color: var(--accent); margin-bottom: 7px; }
.orbit-core-glyph svg { width: 36px; height: 36px; }
.orbit-core-label { display: block; font-family: var(--serif); font-weight: 700; font-size: 1.2rem; color: var(--white); }
.orbit-core-sub { display: block; font-family: var(--mono); font-size: 0.6rem; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(255,255,255,0.45); margin-top: 3px; }
.orbit-node { position: absolute; transform: translate(-50%,-50%) scale(0.8); width: 184px; display: flex; flex-direction: column; align-items: center; text-align: center; opacity: 0; transition: opacity .6s, transform .6s cubic-bezier(.16,1,.3,1); }
.orbit.in .orbit-node { opacity: 1; transform: translate(-50%,-50%) scale(1); }
.orbit.in .orbit-node[data-i="0"] { transition-delay: .15s; }
.orbit.in .orbit-node[data-i="1"] { transition-delay: .3s; }
.orbit.in .orbit-node[data-i="2"] { transition-delay: .45s; }
.orbit.in .orbit-node[data-i="3"] { transition-delay: .6s; }
.orbit-ico { width: 68px; height: 68px; border-radius: 50%; display: grid; place-items: center; background: var(--black); border: 1.5px solid var(--accent); color: var(--accent); margin-bottom: 14px; }
.orbit-ico svg { width: 32px; height: 32px; }
.orbit-node .ai-op-tag { display: block; white-space: nowrap; font-size: 0.8rem; }
.orbit-role { font-family: var(--serif); font-weight: 700; font-size: 1.1rem; color: var(--white); margin-top: 4px; white-space: nowrap; }
@media (max-width: 640px) {
  /* Keep the full orbit (ring, connectors, pulses, live dashboard core) on mobile, scaled down */
  .orbit-stage { width: 100%; max-width: 360px; }
  .orbit-core { width: 110px; height: 110px; }
  .orbit-core-glyph { margin-bottom: 5px; }
  .orbit-core-glyph svg { width: 24px; height: 24px; }
  .orbit-core-label { font-size: 0.82rem; }
  .orbit-core-sub { font-size: 0.54rem; }
  .orbit-node { width: 118px; }
  .orbit-ico { width: 44px; height: 44px; margin-bottom: 8px; }
  .orbit-ico svg { width: 21px; height: 21px; }
  .orbit-node .ai-op-tag { font-size: 0.72rem; }
  .orbit-role { font-size: 0.92rem; }
}

/* ===== Operator-team orbit: Spotlight scrollytelling (home only) ===== */
.orbit-scroll { height: 320vh; padding: 0; }
.orbit-pin { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: clamp(6px,1.6vh,16px); padding: clamp(36px,5vh,64px) clamp(24px,5vw,80px); overflow: hidden; }
.orbit-pin > *:not(.section-bg) { position: relative; z-index: 1; }
.orbit-scrollhint { font-family: var(--mono); font-size: 0.64rem; letter-spacing: 0.18em; text-transform: uppercase; color: rgba(255,255,255,0.4); margin: 2px 0 0; transition: opacity .4s; }
.orbit-scroll.is-stepping .orbit-scrollhint { opacity: 0; }
.orbit-scene { position: relative; width: min(1240px,96vw); margin-top: clamp(8px,2.5vh,26px); display: flex; justify-content: center; }
/* Scroll mode: narrower stage opens up corner gutters + a clear bottom-center channel
   so all 5 prompt windows can sit on screen together at the final step without overlap. */
.orbit-scroll .orbit-scene { padding-bottom: clamp(120px,18vh,180px); }
.orbit-scroll .orbit-stage { margin: 0 auto; width: min(430px, 40vh); }
.orbit-scroll .orbit-title { margin: 8px 0 0; }

/* Magnetic pull: operators continuously lean toward the Live dashboard, each icon
   glowing as it pushes in. Pure CSS, always on, zero dependency on the JS .in class
   (so it runs identically in in-app browsers like Instagram). Applies to BOTH the
   homepage scroll orbit and the services-page static orbit (scoped to .orbit, not
   .orbit-scroll). On the homepage this replaces the old per-step node spotlight;
   the prompt windows + core highlight still step on scroll. */
.orbit .orbit-node { opacity: 1; }
.orbit .orbit-conn { stroke-dashoffset: 0; }
.orbit .orbit-pulse { opacity: 0.85; }
.orbit .orbit-node[data-i="0"] { animation: orbitPull0 3s ease-in-out infinite; }
.orbit .orbit-node[data-i="1"] { animation: orbitPull1 3s ease-in-out infinite .4s; }
.orbit .orbit-node[data-i="2"] { animation: orbitPull2 3s ease-in-out infinite .8s; }
.orbit .orbit-node[data-i="3"] { animation: orbitPull3 3s ease-in-out infinite 1.2s; }
@keyframes orbitPull0 { 0%,100% { transform: translate(-50%,-50%); } 45% { transform: translate(-50%,-50%) translate(16px,16px); } }
@keyframes orbitPull1 { 0%,100% { transform: translate(-50%,-50%); } 45% { transform: translate(-50%,-50%) translate(-16px,16px); } }
@keyframes orbitPull2 { 0%,100% { transform: translate(-50%,-50%); } 45% { transform: translate(-50%,-50%) translate(16px,-16px); } }
@keyframes orbitPull3 { 0%,100% { transform: translate(-50%,-50%); } 45% { transform: translate(-50%,-50%) translate(-16px,-16px); } }
.orbit .orbit-node .orbit-ico { animation: orbitIco 3s ease-in-out infinite; }
.orbit .orbit-node[data-i="1"] .orbit-ico { animation-delay: .4s; }
.orbit .orbit-node[data-i="2"] .orbit-ico { animation-delay: .8s; }
.orbit .orbit-node[data-i="3"] .orbit-ico { animation-delay: 1.2s; }
@keyframes orbitIco { 0%,100% { box-shadow: none; border-color: var(--accent); } 45% { box-shadow: 0 0 22px rgba(212,184,138,0.55); border-color: rgba(212,184,138,1); } }
.orbit-scroll .orbit-core { transition: opacity .5s, transform .5s, box-shadow .5s, border-color .5s; }
.orbit-scroll .orbit-core.is-dim { opacity: 0.5; }
.orbit-scroll .orbit-core.is-active { border-color: var(--accent); box-shadow: 0 0 80px rgba(212,184,138,0.4); transform: translate(-50%,-50%) scale(1.06); }

/* prompt windows */
.orbit-win { position: absolute; width: clamp(228px,21vw,266px); background: linear-gradient(180deg, rgba(26,24,20,0.97), rgba(13,12,10,0.97)); border: 1px solid rgba(212,184,138,0.22); border-radius: 14px; padding: 13px 14px 14px; box-shadow: 0 24px 60px rgba(0,0,0,0.55); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); opacity: 0; transform: translateY(14px) scale(0.97); transition: opacity .5s ease, transform .55s cubic-bezier(.16,1,.3,1); pointer-events: none; z-index: 6; }
.orbit-win.is-on { opacity: 1; transform: translateY(0) scale(1); }
/* 4 operators in the corner gutters, dashboard centered in the bottom channel.
   The scene's bottom padding (above) reserves the room so nothing overlaps the orbit. */
.ow-tl { top: 0; left: 0; }
.ow-tr { top: 0; right: 0; }
.ow-bl { top: 42%; left: 0; }
.ow-br { top: 42%; right: 0; }
/* Dashboard = a wide, short summary bar across the bottom-center channel.
   4 KPIs in one row keeps it low enough to clear the orbit below the stage. */
.orbit-scroll .ow-bc { bottom: 0; left: 50%; width: min(560px,52vw); transform: translateX(-50%) translateY(14px) scale(0.97); }
.orbit-scroll .ow-bc.is-on { transform: translateX(-50%) translateY(0) scale(1); }
.orbit-scroll .ow-bc .ow-kpis { grid-template-columns: repeat(4,1fr); }
.orbit-scroll .ow-bc .ow-foot { margin-top: 9px; }

.ow-head { display: flex; align-items: center; gap: 7px; font-family: var(--mono); font-size: 0.62rem; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(255,255,255,0.85); margin-bottom: 11px; }
.ow-led { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 8px rgba(212,184,138,0.8); flex: none; }
.ow-led-live { background: var(--green); box-shadow: 0 0 8px rgba(52,211,153,0.9); animation: owpulse 1.6s ease-in-out infinite; }
@keyframes owpulse { 0%,100% { opacity: 1; } 50% { opacity: 0.4; } }
.ow-tag { margin-left: auto; font-size: 0.56rem; color: var(--accent); opacity: 0.85; }
.ow-body { display: flex; flex-direction: column; gap: 6px; }
.ow-label { font-family: var(--sans); font-size: 0.74rem; color: rgba(255,255,255,0.6); margin-bottom: 4px; }
.ow-bars { display: flex; align-items: flex-end; gap: 6px; height: 54px; }
.ow-bars i { flex: 1; height: var(--h); background: linear-gradient(180deg, var(--accent), rgba(212,184,138,0.32)); border-radius: 3px 3px 0 0; transform-origin: bottom; }
.orbit-win.is-on .ow-bars i { animation: owbar .6s cubic-bezier(.16,1,.3,1) both; }
.orbit-win.is-on .ow-bars i:nth-child(2) { animation-delay: .06s; }
.orbit-win.is-on .ow-bars i:nth-child(3) { animation-delay: .12s; }
.orbit-win.is-on .ow-bars i:nth-child(4) { animation-delay: .18s; }
.orbit-win.is-on .ow-bars i:nth-child(5) { animation-delay: .24s; }
@keyframes owbar { from { transform: scaleY(0); } to { transform: scaleY(1); } }
.ow-row { display: flex; justify-content: space-between; align-items: center; font-family: var(--sans); font-size: 0.78rem; color: rgba(255,255,255,0.65); padding: 5px 0; border-bottom: 1px solid rgba(255,255,255,0.06); }
.ow-row b { font-family: var(--mono); color: #fff; font-weight: 500; }
.ow-row.ow-flag { color: var(--accent); border-bottom: none; }
.ow-row.ow-flag b { color: var(--accent); }
.ow-lead, .ow-task { display: flex; align-items: center; gap: 8px; font-family: var(--sans); font-size: 0.76rem; color: rgba(255,255,255,0.6); padding: 4px 0; }
.ow-pin { width: 6px; height: 6px; border-radius: 50%; border: 1.5px solid rgba(255,255,255,0.4); flex: none; }
.ow-lead.ow-done { color: #fff; }
.ow-lead.ow-done .ow-pin { background: var(--green); border-color: var(--green); }
.ow-task::before { content: '\21bb'; color: rgba(255,255,255,0.4); }
.ow-task.ow-done { color: rgba(255,255,255,0.85); }
.ow-task.ow-done::before { content: '\2713'; color: var(--green); }
.ow-kpis { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ow-kpi { background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.06); border-radius: 8px; padding: 9px 10px; text-align: left; }
.ow-kpi b { display: block; font-family: var(--mono); font-size: 1.1rem; color: #fff; font-weight: 600; }
.ow-kpi span { font-family: var(--mono); font-size: 0.55rem; letter-spacing: 0.07em; text-transform: uppercase; color: rgba(255,255,255,0.45); }
.ow-foot { margin-top: 12px; }
.ow-chip { display: inline-flex; align-items: center; gap: 6px; font-family: var(--mono); font-size: 0.66rem; font-weight: 500; padding: 6px 11px; border-radius: 100px; }
.ow-chip::before { content: ''; width: 6px; height: 6px; border-radius: 50%; }
.ow-chip.up { background: rgba(52,211,153,0.12); color: var(--green); }
.ow-chip.up::before { background: var(--green); }
.ow-chip.save { background: rgba(212,184,138,0.14); color: var(--accent); }
.ow-chip.save::before { background: var(--accent); }
.ow-chip.show { background: rgba(255,255,255,0.08); color: #fff; }
.ow-chip.show::before { background: #fff; }

/* mobile + reduced-motion: unpin, show orbit, stack ALL windows statically (no scroll logic).
   These override the desktop scroll-mode rules (incl. .orbit-scroll .ow-bc) so the dashboard
   window doesn't stay translateX(-50%)'d off-screen and the corner windows don't overflow. */
@media (max-width: 1080px) {
  .orbit-scroll { height: auto; padding: clamp(60px,9vh,90px) 0; }
  .orbit-pin { position: static; height: auto; display: block; overflow: visible; padding: 0 clamp(20px,5vw,40px); }
  .orbit-scene, .orbit-scroll .orbit-scene { flex-direction: column; align-items: center; width: 100%; padding-bottom: 0; }
  .orbit-scroll .orbit-stage { width: 100%; max-width: 360px; }
  /* Nodes + connectors visible UNCONDITIONALLY on mobile (no JS dependency). The
     scroll spotlight is disabled at this width, so nodes must not rely on the
     JS-added .orbit.in class to reveal — it doesn't apply in some in-app browsers
     (IG), leaving the ring empty. Mirrors the unconditional .orbit-win rule below. */
  .orbit-scroll .orbit-node, .orbit-scroll .orbit-node.is-dim { opacity: 1; transform: translate(-50%,-50%); }
  .orbit-conn { stroke-dashoffset: 0; }
  .orbit-win { position: static; width: 100%; max-width: 380px; margin: 14px auto 0; opacity: 1; transform: none; }
  .orbit-win.is-on { transform: none; }
  /* JS-driven scroll reveal: each prompt window fades + slides in (and its bars animate)
     as it scrolls into view. Gated on .ow-reveal, so without JS the windows stay visible
     via the rule above (no-JS / in-app-browser fallback). */
  .orbit-scroll.ow-reveal .orbit-win { opacity: 0; transform: translateY(20px) scale(0.98); transition: opacity .5s ease, transform .6s cubic-bezier(.16,1,.3,1); }
  .orbit-scroll.ow-reveal .orbit-win.is-on { opacity: 1; transform: none; }
  .orbit-scroll .ow-bc, .orbit-scroll .ow-bc.is-on { position: static; width: 100%; max-width: 380px; transform: none; }
  .orbit-scroll .ow-bc .ow-kpis { grid-template-columns: 1fr 1fr; }
  .orbit-scrollhint { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .orbit-scroll { height: auto; }
  .orbit-pin { position: static; height: auto; display: block; overflow: visible; }
  .orbit-scene, .orbit-scroll .orbit-scene { flex-direction: column; align-items: center; padding-bottom: 0; }
  .orbit-scroll .orbit-stage { width: 100%; max-width: 430px; }
  .orbit-scroll .orbit-node.is-dim { opacity: 1; }
  .orbit-win { position: static; width: 100%; max-width: 380px; margin: 14px auto 0; opacity: 1; transform: none; transition: none; }
  .orbit-win.is-on { transform: none; }
  .orbit-scroll .ow-bc, .orbit-scroll .ow-bc.is-on { position: static; width: 100%; max-width: 380px; transform: none; }
  .orbit-scroll .ow-bc .ow-kpis { grid-template-columns: 1fr 1fr; }
  .orbit-win.is-on .ow-bars i { animation: none; }
  .ow-led-live { animation: none; }
  .orbit-scrollhint { display: none; }
}

/* ===== Mobile floating "Book your call" CTA (sitewide; replaces the removed exit popup as the mobile conversion nudge) ===== */
.mobile-book-cta { display: none; }
@media (max-width: 900px) {
  .mobile-book-cta {
    position: fixed; left: 50%; bottom: calc(16px + env(safe-area-inset-bottom, 0px));
    z-index: 95;
    display: inline-flex; align-items: center; gap: 8px;
    font-family: var(--sans); font-weight: 600; font-size: 0.95rem; line-height: 1;
    color: var(--black); background: var(--accent);
    padding: 15px 28px; border-radius: 100px; text-decoration: none; white-space: nowrap;
    box-shadow: 0 12px 34px rgba(0,0,0,0.45), 0 0 0 1px rgba(212,184,138,0.35);
    /* Hidden until the user reaches the "what we do" section (JS adds .is-shown). */
    opacity: 0; transform: translate(-50%, 160%); pointer-events: none;
    transition: opacity .4s ease, transform .55s cubic-bezier(.16,1,.3,1);
  }
  .mobile-book-cta.is-shown { opacity: 1; transform: translate(-50%, 0); pointer-events: auto; }
  .mobile-book-cta::after { content: '\2197'; font-weight: 500; }
  .mobile-book-cta.is-shown:active { transform: translate(-50%, 0) scale(0.97); }
}
@media (prefers-reduced-motion: reduce) {
  .mobile-book-cta:active { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
  .orbit-ring, .orbit-core { animation: none; }
  .orbit-pulse { display: none; } /* SMIL animateMotion ignores CSS; hide the travelling pulses */
  .orbit-conn { stroke-dashoffset: 0; } /* show connectors statically */
  .orbit-node { opacity: 1; transform: translate(-50%,-50%); }
  .orbit .orbit-node, .orbit .orbit-node .orbit-ico { animation: none !important; } /* stop magnetic-pull for reduced-motion */
}

/* ============================================
   HOW WE THINK — animated scrollytelling (homepage .approach)
   ============================================ */
.ht-grid { max-width: 1180px; margin: clamp(12px,2vh,28px) auto 0; display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px,6vw,90px); }