/* ============================================================
   ENACT — Design Tokens
   ============================================================ */
:root {
  --ink-950:       #102124;
  --ink-800:       #21373B;
  --ink-700:       #2A4548;
  --primary-500:   #8DC63F;
  --primary-400:   #A5D463;
  --primary-300:   #C4E27A;
  --primary-600:   #74A832;
  --surface-100:   #F4F7F7;
  --surface-50:    #FAFBFB;
  --slate-600:     #587176;
  --slate-400:     #7A9EA3;
  --white:         #FFFFFF;
  --font-primary:  #102124;
  --font-secondary:#587176;
  --font-inverse:  #FFFFFF;
  --font-inv-muted:#B8C8CA;
  --accent-500:    #C38A2E;

  --font-heading: 'Manrope', sans-serif;
  --font-body:    'Inter', sans-serif;

  --radius-sm:   8px;
  --radius-md:   12px;
  --radius-lg:   16px;
  --radius-xl:   20px;
  --radius-2xl:  24px;
  --radius-full: 999px;

  --max-w: 1280px;
  --nav-h: 72px;
}

/* ============================================================
   RESET & BASE
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
  /* Reserve scrollbar space so pages of different heights don't
     shift horizontally when the scrollbar appears/disappears. */
  scrollbar-gutter: stable;
}

body {
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.6;
  color: var(--font-primary);
  background: var(--white);
  -webkit-font-smoothing: antialiased;
}

img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }
button { cursor: pointer; border: none; background: none; font: inherit; }
input, select { font: inherit; }
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; }

:focus-visible {
  outline: 2px solid var(--primary-500);
  outline-offset: 3px;
  border-radius: 4px;
}

/* ============================================================
   LAYOUT
   ============================================================ */
.container {
  width: 100%;
  max-width: var(--max-w);
  margin-inline: auto;
  padding-inline: 80px;
}

@media (max-width: 1024px) { .container { padding-inline: 40px; } }
@media (max-width: 640px)  { .container { padding-inline: 20px; } }

/* ============================================================
   TYPOGRAPHY HELPERS
   ============================================================ */
.section-title {
  font-family: var(--font-heading);
  font-size: clamp(28px, 4vw, 48px);
  font-weight: 700;
  line-height: 1.15;
  color: var(--font-primary);
}
.section-title--center   { text-align: center; }
.section-title--inverse  { color: var(--font-inverse); }

.section-body {
  font-size: 17px;
  line-height: 1.7;
  color: var(--font-secondary);
}
.section-body--center { text-align: center; }
.section-body--muted  { color: var(--font-inv-muted); }

/* ============================================================
   PILLS
   ============================================================ */
.pill {
  display: inline-flex;
  align-items: center;
  padding: 6px 14px;
  border-radius: var(--radius-full);
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 600;
  width: fit-content;
}
.pill--green        { background: var(--primary-500); color: var(--ink-950); }
.pill--dark         { background: var(--ink-950);      color: var(--primary-300); }
.pill--teal-outline { background: #1E3335;             color: var(--primary-400); }

/* ============================================================
   BUTTONS
   ============================================================ */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 28px;
  border-radius: var(--radius-full);
  font-family: var(--font-body);
  font-size: 15px;
  font-weight: 600;
  line-height: 1;
  transition: opacity .15s, transform .1s;
  white-space: nowrap;
}
.btn:hover  { opacity: .88; }
.btn:active { transform: scale(.97); }

.btn--primary { background: var(--primary-500); color: var(--ink-950); }
.btn--ghost   {
  background: transparent;
  color: var(--font-inverse);
  border: 1px solid var(--slate-600);
}
.btn--ghost:hover { border-color: var(--font-inv-muted); opacity: 1; }

.btn--dark    { background: var(--ink-950); color: var(--white); }
.btn--outline-dark {
  background: transparent;
  color: var(--ink-950);
  border: 2px solid var(--ink-950);
}
.btn--sm   { padding: 10px 20px; font-size: 14px; font-weight: 700; }
.btn--full { width: 100%; }

/* ============================================================
   FEATURE LIST (checkmarks)
   ============================================================ */
.feature-list { display: flex; flex-direction: column; gap: 12px; }
.feature-list__item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 15px;
  color: var(--font-secondary);
}
.feature-list__item [class^="icon-"] { color: var(--primary-600); flex-shrink: 0; }

/* ============================================================
   BULLET LIST
   ============================================================ */
.bullet-list { display: flex; flex-direction: column; gap: 14px; }
.bullet-list__item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: 15px;
  line-height: 1.55;
  color: var(--font-secondary);
}
.bullet-list__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: var(--primary-500);
  color: var(--white);
  flex-shrink: 0;
  font-size: 16px;
}
.bullet-list__icon--green { background: var(--primary-500); color: var(--ink-950); }
.bullet-list--dark .bullet-list__item { color: var(--font-secondary); }

/* ============================================================
   ICON FONT (Lucide via CDN — mapped to class names)
   We use a data-icon approach via pseudo-element as fallback.
   Primary: lucide-static font classes.
   ============================================================ */
[class^="icon-"], [class*=" icon-"] {
  font-family: 'lucide' !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  speak: never;
  display: inline-block;
  vertical-align: middle;
}

/* ============================================================
   NAV
   ============================================================ */
.nav {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--ink-950);
  height: var(--nav-h);
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.nav__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  height: 100%;
  max-width: var(--max-w);
  margin-inline: auto;
  padding-inline: 80px;
}
.nav__logo {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  height: 100%;
}
.nav__logo-img {
  height: 28px;
  width: auto;
  display: block;
}
@media (max-width: 640px) {
  .nav__logo-img { height: 24px; }
}
.nav__links {
  display: flex;
  align-items: center;
  gap: 4px;
}
.nav__link {
  font-size: 15px;
  font-weight: 500;
  color: rgba(255,255,255,.55);
  padding: 6px 14px;
  border-radius: var(--radius-full);
  transition: color .15s, background .15s;
}
.nav__link:hover { color: var(--white); background: rgba(255,255,255,.08); }
.nav__link--active { color: var(--white); background: rgba(255,255,255,.1); }

.nav__right {
  display: flex;
  align-items: center;
  gap: 16px;
}
.nav__login {
  font-size: 15px;
  font-weight: 500;
  color: var(--font-inverse);
  transition: opacity .15s;
}
.nav__login:hover { opacity: .7; }

.nav__hamburger {
  display: none;
  color: var(--white);
  font-size: 24px;
  padding: 4px;
}

@media (max-width: 768px) {
  .nav__inner { padding-inline: 20px; }
  .nav__links, .nav__right { display: none; }
  .nav__hamburger { display: flex; }
}

/* ============================================================
   MOBILE MENU
   ============================================================ */
.mobile-menu {
  position: fixed;
  inset: 0 0 0 auto;
  z-index: 200;
  width: min(320px, 100vw);
  background: var(--ink-950);
  transform: translateX(100%);
  transition: transform .28s cubic-bezier(.4,0,.2,1);
}
.mobile-menu[aria-hidden="false"] { transform: translateX(0); }

.mobile-menu__inner {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 24px 24px 40px;
  height: 100%;
  overflow-y: auto;
}
.mobile-menu__close {
  align-self: flex-end;
  color: var(--white);
  font-size: 24px;
  padding: 4px;
  margin-bottom: 16px;
}
.mobile-menu__link {
  display: block;
  padding: 14px 0;
  font-size: 18px;
  font-weight: 500;
  color: var(--white);
  border-bottom: 1px solid rgba(255,255,255,.08);
  transition: color .15s;
}
.mobile-menu__link:hover { color: var(--primary-400); }
.mobile-menu__link--muted { color: rgba(255,255,255,.55); }
.mobile-menu .btn--full { margin-top: 20px; }

.mobile-menu__overlay {
  position: fixed;
  inset: 0;
  z-index: 190;
  background: rgba(0,0,0,.5);
  opacity: 0;
  pointer-events: none;
  transition: opacity .28s;
}
.mobile-menu__overlay.is-active {
  opacity: 1;
  pointer-events: auto;
}

/* ============================================================
   HERO
   ============================================================ */
.hero {
  background: var(--ink-950);
  padding-block: 80px 0;
  overflow: hidden;
  min-height: calc(100vh - var(--nav-h) - 60px);
  display: flex;
  flex-direction: column;
}
.hero__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 60px;
  flex: 1;
  min-height: 100%;
}
.hero__content {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.hero__title {
  font-family: var(--font-heading);
  font-size: clamp(32px, 4vw, 56px);
  font-weight: 700;
  line-height: 1.12;
  color: var(--white);
}
.hero__sub {
  font-size: 18px;
  line-height: 1.6;
  color: var(--font-inv-muted);
  max-width: 520px;
}
.hero__ctas { display: flex; gap: 16px; flex-wrap: wrap; }

.hero__visual {
  position: relative;
  margin-bottom: 0;
  z-index: 1;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  height: 100%;
}
.hero__photo-wrap { position: relative; }
.hero__photo {
  width: 100%;
  height: 100%;
  min-height: 600px;
  object-fit: contain;
  border-radius: var(--radius-xl);
}
.hero__card {
  position: absolute;
  bottom: 36px;
  right: -24px;
  background: var(--ink-950);
  border: 1px solid var(--ink-700);
  border-radius: var(--radius-xl);
  padding: 20px;
  min-width: 240px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  box-shadow: 0 12px 32px rgba(0,0,0,.4);
}
.hero__card-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}
.hero__card-currency { display: flex; align-items: center; gap: 8px; }
.hero__card-flag { font-size: 18px; line-height: 1; }
.hero__card-label { font-size: 12px; color: var(--slate-400); font-weight: 500; }
.hero__card-amount { font-size: 14px; font-weight: 600; color: var(--white); }
.hero__card-divider { height: 1px; background: var(--ink-700); }

@media (max-width: 1024px) {
  .hero__inner { grid-template-columns: 1fr; }
  .hero__visual { max-width: 480px; margin-inline: auto; }
  .hero__card { right: 0; bottom: -16px; min-width: 200px; }
}
@media (max-width: 640px) {
  .hero {
    padding-block: 48px 0;
    min-height: 0;
  }
  .hero__inner { gap: 32px; min-height: 0; }
  .hero__sub { font-size: 15px; }
  .hero__ctas { flex-direction: column; }
  .hero__ctas .btn { width: 100%; text-align: center; }

  .hero__visual {
    max-width: none;
    margin-inline: 0;
    height: auto;
    align-items: stretch;
  }
  .hero__photo-wrap { width: 100%; }
  .hero__photo {
    width: 100%;
    height: auto;
    min-height: 0;
    max-height: 70vh;
    aspect-ratio: 4 / 5;
    object-fit: cover;
    object-position: center top;
    border-radius: var(--radius-xl) var(--radius-xl) 0 0;
    display: block;
  }
  .hero__card { right: 16px; bottom: 16px; }
}

/* ============================================================
   TRUST STRIP
   ============================================================ */
.trust-strip {
  background: var(--primary-500);
  padding: 18px 0;
  position: relative;
  z-index: 5;
}
.trust-strip__inner {
  display: flex;
  align-items: center;
  justify-content: space-around;
  flex-wrap: wrap;
  gap: 12px 24px;
}
.trust-strip__item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 600;
  color: var(--ink-950);
}
.trust-strip__item [class^="icon-"] { font-size: 18px; }

@media (max-width: 640px) {
  .trust-strip__inner { justify-content: flex-start; gap: 10px 20px; }
  .trust-strip__item { font-size: 12px; }
}

/* ============================================================
   CALCULATOR
   ============================================================ */
