/* =========================================================
   Address.co — Pride Partner Program
   Design tokens, shared styles & responsive layout
   ========================================================= */

:root {
  --paper: #ffffff;
  --canvas: #f6f3ec;
  --canvas-2: #efebe2;
  --ink: #0a1734;
  --ink-2: #2e3a5c;
  --ink-3: #5a6485;
  --muted: #8a92ab;
  --line: #e4e2da;
  --line-soft: #efede5;

  --primary: #000ff0;
  --primary-deep: #0009b8;
  --primary-ink: #00078a;
  --primary-soft: #e4e7ff;
  --primary-100: #d7dcff;

  --accent: #e25c3f;
  --accent-soft: #fbe6df;
  --success: #1f8a5b;
  --success-soft: #dcf0e5;
  --gold: #c8973f;
  --gold-soft: #f4e8cb;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}

body {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif;
  color: var(--ink);
  background: var(--paper);
}

/* =========================================================
   HEADER
   ========================================================= */
.lp-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: #fff;
  border-bottom: 1px solid var(--line);
  padding: 18px 0;
}
.lp-header.on-ink {
  background: var(--ink);
  border-bottom-color: rgba(255,255,255,0.08);
}
.lp-header-inner {
  max-width: 1360px;
  margin: 0 auto;
  padding: 0 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.lp-logo {
  display: inline-flex;
  align-items: center;
  height: 44px;
}
.lp-logo img {
  height: 100%;
  width: auto;
  display: block;
}
.header-cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 22px;
  background: var(--primary);
  color: #fff;
  border-radius: 999px;
  font-weight: 700;
  font-size: 15px;
  text-decoration: none;
  letter-spacing: -0.005em;
  white-space: nowrap;
}
.header-cta:hover { background: var(--primary-deep); }

/* =========================================================
   SECTIONS
   ========================================================= */
.lp-section {
  position: relative;
  overflow: hidden;
  padding: 140px 0;
  background: var(--paper);
  color: var(--ink);
}
.lp-section.compact { padding: 110px 0; }
.lp-section.tight   { padding: 90px 0; }
.lp-section.hero    { padding: 120px 0 140px; }
.lp-section.cta     { padding: 160px 0; }

.lp-container {
  max-width: 1360px;
  margin: 0 auto;
  padding: 0 64px;
  position: relative;
}

.lp-section-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 60px;
  margin-bottom: 72px;
}

.s-cream { background: var(--canvas); color: var(--ink); }
.s-paper { background: var(--paper); color: var(--ink); }
.s-ink   { background: var(--ink);   color: #eaedf7; }
.s-blue  { background: var(--primary); color: #fff; }

/* =========================================================
   DECORATION
   ========================================================= */
.deco-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(to right,  rgba(10,23,52,0.04) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(10,23,52,0.04) 1px, transparent 1px);
  background-size: 80px 80px;
  pointer-events: none;
}
.s-ink .deco-grid {
  background-image:
    linear-gradient(to right,  rgba(255,255,255,0.04) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,0.04) 1px, transparent 1px);
}
.dotgrid {
  background-image: radial-gradient(rgba(10,23,52,0.18) 1.4px, transparent 1.4px);
  background-size: 20px 20px;
}
.divider {
  height: 1px;
  background: var(--line);
  width: 100%;
}
.s-ink .divider { background: rgba(255,255,255,0.12); }

/* =========================================================
   TYPOGRAPHY
   ========================================================= */
