/**
 * Apple-inspired marketing layer — sits after shared-nav-footer.css
 * Typography: system stack. Surfaces: soft neutrals, diffuse shadow, generous rhythm.
 */
:root {
  --cd-apple-bg: #f5f5f7;
  --cd-apple-bg-elevated: #ffffff;
  --cd-apple-text: #1d1d1f;
  --cd-apple-text-secondary: #6e6e73;
  --cd-apple-blue: #0071e3;
  --cd-apple-blue-hover: #0077ed;
  --cd-apple-radius-lg: 18px;
  --cd-apple-radius-md: 12px;
  --cd-apple-radius-pill: 980px;
  --cd-apple-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.04);
  --cd-apple-shadow-md: 0 4px 24px rgba(0, 0, 0, 0.06);
  --cd-apple-shadow-lg: 0 12px 48px rgba(0, 0, 0, 0.08);
  --cd-apple-shadow-nav: 0 1px 0 rgba(255, 255, 255, 0.65) inset, 0 8px 32px rgba(0, 40, 100, 0.06);
  --cd-apple-blur: saturate(180%) blur(20px);
}

html {
  scroll-behavior: smooth;
}

body {
  background: var(--cd-apple-bg);
  color: var(--cd-apple-text);
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: geometricPrecision;
}

/* Feature marketing pages: soft atmospheric wash behind content */
body.cd-feature-page {
  background:
    radial-gradient(ellipse 120% 80% at 50% -25%, rgba(0, 113, 227, 0.07) 0%, transparent 52%),
    radial-gradient(ellipse 70% 55% at 100% 15%, rgba(52, 199, 89, 0.05) 0%, transparent 48%),
    var(--cd-apple-bg);
}

/* ——— Nav: frosted bar, no heavy chrome ——— */
.cd-all-features-nav {
  background: rgba(251, 251, 253, 0.78) !important;
  -webkit-backdrop-filter: var(--cd-apple-blur);
  backdrop-filter: var(--cd-apple-blur);
  border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
  box-shadow: var(--cd-apple-shadow-nav) !important;
}

.cd-all-features-nav .navbar {
  padding-top: 0.65rem !important;
  padding-bottom: 0.65rem !important;
}
/* Mobile menu icon: ensure SVG hamburger is visible if cascade/load order differs on prod */
@media (max-width: 1199.98px) {
  .cd-all-features-nav .cd-nav-toggler {
    color: #1a1d21 !important;
  }
  .cd-all-features-nav .cd-nav-burger__line {
    fill: currentColor !important;
  }
}

.cd-all-features-nav .nav-link {
  font-weight: 400 !important;
  font-size: 0.8125rem !important;
  letter-spacing: -0.01em;
  color: var(--cd-apple-text) !important;
}

.cd-all-features-nav .nav-link:hover,
.cd-all-features-nav .nav-link:focus {
  color: var(--cd-apple-blue) !important;
}

.cd-all-features-nav .nav-link.active:not(.dropdown-toggle) {
  color: var(--cd-apple-blue) !important;
  background: rgba(0, 113, 227, 0.08) !important;
  font-weight: 500 !important;
}

.cd-all-features-nav .nav-link.dropdown-toggle.text-primary {
  color: var(--cd-apple-blue) !important;
}

.cd-features-pill {
  font-size: 0.65rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.06em !important;
  color: var(--cd-apple-text-secondary) !important;
  background: rgba(0, 0, 0, 0.05) !important;
  border-radius: var(--cd-apple-radius-pill) !important;
  padding: 0.32rem 0.75rem !important;
}

.cd-all-features-nav .dropdown-menu {
  border: 1px solid rgba(0, 0, 0, 0.06) !important;
  border-radius: var(--cd-apple-radius-md) !important;
  box-shadow: var(--cd-apple-shadow-lg) !important;
  padding: 0.65rem !important;
}
.cd-all-features-nav .dropdown-menu.cd-features-mega {
  border-radius: var(--cd-apple-radius-lg) !important;
  padding: 0 !important;
  box-shadow: var(--cd-apple-shadow-lg), 0 0 0 1px rgba(0, 0, 0, 0.03) !important;
}
.cd-features-mega__heading {
  color: var(--cd-apple-text-secondary) !important;
}
@media (min-width: 1200px) {
  .cd-features-mega__col + .cd-features-mega__col {
    border-left-color: rgba(0, 0, 0, 0.06) !important;
  }
}

