/* Crédit Auto Solutions — UX des articles. Chargée après Oxygen, sur les articles seulement. */

/* ---- Colonne de lecture : 720 -> 980 px, corps 18 px, gouttières réduites ------------ */
.casbx-page .casb-narrow { max-width: calc(980px + var(--gut) + var(--gut)); }
.casbx-page .casb-shell { --gut: clamp(16px, 3vw, 28px); }
.casbx-page .casb-prose { font-size: 18px; line-height: 1.72; }
.casbx-page .casb-prose h2 { font-size: clamp(24px, 2.6vw, 32px); }
@media (max-width: 767px) { .casbx-page .casb-prose { font-size: 16.5px; } }

/* ---- Bandeau de confiance ------------------------------------------------------------ */
.casbx-trust {
  display: flex; flex-wrap: wrap; gap: 8px 10px;
  list-style: none; margin: 0 0 1.6em; padding: 0;
}
.casbx-trust li {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13.5px; font-weight: 600; color: var(--cas-ink-2);
  padding: 7px 13px; border-radius: 99px;
  background: var(--cas-tint); border: 1px solid #dbe6fe;
  margin: 0;
}
.casbx-trust li::before {
  content: ""; width: 7px; height: 7px; border-radius: 50%;
  background: var(--cas-green); flex: none;
}
.casbx-trust li strong { color: var(--cas-ink); font-weight: 800; }

/* ---- Icônes en ligne dans les listes ---- */
.casbx-ico { width: 18px; height: 18px; display: inline-block; vertical-align: -3px; margin-right: 6px; flex: none; }

/* ---- Figures SVG ---------------------------------------------------------------------- */
.casbx-fig { margin: 1.8em 0 2em; }
.casbx-fig svg { display: block; width: 100%; height: auto; font-family: var(--cas-font); }
.casbx-fig figcaption { font-size: 13.5px; color: var(--cas-muted); margin-top: 10px; line-height: 1.5; }

/* ---- Bandeau d'appel en cours de lecture ---------------------------------------------- */
.casbx-band {
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  margin: 2.4em 0; padding: 26px 28px;
  color: #fff; border-radius: 20px;
  background: linear-gradient(135deg, var(--cas-blue-lite), var(--cas-blue));
  box-shadow: 0 18px 40px -22px rgba(29, 78, 216, .7);
}
.casbx-band p { margin: 0; }
.casbx-band-h { font-size: 20px; font-weight: 800; letter-spacing: -0.015em; line-height: 1.25; }
.casbx-band-p { font-size: 15px; margin-top: 6px !important; opacity: .92; line-height: 1.5; }
.casbx-band-act { display: flex; flex-direction: column; align-items: center; gap: 8px; flex: none; }
.casbx-band .casbx-tel { color: #fff; font-size: 13px; font-weight: 600; opacity: .9; text-decoration: none; white-space: nowrap; }
.casbx-band .casbx-tel:hover { text-decoration: underline; color: #fff; }
@media (max-width: 767px) {
  .casbx-band { flex-direction: column; align-items: stretch; padding: 22px 20px; }
  .casbx-band-act { align-items: stretch; }
}

/* ---- Boutons --------------------------------------------------------------------------- */
.casbx-btn {
  display: inline-flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 15px; text-decoration: none !important;
  padding: 13px 22px; border-radius: 99px;
  color: var(--cas-blue) !important; background: #fff;
  box-shadow: 0 10px 24px -12px rgba(8, 18, 45, .5);
  transition: transform .15s ease;
  white-space: nowrap;
}
.casbx-btn:hover { transform: translateY(-1px); }
.casbx-btn-full { width: 100%; }

/* ---- Formulaire en ligne --------------------------------------------------------------- */
.casbx-form {
  margin: 3em 0 0; padding: clamp(28px, 4vw, 44px) clamp(18px, 3vw, 36px);
  border-radius: 24px; background: var(--cas-band); border: 1px solid var(--cas-line);
  scroll-margin-top: 90px;
  text-align: center;
}
.casbx-form-kicker { font-size: 12.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--cas-blue); margin: 0 0 8px !important; }
.casbx-form-h { font-size: clamp(22px, 2.4vw, 28px) !important; margin: 0 0 10px !important; }
.casbx-form-p { max-width: 560px; margin: 0 auto 26px !important; color: var(--cas-muted); font-size: 16px; }
.casbx-form .pq-card { text-align: left; box-shadow: 0 30px 60px -36px rgba(15, 40, 90, .35); border-color: var(--cas-line); }

/* ---- Barre d'appel (mobile) ------------------------------------------------------------ */
.casbx-mbar {
  display: none;
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 20;
  gap: 10px; padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
  background: rgba(255, 255, 255, .96); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  border-top: 1px solid var(--cas-line);
  transform: translateY(110%); transition: transform .25s ease;
}
.casbx-mbar.casbx-on { transform: none; }
@media (max-width: 767px) { .casbx-mbar { display: flex; } .casbx-page .casb-body { padding-bottom: 72px; } }
.casbx-mbar .casbx-btn { flex: 1; color: #fff !important; background: linear-gradient(135deg, var(--cas-blue-lite), var(--cas-blue)); box-shadow: none; }
.casbx-mbar-tel {
  flex: none; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  padding: 13px 18px; border-radius: 99px; border: 1.5px solid var(--cas-line);
  font-weight: 700; font-size: 15px; color: var(--cas-ink) !important; text-decoration: none !important;
}
.casbx-mbar-tel::before {
  content: ""; width: 15px; height: 15px; background: var(--cas-green);
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M6.6 10.8a15.1 15.1 0 006.6 6.6l2.2-2.2a1 1 0 011-.25c1.1.37 2.3.57 3.6.57a1 1 0 011 1V20a1 1 0 01-1 1A17 17 0 013 4a1 1 0 011-1h3.5a1 1 0 011 1c0 1.25.2 2.45.57 3.57a1 1 0 01-.25 1z'/></svg>") center/contain no-repeat;
          mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M6.6 10.8a15.1 15.1 0 006.6 6.6l2.2-2.2a1 1 0 011-.25c1.1.37 2.3.57 3.6.57a1 1 0 011 1V20a1 1 0 01-1 1A17 17 0 013 4a1 1 0 011-1h3.5a1 1 0 011 1c0 1.25.2 2.45.57 3.57a1 1 0 01-.25 1z'/></svg>") center/contain no-repeat;
}

/* Le gabarit a déjà un bloc CTA de fin qui renvoyait à l'accueil ; le formulaire en ligne le
 * remplace, on le masque pour ne pas inviter deux fois de suite. */
.casbx-page .casb-cta { display: none; }