.eyebrow {
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--primary);
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
}
.eyebrow.on-dark { color: #9db4ff; }
.eyebrow::before {
  content: "";
  width: 34px;
  height: 1.5px;
  background: currentColor;
  display: inline-block;
}
.eyebrow.no-line::before { display: none; }

h1.slide-title {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 84px;
  line-height: 0.98;
  letter-spacing: -0.035em;
  font-weight: 700;
  margin: 0;
  color: var(--ink);
  text-wrap: balance;
}
h1.slide-title em {
  font-family: "Instrument Serif", serif;
  font-style: italic;
  font-weight: 400;
  color: var(--primary);
}
.s-ink h1.slide-title,
.s-blue h1.slide-title { color: #fff; }
.s-ink h1.slide-title em { color: #9db4ff; }
.s-blue h1.slide-title em { color: #f1e4c4; }

h1.hero-title {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 132px;
  line-height: 0.92;
  letter-spacing: -0.04em;
  font-weight: 700;
  margin: 0;
  color: #fff;
  max-width: 1300px;
  text-wrap: balance;
}
h1.hero-title em {
  font-family: "Instrument Serif", serif;
  font-style: italic;
  font-weight: 400;
  color: #9db4ff;
}

h2.section-h {
  font-size: 48px;
  line-height: 1.05;
  letter-spacing: -0.02em;
  font-weight: 700;
  margin: 0;
}

.kicker {
  font-size: 22px;
  line-height: 1.45;
  color: var(--ink-3);
  font-weight: 400;
  max-width: 900px;
}
.s-ink .kicker { color: #a8b2d1; }

.lead  { font-size: 26px; line-height: 1.4; color: var(--ink-2); font-weight: 400; }
.small { font-size: 17px; line-height: 1.5; color: var(--ink-3); }
.s-ink .lead { color: #c2c9e0; }

.quote {
  font-family: "Instrument Serif", serif;
  font-style: italic;
  font-weight: 400;
  font-size: 96px;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--ink);
}
.s-ink .quote { color: #fff; }

.stat-num {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-weight: 700;
  font-size: 240px;
  line-height: 0.85;
  letter-spacing: -0.06em;
  color: var(--primary);
}
.stat-num .sub { font-size: 0.4em; letter-spacing: -0.02em; }

.serif-italic {
  font-family: "Instrument Serif", serif;
  font-style: italic;
}

/* =========================================================
   CARDS, CHIPS, TAGS
   ========================================================= */
.card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 36px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.card.tight { padding: 28px; gap: 10px; }
.card .h { font-size: 24px; font-weight: 700; line-height: 1.2; letter-spacing: -0.01em; }
.card .p { font-size: 17px; line-height: 1.5; color: var(--ink-3); }
.card--ink {
  background: var(--ink);
  border-color: var(--ink);
  color: #fff;
}
.card--ink .h { color: #fff; }
.card--ink .p { color: #a8b2d1; }

.icon-tile {
  width: 56px;
  height: 56px;
  border-radius: 14px;
  background: var(--primary-soft);
  color: var(--primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.icon-tile.lg    { width: 72px; height: 72px; border-radius: 18px; }
.icon-tile.coral   { background: var(--accent-soft);   color: var(--accent); }
.icon-tile.success { background: var(--success-soft);  color: var(--success); }
.icon-tile.gold    { background: var(--gold-soft);      color: var(--gold); }
.icon-tile.ink     { background: #e4e7f3; color: var(--ink); }
.icon-tile--on-ink { background: rgba(255,255,255,0.1); color: #9db4ff; }
.icon-tile--on-blue { background: rgba(255,255,255,0.18); color: #fff; }

.chip {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 20px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 18px;
  font-weight: 500;
  color: var(--ink);
}
.chip.solid { background: var(--ink);         color: #fff; border-color: var(--ink); }
.chip.blue  { background: var(--primary-soft); color: var(--primary-ink); border-color: transparent; }
.chip.coral { background: var(--accent-soft);  color: #913221; border-color: transparent; }
.chip--on-ink {
  background: rgba(255,255,255,0.06);
  border-color: rgba(255,255,255,0.12);
  color: #fff;
}

.tag {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border-radius: 999px;
  background: rgba(21,84,240,0.08);
  color: var(--primary-ink);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.02em;
}
.s-ink .tag { background: rgba(255,255,255,0.1); color: #fff; }
.tag--on-ink { background: rgba(255,255,255,0.1); color: #fff; font-size: 11px; }
.tag--priority { background: rgba(255,255,255,0.18); color: #fff; font-size: 11px; }

/* =========================================================
   BUTTONS / LINKS
   ========================================================= */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 18px 30px;
  border-radius: 999px;
  font-weight: 700;
  font-size: 18px;
  text-decoration: none;
  cursor: pointer;
  border: none;
}
.btn--primary {
  background: var(--primary);
  color: #fff;
}
.btn--primary:hover { background: var(--primary-deep); }
.btn--ghost {
  background: rgba(255,255,255,0.08);
  color: #fff;
  border: 1px solid rgba(255,255,255,0.18);
}
.btn--ghost:hover { background: rgba(255,255,255,0.14); }
.btn--sm {
  font-size: 17px;
  padding: 16px 26px;
  gap: 10px;
}

/* =========================================================
   CHECKLIST
   ========================================================= */
.checklist {
  display: flex;
  flex-direction: column;
  gap: 18px;
  list-style: none;
  padding: 0;
  margin: 0;
}
.checklist li {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  font-size: 22px;
  line-height: 1.4;
  color: var(--ink);
  font-weight: 500;
}
.check-ico {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--primary);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 4px;
}
.check-ico--on-blue { background: #fff; color: var(--primary); }
.s-ink .checklist li { color: #eaedf7; }

/* =========================================================
   MAP MARKERS
   ========================================================= */
.pin-dot {
  width: 14px; height: 14px;
  border-radius: 50%;
  background: var(--primary);
  position: absolute;
  box-shadow: 0 0 0 6px rgba(21,84,240,0.18), 0 0 0 14px rgba(21,84,240,0.08);
}
.pin-dot.gold {
  background: var(--gold);
  box-shadow: 0 0 0 6px rgba(200,151,63,0.22), 0 0 0 14px rgba(200,151,63,0.08);
}

/* =========================================================
   HERO SECTION
   ========================================================= */
.hero-tags {
  display: flex;
  gap: 14px;
  margin-bottom: 48px;
  flex-wrap: wrap;
}
.hero-tag { font-size: 13px; }

.hero-subtitle {
  margin-top: 48px;
  max-width: 780px;
  font-size: 24px;
  line-height: 1.5;
  color: #a8b2d1;
}
.hero-subtitle em {
  font-family: "Instrument Serif", serif;
  color: #fff;
}

.hero-cta-row {
  margin-top: 56px;
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

/* Promise strip */
.promise-strip {
  margin-top: 120px;
  padding-top: 48px;
  border-top: 1px solid rgba(255,255,255,0.12);
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 40px;
}
.promise-item { }
.promise-label {
  font-family: "Instrument Serif", serif;
  font-style: italic;
  font-size: 44px;
  line-height: 1.1;
  color: #fff;
  letter-spacing: -0.02em;
  margin-top: 20px;
}
.promise-desc {
  margin-top: 8px;
  color: rgba(255,255,255,0.6);
  font-size: 17px;
  line-height: 1.5;
}

/* =========================================================
   SECTION NUMBERS (large decorative numerals)
   ========================================================= */
.section-num {
  font-family: "Instrument Serif", serif;
  font-style: italic;
  font-size: 120px;
  line-height: 0.9;
  color: var(--primary);
  letter-spacing: -0.04em;
  flex-shrink: 0;
}
.section-num--on-ink { color: #9db4ff; }

/* =========================================================
   SECTION HEAD CONSTRAINT
   ========================================================= */
.section-head-text { max-width: 880px; }

/* =========================================================
   PROBLEM SECTION — belief banner
   ========================================================= */
.kicker--wide { max-width: 1000px; margin-bottom: 48px; font-size: 22px; }
.kicker--xl   { max-width: 1100px; margin-bottom: 56px; font-size: 22px; }

.belief-banner {
  margin-top: 48px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 32px 40px;
  display: flex;
  align-items: center;
  gap: 28px;
}
.belief-banner-body { flex: 1; }
.belief-label {
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--primary);
  font-size: 13px;
}
.belief-text {
  font-size: 24px;
  font-weight: 700;
  margin-top: 6px;
  line-height: 1.3;
  color: var(--ink);
}

/* =========================================================
   PROBLEM / WHAT-IS — card grids
   ========================================================= */
.grid-4 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}
.grid-5 {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 18px;
}
.grid-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  align-items: stretch;
}
.grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
}
.grid-2-chips {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

/* =========================================================
   LEAD ROUTING CARD (Pillar 1 visual)
   ========================================================= */
.two-col-lead {
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: 72px;
  align-items: start;
}
.kicker--lead {
  font-size: 24px;
  color: var(--ink-2);
  margin-bottom: 36px;
}

.routing-card-wrap { position: relative; }
.routing-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 28px;
  padding: 36px;
  position: relative;
  overflow: hidden;
}
.routing-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.routing-card-title-label {
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--primary);
  font-size: 13px;
}
.routing-card-title { font-size: 22px; font-weight: 700; margin-top: 6px; }
.routing-card-time  { font-size: 13px; color: var(--ink-3); font-weight: 600; }
.routing-order-label {
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--ink-2);
  font-size: 12px;
  margin-bottom: 14px;
}
.routing-list { display: flex; flex-direction: column; gap: 10px; }

.routing-row {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 18px;
  border-radius: 14px;
}
.routing-row--priority {
  background: var(--primary);
  color: #fff;
  box-shadow: 0 8px 24px -10px rgba(0,15,240,0.45);
}
.routing-row--standard-1 { background: var(--canvas); opacity: 0.7; }
.routing-row--standard-2 { background: var(--canvas); opacity: 0.5; }

.routing-num {
  width: 32px; height: 32px;
  border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: 14px;
  flex-shrink: 0;
}
.routing-num--priority { background: rgba(255,255,255,0.18); }
.routing-num--standard { background: var(--paper); color: var(--ink-3); }
.routing-row-body { flex: 1; }
.routing-row-name   { font-weight: 700; font-size: 17px; }
.routing-row-name--dark   { color: var(--ink); }
.routing-row-detail { font-size: 13px; }
.routing-row-detail--muted { color: var(--ink-3); }
.routing-row-detail--faded { opacity: 0.85; }
.routing-badge { font-size: 12px; font-weight: 600; color: var(--ink-3); letter-spacing: 0.1em; text-transform: uppercase; }

.routing-callout {
  position: absolute;
  right: -16px;
  bottom: -24px;
  background: var(--ink);
  color: #fff;
  padding: 18px 22px;
  border-radius: 18px;
  max-width: 260px;
  box-shadow: 0 24px 60px -20px rgba(10,23,52,0.4);
}
.routing-callout-label {
  font-size: 13px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 700;
  color: #9db4ff;
}
.routing-callout-text {
  font-size: 18px;
  font-weight: 600;
  line-height: 1.3;
  margin-top: 4px;
}

/* =========================================================
   FASTER CLOSURES (Pillar 2)
   ========================================================= */
.two-col-closures {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 80px;
  align-items: start;
}
.stat-num--first {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-weight: 700;
  font-size: 200px;
  line-height: 0.85;
  letter-spacing: -0.06em;
  color: var(--ink);
}
.stat-num--first .stat-suffix { color: var(--primary); font-weight: 500; }
.stat-desc {
  font-size: 28px;
  line-height: 1.3;
  max-width: 600px;
  margin-top: 16px;
  color: var(--ink-2);
}
.stat-desc em { font-family: "Instrument Serif", serif; color: var(--primary); }
.chip-grid {
  margin-top: 40px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
  max-width: 560px;
}

.pipeline-panel {
  background: var(--canvas);
  border-radius: 24px;
  padding: 36px;
}
.pipeline-label {
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--ink-2);
  font-size: 12px;
  margin-bottom: 18px;
}
.pipeline-list { display: flex; flex-direction: column; gap: 14px; }
.pipeline-item {
  background: var(--paper);
  border-radius: 14px;
  padding: 18px 20px;
  display: flex;
  align-items: center;
  gap: 16px;
}
.pipeline-item--active { border: 1.5px solid var(--primary); }
.pipeline-icon {
  width: 42px; height: 42px;
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.pipeline-icon--success { background: var(--success-soft); color: var(--success); }
.pipeline-icon--primary { background: var(--primary-soft); color: var(--primary); }
.pipeline-icon--gold    { background: var(--gold-soft);    color: var(--gold); }
.pipeline-item-body { flex: 1; }
.pipeline-item-name   { font-weight: 700; font-size: 17px; }
.pipeline-item-meta   { font-size: 13px; color: var(--ink-3); }
.pipeline-item-amount { font-weight: 700; font-size: 17px; color: var(--success); }
.pipeline-total-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.pipeline-total-label { font-weight: 600; color: var(--ink-2); font-size: 17px; }
.pipeline-total-num {
  font-size: 30px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--ink);
}
.pipeline-total-arrow { font-size: 0.55em; color: var(--success); }

/* =========================================================
   PILLARS 3 & 4 — Partner card / dark card
   ========================================================= */
.pillar-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 28px;
  padding: 44px;
}
.pillar-card--ink {
  background: var(--ink);
  color: #fff;
  border: none;
  position: relative;
  overflow: hidden;
}
.pillar-card-header {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 24px;
}
.pillar-card-label {
  font-size: 13px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--primary);
}
.pillar-card-label--on-ink { color: #9db4ff; }
.pillar-card-title {
  font-size: 30px;
  font-weight: 700;
  letter-spacing: -0.015em;
}
.pillar-card-title--on-ink { color: #fff; }
.pillar-card-body { font-size: 18px; line-height: 1.5; color: var(--ink-3); margin-bottom: 28px; }
.pillar-card-body--on-ink { color: #a8b2d1; }
.pillar-card-quote {
  font-size: 17px;
  color: var(--ink-2);
  font-style: italic;
  font-family: "Instrument Serif", serif;
}
.pillar-card-footer--on-ink {
  font-size: 18px;
  color: #c2c9e0;
  line-height: 1.5;
  position: relative;
}
.pillar-deco {
  position: absolute;
  right: -100px; top: -100px;
  width: 320px; height: 320px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(0,15,240,0.45), transparent 70%);
  pointer-events: none;
}
.pillar-inner { position: relative; }

.checklist--plain {
  list-style: none;
  padding: 0; margin: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.checklist--plain li {
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 18px;
  color: var(--ink);
  font-weight: 500;
}
.checklist--plain-on-ink li { color: #fff; }

/* =========================================================
   RENEWALS & COLLECTIONS
   ========================================================= */
.teams-section-label {
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ink-2);
  margin-bottom: 18px;
  font-size: 13px;
}
.support-list {
  list-style: none; padding: 0; margin: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.support-list li {
  display: flex;
  gap: 12px;
  align-items: center;
  font-size: 17px;
}
.support-list .check-ico { width: 26px; height: 26px; flex-shrink: 0; }
.support-list li:last-child { grid-column: span 2; }

.payoff-card {
  background: var(--ink);
  color: #fff;
  border-radius: 28px;
  padding: 44px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  position: relative;
  overflow: hidden;
}
.payoff-deco {
  position: absolute;
  right: -100px; bottom: -100px;
  width: 340px; height: 340px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(31,138,91,0.4), transparent 70%);
  pointer-events: none;
}
.payoff-inner { position: relative; }
.payoff-title-label { letter-spacing: 0.16em; text-transform: uppercase; font-weight: 700; color: #9db4ff; font-size: 13px; }
.payoff-title { font-size: 32px; font-weight: 700; line-height: 1.2; margin-top: 8px; }
.payoff-items { position: relative; display: flex; flex-direction: column; gap: 14px; }
.payoff-item {
  display: flex;
  align-items: center;
  gap: 14px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 14px;
  padding: 18px 20px;
}
.payoff-item-icon {
  width: 36px; height: 36px;
  border-radius: 10px;
  background: rgba(31,138,91,0.25);
  color: #5bd79a;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.payoff-item-text { font-size: 17px; font-weight: 500; color: #eaedf7; }
.payoff-footnote {
  position: relative;
  border-top: 1px solid rgba(255,255,255,0.12);
  padding-top: 20px;
  font-size: 17px;
  color: #c2c9e0;
  font-style: italic;
  font-family: "Instrument Serif", serif;
}

/* =========================================================
   WHY DIFFERENT — comparison
   ========================================================= */
.comparison-grid {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 48px;
  align-items: stretch;
}
.comparison-col--diy {
  background: rgba(226,92,63,0.12);
  border: 1px solid rgba(226,92,63,0.25);
  border-radius: 28px;
  padding: 44px;
}
.comparison-col--us {
  background: var(--primary);
  border-radius: 28px;
  padding: 44px;
  position: relative;
  overflow: hidden;
}
.comparison-header { display: flex; align-items: center; gap: 14px; margin-bottom: 28px; }
.comparison-super { font-size: 13px; letter-spacing: 0.18em; text-transform: uppercase; font-weight: 700; }
.comparison-super--diy { color: #ffb29d; }
.comparison-super--us  { color: rgba(255,255,255,0.85); }
.comparison-title { font-size: 26px; font-weight: 700; letter-spacing: -0.01em; color: #fff; }
.comparison-desc  { margin-bottom: 18px; }
.comparison-desc--diy { color: #c2c9e0; font-size: 17px; }
.comparison-desc--us  { color: rgba(255,255,255,0.85); font-size: 17px; position: relative; }

.comparison-list {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 12px;
}
.comparison-list li {
  display: flex; gap: 14px; align-items: center;
  font-size: 18px; color: #fff;
}
.comparison-list--us li { font-weight: 500; position: relative; }
.comparison-x { color: #ff8e73; }

.comparison-divider {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0 4px;
}
.comparison-divider-text {
  writing-mode: vertical-rl;
  font-size: 11px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  font-weight: 700;
  color: #9db4ff;
}
.comparison-divider-text--top  { transform: rotate(180deg); margin-bottom: 18px; }
.comparison-divider-text--bot  { margin-top: 18px; }
.comparison-arrow {
  width: 56px; height: 56px;
  border-radius: 50%;
  background: var(--primary);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
}

.comparison-us-deco {
  position: absolute;
  right: -100px; bottom: -100px;
  width: 340px; height: 340px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,0.18), transparent 70%);
  pointer-events: none;
}

.multiplier-banner {
  margin-top: 64px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 24px;
  padding: 40px;
  display: flex;
  align-items: center;
  gap: 48px;
}
.multiplier-num {
  font-family: "Instrument Serif", serif;
  font-style: italic;
  font-size: 120px;
  line-height: 1;
  color: #fff;
  letter-spacing: -0.04em;
  flex-shrink: 0;
}
.multiplier-num .multiplier-x { color: #9db4ff; font-size: 0.6em; }
.multiplier-body { flex: 1; }
.multiplier-label { letter-spacing: 0.18em; text-transform: uppercase; font-weight: 700; color: #9db4ff; font-size: 13px; }
.multiplier-text { font-size: 24px; font-weight: 600; line-height: 1.4; margin-top: 8px; color: #fff; }
.multiplier-text em { font-family: "Instrument Serif", serif; color: #f1e4c4; }

/* =========================================================
   PRICING
   ========================================================= */
.pricing-price {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-weight: 800;
  font-size: 80px;
  line-height: 1;
  letter-spacing: -0.04em;
  margin-top: 18px;
  color: var(--ink);
}
.pricing-price--primary { font-size: 60px; color: var(--primary); letter-spacing: -0.03em; }
.pricing-price--on-ink  { font-size: 60px; color: #fff;           letter-spacing: -0.03em; position: relative; }
.pricing-gst { font-size: 0.32em; font-weight: 500; letter-spacing: 0; }
.pricing-gst--muted { color: var(--ink-3); }
.pricing-gst--blue  { color: #9db4ff; }
.pricing-period { font-size: 17px; color: var(--ink-3); margin-top: 8px; }
.pricing-period--primary { font-size: 18px; color: var(--ink-2); font-weight: 600; }
.pricing-period--on-ink  { font-size: 18px; color: #c2c9e0; font-weight: 600; position: relative; }
.pricing-desc { font-weight: 600; color: var(--ink-2); line-height: 1.5; font-size: 17px; }

.pricing-list {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 12px;
}
.pricing-list li {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 15px;
  color: var(--ink-2);
}
.pricing-list--on-ink li { color: #c2c9e0; position: relative; }

.pricing-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.pricing-card--on-ink {
  position: relative;
}
.pricing-deco {
  position: absolute;
  right: -80px; top: -80px;
  width: 260px; height: 260px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(0,15,240,0.45), transparent 70%);
  pointer-events: none;
}

.ensures-strip {
  margin-top: 32px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}
.ensures-card {
  flex-direction: row;
  gap: 14px;
  align-items: center;
  padding: 22px;
}

/* =========================================================
   CTA SECTION
   ========================================================= */
.cta-tags { display: flex; gap: 14px; margin-bottom: 48px; }
.cta-quote-wrap { position: relative; margin-bottom: 96px; }
.cta-quote-deco {
  font-family: "Instrument Serif", serif;
  font-size: 240px;
  line-height: 0.9;
  color: rgba(255,255,255,0.06);
  position: absolute;
  left: -40px;
  top: -110px;
  pointer-events: none;
}
.cta-quote { font-size: 84px; max-width: 1400px; position: relative; }
.cta-quote-blue  { color: #9db4ff; }
.cta-quote-cream { color: #f1e4c4; }
.cta-divider { background: rgba(255,255,255,0.12); margin-bottom: 64px; }

.cta-bottom {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 80px;
  align-items: end;
}
.cta-left-super {
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 700;
  color: #9db4ff;
  font-size: 14px;
}
.cta-left-title {
  font-size: 54px;
  font-weight: 700;
  line-height: 1.05;
  margin-top: 14px;
  color: #fff;
  letter-spacing: -0.02em;
}
.cta-tag-row {
  margin-top: 28px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.cta-form-panel {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 24px;
  padding: 40px;
}
.cta-form-super { letter-spacing: 0.18em; text-transform: uppercase; font-weight: 700; color: #9db4ff; font-size: 13px; }
.cta-form-title { font-size: 30px; font-weight: 700; line-height: 1.2; margin-top: 10px; color: #fff; }
.cta-form-desc  { color: #a8b2d1; margin-top: 14px; line-height: 1.55; font-size: 15px; }
.cta-btn-row {
  margin-top: 28px;
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.cta-contact-row {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
  font-size: 15px;
  color: #c2c9e0;
}
.cta-contact-item { display: flex; align-items: center; gap: 10px; }
.cta-contact-icon { color: #9db4ff; }

/* =========================================================
   RESPONSIVE — TABLET  (max-width: 1024px)
   ========================================================= */
@media (max-width: 1024px) {
  .lp-header-inner { padding: 0 32px; }
  .lp-container    { padding: 0 32px; }
  .lp-section { padding: 100px 0; }
  .lp-section.hero { padding: 80px 0 100px; }
  .lp-section.cta  { padding: 100px 0; }

  h1.hero-title  { font-size: 80px; }
  h1.slide-title { font-size: 60px; }
  .quote         { font-size: 64px; }
  .section-num   { font-size: 80px; }
  .stat-num--first { font-size: 130px; }

  .promise-strip { grid-template-columns: repeat(2, 1fr); gap: 28px; }
  .promise-label { font-size: 34px; }

  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .grid-5 { grid-template-columns: repeat(3, 1fr); }

  .two-col-lead     { grid-template-columns: 1fr; gap: 48px; }
  .two-col-closures { grid-template-columns: 1fr; gap: 48px; }
  .grid-2           { grid-template-columns: 1fr; gap: 24px; }

  .comparison-grid { grid-template-columns: 1fr; gap: 24px; }
  .comparison-divider { flex-direction: row; justify-content: center; padding: 8px 0; }
  .comparison-divider-text--top { transform: none; writing-mode: horizontal-tb; margin-bottom: 0; margin-right: 18px; }
  .comparison-divider-text--bot { writing-mode: horizontal-tb; margin-top: 0; margin-left: 18px; }

  .multiplier-banner { gap: 24px; }
  .multiplier-num    { font-size: 80px; }

  .cta-bottom  { grid-template-columns: 1fr; gap: 48px; }
  .cta-quote   { font-size: 56px; }
  .cta-left-title { font-size: 40px; }

  .ensures-strip { grid-template-columns: repeat(2, 1fr); }
  .grid-3 { grid-template-columns: 1fr 1fr; }

  .routing-callout { position: static; margin-top: 20px; max-width: 100%; }
}

/* =========================================================
   RESPONSIVE — MOBILE  (max-width: 767px)
   ========================================================= */
@media (max-width: 767px) {
  .lp-header-inner { padding: 0 16px; }
  .lp-logo         { height: 30px; }
  .header-cta      { font-size: 12px; padding: 10px 15px; gap: 6px; }

  .lp-container  { padding: 0 16px; }
  .lp-section    { padding: 64px 0; }
  .lp-section.hero { padding: 60px 0 72px; }
  .lp-section.cta  { padding: 72px 0; }

  h1.hero-title  { font-size: 44px; line-height: 1; }
  h1.slide-title { font-size: 34px; line-height: 1.05; }
  .hero-subtitle { font-size: 18px; }
  .kicker, .kicker--wide, .kicker--xl { font-size: 17px; }
  .quote         { font-size: 38px; }
  .section-num   { font-size: 56px; }

  .lp-section-head { flex-direction: column; align-items: flex-start; gap: 16px; margin-bottom: 40px; }

  .promise-strip { grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 60px; padding-top: 32px; }
  .promise-label { font-size: 26px; }
  .promise-item  .icon-tile { width: 44px; height: 44px; }

  .grid-4, .grid-5 { grid-template-columns: 1fr; }
  .grid-2-chips    { grid-template-columns: 1fr; }
  .chip-grid       { grid-template-columns: 1fr; max-width: 100%; }

  .belief-banner { flex-direction: column; align-items: flex-start; gap: 16px; padding: 24px 20px; }
  .belief-text   { font-size: 18px; }

  .two-col-lead     { grid-template-columns: 1fr; gap: 40px; }
  .two-col-closures { grid-template-columns: 1fr; gap: 40px; }
  .grid-2           { grid-template-columns: 1fr; gap: 20px; }
  .grid-3           { grid-template-columns: 1fr; gap: 20px; }

  .stat-num--first { font-size: 100px; }
  .stat-desc       { font-size: 20px; }

  .comparison-grid { grid-template-columns: 1fr; gap: 16px; }
  .comparison-divider { flex-direction: row; justify-content: center; padding: 4px 0; }
  .comparison-divider-text--top { transform: none; writing-mode: horizontal-tb; margin-bottom: 0; margin-right: 12px; }
  .comparison-divider-text--bot { writing-mode: horizontal-tb; margin-top: 0; margin-left: 12px; }
  .comparison-col--diy,
  .comparison-col--us { padding: 28px 20px; }
  .pillar-card { padding: 28px 20px; }
  .pillar-card--ink { padding: 28px 20px; }

  .multiplier-banner { flex-direction: column; gap: 16px; padding: 28px 20px; }
  .multiplier-num    { font-size: 72px; }
  .multiplier-text   { font-size: 18px; }

  .cta-bottom  { grid-template-columns: 1fr; gap: 40px; }
  .cta-quote   { font-size: 34px; }
  .cta-quote-deco { font-size: 140px; top: -60px; left: -20px; }
  .cta-left-title  { font-size: 32px; }
  .cta-form-panel  { padding: 28px 20px; }
  .cta-form-title  { font-size: 22px; }

  .pricing-price   { font-size: 56px; }
  .pricing-price--primary { font-size: 44px; }
  .pricing-price--on-ink  { font-size: 44px; }

  .ensures-strip  { grid-template-columns: 1fr; }

  .routing-card   { padding: 24px 20px; }
  .routing-callout { position: static; margin-top: 20px; max-width: 100%; }

  .pipeline-panel { padding: 24px 16px; }

  .support-list   { grid-template-columns: 1fr; }
  .support-list li:last-child { grid-column: auto; }
  .payoff-card    { padding: 28px 20px; }

  .checklist li   { font-size: 17px; }
  .check-ico      { width: 26px; height: 26px; margin-top: 2px; }
  .card.tight     { padding: 20px; }
}

/* =========================================================
   SMALL MOBILE  (max-width: 400px)
   ========================================================= */
@media (max-width: 400px) {
  h1.hero-title  { font-size: 36px; }
  h1.slide-title { font-size: 28px; }
  .promise-strip { grid-template-columns: 1fr; }
  .hero-cta-row  { flex-direction: column; }
  .hero-cta-row .btn { width: 100%; justify-content: center; }
  .cta-btn-row   { flex-direction: column; }
  .cta-btn-row .btn { width: 100%; justify-content: center; }
}

/* =========================================================
   UTILITY HELPERS (eliminate remaining inline one-liners)
   ========================================================= */
.divider--gap-sm  { margin: 24px 0; }
.divider--gap-md  { margin: 28px 0; }
.divider--on-ink  { background: rgba(255,255,255,0.1); }
.divider--on-ink2 { background: rgba(255,255,255,0.12); }

.flex-col { display: flex; flex-direction: column; }
.font-bold-17 { font-weight: 700; font-size: 17px; }

.label--small-upper {
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 13px;
}
.label--ink-3   { color: var(--ink-3); }
.label--primary { color: var(--primary); }
.label--blue    { color: #9db4ff; }

.icon-diy { background: rgba(226,92,63,0.18); color: #ff8e73; }
.icon-check-success { color: var(--success); margin-top: 2px; }
.icon-check-green   { color: #5bd79a; margin-top: 2px; }
.pos-relative { position: relative; }

.tag--xs      { font-size: 11px; }
.divider--md  { margin: 24px 0; }
.divider--lg  { margin: 28px 0; }
.icon--blue   { color: #9db4ff; }
.text--ink-2-bold { font-weight: 700; font-size: 17px; color: var(--ink-2); }
.tag--closing { background: var(--primary-soft); color: var(--primary-ink); font-size: 11px; }
.em--primary  { color: var(--primary); }


/* =========================================================
   VIRTUAL OFFICE PRESENTATION — Extracted inline styles
   ========================================================= */

/* ---- Hero section ---- */
.hero-section { padding: 120px 0 140px; }
.hero-tags-row { display: flex; gap: 14px; margin-bottom: 48px; flex-wrap: wrap; }
.hero-tag-sm { font-size: 13px; }
.hero-title-wrap { max-width: 1200px; }
.hero-desc {
  margin-top: 48px;
  max-width: 740px;
  font-size: 24px;
  line-height: 1.5;
  color: #a8b2d1;
}
.hero-cta-group { margin-top: 56px; display: flex; gap: 16px; flex-wrap: wrap; }
.btn-primary-pill {
  display: inline-flex; align-items: center; gap: 12px;
  padding: 18px 30px;
  background: var(--primary); color: #fff;
  border-radius: 999px; font-weight: 700; font-size: 18px; text-decoration: none;
}
.btn-ghost-pill {
  display: inline-flex; align-items: center; gap: 12px;
  padding: 18px 30px;
  background: rgba(255,255,255,0.08); color: #fff;
  border: 1px solid rgba(255,255,255,0.18);
  border-radius: 999px; font-weight: 600; font-size: 18px; text-decoration: none;
}

/* ---- Stats strip ---- */
.stats-strip {
  margin-top: 120px; padding-top: 48px;
  border-top: 1px solid rgba(255,255,255,0.12);
  display: grid; grid-template-columns: repeat(4,1fr); gap: 40px;
}
.stat-figure {
  font-family: "Instrument Serif", serif;
  font-style: italic; font-size: 72px; line-height: 1;
  color: #fff; letter-spacing: -0.02em;
}
.stat-figure .stat-accent { color: #9db4ff; }
.stat-label {
  margin-top: 10px; letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.55); font-weight: 600;
}

/* ---- Section number decorative ---- */
.section-num-primary { font-family: "Instrument Serif",serif; font-style:italic; font-size:120px; line-height:0.9; color:var(--primary); letter-spacing:-0.04em; }
.section-num-on-ink  { font-family: "Instrument Serif",serif; font-style:italic; font-size:120px; line-height:0.9; color:#9db4ff; letter-spacing:-0.04em; }

/* ---- Section head text constraint ---- */
.section-head-text-wide { max-width: 880px; }

/* ---- "Everything you get" label ---- */
.subheading-label {
  font-weight: 600; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--ink-2); margin-bottom: 28px;
}
.subheading-label--sm { margin-bottom: 18px; }
.subheading-label--md { margin-bottom: 16px; }

/* ---- Cards grid (section 2) ---- */
.grid-4-cards { display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; }

/* ---- Card ink variant (dark card) ---- */
.card-ink { background: var(--ink); color:#fff; border-color: var(--ink); }
.card-ink .h { color: #fff; }
.card-ink .p { color: #a8b2d1; }
.icon-tile-ink { background: rgba(255,255,255,0.1); color: #fff; }

/* ---- Old vs New (section 3) ---- */
.oldnew-grid { display: grid; grid-template-columns: 1fr auto 1fr; gap: 48px; align-items: stretch; }
.oldnew-col-old { background: var(--accent-soft); border-radius: 28px; padding: 48px; }
.oldnew-col-new { background: var(--ink); color:#fff; border-radius: 28px; padding: 48px; position: relative; overflow: hidden; }
.oldnew-deco {
  position: absolute; right: -80px; top: -80px;
  width: 280px; height: 280px; border-radius: 50%;
  background: radial-gradient(circle, rgba(21,84,240,0.45), transparent 70%);
}
.oldnew-header { display: flex; align-items: center; gap: 14px; margin-bottom: 28px; }
.oldnew-header-rel { display: flex; align-items: center; gap: 14px; margin-bottom: 28px; position: relative; }
.oldnew-super-old { font-size:14px; letter-spacing:0.18em; text-transform:uppercase; font-weight:700; color:#913221; }
.oldnew-title-old { font-size:28px; font-weight:700; letter-spacing:-0.01em; color:#5c1a0e; }
.oldnew-super-new { font-size:14px; letter-spacing:0.18em; text-transform:uppercase; font-weight:700; color:#9db4ff; }
.oldnew-title-new { font-size:28px; font-weight:700; letter-spacing:-0.01em; color:#fff; }

/* ---- Old model list ---- */
.old-list { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:14px; }
.old-list li { display:flex; gap:14px; align-items:center; font-size:19px; color:#5c1a0e; }
.icon-x-accent { color: var(--accent); }

/* ---- Divider arrow (between old/new) ---- */
.shift-divider { display:flex; flex-direction:column; align-items:center; justify-content:center; padding:0 4px; }
.shift-label { font-size:11px; letter-spacing:0.3em; text-transform:uppercase; font-weight:700; color:var(--ink-3); }
.shift-label-top { writing-mode:vertical-rl; transform:rotate(180deg); margin-bottom:18px; }
.shift-label-bot { writing-mode:vertical-rl; margin-top:18px; }
.shift-arrow-btn { width:56px; height:56px; border-radius:50%; background:var(--ink); color:#fff; display:flex; align-items:center; justify-content:center; }

/* ---- New model chips area ---- */
.new-model-desc { color:#a8b2d1; margin-bottom:18px; position:relative; }
.new-model-chips { display:grid; grid-template-columns:1fr 1fr; gap:14px; position:relative; }
.chip-on-ink { background:rgba(255,255,255,0.06); border-color:rgba(255,255,255,0.12); color:#fff; }
.chip-span2 { grid-column: span 2; }
.new-model-footer { font-size:18px; color:#c2c9e0; line-height:1.5; }
.divider-on-ink { background:rgba(255,255,255,0.1); }

/* ---- What Is (section 4) two-col ---- */
.whatis-grid { display:grid; grid-template-columns:1.05fr 1fr; gap:72px; align-items:start; }
.kicker-wide { font-size:24px; color:var(--ink-2); margin-bottom:36px; max-width:none; }

/* ---- Business profile card ---- */
.biz-card { background:var(--paper); border:1px solid var(--line); border-radius:28px; padding:40px; position:relative; overflow:hidden; }
.biz-card-header { display:flex; gap:16px; align-items:flex-start; }
.biz-card-label { font-size:13px; letter-spacing:0.18em; text-transform:uppercase; font-weight:700; color:var(--primary); }
.biz-card-name { font-size:28px; font-weight:700; line-height:1.15; letter-spacing:-0.01em; margin-top:8px; }
.biz-card-address { font-size:17px; color:var(--ink-3); line-height:1.45; margin-top:10px; }
.biz-card-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.biz-card-meta-label { letter-spacing:0.16em; text-transform:uppercase; font-weight:700; color:var(--ink-3); font-size:12px; }
.biz-card-meta-value { font-size:17px; font-weight:600; margin-top:6px; }
.biz-card-status {
  margin-top:6px; display:inline-flex; align-items:center; gap:8px;
  padding:6px 12px; background:var(--success-soft); color:var(--success);
  border-radius:999px; font-size:14px; font-weight:600;
}
.biz-card-status-dot { width:8px; height:8px; border-radius:50%; background:var(--success); }

/* ---- Floating callout ---- */
.floating-callout {
  position:absolute; right:-16px; bottom:-24px;
  background:var(--ink); color:#fff;
  padding:20px 24px; border-radius:18px; max-width:280px;
  box-shadow:0 24px 60px -20px rgba(10,23,52,0.4);
}
.floating-callout-label { font-size:13px; letter-spacing:0.16em; text-transform:uppercase; font-weight:700; color:#9db4ff; }
.floating-callout-text { font-size:20px; font-weight:600; line-height:1.3; margin-top:4px; }
.biz-card-wrap { position:relative; }

/* ---- Cost Savings (section 5) ---- */
.savings-grid { display:grid; grid-template-columns:1.2fr 1fr; gap:80px; align-items:start; }
.stat-big { font-size:220px; }
.stat-dash { color:var(--ink-3); font-weight:500; }
.stat-sub-ink { color:var(--ink); }
.savings-desc { font-size:28px; line-height:1.3; max-width:560px; margin-top:16px; color:var(--ink-2); }
.chip-grid-3 { margin-top:40px; display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.cost-list-wrap { background:var(--canvas); border-radius:22px; padding:28px; }
.cost-list-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px 28px; }
.cost-list-item { display:flex; gap:12px; align-items:center; font-size:17px; }
.savings-cta-banner {
  margin-top:24px; display:flex; gap:16px; align-items:center;
  background:var(--ink); color:#fff; padding:22px 26px; border-radius:18px;
}
.savings-cta-icon { background:rgba(255,255,255,0.1); color:#9db4ff; }
.savings-cta-label { font-size:13px; letter-spacing:0.16em; text-transform:uppercase; font-weight:700; color:#9db4ff; }
.savings-cta-text { font-size:21px; font-weight:700; margin-top:2px; }

/* ---- GST ITC (section 6) ---- */
.gst-grid { display:grid; grid-template-columns:1.1fr 1fr; gap:56px; }
.gst-cards-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.chip-row { display:flex; flex-wrap:wrap; gap:12px; }
.itc-example {
  margin-top:36px; background:var(--ink); color:#fff;
  padding:32px; border-radius:22px; position:relative; overflow:hidden;
}
.itc-example-deco {
  position:absolute; right:-60px; bottom:-60px;
  width:240px; height:240px; border-radius:50%;
  background:radial-gradient(circle, rgba(31,138,91,0.4), transparent 70%);
}
.itc-example-label { letter-spacing:0.16em; text-transform:uppercase; font-weight:700; color:#9db4ff; font-size:13px; }
.itc-example-title { font-size:26px; font-weight:700; line-height:1.25; margin-top:8px; }
.itc-accent { color:#9db4ff; font-weight:500; }
.itc-footnote { margin-top:12px; color:#a8b2d1; }

/* ---- Pan-India (section 7) ---- */
.panindia-grid { display:grid; grid-template-columns:1fr 1.1fr; gap:60px; align-items:center; }
.panindia-benefits { margin-top:36px; display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.benefit-item { display:flex; gap:14px; align-items:center; }
.benefit-title { font-weight:700; font-size:18px; }
.chip-more { background:var(--ink); color:#fff; border-color:var(--ink); }
.chip-more-icon { color:#9db4ff; }

/* ---- Map container ---- */
.map-wrap {
  position:relative; background:var(--canvas); border-radius:28px;
  padding:36px; aspect-ratio:1/1; display:flex; align-items:center; justify-content:center;
}
.map-dotgrid { position:absolute; inset:0; opacity:0.4; border-radius:28px; }
.map-svg { width:100%; height:100%; position:relative; }
.map-legend { position:absolute; left:36px; top:36px; display:flex; flex-direction:column; gap:8px; }
.map-legend-item { display:flex; gap:10px; align-items:center; font-size:13px; font-weight:600; color:var(--ink-2); }
.map-dot { width:12px; height:12px; border-radius:50%; }
.map-dot--primary { background:var(--primary); }
.map-dot--gold { background:var(--gold); }

/* ---- Trust cards (section 8) ---- */
.trust-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:18px; }
.trust-card {
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:22px; padding:28px;
}
.trust-card--primary { background:#1554f0; border-radius:22px; padding:28px; position:relative; overflow:hidden; }
.icon-tile-on-ink { background:rgba(157,180,255,0.18); color:#9db4ff; }
.icon-tile-on-primary { background:rgba(255,255,255,0.18); color:#fff; }
.trust-card-title { font-size:20px; font-weight:700; margin-top:18px; line-height:1.25; }
.trust-card-desc { margin-top:8px; }
.trust-card-title--white { color:#fff; }
.trust-card-desc--white { color:#dde5ff; }

/* ---- vs Home address banner ---- */
.home-banner {
  margin-top:48px; background:rgba(255,255,255,0.03);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:22px; padding:32px;
  display:flex; align-items:center; gap:36px;
}
.icon-tile-coral-on-ink { background:rgba(226,92,63,0.2); color:#ff8e73; }
.home-banner-body { flex:1; }
.home-banner-label { letter-spacing:0.16em; text-transform:uppercase; font-weight:700; color:#ffb29d; font-size:13px; }
.home-banner-title { font-size:24px; font-weight:700; margin-top:6px; line-height:1.25; color:#fff; }

/* ---- Compliance (section 9) ---- */
.compliance-grid { display:grid; grid-template-columns:1.05fr 1fr; gap:64px; }
.card-row { flex-direction:row; align-items:center; gap:24px; }
.card-body-flex { flex:1; }
.addon-panel {
  background:var(--ink); color:#fff;
  border-radius:24px; padding:36px; position:relative; overflow:hidden;
}
.addon-deco {
  position:absolute; right:-80px; top:-80px;
  width:280px; height:280px; border-radius:50%;
  background:radial-gradient(circle, rgba(21,84,240,0.4), transparent 70%);
}
.addon-list { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:18px; position:relative; }
.addon-item { display:flex; align-items:center; gap:18px; }
.addon-icon {
  width:44px; height:44px; border-radius:12px;
  background:rgba(255,255,255,0.08); display:flex;
  align-items:center; justify-content:center; color:#9db4ff; flex-shrink:0;
}
.addon-item-body { flex:1; }
.addon-item-title { font-size:19px; font-weight:700; }
.addon-item-desc { color:#a8b2d1; }

/* ---- Built For (section 10) ---- */
.built-for-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:18px; }

/* ---- Work Anywhere (section 11) ---- */
.work-anywhere-grid { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:stretch; }
.work-left { display:flex; flex-direction:column; gap:24px; }
.operate-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
.card-row-sm { flex-direction:row; align-items:center; gap:16px; }
.card-span2 { grid-column:span 2; }
.tools-panel {
  background:var(--ink); color:#fff;
  border-radius:24px; padding:40px; position:relative; overflow:hidden;
}
.tools-deco {
  position:absolute; right:-100px; bottom:-100px;
  width:340px; height:340px; border-radius:50%;
  background:radial-gradient(circle, rgba(21,84,240,0.45), transparent 70%);
}
.tools-label { letter-spacing:0.16em; text-transform:uppercase; font-weight:700; color:#9db4ff; font-size:13px; }
.tools-title { font-size:30px; font-weight:700; margin-top:10px; line-height:1.15; max-width:480px; }
.tools-chips { margin-top:36px; display:grid; grid-template-columns:repeat(2,1fr); gap:14px; position:relative; }
.tools-footer { font-size:18px; color:#c2c9e0; line-height:1.5; max-width:480px; }

/* ---- Meeting Rooms / ROI (section 12) ---- */
.meetingrooms-grid { display:grid; grid-template-columns:1.1fr 1fr; gap:56px; }
.kicker-mb { font-size:22px; max-width:none; margin-bottom:28px; }
.rooms-cards { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.roi-panel {
  background:var(--ink); color:#fff; border-radius:24px; padding:40px;
  display:flex; flex-direction:column; gap:24px; position:relative; overflow:hidden;
}
.roi-deco {
  position:absolute; right:-100px; top:-100px;
  width:300px; height:300px; border-radius:50%;
  background:radial-gradient(circle, rgba(31,138,91,0.4), transparent 70%);
}
.roi-inner { position:relative; }
.roi-label { letter-spacing:0.16em; text-transform:uppercase; font-weight:700; color:#9db4ff; font-size:13px; }
.roi-title { font-size:28px; font-weight:700; line-height:1.2; margin-top:8px; }
.roi-spend-box {
  position:relative; background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.08); border-radius:18px; padding:24px;
}
.roi-spend-label { color:#9db4ff; letter-spacing:0.14em; text-transform:uppercase; font-weight:600; font-size:12px; }
.roi-spend-fig {
  font-family:"Instrument Serif",serif; font-style:italic;
  font-size:64px; line-height:1; color:#fff; margin-top:8px; letter-spacing:-0.03em;
}
.roi-spend-arrow { color:#9db4ff; font-size:0.5em; }
.roi-deploy-label { color:#9db4ff; letter-spacing:0.14em; text-transform:uppercase; font-weight:600; font-size:12px; margin-bottom:14px; }
.roi-deploy-chips { display:grid; grid-template-columns:1fr 1fr; gap:10px; }

/* ---- Why Choose (section 13) ---- */
.whychoose-grid { display:grid; grid-template-columns:1fr 1fr; gap:48px; }
.whychoose-cards { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.card-row-center { flex-direction:row; gap:14px; align-items:center; padding:22px; }
.impact-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.impact-col-old { background:var(--accent-soft); border-radius:22px; padding:32px; min-height:380px; display:flex; flex-direction:column; }
.impact-col-new {
  background:var(--ink); color:#fff; border-radius:22px; padding:32px;
  min-height:380px; display:flex; flex-direction:column; position:relative; overflow:hidden;
}
.impact-new-deco {
  position:absolute; right:-80px; bottom:-80px;
  width:240px; height:240px; border-radius:50%;
  background:radial-gradient(circle, rgba(31,138,91,0.4), transparent 70%);
}
.impact-super-old { font-size:13px; letter-spacing:0.18em; text-transform:uppercase; font-weight:700; color:#913221; }
.impact-super-new { font-size:13px; letter-spacing:0.18em; text-transform:uppercase; font-weight:700; color:#9db4ff; position:relative; }
.impact-list { list-style:none; padding:0; margin:24px 0 0; display:flex; flex-direction:column; gap:14px; flex:1; }
.impact-list--new { position:relative; }
.impact-item-old { display:flex; gap:12px; align-items:flex-start; font-size:18px; color:#5c1a0e; font-weight:500; }
.impact-item-new { display:flex; gap:12px; align-items:flex-start; font-size:18px; color:#fff; font-weight:500; }
.check-ico-sm { width:24px; height:24px; flex-shrink:0; }
.icon-x-mt { color:var(--accent); margin-top:2px; }

/* ---- Final CTA (section 14) ---- */
.final-section { padding: 160px 0; }
.final-tags-row { display:flex; gap:14px; margin-bottom:48px; }
.quote-wrap { position:relative; margin-bottom:96px; }
.quote-deco {
  font-family:"Instrument Serif",serif; font-size:240px; line-height:0.9;
  color:rgba(255,255,255,0.06); position:absolute; left:-40px; top:-110px; pointer-events:none;
}
.quote-text { font-size:84px; max-width:1400px; position:relative; }
.quote-blue  { color:#9db4ff; }
.quote-cream { color:#f1e4c4; }
.cta-bottom-grid { display:grid; grid-template-columns:1.1fr 1fr; gap:80px; align-items:end; }
.cta-super { letter-spacing:0.18em; text-transform:uppercase; font-weight:700; color:#9db4ff; font-size:14px; }
.cta-heading { font-size:60px; font-weight:700; line-height:1.05; margin-top:14px; color:#fff; letter-spacing:-0.02em; }
.cta-tags-row { margin-top:28px; display:flex; flex-wrap:wrap; gap:10px; }
.cta-panel { background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.1); border-radius:24px; padding:40px; }
.cta-panel-label { letter-spacing:0.18em; text-transform:uppercase; font-weight:700; color:#9db4ff; font-size:13px; }
.cta-panel-title { font-size:30px; font-weight:700; line-height:1.2; margin-top:10px; color:#fff; }
.cta-panel-desc { color:#a8b2d1; margin-top:14px; line-height:1.55; font-size:15px; }
.cta-btn-group { margin-top:28px; display:flex; gap:12px; flex-wrap:wrap; }
.btn-primary-sm { display:inline-flex; align-items:center; gap:10px; padding:16px 26px; background:var(--primary); color:#fff; border-radius:999px; font-weight:700; font-size:17px; text-decoration:none; }
.btn-ghost-sm { display:inline-flex; align-items:center; gap:10px; padding:16px 26px; background:rgba(255,255,255,0.08); color:#fff; border:1px solid rgba(255,255,255,0.18); border-radius:999px; font-weight:600; font-size:17px; text-decoration:none; }
.cta-contact { display:flex; gap:24px; flex-wrap:wrap; font-size:15px; color:#c2c9e0; }
.cta-contact-item { display:flex; align-items:center; gap:10px; }
.cta-contact-icon { color:#9db4ff; }

/* =========================================================
   RESPONSIVE — TABLET overrides for new classes (max-width: 1024px)
   ========================================================= */
@media (max-width: 1024px) {
  .stats-strip { grid-template-columns: repeat(2,1fr); gap: 28px; margin-top: 72px; }
  .stat-figure { font-size: 52px; }
  .section-num-primary, .section-num-on-ink { font-size: 72px; }
  .grid-4-cards { grid-template-columns: repeat(2,1fr); }
  .oldnew-grid { grid-template-columns: 1fr; gap: 24px; }
  .shift-divider { flex-direction: row; justify-content: center; padding: 8px 0; }
  .shift-label-top { writing-mode: horizontal-tb; transform: none; margin-bottom: 0; margin-right: 18px; }
  .shift-label-bot { writing-mode: horizontal-tb; margin-top: 0; margin-left: 18px; }
  .whatis-grid { grid-template-columns: 1fr; gap: 48px; }
  .savings-grid { grid-template-columns: 1fr; gap: 48px; }
  .stat-big { font-size: 140px; }
  .chip-grid-3 { grid-template-columns: repeat(2,1fr); }
  .gst-grid { grid-template-columns: 1fr; gap: 40px; }
  .panindia-grid { grid-template-columns: 1fr; gap: 40px; }
  .trust-grid { grid-template-columns: repeat(3,1fr); }
  .compliance-grid { grid-template-columns: 1fr; gap: 40px; }
  .built-for-grid { grid-template-columns: repeat(3,1fr); }
  .work-anywhere-grid { grid-template-columns: 1fr; gap: 40px; }
  .meetingrooms-grid { grid-template-columns: 1fr; gap: 40px; }
  .whychoose-grid { grid-template-columns: 1fr; gap: 40px; }
  .cta-bottom-grid { grid-template-columns: 1fr; gap: 48px; }
  .quote-text { font-size: 56px; }
  .cta-heading { font-size: 40px; }
  .home-banner { flex-direction: column; align-items: flex-start; gap: 20px; }
  .floating-callout { position: static; margin-top: 20px; max-width: 100%; right: auto; bottom: auto; }
}

/* =========================================================
   RESPONSIVE — MOBILE overrides for new classes (max-width: 767px)
   ========================================================= */
@media (max-width: 767px) {
  .hero-section { padding: 60px 0 72px; }
  .hero-desc { font-size: 18px; max-width: 100%; }
  .stats-strip { grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 48px; padding-top: 28px; }
  .stat-figure { font-size: 38px; }
  .section-num-primary, .section-num-on-ink { font-size: 48px; }
  .grid-4-cards { grid-template-columns: 1fr; }
  .oldnew-col-old, .oldnew-col-new { padding: 28px 20px; }
  .old-list li { font-size: 17px; }
  .whatis-grid { grid-template-columns: 1fr; gap: 32px; }
  .kicker-wide { font-size: 18px; }
  .savings-grid { grid-template-columns: 1fr; gap: 32px; }
  .stat-big { font-size: 88px; }
  .savings-desc { font-size: 20px; }
  .chip-grid-3 { grid-template-columns: 1fr; }
  .cost-list-grid { grid-template-columns: 1fr; gap: 12px; }
  .gst-grid { grid-template-columns: 1fr; gap: 32px; }
  .gst-cards-grid { grid-template-columns: 1fr; }
  .panindia-grid { grid-template-columns: 1fr; gap: 32px; }
  .panindia-benefits { grid-template-columns: 1fr; }
  .map-wrap { aspect-ratio: auto; padding: 24px; }
  .map-legend { position: static; margin-bottom: 16px; flex-direction: row; flex-wrap: wrap; gap: 12px; }
  .trust-grid { grid-template-columns: 1fr; }
  .home-banner { flex-direction: column; gap: 16px; padding: 24px 20px; }
  .compliance-grid { grid-template-columns: 1fr; gap: 32px; }
  .built-for-grid { grid-template-columns: 1fr 1fr; }
  .work-anywhere-grid { grid-template-columns: 1fr; gap: 32px; }
  .operate-grid { grid-template-columns: 1fr; }
  .card-span2 { grid-column: auto; }
  .meetingrooms-grid { grid-template-columns: 1fr; gap: 32px; }
  .rooms-cards { grid-template-columns: 1fr; }
  .roi-spend-fig { font-size: 40px; }
  .whychoose-grid { grid-template-columns: 1fr; gap: 32px; }
  .whychoose-cards { grid-template-columns: 1fr; }
  .impact-grid { grid-template-columns: 1fr; }
  .impact-col-old, .impact-col-new { min-height: auto; padding: 24px 20px; }
  .final-section { padding: 72px 0; }
  .quote-text { font-size: 32px; }
  .quote-deco { font-size: 120px; top: -50px; left: -16px; }
  .cta-bottom-grid { grid-template-columns: 1fr; gap: 32px; }
  .cta-heading { font-size: 32px; }
  .cta-panel { padding: 24px 20px; }
  .cta-panel-title { font-size: 22px; }
  .new-model-chips { grid-template-columns: 1fr; }
  .chip-span2 { grid-column: auto; }
  .tools-chips { grid-template-columns: 1fr; }
  .roi-deploy-chips { grid-template-columns: 1fr; }
  .hero-cta-group .btn-primary-pill,
  .hero-cta-group .btn-ghost-pill { font-size: 16px; padding: 14px 22px; }
}

/* =========================================================
   SMALL MOBILE overrides (max-width: 400px)
   ========================================================= */
@media (max-width: 400px) {
  .stats-strip { grid-template-columns: 1fr; }
  .stat-figure { font-size: 48px; }
  .hero-cta-group { flex-direction: column; }
  .hero-cta-group .btn-primary-pill,
  .hero-cta-group .btn-ghost-pill { width: 100%; justify-content: center; }
  .cta-btn-group { flex-direction: column; }
  .cta-btn-group .btn-primary-sm,
  .cta-btn-group .btn-ghost-sm { width: 100%; justify-content: center; }
  .built-for-grid { grid-template-columns: 1fr; }
  .trust-grid { grid-template-columns: 1fr; }
  .biz-card {padding: 20px;}
}

/* ---- Final utility helpers ---- */
.card--align-start { align-items: flex-start; }
.text-bold-19 { font-weight: 700; font-size: 19px; }
.text-bold-17 { font-weight: 700; font-size: 17px; }
.flex-col-gap16 { display: flex; flex-direction: column; gap: 16px; }
.trust-card-desc--muted { color: #a8b2d1; }
.divider--gap28 { margin: 28px 0; }
.divider--gap32 { margin: 32px 0; }
.divider--dark-gap64 { background: rgba(255,255,255,0.12); margin-bottom: 64px; }
.divider--on-ink-gap24 { background: rgba(255,255,255,0.1); margin: 24px 0; }