.calculator-section {
  background: var(--white);
  padding-block: 100px;
}
.calculator-section__inner {
  display: grid;
  grid-template-columns: 1fr 480px;
  align-items: center;
  gap: 80px;
}
.calculator-section__copy {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.calc-card {
  background: var(--ink-950);
  border-radius: var(--radius-xl);
  padding: 36px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.calc-card__row { display: flex; flex-direction: column; gap: 6px; }
.calc-card__field { display: flex; flex-direction: column; gap: 6px; }
.calc-card__label { font-size: 12px; font-weight: 600; color: var(--slate-400); text-transform: uppercase; letter-spacing: .5px; }
.calc-card__input-wrap {
  display: flex;
  align-items: center;
  background: var(--ink-800);
  border-radius: var(--radius-md);
  overflow: hidden;
  border: 1px solid var(--ink-700);
}
.calc-card__currency {
  padding: 12px 14px;
  background: transparent;
  color: var(--white);
  border: none;
  border-right: 1px solid var(--ink-700);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  min-width: 90px;
}
.calc-card__input {
  flex: 1;
  padding: 12px 14px;
  background: transparent;
  border: none;
  color: var(--white);
  font-size: 20px;
  font-weight: 700;
  min-width: 0;
}
.calc-card__input::placeholder { color: var(--slate-400); }
.calc-card__input--result { color: var(--primary-400); }

.calc-card__meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 14px;
}
.calc-card__meta-label { color: var(--slate-400); }
.calc-card__meta-value { color: var(--font-inv-muted); font-weight: 500; }
.calc-card__meta-value--green { color: var(--primary-400); font-weight: 600; }

.calc-card__divider { height: 1px; background: #2A4548; }

@media (max-width: 1024px) {
  .calculator-section__inner { grid-template-columns: 1fr; }
  .calc-card { max-width: 520px; }
}
@media (max-width: 640px) {
  .calculator-section { padding-block: 64px; }
  .calc-card { padding: 24px 20px; }
  .calc-card__input { font-size: 16px; }
}

/* ============================================================
   TRANSPARENCY
   ============================================================ */
.transparency-section {
  background: var(--ink-950);
  padding-block: 80px;
}
.transparency-section__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 40px;
}
.transparency-section__inner .section-body { max-width: 680px; }

.trans-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  width: 100%;
}
.trans-card {
  background: #1A3538;
  border-radius: var(--radius-lg);
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.trans-card__icon {
  font-size: 32px;
  color: var(--primary-400);
}
.trans-card__icon--accent { color: var(--accent-500); }
.trans-card__text {
  font-size: 15px;
  line-height: 1.6;
  color: var(--font-inv-muted);
}

@media (max-width: 768px) {
  .trans-cards { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .transparency-section { padding-block: 64px; }
}

/* ============================================================
   MULTI-CURRENCY
   ============================================================ */
.multi-section {
  background: var(--surface-100);
  padding-block: 80px;
}
.multi-section__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 60px;
}
.multi-section__copy {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.multi-section__visual { position: relative; }
.multi-section__photo-wrap { position: relative; border-radius: var(--radius-2xl); overflow: visible; }
.multi-section__photo {
  width: 100%;
  aspect-ratio: 4/2.8;
  object-fit: cover;
  border-radius: var(--radius-2xl);
}

.currency-mockup {
  position: absolute;
  bottom: -32px;
  left: -40px;
  background: var(--ink-950);
  border: 1px solid var(--ink-700);
  border-radius: var(--radius-xl);
  padding: 20px;
  min-width: 280px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  box-shadow: 0 12px 32px rgba(0,0,0,.25);
}
.currency-mockup__row { display: flex; align-items: center; gap: 12px; }
.currency-mockup__flag { font-size: 20px; flex-shrink: 0; }
.currency-mockup__info { flex: 1; display: flex; flex-direction: column; }
.currency-mockup__name { font-size: 13px; font-weight: 600; color: var(--white); }
.currency-mockup__code { font-size: 11px; color: var(--slate-400); }
.currency-mockup__amount { font-size: 13px; font-weight: 700; color: var(--primary-400); white-space: nowrap; }
.currency-mockup__divider { height: 1px; background: var(--ink-700); }
.currency-mockup__convert { display: flex; justify-content: space-between; align-items: center; }
.currency-mockup__convert-label { font-size: 12px; color: var(--slate-400); }
.currency-mockup__convert-rate { font-size: 12px; font-weight: 600; color: var(--primary-400); }

@media (max-width: 1024px) {
  .multi-section__inner { grid-template-columns: 1fr; }
  .multi-section__visual { max-width: 520px; margin-inline: auto; padding-bottom: 56px; }
  .currency-mockup { left: 0; min-width: 240px; }
}
@media (max-width: 640px) {
  .multi-section { padding-block: 64px; }
  .currency-mockup { position: static; margin-top: 16px; min-width: unset; }
  .multi-section__visual { padding-bottom: 0; }
}

/* ============================================================
   SEND & RECEIVE
   ============================================================ */
.send-section {
  background: var(--white);
  padding-block: 100px;
}
.send-section__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 48px;
}
.send-section__inner .section-body { max-width: 600px; }

.send-flow-card {
  background: var(--surface-100);
  border-radius: 28px;
  padding: 40px;
  width: 100%;
  max-width: 600px;
  display: flex;
  justify-content: center;
}
.send-flow-card__inner {
  background: var(--ink-950);
  border-radius: var(--radius-xl);
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 0;
  min-width: 320px;
  box-shadow: 0 8px 32px rgba(16,33,36,.14);
}
.send-flow-step {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 14px 0;
}
.send-flow-step__icon {
  width: 40px;
  height: 40px;
  border-radius: var(--radius-md);
  background: var(--ink-800);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--primary-400);
  font-size: 18px;
}
.send-flow-step__icon--green { background: var(--primary-500); color: var(--ink-950); }
.send-flow-step__content { display: flex; flex-direction: column; gap: 2px; }
.send-flow-step__label { font-size: 11px; font-weight: 600; color: var(--slate-400); text-transform: uppercase; letter-spacing: .5px; }
.send-flow-step__value { font-size: 15px; font-weight: 600; color: var(--white); }
.send-flow-card__arrow { padding: 4px 0 4px 12px; color: var(--slate-400); font-size: 18px; }

.send-features {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  width: 100%;
}
.send-feature {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  text-align: center;
}
.send-feature__icon {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: var(--surface-100);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primary-600);
  font-size: 22px;
}
.send-feature__label { font-size: 14px; font-weight: 600; color: var(--font-primary); }

@media (max-width: 768px) {
  .send-features { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .send-section { padding-block: 64px; }
  .send-flow-card { padding: 20px; }
  .send-flow-card__inner { min-width: unset; padding: 20px; }
}

/* ============================================================
   CARDS SECTION
   ============================================================ */
.cards-section {
  background: var(--ink-950);
  padding-block: 100px;
}
.cards-section__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 48px;
}
.cards-section__inner .section-body { max-width: 560px; }

.card-visual {
  display: flex;
  justify-content: center;
}
.card-visual__card {
  width: 340px;
  aspect-ratio: 1.586;
  background: linear-gradient(135deg, #1A3538 0%, #2A4548 60%, #1E3335 100%);
  border-radius: 18px;
  padding: 28px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-shadow: 0 24px 48px rgba(0,0,0,.5);
  border: 1px solid rgba(255,255,255,.08);
  position: relative;
  overflow: hidden;
}
.card-visual__card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 70% 20%, rgba(141,198,63,.12) 0%, transparent 60%);
}
.card-visual__chip {
  width: 36px;
  height: 28px;
  background: linear-gradient(135deg, #C38A2E, #E8B84B);
  border-radius: 5px;
}
.card-visual__logo {
  font-family: var(--font-heading);
  font-size: 20px;
  font-weight: 700;
  color: var(--primary-500);
  text-align: right;
}
.card-visual__number {
  font-family: 'Courier New', monospace;
  font-size: 16px;
  letter-spacing: 2px;
  color: rgba(255,255,255,.7);
}
.card-visual__footer {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.card-visual__name { font-size: 12px; letter-spacing: 1.5px; color: rgba(255,255,255,.6); font-weight: 600; }
.card-visual__network { font-size: 18px; font-weight: 800; color: rgba(255,255,255,.5); font-style: italic; }

.cards-features {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  width: 100%;
}
.cards-feature {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  text-align: center;
}
.cards-feature__icon {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: #1A3538;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primary-400);
  font-size: 22px;
}
.cards-feature__title { font-size: 15px; font-weight: 600; color: var(--white); }
.cards-feature__desc { font-size: 13px; line-height: 1.5; color: rgba(255,255,255,.53); }

@media (max-width: 768px) {
  .cards-features { grid-template-columns: 1fr; max-width: 400px; }
  .cards-feature { align-items: flex-start; text-align: left; flex-direction: row; gap: 16px; }
  .cards-feature__icon { flex-shrink: 0; }
  .cards-feature > div { display: flex; flex-direction: column; gap: 4px; }
}
@media (max-width: 640px) {
  .cards-section { padding-block: 64px; }
  .card-visual__card { width: 280px; padding: 20px; }
}

/* ============================================================
   EVERYDAY SERVICES
   ============================================================ */
.services-section {
  background: var(--white);
  padding-block: 100px;
}
.services-section__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 48px;
}

.services-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  width: 100%;
}
.services-card {
  background: var(--ink-950);
  border-radius: var(--radius-xl);
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  box-shadow: 0 8px 32px rgba(16,33,36,.1);
}
.services-card__title { font-size: 16px; font-weight: 700; color: var(--white); }
.services-icons-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
.services-icon-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 600;
  color: var(--slate-400);
  text-align: center;
}
.services-icon-item__icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: var(--ink-800);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primary-400);
  font-size: 20px;
}
.services-card__divider { height: 1px; background: var(--ink-700); }
.services-card__recent { font-size: 12px; font-weight: 500; color: rgba(255,255,255,.53); }
.services-card__txn {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 13px;
}
.services-card__txn-name { color: var(--white); display: flex; align-items: center; gap: 8px; }
.services-card__txn-amount { color: var(--primary-400); font-weight: 600; }

.services-bullets {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 28px;
  padding: 20px;
}
.services-bullets__body { font-size: 16px; line-height: 1.65; color: var(--font-secondary); }

@media (max-width: 768px) {
  .services-grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .services-section { padding-block: 64px; }
  .services-card { padding: 24px 20px; }
}

/* ============================================================
   REWARDS
   ============================================================ */
.rewards-section {
  background: var(--primary-300);
  padding-block: 64px;
}
.rewards-section__inner {
  display: flex;
  flex-direction: column;
  gap: 40px;
}
.rewards-section__top {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}
.rewards-section__top .section-title { color: var(--ink-950); }
.rewards-section__content {
  display: grid;
  grid-template-columns: 1fr 300px 1fr;
  align-items: center;
  gap: 32px;
}
.rewards-section__desc { font-size: 16px; line-height: 1.65; color: var(--ink-800); }

.rewards-card {
  background: var(--white);
  border-radius: var(--radius-lg);
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  box-shadow: 0 6px 24px rgba(0,0,0,.1);
}
.rewards-card__label { font-size: 13px; font-weight: 500; color: var(--font-secondary); }
.rewards-card__points { font-family: var(--font-heading); font-size: 32px; font-weight: 700; color: var(--ink-950); }
.rewards-card__row { display: flex; justify-content: space-between; align-items: center; }
.rewards-card__earned { font-size: 13px; color: var(--slate-600); }
.rewards-card__amount { font-size: 14px; font-weight: 700; color: var(--primary-600); }

