/* =====================================================================
   Composant : bouton d'appel à l'action « Demander un devis »
   Fichier : assets/css/cta.css — chargé par app/views/header.php
   Un SEUL composant (.btn-cta, produit par cta_devis() dans app/functions.php),
   réutilisé partout : en-tête, haut / milieu / fin des pages produits, accueil,
   pied de page, bouton d'envoi du formulaire.
   Contraste fort sur fond clair ET sombre : jaune marque + texte très foncé +
   liseré ambre. Additif : aucune règle globale du site n'est redéfinie.
   ===================================================================== */
.btn-cta{background:var(--yellow,#FFC61A);color:#1f1700;border:2px solid #d9a300;font-weight:700;letter-spacing:.01em;text-shadow:none;box-shadow:0 14px 30px -12px rgba(160,110,0,.55),0 2px 0 rgba(0,0,0,.06)}
.btn-cta .ic{color:#1f1700}
.btn-cta:hover,.btn-cta:focus-visible{background:#ffd23f;border-color:#b98a00;color:#1f1700;box-shadow:0 18px 34px -12px rgba(160,110,0,.65)}
.btn-cta:focus-visible{outline:3px solid #1f1700;outline-offset:3px}
.btn-cta:hover .ic{transform:translateX(3px)}

/* Sur fonds sombres (héros, bandeau bleu, vitrine, pied de page) : halo clair pour détacher le bouton */
.page-hero .btn-cta,.on-blue .btn-cta,.cta-in .btn-cta,.showcase .btn-cta,.footer .btn-cta{box-shadow:0 0 0 4px rgba(255,255,255,.16),0 18px 36px -12px rgba(0,0,0,.55)}

/* En-tête : même composant en taille compacte. La règle responsive existante
   (.nav-quote masqué sous 1024 px, texte masqué sous 1180 px) reste active. */
.nav-quote.btn-cta{padding:10px 16px;font-size:.88rem;background:var(--yellow,#FFC61A);border-color:#d9a300;color:#1f1700}
.nav-quote.btn-cta .ic{color:#1f1700}
.nav-quote.btn-cta:hover{background:#ffd23f;color:#1f1700;border-color:#b98a00}

/* Emplacements « mi-parcours » et « fin de page » (pages produits) */
.cta-inline{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 24px;margin:34px 0;padding:22px 26px;border:1.5px solid var(--line,#e6e9f1);border-left:5px solid var(--yellow,#FFC61A);border-radius:16px;background:#fff}
.cta-inline p{margin:0;font-weight:600;color:var(--ink,#12223d)}
.cta-inline p small{display:block;font-weight:500;color:var(--muted,#6f7b95);font-size:.86rem;margin-top:4px}
.cta-end{margin-top:40px;text-align:center}
.cta-end .btn-cta{min-width:min(100%,320px)}
@media (max-width:640px){
  .cta-inline{flex-direction:column;align-items:stretch;text-align:center}
  .cta-inline .btn-cta,.cta-end .btn-cta{width:100%}
}