/* Pages "usages" par persona - styles specifiques. Chargees sur .Section "usages". */
.usage-page { color: #1d184e; }

/* HERO : texte a gauche, image a droite (desktop) */
.usage-hero { max-width: 1200px; margin: 0 auto; padding: 2.5rem 1.25rem 1rem; display: flex; flex-direction: column; gap: 2rem; }
.usage-hero h1 { margin: 0.5rem 0 0.75rem; }
.usage-lede { font-size: 1.2rem; line-height: 1.55; color: #1d184e; max-width: 40rem; }
.usage-hero-cta { display: flex; flex-wrap: wrap; gap: 0.75rem; margin: 1.25rem 0 0; }
.usage-trust { list-style: none; display: flex; flex-wrap: wrap; gap: 0.5rem 1.1rem; padding: 0; margin: 1.25rem 0 0; font-size: 0.875rem; }
.usage-trust strong { color: #634cfa; }
.usage-hero-media { width: 100%; }
.usage-hero-img { width: 100%; border-radius: 16px; box-shadow: 0 4px 16px rgba(0,0,0,0.1); }
@media (min-width: 1024px) {
  .usage-hero { flex-direction: row; align-items: center; padding: 3.5rem 1.25rem 1.5rem; }
  .usage-hero-text { flex: 1 1 55%; }
  .usage-hero-media { flex: 1 1 45%; }
}

/* BODY : prose lisible, max-width confort */
.usage-body { max-width: 820px; margin: 1.5rem auto 0; padding: 0 1.25rem; line-height: 1.65; }
.usage-body h2 { margin: 2.5rem 0 1rem; }
.usage-body h3 { margin: 1.75rem 0 0.6rem; }
.usage-body p { margin: 0 0 1.1rem; }
.usage-body ul { margin: 0 0 1.2rem 1.25rem; list-style: disc; }
.usage-body li { margin: 0.35rem 0; }
.usage-body a { color: #634cfa; }
.usage-body table { width: 100%; border-collapse: collapse; margin: 1.5rem 0; font-size: 0.95rem; }
.usage-body th, .usage-body td { border: 1px solid #e8e4f0; padding: 0.65rem 0.85rem; text-align: left; vertical-align: top; }
.usage-body thead th { background: #f8f8fa; color: #1d184e; }

/* Encart "le bon calcul" */
.usage-body .usage-value { background: #f1eefe; border-left: 4px solid #634cfa; border-radius: 12px; padding: 1.25rem 1.5rem; margin: 1.75rem 0; }
.usage-body .usage-value strong { color: #1d184e; }

/* FAQ : reutilise .details/.lightpurpleback-cont du site */
.usage-faq { max-width: 980px; margin: 2.5rem auto 0; padding: 0 1.25rem; }
.usage-faq-head h2 { text-align: center; }

/* CTA bottom : 3 cartes */
.usage-cta-bottom { max-width: 1100px; margin: 3rem auto 4rem; padding: 0 1.25rem; }
.usage-cta-grid { display: grid; grid-template-columns: 1fr; gap: 1rem; }
.usage-cta-card { display: block; background: #fff; border: 1px solid #e8e4f0; border-radius: 16px; padding: 1.5rem; text-decoration: none; color: #1d184e; transition: box-shadow .2s, transform .2s; }
.usage-cta-card:hover { box-shadow: 0 8px 24px rgba(99,76,250,0.12); transform: translateY(-2px); }
.usage-cta-card h3 { margin: 0 0 0.5rem; }
.usage-cta-card .cta-arrow { color: #634cfa; font-weight: 600; }
@media (min-width: 768px) { .usage-cta-grid { grid-template-columns: repeat(3, 1fr); } }