.rewards-proofs {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.rewards-proofs__item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 14px;
  line-height: 1.55;
  color: var(--ink-800);
}
.rewards-proofs__item [class^="icon-"] { color: var(--primary-600); font-size: 18px; flex-shrink: 0; margin-top: 1px; }

@media (max-width: 1024px) {
  .rewards-section__content { grid-template-columns: 1fr; }
  .rewards-card { max-width: 360px; }
}
@media (max-width: 640px) {
  .rewards-section__top { flex-direction: column; align-items: flex-start; }
}

/* ============================================================
   SECURITY
   ============================================================ */
.security-section {
  background: var(--ink-950);
  padding-block: 100px;
}
.security-section__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 48px;
}
.security-section__inner .section-body { max-width: 560px; }

.security-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  width: 100%;
  max-width: 900px;
}
.security-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  text-align: center;
  background: #1A3538;
  border-radius: var(--radius-lg);
  padding: 32px;
  border: 1px solid #2A4548;
}
.security-card__icon {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: rgba(141,198,63,.12);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primary-400);
  font-size: 24px;
}
.security-card__title { font-size: 15px; font-weight: 600; color: var(--white); }
.security-card__desc { font-size: 14px; line-height: 1.6; color: var(--font-inv-muted); }

@media (max-width: 768px) {
  .security-cards { grid-template-columns: 1fr; max-width: 400px; }
}
@media (max-width: 640px) {
  .security-section { padding-block: 64px; }
}

/* ============================================================
   HOW IT WORKS
   ============================================================ */
.how-section {
  background: var(--white);
  padding-block: 112px;
}
.how-section__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 64px;
}

.how-steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  width: 100%;
}
.how-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  text-align: center;
}
.how-step__img-wrap {
  position: relative;
  width: 100%;
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.how-step__img {
  width: 100%;
  height: 320px;
  object-fit: cover;
  display: block;
}
.how-step__num {
  position: absolute;
  bottom: 12px;
  right: 12px;
  width: 40px;
  height: 40px;
  background: var(--primary-500);
  border-radius: var(--radius-full);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 700;
  color: var(--ink-950);
}
.how-step__title {
  font-family: var(--font-heading);
  font-size: 20px;
  font-weight: 700;
  color: var(--ink-950);
}
.how-step__desc { font-size: 14px; line-height: 1.6; color: var(--font-secondary); }

@media (max-width: 768px) {
  .how-steps { grid-template-columns: 1fr; max-width: 400px; }
}
@media (max-width: 640px) {
  .how-section { padding-block: 64px; }
}

/* ============================================================
   BUSINESS ENTRY
   ============================================================ */
.business-entry {
  background: var(--ink-950);
  padding-block: 64px;
  border-top: 1px solid var(--ink-700);
}
.business-entry__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  text-align: center;
}
.business-entry__eyebrow {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 2px;
  color: rgba(255,255,255,.33);
  text-transform: uppercase;
}
.business-entry__text { display: flex; flex-direction: column; gap: 6px; }
.business-entry__title {
  font-family: var(--font-heading);
  font-size: 28px;
  font-weight: 700;
  color: var(--white);
}
.business-entry__sub {
  font-size: 14px;
  line-height: 1.6;
  color: rgba(255,255,255,.6);
  max-width: 600px;
}

/* ============================================================
   FINAL CTA
   ============================================================ */
.final-cta {
  position: relative;
  background: var(--primary-500);
  min-height: 480px;
  display: flex;
  align-items: stretch;
}
.final-cta__overlay {
  width: 100%;
  background: rgba(141,198,63,.8);
  display: flex;
  align-items: center;
}
.final-cta__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  text-align: center;
  padding-block: 80px;
}
.final-cta__title {
  font-family: var(--font-heading);
  font-size: clamp(28px, 4vw, 44px);
  font-weight: 700;
  line-height: 1.15;
  color: var(--ink-950);
  max-width: 800px;
}
.final-cta__body {
  font-size: 17px;
  color: var(--ink-950);
  opacity: .75;
}
.final-cta__ctas {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  justify-content: center;
}

@media (max-width: 640px) {
  .final-cta__ctas { flex-direction: column; align-items: stretch; }
}

/* ============================================================
   FOOTER
   ============================================================ */
.footer {
  background: var(--ink-950);
  padding-block: 64px 40px;
}
.footer__inner { display: flex; flex-direction: column; gap: 48px; }
.footer__top {
  display: grid;
  grid-template-columns: 300px repeat(3, 1fr);
  gap: 40px;
}
.footer__brand { display: flex; flex-direction: column; gap: 12px; }
.footer__logo {
  font-family: var(--font-heading);
  font-size: 22px;
  font-weight: 700;
  color: var(--primary-500);
}
.footer__tagline { font-size: 14px; line-height: 1.5; color: var(--slate-400); max-width: 260px; }

.footer__col { display: flex; flex-direction: column; gap: 12px; }
.footer__col-title { font-size: 14px; font-weight: 600; color: #F0F5F5; }
.footer__link { font-size: 14px; color: var(--slate-400); transition: color .15s; }
.footer__link:hover { color: var(--white); }

.footer__divider { height: 1px; background: var(--ink-700); }
.footer__bottom { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.footer__copy,
.footer__reg { font-size: 13px; color: var(--slate-600); }

@media (max-width: 1024px) {
  .footer__top { grid-template-columns: 1fr 1fr; }
  .footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  .footer__top { grid-template-columns: 1fr 1fr; }
  .footer__bottom { flex-direction: column; align-items: flex-start; }
}

/* ============================================================
   ANIMATIONS — Scroll fade-up
   ============================================================ */
.will-animate {
  opacity: 0;
  transform: translateY(12px);
  transition:
    opacity   0.65s cubic-bezier(0.25, 0.46, 0.45, 0.94),
    transform 0.65s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition-delay: calc(var(--stagger, 0) * 60ms);
}
.will-animate.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* ── Hover lift ─────────────────────────────────────────────── */
.hover-lift {
  transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94),
              box-shadow 0.3s ease;
}
.hover-lift:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 32px rgba(0,0,0,.14);
}

/* ── 3D tilt cards ──────────────────────────────────────────── */
.hero__card {
  transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transform-style: preserve-3d;
  will-change: transform;
}
.card-visual__card {
  transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transform-style: preserve-3d;
  will-change: transform;
}

/* ── Hero photo parallax ────────────────────────────────────── */
.hero__photo {
  will-change: transform;
  transition: transform 0.1s linear;
}

/* ── Button micro-interactions ──────────────────────────────── */
.btn {
  transition: opacity .2s ease, transform .2s ease, background .2s ease;
}
.btn:hover  { transform: translateY(-1px); opacity: .92; }
.btn:active { transform: scale(.97); opacity: 1; }

/* ── Trust strip items on hover ─────────────────────────────── */
.trust-strip__item {
  transition: opacity 0.2s ease;
}
.trust-strip__item:hover { opacity: .75; }

/* ── Nav logo ───────────────────────────────────────────────── */
.nav__logo { transition: opacity .2s ease; }
.nav__logo:hover { opacity: .8; }

/* ── Send flow arrow — gentle fade pulse ────────────────────── */
.send-flow-card__arrow {
  animation: arrowPulse 2.4s ease-in-out infinite;
}
@keyframes arrowPulse {
  0%, 100% { opacity: .35; }
  50%       { opacity: .7;  }
}

/* ── Rewards points hover ───────────────────────────────────── */
.rewards-card__points {
  transition: transform 0.3s ease;
}
.rewards-card:hover .rewards-card__points {
  transform: scale(1.02);
}

/* ── Calculator result flash ────────────────────────────────── */
@keyframes resultFlash {
  0%   { opacity: 1; }
  30%  { opacity: .4; }
  100% { opacity: 1; }
}
.calc-result-flash {
  animation: resultFlash 0.35s ease;
}

/* ── How-step image scale on hover ──────────────────────────── */
.how-step__img-wrap .how-step__img {
  transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.how-step__img-wrap:hover .how-step__img {
  transform: scale(1.025);
}

/* ── Icon subtle lift on hover ──────────────────────────────── */
.security-card__icon,
.trans-card__icon,
.cards-feature__icon {
  transition: transform 0.3s ease;
}
.security-card:hover .security-card__icon,
.trans-card:hover .trans-card__icon,
.cards-feature:hover .cards-feature__icon {
  transform: translateY(-2px);
}

/* ============================================================
   ╔══════════════════════════════════════════════════════════╗
   ║   BUSINESS PAGE  —  scoped to body.theme--biz              ║
   ╚══════════════════════════════════════════════════════════╝
   ============================================================ */
.theme--biz {
  --biz-ink:         #142124;
  --biz-ink-card:    #1B2D31;
  --biz-ink-soft:    #20393D;
  --biz-ink-border:  #34544B;
  --biz-cream:       #F7FFF9;
  --biz-mint:        #F2FFEC;
  --biz-lime-700:    #315C12;
  --biz-lime-600:    #7ED93F;
  --biz-lime-500:    #C8F25F;
  --biz-lime-400:    #A8E070;
  --biz-lime-300:    #DFFF8A;
  --biz-lime-bright: #DFFF45;
  --biz-accent-soft: #E8FF7A;
  --biz-inv-muted:   #DDE7C7;
  --biz-inv-soft:    #AEB99B;
  --biz-slate-600:   #34544B;
  --biz-slate-700:   #45473F;
  --biz-border:      #CFE5B6;
  --biz-success:     #008F5A;
  --font-data:       'IBM Plex Mono', ui-monospace, monospace;
}
.theme--biz body, body.theme--biz {
  background: var(--biz-cream);
  color: var(--biz-ink);
}

/* ─── Nav override for business ─────────────────────────────── */
.nav--biz {
  background: var(--biz-cream);
  border-bottom: 1px solid transparent;
  transition: background .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.nav--biz.nav--scrolled {
  background: rgba(247,255,249,.92);
  backdrop-filter: blur(10px);
  border-bottom-color: rgba(20,33,36,.08);
  box-shadow: 0 4px 18px rgba(20,33,36,.06);
}
.theme--biz .nav__logo { color: var(--biz-ink); }
.theme--biz .nav__link { color: var(--biz-ink); font-weight: 500; }
.theme--biz .nav__link:hover { color: var(--biz-ink); background: rgba(20,33,36,.06); }
.theme--biz .nav__link--active { color: var(--biz-ink); background: rgba(20,33,36,.06); }
.theme--biz .nav__login { color: var(--biz-ink); font-weight: 500; }
.theme--biz .nav__hamburger { color: var(--biz-ink); }

/* Make .btn--lime obey .btn--sm sizing so the nav CTA matches
   .btn--primary.btn--sm on the personal page (prevents the
   layout shift when navigating between pages). */
.btn--lime.btn--sm {
  height: auto;
  padding: 10px 20px;
  font-size: 14px;
}

.btn--lime {
  background: var(--biz-lime-500);
  color: #000;
  border-radius: 999px;
  padding: 0 24px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 15px;
  transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
}
.btn--lime:hover { background: var(--biz-lime-400); transform: translateY(-1px); box-shadow: 0 8px 22px rgba(168,224,112,.35); }

.btn--ink {
  background: var(--biz-ink);
  color: var(--biz-lime-500);
  border-radius: 999px;
  padding: 0 28px;
  height: 54px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 15px;
  transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
}
.btn--ink:hover { background: #0B1517; transform: translateY(-1px); box-shadow: 0 12px 28px rgba(20,33,36,.32); }

.btn--white-ring {
  background: #fff;
  color: var(--biz-ink);
  border: 1px solid var(--biz-lime-400);
  border-radius: 999px;
  padding: 0 28px;
  height: 54px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  justify-content: center;
  font-weight: 700;
  font-size: 15px;
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.btn--white-ring:hover { border-color: var(--biz-lime-500); transform: translateY(-1px); box-shadow: 0 8px 22px rgba(168,224,112,.25); }

.btn--ghost-lime {
  background: transparent;
  color: var(--biz-lime-400);
  border: 1px solid var(--biz-lime-400);
  border-radius: 999px;
  padding: 0 28px;
  height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 15px;
  transition: background .25s ease, color .25s ease;
}
.btn--ghost-lime:hover { background: var(--biz-lime-400); color: var(--biz-ink); }

/* ─── Shared atoms ──────────────────────────────────────────── */
.biz-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0 16px;
  height: 34px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.01em;
}
.biz-badge--dark { background: var(--biz-ink); color: var(--biz-lime-500); }
.biz-badge__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--biz-lime-500); }

.biz-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0 14px;
  height: 28px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  background: var(--biz-mint);
  color: var(--biz-ink);
  white-space: nowrap;
}
.biz-pill--lime { background: var(--biz-lime-500); color: var(--biz-ink); }
.biz-pill--soft { background: var(--biz-accent-soft); color: var(--biz-ink); }
.biz-pill--green-deep { background: var(--biz-lime-700); color: var(--biz-inv-muted); height: 30px; }
.biz-pill__dot { width: 6px; height: 6px; border-radius: 50%; background: var(--biz-ink); }
.biz-pill__dot--lime { background: var(--biz-lime-500); }

