/* ===== HOME — HERO ===== */
.hero--home {
  background-color: var(--color-night);
  min-height: auto;
  padding-bottom: 0;
}

.hero-content--centered {
  max-width: 720px;
  text-align: left;
}

.hero-eyebrow {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  margin-bottom: var(--space-6);
}

/* Cacher le saut de ligne forcé sur mobile */
@media (max-width: 767px) {
  .hero--home h1 br { display: none; }
  .hero-content--centered { text-align: center; }
  .hero-ctas { justify-content: center; }
}

/* ===== HERO SHOWCASE — strip pleine largeur ===== */
.hero-showcase {
  position: relative;
  width: 100%;
  overflow: hidden;
  padding-block: var(--space-10);
  margin-top: var(--space-12);
}

/* Gradient fades sur les bords */
.hero-showcase::before,
.hero-showcase::after {
  content: '';
  position: absolute;
  top: 0; bottom: 0;
  width: 180px;
  z-index: 2;
  pointer-events: none;
}
.hero-showcase::before {
  left: 0;
  background: linear-gradient(to right, var(--color-night) 0%, transparent 100%);
}
.hero-showcase::after {
  right: 0;
  background: linear-gradient(to left, var(--color-night) 0%, transparent 100%);
}

/* Track scrollant */
.hero-track {
  display: flex;
  gap: 20px;
  width: max-content;
  animation: scrollCards 40s linear infinite;
}

.hero-track:hover {
  animation-play-state: paused;
}

