/* ============================================================
   LOCUS CUSTOM CSS
   Global stylesheet for new page builds. Enqueued site-wide via
   locus_enqueue_assets() in functions.php (see assets/js/main.js
   for fonts/main/nav — this file holds everything built after).

   Organize new work as:
     /* ===== PAGE: {template file} ===== *\/
     /* ===== SECTION: {n} — {name} ===== *\/
   so future sections/pages can be found and maintained in one place.
   ============================================================ */

/* ============================================================
   GLOBAL DESIGN TOKENS
   Single source of truth for colors, typography, and spacing.
   Used across every page built in this file (home-v2, solutions, etc.)
   Override per-page by reassigning inside a scoped selector.
   ============================================================ */
:root {
  /* Brand colors */
  --locus-red:        #FF6450;   /* primary CTA / accent */
  --locus-red-dark:   #E85D2F;   /* headings red / hover */
  --locus-maroon:     #4A0E1A;   /* dark heading / page bg */
  --locus-maroon-mid: #83666C;   /* muted body text (warm) */
  --locus-body-text:  #83666C;   /* general body copy */
  --locus-white:      #ffffff;
  --locus-off-white:  #F7F7F7;
  --locus-border:     #E8E0E0;

  /* Typography — heading */
  --font-heading:     'Hanken Grotesk', sans-serif;
  --fw-heading:       500;

  /* Typography — body */
  --font-body-locus:  'Inter Display', 'Inter Display', 'Inter', sans-serif;
  --fw-body:          400;

  /* Heading size scale — desktop */
  --fs-h1:  60px;
  --fs-h2:  48px;
  --fs-h3:  36px;
  --fs-h4:  28px;
  --fs-h5:  28px;
  --fs-h6:  18px;

  /* Line-height scale */
  --lh-h1:   1.2;
  --lh-h2:   1.3;
  --lh-h3:   1.4;
  --lh-h4:   1.4;
  --lh-h5:   42px;
  --lh-body: 25px;

  /* Letter-spacing scale */
  --ls-h1:   -2px;
  --ls-h2:   -2px;
  --ls-h3:   -1px;
  --ls-h4:   -0.5px;
  --ls-h5:   -0.41px;
  --ls-body: -0.41px;

  /* Body size scale */
  --fs-lead:  18px;
  --fs-body:  18px;
  --fs-small: 14px;

  /* Spacing scale */
  --sp-xs:   8px;
  --sp-sm:   16px;
  --sp-md:   24px;
  --sp-lg:   40px;
  --sp-xl:   60px;
  --sp-2xl:  80px;
  --sp-3xl:  120px;

  /* Layout */
  --container-max:  1200px;
  --container-pad:  24px;
  --radius-sm:      8px;
  --radius-md:      16px;
  --radius-lg:      24px;
}

/* ===== PAGE: page-home-v2.php (Home v2 — New Design, WIP) ===== */

/* ----- PAGE FRAME — dark maroon body bg, white content inset
   with side margins, footer flush to the edge. ----- */