.biz-eyebrow {
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.biz-eyebrow--dark-green { color: var(--biz-lime-700); }
.biz-eyebrow--lime { color: var(--biz-lime-400); }

.biz-h2 {
  font-family: var(--font-heading);
  font-size: clamp(30px, 4.2vw, 48px);
  font-weight: 700;
  line-height: 1.12;
  color: var(--biz-ink);
  letter-spacing: -0.01em;
}
.biz-h2--inverse { color: #fff; }

.biz-lead {
  font-size: 17px;
  line-height: 1.6;
  color: var(--biz-slate-600);
}
.biz-lead--inverse { color: var(--biz-inv-muted); }

.biz-support {
  font-size: 14px;
  line-height: 1.45;
  color: var(--biz-slate-700);
  font-weight: 500;
}

.biz-section-head {
  display: flex;
  flex-direction: column;
  gap: 16px;
  text-align: center;
  max-width: 820px;
  margin: 0 auto;
}
.biz-section-head__title {
  font-family: var(--font-heading);
  font-size: clamp(30px, 4.2vw, 48px);
  font-weight: 700;
  line-height: 1.12;
  color: var(--biz-ink);
  letter-spacing: -0.01em;
}
.biz-section-head__title--inverse { color: #fff; }
.biz-section-head__title--center { text-align: center; }
.biz-section-head__sub {
  font-size: 17px;
  line-height: 1.55;
  color: var(--biz-slate-600);
}
.biz-section-head__sub--inverse { color: var(--biz-inv-muted); }

.biz-points { display: flex; flex-direction: column; gap: 12px; }
.biz-point {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.45;
  color: var(--biz-ink);
}
.biz-point .lucide,
.biz-point i {
  font-size: 18px;
  color: var(--biz-lime-700);
  flex-shrink: 0;
  margin-top: 2px;
}

.biz-ctas { display: flex; flex-wrap: wrap; gap: 18px; }

/* ============================================================
   1) HERO
   ============================================================ */
.biz-hero {
  background: var(--biz-lime-500);
  padding: 92px 0 100px;
  overflow: hidden;
}
.biz-hero__inner {
  display: grid;
  grid-template-columns: minmax(0, 486px) minmax(0, 1fr);
  gap: 56px;
  align-items: center;
}
.biz-hero__copy { display: flex; flex-direction: column; gap: 24px; max-width: 486px; }
.biz-hero__title {
  font-family: var(--font-heading);
  font-size: clamp(36px, 4.8vw, 58px);
  font-weight: 700;
  line-height: 1.02;
  letter-spacing: -0.02em;
  color: var(--biz-ink);
}
.biz-hero__sub {
  font-size: 18px;
  line-height: 1.55;
  color: var(--biz-slate-600);
  font-weight: 500;
}
.biz-hero__ctas { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 4px; }
.biz-hero__note {
  font-size: 14px;
  color: var(--biz-slate-600);
  line-height: 1.45;
}

.biz-hero__visual {
  position: relative;
  background: linear-gradient(135deg, #1B2D31 0%, #142124 60%, #0B1517 100%);
  border: 1px solid var(--biz-border);
  border-radius: 32px;
  overflow: hidden;
  height: 500px;
  box-shadow: 0 22px 42px rgba(20,33,36,.18);
}
.biz-hero__visual-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 22px 28px;
  background: linear-gradient(180deg, rgba(20,33,36,.92), rgba(20,33,36,0));
}
.biz-hero__visual-title {
  color: #fff;
  font-size: 15px;
  font-weight: 600;
}
.biz-hero__panels {
  position: absolute;
  inset: 88px 28px 30px;
  display: grid;
  grid-template-columns: 286px 1fr;
  gap: 24px;
}

.biz-account-panel,
.biz-route-panel {
  background: #fff;
  border: 1px solid var(--biz-border);
  border-radius: 14px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  box-shadow: 0 12px 28px rgba(20,33,36,.18);
}
.biz-account-panel__label {
  font-size: 13px;
  font-weight: 600;
  color: var(--biz-slate-600);
}
.biz-account-panel__tabs { display: flex; gap: 8px; }
.biz-ccy-tab {
  height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  font-size: 12px;
  font-weight: 700;
  border: 1px solid var(--biz-border);
  background: #fff;
  color: var(--biz-ink);
}
.biz-ccy-tab--active { background: var(--biz-ink); color: #fff; border-color: var(--biz-ink); }

.biz-balance-box,
.biz-details-box {
  background: #fff;
  border: 1px solid var(--biz-border);
  border-radius: 10px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.biz-balance-box__label,
.biz-details-box__title {
  font-size: 12px;
  font-weight: 500;
  color: #6C6F61;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.biz-details-box__title { text-transform: none; letter-spacing: 0; font-weight: 600; color: var(--biz-ink); }
.biz-balance-box__value {
  font-family: var(--font-heading);
  font-size: 24px;
  font-weight: 700;
  color: var(--biz-ink);
}
.biz-balance-box__meta,
.biz-details-box__ok {
  font-size: 12px;
  color: var(--biz-slate-600);
}
.biz-details-box__mono {
  font-family: var(--font-data);
  font-size: 12px;
  color: var(--biz-slate-600);
}
.biz-details-box__ok { color: var(--biz-success); font-weight: 500; }

.biz-route-panel__head { display: flex; justify-content: space-between; align-items: center; }
.biz-route-panel__title { font-size: 13px; font-weight: 600; color: var(--biz-slate-600); }
.biz-route-panel__amount { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.biz-route-cell {
  background: var(--biz-cream);
  border-radius: 8px;
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.biz-route-cell__label { font-size: 11px; color: var(--biz-slate-600); text-transform: uppercase; letter-spacing: 0.04em; }
.biz-route-cell__val { font-family: var(--font-heading); font-size: 18px; font-weight: 700; color: var(--biz-ink); }
.biz-route-panel__timeline {
  background: var(--biz-cream);
  border-radius: 8px;
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.biz-route-step {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: var(--biz-ink);
  font-weight: 500;
}
.biz-route-step i { font-size: 14px; color: var(--biz-lime-700); }
.biz-route-panel__rails { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.biz-rail {
  height: 30px;
  border-radius: 8px;
  background: var(--biz-lime-500);
  color: var(--biz-ink);
  font-size: 12px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.biz-rail--dark { background: var(--biz-ink); color: #fff; }

/* Accounts / platform — WebP-first photography (<picture>) */
.biz-accounts__visual:has(> picture) {
  padding: 0;
  background: #0b1517;
}
.biz-accounts__visual:has(> picture) > picture {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: block;
  line-height: 0;
}
.biz-accounts__visual:has(> picture) picture .biz-visual-photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.biz-accounts__visual:has(> picture) .biz-accounts__overlay {
  z-index: 1;
}

.biz-platform__visual:has(> picture) > picture {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: block;
  line-height: 0;
}
.biz-platform__visual:has(> picture) picture .biz-visual-photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.biz-platform__visual:has(> picture) .biz-platform__glow {
  z-index: 1;
}
.biz-platform__visual:has(> picture) .biz-api-panel,
.biz-platform__visual:has(> picture) .biz-arch {
  position: relative;
  z-index: 1;
}

.biz-modules__image:has(> picture) {
  padding: 0;
}
.biz-modules__image:has(> picture)::before {
  display: none;
}
.biz-modules__image:has(> picture) > picture {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: block;
  line-height: 0;
}
.biz-modules__image picture .biz-modules__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.biz-modules__image:has(> picture) .biz-modules__image-label {
  position: relative;
  z-index: 1;
  margin: 18px;
  align-self: flex-end;
}

.biz-closing__image:has(> picture) {
  background: none;
  padding: 0;
  position: relative;
}
.biz-closing__image:has(> picture) > picture {
  position: absolute;
  inset: 0;
  display: block;
  line-height: 0;
}
.biz-closing__image picture .biz-closing__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.biz-closing__image:has(> picture) .biz-closing__image-label {
  position: relative;
  z-index: 2;
  margin: 18px;
  align-self: flex-end;
}
.biz-closing__image:has(> picture)::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, rgba(20,33,36,0) 35%, rgba(20,33,36,.45) 100%);
  pointer-events: none;
}

/* Industry tiles — WebP inside picture */
.biz-tile__visual picture {
  position: absolute;
  inset: 0;
  display: block;
  line-height: 0;
}
.biz-tile__visual picture .biz-tile__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

/* ============================================================
   2) PROOF STRIP
   ============================================================ */
.biz-proof {
  background: var(--biz-ink);
  padding: 56px 0;
}
.biz-proof__inner {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
}
.biz-proof__card {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--biz-lime-400);
  border-radius: 12px;
  padding: 18px;
  color: var(--biz-ink);
  font-weight: 700;
  font-size: 14px;
  line-height: 1.25;
  transition: transform .35s ease, box-shadow .35s ease, background .35s ease;
}
.biz-proof__card i { font-size: 22px; flex-shrink: 0; }
.biz-proof__card:hover {
  background: var(--biz-lime-300);
  transform: translateY(-2px);
  box-shadow: 0 12px 24px rgba(168,224,112,.25);
}

/* ============================================================
   3) NUMBERS
   ============================================================ */
.biz-numbers {
  background: var(--biz-cream);
  padding: 84px 0;
}
.biz-numbers__inner {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 24px;
}
.biz-metric { display: flex; flex-direction: column; gap: 10px; }
.biz-metric__value {
  font-family: var(--font-heading);
  font-size: clamp(48px, 6vw, 80px);
  font-weight: 700;
  line-height: 1;
  color: var(--biz-ink);
  letter-spacing: -0.02em;
}
.biz-metric__label {
  font-size: 15px;
  line-height: 1.4;
  color: var(--biz-slate-600);
  font-weight: 500;
}

/* ============================================================
   4) CORE CAPABILITIES
   ============================================================ */
.biz-cap { background: #fff; padding: 100px 0; }
.biz-cap__inner { display: flex; flex-direction: column; gap: 52px; }
.biz-cap__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.biz-cap-card {
  border-radius: 16px;
  border: 2px solid var(--biz-border);
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
.biz-cap-card:hover {
  transform: translateY(-4px);
  border-color: var(--biz-lime-400);
  box-shadow: 0 18px 36px rgba(20,33,36,.08);
}
.biz-cap-card--cream  { background: var(--biz-cream); }
.biz-cap-card--accent { background: var(--biz-accent-soft); }
.biz-cap-card--bright { background: var(--biz-lime-500); }

.biz-cap-card__icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: var(--biz-accent-soft);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--biz-ink);
}
.biz-cap-card__icon i { font-size: 22px; }
.biz-cap-card--accent .biz-cap-card__icon { background: var(--biz-lime-500); }
.biz-cap-card--bright .biz-cap-card__icon { background: var(--biz-accent-soft); }

.biz-cap-card__title {
  font-family: var(--font-heading);
  font-size: 24px;
  font-weight: 700;
  line-height: 1.18;
  color: var(--biz-ink);
}
.biz-cap-card__copy {
  font-size: 15px;
  line-height: 1.55;
  color: var(--biz-slate-600);
}
.biz-cap-card__mini {
  background: #fff;
  border: 1px solid var(--biz-border);
  border-radius: 12px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 132px;
}
.biz-cap-card__mini--platform {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: repeat(3, 1fr);
  gap: 6px 12px;
  align-items: center;
}
.biz-cap-card__mini--platform .biz-node:nth-child(1) { grid-row: 2; align-self: center; }
.biz-cap-card__mini--platform .biz-node:nth-child(2) { grid-row: 1; }
.biz-cap-card__mini--platform .biz-node:nth-child(3) { grid-row: 2; }
.biz-cap-card__mini--platform .biz-node:nth-child(4) { grid-row: 3; }
.biz-node {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 14px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
}
.biz-node--dark { background: var(--biz-ink); color: #fff; }
.biz-node--surface { background: var(--biz-lime-500); color: var(--biz-ink); }
.biz-node--accent { background: var(--biz-accent-soft); color: var(--biz-ink); }

.biz-mini-tabs { display: flex; gap: 6px; }
.biz-mini-tab {
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  border: 1px solid var(--biz-border);
  background: #fff;
}
.biz-mini-tab--active { background: var(--biz-ink); color: #fff; border-color: var(--biz-ink); }
.biz-mini-line {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 42px;
  padding: 0 18px;
  background: var(--biz-cream);
  border-radius: 10px;
  font-size: 13px;
}
.biz-mini-line__mono { font-family: var(--font-data); color: var(--biz-slate-600); }
.biz-mini-row {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  font-weight: 500;
  color: var(--biz-ink);
}
.biz-mini-row i { font-size: 14px; color: var(--biz-lime-700); }

.biz-cap-card__link {
  font-size: 15px;
  font-weight: 600;
  color: var(--biz-ink);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: auto;
  transition: gap .25s ease;
}
.biz-cap-card__link:hover { gap: 12px; }
.biz-cap-card__link i { font-size: 16px; }

/* ============================================================
   5) MULTI-CURRENCY ACCOUNTS (split)
   ============================================================ */
.biz-accounts { background: var(--biz-cream); padding: 100px 0; }
.biz-accounts__inner {
  display: grid;
  grid-template-columns: minmax(0, 620px) minmax(0, 520px);
  gap: 64px;
  align-items: center;
}
.biz-accounts__visual {
  position: relative;
  height: 586px;
  border-radius: 28px;
  background: linear-gradient(135deg, #DFFF8A 0%, #C8F25F 60%, #A8E070 100%);
  overflow: hidden;
  border: 1px solid var(--biz-border);
  box-shadow: 0 18px 42px rgba(20,33,36,.15);
}
.biz-accounts__overlay {
  position: absolute;
  left: 28px;
  bottom: 28px;
  width: 278px;
  background: rgba(247,255,249,.94);
  backdrop-filter: blur(12px);
  border: 1px solid var(--biz-border);
  border-radius: 18px;
  padding: 18px;
  display: flex;
  flex-direction: column;
  gap: 11px;
  box-shadow: 0 14px 30px rgba(20,33,36,.18);
}
.biz-accounts__overlay-top { display: flex; align-items: center; justify-content: space-between; }
.biz-accounts__overlay-title { font-size: 12px; font-weight: 700; color: var(--biz-lime-700); letter-spacing: 0.02em; }
.biz-accounts__route { font-family: var(--font-heading); font-size: 26px; font-weight: 700; color: var(--biz-ink); }
.biz-accounts__cells { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.biz-accounts__cell {
  background: #fff;
  border-radius: 10px;
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.biz-accounts__cell-label { font-size: 10px; color: var(--biz-slate-600); text-transform: uppercase; letter-spacing: 0.04em; }
.biz-accounts__cell-val { font-family: var(--font-heading); font-weight: 700; color: var(--biz-ink); font-size: 14px; }
.biz-accounts__chips { display: flex; gap: 6px; }
.biz-chip {
  background: #E6F7D2;
  color: var(--biz-ink);
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
}

.biz-accounts__copy { display: flex; flex-direction: column; gap: 20px; }

/* ============================================================
   6) PAYMENTS
   ============================================================ */
.biz-payments {
  background: var(--biz-ink);
  padding: 100px 0;
}
.biz-payments__inner { display: flex; flex-direction: column; gap: 48px; }
.biz-payments__body {
  display: grid;
  grid-template-columns: minmax(0, 720px) minmax(0, 1fr);
  gap: 40px;
}
.biz-settlement {
  background: #fff;
  border: 1px solid var(--biz-border);
  border-radius: 24px;
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  box-shadow: 0 22px 46px rgba(0,0,0,.28);
}
.biz-settlement__head { display: flex; justify-content: space-between; align-items: center; }
.biz-settlement__title { font-family: var(--font-heading); font-size: 22px; font-weight: 700; color: var(--biz-ink); }
.biz-settlement__inputs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.biz-settlement__input {
  background: #fff;
  border: 1px solid var(--biz-border);
  border-radius: 12px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: 86px;
}
.biz-settlement__label { font-size: 12px; color: var(--biz-slate-600); text-transform: uppercase; letter-spacing: 0.04em; font-weight: 500; }
.biz-settlement__value { font-family: var(--font-heading); font-weight: 700; color: var(--biz-ink); font-size: 17px; }
.biz-settlement__result { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.biz-settlement__rcard {
  background: #fff;
  border: 1px solid var(--biz-border);
  border-radius: 12px;
  padding: 18px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  justify-content: center;
}
.biz-settlement__rcard--ink { background: var(--biz-ink); border-color: var(--biz-ink); }
.biz-settlement__rcard--ink .biz-settlement__rcard-label,
.biz-settlement__rcard--ink .biz-settlement__rcard-val { color: #fff; }
.biz-settlement__rcard-label { font-size: 12px; color: var(--biz-slate-600); }
.biz-settlement__rcard-val { font-family: var(--font-heading); font-weight: 700; font-size: 20px; color: var(--biz-ink); }

.biz-modules { display: flex; flex-direction: column; gap: 14px; }
.biz-modules__image {
  background: linear-gradient(135deg, #1B2D31, #142124 60%, #0B1517);
  border: 1px solid var(--biz-ink-border);
  border-radius: 18px;
  height: 220px;
  padding: 18px;
  display: flex;
  align-items: flex-end;
  position: relative;
  overflow: hidden;
}
.biz-modules__image::before {
  content: '';
  position: absolute;
  top: -40%;
  right: -10%;
  width: 280px;
  height: 280px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(200,242,95,.30), rgba(200,242,95,0) 70%);
}
.biz-modules__image-label {
  display: inline-flex;
  align-items: center;
  height: 36px;
  padding: 0 18px;
  background: var(--biz-ink);
  color: var(--biz-lime-500);
  border-radius: 999px;
  border: 1px solid var(--biz-ink-border);
  font-size: 13px;
  font-weight: 700;
}
.biz-module {
  display: flex;
  align-items: center;
  gap: 14px;
  background: var(--biz-cream);
  border-radius: 12px;
  padding: 16px 18px;
  color: var(--biz-ink);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.3;
  transition: transform .3s ease, background .3s ease;
}
.biz-module i { font-size: 18px; color: var(--biz-ink); flex-shrink: 0; }
.biz-module:hover { transform: translateX(4px); background: var(--biz-lime-300); }

/* ============================================================
   7) PLATFORM
   ============================================================ */
.biz-platform {
  background: var(--biz-ink);
  padding: 100px 0;
}
.biz-platform__inner {
  display: grid;
  grid-template-columns: minmax(0, 478px) minmax(0, 1fr);
  gap: 64px;
  align-items: center;
}
.biz-platform__copy { display: flex; flex-direction: column; gap: 20px; }
.biz-enable { display: flex; flex-direction: column; gap: 12px; }
.biz-enable li {
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  padding: 12px 16px;
  background: var(--biz-ink-card);
  border-radius: 10px;
  border: 1px solid var(--biz-ink-border);
}

.biz-platform__visual {
  position: relative;
  background: linear-gradient(135deg, #0B1517 0%, #142124 50%, #1B2D31 100%);
  border: 1px solid var(--biz-ink-border);
  border-radius: 28px;
  height: 500px;
  overflow: hidden;
  padding: 34px;
  display: grid;
  grid-template-columns: 312px 1fr;
  gap: 24px;
  align-items: center;
}
.biz-platform__glow {
  position: absolute;
  top: 66px;
  right: 30px;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(200,242,95,.30), rgba(200,242,95,0) 70%);
  filter: blur(8px);
}
.biz-api-panel {
  background: #0D0D0D;
  border: 1px solid var(--biz-ink-border);
  border-radius: 14px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  height: 432px;
  position: relative;
  z-index: 1;
}
.biz-api-panel__title { font-size: 12px; font-weight: 600; color: var(--biz-inv-muted); }
.biz-api-panel__line { font-family: var(--font-data); font-size: 16px; font-weight: 600; color: #fff; }
.biz-api-panel__key { font-family: var(--font-data); font-size: 13px; font-weight: 500; color: var(--biz-lime-300); }
.biz-api-panel__block {
  background: #111;
  border-radius: 10px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.biz-api-panel__block code {
  font-family: var(--font-data);
  font-size: 12px;
  color: var(--biz-inv-muted);
  line-height: 1.4;
}

.biz-arch {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.biz-arch__node {
  height: 54px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  padding: 0 18px;
  border: 1px solid var(--biz-ink-border);
  transition: transform .3s ease;
}
.biz-arch__node:hover { transform: translateX(4px); }
.biz-arch__node--primary { background: var(--biz-lime-500); color: var(--biz-ink); border-color: var(--biz-lime-500); }
.biz-arch__node--elevated { background: #151515; color: #fff; }
.biz-arch__node--muted { background: var(--biz-ink-card); color: var(--biz-inv-muted); }

/* ============================================================
   8) OPERATIONAL MODEL
   ============================================================ */
.biz-ops { background: var(--biz-mint); padding: 100px 0; }
.biz-ops__inner { display: flex; flex-direction: column; gap: 52px; }
.biz-ops__steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.biz-step {
  background: #fff;
  border: 2px solid var(--biz-border);
  border-radius: 16px;
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-height: 290px;
  transition: transform .35s ease, border-color .35s ease, box-shadow .35s ease;
}
.biz-step:hover {
  transform: translateY(-4px);
  border-color: var(--biz-lime-400);
  box-shadow: 0 18px 36px rgba(168,224,112,.18);
}
.biz-step__num {
  font-family: var(--font-data);
  font-size: 14px;
  font-weight: 600;
  color: var(--biz-lime-700);
}
.biz-step__title {
  font-family: var(--font-heading);
  font-size: 26px;
  font-weight: 700;
  color: var(--biz-ink);
  line-height: 1.15;
}
.biz-step__copy {
  font-size: 15px;
  line-height: 1.55;
  color: var(--biz-slate-600);
}
.biz-step__visual {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: auto;
}
.biz-step__visual--col { grid-template-columns: 1fr; }
.biz-step__bar {
  height: 46px;
  border-radius: 10px;
  background: var(--biz-cream);
  border: 1px solid var(--biz-border);
  position: relative;
  overflow: hidden;
}
.biz-step__bar::before {
  content: '';
  position: absolute;
  inset: 6px 12px;
  background: linear-gradient(90deg, var(--biz-lime-400), var(--biz-lime-500));
  border-radius: 6px;
  width: 65%;
}
.biz-step__bar--accent { background: var(--biz-accent-soft); border-color: var(--biz-lime-400); }
.biz-step__bar--accent::before { width: 90%; }
.biz-step__line {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 34px;
  padding: 0 14px;
  background: var(--biz-cream);
  border-radius: 8px;
  font-size: 12px;
  font-weight: 700;
  color: var(--biz-lime-700);
}
.biz-step__line--accent { background: var(--biz-accent-soft); }
.biz-step__mono { font-family: var(--font-data); color: var(--biz-ink); }

/* ============================================================
   9) GOVERNANCE
   ============================================================ */
.biz-gov { background: var(--biz-ink); padding: 100px 0; }
.biz-gov__inner { display: flex; flex-direction: column; gap: 52px; }
.biz-gov__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.biz-gov-card {
  background: var(--biz-ink-card);
  border: 1px solid var(--biz-ink-border);
  border-radius: 16px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-height: 260px;
  transition: transform .35s ease, border-color .35s ease;
}
.biz-gov-card:hover {
  transform: translateY(-4px);
  border-color: var(--biz-lime-400);
}
.biz-gov-card__icon { font-size: 28px; color: var(--biz-lime-300); }
.biz-gov-card__title {
  font-family: var(--font-heading);
  font-size: 21px;
  font-weight: 700;
  color: #fff;
  line-height: 1.18;
}
.biz-gov-card__copy {
  font-size: 15px;
  line-height: 1.5;
  color: var(--biz-inv-muted);
}
.biz-gov-card__rail {
  background: var(--biz-ink);
  border: 1px solid var(--biz-ink-border);
  border-radius: 10px;
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: auto;
}
.biz-gov-card__rail-row {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: var(--biz-inv-muted);
}
.biz-gov-card__bar {
  height: 5px;
  background: #20393D;
  border-radius: 999px;
  overflow: hidden;
}
.biz-gov-card__bar span {
  display: block;
  height: 100%;
  background: var(--biz-lime-300);
  border-radius: 999px;
  transition: width 1.2s cubic-bezier(.2,.7,.3,1);
}

/* ============================================================
   10) INDUSTRIES
   ============================================================ */
.biz-industries { background: var(--biz-ink); padding: 100px 0; }
.biz-industries__inner { display: flex; flex-direction: column; gap: 52px; }
.biz-industries__grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
}
.biz-tile {
  background: var(--biz-lime-bright);
  border-radius: 24px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-height: 414px;
  transition: transform .4s ease, box-shadow .4s ease;
}
.biz-tile:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 38px rgba(223,255,69,.32);
}
.biz-tile__visual {
  height: 238px;
  display: block;
  position: relative;
  overflow: hidden;
  background: #142124;
}
.biz-tile__visual::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, rgba(20,33,36,.12) 0%, rgba(20,33,36,.38) 100%);
  pointer-events: none;
}
.biz-tile__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  z-index: 0;
}
.biz-tile__body {
  padding: 22px;
  display: flex;
  flex-direction: column;
  gap: 13px;
  flex: 1;
}
.biz-tile__title {
  font-family: var(--font-heading);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.12;
  color: var(--biz-ink);
}
.biz-tile__copy {
  font-size: 14px;
  line-height: 1.38;
  color: var(--biz-lime-700);
  font-weight: 500;
}

/* ============================================================
   11) DIFFERENTIATION
   ============================================================ */
.biz-diff { background: var(--biz-lime-500); padding: 100px 0; }
.biz-diff__inner { display: flex; flex-direction: column; gap: 52px; }
.biz-diff__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.biz-diff-card {
  background: #fff;
  border: 2px solid var(--biz-border);
  border-radius: 16px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 13px;
  min-height: 280px;
  transition: transform .35s ease, border-color .35s ease, box-shadow .35s ease;
}
.biz-diff-card:hover {
  transform: translateY(-4px);
  border-color: var(--biz-lime-400);
  box-shadow: 0 18px 36px rgba(20,33,36,.08);
}
.biz-diff-card__title {
  font-family: var(--font-heading);
  font-size: 22px;
  font-weight: 700;
  line-height: 1.15;
  color: var(--biz-ink);
}
.biz-diff-card__copy {
  font-size: 15px;
  line-height: 1.5;
  color: var(--biz-ink);
}
.biz-diff-card__outcome {
  background: var(--biz-ink);
  color: var(--biz-lime-500);
  font-size: 13px;
  font-weight: 600;
  padding: 14px 16px;
  border-radius: 12px;
  line-height: 1.35;
}
.biz-diff-card__rail {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-top: auto;
}
.biz-diff-signal {
  background: var(--biz-mint);
  border-radius: 8px;
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 11px;
  font-weight: 700;
  color: var(--biz-ink);
}
.biz-diff-signal__bar {
  display: block;
  height: 4px;
  width: 100%;
  background: var(--biz-lime-400);
  border-radius: 999px;
}

/* ============================================================
   12) FAQ
   ============================================================ */
.biz-faq { background: #fff; padding: 100px 0; }
.biz-faq__inner {
  max-width: 920px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 34px;
}
.biz-faq__list { display: flex; flex-direction: column; gap: 10px; }
.biz-faq-row {
  background: var(--biz-cream);
  border: 1px solid var(--biz-border);
  border-radius: 12px;
  overflow: hidden;
  transition: background .3s ease, border-color .3s ease;
}
.biz-faq-row[open] {
  background: #fff;
  border-color: var(--biz-lime-400);
  box-shadow: 0 8px 22px rgba(20,33,36,.06);
}
.biz-faq-row summary {
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 22px 32px;
  cursor: pointer;
  font-size: 17px;
  font-weight: 600;
  color: var(--biz-ink);
  line-height: 1.25;
  user-select: none;
}
.biz-faq-row summary::-webkit-details-marker { display: none; }
.biz-faq-row__icon {
  font-size: 18px;
  color: var(--biz-ink);
  flex-shrink: 0;
  margin-left: 16px;
  transition: transform .3s ease;
}
.biz-faq-row[open] .biz-faq-row__icon { transform: rotate(45deg); }
.biz-faq-row p {
  padding: 0 32px 24px;
  font-size: 15px;
  line-height: 1.6;
  color: var(--biz-slate-600);
  animation: bizFaqIn .35s ease;
}
@keyframes bizFaqIn {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ============================================================
   13) CLOSING CTA
   ============================================================ */
.biz-closing { background: var(--biz-mint); padding: 100px 0; }
.biz-closing__inner {
  display: grid;
  grid-template-columns: minmax(0, 600px) minmax(0, 520px);
  gap: 64px;
  align-items: center;
}
.biz-closing__copy { display: flex; flex-direction: column; gap: 22px; }

.biz-closing__panel {
  background: #fff;
  border: 1px solid var(--biz-border);
  border-radius: 24px;
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.biz-closing__image {
  position: relative;
  height: 210px;
  border-radius: 16px;
  background:
    linear-gradient(180deg, rgba(20,33,36,0) 30%, rgba(20,33,36,.35) 100%),
    linear-gradient(135deg, #DFFF8A 0%, #C8F25F 60%, #1B2D31 100%);
  overflow: hidden;
  display: flex;
  align-items: flex-end;
  padding: 18px;
}
.biz-closing__image-label {
  display: inline-flex;
  align-items: center;
  height: 36px;
  padding: 0 16px;
  background: var(--biz-ink);
  color: var(--biz-lime-500);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.02em;
}
.biz-closing__points {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 4px;
}
.biz-closing__points li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.45;
  color: var(--biz-ink);
}
.biz-closing__points i {
  font-size: 18px;
  color: var(--biz-lime-700);
  flex-shrink: 0;
  margin-top: 2px;
}

/* ============================================================
   14) FOOTER
   ============================================================ */
.biz-footer { background: var(--biz-ink); padding: 84px 0 40px; }
.biz-footer__inner {
  display: grid;
  grid-template-columns: minmax(0, 360px) minmax(0, 1fr);
  gap: 80px;
  align-items: flex-start;
}
.biz-footer__brand { display: flex; flex-direction: column; gap: 16px; }
.biz-footer__name { font-family: var(--font-heading); font-size: 26px; font-weight: 700; color: #fff; }
.biz-footer__tag { font-size: 14px; line-height: 1.55; color: var(--biz-inv-muted); }
.biz-footer__nav {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 56px;
}
.biz-footer__col { display: flex; flex-direction: column; gap: 12px; }
.biz-footer__col-title { font-size: 13px; font-weight: 700; color: #fff; letter-spacing: 0.02em; }
.biz-footer__col a {
  font-size: 14px;
  color: var(--biz-inv-muted);
  transition: color .25s ease;
}
.biz-footer__col a:hover { color: var(--biz-lime-300); }

.biz-copy { background: var(--biz-ink); border-top: 1px solid var(--biz-ink-border); padding: 24px 0; }
.biz-copy__inner { display: flex; justify-content: space-between; align-items: center; }
.biz-copy__line { font-size: 13px; color: var(--biz-inv-muted); font-weight: 500; }
.biz-copy__links { display: flex; gap: 24px; }
.biz-copy__links a {
  font-size: 13px;
  color: var(--biz-inv-muted);
  font-weight: 600;
  transition: color .25s ease;
}
.biz-copy__links a:hover { color: var(--biz-lime-300); }

/* ============================================================
   RESPONSIVE  —  BUSINESS PAGE
   ============================================================ */
@media (max-width: 1100px) {
  .biz-hero__inner,
  .biz-accounts__inner,
  .biz-platform__inner,
  .biz-closing__inner { grid-template-columns: 1fr; gap: 48px; }
  .biz-payments__body { grid-template-columns: 1fr; }
  .biz-hero__visual { height: 460px; }
  .biz-platform__visual { height: auto; padding: 28px; grid-template-columns: 1fr; }
  .biz-platform__visual:has(> picture) {
    min-height: 360px;
  }
  .biz-api-panel { height: auto; }
  .biz-arch { flex-direction: row; flex-wrap: wrap; }
  .biz-arch__node { flex: 1 1 calc(50% - 6px); }
  .biz-industries__grid { grid-template-columns: repeat(3, 1fr); }
  .biz-proof__inner { grid-template-columns: repeat(3, 1fr); }
  .biz-numbers__inner { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 820px) {
  .biz-hero { padding: 64px 0 72px; }
  .biz-hero__visual { height: auto; }
  .biz-hero__panels {
    position: static;
    inset: auto;
    padding: 0 20px 24px;
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .biz-cap__grid,
  .biz-ops__steps,
  .biz-gov__grid,
  .biz-diff__grid { grid-template-columns: 1fr; }
  .biz-settlement__inputs { grid-template-columns: 1fr; }
  .biz-industries__grid { grid-template-columns: repeat(2, 1fr); }
  .biz-proof__inner { grid-template-columns: repeat(2, 1fr); }
  .biz-numbers__inner { grid-template-columns: repeat(2, 1fr); }
  .biz-footer__inner { grid-template-columns: 1fr; gap: 48px; }
  .biz-footer__nav { gap: 32px; }
  .biz-copy__inner { flex-direction: column; gap: 12px; text-align: center; }
  .biz-cap, .biz-accounts, .biz-payments, .biz-platform,
  .biz-ops, .biz-gov, .biz-industries, .biz-diff, .biz-faq,
  .biz-closing, .biz-numbers { padding: 72px 0; }
  .biz-proof { padding: 48px 0; }
  .biz-faq-row summary { padding: 18px 22px; font-size: 16px; }
  .biz-faq-row p { padding: 0 22px 20px; }
}

@media (max-width: 540px) {
  .biz-industries__grid { grid-template-columns: 1fr; }
  .biz-proof__inner { grid-template-columns: 1fr; }
  .biz-numbers__inner { grid-template-columns: 1fr; gap: 32px; }
  .biz-footer__nav { grid-template-columns: 1fr 1fr; }
  .biz-hero__title { font-size: clamp(32px, 8vw, 44px); }
  .btn--ink, .btn--white-ring { width: 100%; }
  .biz-hero__ctas, .biz-ctas { width: 100%; flex-direction: column; }
}

/* ============================================================
   REVEAL — BUSINESS (subtle fade-up)
   ============================================================ */
.biz-reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .8s cubic-bezier(.2,.7,.3,1), transform .8s cubic-bezier(.2,.7,.3,1);
  transition-delay: calc(var(--stagger, 0) * 80ms);
  will-change: opacity, transform;
}
.biz-reveal.is-visible {
  opacity: 1;
  transform: none;
}

/* ============================================================
   REDUCED MOTION
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    transition: none !important;
    animation: none !important;
  }
  .will-animate { opacity: 1; transform: none; }
  .biz-reveal { opacity: 1; transform: none; }
}

/* ============================================================
   ╔══════════════════════════════════════════════════════════╗
   ║   COMPANY PAGE  —  scoped to body.theme--co               ║
   ║   Reuses theme--biz tokens; adds only Company atoms       ║
   ╚══════════════════════════════════════════════════════════╝
   ============================================================ */

/* 1. HERO ─────────────────────────────────────────────────── */
.co-hero {
  background: var(--biz-lime-500);
  padding: 92px 0 100px;
  overflow: hidden;
}
.co-hero__inner {
  display: grid;
  grid-template-columns: minmax(0, 620px) minmax(0, 576px);
  gap: 56px;
  align-items: center;
}
.co-hero__copy { display: flex; flex-direction: column; gap: 24px; }
.co-hero__title {
  font-family: var(--font-heading);
  font-size: clamp(36px, 5vw, 64px);
  font-weight: 700;
  line-height: 0.98;
  letter-spacing: -0.02em;
  color: #050505;
}
.co-hero__sub {
  font-size: 19px;
  line-height: 1.45;
  color: var(--biz-lime-700);
  font-weight: 500;
  max-width: 560px;
}

.co-hero__visual {
  position: relative;
  height: 592px;
}
.co-hero__photo {
  position: absolute;
  inset: 0;
  border-radius: 34px;
  background:
    radial-gradient(ellipse at 30% 20%, rgba(200,242,95,.45) 0%, rgba(200,242,95,0) 50%),
    linear-gradient(135deg, #1B2D31 0%, #142124 60%, #0B1517 100%);
  overflow: hidden;
  box-shadow: 0 22px 42px rgba(20,33,36,.22);
}
.co-hero__photo-glow {
  position: absolute;
  top: 40%;
  right: -10%;
  width: 320px;
  height: 320px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(200,242,95,.32), rgba(200,242,95,0) 70%);
  filter: blur(8px);
}
.co-hero__corridor {
  position: absolute;
  top: 34px;
  left: 44px;
  width: 272px;
  background: var(--biz-cream);
  border-radius: 18px;
  padding: 22px 24px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  box-shadow: 0 14px 30px rgba(0,0,0,.32);
}
.co-hero__corridor-label {
  font-size: 12px;
  font-weight: 800;
  color: var(--biz-lime-700);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.co-hero__corridor-pair {
  font-family: var(--font-heading);
  font-size: 28px;
  font-weight: 700;
  color: #050505;
  letter-spacing: -0.01em;
}
.co-hero__corridor-divider { height: 1px; background: var(--biz-border); }
.co-hero__corridor-status {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  font-size: 13px;
  line-height: 1.3;
  color: var(--biz-slate-600);
  font-weight: 500;
}
.co-hero__corridor-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--biz-lime-500);
  flex-shrink: 0;
  margin-top: 6px;
  box-shadow: 0 0 0 0 rgba(168,224,112,.5);
  animation: coPulse 2.2s ease-out infinite;
}
@keyframes coPulse {
  0%   { box-shadow: 0 0 0 0 rgba(168,224,112,.55); }
  70%  { box-shadow: 0 0 0 10px rgba(168,224,112,0); }
  100% { box-shadow: 0 0 0 0 rgba(168,224,112,0); }
}

.co-hero__note {
  position: absolute;
  bottom: 36px;
  right: 24px;
  width: 75%;
  max-width: 460px;
  background: var(--biz-ink);
  border-radius: 22px;
  padding: 22px 26px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  box-shadow: 0 14px 28px rgba(0,0,0,.28);
}
.co-hero__note-title {
  color: #fff;
  font-family: var(--font-heading);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.25;
}
.co-hero__note-meta {
  color: var(--biz-inv-muted);
  font-size: 13px;
  line-height: 1.4;
}

/* 2. TRUST STRIP ─────────────────────────────────────────── */
.co-trust {
  background: var(--biz-ink);
  padding: 72px 0;
}
.co-trust__inner { display: flex; flex-direction: column; gap: 40px; }
.co-trust__title {
  font-family: var(--font-heading);
  font-size: clamp(28px, 3.5vw, 44px);
  font-weight: 700;
  line-height: 1.05;
  color: var(--biz-cream);
  text-align: center;
}
.co-trust__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  padding-top: 32px;
  border-top: 1px solid var(--biz-ink-border);
}
.co-trust__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  padding: 16px;
  text-align: center;
  color: var(--biz-cream);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
  transition: transform .35s ease;
}
.co-trust__item:nth-child(1) { color: var(--biz-lime-500); }
.co-trust__item i {
  font-size: 28px;
  color: var(--biz-lime-300);
}
.co-trust__item:nth-child(1) i { color: var(--biz-lime-500); }
.co-trust__item:hover { transform: translateY(-3px); }

/* 3. NUMBERS + PLATFORM MINI ─────────────────────────────── */
.co-numbers { background: var(--biz-cream); padding: 100px 0; }
.co-numbers__inner { display: flex; flex-direction: column; gap: 52px; }
.co-numbers__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}
.co-metric {
  background: #fff;
  border: 1px solid var(--biz-border);
  border-radius: 22px;
  padding: 24px 26px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 118px;
  transition: transform .3s ease, box-shadow .3s ease;
}
.co-metric:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 28px rgba(20,33,36,.08);
}
.co-metric__value {
  font-family: var(--font-heading);
  font-size: clamp(36px, 4vw, 50px);
  font-weight: 700;
  line-height: 1;
  color: var(--biz-ink);
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
.co-metric__label {
  font-size: 14px;
  font-weight: 500;
  color: var(--biz-slate-600);
  line-height: 1.4;
}
.co-metric--platform {
  background: var(--biz-ink);
  border-color: var(--biz-ink-border);
  justify-content: space-between;
}
.co-metric__pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  align-self: flex-start;
  padding: 4px 12px;
  border-radius: 999px;
  background: rgba(200,242,95,.14);
  color: var(--biz-lime-300);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.co-metric__pill-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--biz-lime-500);
  animation: coPulse 2.2s ease-out infinite;
}
.co-metric__platform-label {
  font-family: var(--font-heading);
  font-size: 22px;
  font-weight: 700;
  color: #fff;
  letter-spacing: -0.01em;
}
.co-metric__platform-meta { font-size: 12px; color: var(--biz-inv-muted); font-weight: 500; }

/* 4. WHY ENACT EXISTS ────────────────────────────────────── */
.co-story { background: #FFF7D7; padding: 100px 0; }
.co-story__inner {
  display: grid;
  grid-template-columns: minmax(0, 540px) minmax(0, 1fr);
  gap: 80px;
  align-items: start;
}
.co-story__visual { position: relative; }
.co-story__photo {
  width: 100%;
  aspect-ratio: 540 / 618;
  border-radius: 34px;
  background:
    linear-gradient(160deg, rgba(20,33,36,.15) 0%, rgba(20,33,36,.55) 100%),
    radial-gradient(circle at 70% 30%, var(--biz-lime-500), transparent 55%),
    linear-gradient(135deg, #6E4B22 0%, #45473F 50%, #142124 100%);
  box-shadow: 0 22px 42px rgba(20,33,36,.18);
}
.co-story__copy {
  display: flex;
  flex-direction: column;
  gap: 22px;
}
.co-story__copy .biz-h2 {
  font-size: clamp(32px, 4.4vw, 56px);
  line-height: 1.02;
  letter-spacing: -0.02em;
}
.co-story__quote {
  background: var(--biz-ink);
  border-radius: 22px;
  padding: 28px 32px;
  margin: 8px 0 0;
  position: relative;
  overflow: hidden;
}
.co-story__quote::before {
  content: '"';
  position: absolute;
  top: -28px;
  left: 18px;
  font-family: var(--font-heading);
  font-size: 140px;
  color: rgba(200,242,95,.18);
  line-height: 1;
  font-weight: 700;
  pointer-events: none;
}
.co-story__quote p {
  position: relative;
  font-family: var(--font-heading);
  font-size: 19px;
  font-weight: 600;
  line-height: 1.4;
  color: #fff;
}

/* 5. VISUAL BRIDGE ───────────────────────────────────────── */
.co-bridge { background: var(--biz-cream); padding: 100px 0; }
.co-bridge__inner { display: flex; flex-direction: column; gap: 52px; }
.co-bridge__layout {
  display: grid;
  grid-template-columns: 1fr 1.1fr 1fr;
  gap: 24px;
  align-items: center;
}
.co-bridge__side {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}
.co-bridge__image {
  width: 100%;
  aspect-ratio: 374 / 220;
  border-radius: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
}
.co-bridge__image i {
  position: relative;
  z-index: 1;
  font-size: 56px;
  color: #fff;
  filter: drop-shadow(0 2px 12px rgba(0,0,0,.4));
}
.co-bridge__image--personal {
  background:
    linear-gradient(180deg, rgba(20,33,36,.05) 0%, rgba(20,33,36,.35) 100%),
    linear-gradient(135deg, #C8F25F 0%, #7ED93F 100%);
}
.co-bridge__image--business {
  background:
    linear-gradient(180deg, rgba(20,33,36,.1) 0%, rgba(20,33,36,.5) 100%),
    linear-gradient(135deg, #2A4F5A 0%, #142124 100%);
}
.co-bridge__label {
  height: 42px;
  padding: 0 22px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.02em;
}
.co-bridge__label--lime { background: var(--biz-lime-500); color: var(--biz-ink); }
.co-bridge__label--dark { background: var(--biz-ink); color: #fff; }

.co-bridge__center {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
.co-bridge__rail {
  position: absolute;
  top: 50%;
  left: -8%;
  right: -8%;
  height: 2px;
  pointer-events: none;
  transform: translateY(-50%);
  z-index: 0;
}
.co-bridge__rail-line {
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(90deg, var(--biz-lime-400) 0 8px, transparent 8px 14px);
  opacity: 0.5;
}
.co-bridge__pulse {
  position: absolute;
  top: 50%;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--biz-lime-500);
  transform: translate(-50%, -50%);
  box-shadow: 0 0 12px var(--biz-lime-500);
}
.co-bridge__pulse--left  { animation: coRailLR 3.6s ease-in-out infinite; }
.co-bridge__pulse--right { animation: coRailRL 3.6s ease-in-out infinite; animation-delay: 1.8s; }
@keyframes coRailLR {
  0%   { left: 0%; opacity: 0; }
  10%  { opacity: 1; }
  90%  { opacity: 1; }
  100% { left: 100%; opacity: 0; }
}
@keyframes coRailRL {
  0%   { left: 100%; opacity: 0; }
  10%  { opacity: 1; }
  90%  { opacity: 1; }
  100% { left: 0%; opacity: 0; }
}

.co-bridge__widget {
  position: relative;
  z-index: 1;
  background: var(--biz-ink);
  border: 1px solid var(--biz-ink-border);
  border-radius: 22px;
  padding: 22px 26px;
  width: 100%;
  max-width: 380px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  box-shadow: 0 18px 36px rgba(20,33,36,.18);
}
.co-bridge__widget-title {
  font-family: var(--font-heading);
  font-size: 14px;
  font-weight: 800;
  color: var(--biz-lime-300);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.co-bridge__widget-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 12px;
  background: var(--biz-ink-card);
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  color: #fff;
}
.co-bridge__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--biz-lime-500);
  animation: coPulse 2.4s ease-out infinite;
}
.co-bridge__widget-row:nth-child(3) .co-bridge__dot { animation-delay: .6s; }
.co-bridge__widget-row:nth-child(4) .co-bridge__dot { animation-delay: 1.2s; }

/* 6. ROUTES ──────────────────────────────────────────────── */
.co-routes { background: var(--biz-cream); padding: 100px 0; }
.co-routes__inner { display: flex; flex-direction: column; gap: 56px; }
.co-routes__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
.co-route {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 36px;
  border-radius: 30px;
  text-decoration: none;
  min-height: 456px;
  transition: transform .4s cubic-bezier(.2,.7,.3,1), box-shadow .4s ease;
  overflow: hidden;
}
.co-route:hover { transform: translateY(-6px); }
.co-route:focus-visible {
  outline: 3px solid var(--biz-lime-700);
  outline-offset: 4px;
}
.co-route--personal {
  background: linear-gradient(135deg, #DFFF45 0%, #C8F25F 100%);
  color: var(--biz-ink);
}
.co-route--personal:hover { box-shadow: 0 20px 40px rgba(200,242,95,.4); }
.co-route--business {
  background: linear-gradient(135deg, #1B2D31 0%, #0B1517 100%);
}
.co-route--business:hover { box-shadow: 0 20px 40px rgba(0,0,0,.4); }
.co-route__eyebrow {
  font-size: 13px;
  font-weight: 800;
  color: var(--biz-lime-700);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.co-route__eyebrow--inverse { color: var(--biz-lime-400); }
.co-route__title {
  font-family: var(--font-heading);
  font-size: 30px;
  font-weight: 700;
  line-height: 1.1;
  color: var(--biz-ink);
  letter-spacing: -0.01em;
}
.co-route__title--inverse { color: #fff; }
.co-route__copy {
  font-size: 16px;
  line-height: 1.55;
  color: var(--biz-lime-700);
  font-weight: 500;
}
.co-route__copy--inverse { color: var(--biz-inv-muted); }
.co-route__visual {
  display: flex;
  gap: 10px;
  margin-top: auto;
}
.co-route__chip {
  background: rgba(20,33,36,.1);
  color: var(--biz-ink);
  padding: 10px 18px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 700;
}
.co-route__visual--inverse {
  flex-direction: column;
  background: rgba(0,0,0,.3);
  border-radius: 14px;
  padding: 16px 18px;
  gap: 6px;
}
.co-route__visual--inverse code {
  font-family: var(--font-data);
  font-size: 14px;
  color: var(--biz-lime-300);
}
.co-route__visual--inverse code:nth-child(2) { color: var(--biz-inv-muted); }
.co-route__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 800;
  color: var(--biz-ink);
  letter-spacing: 0.02em;
  transition: gap .25s ease;
}
.co-route__link--inverse { color: var(--biz-lime-300); }
.co-route:hover .co-route__link { gap: 14px; }

/* 7. VISION & MISSION ────────────────────────────────────── */
.co-pillars { background: var(--biz-ink); padding: 100px 0; }
.co-pillars__inner { display: flex; flex-direction: column; gap: 52px; }
.co-pillars__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
.co-pillar {
  padding: 40px;
  border-radius: 30px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  min-height: 330px;
  transition: transform .4s cubic-bezier(.2,.7,.3,1);
}
.co-pillar:hover { transform: translateY(-4px); }
.co-pillar--vision {
  background: #1B2A2D;
  border: 1px solid var(--biz-ink-border);
}
.co-pillar--mission {
  background: var(--biz-lime-500);
}
.co-pillar__eyebrow {
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--biz-lime-700);
}
.co-pillar__eyebrow--lime { color: var(--biz-lime-300); }
.co-pillar__title {
  font-family: var(--font-heading);
  font-size: 26px;
  font-weight: 700;
  line-height: 1.18;
  color: #fff;
  letter-spacing: -0.01em;
}
.co-pillar__title--dark { color: var(--biz-ink); }
.co-pillar__copy {
  font-size: 16px;
  line-height: 1.55;
  color: var(--biz-inv-muted);
  margin-top: auto;
}
.co-pillar__copy--dark { color: var(--biz-ink); opacity: .85; }

/* 8. TRUST & GOVERNANCE ──────────────────────────────────── */
.co-gov { background: var(--biz-mint); padding: 100px 0; position: relative; }
.co-gov__inner { display: flex; flex-direction: column; gap: 40px; }
.co-gov__status {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
  gap: 14px 28px;
  margin: 0 auto;
  max-width: 740px;
  padding: 18px 26px;
  background: #fff;
  border: 1px solid var(--biz-border);
  border-radius: 999px;
  box-shadow: 0 12px 28px rgba(20,33,36,.06);
}
.co-gov__status-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 16px;
  border-radius: 999px;
  background: var(--biz-lime-500);
  color: var(--biz-lime-700);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.co-gov__status-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--biz-lime-700);
  animation: coPulse 2.4s ease-out infinite;
}
.co-gov__status-row {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 600;
  color: var(--biz-ink);
}
.co-gov__status-row i { font-size: 16px; color: var(--biz-lime-700); }

.co-gov__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.co-gov-card {
  background: var(--biz-ink);
  border-radius: 22px;
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-height: 250px;
  transition: transform .35s ease;
}
.co-gov-card:hover { transform: translateY(-4px); }
.co-gov-card__icon { font-size: 28px; color: var(--biz-lime-300); }
.co-gov-card__title {
  font-family: var(--font-heading);
  font-size: 21px;
  font-weight: 700;
  line-height: 1.18;
  color: #fff;
}
.co-gov-card__copy {
  font-size: 15px;
  line-height: 1.5;
  color: var(--biz-inv-muted);
  margin-top: auto;
}

/* 9. VALUES ──────────────────────────────────────────────── */
.co-values { background: var(--biz-cream); padding: 100px 0; }
.co-values__inner { display: flex; flex-direction: column; gap: 52px; }
.co-values__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
}
.co-value {
  background: #fff;
  border: 1px solid var(--biz-border);
  border-radius: 22px;
  padding: 28px;
  display: flex;
  gap: 22px;
  align-items: flex-start;
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.co-value:hover {
  transform: translateY(-3px);
  border-color: var(--biz-lime-400);
  box-shadow: 0 14px 28px rgba(20,33,36,.06);
}
.co-value__icon {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  background: var(--biz-lime-500);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: transform .35s ease;
}
.co-value__icon i { font-size: 22px; color: var(--biz-ink); }
.co-value:hover .co-value__icon { transform: rotate(-4deg) scale(1.05); }
.co-value__body { display: flex; flex-direction: column; gap: 6px; }
.co-value__title {
  font-family: var(--font-heading);
  font-size: 22px;
  font-weight: 700;
  color: var(--biz-ink);
  line-height: 1.2;
}
.co-value__copy {
  font-size: 15px;
  line-height: 1.5;
  color: var(--biz-slate-600);
}

/* 10. CLOSING CTA ────────────────────────────────────────── */
.co-closing {
  background: var(--biz-lime-500);
  padding: 100px 0;
  text-align: center;
}
.co-closing__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 22px;
  max-width: 900px;
  margin: 0 auto;
}
.co-closing__title {
  font-family: var(--font-heading);
  font-size: clamp(32px, 4.4vw, 50px);
  font-weight: 700;
  line-height: 1.04;
  color: var(--biz-ink);
  letter-spacing: -0.02em;
}
.co-closing__sub {
  font-size: 18px;
  line-height: 1.45;
  color: var(--biz-lime-700);
  font-weight: 500;
  max-width: 680px;
}
.co-closing__ctas { justify-content: center; margin-top: 8px; }

/* ─── RESPONSIVE ─────────────────────────────────────────── */
@media (max-width: 1100px) {
  .co-hero__inner { grid-template-columns: 1fr; gap: 48px; }
  .co-hero__visual { height: 460px; }
  .co-story__inner { grid-template-columns: 1fr; gap: 48px; }
  .co-bridge__layout { grid-template-columns: 1fr 1fr; }
  .co-bridge__center { grid-column: 1 / -1; order: 3; }
  .co-bridge__rail { display: none; }
  .co-numbers__grid { grid-template-columns: repeat(2, 1fr); }
  .co-trust__grid { grid-template-columns: repeat(2, 1fr); }
  .co-gov__grid { grid-template-columns: 1fr; }
  .co-pillars__grid { grid-template-columns: 1fr; }
  .co-routes__grid { grid-template-columns: 1fr; }
}

@media (max-width: 820px) {
  .co-hero { padding: 64px 0 72px; }
  .co-hero__corridor,
  .co-hero__note { display: none; }
  .co-hero__visual { height: 280px; }
  .co-values__grid { grid-template-columns: 1fr; }
  .co-bridge__layout { grid-template-columns: 1fr; }
  .co-bridge__side { flex-direction: row; justify-content: flex-start; gap: 18px; }
  .co-bridge__image { width: 120px; flex-shrink: 0; aspect-ratio: 1; }
  .co-bridge__center { order: 0; }
  .co-bridge__widget { max-width: none; }
  .co-numbers, .co-story, .co-bridge, .co-routes, .co-pillars,
  .co-gov, .co-values, .co-closing { padding: 72px 0; }
  .co-trust { padding: 56px 0; }
  .co-trust__grid { padding-top: 24px; }
  .co-route { padding: 28px; min-height: auto; }
  .co-route__title { font-size: 24px; }
  .co-pillar { padding: 28px; min-height: auto; }
  .co-gov__status { padding: 14px 18px; gap: 10px 18px; }
  .co-gov__status-row { font-size: 13px; }
  .co-story__quote::before { font-size: 90px; top: -12px; }
}

@media (max-width: 540px) {
  .co-trust__grid,
  .co-numbers__grid { grid-template-columns: 1fr; }
  .co-closing__ctas { width: 100%; flex-direction: column; }
  .co-closing__ctas .btn { width: 100%; }
  .co-bridge__side { flex-direction: column; align-items: stretch; }
  .co-bridge__image { width: 100%; aspect-ratio: 16/9; }
  .co-value { flex-direction: column; gap: 14px; }
}