:root {
  /* Brand (muted) */
  --brand: #4757E6;            /* softened indigo */
  --brand-accent: #0EA5B7;     /* softened teal */
  --brand-lilac: #9FA8FF;

  /* Surfaces */
  --bg-hero: #0F172A;
  --bg-section-dark: #111C33;
  --bg-surface: #FCFDFE;
  --bg-section: #F6F8FC;
  --bg-white: #FFFFFF;

  /* Text */
  --text-ink: #0B1220;
  --text-muted: #5B6B82;
  --text-on-dark: #E7ECF6;

  /* UI */
  --border: #E7EAF4;
  --shadow-sm: 0 1px 2px rgba(8,15,35,0.06);
  --shadow-lg: 0 12px 40px rgba(8,15,35,0.12);

  /* CTA */
  --cta-bg: linear-gradient(135deg, #4757E6 0%, #0EA5B7 100%);
  --cta-text: #ffffff;
}

/* Glass morphism nav */
.nav-glass {
  -webkit-backdrop-filter: saturate(140%) blur(12px);
  backdrop-filter: saturate(140%) blur(12px);
  background: rgba(15,23,42,.6);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.nav-link { color: #E5E7EB; }
.nav-link:hover { color: #fff; }

/* Utilities */
.section { padding: 96px 0; }
@media (max-width: 1024px) { .section { padding: 64px 0; } }
@media (max-width: 640px) { .section { padding: 48px 0; } }

/* Global body */
body { background: var(--bg-surface); color: var(--text-ink); }

/* Hero gradient + noise overlay */
.hero-wrap { background: linear-gradient(180deg, var(--bg-hero) 0%, var(--bg-section-dark) 100%); position: relative; overflow: hidden; }
.noise { position:absolute; inset:0; background-image: radial-gradient(rgba(255,255,255,0.04) 1px, transparent 1px); background-size:4px 4px; mix-blend-mode: overlay; opacity:.5; pointer-events:none; }

.btn {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: 0.9rem 1.25rem;
  border-radius: 0.75rem;
  font-weight: 600;
  transition: transform .2s cubic-bezier(.22,.61,.36,1), box-shadow .2s cubic-bezier(.22,.61,.36,1);
}
.btn-primary {
  background: var(--cta-bg);
  color: var(--cta-text);
  box-shadow: var(--shadow-lg);
}
.btn-primary:hover { transform: translateY(-1px); }
.btn-primary:active { transform: translateY(0); }
.btn-primary:focus-visible { outline: 2px solid var(--secondary-teal); outline-offset: 3px; }

.logo-tile {
  display: grid; place-items: center; height: 64px;
  border: 1px dashed var(--border);
  color: #6B7280; background: #fff; border-radius: .75rem;
  transition: filter .2s ease, color .2s ease;
}
.logo-tile:hover { color: #111827; filter: saturate(1.3); }

.card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 1.25rem;
  box-shadow: var(--shadow-sm);
}

.metric-card {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 14px;
  padding: 1.25rem;
  text-align: center;
}
.metric-value { font-size: 2rem; font-weight: 800; color: #fff; letter-spacing:.2px; }
.metric-label { color: #C8D2E8; }

.quote-card {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 0.75rem;
  padding: 1rem 1.25rem;
}

.process-step {
  background: #fff; border: 1px solid #E5E7EB; border-radius: .75rem; padding: 1rem;
}
.step-badge {
  display: inline-grid; place-items: center; width: 2rem; height: 2rem; border-radius: 999px;
  background: #EEF2FF; color: #3730A3; font-weight: 700; margin-bottom: .5rem;
}

.progress { background: #EDF1F7; height: 10px; border-radius: 999px; overflow: hidden; }
.progress > span { display: block; height: 100%; background: var(--brand-accent); }

.form-field { display: grid; gap: .4rem; font-size: .95rem; }
.form-field > span { color: #374151; font-weight: 600; }
.form-field input, .form-field select {
  border: 1px solid #E5E7EB; border-radius: .6rem; padding: .7rem .9rem; outline: none;
}
.form-field input:focus, .form-field select:focus { border-color: #A5B4FC; box-shadow: 0 0 0 3px rgba(99,102,241,.15); }

.faq { padding: 1rem 0; }
.faq > summary { cursor: pointer; list-style: none; font-weight: 600; }
.faq > summary::-webkit-details-marker { display:none; }
.faq[open] > summary { color: var(--brand); }
.faq > p { margin-top: .75rem; color: var(--text-muted); }

@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } }

/* --- Upgrades: accessibility, rhythm, and tweaks --- */
/* Subtler noise overlay to improve type contrast */
.noise { opacity:.35; }

/* Nav focus and active section indicator */
.nav-link:focus-visible { outline: 2px solid var(--brand); outline-offset: 4px; border-radius: 6px; }
.nav-link.active { color:#fff; position:relative; }
.nav-link.active::after { content:""; position:absolute; left:0; bottom:-8px; height:2px; width:100%; background: linear-gradient(90deg, var(--brand), var(--brand-accent)); border-radius:2px; }

/* Tighter vertical rhythm in sections */
.section h2 { margin-bottom: .5rem; }
.section p + p { margin-top: .5rem; }
.section h3 { margin-top: .5rem; }

/* Logo tiles: shorter, deliberate feel */
.logo-tile { height:56px; font-weight:600; letter-spacing:.2px; }

/* Partner logos: consistent sizing + grayscale→color on hover */
.logo-img { max-height: 32px; width: auto; object-fit: contain; filter: grayscale(100%); opacity:.85; transition: filter .2s ease, opacity .2s ease; }
.logo-tile:hover .logo-img { filter: none; opacity: 1; }

/* Form focus: brand-colored ring */
.form-field input:focus, .form-field select:focus { border-color: var(--brand); box-shadow: 0 0 0 3px rgba(71,87,230,.15); }

/* === Readability & emphasis utilities === */
.eyebrow { text-transform: uppercase; letter-spacing: .12em; font-weight: 600; color: var(--brand-lilac); font-size: .8rem; }
.lead { font-size: clamp(1.1rem, 1.25vw, 1.25rem); line-height: 1.75; color: #243045; }
.muted { color: var(--text-muted); }
.accent { color: var(--brand); font-weight: 600; }
.underline-accent { width: 72px; height: 3px; background: linear-gradient(90deg, var(--brand), var(--brand-accent)); border-radius: 2px; margin-top: .5rem; }

/* Case study cards */
.case-card { position: relative; }
.case-card::before { content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background: linear-gradient(180deg, var(--brand) 0%, var(--brand-accent) 100%); border-top-left-radius:14px; border-bottom-left-radius:14px; }
.case-title { font-size: 1.15rem; font-weight: 700; }
.case-meta { display:flex; flex-wrap:wrap; gap:.5rem 1rem; color: var(--text-muted); font-size: .85rem; margin-top:.25rem; }
.tag { display:inline-block; padding:.2rem .5rem; border-radius:999px; font-size:.75rem; font-weight:600; }
.tag.brand { background: rgba(71,87,230,.12); color: var(--brand); }
.tag.teal { background: rgba(14,165,183,.12); color: var(--brand-accent); }
.case-list { margin-top:.5rem; }
.case-list li { margin:.2rem 0; }

/* Section headings: subtle divider */
.section h2 + .underline-accent { margin-bottom: .5rem; }

/* Check-list pattern for readable bullets */
.list-check { margin-top: .5rem; }
.list-check li { display:flex; gap:.5rem; align-items:flex-start; margin:.25rem 0; }
.list-check svg { width: 16px; height: 16px; color: var(--brand); margin-top: .2rem; flex: 0 0 auto; }

/* === Typography upgrades === */
html { font-size: 16.5px; }
@media (min-width:1024px){ html { font-size: 17px; } }
h1, .h1 { letter-spacing: -.01em; }
h2, .h2 { letter-spacing: -.005em; }
.section h2 { font-size: clamp(1.9rem, 2.2vw, 2.35rem); }

/* === Section rhythm (light alternates) === */
.section.alt { background: var(--bg-section); }
.section.alt-2 { background: #eef2f9; }

/* === Logos: full color + larger === */
.logo-tile { height: 72px; }
.logo-img { max-height: 44px; width: auto; object-fit: contain; filter: none; opacity: 0.95; }
.logo-tile:hover .logo-img { opacity: 1; }

/* === Logo carousel === */
.logo-carousel { position: relative; overflow: hidden; background: #fff; border:1px solid var(--border); border-radius: 12px; padding: 14px; }
.logo-track { display: flex; gap: 28px; align-items: center; will-change: transform; }
.logo-item { flex: 0 0 auto; display:grid; place-items:center; width:180px; height:60px; }
@media (prefers-reduced-motion: reduce) { .logo-track { transition: none !important; } }

/* === Sticky assessment sidebar (desktop) === */
.assessment-wrap { display: grid; gap: 2rem; }
@media (min-width: 1024px) {
  .assessment-grid { display: grid; grid-template-columns: 1fr 560px; gap: 2rem; }
  .assessment-sticky { position: sticky; top: 96px; }
  .assessment-sticky .card { box-shadow: var(--shadow-lg); }
}

@media (min-width: 1280px) {
  .assessment-grid { grid-template-columns: 1fr 600px; }
}
@media (min-width: 1536px) {
  .assessment-grid { grid-template-columns: 1fr 640px; }
}

/* Compact form styling for enterprise density */
.form-compact .form-field { gap: .35rem; }
.form-compact .form-field > span { font-size: .9rem; color: #334155; }
.form-compact .form-field input, .form-compact .form-field select { padding: .65rem .9rem; }

/* === CTA emphasis === */
.btn { font-size: 1rem; padding: 1rem 1.25rem; }
.btn.btn-lg { font-size: 1.05rem; padding: 1.05rem 1.35rem; }

/* === Charts section: make bars pop on light backgrounds === */
.progress { background: #E6ECF8; }
.progress > span { background: linear-gradient(90deg, var(--brand), var(--brand-accent)); }

/* === Floating mobile CTA === */
.floating-cta { position: fixed; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 40; box-shadow: var(--shadow-lg); }
@media (min-width: 1024px) { .floating-cta { display: none; } }

/* Back to top button (mobile) */
.back-to-top { position: fixed; left: 16px; bottom: calc(76px + env(safe-area-inset-bottom)); z-index: 40; background: rgba(15,23,42,.9); color:#fff; border:1px solid rgba(255,255,255,.15); border-radius: 999px; width: 44px; height: 44px; display: grid; place-items: center; box-shadow: var(--shadow-lg); opacity: 0; pointer-events: none; transition: opacity .2s ease; }
.back-to-top.show { opacity: 1; pointer-events: auto; }
@media (min-width: 1024px) { .back-to-top { display: none; } }

/* === Dark section helper and variants === */
.section-dark { background: linear-gradient(180deg, #0F172A 0%, #1A2540 100%); color: var(--text-on-dark); }
.section-dark h2, .section-dark h3, .section-dark h4 { color: #fff; }
.section-dark .card { background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.12); color: #DCE3F3; }
.section-dark .card h4 { color: #fff; }
.section-dark .text-slate-600, .section-dark .text-slate-700 { color: #C7D2EB !important; }
.section-dark .icon-on-dark { color: #AFC2FF; }

/* Optional accent for Recent Network Additions */
.section-recent { border-top: 3px solid rgba(79,70,229,.25); }

/* Path step accents */
.process-step { position: relative; border-color: #D9E0FF; }
.process-step::before { content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background: linear-gradient(180deg, var(--brand) 0%, var(--brand-accent) 100%); border-top-left-radius:.75rem; border-bottom-left-radius:.75rem; }