/* ==========================================================================
   Reprise après recette, 11/11/2026. Chargé après css/phase2.css.
   Retour arrière : retirer ce fichier, inc/reprise.php et la ligne require
   de functions.php.
   ========================================================================== */

/* --------------------------------------------------------------------------
   R2. Bandeau de consentement sur téléphone
   Mesure de recette : à 390 x 664, 375 x 667 et 360 x 640 (hauteur réellement
   visible dans le navigateur d'un téléphone) la boîte de 214 px recouvrait le
   bouton principal du premier écran. Sous 768 px elle devient une barre de
   pied d'écran : le texte reste entier, les trois choix restent sur une
   rangée, « Tout refuser » garde la taille de « Tout accepter ». Le titre
   reste lu par les lecteurs d'écran.
   -------------------------------------------------------------------------- */

@media (max-width: 767px) {
	.cky-consent-container,
	.cky-consent-container.cky-box-bottom-left {
		left: 0 !important;
		right: 0 !important;
		bottom: 0 !important;
		inset-inline: 0 !important;
		width: 100% !important;
		max-width: none !important;
	}

	.cky-consent-container .cky-consent-bar {
		padding: 8px 12px !important;
		border-radius: 0 !important;
		border-width: 1px 0 0 !important;
		border-style: solid !important;
		border-color: var(--cc-border) !important;
		box-shadow: 0 -2px 14px rgba(16, 26, 32, 0.12) !important;
	}

	.cky-consent-container .cky-title {
		position: absolute !important;
		width: 1px !important;
		height: 1px !important;
		margin: 0 !important;
		padding: 0 !important;
		overflow: hidden !important;
		clip-path: inset(50%) !important;
		white-space: nowrap !important;
	}

	.cky-consent-container .cky-notice-des,
	.cky-consent-container .cky-notice-des p {
		margin: 0 !important;
		max-height: none !important;
		overflow: visible !important;
		font-size: 12px !important;
		line-height: 1.35 !important;
	}

	.cky-consent-container .cky-notice-btn-wrapper {
		flex-wrap: nowrap !important;
		gap: 6px !important;
		margin: 0 !important;
		padding-top: 6px !important;
	}

	.cky-consent-container .cky-notice-btn-wrapper button,
	.cky-consent-container .cky-notice-btn-wrapper a {
		flex: 1 1 0 !important;
		min-height: 40px !important;
		padding: 8px 4px !important;
		font-size: 12.5px !important;
	}

	.cky-consent-container .cky-btn-customize {
		flex-basis: 0 !important;
	}
}

/* Premier écran sur petit téléphone : le bouton principal doit rester au-dessus
   de la barre. À 360 px de large le titre de l'accueil passait sur quatre
   lignes et repoussait le bouton à y 550. */
@media (max-width: 374px) {
	.cc-hero h1 {
		font-size: 35px;
	}

	.cc-hero .cc-lede {
		font-size: 16px;
	}
}

@media (max-width: 479px) and (max-height: 700px) {
	.cc-hero__inner {
		padding-top: var(--cc-s5);
	}

	.cc-hero h1 {
		margin-bottom: var(--cc-s4);
	}

	.cc-hero .cc-lede {
		margin-bottom: var(--cc-s5);
	}
}

@media (max-width: 479px) {
	.cc-article__body .hero-section .hero-content > div[style*="margin-top:32px"] {
		margin-top: var(--cc-s5) !important;
	}
}

/* /relocation-implantation/ (page 603, ancien gabarit) : le bouton principal
   était sous la ligne de flottaison à 667 px de haut. Le surtitre qui répète
   le H1 est masqué sur téléphone, le titre et l'accroche prennent l'échelle
   mobile du thème. Aucun texte n'est modifié. */
body.page-id-603 .cc-hub__head {
	padding-bottom: var(--cc-s4);
}

body.page-id-603 .cc-article {
	padding-top: var(--cc-s2);
}

@media (max-width: 767px) {
	body.page-id-603 .cc-article__body > h4:first-child {
		display: none;
	}

	body.page-id-603 .cc-article__body > h4:first-child + h2 {
		margin-top: 0;
		font-size: 26px;
	}

	body.page-id-603 .cc-article__body > h4:first-child + h2 + p {
		font-size: 16px !important;
		line-height: 1.5;
	}
}

/* --------------------------------------------------------------------------
   R8. Guides sur téléphone
   À 375 px la recherche et les 14 filtres empilés occupaient 763 px : la
   première carte d'article était à y 1166. Le champ et son bouton tiennent
   sur une ligne, les filtres défilent horizontalement sur une rangée, la
   catégorie courante passe en tête.
   -------------------------------------------------------------------------- */

@media (max-width: 767px) {
	.cc-guides-outils__champ {
		flex-wrap: nowrap;
		gap: var(--cc-s2);
	}

	.cc-guides-outils__champ input[type="search"] {
		flex: 1 1 0;
	}

	.cc-guides-outils__champ .cc-btn {
		flex-shrink: 0;
		padding-inline: var(--cc-s5);
		font-size: 16px;
	}

	.cc-guides-outils__cats {
		flex-wrap: nowrap;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		margin-top: var(--cc-s4);
		margin-inline: calc(-1 * var(--cc-gutter));
		padding: 2px var(--cc-gutter) var(--cc-s2);
	}

	.cc-guides-outils__cats::-webkit-scrollbar {
		display: none;
	}

	.cc-guides-outils__cats a {
		flex: 0 0 auto;
		white-space: nowrap;
	}

	.cc-guides-outils__cats a[aria-current="page"] {
		order: -1;
	}
}

/* --------------------------------------------------------------------------
   R9. Menu mobile ouvert
   Le panneau s'arrêtait sous sa dernière entrée et laissait voir le bouton du
   héros coupé en deux. Il couvre maintenant tout l'écran sous l'en-tête, et
   la page ne défile plus derrière lui.
   -------------------------------------------------------------------------- */

@media (max-width: 1279px) {
	.cc-nav--ouvert {
		min-height: calc(100vh - 100%);
		min-height: calc(100dvh - 100%);
		max-height: calc(100dvh - 100%);
	}

	body:has(.cc-nav--ouvert) {
		overflow: hidden;
	}
}

/* --------------------------------------------------------------------------
   R10. Pages filles de /services/ : 96 px de vide entre le H1 et le contenu
   (40 px sous le titre, 56 px au-dessus de l'article). Ramené à 24 px.
   -------------------------------------------------------------------------- */

body.parent-pageid-1127 .cc-hub__head {
	padding-bottom: var(--cc-s4);
}

body.parent-pageid-1127 .cc-article {
	padding-top: var(--cc-s2);
}