body.page-template-page-home-v2-php { background: #4A0E1A; margin: 0; }
.hv2-page { background: #fff; overflow: hidden; }
@media (min-width: 641px) {
  .hv2-page { margin: 0px 20px; border-radius: 20px; }
}

/* ============================================================
   TYPOGRAPHY SCALE — shared across every hv2- page/section.
   Headings: Hanken Grotesk / 500. Body: Inter / 400.
   ============================================================ */
.hv2-h1, .hv2-h2, .hv2-h3, .hv2-h4, .hv2-h5, .hv2-h6 {
  font-family: var(--font-heading);
  font-weight: var(--fw-heading);
  color: var(--locus-maroon);
}
.hv2-h1 { font-size: var(--fs-h1); line-height: var(--lh-h1); letter-spacing: var(--ls-h1); }
.hv2-h2 { font-size: var(--fs-h2); line-height: var(--lh-h2); letter-spacing: var(--ls-h2); }
.hv2-h3 { font-size: var(--fs-h3); line-height: var(--lh-h3); letter-spacing: var(--ls-h3); }
.hv2-h4 { font-size: var(--fs-h4); line-height: var(--lh-h4); letter-spacing: var(--ls-h4); }
.hv2-h5 { font-size: var(--fs-h5); line-height: var(--lh-h5); letter-spacing: var(--ls-h5); }
.hv2-h6 { font-size: var(--fs-h6); line-height: 1.4; letter-spacing: 0; text-transform: uppercase; }
.hv2-h1 em, .hv2-h2 em, .hv2-h3 em, .hv2-h4 em, .hv2-h5 em, .hv2-h6 em { font-style: normal; color: var(--locus-red); }

/* Hero title needs to shrink gracefully on narrow screens, capped at the h1 size */
.hv2-title { font-size: clamp(32px, 5vw, var(--fs-h1)); margin-bottom: 16px; }
h2.hv2-h2 { margin-bottom: 20px; }

/* Body copy: .hv2-sub is the larger lead/intro paragraph (18px);
   plain <p> tags inside hv2- sections default smaller (16px). */
.hv2-sub, .hv2-body-text {
  font-family: var(--font-body-locus);
  font-weight: var(--fw-body);
  font-size: var(--fs-lead);
  line-height: var(--lh-body);
  letter-spacing: var(--ls-body);
  text-align: center;
  color: var(--locus-maroon-mid);
  margin: 0 auto 32px;
}
.hv2-page p {
  font-family: var(--font-body-locus);
  font-weight: var(--fw-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  letter-spacing: var(--ls-body);
  color: #83666C;
}

/* Shared "narrow centered text block" wrapper — used by any section
   whose -inner needs to be a centered column (not full-width like
   the hero). Set max-width once here instead of repeating it on
   every .hv2-{section}-inner rule. */
.hv2-narrow-inner { max-width: 900px; margin: 0 auto; text-align: center; }

/* ============================================================
   GLOBAL SECTION SPACING UTILITY
   Apply .locus-section to any <section> for standard padding.
   Desktop: 5rem top/bottom, 0 sides.
   Mobile: 30px top/bottom, 20px sides.
   ============================================================ */
.locus-section { padding: 5rem 0; }

/* ===== SECTION: 1 — Hero ===== */
.hv2-hero { background: #fff; padding: 5rem 24px; }
.hv2-hero-inner { max-width: 800px; margin: 0 auto; text-align: center; }

/* "Apply for Pilot" style CTA — on hover, the white icon chip expands
   to fill the whole button, revealing a row of chevrons that fade
   out left-to-right (a motion trail), while the text fades away.
   The extra chevrons are always in the markup; at rest the chip is
   only 38px wide so overflow:hidden clips everything but the first
   one — no JS, the reveal is purely a width transition. */
.hv2-cta {
  position: relative;
  display: inline-flex;
  align-items: center;
  background: #4A0E1A;
  color: #fff;
  border-radius: 4px;
  padding: 10px 22px 12px 50px;
  font-family: 'Hanken Grotesk', sans-serif;
  font-size: 16px;
  font-weight: 400;
  text-decoration: none;
  overflow: hidden;
  transition: background .15s, transform .1s;
}
.hv2-cta:hover { background: #2B0808; color: #fff; }
.hv2-cta-icon {
  position: absolute;
  left: 6px;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  padding-left: 12px;
  display: flex; align-items: center; justify-content: flex-start;
  gap: 10px;
  border-radius: 2px;
  background: #fff; color: #4A0E1A;
  overflow: hidden;
  transition: width .45s cubic-bezier(.4,0,.2,1);
}
.hv2-cta:hover .hv2-cta-icon { width: calc(100% - 12px); padding-left: 0; justify-content: center; opacity: 1; }
.hv2-cta:hover .hv2-cta-icon img { opacity: 1 !important; }

.hv2-cta-chevron { font-size: 14px; line-height: 1; flex-shrink: 0; }
.hv2-cta-chevron:nth-child(2) { opacity: 1; }
.hv2-cta-chevron:nth-child(3) { opacity: 1; }
.hv2-cta-chevron:nth-child(4) { opacity: 1; }
.hv2-cta-chevron:nth-child(5) { opacity: 1; }
.hv2-cta-chevron:nth-child(6) { opacity: 1; }

.hv2-cta-text { transition: opacity .25s ease; }
.hv2-cta:hover .hv2-cta-text { opacity: 0; }

/* Light-color variant of the same chevron-trail button — e.g. "Learn More" */
.hv2-cta--light { background: #fff; color: #4A0E1A; border: none; margin-top: 0; }
.hv2-cta--light:hover { background: #F7F7F7; color: #4A0E1A; }
.hv2-cta--light .hv2-cta-icon { background: #F7F7F7; color: #4A0E1A; }
.hv2-cta--light .hv2-cta-icon img { filter: none; }

/* ----- Button system — reusable across all hv2- sections ----- */
.hv2-btn {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--font-display); font-size: 15px; font-weight: 600;
  border-radius: 10px; text-decoration: none; cursor: pointer; border: none;
  transition: background .15s, transform .1s, border-color .15s;
  white-space: nowrap;
}

.ln-btn.ln-btn--primary.ln-btn--sm:hover {
    background-color: #FF6450;
}

.hv2-btn:hover { transform: translateY(-1px); }
.hv2-btn-icon {
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
  width: 38px; height: 38px; border-radius: 7px; font-size: 15px;
}

/* Solid dark, icon chip left — e.g. "Apply for Pilot" (= .hv2-cta) */
.hv2-btn--dark { background: #4A0E1A; color: #fff; padding: 6px 22px 6px 6px; }
.hv2-btn--dark:hover { background: #2B0808; color: #fff; }
.hv2-btn--dark .hv2-btn-icon { background: #fff; color: #4A0E1A; }

/* Solid dark, no icon — e.g. "Request Demo" */
.hv2-btn--solid { background: #4A0E1A; color: #fff; padding: 12px 22px; }
.hv2-btn--solid:hover { background: #2B0808; color: #fff; }

/* Ghost / outline, icon chip left — e.g. "Learn more" */
.hv2-btn--ghost { background: #fff; color: #4A0E1A; border: 1.5px solid #4A0E1A; padding: 5px 20px 5px 5px; }
.hv2-btn--ghost:hover { background: #FBF3EF; color: #4A0E1A; }
.hv2-btn--ghost .hv2-btn-icon { background: #4A0E1A; color: #fff; }

/* Solid dark, coral icon chip on the right */
.hv2-btn--dark-coral-right { background: #4A0E1A; color: #fff; padding: 6px 6px 6px 22px; flex-direction: row; }
.hv2-btn--dark-coral-right:hover { background: #2B0808; color: #fff; }
.hv2-btn--dark-coral-right .hv2-btn-icon { background: #FF6450; color: #fff; }

/* Solid coral, white icon chip on the right */
.hv2-btn--coral { background: #FF6450; color: #fff; padding: 6px 6px 6px 22px; }
.hv2-btn--coral:hover { background: #E0492F; color: #fff; }
.hv2-btn--coral .hv2-btn-icon { background: #fff; color: #FF6450; }

/* Outline dark, icon chip left (heavier border) — e.g. bordered "Apply for Pilot" */
.hv2-btn--outline { background: #fff; color: #4A0E1A; border: 2px solid #4A0E1A; padding: 5px 20px 5px 5px; }
.hv2-btn--outline:hover { background: #FBF3EF; color: #4A0E1A; }
.hv2-btn--outline .hv2-btn-icon { background: #4A0E1A; color: #fff; }

/* Exact design-spec button token (165x44, 4px radius) — for reuse in later sections */
.hv2-btn--token {
  display: inline-flex; align-items: center; justify-content: center;
  width: 165px; height: 44px; padding: 4px; gap: 10px;
  background: #4A0E1A; color: #fff; border-radius: 4px;
  font-family: 'Inter', var(--font-body); font-size: 14px; font-weight: 600;
  text-decoration: none; backdrop-filter: blur(10px); transition: background .15s;
}
.hv2-btn--token:hover { background: #3A0B14; color: #fff; }

/* ----- Hero visual — video panel ----- */
.hv2-visual-wrap {
  width: 90%;
  /* max-width: 1200px; */
  margin: 50px auto 0;
}
.hv2-visual {
  position: relative;
  background: #E7E7EA;
  border-radius: 28px;
  overflow: hidden;
  aspect-ratio: 16 / 9;
}
.hv2-visual video {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: contain;
  display: block;
}

/* ===== SECTION: 2 — Growth Opportunity ===== */
.hv2-growth {
  position: relative;
  background-color: #FAF9F5;
  background-image: url('/wp-content/uploads/2026/06/lining-bg.png');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  padding: 5rem 24px;
  min-height: 720px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.hv2-growth-inner {
  position: relative;
  max-width: 750px;
  margin: 0 auto;
  text-align: center;
  z-index: 2;
}
.hv2-growth .hv2-h2 { margin-bottom: 20px; }
.hv2-growth .hv2-sub {
  margin-bottom: 32px;
}

/* Floating stat images (bare SVGs supplied by design) — anchored
   dead-center via top/left 50%, then flown out to their resting
   spot purely via transform. This means the "centre" they fly
   from/to is a real point, not a guess, and the same transform
   reverses cleanly when scrolling back out. */
.hv2-growth-card {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 1;
  max-width: 300px;
  height: auto;
  filter: drop-shadow(0 16px 40px rgba(74,14,26,0.18));
  /* Scroll-reveal starting state — JS toggles .is-visible to animate in/out */
  opacity: 0;
  transform: translate(-50%, -50%) scale(.4);
  transition: opacity .6s cubic-bezier(.22,.61,.36,1), transform .6s cubic-bezier(.22,.61,.36,1);
  will-change: opacity, transform;
}
.hv2-growth-card.is-visible {
  opacity: 1;
  transform: translate(-50%, -50%) translate(var(--hx, 0), var(--hy, 0)) scale(1);
}

.hv2-growth-card--1 { --hx: -441px; --hy: -250px; }
.hv2-growth-card--2 { --hx:  440px; --hy: -210px; }
.hv2-growth-card--3 { --hx: -440px; --hy:  194px; }
.hv2-growth-card--4 { --hx:  390px; --hy:  210px; }

/* ----- MOBILE: Sections 1–2 (Hero, Growth Opportunity) -----
   Both switch from centered to left-aligned text. The Growth
   Opportunity cards lose their fly-in-from-center desktop transform
   (--hx/--hy) and instead sit at fixed positions in a reserved
   block above the heading, with a plain fade-in on scroll. */
@media (max-width: 640px) {
  .hv2-hero { padding: 30px 20px; }
  .hv2-hero-inner { text-align: left; }
  .hv2-hero-inner .hv2-title { text-align: left; font-size: 28px; letter-spacing: -1px; }
  .hv2-hero-inner .hv2-sub { text-align: left; max-width: none; margin: 0 0 28px; }

  .hv2-visual-wrap { width: 100%; margin-top: 32px; }
  .hv2-visual { aspect-ratio: 16 / 9; }

  .hv2-growth { padding: 30px 20px; min-height: 0; display: block; }
  .hv2-growth-inner { text-align: left; padding-top: 300px; }
  .hv2-growth-inner .hv2-h2 { text-align: left; font-size: 28px; letter-spacing: -1px; }
  .hv2-growth-inner .hv2-sub { text-align: left; max-width: none; margin: 0 0 28px; font-size: 15px; }

  .hv2-growth-card {
    top: auto;
    left: auto;
    max-width: 160px;
    transform: none;
    transition: opacity .5s ease;
  }
  .hv2-growth-card.is-visible { transform: none; }

  .hv2-growth-card--1 { top: 0;    left: 0; }
  .hv2-growth-card--2 { top: 56px; left: auto; right: 0; }
  .hv2-growth-card--3 { top: 150px; left: 0; }
  .hv2-growth-card--4 { top: 230px; left: auto; right: 0; }
}

/* ===== SECTION: 3 — Growth Framework ===== */
.hv2-framework { background: #FBFAF6; padding: 5rem 24px; }
.hv2-framework-inner { max-width: 800px; margin: 0 auto; text-align: center; }


/* ----- Growth Framework wheel — ported 1:1 from the GSAP reference
   build (framework-gsap.html), namespaced under hv2-fw-. The 4
   "highlight" images ARE the colored quadrant arcs themselves (no
   separate base ring is drawn) — they sit at opacity:0 until GSAP
   fades each one in during its phase of the reveal, which is why the
   wheel shows just the pin at first, exactly like the source video.
   Desktop-only — mobile falls back to the simple .hv2-visual-wrap
   video panel below (see the mobile block at the end of this file). ----- */
.hv2-fw-row {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1296px;
  max-width: 100%;
  margin: 56px auto 0;
}
.hv2-fw-col {
  width: 250px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 50px;
  margin-right: 4rem;
  margin-left: 4rem;
}
.hv2-fw-card {
  background: #fff;
  border-radius: 16px;
  padding: 16px 18px 14px;
  box-shadow: 0 2px 20px rgba(0,0,0,0.07);
  opacity: 0;
  text-align: left;
}
.hv2-fw-ch { display: flex; align-items: center; gap: 11px; margin-bottom: 11px; padding-bottom: 11px; border-bottom: 1px solid #f5eeea; }
.hv2-fw-ch-ico { width: 36px; height: 36px; background: #fff2ee; border-radius: 9px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.hv2-fw-ch-ico img { object-fit: contain; }
p.hv2-fw-ch-t { font-size: 16px; font-weight: 500; color: #e85d2f; line-height: 1.2; margin: 0; }
p.hv2-fw-ch-s { font-size: 11px; color: #83666C; margin: 1px 0 0; }
.hv2-fw-ci { display: flex; align-items: center; gap: 9px; padding: 5px 0; font-size: 13px; color: #4A0E1A; }
.hv2-fw-ci-ico { width: 26px; height: 26px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.hv2-fw-ci-ico img { object-fit: contain; }

/* Connectors — absolutely positioned against .hv2-fw-row so they sit
   in the gap between a card column and the wheel regardless of the
   row's own flex sizing. */
.width-set-container{ width: 110px !important; }
.hv2-fw-conn-col { position: absolute; top: 50%; width: 52px; height: 460px; transform: translateY(-50%); }
.hv2-fw-conn-col--left { left: 346px; }
.hv2-fw-conn-col--right { right: 346px; }
.hv2-fw-conn { position: absolute; left: 0; width: 100%; height: 40px; display: flex; align-items: center; opacity: 0; }
.hv2-fw-conn-img { width: 93px; height: 100%; object-fit: contain; display: block; }
.hv2-fw-conn-col--right .hv2-fw-conn { flex-direction: row-reverse; }
#hv2-fw-k-rl { top: 11%; }
#hv2-fw-k-el { top: 81%; left: -4px; }
#hv2-fw-k-vr { top: 14%; }
#hv2-fw-k-ar { top: 78%; }

.hv2-fw-wheel-wrap { position: relative; width: 500px; height: 500px; flex-shrink: 0; }
.hv2-fw-wsvg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: visible; }

.hv2-fw-pin-img {
  position: absolute; top: 48%; left: 50%;
  transform: translate(-51%, -47%) !important;
  width: 66%;
  object-fit: contain; object-position: center;
  opacity: 0;
}
.hv2-fw-pin-overlay-img {
  position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 26%;
  object-fit: contain; object-position: center;
  opacity: 0;
  animation: hv2FwPinOverlayFloat 2.6s ease-in-out infinite;
}
@keyframes hv2FwPinOverlayFloat {
  0%, 100% { transform: translate(-50%, calc(-50% - 3px)); }
  50%      { transform: translate(-50%, calc(-50% + 3px)); }
}

@keyframes hv2FwGlowPulse {
  0%, 100% { filter: drop-shadow(0 0 2px rgba(253,135,78,0.25)); }
  50%      { filter: drop-shadow(0 0 6px rgba(253,135,78,0.5)); }
}
.hv2-fw-glow-circle { animation: hv2FwGlowPulse 2.2s ease-in-out infinite; transform-origin: center; }

/* Mobile fallback: hide the wheel build, show the simple video panel
   that otherwise stays hidden on desktop (markup + rule further down
   this file, see "MOBILE: Growth Framework fallback"). */
.hv2-fw-mobile-only { display: none; }

/* ===== SECTION: 4 — Platform Overview ===== */
.hv2-platform { background: #FBFAF6; padding: 5rem 24px; }
.hv2-platform-inner { margin-bottom: 56px; } /* max-width/centering comes from .hv2-narrow-inner */
.hv2-platform-inner .hv2-h2 { margin-bottom: 20px; }

.hv2-platform-grid {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
/* Rows alternate 65/35 and 35/65 column widths */
.hv2-platform-row {
  display: grid;
  grid-template-columns: 60fr 40fr;
  gap: 24px;
}
.hv2-platform-row--alt {
  grid-template-columns: 40fr 60fr;
}
.hv2-platform-card {
  background: #fff;
  border: 1px solid #ECECEC;
  border-radius: 20px;
  padding: 20px 20px 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: box-shadow .2s ease, transform .2s ease;
}
.hv2-platform-card:hover {
  box-shadow: 0px 4px 60px 0px #0000001A;
}
.hv2-platform-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.hv2-platform-card-title {
  text-align: left;
  margin: 0;
  font-size: 24px;
  font-weight: 500;
  letter-spacing: -.3px;
  text-transform: none;
  color: var(--locus-maroon);
}
.hv2-platform-card-icon {
  flex-shrink: 0;
  width: 28px; height: 28px;
  border-radius: 6px;
  background: #F7F7F7;
  color: #4A0E1A;
  display: flex; align-items: center; justify-content: center;
  font-size: 5px;
  opacity: 1;
  transition: background .2s ease;
}
.hv2-platform-card:hover .hv2-platform-card-icon { background: #ECECEC; }
.hv2-platform-card-icon img { width: 13px; height: auto; display: block; }
.hv2-platform-card p {
  text-align: left;
  margin: 0 0 20px;
  max-width: 60%;
  color: var(--locus-maroon-mid);
  font-size: 16px;
  line-height: 1.5;
}
.hv2-platform-card:nth-child(even) p { max-width: 100%; }
.hv2-platform-card-shot {
  position: relative;
  flex: 1;
  min-height: 220px;
  border-radius: 14px 14px 0 0;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
.hv2-platform-card-shot img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 10px 10px 0 0;
  transition: transform .4s cubic-bezier(.25,.46,.45,.94);
  transform-origin: bottom center;
}
.hv2-platform-card:hover .hv2-platform-card-shot img { transform: scale(1.01) translateY(0px); }
.hv2-platform-card-shot span {
  font-size: 12px;
  color: rgba(74,14,26,0.4);
  font-weight: 500;
  margin-bottom: 16px;
}

/* ==========================================================
   SHARED COMPONENT — locus-platform-card
   Used by: homepage platform section + solution growth cards.
   Edit here once → updates both pages automatically.
   ========================================================== */
.locus-cards-section {
  padding: 5rem 24px;
  background: #fff;
}
.locus-cards-inner {
  max-width: 1200px;
  margin: 0 auto;
}
.locus-cards-heading {
  font-family: var(--font-heading);
  font-size: var(--fs-h2);
  font-weight: var(--fw-heading);
  letter-spacing: var(--ls-h2);
  line-height: var(--lh-h2);
  color: var(--locus-maroon);
  text-align: center;
  width: 50%;
  margin: 0 auto 3rem !important;
}
.locus-cards-heading em { font-style: normal; color: var(--locus-red); }
.locus-cards-subtext {
  font-family: var(--font-body-locus);
  font-size: var(--fs-body);
  font-weight: var(--fw-body);
  line-height: var(--lh-body);
  letter-spacing: var(--ls-body);
  color: var(--locus-body-text);
  text-align: center;
  max-width: 780px;
  margin: 0 auto 48px;
}

/* Single card */
.locus-platform-card {
  background: #fff;
  border: 1px solid #ECECEC;
  border-radius: 20px;
  padding: 20px 20px 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: box-shadow .2s ease, transform .2s ease;
}
.locus-platform-card:hover {
  box-shadow: 0px 4px 60px 0px #0000001A;
}
.locus-platform-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.locus-platform-card-title {
  font-family: var(--font-heading);
  font-size: 24px;
  font-weight: var(--fw-heading);
  letter-spacing: -.3px;
  color: var(--locus-maroon);
  margin: 0;
  line-height: 1.3;
  text-transform: none;
}
.locus-platform-card-icon {
  flex-shrink: 0;
  width: 28px; height: 28px;
  border-radius: 6px;
  background: #F7F7F7;
  display: flex; align-items: center; justify-content: center;
  opacity: 1;
  transition: background .2s ease;
  text-decoration: none;
}
.locus-platform-card-icon img { width: 13px; height: auto; display: block; }
.locus-platform-card:hover .locus-platform-card-icon { background: #ECECEC; }
.locus-platform-card-desc {
  font-family: var(--font-body-locus);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--locus-maroon-mid);
  margin: 0 0 20px;
  text-align: left;
  max-width: none;
}
.locus-platform-card-shot {
  flex: 1;
  min-height: 220px;
  border-radius: 14px 14px 0 0;
  overflow: hidden;
  display: flex;
  margin-top: 2rem;
  align-items: flex-end;
  justify-content: center;
}
.locus-platform-card-shot img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 10px 10px 0 0;
  transition: transform .4s cubic-bezier(.25,.46,.45,.94);
  transform-origin: bottom center;
  margin-bottom: -8px;
}
.locus-platform-card:hover .locus-platform-card-shot img { transform: scale(1.01) translateY(-4px); }
.locus-platform-card-shot span {
  font-size: 12px;
  color: rgba(74,14,26,0.4);
  font-weight: 500;
  margin-bottom: 16px;
}

/* Featured card — text left / image right */
.locus-platform-card--featured {
  display: grid;
  grid-template-columns: 1fr 1.7fr;
  align-items: stretch;
  padding: 0;
  margin-bottom: 30px;
  border-radius: 20px;
}
.locus-platform-card--featured .locus-platform-card-text {
  padding: 28px 28px 24px;
  display: flex;
  flex-direction: column;
}
.locus-platform-card--featured .locus-platform-card-shot {
  min-height: fit-content;
  border-radius: 20px 0px 20px 0px;
  background: #FAFAFA;
  padding: 20px 20px 0;
  align-items: flex-end;
  margin-top: 0px;
}
.locus-platform-card--featured .locus-platform-card-shot img {
  border-radius: 10px 10px 0 0;
}

/* Grid for regular (non-featured) cards */
.locus-platform-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
}

/* Compact aliases — kept in sync with the expanded rules above */

/* ===== SECTION: 5 — Intelligence Workflow ===== */
.hv2-intel { background: #fff; padding: 5rem 24px; }
/* .hv2-intel-inner gets its max-width/centering from .hv2-narrow-inner in the markup */
.hv2-intel-inner .hv2-h2 { margin-bottom: 16px; }
.hv2-visual--gradient {
  background: linear-gradient(155deg, #F5F0E0 0%, #F8E9C8 45%, #F3CD6E 100%);
}

/* ===== SECTION: 6 — Industries ===== */
.hv2-industries { background: #fff; padding: 5rem 24px; }
.hv2-industries-inner .hv2-h2 { margin-bottom: 16px; white-space: nowrap; }
.hv2-industries-inner .hv2-sub { margin-bottom: 28px; color: var(--locus-maroon-mid); }

/* Industry tabs widget */
.hv2-industry-widget {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 25fr 75fr;
  gap: 24px;
  margin-top: 3rem;
  align-items: start;
}

/* Tab list */
.hv2-industry-tabs {
  height: 500px;
  background: #fff;
  border: 1px solid #ECECEC;
  border-radius: 12px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  justify-content: space-between;
}
.hv2-industry-tab {
  text-align: left;
  background: transparent;
  border: none;
  border-radius: 12px;
  padding: 10px 12px;
  font-family: var(--font-body-locus);
  font-size: 18px;
  font-weight: 500;
  color: #83666C;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  transition: background .2s ease, color .2s ease;
}
.hv2-industry-tab:hover { background: rgba(74,14,26,0.05); color: #4A0E1A; }
.hv2-industry-tab.is-active { background: #FF6450; color: #fff; border-radius: 6px; }
.hv2-industry-tab.is-active:hover { background: #FF6450; }

.hv2-industry-tab-chevron { display: none; flex-shrink: 0; width: 14px; height: 14px; }
.hv2-industry-tab-chevron img { width: 100%; height: 100%; object-fit: contain; }

/* Panels */
.hv2-industry-panels {
  position: relative;
  height: 500px;
  background: #fff;
  border: 1px solid #ECECEC;
  border-radius: 12px;
  overflow: hidden;
}
.hv2-industry-panel {
  position: absolute;
  inset: 0;
  padding: 40px;
  opacity: 0;
  pointer-events: none;
  overflow-y: auto;
  transition: opacity .5s ease;
}
.hv2-industry-panel.is-active {
  opacity: 1;
  pointer-events: auto;
}

.hv2-industry-panel-text { position: relative; z-index: 1; max-width: 55%; }
.hv2-industry-panel-text h3 { text-align: left; margin-bottom: 8px; }
.hv2-industry-panel-text p { margin-bottom: 12px; max-width: none; color: #83666C; }

.hv2-btn.hv2-industry-learn-more { margin-top: 12px; margin-bottom: 36px; }
.hv2-btn-icon img { width: 12px; height: auto; display: block; }

.hv2-industry-connects {
  position: absolute;
  left: 40px;
  right: 40px;
  bottom: 40px;
  z-index: 1;
}
.hv2-industry-connects-label {
  font-size: 13px;
  color: #6B5A5A;
  margin-bottom: 12px;
}
.hv2-industry-logos { display: flex; flex-wrap: wrap; gap: 5px; }
.hv2-industry-logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 115px;
  height: 44px;
  padding: 10px 15px;
  background: #FBFAF6;
  border: 1px solid rgba(74,14,26,0.12);
  border-radius: 100px;
}
.hv2-industry-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.hv2-industry-panel-art {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 45%;
  z-index: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.hv2-industry-panel-art img { width: 100%; height: auto; max-height: 58%; object-fit: contain; margin-right: 0rem; margin-bottom: 8rem; }
.hv2-industry-panel-art span {
  font-size: 12px;
  color: rgba(74,14,26,0.35);
  font-weight: 500;
}

/* Industry cards — 4-col grid with hover gradient */
.hv2-ind-cards {
  max-width: 1200px;
  margin: 3rem auto 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.hv2-ind-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background: #fff;
  border: 1px solid #ECECEC;
  border-radius: 16px;
  padding: 24px;
  height: 340px;
  text-decoration: none;
  color: inherit;
  cursor: pointer;
  transition: background .3s ease, border-color .3s ease, box-shadow .3s ease;
  position: relative;
  overflow: hidden;
}

.hv2-ind-card:hover {
  background: linear-gradient(253.43deg, #4A0E1A -39%, #FF6450 88.53%);
  border-color: transparent;
  box-shadow: 0 12px 40px rgba(74,14,26,0.25);
}

.hv2-ind-card-body { flex: 1; }

.hv2-ind-card .hv2-ind-card-title {
  font-family: 'Hanken Grotesk', var(--font-heading-locus), sans-serif;
  font-size: 24px;
  font-weight: 500;
  color: #4A0E1A;
  margin: 0 0 12px;
  line-height: 36px;
  letter-spacing: -1px;
  transition: color .3s ease;
}
.hv2-ind-card:hover .hv2-ind-card-title { color: #fff; }

.hv2-ind-card .hv2-ind-card-desc {
  font-family: 'Inter Display', 'Inter', var(--font-body-locus), sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: -0.41px;
  color: #83666C;
  margin: 0;
  transition: color .3s ease;
}
.hv2-ind-card:hover .hv2-ind-card-desc { color: rgba(255,255,255,0.85); }

.hv2-ind-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 24px;
}

.hv2-ind-card-link {
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: 'Hanken Grotesk', var(--font-heading-locus), sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.41px;
  color: #4A0E1A;
  transition: color .3s ease;
}
.hv2-ind-card:hover .hv2-ind-card-link { color: #fff; }

/* Arrow — hidden by default, shown on hover */
.hv2-ind-card-arrows {
  display: none;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 2px;
  padding: 6px;
  background: #F7F7F7;
  flex-shrink: 0;
  transition: background .3s ease;
}
.hv2-ind-card:hover .hv2-ind-card-arrows {
  display: flex;
  background: rgba(255,255,255,0.2);
}

.hv2-ind-card-arrow {
  width: 100%;
  height: 100%;
  object-fit: contain;
  /* tint arrow to #4A0E1A on normal state */
  filter: brightness(0) saturate(100%) invert(9%) sepia(60%) saturate(2000%) hue-rotate(320deg) brightness(60%);
  transition: filter .3s ease;
}
.hv2-ind-card:hover .hv2-ind-card-arrow { filter: brightness(0) invert(1); }

.hv2-ind-card-icon {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: #FBFAF6;
  box-shadow: -3px 0px 24px 0px #17171717;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: background .3s ease, box-shadow .3s ease;
}
.hv2-ind-card:hover .hv2-ind-card-icon {
  background: linear-gradient(253.43deg, #4A0E1A -39%, #FF6450 88.53%);
  box-shadow: none;
}

.hv2-ind-card-icon img {
  width: 28px;
  height: 28px;
  object-fit: contain;
  transition: filter .3s ease;
}
.hv2-ind-card:hover .hv2-ind-card-icon img { filter: brightness(0) invert(1); }

/* ----- Responsive ----- */
@media (max-width: 640px) {
  .hv2-h1 { font-size: clamp(28px, 8vw, 40px); letter-spacing: -1px; }
  .hv2-h2 { font-size: clamp(26px, 7vw, 34px); letter-spacing: -1px; }
  .hv2-h3 { font-size: clamp(22px, 6vw, 28px); letter-spacing: -.5px; }
  .hv2-h4 { font-size: 22px; letter-spacing: -.3px; }
  .hv2-sub, .hv2-body-text { font-size: 16px; line-height: 1.6; letter-spacing: -.2px; }
  .hv2-page p { font-size: 14px; text-align: left; }
  .hv2-hero, .hv2-framework, .hv2-intel { padding: 30px 20px; }
  .hv2-visual-wrap { width: 100%; margin-top: 36px; }
  .hv2-visual { border-radius: 18px; }

  .hv2-growth { padding: 30px 20px; }

  .hv2-framework-inner { text-align: left; }
  .hv2-framework-inner .hv2-h2 { text-align: left; }

  .hv2-intel-inner.hv2-narrow-inner { text-align: left; max-width: none; }
  .hv2-intel-inner .hv2-h2 { text-align: left; }
  .hv2-intel-inner .hv2-sub { text-align: left; max-width: none; }

  .hv2-platform { padding: 30px 20px; }
  .hv2-platform-inner.hv2-narrow-inner { text-align: left; max-width: none; }
  .hv2-platform-inner .hv2-h2 { text-align: left; }
  .hv2-platform-inner .hv2-sub { text-align: left; max-width: none; margin: 0 0 24px; }
  .hv2-platform-row, .hv2-platform-row--alt { grid-template-columns: 1fr; }
  .hv2-platform-card-shot { height: 200px; }

  .hv2-industries-inner.hv2-narrow-inner { text-align: left; max-width: none; }
  .hv2-industries-inner .hv2-h2 { text-align: left; white-space: normal; }
  .hv2-industries-inner .hv2-sub { text-align: left; max-width: none; }

  .hv2-industries { padding: 30px 20px; }
  .hv2-industry-widget { grid-template-columns: 1fr; margin-top: 2rem; }

  .hv2-industry-tabs {
    height: auto;
    flex-direction: column;
    padding: 0;
    border: none;
    border-radius: 0;
    gap: 0;
  }
  .hv2-industry-tab {
    border-radius: 0;
    padding: 15px 20px;
    display: none;
  }
  .hv2-industry-tab.is-active { display: flex; }
  .hv2-industry-tabs.is-open .hv2-industry-tab { display: flex; }
  .hv2-industry-tab-chevron { display: flex; transform: rotate(90deg); transition: transform .3s ease; }
  .hv2-industry-tabs.is-open .hv2-industry-tab.is-active .hv2-industry-tab-chevron { transform: rotate(-90deg); }

  .hv2-industry-panels { height: auto; }
  .hv2-industry-panel { position: relative; display: none; padding: 24px; }
  .hv2-industry-panel.is-active { display: block; }
  .hv2-industry-panel-text { max-width: 100%; }
  .hv2-industry-panel-art { position: relative; width: 100%; height: 220px; margin-top: 20px; bottom: auto; }
  .hv2-industry-panel-art img { height: 100%; width: auto; max-width: 87%; object-fit: contain; margin-bottom: 0px; }
  .hv2-industry-connects { position: relative; left: auto; right: auto; bottom: auto; margin-top: 20px; }

  /* Mobile swipe carousel */
  .hv2-ind-cards {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    gap: 14px;
    margin-top: 24px;
    padding: 0 20px 12px;
  }
  .hv2-ind-cards::-webkit-scrollbar { display: none; }

  .hv2-ind-card {
    flex: 0 0 80vw;
    max-width: 300px;
    scroll-snap-align: start;
    height: 340px;
    padding: 20px 18px 18px;
    overflow: hidden;
  }
  .hv2-ind-card .hv2-ind-card-desc {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
}




.locations-showing-container {
    margin: 0 auto;
    display: flex;
    max-width: 1200px;
    gap: 30px;
    margin-top: 3rem;
}

.locations-showing-card {
    flex: 1;
    min-height: 160px;
    background: #FFF9F0;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 40px 30px;
}

.locations-showing-card-light {
    background: #FBEEDA;
}

.locations-showing-text.text-light {
    color: white;
}

.locations-showing-text.text-normal {
    color: #83666C;
}
.locations-showing-card:not(.locations-showing-card-dark) .locations-showing-text {
    color: #83666C;
}


.locations-showing-card-dark {
    background: #4A0E1A;
    color: #ffffff;
}

.locations-showing-number {
    font-size: 36px;
    line-height: 1;
    font-weight: 500;
    color: #4A0E1A;
    margin-bottom: 20px;
}

.locations-showing-card-dark .locations-showing-number {
    color: #ffffff;
}

.locations-showing-text {
    font-family: inherit;
    font-weight: 400;
    font-size: 18px;
    line-height: 1.6;
    letter-spacing: -.1px;
    color: #4A0E1A;
}

@media (max-width: 991px) {
    .locations-showing-container {
        flex-wrap: wrap;
    }

    .locations-showing-card {
        flex: 0 0 calc(50% - 15px);
    }
}

@media (max-width: 767px) {
    .locations-showing-container {
        flex-direction: column;
    }
    .locations-showing-container {
    margin: 0 auto;
    display: flex;
    max-width: 1200px;
    gap: 20px;
    margin-top: 2rem;
}

    .locations-showing-card {
        flex: 1;
        min-height: 180px;
    }

    .locations-showing-number {
        font-size: 48px;
        margin-bottom: 20px;
    }

    .locations-showing-text {
        font-size: 14px;
    }
}

/* ----- SECTION: 8 — Final CTA + Lead Capture Form ----- */
.hv2-final-cta { background: #fff; padding: 5rem 24px; }
.hv2-final-cta-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: center;
}
.hv2-final-cta-text .hv2-h2 { text-align: left; }
.hv2-final-cta-text .hv2-sub { text-align: left; max-width: 520px; margin-left: 0; }

.hv2-final-cta-form {
  background: #fff;
  border: 1px solid rgba(74,14,26,0.1);
  border-radius: 16px;
  padding: 32px;
}
.hv2-form-group { margin-bottom: 20px; }
.hv2-form-label { display: block; font-size: 16px; font-weight: 500; color: #4A0E1A; margin-bottom: 8px; }
.hv2-form-required { color: #FF6450; }
.hv2-form-input {
  width: 100%;
  background: #F7F7F7;
  border: 1px solid rgba(74,14,26,0.1);
  border-radius: 4px;
  padding: 12px 16px;
  font-size: 14px;
  color: #4A0E1A;
}
.hv2-form-input::placeholder { color: #83666C; }
.hv2-form-consent {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 24px;
  font-size: 13px;
  color: #83666C;
  cursor: pointer;
}
.hv2-form-consent input { margin-top: 3px; accent-color: #4A0E1A; flex-shrink: 0; }
.hv2-form-submit {
  width: 100%;
  background: #4A0E1A;
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: 16px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: background .25s ease;
}
.hv2-form-submit:hover { background: #4A0E1A; }
.hv2-form-submit:disabled { opacity: .6; cursor: not-allowed; }

.hv2-form-error { color: #C0392B; font-size: 13px; margin: -8px 0 16px; }

.hv2-form-thankyou { text-align: center; padding: 32px 12px; }
.hv2-form-thankyou-icon {
  width: 64px;
  height: 64px;
  margin: 0 auto 20px;
  border-radius: 50%;
  background: #4A0E1A;
  display: flex;
  align-items: center;
  justify-content: center;
}
.hv2-form-thankyou-icon svg { width: 28px; height: 28px; }
.hv2-form-thankyou .hv2-h4 { color: #4A0E1A; font-size: 26px; margin-bottom: 10px; }
.hv2-form-thankyou p { color: #6B5A5A; font-size: 16px; max-width: 360px; margin: 0 auto; }

@media (max-width: 900px) {
  .hv2-final-cta-inner { grid-template-columns: 1fr; gap: 32px; }
  .hv2-final-cta-text .hv2-sub { max-width: none; }
}

/* ----- SECTION: 9 — FAQs ----- */
.hv2-faqs { background: #FBFAF6; padding: 5rem 24px; text-align: center; }
.hv2-faqs-inner .hv2-h2 { font-size: 28px; }
.hv2-faqs-inner { display: flex; flex-direction: column; align-items: center; }

/* Outer reveal: whole FAQ list is collapsed (0fr) by default and
   expands to its natural height (1fr) on toggle — animatable via
   grid-template-rows, no JS height measuring needed. */
.hv2-faq-list {
  width: 100%;
  max-width: 1000px;
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows .45s cubic-bezier(.22,.61,.36,1);
}
.hv2-faq-list.is-open { grid-template-rows: 1fr; }
.hv2-faq-list-inner { overflow: hidden; min-height: 0; }

.hv2-faq-item { border-bottom: 1px solid rgba(74,14,26,0.1); }
.hv2-faq-question {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  background: none;
  border: none;
  text-align: left;
  padding: 26px 4px;
  font-size: 18px;
  font-weight: 400;
  color: #4A0E1A;
  cursor: pointer;
}
.hv2-faq-question-icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 18px;
  /* background: #F2EEE8; */
  border-radius: 4px;
  /* padding: 8px; */
  transition: transform .35s ease;
}
.hv2-faq-question-icon img { width: 100%; height: 100%; object-fit: contain; }
.hv2-faq-question-icon { transform: rotate(90deg); }
.hv2-faq-question.is-open .hv2-faq-question-icon { transform: rotate(-90deg); }

/* Per-item reveal: same grid-rows trick for the answer text. */
.hv2-faq-answer {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows .35s cubic-bezier(.22,.61,.36,1);
}
.hv2-faq-answer.is-open { grid-template-rows: 1fr; }
.hv2-faq-answer-inner { overflow: hidden; min-height: 0; }
.hv2-faq-answer-inner p { text-align: left; padding: 0 4px 20px; color: #83666C; max-width: none; }

.hv2-faq-toggle {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 32px;
  /* background: #F2EEE8; */
  border: none;
  border-radius: 10px;
  padding: 10px 18px;
  font-size: 16px;
  font-weight: 500;
  color: #4A0E1A;
  cursor: pointer;
}
.hv2-faq-toggle-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: #F7F7F7;
  border-radius: 4px;
  padding: 13px;
  transition: transform .35s ease;
}
.hv2-faq-toggle-icon img { width: 14px; height: 14px; object-fit: contain; }
.hv2-faq-toggle-icon { transform: rotate(90deg); }
.hv2-faq-toggle[aria-expanded="true"] .hv2-faq-toggle-icon { transform: rotate(-90deg); }

/* ----- MOBILE: Sections 7–9 -----
   Placed here, after every base rule these selectors touch, so they
   reliably win the cascade (equal specificity + later source order)
   instead of being silently overridden by an unconditional base rule
   that happened to appear further down the file. */
@media (max-width: 640px) {
  /* Section 7: Trusted by Brands / stats */
  .locations-showing-number { font-size: 36px; margin-bottom: 12px; }
  .locations-showing-card { min-height: 100px; padding: 28px 24px; }

  /* Section 8: Final CTA + Lead Capture Form */
  .hv2-final-cta { padding: 30px 20px; }
  .hv2-final-cta-form { padding: 24px; }
  .hv2-final-cta-text .hv2-h2 { font-size: 22px; }

  /* Section 9: FAQs — list is always expanded on mobile, no
     "View/Close FAQs" toggle; everything goes left-aligned instead
     of centered. */
  .hv2-faqs { padding: 30px 20px; text-align: left; }
  .hv2-faqs-inner { align-items: flex-start; }
  .hv2-faqs-inner .hv2-h2 { text-align: left; }
  .hv2-faq-list { grid-template-rows: 1fr; }
  .hv2-faq-toggle { display: none; }
  .hv2-faq-question { font-size: 14px; padding: 18px 4px; }
}

/* ----- MOBILE: unified section padding -----
   Placed last so it wins over the older, inconsistent per-section
   mobile padding values added earlier (3.5rem 18px, 4rem 20px, etc.)
   without having to hunt down and edit each one individually. */
@media (max-width: 640px) {

  .hv2-form-consent {
    font-size: 8px;
}

.hv2-form-submit {
    width: 100%;
    background: #4A0E1A;
    color: #fff;
    border: none;
    border-radius: 8px;
    padding: 12px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: background .25s ease;
}
.hv2-form-label {
    display: block;
    font-size: 12px;
    font-weight: 400;
    color: #4A0E1A;
    margin-bottom: 4px;
}
  .hv2-hero,
  .hv2-growth,
  .hv2-framework,
  .hv2-platform,
  .hv2-intel,
  .hv2-industries,
  .hv2-final-cta,
  .hv2-faqs {
    padding: 30px 20px;
  }

  .hv2-platform-card-shot { min-height: inherit; }
}

@media (max-width: 768px) {
  h3 {
    font-size: clamp(1.3rem, 4vw, 1.75rem);
  }
}

/* ----- MOBILE: latest pass — headings, CTA buttons, hero/growth
   visuals, industry widget. Kept here (after every base rule these
   selectors touch) so it reliably wins the cascade instead of being
   silently overridden by an earlier, unconditional rule further up
   the file — see the note above the "unified section padding" block. */
@media (max-width: 640px) {
  .hv2-h1, .hv2-h2, .hv2-h3, .hv2-h4, .hv2-h5, .hv2-h6 { margin-bottom: 12px; text-align: left; }

  .hv2-hero-inner .hv2-sub { text-align: left; max-width: none; margin: 0 0 28px; }
  .hv2-sub, .hv2-body-text { font-size: 14px; }
  .hv2-page p { font-size: 12px; text-align: left; }

  .hv2-cta {
    padding: 5px 10px 5px 42px;
    font-size: 14px;
  }
  .hv2-cta-icon {
    left: 5px;
    width: 30px;
    height: 30px;
    padding-left: 20px;
  }
  .hv2-cta-chevron img { width: 11px; }

  .hv2-visual { border-radius: 8px; }

  .hv2-industry-panel-art img {
    height: auto;
    max-height: 90%;
    object-fit: contain;
    margin-right: 0;
    margin-left: auto;
    display: flex;
  }

  .hv2-final-cta-form { padding: 18px; border-radius: 8px; }

  /* Only the active bar has a coral background — a white icon there
     stays readable; other rows keep the dark icon on their white bg. */
  .hv2-industry-tab.is-active .hv2-industry-tab-chevron img { filter: brightness(0) invert(1); }

  .hv2-industry-panel { padding: 18px; }

  .hv2-growth-inner { padding-top: 230px; }
  .hv2-growth-card { max-width: 150px; }
  .hv2-growth-card--3 { top: 80px; left: 0; }
  .hv2-growth-card--4 { top: 130px; left: auto; right: 0; }

  .hv2-industry-panel-art {
    position: relative;
    width: 100%;
    display: flex;
    height: 100px;
    margin-top: 20px;
    justify-content: flex-end;
    align-items: center;
  }
}

/* ----- MOBILE: Growth Framework fallback -----
   The GSAP wheel is a fixed 1296px desktop-only build (not worth
   making responsive) — on mobile, hide it and fall back to the
   simple looping video panel instead. */
@media (max-width: 640px) {
  .hv2-fw-row { display: none; }
  .hv2-fw-mobile-only { display: block; margin-top: 2rem; }
}

/* ============================================================
   PAGE: single-solution.php — Solution Individual Pages
   (Performance, Visibility, Acquisition, Efficiency, Retention)
   Uses global tokens from :root above.
   ============================================================ */

/* ----- PAGE FRAME — matches homepage exactly ----- */
body.single-locus_solution { background: #4A0E1A; margin: 0; }
body.single-locus_industry { background: #4A0E1A; margin: 0; }
.sol-page { background: #fff; margin: 0 20px 20px; overflow: hidden; border-radius: 20px; }

/* ----- GLOBAL RESETS inside sol-page ----- */
.sol-page *, .sol-page *::before, .sol-page *::after { box-sizing: border-box; }
.sol-page img { display: block; max-width: 100%; }
.sol-page p {
  font-family: var(--font-body-locus);
  font-weight: var(--fw-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  letter-spacing: var(--ls-body);
  color: var(--locus-body-text);
  margin: 0;
}
.sol-page h1 {
  font-family: var(--font-heading);
  font-weight: var(--fw-heading);
  font-size: var(--fs-h1);
  line-height: var(--lh-h1);
  letter-spacing: var(--ls-h1);
  color: var(--locus-maroon);
  margin: 0 0 15px;
}
.sol-page h2 {
  font-family: var(--font-heading);
  font-weight: var(--fw-heading);
  font-size: var(--fs-h2);
  line-height: var(--lh-h2);
  letter-spacing: var(--ls-h2);
  color: var(--locus-maroon);
  margin: 0 0 20px;
}
.sol-page h3 {
  font-family: var(--font-heading);
  font-weight: var(--fw-heading);
  color: var(--locus-maroon);
}
.sol-page h4 {
  font-family: var(--font-heading);
  font-weight: var(--fw-heading);
  font-size: var(--fs-h4);
  line-height: var(--lh-h4);
  letter-spacing: var(--ls-h4);
  color: var(--locus-maroon);
  margin: 0 0 15px;
}

/* ----- CONTAINER — same max-width as homepage (1200px) ----- */
.sol-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0;
}

/* ----- SHARED ATOMS ----- */
.sol-eyebrow {
  display: inline-block;
  font-family: 'Inter Display', 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  color: #4A0E1A;
  background: #FFFFFF;
  border: 1px solid #ECECEC;
  border-radius: 100px;
  padding: 8px 14px;
}
.sol-section-heading {
  font-family: var(--font-heading);
  font-size: var(--fs-h2);
  font-weight: var(--fw-heading);
  letter-spacing: var(--ls-h2);
  line-height: var(--lh-h2);
  color: var(--locus-maroon);
  text-align: center;
  width: 80%;
  margin: 0 auto 24px !important;
}
p.sol-section-subtext {
  font-family: var(--font-body-locus);
  font-size: var(--fs-body);
  font-weight: var(--fw-body);
  line-height: var(--lh-body);
  letter-spacing: var(--ls-body);
  color: var(--locus-body-text);
  text-align: center;
  max-width: 780px;
  margin: 0 auto 32px;
}

/* ----- BUTTONS — match homepage button style ----- */
.sol-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: 'Inter Display', 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 400;
  text-decoration: none;
  border-radius: 4px;
  padding: 12px 22px;
  transition: background .15s;
  cursor: pointer;
}
.sol-btn:hover { opacity: .9; }
.sol-btn-icon { width: 20px; height: 20px; flex-shrink: 0; }
.sol-btn-primary {
  background: #4A0E1A;
  color: #fff;
}

/* ===== SECTION 1 — HERO ===== */
.sol-hero {
  background: #fff;
  padding: 5rem 24px;
  text-align: center;
}
.sol-hero .sol-container {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.sol-hero-heading {
  font-family: var(--font-heading);
  font-size: var(--fs-h1);
  font-weight: var(--fw-heading);
  letter-spacing: var(--ls-h1);
  line-height: var(--lh-h1);
  color: var(--locus-maroon);
  margin: 0 0 24px;
  text-align: center;
}
.sol-hero-heading em {
  font-style: normal;
  color: var(--locus-red-dark);
  display: block;
}
p.sol-hero-subtext {
  font-family: var(--font-body-locus);
  font-size: var(--fs-body);
  font-weight: var(--fw-body);
  line-height: var(--lh-body);
  letter-spacing: var(--ls-body);
  color: var(--locus-body-text);
  text-align: center;
  max-width: 780px;
  margin: 0 auto 32px;
}
.sol-hero-visual {
  width: 100%;
  max-width: 1200px;
  margin-top: 48px;
  border-radius: 16px;
  border: 1px solid #E8E0E0;
  overflow: hidden;
}
.sol-hero-visual img {
  width: 100%;
  height: auto;
  display: block;
}

/* ===== SECTION 2 — BUSINESS CHALLENGES & SOLUTIONS ===== */
.sol-problem {
  padding: 5rem 24px;
  background: #FBFAF6;
  text-align: center;
}
/* em is INLINE in section 2 — red text flows within the sentence */
.sol-problem .sol-section-heading em {
  font-style: normal;
  color: var(--locus-red);
  display: inline;
}
.sol-problem-table {
  max-width: 1100px;
  margin: 0 auto;
  border: 1px solid #ECECEC;
  border-radius: 16px;
  overflow: hidden;
  background: #FFFFFF;
  text-align: left;
  box-shadow: 0px 4px 40px 0px #0000000F;
}
.sol-problem-header {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-radius: 16px 16px 0 0;
  overflow: hidden;
}
.sol-problem-header-cell {
  height: 60px;
  padding: 20px 30px;
  font-family: var(--font-heading);
  font-size: 20px;
  font-weight: var(--fw-heading);
  color: var(--locus-white);
  display: flex;
  align-items: center;
}
.sol-problem-header-left  { background: var(--locus-red); border-top-left-radius: 12px; border-bottom-left-radius: 0; }
.sol-problem-header-right { background: var(--locus-maroon); }
.sol-problem-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-top: 0px solid #F0E8E8;
}
.sol-problem-challenge,
.sol-problem-solution {
  padding: 18px 28px;
  font-family: var(--font-body-locus);
  font-size: 16px;
  line-height: 1.55;
  color: #555;
}
.sol-problem-challenge {
  border-right: 1px solid #F0E8E8;
}
.sol-problem-solution {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  color: var(--locus-maroon);
}
.sol-problem-check {
  flex-shrink: 0;
  margin-top: 2px;
}

/* ===== SECTION 3 — FEATURE BLOCKS (alternating) ===== */
.sol-feat-blocks { }

.sol-feat-block {
  padding: 2rem 0;
  background: #fff;
}
.sol-feat-blocks .sol-feat-block:first-child { padding-top: 30px; }
.sol-feat-blocks .sol-feat-block:last-child  { padding-bottom: 5rem; }
.sol-feat-block-inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center;
  max-width: 1200px;
  margin: 0 auto;
}
/* Image on left — reverse column order */
.sol-feat-block--img-left .sol-feat-block-inner {
  direction: rtl;
}
.sol-feat-block--img-left .sol-feat-block-inner > * {
  direction: ltr;
}

.sol-feat-block-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.sol-feat-block-heading {
  font-family: var(--font-heading);
  font-size: var(--fs-h2);
  font-weight: var(--fw-heading);
  letter-spacing: var(--ls-h2);
  line-height: var(--lh-h2);
  color: var(--locus-maroon);
  margin: 0 0 20px;
  text-align: left;
}
.sol-feat-block-heading em {
  font-style: normal;
  color: var(--locus-red);
}
p.sol-feat-block-desc {
  font-family: var(--font-body-locus);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--locus-body-text);
  margin: 0 0 28px;
  max-width: 480px;
}
.sol-feat-block-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.sol-feat-tag {
  font-family: var(--font-body-locus);
  font-size: 13px;
  color: var(--locus-maroon-mid);
  background: #F7F7F7;
  border: none;
  border-radius: 100px;
  padding: 5px 14px;
  white-space: nowrap;
}

.sol-feat-block:hover .sol-feat-block-image img {
  box-shadow: 0px 0px 50px 0px #ff645024;
}
.sol-feat-block-image {
  border-radius: 20px;
  overflow: visible;
  padding: 0;
}
.sol-feat-block-image img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 12px;
  transition: box-shadow 0.3s ease;
}

/* sol-growth section wrapper — scoped padding/bg for solution pages only */
.sol-growth { padding: 40px 20px; background: #FAF9F5; }

/* ===== SOLUTIONS HUB PAGE ===== */

/* Section 2 — Why Locus */
.sol-hub-why {
  padding: 5rem 24px;
  background-color: #FBFAF6;
  position: relative;
  text-align: center;
}
.sol-hub-why::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url('/wp-content/uploads/2026/06/Section-Revenue-1.png');
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  opacity: 0.2;
  pointer-events: none;
}
.sol-hub-why-inner {
  max-width: 1200px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}
.sol-hub-why-heading {
  margin-bottom: 20px !important;
}
.sol-hub-why-heading em {
  font-style: normal;
  color: var(--locus-red);
}
.sol-hub-why-sub {
  max-width: 900px;
  margin: 0 auto 40px !important;
}

/* 4-col card grid */
.sol-hub-why-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  text-align: left;
}
.sol-hub-why-card {
  background: #FFFFFF;
  border: 1px solid #ECECEC;
  border-radius: 20px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  box-shadow: 0px 4px 60px 0px #0000000F;
  transition: box-shadow .2s ease;
}
.sol-hub-why-card:hover {
  box-shadow: 0 4px 60px rgba(0,0,0,0.1);
}
.sol-hub-why-icon {
  width: 36px;
  height: 36px;
  margin-bottom: 48px;
}
.sol-hub-why-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.sol-hub-why-card-title {
  font-family: 'Hanken Grotesk', sans-serif;
  font-size: 21px;
  font-weight: 500;
  color: #4A0E1A;
  letter-spacing: -1px;
  margin: 0 0 6px;
  line-height: 36px;
}
.sol-hub-why-card-desc {
  font-family: 'Inter Display', 'Inter', sans-serif;
  font-size: 16px !important;
  line-height: 24px !important;
  color: #83666C !important;
  margin: 0;
}

/* Solutions hub — platform section white bg override */
.page-solutions .hv2-platform { background: #ffffff; }
.hv2-page.page-solutions .hv2-platform { background: #ffffff; }

/* ===== SOLUTIONS HUB — Section 4: Intelligence Workflow ===== */
.sol-hub-intel {
  padding: 5rem 24px;
  background: #FBFAF6;
  text-align: center;
}
.sol-hub-intel-inner {
  max-width: 1200px;
  margin: 0 auto;
}
.sol-hub-intel .hv2-h2 em {
  font-style: normal;
  color: var(--locus-red);
}
.sol-hub-intel .hv2-sub {
  max-width: 620px;
  margin: 0 auto 32px !important;
}
.sol-hub-intel .hv2-cta {
  margin-bottom: 56px;
}
.sol-hub-intel-diagram {
  width: 100%;
  max-width: 1100px;
  margin: 0 auto;
}

/* ===== SOLUTIONS HUB — Section 5: Integrations Marquee ===== */
.sol-hub-integrations {
  position: relative;
  background: #fff;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 500px;
  padding: 5rem 0;
}

/* --- Marquee background --- */
.sol-hub-marquee-bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
  padding: 5rem 0;
}

/* Row 1 — sits near top edge */
.sol-hub-marquee-row--1 {
  position: absolute;
  top: 6%;
  left: 0; right: 0;
  overflow: hidden;
}
/* Row 2 — runs through the exact vertical center (behind card) */
.sol-hub-marquee-row--2 {
  position: absolute;
  top: 50%;
  left: 0; right: 0;
  transform: translateY(-50%);
  overflow: hidden;
}
/* Row 3 — sits near bottom edge */
.sol-hub-marquee-row--3 {
  position: absolute;
  bottom: 6%;
  left: 0; right: 0;
  overflow: hidden;
}

.sol-hub-marquee-track {
  display: flex;
  gap: 50px;
  width: max-content;
  padding: 0;
  animation: sol-marquee-ltr 35s linear infinite;
}
.sol-hub-marquee-track--reverse {
  animation: sol-marquee-rtl 35s linear infinite;
}
.sol-hub-marquee-item {
  flex-shrink: 0;
  width: 96px;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sol-hub-marquee-item img {
  object-fit: contain;
  display: block;
}
@keyframes sol-marquee-ltr {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-33.33%); }
}
@keyframes sol-marquee-rtl {
  0%   { transform: translateX(-33.33%); }
  100% { transform: translateX(0); }
}

/* --- Centre card --- */
.sol-hub-integrations-card {
  position: relative;
  z-index: 2;
  background: #fff;
  border: 1px solid #ECECEC;
  border-radius: 20px;
  padding: 52px 56px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 52px;
  align-items: center;
  max-width: 900px;
  width: calc(100% - 48px);
  box-shadow: 0px 0px 100px 0px rgba(0,0,0,0.12);
}
.sol-hub-integrations-heading {
  font-family: 'Hanken Grotesk', sans-serif;
  font-size: var(--fs-h3) !important;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: -2px;
  color: #2A0A10;
  margin: 0;
  width: 100%;
}
.sol-hub-integrations-heading em {
  font-style: normal;
  color: var(--locus-red);
}
.sol-hub-integrations-desc {
  font-family: 'Inter Display', 'Inter', sans-serif;
  font-size: 15px;
  line-height: 1.65;
  color: #4A0E1A !important;
  margin: 0 0 28px;
  margin-bottom: 1.3rem !important;
}

/* ===== SOLUTION SINGLE — Section 6: Outcomes / Benefits Cards ===== */
.sol-outcomes { background: #FAF9F5; padding: 5rem 24px; }
.sol-outcomes-heading { margin-bottom: 16px; text-align: center !important; }
.sol-outcomes-sub { width: 60%; margin: 0 auto 30px !important; text-align: center !important; }
.sol-outcomes-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 3rem;
}
.sol-outcomes-card {
  background: #FFFFFF;
  border: 1px solid #ECECEC;
  border-radius: 20px;
  padding: 30px;
  height: 256px;
  display: flex;
  flex-direction: column;
  gap: 0;
  box-sizing: border-box;
}
.sol-outcomes-icon {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin-bottom: 5rem;
}
.sol-outcomes-icon img {
  width: 32px;
  height: 32px;
  object-fit: contain;
}
.sol-outcomes-card-title {
  font-family: var(--font-heading);
  font-size: 22px;
  font-weight: 600;
  color: var(--locus-red);
  margin: 0 0 10px;
  line-height: 1.3;
}
.sol-outcomes-card-desc {
  font-family: var(--font-body-locus);
  font-size: 16px !important;
  line-height: 1.6 !important;
  color: var(--locus-body-text);
  margin: 0;
}

/* ===== CTA SECTION (shared partial) ===== */
.locus-cta-section {
  position: relative;
  text-align: center;
  padding: 100px 24px;
  overflow: hidden;
}
.locus-cta-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url('/wp-content/uploads/2026/07/CTA-Section-1.png') center center / cover no-repeat;
  opacity: 1;
  pointer-events: none;
}
.locus-cta-inner {
  position: relative;
  z-index: 1;
  margin: 0 auto;
}
.locus-cta-heading {
  margin: 0 0 12px;
}
h2.hv2-h2.locus-cta-heading { text-align: center; }
.locus-cta-heading em {
  font-style: normal;
  color: var(--locus-red);
}
.locus-cta-sub {
  font-family: var(--hv2-font-body);
  font-size: 17px;
  line-height: 1.65;
  color: var(--locus-body-text);
  margin: 0 0 30px !important;
  width: 50%;
  margin-left: auto !important;
  margin-right: auto !important;
}
form.locus-cta-form {
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}
.locus-cta-form-wrap {
  display: flex;
  align-items: center;
  background: #fff;
  border: 1px solid #ECECEC;
  border-radius: 8px;
  padding: 6px 6px 6px 20px;
  margin: 0 auto 12px;
}
.locus-cta-input {
  flex: 1;
  border: none;
  outline: none;
  padding: 10px 0;
  font-family: var(--font-display);
  font-size: 16px;
  color: var(--locus-maroon);
  background: transparent;
}
.locus-cta-input::placeholder { color: var(--locus-maroon-mid); }
p.locus-cta-msg { font-size: 14px; }
.locus-cta-btn {
  flex-shrink: 0;
  background: var(--locus-maroon);
  color: #fff;
  border: none;
  border-radius: 4px;
  padding: 10px 10px;
  font-family: var(--hv2-font-body, 'Inter Display', 'Inter', sans-serif);
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  margin: 3px;
  transition: background 0.2s;
  white-space: nowrap;
}
.locus-cta-btn:hover { background: var(--locus-red); }
p.locus-cta-note {
  font-family: 'Inter Display', 'Inter Display', 'Inter', sans-serif;
  font-size: 10px;
  font-weight: 400;
  line-height: 12px;
  letter-spacing: 0px;
  color: #83666C;
  margin: 10px 0 0;
  padding-left: 20px;
  text-align: justify;
  display: block;
}
.locus-cta-note a {
  color: var(--locus-maroon-mid);
  text-decoration: underline;
}
.locus-cta-note a:hover { color: var(--locus-red); }

/* ===== SOLUTION SINGLE — Intelligence / Features Diagram Section ===== */
.sol-intel { background: #fff; padding: 5rem 24px; }
.sol-intel-wrap {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 50px;
  align-items: stretch;
}

/* Left side */
.sol-intel-left { padding-right: 20px; }
.sol-intel-heading {
  font-family: var(--font-heading);
  font-size: var(--fs-h2);
  font-weight: var(--fw-heading);
  letter-spacing: var(--ls-h2);
  line-height: var(--lh-h2);
  color: var(--locus-maroon);
  text-align: left;
  margin-bottom: 24px;
}
.sol-intel-heading em {
  font-style: normal;
  color: var(--locus-red);
}
.sol-intel-sub {
  font-family: var(--font-body-locus);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--locus-body-text);
  margin: 0 0 32px;
  max-width: none;
  text-align: left;
}
.sol-intel-divider {
  border: none;
  margin: 0 0 32px;
}
.sol-intel-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.sol-intel-item {
  border-top: 1px solid #ECECEC;
  padding: 20px 0;
  gap: 1px;
  display: flex;
  flex-direction: column;
}
.sol-intel-item-title {
  font-family: var(--font-heading);
  font-size: 22px;
  font-weight: var(--fw-heading);
  letter-spacing: -1px;
  line-height: 33px;
  color: var(--locus-maroon);
  margin: 0 0 8px;
}
.sol-intel-item-desc {
  font-family: var(--font-body-locus);
  font-size: 16px !important;
  font-weight: var(--fw-body);
  line-height: 24px !important;
  letter-spacing: -0.41px;
  color: var(--locus-maroon-mid);
  margin: 0;
}

/* Right side — aspect-ratio keeps dot/badge % proportions correct (matches Figma 784×950) */
.sol-intel-diagram {
  position: relative;
  aspect-ratio: 330 / 400;
  background: radial-gradient(circle at 46% 63%, rgba(226,112,78,0.14) 0%, rgba(226,112,78,0.05) 35%, rgba(255,255,255,0) 62%);
  border-radius: 0px;
  overflow: visible;
}
.sol-intel-svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

/* Concentric rings */
.sol-intel-ring {
  fill: none;
  stroke: rgba(226,112,78,0.25);
  stroke-width: 1;
}

/* Animated lines — true arc-length via --len, paused until .is-visible */
.sol-intel-line {
  fill: none;
  stroke: url(#sol-line-grad);
  stroke-width: 2;
  stroke-linecap: round;
  stroke-dasharray: var(--len);
  stroke-dashoffset: var(--len);
  animation: sol-draw-line 1.1s cubic-bezier(0.4,0,0.2,1) forwards;
  animation-play-state: paused;
}
.sol-intel-line.line1 { animation-delay: 0s; }
.sol-intel-line.line2 { animation-delay: 0.4s; }
.sol-intel-line.line3 { animation-delay: 0.8s; }
.sol-intel-line.line4 { animation-delay: 1.2s; }
.sol-intel-diagram.is-visible .sol-intel-line { animation-play-state: running; }
@keyframes sol-draw-line { to { stroke-dashoffset: 0; } }

/* Row dots — fade in when their line finishes */
.sol-intel-dot {
  fill: #DE5F3C;
  opacity: 0;
  animation: sol-dot-in 0.25s ease-out forwards;
  animation-play-state: paused;
}
.sol-intel-dot.d1 { animation-delay: 1.1s; }
.sol-intel-dot.d2 { animation-delay: 1.5s; }
.sol-intel-dot.d3 { animation-delay: 1.9s; }
.sol-intel-dot.d4 { animation-delay: 2.3s; }
.sol-intel-diagram.is-visible .sol-intel-dot { animation-play-state: running; }
@keyframes sol-dot-in { to { opacity: 1; } }

/* Badge pills — Figma exact specs */
.sol-intel-badge {
  position: absolute;
  left: 49%;
  display: flex;
  align-items: center;
  gap: 10px;
  background: #FFFFFF;
  border: 1px solid #ECECEC;
  border-radius: 8px;
  padding: 12px 16px;
  font-family: var(--font-body-locus);
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: -0.41px;
  color: var(--locus-maroon);
  white-space: nowrap;
  box-shadow: 0px 0px 20px 0px #0000001F;
}
.sol-intel-badge-icon {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  color: #E2704E;
}
.sol-intel-badge-icon svg { width: 100%; height: 100%; }
.sol-intel-badge--1 { top: 4.7%; }
.sol-intel-badge--2 { top: 15.6%; }
.sol-intel-badge--3 { top: 25.1%; }
.sol-intel-badge--4 { top: 35.6%; }

/* AI Intelligence button */
.sol-intel-ai-btn {
  position: absolute;
  left: 49%;
  top: 73.4%;
  display: flex;
  align-items: center;
  gap: 12px;
  background: linear-gradient(120deg, #E4744E 0%, #7C3527 100%);
  color: #fff;
  border-radius: 8px;
  padding: 12px 16px;
  font-family: var(--font-body-locus);
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  white-space: nowrap;
  box-shadow: 0 12px 28px rgba(140,55,35,0.35);
}

/* ===== MOBILE: sol- pages ===== */
@media (max-width: 640px) {
  .sol-page { margin: 0 12px 12px; border-radius: 16px; }
  .sol-hero, .sol-problem { padding: 2.5rem 20px; }
  .sol-hero-heading { font-size: 32px; letter-spacing: -1px; }
  p.sol-hero-subtext, p.sol-section-subtext { font-size: 15px; max-width: none; }
  .sol-section-heading { font-size: 28px; letter-spacing: -1px; }
  .sol-hero-visual { margin-top: 2rem; border-radius: 16px; }
  .sol-problem-table { border-radius: 12px; }
  .sol-problem-header { flex-direction: column; }
  .sol-problem-row { grid-template-columns: 1fr; }
  .sol-problem-challenge { border-right: none; border-bottom: 1px solid #F0E8E8; }
  .sol-feat-block { padding: 2.5rem 20px; }
  .sol-feat-block-inner { grid-template-columns: 1fr; gap: 32px; direction: ltr; }
  .sol-feat-block--img-left .sol-feat-block-inner { direction: ltr; }
  .sol-feat-block-image { order: -1; }
  .sol-feat-block-heading { font-size: 28px; letter-spacing: -1px; }
  .locus-platform-card--featured { grid-template-columns: 1fr; }
  .locus-platform-grid { grid-template-columns: 1fr; }
  .locus-platform-card--featured .locus-platform-card-text { padding: 20px 20px 16px; }
  .locus-platform-card-shot { min-height: 160px; }
  .sol-hub-why-grid { grid-template-columns: 1fr 1fr; gap: 16px; }
  .sol-hub-why-icon { margin-bottom: 28px; }

  /* Global section spacing — mobile override */
  .locus-section { padding: 30px 20px; }

  /* Typography — heading size/spacing mobile overrides */
  .hv2-h1, .sol-page h1 { font-size: 30px; line-height: 1.3; letter-spacing: -1px; }
  .hv2-h2, .sol-page h2 { line-height: 1.4; }
  .hv2-h3, .sol-page h3 { font-size: 20px; line-height: 30px; letter-spacing: -0.41px; }

  /* Body — mobile line-height tighter */
  .hv2-page p, .sol-page p, .hv2-sub, .hv2-body-text { line-height: 24px; }
}

/* Hide mobile-only marquee rows on desktop */
.sol-hub-marquee-mobile-top,
.sol-hub-marquee-mobile-bottom { display: none; }

/* ===== MOBILE: Homepage v2 responsive pass (audit fixes) ===== */
@media (max-width: 640px) {

  /* Allow scroll carousels — hv2-page overflow:hidden blocks them */
  .hv2-page { overflow: visible; }

  /* Hide desktop-only forced line breaks — titles flow naturally */
  br.hv2-br { display: none; }

  /* No extra padding on narrow inner containers */
  .hv2-narrow-inner { padding-left: 0; padding-right: 0; }

  /* ---- Section 1: Hero ---- */
  .hv2-hero-inner { padding: 0; }
  .hv2-hero-inner .hv2-sub { margin-bottom: 32px; }

  /* ---- Section 2: Growth Opportunity ---- */
  .hv2-growth-inner .hv2-sub { margin-bottom: 32px; }

  /* Growth cards — staggered layout matching Figma */
  .hv2-growth-inner {
    position: relative;
    padding-top: 360px;
  }
  .hv2-growth-card {
    position: absolute;
    max-width: 170px;
    transform: none;
    transition: opacity .5s;
  }
  .hv2-growth-card.is-visible { transform: none; }
  .hv2-growth-card--1 { top: 0;     left: 0;    right: auto; rotate: -13deg; }
  .hv2-growth-card--2 { top: 57px;  right: 14px; left: auto; rotate: 13deg; }
  .hv2-growth-card--3 { top: 130px; left: 30px;  right: auto; rotate: 6deg; }
  .hv2-growth-card--4 { top: 230px; right: 19px; left: auto; rotate: -13deg; }

  /* ---- Section 3: Framework — GSAP wheel hidden on mobile ---- */
  .hv2-fw-row { display: none; }

  /* ---- Section 4: Intelligence Platform ---- */
  .hv2-platform-card { border-radius: 12px; }
  .hv2-platform-card-icon { width: 30px; height: 30px; }
  .hv2-platform-card-icon img { width: 12px; }
  .hv2-platform-card-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
  }
  .hv2-platform-card-title { margin-bottom: 0; }

  /* ---- Section 6: Industries — line art ---- */
  .hv2-industry-panel-art {
    width: 100%;
    height: 200px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-top: 16px;
  }
  .hv2-industry-panel-art img {
    height: 100%;
    width: auto;
    max-width: 87%;
    object-fit: contain;
  }

  /* ---- Section 7: Stats — bigger metric numbers ---- */
  .locations-showing-number { font-size: 48px; }

  /* ---- Body text ---- */
  .hv2-page p { font-size: 15px; text-align: left; }

  /* ---- FAQ question ---- */
  .hv2-faq-question { font-size: 16px; padding: 18px 4px; }

  /* ---- CTA button mobile sizing ---- */
  .hv2-cta {
    padding: 10px 16px 10px 46px;
    font-size: 14px;
  }
  .hv2-cta-icon {
    left: 5px;
    width: 30px;
    height: 30px;
    padding-left: 10px;
  }

  /* ---- Solutions page sections ---- */
  .sol-hub-why,
  .locus-cta-section { padding: 30px 20px; }
  .sol-hub-intel { padding: 30px 20px; text-align: left; }


  /* ---- Integrations section — stacked mobile layout ---- */
  .sol-hub-integrations {
    flex-direction: column;
    min-height: 0;
    padding: 0;
    gap: 0;
  }
  .sol-hub-marquee-bg { display: none; }
  .sol-hub-marquee-row--2 { display: none; }

  /* Show row 1 & 3 as natural-flow rows above and below card */
  .sol-hub-integrations-card {
    position: relative;
    z-index: 2;
    display: flow-root;
    margin: 0;
    border-radius: 16px;
    padding: 20px;
    width: calc(100% - 40px);
  }
  .sol-hub-integrations-card-left,
  .sol-hub-integrations-card-right {
    width: 100%;
  }
  .sol-hub-integrations-card-left {
    margin-bottom: 12px;
  }

  /* Inline marquee rows above and below card */
  .sol-hub-integrations::before,
  .sol-hub-integrations::after {
    content: none;
  }

  /* Mobile marquee wrapper rows */
  .sol-hub-marquee-mobile-top,
  .sol-hub-marquee-mobile-bottom {
    display: block;
    width: 100%;
    overflow: hidden;
    padding: 0;
  }

  /* Mobile marquee item size */
  .sol-hub-marquee-item {
    width: 70px;
    height: 70px;
  }

  /* Mobile p width fix */
  .hv2-page p { width: 100%; }

  /* ---- sol-hub-why cards — horizontal scroll carousel ---- */
  .sol-hub-why-grid {
    display: flex;
    flex-direction: row;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    gap: 16px;
    padding-bottom: 4px;
    margin: 0;
    padding-left: 6px;
    padding-right: 18px;
  }
  .sol-hub-why-grid::-webkit-scrollbar { display: none; }
  .sol-hub-why-card {
    flex: 0 0 85%;
    scroll-snap-align: start;
  }

  /* Pagination dots */
  .sol-hub-why-dots {
    display: flex;
    justify-content: center;
    gap: 6px;
    margin-top: 20px;
  }
  .sol-hub-why-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #ECECEC;
    transition: background .2s ease;
    cursor: pointer;
  }
  .sol-hub-why-dot.is-active { background: #4A0E1A; }

  h2.hv2-h2.locus-cta-heading {
    font-size: 28px;
    line-height: 1.25;
    letter-spacing: var(--ls-h1);
    text-align: left;
    margin: 0 0 12px;
  }
  .locus-cta-sub {
    font-size: 15px !important;
    line-height: 25px !important;
    width: 100% !important;
    text-align: left !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .locus-cta-inner { text-align: left; }

  p.locus-cta-note { font-size: 10px !important; }

  /* ===== single-solutions.php — mobile ===== */
  .sol-page { margin: 0; border-radius: 0; overflow: visible; }

  .sol-hero,
  .sol-problem,
  .sol-feat-block,
  .sol-intel,
  .sol-outcomes { padding: 30px 20px; }

  .sol-hero .sol-container { align-items: flex-start; }
  .sol-hero-heading { font-size: 30px; line-height: 1.2; letter-spacing: -1px; text-align: left; }
  .hv2-h2, .sol-page h2 { font-size: 28px; line-height: 1.2; letter-spacing: -1px; margin-bottom: 20px !important; text-align: left !important; width: 100%; }
  .hv2-h3, .sol-page h3 { font-size: 25px; line-height: 34px; letter-spacing: -0.41px; }
  .hv2-page p, .sol-page p, .hv2-sub, .hv2-body-text { line-height: 24px; width: 100%; text-align: left !important; }
  p.sol-hero-subtext { text-align: left; margin: 0 0 0px; }
  .sol-hero-visual { margin-top: 24px; }

  .sol-section-heading { font-size: 28px; line-height: 1.2; letter-spacing: -1px; width: 100%; text-align: left; }
  p.sol-section-subtext { text-align: left; }

  .sol-problem-table { border-radius: 12px; }
  .sol-problem-header { grid-template-columns: 1fr 1fr; }
  .sol-problem-header-cell { font-size: 14px; padding: 14px 16px; height: auto; }
  .sol-problem-row { grid-template-columns: 1fr 1fr; gap: 0; border-top: 1px solid #F0E8E8; }
  .sol-problem-challenge,
  .sol-problem-solution { padding: 12px 14px; font-size: 13px; line-height: 1.5; width: auto; }
  .sol-problem-challenge { border-right: 1px solid #F0E8E8; border-bottom: none; }

  .sol-feat-block-inner { grid-template-columns: 1fr; gap: 24px; }
  .sol-feat-block--img-left .sol-feat-block-inner { direction: ltr; }
  .sol-feat-block-heading { font-size: 28px; line-height: 1.2; letter-spacing: -1px; }
  .sol-feat-block-image { padding: 0px; }

  .sol-intel-wrap { display: flex; flex-direction: column; gap: 2px; }
  .sol-intel-left { display: contents; }
  .sol-intel-heading { order: 1; font-size: 28px; line-height: 1.2; letter-spacing: -1px; }
  .sol-intel-sub { order: 2; }
  .sol-intel-divider { display: none; }
  .sol-intel-diagram { order: 3; aspect-ratio: auto; min-height: 380px; }
  .sol-intel-grid { order: 4; grid-template-columns: 1fr; gap: 0; }
  .sol-intel-item { border-top: 1px solid #F0E8E8; padding: 16px 0; }
  .sol-intel-badge { font-size: 10px; padding: 7px 8px; gap: 4px; border-radius: 5px; }
  .sol-intel-ai-btn { font-size: 14px; padding: 10px 10px; border-radius: 8px; }

  .sol-outcomes-grid { grid-template-columns: 1fr; gap: 12px; }
  .sol-outcomes-card { height: auto; padding: 20px; }
  .sol-outcomes-icon { margin-bottom: 30px; }
  .sol-outcomes-heading { text-align: left; }
  .sol-outcomes-sub { text-align: left; }
  .locus-platform-card-shot { min-height: fit-content; }
  .sol-intel-item-title { font-size: 22px !important; line-height: 33px; letter-spacing: -1px; }
  .sol-hub-integrations-heading { font-size: 28px !important; line-height: 1.4 !important; }
  .locus-platform-card-icon { width: 28px; height: 28px; border-radius: 4px; background: #F7F7F7; }
  .locus-platform-card-icon img { width: 10px; height: auto; display: block; }
  .hv2-industry-logo { width: 98px; height: 40px; }
  .locations-showing-number { font-size: 36px; }
}

/* ============================================================
   INTELLIGENCE DIAGRAM — .sol-hub-intel-diagram component
   ============================================================ */

.sol-hub-intel-diagram {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  --pill-bg: #FBE7E2;
  --pill-cream: #FBF0D9;
  --pill-cream-text: #4A0E1A;
  --automate-bg: #B9CCEA;
}

.sol-hub-intel-diagram .flow-row {
  display: flex;
  align-items: center;
  gap: 0;
}

.sol-hub-intel-diagram .card {
  background: #FFFFFF;
  border: 1px solid #ECECEC;
  border-radius: 16px;
  padding: 20px 15px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 16px;
  height: 338px;
}

.sol-hub-intel-diagram .card-side { flex: 0 0 275px; }
.sol-hub-intel-diagram .card-center { flex: 1 1 auto; }

.sol-hub-intel-diagram .card-icon {
  height: 44px;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
}

.sol-hub-intel-diagram .card-icon img { display: block; max-height: 44px; width: auto; }

.sol-hub-intel-diagram .card h3 {
  font-family: 'Hanken Grotesk', sans-serif;
  font-size: 28px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -1px;
  text-align: center;
  margin: 0;
  color: var(--ink);
}

.sol-hub-intel-diagram .card h3.orange { color: #EA6A45; }

.sol-hub-intel-diagram .pill-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 16px;
}

.sol-hub-intel-diagram .pill {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--pill-bg);
  color: #4A0E1A;
  font-family: 'Inter Display', 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 100%;
  padding: 10px 13px;
  border-radius: 16777200px;
  min-height: 37px;
  width: fit-content;
  white-space: nowrap;
}

.sol-hub-intel-diagram .pill img { display: block; }

.sol-hub-intel-diagram .card-side .pill {
  background: var(--pill-cream);
  color: var(--pill-cream-text);
}

.sol-hub-intel-diagram .engine-rows {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 1.1rem;
}

.sol-hub-intel-diagram .engine-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
}

.sol-hub-intel-diagram img.arrow-size { width: 43px; margin: 0 9px; }

.sol-hub-intel-diagram .arrow-between {
  flex: 0 0 50px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Automate flow */
.sol-hub-intel-diagram .automate-flow {
  position: relative;
  margin-top: 0;
  height: 200px;
}

.sol-hub-intel-diagram .connector { position: absolute; top: 30px; }
.sol-hub-intel-diagram .connector.left { right: 50%; }
.sol-hub-intel-diagram .connector.right { left: 50%; }
.sol-hub-intel-diagram .connector.mobile-only { display: none; }

.sol-hub-intel-diagram .automate-center {
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.sol-hub-intel-diagram .down-arrow { margin-bottom: 15px; }

.sol-hub-intel-diagram .card:hover {
  transform: none;
  box-shadow: none;
}

.sol-hub-intel-diagram .automate-circle {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--automate-bg);
  box-shadow: 0 0 0 8px #FBFAF6;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
}

.sol-hub-intel-diagram .automate-center span {
  font-family: 'Hanken Grotesk', sans-serif;
  font-size: 28px;
  font-weight: 500;
  color: #4A0E1A;
}

/* Bottom bar */
.sol-hub-intel-diagram .bottom-bar {
  margin: 28px auto 0;
  width: fit-content;
  max-width: 100%;
  background: #4A0E1A;
  border-radius: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  color: #fff;
  font-size: 14px;
  padding: 10px 24px;
  font-weight: 400;
  overflow: hidden;
}

.sol-hub-intel-diagram .bottom-bar .item {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 12px 26px;
  border-right: 1px solid #ECECEC;
  white-space: nowrap;
}

.sol-hub-intel-diagram .bottom-bar .item:last-child { border-right: none; }

/* Compact mobile — hide pills/bottom-bar, show 3-card row */
@media (max-width: 1100px) {
  .sol-hub-intel-diagram .pill-list,
  .sol-hub-intel-diagram .engine-rows,
  .sol-hub-intel-diagram .bottom-bar { display: none; }

  .sol-hub-intel-diagram .card { height: auto; padding: 18px 6px; gap: 12px; justify-content: center; border-radius: 12px; }
  .sol-hub-intel-diagram .card-side { flex: 1 1 0; min-width: 0; padding: 8px !important; height: 140px; }
  .sol-hub-intel-diagram .card-center { flex: 1 1 0; min-width: 0; padding: 10px !important; height: 140px; }
  .sol-hub-intel-diagram .card-icon { height: 34px; }
  .sol-hub-intel-diagram .card-icon img { max-height: 38px; }
  .sol-hub-intel-diagram .card h3 { font-size: 16px; letter-spacing: -0.3px; line-height: 20px; }
  .sol-hub-intel-diagram .arrow-between { flex: 0 0 24px; }
  .sol-hub-intel-diagram img.arrow-size { width: 20px; margin: 0 4px; }
  .sol-hub-intel-diagram .automate-flow { height: 150px; margin-top: 10px; }
  .sol-hub-intel-diagram .connector.desktop-only { display: none; }
  .sol-hub-intel-diagram .connector.mobile-only { display: block; top: 0; }
  .sol-hub-intel-diagram .connector.mobile-only.left { right: 60%; left: auto; }
  .sol-hub-intel-diagram .connector.mobile-only.right { left: 60%; right: auto; }
  .sol-hub-intel-diagram .down-arrow { width: auto; height: 50px; }
  .sol-hub-intel-diagram .automate-circle { width: 48px; height: 48px; box-shadow: 0 0 0 6px #FBFAF6; }
  .sol-hub-intel-diagram .automate-center span { font-size: 18px; }
}

/* ============================================================
   INDUSTRIES HUB PAGE
   ============================================================ */

body.page-template-page-industries-php { background: #4A0E1A; margin: 0; }

/* Hero */
.ind-hero {
  background: linear-gradient(180deg, #FBF0E8 0%, #FBFAF6 100%);
  padding: 80px 24px 60px;
  text-align: center;
}

.ind-hero-inner {
  max-width: 780px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}

.ind-hero .hv2-h1 {
  font-size: clamp(2.2rem, 5vw, 3.2rem);
  line-height: 1.15;
  letter-spacing: -1.5px;
  text-align: center;
}

.ind-hero .hv2-sub {
  max-width: 640px;
  text-align: center;
  margin-bottom: 0;
}

/* Grid section */
.ind-grid-section {
  background: #fff;
  padding: 80px 24px;
}

.ind-grid-inner {
  max-width: 1100px;
  margin: 0 auto;
  text-align: center;
}

.ind-grid-heading {
  margin-bottom: 16px;
}

.ind-grid-sub {
  margin-bottom: 56px;
}

/* Single row (≤8): CSS var --ind-count drives column count */
.ind-grid--single {
  display: grid;
  grid-template-columns: repeat(var(--ind-count, 8), 1fr);
  gap: 25px;
  justify-items: center;
}

/* Two rows (>8): each row is a centered flex strip */
.ind-grid--double {
  display: flex;
  flex-direction: column;
  gap: 25px;
}
.ind-grid-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 25px;
}
.ind-grid-row .ind-card {
  flex: 0 0 calc((100% - 4 * 25px) / 5);
  max-width: 140px;
}

.ind-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  text-decoration: none;
  color: var(--ink, #241012);
}

.ind-card-icon {
  width: 80px;
  height: 80px;
  background: #fff;
  border: 0px solid #ECECEC;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  box-shadow: 0px 0px 8px 0px #0000001F;
}

.ind-card-icon svg {
  width: 40px;
  height: 40px;
}

.ind-card:hover .ind-card-icon {
  box-shadow: 0 4px 16px rgba(234,106,69,0.15);
}

.ind-card-label {
  font-family: 'Hanken Grotesk', sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
  text-align: center;
  color: #4A0E1A;
}

/* 4-column outcomes grid override for industries page */
.page-industries h2.hv2-h2 { margin-bottom: 0.5rem; }
.ind-outcomes-grid { grid-template-columns: repeat(4, 1fr); }
.ind-outcomes-grid .sol-outcomes-card {
  background: #FFFFFF;
  border: 1px solid #ECECEC;
  border-radius: 12px;
  padding: 24px;
  height: auto;
  display: flex;
  flex-direction: column;
  gap: 0;
  box-sizing: border-box;
  box-shadow: 0px 4px 60px 0px #0000000F;
}
.ind-outcomes-grid .sol-outcomes-card-title { color: #4A0E1A; }

@media (max-width: 1024px) {
  .ind-grid { grid-template-columns: repeat(4, 1fr); }
  .ind-outcomes-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px) {
  .ind-hero { padding: 40px 20px 30px; }
  .ind-hero-inner { max-width: 100%; align-items: baseline; gap: 18px; }
  .ind-hero .hv2-h1 { font-size: clamp(2.2rem, 5vw, 3.2rem); line-height: 1.15; letter-spacing: -1.5px; text-align: left; width: 100%; margin-bottom: 0; }
  .ind-grid-section { padding: 40px 20px; }
  .ind-grid { grid-template-columns: repeat(3, 1fr); gap: 20px 12px; }
  .ind-card-icon { width: 60px; height: 60px; border-radius: 4px; }
  .ind-card-icon svg { width: 24px; height: 24px; }
  .ind-card-label { font-size: 11px; }
  /* platform cards — horizontal scroll on mobile */
  .ind-platform-section .sol-container { overflow: hidden; padding: 0; }
  .ind-outcomes-grid {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    gap: 12px;
    padding: 0 20px 16px;
    grid-template-columns: unset;
  }
  .ind-outcomes-grid .sol-outcomes-card {
    flex: 0 0 80vw;
    max-width: 300px;
    scroll-snap-align: start;
    box-shadow: none;
  }
  .ind-outcomes-grid::-webkit-scrollbar { display: none; }
  .ind-outcomes-grid .sol-outcomes-card-title { font-size: 18px; }
  .ind-outcomes-grid .sol-outcomes-card-desc { font-size: 14px !important; line-height: 1.6 !important; margin: 0; }

  /* industry grid — 3 cols, bigger icons */
  .ind-grid-sub { margin-bottom: 30px; }
  .ind-grid { grid-template-columns: repeat(3, 1fr); gap: 20px 10px; }
  .ind-card-icon { width: 100px; height: 100px; border-radius: 4px; }
  .ind-card-label { font-size: 11px; }

  /* hide items beyond 9th by default on mobile */
  .ind-card.ind-card--hidden { display: none; }
  .ind-card.ind-card--hidden.ind-card--visible { display: flex; }

  /* View More button */
  .ind-view-more-wrap { display: flex; justify-content: center; margin-top: 28px; }
  .ind-view-more-btn {
    background: none;
    border: none;
    cursor: pointer;
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 15px;
    font-weight: 600;
    color: #4A0E1A;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
  }
  .ind-view-more-icon { width: 20px; height: 20px; display: block; }
}