@keyframes scrollCards {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* ===== SERVICE CARDS ===== */
.sc-card {
  width: 260px;
  height: 310px;
  flex-shrink: 0;
  background: var(--color-night2);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: var(--radius-xl);
  overflow: hidden;
  position: relative;
  cursor: default;
  transition: border-color var(--transition-base), box-shadow var(--transition-base), transform var(--transition-base);
}

.sc-card:hover {
  border-color: rgba(0, 255, 178, 0.25);
  box-shadow: 0 0 30px rgba(0, 255, 178, 0.08);
  transform: translateY(-6px);
}

.sc-card--featured {
  border-color: rgba(0, 255, 178, 0.2);
  box-shadow: 0 0 40px rgba(0, 255, 178, 0.1);
}

/* Chrome navigateur */
.sc-chrome {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  background: rgba(255, 255, 255, 0.025);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.sc-dots { display: flex; gap: 5px; }
.sc-dots span { width: 8px; height: 8px; border-radius: 50%; }
.sc-dots span:nth-child(1) { background: #FF5F57; opacity: .7; }
.sc-dots span:nth-child(2) { background: #FEBC2E; opacity: .7; }
.sc-dots span:nth-child(3) { background: #28C840; opacity: .5; }

.sc-url {
  flex: 1;
  font-family: var(--font-outfit);
  font-size: 9px;
  color: var(--color-slate2);
  background: rgba(255, 255, 255, 0.04);
  border-radius: 3px;
  padding: 2px 8px;
  text-align: center;
  letter-spacing: .04em;
}

/* Corps */
.sc-body {
  padding: 14px;
  overflow: hidden;
  /* laisse de la place pour le label absolu en bas */
  padding-bottom: 44px;
}

/* Label bas de carte */
.sc-label {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  padding: 28px 14px 12px;
  background: linear-gradient(to top, rgba(17,24,39,1) 55%, transparent);
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 12px;
  color: var(--color-white);
}

.sc-tag {
  font-family: var(--font-outfit);
  font-size: 9px;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: 2px 7px;
  border-radius: var(--radius-full);
}

.sc-tag--green {
  background: rgba(0,255,178,.1);
  color: var(--color-green);
  border: 1px solid rgba(0,255,178,.2);
}

.sc-tag--purple {
  background: rgba(124,58,237,.15);
  color: var(--color-purple);
  border: 1px solid rgba(124,58,237,.25);
}

/* ── Mini nav ── */
.sc-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}

.sc-logo-bar { width: 44px; height: 5px; background: linear-gradient(90deg,var(--color-green),rgba(0,255,178,.2)); border-radius: 3px; }
.sc-logo-bar--purple { background: linear-gradient(90deg,var(--color-purple),rgba(124,58,237,.2)); }

.sc-nav-links { display: flex; gap: 5px; }
.sc-nav-links span { width: 18px; height: 4px; background: rgba(255,255,255,.08); border-radius: 2px; }

.sc-nav-cta { width: 40px; height: 16px; background: var(--color-green); border-radius: 3px; opacity: .85; }
.sc-nav-cta--purple { background: var(--color-purple); }

/* ── Hero area (vitrine) ── */
.sc-hero-area {
  border-radius: 8px;
  padding: 12px;
  margin-bottom: 10px;
}
.sc-hero-area--green {
  background: linear-gradient(135deg, rgba(0,255,178,.06) 0%, transparent 70%);
  border: 1px solid rgba(0,255,178,.08);
}

/* ── Lines ── */
.sc-line { border-radius: 3px; background: rgba(255,255,255,.1); margin-bottom: 5px; height: 5px; }
.sc-line:last-child { margin-bottom: 0; }
.sc-line--xl  { width: 92%; height: 8px; }
.sc-line--lg  { width: 75%; }
.sc-line--md  { width: 60%; }
.sc-line--sm  { width: 45%; }
.sc-line--xs  { width: 30%; height: 4px; }
.sc-line--accent { background: rgba(0,255,178,.3); }
.sc-line--green  { background: rgba(0,255,178,.4); }
.sc-line--white  { background: rgba(255,255,255,.25); }

/* ── Boutons mini ── */
.sc-btns { display: flex; gap: 6px; margin-top: 10px; }
.sc-btn-p { width: 58px; height: 18px; background: var(--color-green); border-radius: 4px; opacity: .9; }
.sc-btn-g { width: 66px; height: 18px; border: 1px solid rgba(255,255,255,.15); border-radius: 4px; }

/* ── Grid 3 features ── */
.sc-grid-3 { display: grid; grid-template-columns: repeat(3,1fr); gap: 6px; }
.sc-feature { background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.06); border-radius: 6px; padding: 8px 6px; }
.sc-feature-icon { width: 16px; height: 16px; border-radius: 4px; margin-bottom: 6px; }
.sc-feature-icon--green  { background: rgba(0,255,178,.2); }
.sc-feature-icon--purple { background: rgba(124,58,237,.2); }

/* ── E-commerce products ── */
.sc-products { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.sc-product { background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.05); border-radius: 6px; padding: 6px; }
.sc-product-img { width: 100%; height: 52px; border-radius: 4px; }
.sc-product-img--1 { background: linear-gradient(135deg, rgba(0,255,178,.15), rgba(0,255,178,.05)); }
.sc-product-img--2 { background: linear-gradient(135deg, rgba(124,58,237,.2), rgba(124,58,237,.05)); }
.sc-product-img--3 { background: linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.02)); }
.sc-price { width: 40px; height: 5px; background: var(--color-green); border-radius: 2px; margin-top: 5px; opacity: .7; }
.sc-price--purple { background: var(--color-purple); }

/* ── Chat (IA) ── */
.sc-chat { display: flex; flex-direction: column; gap: 8px; }
.sc-chat-bubble { display: flex; gap: 6px; align-items: flex-start; }
.sc-chat-bubble--user { justify-content: flex-end; }
.sc-chat-avatar { width: 20px; height: 20px; border-radius: 50%; background: linear-gradient(135deg,var(--color-green),var(--color-purple)); flex-shrink: 0; }
.sc-chat-text { background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.07); border-radius: 8px; padding: 6px 8px; display: flex; flex-direction: column; gap: 4px; max-width: 80%; }
.sc-chat-text--user { background: rgba(124,58,237,.2); border-color: rgba(124,58,237,.25); }
.sc-chat-input { display: flex; gap: 6px; align-items: center; margin-top: 4px; }
.sc-chat-input-bar { flex: 1; height: 24px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); border-radius: 12px; }
.sc-chat-send { width: 24px; height: 24px; border-radius: 50%; background: var(--color-purple); opacity: .8; }

