/* ── Lisibilité : plancher de 16 px pour tout texte courant ───────────────
   Règle de Bastien (03/10/2026, relevée de 14 à 16 px le même jour) : aucun
   texte courant sous 16 px, sur PC comme sur mobile ; seule exception, les
   sous-titres en MAJUSCULES (eyebrows, titres de colonnes du pied de page,
   libellé flottant d'un champ rempli). Public visé : responsables de clubs,
   parfois âgés.
   Ce fichier corrige les composants COMMUNS du site (header, boutons, FAQ,
   fil d'Ariane, écran de connexion, pied de page) ; une taille posée dans
   les réglages d'un widget se corrige dans le widget lui-même.
   Les !important sont voulus : ces tailles viennent du CSS du kit Elementor
   (post-4.css) ou de feuilles chargées après celle-ci.
   Une passe complète sur l'échelle typographique du site (tailles fluides)
   reste à faire : ce fichier n'est qu'un plancher. ──────────────────────── */

/* Fil d'Ariane et preuve sociale des bandeaux d'ouverture */
.ar-crumbs,
.ar-crumbs a,
.ar-crumbs span,
.ar-trust-txt,
.ar-trust-txt p,
.ar-trust-txt strong {
	font-size: 16px !important;
}

/* Boutons du site (libellé animé et libellé simple) */
.elementor-button .ar-swap-line,
.elementor-button .elementor-button-text {
	font-size: 16px !important;
}

/* Header : menu, téléphone, boutons */
.ar-mnav .elementor-nav-menu--main .elementor-item,
.ar-hdr-tel .elementor-icon-list-text {
	font-size: 16px !important;
}

/* FAQ (accordéons) : réponses */
.ar-faq .elementor-widget-text-editor,
.ar-faq .elementor-widget-text-editor p {
	font-size: 16px !important;
}

/* Écran de connexion « l'e-mail d'abord » (le libellé flottant, une fois
   remonté en petites capitales, reste exempté) */
.gacct-login .gacct-login-hint,
.gacct-login .gacct-login-or,
.gacct-login .gacct-login-or span,
.gacct-login .gacct-login-input:placeholder-shown:not(:focus) + .gacct-login-flabel {
	font-size: 16px !important;
}

/* Pied de page : textes, liens, adresse, mentions, régions */
footer.elementor-location-footer .elementor-widget-text-editor,
footer.elementor-location-footer .elementor-widget-text-editor p,
footer.elementor-location-footer .ar-flink,
footer.elementor-location-footer .ar-botlink,
footer.elementor-location-footer .elementor-icon-list-text,
footer.elementor-location-footer .elementor-widget-container,
.gacct-rf-t,
.gacct-rf-t ~ a,
.gacct-rf a {
	font-size: 16px !important;
}

/* Boutons du header : à 16 px, « Demande d'intervention » et « Mon compte »
   passaient sur deux lignes entre 1025 et 1280 px (barre de 90 px). */
.ar-hdr-right .elementor-button,
.ar-hdr-right .elementor-button .ar-swap-line,
.ar-hdr-right .elementor-button .elementor-button-text,
.ar-fp .elementor-button,
.ar-fp .elementor-button .ar-swap-line,
.ar-fp .elementor-button .elementor-button-text {
	white-space: nowrap;
}

/* ── Passe globale du 03/10/2026 : composants des pages ──────────────────
   Report de /commande-groupee/ (0 texte sous 16 px) sur l'accueil, les pages
   services, Contact, Actualités et Consignes d'emballage. Échelle : texte
   courant 16 px, titres de cartes et d'étapes 18 px. La page Tarifs
   (page-id-1274) est EXCLUE à la demande de Bastien : elle sera revue à part.
   ──────────────────────────────────────────────────────────────────────── */