.cd-all-features-nav .dropdown-item {
  font-size: 0.8125rem !important;
  font-weight: 400 !important;
  border-radius: 8px !important;
  color: var(--cd-apple-text) !important;
}

.cd-all-features-nav .dropdown-item:hover,
.cd-all-features-nav .dropdown-item:focus {
  background: rgba(0, 0, 0, 0.04) !important;
  color: var(--cd-apple-text) !important;
}

.cd-all-features-nav .dropdown-item.active {
  background: rgba(0, 113, 227, 0.1) !important;
  color: var(--cd-apple-blue) !important;
  font-weight: 500 !important;
}

.cd-all-features-nav .dropdown-item.cd-features-mega__item {
  display: flex !important;
  align-items: center !important;
  gap: 0.75rem !important;
  font-weight: 400 !important;
}
.cd-all-features-nav .dropdown-item.cd-features-mega__item:hover,
.cd-all-features-nav .dropdown-item.cd-features-mega__item:focus {
  background: rgba(0, 0, 0, 0.045) !important;
  color: var(--cd-apple-text) !important;
}
.cd-all-features-nav .dropdown-item.cd-features-mega__item:hover .cd-features-mega__icon,
.cd-all-features-nav .dropdown-item.cd-features-mega__item:focus .cd-features-mega__icon {
  color: var(--cd-apple-blue) !important;
}
.cd-all-features-nav .dropdown-item.cd-features-mega__item.active {
  background: rgba(0, 113, 227, 0.07) !important;
  color: var(--cd-apple-blue) !important;
  font-weight: 500 !important;
}
.cd-all-features-nav .dropdown-item.cd-features-mega__item.active .cd-features-mega__icon {
  color: var(--cd-apple-blue) !important;
}

.cd-all-features-nav .btn-outline-secondary {
  --bs-btn-border-color: rgba(0, 0, 0, 0.12);
  --bs-btn-color: var(--cd-apple-text);
  font-weight: 400;
  font-size: 0.8125rem;
  border-radius: var(--cd-apple-radius-pill);
}