/* ── Sécurité ── */
.sc-security { display: flex; flex-direction: column; gap: 8px; }
.sc-sec-header { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.sc-shield { width: 28px; height: 28px; border-radius: 6px; background: rgba(0,255,178,.1); border: 1px solid rgba(0,255,178,.2); flex-shrink: 0; }
.sc-sec-row { display: flex; align-items: center; gap: 8px; padding: 5px 0; border-bottom: 1px solid rgba(255,255,255,.04); }
.sc-sec-dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; }
.sc-sec-dot--green { background: var(--color-green); box-shadow: 0 0 6px rgba(0,255,178,.5); }
.sc-grade { font-family: var(--font-display); font-weight: 700; font-size: 10px; margin-left: auto; flex-shrink: 0; }
.sc-grade--a { color: var(--color-green); }

/* ── Pack ── */
.sc-pack { display: flex; flex-direction: column; gap: 8px; }
.sc-pack-badge { font-family: var(--font-outfit); font-size: 9px; font-weight: 600; letter-spacing: .08em; color: #FBBF24; background: rgba(251,191,36,.1); border: 1px solid rgba(251,191,36,.2); border-radius: var(--radius-full); padding: 2px 8px; display: inline-block; width: fit-content; }
.sc-pack-title { height: 9px; width: 80%; background: rgba(255,255,255,.12); border-radius: 4px; }
.sc-pack-price { height: 14px; width: 55%; background: linear-gradient(90deg,rgba(0,255,178,.5),rgba(0,255,178,.2)); border-radius: 4px; }
.sc-pack-features { display: flex; flex-direction: column; gap: 6px; }
.sc-feat { display: flex; align-items: center; gap: 6px; }
.sc-check { color: var(--color-green); font-size: 10px; font-weight: 700; flex-shrink: 0; }
.sc-pack-cta { height: 22px; background: var(--color-green); border-radius: 5px; margin-top: 4px; opacity: .9; }


/* ===== CARD VISUAL IDENTITIES — fonds vifs, contraste avec le hero sombre ===== */

/* ── Overrides communes aux cartes à fond clair ──
   Les lignes squelette (blanc sur sombre) deviennent sombres sur fond clair */
.sc-card--warm .sc-line,
.sc-card--rose .sc-line,
.sc-card--blue .sc-line,
.sc-card--gold .sc-line,
.sc-card--violet .sc-line { background: rgba(0,0,0,.1); }

.sc-card--warm .sc-url,
.sc-card--rose .sc-url,
.sc-card--blue .sc-url,
.sc-card--gold .sc-url,
.sc-card--violet .sc-url { color: rgba(0,0,0,.38); background: rgba(0,0,0,.05); }

.sc-card--warm .sc-nav-links span,
.sc-card--rose .sc-nav-links span,
.sc-card--blue .sc-nav-links span,
.sc-card--gold .sc-nav-links span,
.sc-card--violet .sc-nav-links span { background: rgba(0,0,0,.12); }

.sc-card--warm .sc-label span:first-child,
.sc-card--rose .sc-label span:first-child,
.sc-card--blue .sc-label span:first-child,
.sc-card--gold .sc-label span:first-child,
.sc-card--violet .sc-label span:first-child { color: #1E293B; }

.sc-card--warm .sc-feature,
.sc-card--rose .sc-feature,
.sc-card--blue .sc-feature,
.sc-card--gold .sc-feature,
.sc-card--violet .sc-feature { background: rgba(0,0,0,.04); border-color: rgba(0,0,0,.08); }

.sc-card--warm .sc-product,
.sc-card--rose .sc-product,
.sc-card--blue .sc-product,
.sc-card--gold .sc-product,
.sc-card--violet .sc-product { background: rgba(0,0,0,.03); border-color: rgba(0,0,0,.07); }

.sc-card--warm .sc-sec-row,
.sc-card--rose .sc-sec-row,
.sc-card--blue .sc-sec-row,
.sc-card--gold .sc-sec-row,
.sc-card--violet .sc-sec-row { border-bottom-color: rgba(0,0,0,.07); }

.sc-card--warm .sc-btn-g,
.sc-card--rose .sc-btn-g,
.sc-card--blue .sc-btn-g,
.sc-card--gold .sc-btn-g,
.sc-card--violet .sc-btn-g { border-color: rgba(0,0,0,.2); }

/* ── Warm / Artisan "Atelier Bois" — orange #F97316 ── */
.sc-card--warm { background: #FEF8F0; border-color: rgba(249,115,22,.3); }
.sc-card--warm:hover {
  border-color: rgba(249,115,22,.55);
  box-shadow: 0 8px 32px rgba(249,115,22,.18), 0 0 0 1px rgba(249,115,22,.18);
  transform: translateY(-6px);
}
.sc-card--warm .sc-chrome { background: #FDEBD6; border-bottom-color: rgba(249,115,22,.18); }
.sc-card--warm .sc-label { background: linear-gradient(to top, #FEF8F0 55%, transparent); }
.sc-card--warm .sc-line--orange { background: rgba(249,115,22,.6); }
.sc-card--warm .sc-hero-area--orange {
  background: linear-gradient(135deg, rgba(249,115,22,.12) 0%, transparent 70%);
  border: 1px solid rgba(249,115,22,.2);
}

/* ── Rose / Fashion "Maison Éclat" — rose #EC4899 ── */
.sc-card--rose { background: #FFF0F7; border-color: rgba(236,72,153,.3); }
.sc-card--rose:hover {
  border-color: rgba(236,72,153,.55);
  box-shadow: 0 8px 32px rgba(236,72,153,.18), 0 0 0 1px rgba(236,72,153,.18);
  transform: translateY(-6px);
}
.sc-card--rose .sc-chrome { background: #FFE0F0; border-bottom-color: rgba(236,72,153,.18); }
.sc-card--rose .sc-label { background: linear-gradient(to top, #FFF0F7 55%, transparent); }

/* ── Blue / Tech "FluxIA" — sky blue #0EA5E9 ── */
.sc-card--blue { background: #F0F9FF; border-color: rgba(14,165,233,.3); }
.sc-card--blue:hover {
  border-color: rgba(14,165,233,.55);
  box-shadow: 0 8px 32px rgba(14,165,233,.18), 0 0 0 1px rgba(14,165,233,.18);
  transform: translateY(-6px);
}
.sc-card--blue .sc-chrome { background: #DCEEFF; border-bottom-color: rgba(14,165,233,.18); }
.sc-card--blue .sc-label { background: linear-gradient(to top, #F0F9FF 55%, transparent); }
.sc-card--blue .sc-chat-text { background: rgba(14,165,233,.1); border-color: rgba(14,165,233,.18); }
.sc-card--blue .sc-chat-input-bar { background: rgba(14,165,233,.08); border-color: rgba(14,165,233,.15); }

/* ── Gold / Corporate "FortiCore" — amber #D97706 ── */
.sc-card--gold { background: #FFFBF0; border-color: rgba(217,119,6,.3); }
.sc-card--gold:hover {
  border-color: rgba(217,119,6,.55);
  box-shadow: 0 8px 32px rgba(217,119,6,.18), 0 0 0 1px rgba(217,119,6,.18);
  transform: translateY(-6px);
}
.sc-card--gold .sc-chrome { background: #FFF3D0; border-bottom-color: rgba(217,119,6,.18); }
.sc-card--gold .sc-label { background: linear-gradient(to top, #FFFBF0 55%, transparent); }
.sc-card--gold .sc-line--gold { background: rgba(217,119,6,.6); }

/* ── Violet / Creative "NovaLaunch" — violet #7C3AED ── */
.sc-card--violet { background: #F5F0FF; border-color: rgba(124,58,237,.3); }
.sc-card--violet:hover {
  border-color: rgba(124,58,237,.55);
  box-shadow: 0 8px 32px rgba(124,58,237,.18), 0 0 0 1px rgba(124,58,237,.18);
  transform: translateY(-6px);
}
.sc-card--violet .sc-chrome { background: #EAE0FF; border-bottom-color: rgba(124,58,237,.18); }
.sc-card--violet .sc-label { background: linear-gradient(to top, #F5F0FF 55%, transparent); }
.sc-card--violet.sc-card--featured { border-color: rgba(124,58,237,.4); box-shadow: 0 0 40px rgba(124,58,237,.18); }

/* ── Logo bars ── */
.sc-logo-bar--orange { background: linear-gradient(90deg, #F97316, rgba(249,115,22,.2)); }
.sc-logo-bar--rose   { background: linear-gradient(90deg, #EC4899, rgba(236,72,153,.2)); }
.sc-logo-bar--cyan   { background: linear-gradient(90deg, #0EA5E9, rgba(14,165,233,.2)); }
.sc-logo-bar--gold   { background: linear-gradient(90deg, #D97706, rgba(217,119,6,.2)); }
.sc-logo-bar--violet { background: linear-gradient(90deg, #7C3AED, rgba(124,58,237,.2)); }

/* ── Nav CTAs ── */
.sc-nav-cta--orange { background: #F97316; }
.sc-nav-cta--rose   { background: #EC4899; }
.sc-nav-cta--cyan   { background: #0EA5E9; }
.sc-nav-cta--gold   { background: #D97706; }
.sc-nav-cta--violet { background: #7C3AED; }

/* ── Hero areas ── */
.sc-hero-area--orange { background: linear-gradient(135deg, rgba(249,115,22,.1) 0%, transparent 70%); border: 1px solid rgba(249,115,22,.18); }
.sc-hero-area--cyan   { background: linear-gradient(135deg, rgba(14,165,233,.1)  0%, transparent 70%); border: 1px solid rgba(14,165,233,.18); }

/* ── Accent lines (overrident les valeurs blanches héritées) ── */
.sc-card--warm .sc-line--orange { background: rgba(249,115,22,.65); }
.sc-card--blue .sc-line--cyan   { background: rgba(14,165,233,.65); }
.sc-card--gold .sc-line--gold   { background: rgba(217,119,6,.65); }
.sc-card--violet .sc-line--violet { background: rgba(124,58,237,.65); }

/* ── Feature icons ── */
.sc-feature-icon--orange { background: rgba(249,115,22,.18); }
.sc-feature-icon--rose   { background: rgba(236,72,153,.18); }
.sc-feature-icon--cyan   { background: rgba(14,165,233,.18); }
.sc-feature-icon--gold   { background: rgba(217,119,6,.18); }

/* ── Boutons primaires ── */
.sc-btn-p--orange { background: #F97316; }
.sc-btn-p--cyan   { background: #0EA5E9; }

/* ── Tags (texte foncé pour lisibilité sur fond clair) ── */
.sc-tag--orange { background: rgba(249,115,22,.12); color: #C2410C; border: 1px solid rgba(249,115,22,.28); }
.sc-tag--rose   { background: rgba(236,72,153,.12); color: #9D174D; border: 1px solid rgba(236,72,153,.28); }
.sc-tag--cyan   { background: rgba(14,165,233,.12);  color: #0369A1; border: 1px solid rgba(14,165,233,.28); }
.sc-tag--gold   { background: rgba(217,119,6,.12);  color: #92400E; border: 1px solid rgba(217,119,6,.28); }
.sc-tag--violet { background: rgba(124,58,237,.12);  color: #5B21B6; border: 1px solid rgba(124,58,237,.28); }

/* ── Produits e-commerce (rose palette) ── */
.sc-product-img--rose1 { background: linear-gradient(135deg, rgba(236,72,153,.28), rgba(236,72,153,.08)); }
.sc-product-img--rose2 { background: linear-gradient(135deg, rgba(124,58,237,.22), rgba(236,72,153,.1)); }
.sc-product-img--rose3 { background: linear-gradient(135deg, rgba(236,72,153,.16), rgba(251,207,232,.15)); }
.sc-price--rose   { background: #EC4899; }
.sc-price--violet { background: #7C3AED; }

/* ── Chat (FluxIA / cyan) ── */
.sc-chat-avatar--cyan { background: linear-gradient(135deg, #0EA5E9, #0284C7); }
.sc-chat-text--user--cyan { background: rgba(14,165,233,.18); border-color: rgba(14,165,233,.28); }
.sc-chat-send--cyan { background: #0EA5E9; }

/* ── Sécurité (FortiCore / gold) ── */
.sc-shield--gold { background: rgba(217,119,6,.12); border: 1px solid rgba(217,119,6,.28); }
.sc-sec-dot--gold { background: #D97706; box-shadow: 0 0 6px rgba(217,119,6,.4); }
.sc-grade--gold { color: #D97706; }

/* ── Pack (NovaLaunch / violet) ── */
.sc-pack-badge--violet { color: #7C3AED; background: rgba(124,58,237,.1); border-color: rgba(124,58,237,.22); }
.sc-pack-price--violet { background: linear-gradient(90deg, rgba(124,58,237,.55), rgba(124,58,237,.2)); }
.sc-check--violet { color: #7C3AED; }
.sc-pack-cta--violet { background: #7C3AED; }

/* ===== VALUE PROPS ===== */
.value-props {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-5);
}

@media (min-width: 768px) {
  .value-props {
    grid-template-columns: repeat(3, 1fr);
  }
}

.value-prop {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4);
}

.value-prop-icon {
  width: 48px;
  height: 48px;
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
}

.value-prop-icon--green {
  background-color: rgba(0, 255, 178, 0.1);
  color: var(--color-green);
}

.value-prop-icon--purple {
  background-color: rgba(124, 58, 237, 0.1);
  color: var(--color-purple);
}

.value-prop h3 {
  font-size: var(--text-lg);
  margin-bottom: var(--space-2);
}

.value-prop p {
  font-size: var(--text-sm);
}

/* ===== FEATURED PACKS ===== */
.pack-preview-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-6);
  margin-bottom: var(--space-8);
}

@media (min-width: 768px) {
  .pack-preview-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

.pack-preview-card {
  position: relative;
}

.pack-badge-corner {
  position: absolute;
  top: var(--space-4);
  right: var(--space-4);
}

.pack-cta-row {
  text-align: center;
}

/* ===== SERVICES GRID ===== */
.services-preview-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-4);
}

@media (min-width: 768px) {
  .services-preview-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.service-mini-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-5);
}

.service-mini-icon {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-sm);
}

.service-mini-card h4 {
  font-size: var(--text-base);
}

.service-mini-card p {
  font-size: var(--text-xs);
}

/* ===== WHY WEBONESS ===== */
.why-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-6);
  align-items: center;
}

@media (min-width: 1024px) {
  .why-grid {
    grid-template-columns: 1fr 1fr;
    gap: var(--space-16);
  }
}

.why-items {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.why-item {
  display: flex;
  gap: var(--space-4);
  align-items: flex-start;
}

.why-item-icon {
  width: 44px;
  height: 44px;
  min-width: 44px;
  border-radius: var(--radius-md);
  background-color: rgba(0, 255, 178, 0.08);
  border: 1px solid rgba(0, 255, 178, 0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-green);
  margin-top: 2px;
}

.why-item h4 {
  font-size: var(--text-base);
  margin-bottom: var(--space-1);
}

.why-item p {
  font-size: var(--text-sm);
}

.why-stats {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-5);
}

.why-stat-card {
  text-align: center;
  padding: var(--space-6);
}

/* ===== TESTIMONIALS ===== */
.testimonials-placeholder {
  text-align: center;
  padding: var(--space-12);
  border: 1px dashed rgba(255, 255, 255, 0.1);
  border-radius: var(--radius-lg);
}

/* ===== FINAL CTA SECTION ===== */
.cta-section {
  text-align: center;
  position: relative;
  overflow: hidden;
}

.cta-section h2 {
  font-size: clamp(1.75rem, 3.5vw, 3rem);
  margin-bottom: var(--space-4);
}

.cta-section p {
  max-width: 520px;
  margin-inline: auto;
  margin-bottom: var(--space-8);
  font-size: var(--text-lg);
}

.cta-section .halo--green {
  width: 500px;
  height: 300px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}