/* Titres de cartes et d'étapes : 18 px, au-dessus du texte courant */
body:not(.page-id-1274) .ar-process h3.elementor-heading-title,
body:not(.page-id-1274) .ar-booking .elementor-icon-box-title,
body:not(.page-id-1274) .ar-booking .elementor-icon-box-title span,
body:not(.page-id-1274) .ar-info-head .elementor-icon-box-title,
body:not(.page-id-1274) .ar-info-head .elementor-icon-box-title span,
body:not(.page-id-1274) .ar-ship-step h4.elementor-heading-title {
	font-size: 18px !important;
}

/* Cartes à icône, étapes, réservation, badges posés sur les photos */
body:not(.page-id-1274) .ar-card-iconline .elementor-icon-box-description,
body:not(.page-id-1274) .ar-svc-card .elementor-icon-box-description,
body:not(.page-id-1274) .ar-process .elementor-widget-text-editor,
body:not(.page-id-1274) .ar-process .elementor-widget-text-editor p,
body:not(.page-id-1274) .ar-booking .elementor-icon-box-description,
body:not(.page-id-1274) .ar-hero .elementor-widget-icon-box .elementor-icon-box-title,
body:not(.page-id-1274) .ar-hero .elementor-widget-icon-box .elementor-icon-box-title span,
body:not(.page-id-1274) .ar-hero .elementor-widget-icon-box .elementor-icon-box-description,
.elementor-1249 .elementor-element-2e25db8 .elementor-icon-box-title,
.elementor-1249 .elementor-element-2e25db8 .elementor-icon-box-description {
	font-size: 16px !important;
}

/* Accueil : bloc « À propos » (texte, chiffres clés, engagements) */
.elementor-1249 .elementor-element-7cb65c5 .elementor-widget-text-editor,
.elementor-1249 .elementor-element-7cb65c5 .elementor-widget-text-editor :is(p, strong, a),
.elementor-1249 .ar-stat .elementor-icon-box-description,
.elementor-1249 .ar-trust-row .elementor-icon-box-description {
	font-size: 16px !important;
}
.elementor-1249 .ar-trust-row .elementor-icon-box-title,
.elementor-1249 .ar-trust-row .elementor-icon-box-title span {
	font-size: 18px !important;
	line-height: 24px !important;
}
.elementor-1249 .ar-trust-row .elementor-icon-box-icon {
	height: 24px !important;
}

/* Pages services : prestations, instruments, pliage, texte éditorial */
body:not(.page-id-1274) .ar-presta-list li,
body:not(.page-id-1274) .ar-presta-list p,
body:not(.page-id-1274) .ar-presta-list strong,
body:not(.page-id-1274) .ar-presta-btn a,
body:not(.page-id-1274) .ar-presta-note p,
body:not(.page-id-1274) .ar-repair-pills span,
body:not(.page-id-1274) .ar-seat-btn,
body:not(.page-id-1274) .ar-seat-btn small,
body:not(.page-id-1274) .ar-instr-card :is(p, strong, li),
body:not(.page-id-1274) .ar-fold-card p,
body:not(.page-id-1274) .ar-addr,
body:not(.page-id-1274) .ar-addr strong,
body:not(.page-id-1274) .ar-editorial-aside :is(p, strong),
body:not(.page-id-1274) .ar-editorial-body :is(p, span, a, strong, em),
body:not(.page-id-1274) .ar-editorial-kw .ar-kw-pills span {
	font-size: 16px !important;
}

/* Contact : cartes, formulaire, encart, plan, horaires, envoi */
.elementor-1276 .ar-hero-side .elementor-icon-list-text,
.elementor-1276 .ar-cc-sub p,
.elementor-1276 .ar-form-intro p,
.elementor-1276 .ar-form-note,
.elementor-1276 .ar-contact-form :is(.jet-form-builder__label-text, .jet-form-builder__action-button, small, span, a),
.elementor-1276 .ar-aside-intro p,
.elementor-1276 .ar-aside-txt :is(strong, small),
.elementor-1276 .ar-aside-teal-txt p,
.elementor-1276 .ar-gps,
.elementor-1276 .ar-hours-note,
.elementor-1276 .ar-hrow,
.elementor-1276 .ar-map-pin :is(strong, small),
.elementor-1276 .ar-ship-lines,
.elementor-1276 .ar-ship-lines strong,
.elementor-1276 .ar-ship-txt :is(p, em),
.elementor-1276 .ar-ship-copy span {
	font-size: 16px !important;
}