/* ——— Footer: calmer, more breathable ——— */
.cd-features-site-footer {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", sans-serif !important;
  background: linear-gradient(180deg, #1d1d1f 0%, #000000 100%) !important;
  border-top: none !important;
}

.cd-features-site-footer__top .container {
  padding-top: 4rem !important;
  padding-bottom: 4rem !important;
}

.cd-features-site-footer .cd-footer-heading {
  font-size: 0.72rem !important;
  letter-spacing: 0.14em !important;
  font-weight: 500 !important;
  color: rgba(255, 255, 255, 0.45) !important;
}

.cd-features-site-footer .cd-features-site-footer__lead {
  font-size: 0.9375rem !important;
  line-height: 1.5 !important;
  color: rgba(255, 255, 255, 0.55) !important;
}

.cd-features-site-footer .btn-primary {
  --bs-btn-bg: var(--cd-apple-blue) !important;
  --bs-btn-border-color: var(--cd-apple-blue) !important;
  --bs-btn-hover-bg: var(--cd-apple-blue-hover) !important;
  border-radius: var(--cd-apple-radius-pill) !important;
  font-weight: 500 !important;
  padding: 0.5rem 1.25rem !important;
}

.cd-features-site-footer .btn-outline-light {
  border-radius: var(--cd-apple-radius-pill) !important;
}

/* ——— Page content (all *-lp mains) ——— */
main[class*="-lp"] {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, sans-serif;
  color: var(--cd-apple-text);
  letter-spacing: -0.015em;
}

main[class*="-lp"] .display-4,
main[class*="-lp"] .display-heading {
  font-weight: 600 !important;
  letter-spacing: -0.03em !important;
  line-height: 1.05 !important;
  color: var(--cd-apple-text);
}

main[class*="-lp"] .lead,
main[class*="-lp"] .lead-tight {
  color: var(--cd-apple-text-secondary) !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  letter-spacing: -0.01em !important;
}

main[class*="-lp"] .text-muted {
  color: var(--cd-apple-text-secondary) !important;
}

main[class*="-lp"] .hero-badge {
  font-weight: 500 !important;
  font-size: 0.75rem !important;
  letter-spacing: 0.04em !important;
  border-radius: var(--cd-apple-radius-pill) !important;
  padding: 0.4rem 0.95rem !important;
  border: 1px solid rgba(0, 113, 227, 0.1) !important;
  background: rgba(255, 255, 255, 0.65) !important;
  box-shadow: 0 1px 2px rgba(0, 113, 227, 0.06) !important;
}

main[class*="-lp"] .hero-gradient {
  background-color: #fbfbfd !important;
  background-image:
    radial-gradient(ellipse 85% 65% at 92% 8%, rgba(0, 113, 227, 0.1) 0%, transparent 58%),
    radial-gradient(ellipse 70% 55% at 5% 92%, rgba(52, 199, 89, 0.08) 0%, transparent 52%),
    radial-gradient(ellipse 50% 40% at 50% 50%, rgba(0, 113, 227, 0.03) 0%, transparent 65%),
    linear-gradient(180deg, #eef2f8 0%, #fbfbfd 38%, #ffffff 100%) !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
}

main[class*="-lp"] .floating-card {
  border-radius: var(--cd-apple-radius-lg) !important;
  border: 1px solid rgba(0, 0, 0, 0.06) !important;
  box-shadow: var(--cd-apple-shadow-md) !important;
  background: var(--cd-apple-bg-elevated) !important;
}

main[class*="-lp"] .card {
  border-radius: var(--cd-apple-radius-lg) !important;
  border: 1px solid rgba(0, 0, 0, 0.06) !important;
  box-shadow: var(--cd-apple-shadow-sm) !important;
}

main[class*="-lp"] .section-alt {
  background: #f5f5f7 !important;
}

main[class*="-lp"] .cta-band {
  border-radius: var(--cd-apple-radius-lg) !important;
  background: linear-gradient(145deg, #0066d4 0%, #0071e3 38%, #0077ed 62%, #004a9a 100%) !important;
  box-shadow:
    var(--cd-apple-shadow-md),
    0 0 0 1px rgba(255, 255, 255, 0.12) inset;
}

main[class*="-lp"] .btn-primary {
  --bs-btn-bg: var(--cd-apple-blue);
  --bs-btn-border-color: var(--cd-apple-blue);
  --bs-btn-hover-bg: var(--cd-apple-blue-hover);
  --bs-btn-hover-border-color: var(--cd-apple-blue-hover);
  font-weight: 500 !important;
  border-radius: var(--cd-apple-radius-pill) !important;
  padding: 0.65rem 1.5rem !important;
  letter-spacing: -0.01em;
}

main[class*="-lp"] .btn-outline-primary {
  --bs-btn-color: var(--cd-apple-blue);
  --bs-btn-border-color: var(--cd-apple-blue);
  font-weight: 500 !important;
  border-radius: var(--cd-apple-radius-pill) !important;
}

main[class*="-lp"] .btn-lg {
  padding: 0.75rem 1.65rem !important;
  font-size: 1rem !important;
}

main[class*="-lp"] .link-primary {
  color: var(--cd-apple-blue) !important;
  text-decoration: none !important;
}

main[class*="-lp"] .link-primary:hover {
  text-decoration: underline !important;
}

main[class*="-lp"] h1,
main[class*="-lp"] .h1,
main[class*="-lp"] h2,
main[class*="-lp"] .h1.fw-bold {
  letter-spacing: -0.025em;
}

main[class*="-lp"] .icon-circle {
  border-radius: 14px !important;
}

main[class*="-lp"] .rounded-4 {
  border-radius: var(--cd-apple-radius-lg) !important;
}

/* Feature home: stats / pillar cards (class names from features-home.css) */
main[class*="-lp"] .stat-tile,
main[class*="-lp"] .pillar-card-inner,
main[class*="-lp"] .benefit-card,
main[class*="-lp"] .flow-card:not(.flow-card-rollout) {
  border-radius: var(--cd-apple-radius-lg) !important;
  box-shadow: var(--cd-apple-shadow-sm) !important;
  border: 1px solid rgba(0, 0, 0, 0.05) !important;
}

main[class*="-lp"] .stats-strip {
  border-color: rgba(0, 0, 0, 0.05) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.9) 0%, #f5f5f7 50%, #ffffff 100%) !important;
}

/* Stats strip: icon + label + title — shared by features-home, solution-sellers, solution-fulfillment */
main[class*="-lp"] .stats-strip .row {
  --bs-gutter-x: 1.15rem;
  --bs-gutter-y: 1rem;
}

@media (min-width: 768px) {
  main[class*="-lp"] .stats-strip .row {
    --bs-gutter-x: 1.65rem;
    --bs-gutter-y: 1.15rem;
  }
}

main[class*="-lp"] .stats-strip .stat-tile {
  background: #fff;
  padding: 1.35rem 1rem 1.45rem;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 0.55rem;
  transition:
    box-shadow 0.25s ease,
    transform 0.25s cubic-bezier(0.22, 1, 0.36, 1),
    border-color 0.2s ease;
}

@media (min-width: 768px) {
  main[class*="-lp"] .stats-strip .stat-tile {
    padding: 1.5rem 1.2rem 1.55rem;
    gap: 0.6rem;
  }
}

main[class*="-lp"] .stats-strip .stat-tile:hover {
  box-shadow: 0 0.4rem 1.25rem rgba(0, 40, 100, 0.08) !important;
  transform: translateY(-2px);
  border-color: rgba(0, 113, 227, 0.14) !important;
}

main[class*="-lp"] .stats-strip .stat-icon {
  width: 2.5rem;
  height: 2.5rem;
  margin: 0;
  flex-shrink: 0;
  border-radius: 0.65rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  line-height: 1;
  background: rgba(0, 113, 227, 0.09);
  color: var(--cd-apple-blue);
}

main[class*="-lp"] .stats-strip .stat-tile > .text-muted {
  margin-bottom: 0 !important;
  line-height: 1.4;
}

main[class*="-lp"] .stats-strip .stat-tile > strong {
  margin: 0;
  line-height: 1.35;
}

main[class*="-lp"] .faq-shell {
  background: #fff;
  border-radius: var(--cd-apple-radius-lg);
  border: 1px solid rgba(0, 0, 0, 0.06);
  box-shadow: var(--cd-apple-shadow-sm);
  padding: 1.75rem 1.35rem 2rem;
}

@media (min-width: 768px) {
  main[class*="-lp"] .faq-shell {
    padding: 2.5rem 2.25rem 2.75rem;
  }
}

main[class*="-lp"] .faq-shell .accordion-item {
  border: 1px solid rgba(0, 0, 0, 0.06) !important;
  border-radius: 0.75rem !important;
  overflow: hidden;
  margin-bottom: 0.85rem;
}

main[class*="-lp"] .faq-shell .accordion-item:last-child {
  margin-bottom: 0;
}

main[class*="-lp"] .faq-shell .accordion-button {
  font-weight: 500;
  font-size: 0.95rem;
  line-height: 1.45;
  padding: 1.15rem 1.35rem;
}

@media (min-width: 768px) {
  main[class*="-lp"] .faq-shell .accordion-button {
    padding: 1.25rem 1.5rem;
  }
}

main[class*="-lp"] .faq-shell .accordion-body {
  padding: 0.75rem 1.35rem 1.35rem;
  line-height: 1.65;
}

@media (min-width: 768px) {
  main[class*="-lp"] .faq-shell .accordion-body {
    padding: 0.875rem 1.5rem 1.5rem;
  }
}

/* Tokens for per-page *.css — inherit inside main so CTAs / surfaces match Apple blue */
main[class*="-lp"] {
  --cd-primary: var(--cd-apple-blue);
  --cd-primary-hover: var(--cd-apple-blue-hover);
  --cd-ink: var(--cd-apple-text);
  --cd-muted: var(--cd-apple-text-secondary);
  --cd-surface: #f5f5f7;
}

/* Softer “white” bands (trust row, etc.) */
main[class*="-lp"] section.bg-white {
  background-color: #fbfbfd !important;
}

main[class*="-lp"] .border-bottom.bg-white {
  border-color: rgba(0, 0, 0, 0.06) !important;
}

/* Step numbers: squircle, not full circle */
main[class*="-lp"] .step-num {
  border-radius: 10px !important;
}

/* Trust / logo strip */
main[class*="-lp"] .trust-logos {
  letter-spacing: 0.1em !important;
  font-weight: 500 !important;
  color: var(--cd-apple-text-secondary) !important;
}

/* Bootstrap text-primary → Apple blue inside feature mains */
main[class*="-lp"] .text-primary {
  color: var(--cd-apple-blue) !important;
}

/* Accordions (e.g. features home FAQ) */
main[class*="-lp"] .accordion-button {
  border-radius: var(--cd-apple-radius-md) !important;
  font-weight: 500 !important;
}

main[class*="-lp"] .accordion-item {
  border-radius: var(--cd-apple-radius-md) !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  main[class*="-lp"] .stats-strip .stat-tile:hover {
    transform: none;
  }
}

/* ——— Root language picker (index.html only) ——— */
body.cd-apple-index {
  min-height: 100vh;
  margin: 0;
  padding: clamp(2rem, 6vw, 3.5rem) 1.25rem;
  max-width: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", sans-serif;
  background:
    radial-gradient(ellipse 100% 80% at 50% -35%, rgba(0, 113, 227, 0.14) 0%, transparent 55%),
    radial-gradient(ellipse 60% 50% at 110% 80%, rgba(52, 199, 89, 0.1) 0%, transparent 50%),
    linear-gradient(180deg, #e4eaf2 0%, #f5f5f7 45%, #fbfbfd 100%);
  color: var(--cd-apple-text);
  -webkit-font-smoothing: antialiased;
}

body.cd-apple-index .cd-index-shell {
  width: 100%;
  max-width: 26rem;
  padding: 2rem 1.5rem 1.85rem;
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.78);
  -webkit-backdrop-filter: var(--cd-apple-blur);
  backdrop-filter: var(--cd-apple-blur);
  border: 1px solid rgba(0, 0, 0, 0.06);
  box-shadow:
    var(--cd-apple-shadow-lg),
    0 0 0 1px rgba(255, 255, 255, 0.65) inset;
}

body.cd-apple-index .cd-index-header {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1.25rem;
}

body.cd-apple-index .cd-index-mark {
  flex-shrink: 0;
  width: 3rem;
  height: 3rem;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: #fff;
  background: linear-gradient(145deg, #0071e3 0%, #0058b0 100%);
  box-shadow: 0 4px 14px rgba(0, 113, 227, 0.35);
}

body.cd-apple-index .cd-index-header-text h1 {
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: -0.03em;
  line-height: 1.15;
  margin: 0 0 0.2rem;
}

body.cd-apple-index .cd-index-tagline {
  margin: 0;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  color: var(--cd-apple-text-secondary);
}

body.cd-apple-index .cd-index-intro {
  color: var(--cd-apple-text-secondary);
  line-height: 1.55;
  margin: 0 0 1.35rem;
  font-size: 1rem;
}

body.cd-apple-index .cd-index-intro code {
  font-size: 0.85em;
  padding: 0.1em 0.35em;
  border-radius: 6px;
  background: rgba(0, 0, 0, 0.05);
  border: 1px solid rgba(0, 0, 0, 0.06);
}

body.cd-apple-index ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

body.cd-apple-index li {
  margin-bottom: 0.65rem;
}

body.cd-apple-index a {
  color: var(--cd-apple-blue);
  text-decoration: none;
  font-size: 1.0625rem;
  font-weight: 400;
}

body.cd-apple-index a:hover {
  text-decoration: underline;
}

body.cd-apple-index .cd-lang-card {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

body.cd-apple-index .cd-lang-card a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.9rem 1.1rem;
  border-radius: var(--cd-apple-radius-md);
  background: rgba(255, 255, 255, 0.95);
  border: 1px solid rgba(0, 0, 0, 0.06);
  box-shadow: var(--cd-apple-shadow-sm);
  font-weight: 500;
  font-size: 1rem;
  color: var(--cd-apple-text);
  text-decoration: none;
  transition: box-shadow 0.22s ease, transform 0.22s ease, border-color 0.22s ease;
}

body.cd-apple-index .cd-lang-card a::after {
  content: "";
  width: 0.45rem;
  height: 0.45rem;
  border-right: 2px solid rgba(0, 113, 227, 0.45);
  border-top: 2px solid rgba(0, 113, 227, 0.45);
  transform: rotate(45deg);
  opacity: 0.75;
  flex-shrink: 0;
  margin-left: 0.75rem;
}

body.cd-apple-index .cd-lang-card a:hover {
  text-decoration: none;
  border-color: rgba(0, 113, 227, 0.28);
  box-shadow: var(--cd-apple-shadow-md);
  transform: translateY(-2px);
}

body.cd-apple-index .cd-lang-card a:focus-visible {
  outline: 2px solid var(--cd-apple-blue);
  outline-offset: 2px;
}

body.cd-apple-index .cd-lang-card li {
  margin-bottom: 0;
}