/* Accord refonte 2026 : organisation UI/UX - produits (lot parallele)
   1. Pages produits /services/*.php : questionnaire au premier ecran, chiffres sous le formulaire, FAQ en accordeon natif.
   2. Pages racine autonomes (*_standalone.tpl) : barre produits compacte, en-tete de carte resserre.
   3. Mini-sites d'agence : onglets produits sous le contenu, appel direct dans l'en-tete, raccourcis contact en tete de colonne. */

/* ---------- 1. Pages produits /services ---------- */
/* bandeau sans reserve pour la bande de chiffres (deplacee sous le formulaire) */
.aci-hero .ac-page-hero-in { min-height: 0; padding-bottom: 40px; }
.aci-hero .ac-page-intro { margin-bottom: 0; max-width: 760px; }
.aci-main { padding-top: 20px; }
.aci-form-header { padding: 12px 24px; }
.aci-form-header h2 { font-size: 18px; }

/* bande de chiffres : apres le formulaire, sur le fond de page */
.aci-chiffres { margin-top: 0; padding: 0 0 40px; background: var(--ac-fond); }
.aci-main + .aci-chiffres { margin-top: -24px; }

/* FAQ : details/summary (ouvrable au clavier) */
details.aci-faq-item > summary { list-style: none; }
details.aci-faq-item > summary::-webkit-details-marker { display: none; }
details.aci-faq-item[open] { border-color: var(--ac-ardoise); }
details.aci-faq-item[open] .aci-faq-q:after { transform: rotate(180deg); }
details.aci-faq-item .aci-faq-a { display: block; }
details.aci-faq-item > summary:focus-visible { outline: 2px solid var(--ac-ambre); outline-offset: 2px; border-radius: var(--ac-r-max, 7px); }

@media (max-width: 767px) {
	.aci-hero .ac-page-hero-in { padding-bottom: 28px; }
	.aci-main + .aci-chiffres { margin-top: -20px; padding-bottom: 28px; }
}

/* ---------- 2. Pages racine autonomes (etude-gratuite, credit-immobilier, assurance-pret, rachat-credit, credit-remere, credit-professionnel) ----------
   La feuille est reliee depuis les gabarits *_standalone.tpl : regles limitees aux pages qui contiennent .ac-sa. */
body:has(.ac-sa) .ac-page-hero + .ac-services .ac-service { flex-direction: row; align-items: center; gap: 10px; padding: 10px 14px; }
body:has(.ac-sa) .ac-page-hero + .ac-services .ac-service-ico { width: 38px; height: 38px; flex: none; }
body:has(.ac-sa) .ac-page-hero + .ac-services .ac-service-ico img { width: 26px; height: 26px; }
body:has(.ac-sa) .ac-page-hero + .ac-services .ac-service-nom { font-size: 15px; }
body:has(.ac-sa) .ac-page-hero + .ac-services .ac-service .ac-fleche { display: none; }
main .ac-section.ac-sa:not(.ac-sa-bas) { padding-top: 20px; }
/* la barre des 6 produits passe sous le formulaire (navigation secondaire) : le questionnaire remonte au premier ecran */
main:has(> .ac-sa) { display: flex; flex-direction: column; }
main:has(> .ac-sa) > .ac-sa ~ * { order: 2; }
main:has(> .ac-sa) > .ac-page-hero + .ac-services { order: 1; margin-top: 0; padding: 0 0 36px; background: var(--ac-fond); }
main:has(> .ac-sa) > .ac-sa:not(.ac-sa-bas) { padding-bottom: 28px; }
/* page etude-gratuite : le formulaire est deja dans la page, le bouton "Etude gratuite" du bandeau (fenetre du meme formulaire) fait doublon */
main:has(#form_etude_gratuite_page) > .ac-page-hero .ac-mini-cta-bleu { display: none; }
.ac-sa .ac-sa-principal { padding: 20px 24px 24px; }
.ac-sa .ac-sa-principal > .ac-titre-bloc { margin-bottom: 4px; font-size: 20px; }
.ac-sa .ac-sa-principal > .ac-texte-bloc { margin-bottom: 12px !important; font-size: 14.5px; line-height: 1.5; }
.ac-sa .ac-sa-iframe { margin: 0 -24px -24px; padding-top: 4px; }
.ac-sa .ac-sa-bloc { padding: 20px 22px; }

@media (max-width: 767px) {
	/* barre produits : une seule ligne defilante au lieu de 3 rangees, le formulaire remonte */
	body:has(.ac-sa) .ac-page-hero + .ac-services .ac-services-grille { display: flex; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
	body:has(.ac-sa) .ac-page-hero + .ac-services .ac-services-grille::-webkit-scrollbar { display: none; }
	body:has(.ac-sa) .ac-page-hero + .ac-services .ac-service { flex: none; border-bottom: 0; border-right: 1px solid var(--ac-ligne); padding: 8px 12px; }
	body:has(.ac-sa) .ac-page-hero + .ac-services .ac-service-ico { width: 32px; height: 32px; }
	body:has(.ac-sa) .ac-page-hero + .ac-services .ac-service-ico img { width: 22px; height: 22px; }
	body:has(.ac-sa) .ac-page-hero + .ac-services .ac-service-nom { font-size: 14px; white-space: nowrap; }
	main .ac-section.ac-sa:not(.ac-sa-bas) { padding-top: 14px; }
	.ac-sa .ac-sa-principal { padding: 16px 16px 18px; }
	.ac-sa .ac-sa-iframe { margin: 0 -16px -18px; padding: 4px 4px 8px; }
}

/* ---------- 3. Mini-sites d'agence ---------- */
/* bandeau : plus de reserve pour la carte d'onglets (deplacee sous le contenu) */
.ms-main > .ms-hero .ac-page-hero-in { min-height: 230px; padding-bottom: 32px; }
/* appel direct dans l'en-tete */
.ms-entete-actions .ms-btn-appel { font-variant-numeric: tabular-nums; white-space: nowrap; }
/* onglets des solutions : section ordinaire sous le contenu */
.ms-main .ms-onglets { margin-top: 0; padding: 40px 0 48px; background: #fff; }
.ms-onglets .ms-onglets-titre { margin: 0 0 16px; font-size: clamp(22px, 2vw, 28px); font-weight: 800; line-height: 1.2; letter-spacing: -.02em; color: var(--ac-encre); }
.ms-main .ms-onglets .ms-onglets-carte { border: 1px solid var(--ac-ligne); box-shadow: none; }
/* colonne des pages de contenu : raccourcis de contact avant la carte de l'adresse */
.msp-page:not(.msp-page--bande) > .msp-cote > .msp-cote-pile { order: 1; }
.msp-page:not(.msp-page--bande) > .msp-cote > .ms-adresse { order: 2; }

@media (max-width: 767px) {
	.ms-main .ms-onglets { padding: 28px 0 32px; }
	.ms-main > .ms-hero .ac-page-hero-in { min-height: 0; padding-bottom: 24px; }
	/* telephone : l'appel direct reste visible (icone seule) a cote de l'acces prive */
	.ms-entete-actions .ac-btn-ligne.ms-btn-appel { display: inline-flex; width: 44px; padding: 0; }
}