/* Actualités : extrait et lien des cartes d'articles */
body:not(.page-id-1274) .ar-actus .elementor-post__excerpt p,
body:not(.page-id-1274) .ar-actus .elementor-post__read-more {
	font-size: 16px !important;
}

/* ── Hero mobile plein écran (04/10/2026, révisé le même jour) ────────────
   Sur téléphone, la colonne texte du hero (sur-titre, titre, intro, boutons,
   preuve sociale) occupe toute la hauteur visible sous le header : 100svh
   moins 85 px (header 69 px + marge haute de la section 16 px). C'est un
   minimum : sur un petit écran dont le contenu dépasse déjà, rien ne change.
   Répartition (Bastien, option A) : l'espace libre se partage en TROIS
   PARTS ÉGALES, au-dessus du sur-titre, entre l'intro et les boutons, et
   sous la preuve sociale jusqu'au bas de l'écran (marges auto sur le
   premier enfant, sur .ar-hero-ctas et sur un ::after vide). Chaque espace
   vaut 32 px + sa part, donc les trois sont toujours identiques ; sur un
   petit écran sans espace libre, il reste 32 px partout. La photo commence
   pile au bas de l'écran : elle apparaît au premier défilement.
   Typographie fluide sur la largeur ET la hauteur : sur-titre 12 → 14 px,
   titre 36 → 50 px (lignes équilibrées), intro 16 → 19 px.
   Classes posées dans Elementor : ar-hero-txt (pages à CTA et collage),
   ar-hero-court (Contact, Actualités : typographie seule, sans pleine
   hauteur pour ne pas repousser le formulaire ou les articles).
   Pages régions (gabarit de l'extension) : mêmes règles sur leurs classes,
   et boutons remis au-dessus de la preuve sociale comme sur l'accueil.
   Tarifs (1274) exclu.
   ────────────────────────────────────────────────────────────────────── */
@media (max-width: 767px) {
	body:not(.page-id-1274) .e-con.ar-hero-txt {
		min-height: calc(100svh - 85px);
		justify-content: flex-start !important;
		padding-top: 16px !important; /* + 16 px de la section = 32 */
		padding-bottom: 0 !important;
	}
	body:not(.page-id-1274) .e-con.ar-hero-txt::after {
		content: "";
		flex: none;
		height: 32px;
		margin-top: auto;
	}
	/* Rien entre la colonne texte et la photo : la photo démarre au bas de
	   l'écran (les pages de service portaient 32 px de marge sur la photo). */
	body:not(.page-id-1274) :is(.e-con, .e-con-inner):has(> .ar-hero-txt) {
		row-gap: 0 !important;
	}
	body:not(.page-id-1274) .ar-hero-txt + .e-con {
		margin-top: 0 !important;
	}
	body:not(.page-id-1274) .ar-hero-txt > :first-child {
		margin-top: auto !important;
	}
	body:not(.page-id-1274) .ar-hero-txt > .ar-hero-ctas {
		margin-top: auto !important;
		padding-top: 22px; /* + 10 px de marge du bouton = 32 */
	}
	:is(body:not(.page-id-1274) .ar-hero-txt, .ar-hero-court) > .elementor-widget-heading:first-child .elementor-heading-title {
		font-size: clamp(12px, min(3.3vw, 1.7svh), 14px) !important;
		line-height: 1.45 !important; /* sur-titre sur deux lignes (Réparations, Suspentes) */
	}
	:is(body:not(.page-id-1274) .ar-hero-txt, .ar-hero-court) h1.elementor-heading-title {
		font-size: clamp(36px, min(11.4vw, 6svh), 50px) !important;
		line-height: 1.06 !important;
		letter-spacing: -0.01em;
		text-wrap: balance;
	}
	:is(body:not(.page-id-1274) .ar-hero-txt, .ar-hero-court) > .elementor-widget-heading:has(h1) {
		margin: 14px 0 clamp(16px, 3svh, 28px) !important;
	}
	:is(body:not(.page-id-1274) .ar-hero-txt, .ar-hero-court) > :not(.ar-hero-ctas):not(.elementor-widget-heading) :is(p, li) {
		font-size: clamp(16px, min(4.5vw, 2.3svh), 19px) !important;
		line-height: 1.6 !important;
	}
	body:not(.page-id-1274) .ar-hero-txt .ar-hero-trust {
		margin-top: clamp(20px, 4svh, 36px) !important;
	}

	/* Pages régions : même répartition en trois parts égales, photo au bas
	   de l'écran (écart de grille et marge de la photo annulés). */
	body .ar-region-hero {
		padding-top: 16px;
	}
	body .ar-region-hero-text {
		min-height: calc(100svh - 85px);
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		padding: 16px 0 0;
	}
	body .ar-region-hero-text::after {
		content: "";
		order: 3; /* après les boutons (1) et la preuve sociale (2) */
		flex: none;
		height: 32px;
		margin-top: auto;
	}
	body .ar-region-hero-in {
		row-gap: 0;
	}
	body .ar-region-hero-media {
		margin-top: 0;
	}
	body .ar-region-eyebrow {
		margin-top: auto;
		font-size: clamp(12px, min(3.3vw, 1.7svh), 14px);
		line-height: 1.45;
	}
	body .ar-region-h1 {
		margin: 14px 0 clamp(16px, 3svh, 28px);
		font-size: clamp(36px, min(11.4vw, 6svh), 50px);
		line-height: 1.06;
		text-wrap: balance;
	}
	body .ar-region-intro {
		margin-bottom: 0 !important;
		font-size: clamp(16px, min(4.5vw, 2.3svh), 19px);
		line-height: 1.6;
	}
	body .ar-region-cta-row {
		order: 1;
		flex-direction: column;
		gap: 10px;
		margin-top: auto;
		padding-top: 32px;
	}
	body .ar-region-badge {
		order: 2;
		display: flex;
		justify-content: center;
		margin: clamp(20px, 4svh, 36px) 0 0;
	}
}

/* ── Gabarit mobile : gouttière unique (04/10/2026) ───────────────────────
   Décision de Bastien : le gabarit est identique sur TOUTES les pages,
   Tarifs comprise. Marge gauche et droite fluide, de 16 px (375 px de large
   et moins) à 24 px (412 px et plus) : variable --ar-gut posée dans
   header.css, qui l'applique aussi au header. Avant : 10 px sur la plupart
   des pages, 16 sur l'accueil, 20 sur les régions et le pied de page.
   S applique aux sections de premier niveau des pages Elementor, des
   articles et archives, du pied de page, et aux blocs des pages régions (gabarit de l'extension).
   ────────────────────────────────────────────────────────────────────── */
@media (max-width: 767px) {
	[data-elementor-type="wp-page"] > .e-parent,
	[data-elementor-type="single-post"] > .e-parent,
	[data-elementor-type="archive"] > .e-parent,
	[data-elementor-type="footer"] > .e-parent {
		padding-left: var(--ar-gut) !important;
		padding-right: var(--ar-gut) !important;
	}
	body .ar-region-hero,
	body .ar-region-body,
	body :is(.ar-region-local-in, .ar-region-reviews-in, .ar-region-faq-in, .ar-region-cta-band-in, .ar-region-nearby-in) {
		padding-left: var(--ar-gut);
		padding-right: var(--ar-gut);
	}
}

/* Espace client (page 14 et ses onglets Profile Builder) : même gouttière que
   le site (Bastien, 05/10/2026). La section de premier niveau reçoit déjà
   --ar-gut ci-dessus ; la zone de contenu 0e53f69 (10 px en mobile) et le
   conteneur de chaque gabarit d'onglet (10 px) s'y ajoutaient, d'où 36 px au
   lieu de 16 sur Mon club. On les ramène à 0 sur mobile. */
@media (max-width: 767px) {
	.elementor-element.elementor-element-0e53f69,
	.elementor-element-0e53f69 [data-elementor-type] > .e-parent {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
}

/* ── Étiquette posée sur la photo du hero, mobile (04/10/2026) ───────────
   Bastien : sur mobile, l étiquette (« Depuis 2010 », « Élastiques neufs »,
   « 40 €/h TTC », « À partir de 12 € ») tombait sous le collage (Pliages,
   Réparations : flottante seulement sur ordinateur), sous la vidéo
   (Suspentes), ou dépassait de 20 px à gauche (accueil). Règle commune :
   l icône-box qui suit la colonne texte du hero devient compacte (icône à
   gauche, texte à droite), posée à 12 px du bord gauche de la photo
   principale et débordant de 20 px sous elle ; elle couvre 10 à 14 % de
   l image (la vidéo de Suspentes garde son bouton lecture libre). La
   colonne photo prend 20 px de marge basse pour ce débord. Ordinateur et
   tablette inchangés. Tarifs (1274) exclu.
   ────────────────────────────────────────────────────────────────────── */
@media (max-width: 767px) {
	body:not(.page-id-1274) .ar-hero-txt + .e-con {
		position: relative;
		padding-bottom: 20px !important;
	}
	body:not(.page-id-1274) .ar-hero-txt + .e-con > .elementor-widget-icon-box {
		position: absolute !important;
		left: 12px !important;
		right: auto !important;
		top: auto !important;
		bottom: 0 !important;
		width: auto !important;
		max-width: calc(100% - 24px) !important;
		margin: 0 !important;
		z-index: 5;
	}
	body:not(.page-id-1274) .ar-hero-txt + .e-con > .elementor-widget-icon-box > .elementor-widget-container {
		padding: 10px 16px 10px 10px !important;
	}
	body:not(.page-id-1274) .ar-hero-txt + .e-con > .elementor-widget-icon-box .elementor-icon-box-wrapper {
		display: flex !important;
		flex-direction: row !important;
		align-items: center !important;
		gap: 12px;
		text-align: left !important;
	}
	body:not(.page-id-1274) .ar-hero-txt + .e-con > .elementor-widget-icon-box .elementor-icon-box-icon {
		margin: 0 !important;
		flex: none;
	}
	body:not(.page-id-1274) .ar-hero-txt + .e-con > .elementor-widget-icon-box .elementor-icon-box-title {
		margin: 0 !important;
		line-height: 1.25 !important;
	}
	body:not(.page-id-1274) .ar-hero-txt + .e-con > .elementor-widget-icon-box .elementor-icon-box-description {
		margin: 0 !important;
		line-height: 1.3 !important;
	}
}

/* ── Tarifs (1274) : hero aligné sur les autres pages (04/10/2026) ────────
   Bastien : on ne touche pas au contenu, seulement aux tailles. La colonne
   texte porte ar-hero-court (comme Contact et Actualités) : sur-titre,
   titre et intro suivent les règles fluides du hero mobile ci-dessus (titre
   30 → 36-50 px), sans pleine hauteur pour garder les ancres et les grilles
   de prix près du haut. Les trois garanties (.ar-hero-side-item) passent de
   13 à 16 px (plancher de lisibilité), icône 17 → 20 px, sur tous écrans.
   ────────────────────────────────────────────────────────────────────── */
.page-id-1274 .ar-hero-side-item .elementor-icon-box-title,
.page-id-1274 .ar-hero-side-item .elementor-icon-box-title span {
	font-size: 16px !important;
	line-height: 1.4 !important;
}
.page-id-1274 .ar-hero-side-item .elementor-icon {
	font-size: 20px !important;
}
.page-id-1274 .ar-hero-side-item .elementor-icon svg {
	width: 20px !important;
	height: 20px !important;
}

/* Bloc « Pourquoi passer par notre site » (.ar-booking), mobile : 32 px entre le bouton et
   les cartes (seul Contrôles avait une marge), icône et texte des cartes centrés. 04/10/2026. */
@media (max-width: 767px) {
	.ar-booking .elementor-widget-button { margin-bottom: 32px !important; }
	.ar-booking .elementor-widget-icon-box .elementor-icon-box-wrapper { text-align: center !important; }
	.ar-booking .elementor-widget-icon-box .elementor-icon-box-icon { display: flex !important; justify-content: center; margin-left: auto !important; margin-right: auto !important; }
}

/* Preuve sociale du hero, ordinateur et tablette : le chiffre (.ar-trust-txt) passe toujours sous les
   avis, centré. Avant, il ne passait dessous que si le texte était assez long pour forcer le retour
   (Contrôles, « +600 voiles / an », restait à côté). Bastien, 04/10/2026. Puis même jour : visible aussi
   en mobile (hide_mobile retiré) et ajoutée à l accueil (b7a1e30), donc règle sur tous écrans. */
.ar-hero-trust { flex-wrap: wrap !important; }
.ar-hero-trust > .ar-trust-txt { flex-basis: 100% !important; width: 100% !important; text-align: center; }

/* Contact (1276), cartes .ar-cc : icône à cheval sur le trait haut comme .ar-card-iconline
   (64 px, 21 px au-dessus, alignée sur la marge de 28 px), remplissage turquoise au survol.
   translate et non transform : la classe d apparition pilote déjà transform. Bastien, 04/10/2026. */
.e-con.ar-cc { position: relative; overflow: visible; padding-top: 64px !important; }
.e-con.ar-cc > .elementor-widget-icon { position: absolute !important; top: 0; left: 28px; width: auto !important; margin: 0 !important; transform: none !important; translate: 0 -21px; line-height: 0; z-index: 2; }
.e-con.ar-cc > .elementor-widget-icon .elementor-icon { display: grid; place-items: center; width: 64px !important; height: 64px !important; padding: 0 !important; font-size: 30px !important; border-radius: 16px !important; background-color: #fff !important; border: 1px solid rgba(0,0,0,.08); transition: background-color .2s, border-color .2s; }
.e-con.ar-cc > .elementor-widget-icon .elementor-icon svg { width: 30px; height: 30px; transition: filter .2s; }
.e-con.ar-cc:hover > .elementor-widget-icon .elementor-icon { background-color: #20c4c3 !important; border-color: #20c4c3; }
.e-con.ar-cc:hover > .elementor-widget-icon .elementor-icon svg { filter: brightness(0) invert(1); }
.e-con:has(> .e-con.ar-cc) { margin-top: 22px; }
@media (max-width: 767px) { .e-con:has(> .e-con.ar-cc) { row-gap: 48px !important; } }
/* Lien d action calé en bas des cartes .ar-cc, alignés d une carte à l autre (Bastien, 04/10/2026).
   La règle .ar-cc-sub flex-grow du kit est inopérante (sélecteur enregistré avec >). */
.e-con.ar-cc > .ar-cc-link { margin-top: auto !important; }
/* Notes de l accordeon Suspentes du formulaire de demande (consigne suspente seule, devis) :
   14,5 px dans le socle, plancher de 16 px du site (05/10/2026). */
.gacct-v2 .gacct-v2-repair-note { font-size: 16px; }
/* Cartes à icône (.ar-card-iconline), toutes pages : l icône dépasse de 21 px au-dessus de la carte.
   La règle d espacement du kit est inopérante (sélecteur enregistré avec >), d où une icône collée
   à la carte du dessus sur mobile. Même réglage que .ar-cc : 48 px entre rangées. Bastien, 08/10/2026. */
.e-con:has(> .ar-card-iconline) { row-gap: 48px !important; margin-top: 22px; }