/* ==========================================================
   Core Atelier — affichage tablette et mobile
   En-tête, menu mobile, barre de contact, zones tactiles.
   Chargée après les styles du thème (IDS-GPE ou variante) : mêmes classes .ids-*.
   Points de rupture : mobile < 600 px (menu burger) · tablette 600–1199 px (menu classique sous le logo)
   · ordinateur ≥ 1200 px (logo et menu sur une ligne)
   ========================================================== */

/* ---------- Bouton du menu (« burger ») ---------- */
.ids-header .wp-block-navigation__responsive-container-open {
	width: 44px; height: 44px; padding: 0; margin: 0;
	display: flex; align-items: center; justify-content: center;
	border: 1px solid var(--ids-line, #dfe7f3); border-radius: 8px;
	background: #fff; color: var(--ids-navy, #182044); cursor: pointer;
	transition: background .2s, border-color .2s;
}
.ids-header .wp-block-navigation__responsive-container-open:hover { background: var(--ids-light, #f3faff); border-color: var(--ids-blue, #006de8); }
.ids-header .wp-block-navigation__responsive-container-open svg { width: 26px; height: 26px; }
.ids-header .wp-block-navigation__responsive-container-open:focus-visible { outline: 3px solid #7fb8ff; outline-offset: 2px; }

/* Le menu burger n'existe que sur mobile (< 600 px, réglage du bloc Navigation « Mobile ») :
   tablettes et ordinateurs gardent le menu classique. */
@media (min-width: 600px) {
	.ids-header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: none; }
}

/* ---------- Panneau du menu mobile ---------- */
.ids-header .wp-block-navigation__responsive-container.is-menu-open {
	background: #fff !important; color: var(--ids-navy, #182044) !important;
	padding: 0 !important; animation: ids-menu-in .22s ease both;
}
@keyframes ids-menu-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
.ids-header .is-menu-open .wp-block-navigation__responsive-close { max-width: 640px; margin: 0 auto; }
.ids-header .is-menu-open .wp-block-navigation__responsive-dialog { padding: 18px 20px 32px; margin: 0 !important; }
.admin-bar .ids-header .is-menu-open .wp-block-navigation__responsive-dialog { margin-top: 46px !important; }
@media (min-width: 783px) { .admin-bar .ids-header .is-menu-open .wp-block-navigation__responsive-dialog { margin-top: 32px !important; } }
/* Titre du panneau */
.ids-header .is-menu-open .wp-block-navigation__responsive-dialog::before {
	content: "Menu"; display: block; height: 44px; line-height: 44px;
	font-family: var(--wp--preset--font-family--poppins, Poppins, sans-serif);
	font-size: .78rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--ids-blue, #006de8);
}
/* Bouton de fermeture */
.ids-header .is-menu-open .wp-block-navigation__responsive-container-close {
	top: 18px !important; right: 20px !important; width: 44px; height: 44px;
	display: flex; align-items: center; justify-content: center;
	border-radius: 8px; background: var(--ids-light, #f3faff); color: var(--ids-navy, #182044);
}
.admin-bar .ids-header .is-menu-open .wp-block-navigation__responsive-container-close { top: 18px !important; }
.ids-header .is-menu-open .wp-block-navigation__responsive-container-close svg { width: 24px; height: 24px; }
.ids-header .is-menu-open .wp-block-navigation__responsive-container-close:focus-visible { outline: 3px solid #7fb8ff; outline-offset: 2px; }
/* Liens : pleine largeur, alignés à gauche, séparés par un filet */
.ids-header .is-menu-open .wp-block-navigation__responsive-container-content {
	align-items: stretch !important; padding-top: 6px !important; gap: 0 !important;
}
.ids-header .is-menu-open .wp-block-navigation__container {
	width: 100%; align-items: stretch !important; gap: 0 !important; justify-content: flex-start !important;
}
.ids-header .is-menu-open .wp-block-navigation-item {
	width: 100%; align-items: stretch !important; border-bottom: 1px solid var(--ids-line, #dfe7f3);
}
.ids-header .is-menu-open .wp-block-navigation-item__content {
	display: flex !important; align-items: center; min-height: 52px; padding: 0 4px !important;
	font-family: var(--wp--preset--font-family--poppins, Poppins, sans-serif);
	font-size: 1.12rem !important; font-weight: 500; color: var(--ids-navy, #182044) !important; text-decoration: none;
}
.ids-header .is-menu-open .wp-block-navigation-item__content:hover,
.ids-header .is-menu-open .current-menu-item > .wp-block-navigation-item__content,
.ids-header .is-menu-open [aria-current="page"] { color: var(--ids-blue, #006de8) !important; }
.ids-header .is-menu-open .wp-block-navigation-item__content::after {
	content: "›"; margin-left: auto; padding-left: 12px; font-size: 1.4rem; line-height: 1; color: var(--ids-muted, #5b6280); opacity: .6;
}
/* Sous-menus (Nos métiers…) : toujours ouverts, en retrait, sans cadre */
.ids-header .is-menu-open .wp-block-navigation__submenu-container {
	border: 0 !important; box-shadow: none !important; border-radius: 0; min-width: 0 !important;
	padding: 0 0 10px 14px !important; margin: 0; background: transparent !important;
	border-left: 2px solid var(--ids-blue, #006de8) !important; margin-left: 4px !important;
}
.ids-header .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item { border-bottom: 0; }
.ids-header .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content { min-height: 44px; font-size: 1rem !important; font-weight: 400; color: var(--ids-slate, #404873) !important; }
.ids-header .is-menu-open .wp-block-navigation-submenu > .wp-block-navigation-item__content::after { content: ""; }
.ids-header .is-menu-open .wp-block-navigation__submenu-icon { display: none; }
/* Bouton Contact : pleine largeur, en bas de la liste */
.ids-header .is-menu-open .wp-block-navigation-item.ids-nav__cta { border-bottom: 0; margin-top: 18px; }
.ids-header .is-menu-open .wp-block-navigation-item.ids-nav__cta > a {
	justify-content: center; min-height: 52px; border-radius: 6px !important;
	background: var(--ids-blue, #006de8) !important; color: #fff !important; padding: 0 20px !important;
}
.ids-header .is-menu-open .wp-block-navigation-item.ids-nav__cta > a::after { content: none; }
/* Pastilles de navigation rapide masquées pendant que le menu est ouvert */
html.has-modal-open .ids-quicknav, html.has-modal-open .ids-totop { display: none !important; }

/* ---------- En-tête compact ---------- */
@media (max-width: 599px) {
	.ids-header__inner { flex-wrap: nowrap !important; }
}
/* Tablette : logo sur la première ligne, menu classique complet sur la seconde (jamais écrasé) */
@media (min-width: 600px) and (max-width: 1199px) {
	.ids-header__inner { flex-wrap: wrap !important; row-gap: .55rem !important; }
	.ids-header__inner > .ids-brand { flex: 1 1 100%; }
	.ids-header__inner > .ids-nav { flex: 1 1 100%; justify-content: center !important; border-top: 1px solid var(--ids-line, #dfe7f3); padding-top: .55rem; }
	.ids-header .ids-nav .wp-block-navigation__container { flex-wrap: wrap !important; justify-content: center !important; gap: .25rem 1.1rem !important; }
	.ids-header .ids-nav { font-size: .9rem !important; }
	.ids-header .ids-nav .wp-block-navigation-item__content { padding-top: .35rem; padding-bottom: .35rem; }
	.ids-header .ids-nav .ids-nav__cta > a { padding: .45em 1.1em !important; }
}
@media (max-width: 1199px) {
	.ids-header { padding-top: .6rem !important; padding-bottom: .6rem !important; }
	.ids-brand { min-width: 0; gap: .6rem !important; }
	.ids-brand__text { min-width: 0; }
	.ids-brand .wp-block-site-title { font-size: 1.05rem !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
	.ids-brand .wp-block-site-logo img, .ids-brand .custom-logo { width: 46px !important; height: auto !important; }
	.ids-brand .wp-block-site-logo { flex-shrink: 0; }
}
@media (min-width: 600px) and (max-width: 1199px) {
	.ids-brand .wp-block-site-tagline { display: block !important; font-size: .78rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}
@media (max-width: 380px) {
	.ids-brand .wp-block-site-title { font-size: .95rem !important; }
	.ids-brand .wp-block-site-logo img, .ids-brand .custom-logo { width: 40px !important; }
}

/* ---------- Barre de contact (haut de page) ---------- */
@media (max-width: 1180px) {
	.ids-topbar { font-size: .8rem; }
	.ids-topbar p { gap: .2rem .9rem !important; }
	.ids-topbar__inner { gap: .3rem 1rem !important; }
}
/* Mobile : trois boutons sur une ligne (Dakar, Abidjan, E-mail), toute la surface est cliquable */
@media (max-width: 599px) {
	.ids-topbar { padding: 6px 12px !important; }
	.ids-topbar__inner { display: block !important; }
	.ids-topbar__contacts { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px !important; margin: 0; }
	.ids-topbar__contacts > span {
		position: relative; display: flex; align-items: center; justify-content: center; gap: 6px;
		height: 36px; border-radius: 6px; background: rgba(255, 255, 255, .08);
		font-size: 0; color: #fff; white-space: nowrap;
	}
	.ids-topbar__contacts > span::before {
		content: ""; flex: none; width: 15px; height: 15px; background: currentColor;
		-webkit-mask: var(--ids-ico-tel) center / contain no-repeat; mask: var(--ids-ico-tel) center / contain no-repeat;
	}
	.ids-topbar__contacts > span::after { font-size: .8rem; font-weight: 600; letter-spacing: .01em; }
	.ids-topbar__contacts > span:nth-child(1)::after { content: "Dakar"; }
	.ids-topbar__contacts > span:nth-child(2)::after { content: "Abidjan"; }
	.ids-topbar__contacts > span:nth-child(3)::after { content: "E-mail"; }
	.ids-topbar__contacts > span:nth-child(3)::before { -webkit-mask-image: var(--ids-ico-mail); mask-image: var(--ids-ico-mail); }
	.ids-topbar__contacts > span a { position: absolute; inset: 0; z-index: 1; font-size: 0; color: transparent !important; border-radius: 6px; }
	.ids-topbar__contacts > span a:focus-visible { outline: 3px solid #7fb8ff; outline-offset: 1px; }
	.ids-topbar__contacts > span:active { background: rgba(255, 255, 255, .18); }
}
:root {
	--ids-ico-tel: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1A17 17 0 0 1 3 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.3 0 .7-.2 1l-2.3 2.2z'/%3E%3C/svg%3E");
	--ids-ico-mail: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 4h16a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2zm8 7.2L20 6H4l8 5.2zm0 2.3L4 8.3V18h16V8.3l-8 5.2z'/%3E%3C/svg%3E");
}

/* ---------- Zones tactiles et lisibilité sur écran tactile ---------- */
@media (max-width: 1079px) {
	/* Points du slider : zone de toucher agrandie sans changer leur apparence */
	.ids-slider__dot { position: relative; }
	.ids-slider__dot::after { content: ""; position: absolute; inset: -14px -5px; }
	.ids-slider__dots { gap: .7rem !important; }
	/* Liens du pied de page */
	.ids-footer a { display: inline-block; padding: .35rem 0; }
	.ids-footer__links li { margin-bottom: 0 !important; }
	/* Champs : 16 px minimum (évite le zoom automatique sur iPhone) */
	.ids-form :is(input, select, textarea), .ids-select select { font-size: 16px !important; }
	/* Pagination, puces de filtres : hauteur confortable */
	.ids-pager :is(a, span) { min-width: 44px; height: 44px; }
	.ids-chip { min-height: 40px; }
}
@media (max-width: 599px) {
	.ids-section { padding-top: 3rem !important; padding-bottom: 3rem !important; }
	.ids-hero { padding-top: 3.25rem !important; padding-bottom: 3.25rem !important; }
	.ids-cta .wp-block-buttons, .ids-cta .wp-block-button { width: 100%; }
	.ids-cta .wp-block-button__link { width: 100%; box-sizing: border-box; text-align: center; }
	.ids-head-row .ids-btn { width: 100%; justify-content: center; }
	.ids-footer__cols { gap: 1.25rem !important; }
	/* Bouton « Sections » et « Haut de page » plus discrets sur petit écran */
	.ids-quicknav__toggle { width: 44px !important; height: 44px !important; }
	.ids-totop { width: 42px; height: 42px; }
}

/* Fiche projet : informations clés sur 2 colonnes sur mobile */
@media (max-width: 640px) {
	.ids-facts { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
	.ids-facts > div { padding: .95rem 1rem; border-right: 0 !important; border-bottom: 1px solid var(--ids-line, #dfe7f3); }
	.ids-facts > div:nth-child(odd) { border-right: 1px solid var(--ids-line, #dfe7f3) !important; }
	.ids-facts > div:last-child:nth-child(odd) { grid-column: 1 / -1; border-right: 0 !important; }
	.ids-facts > div:nth-last-child(-n+2):not(:nth-child(odd)), .ids-facts > div:last-child { border-bottom: 0; }
	.ids-proj-hero { min-height: 0; padding-top: 4.5rem; padding-bottom: 4.5rem; }
}
@media (max-width: 599px) {
	.ids-form button { width: 100%; justify-self: stretch; min-height: 50px; }
}

/* Liens restants à agrandir sur écran tactile (pied de page, fil d'Ariane, barre de contact tablette) */
@media (max-width: 1079px) {
	.ids-footer a { padding: .55rem 0; }
	.ids-crumbs a { display: inline-block; padding: .45rem 0; }
}
@media (min-width: 600px) and (max-width: 1079px) {
	.ids-topbar a { display: inline-block; padding: .45rem 0; }
	.ids-topbar { padding-top: .1rem !important; padding-bottom: .1rem !important; }
}
@media (max-width: 1079px) {
	.ids-brand .wp-block-site-title a { display: inline-block; padding: .55rem 0; }
}

/* ---------- Hauteur des sections (tablette et ordinateur) ----------
   Espacements haut / bas multipliés par --ids-esp (réglage « Espacement des sections » : 1, .85 ou .7). */
@media (min-width: 600px) {
	.ids-section { padding-top: calc(clamp(3.5rem, 8vw, 6rem) * var(--ids-esp, .85)) !important; padding-bottom: calc(clamp(3.5rem, 8vw, 6rem) * var(--ids-esp, .85)) !important; }
	.ids-hero { padding-top: calc(clamp(4.5rem, 11vw, 8rem) * var(--ids-esp, .85)) !important; padding-bottom: calc(clamp(4.5rem, 11vw, 8rem) * var(--ids-esp, .85)) !important; }
	.ids-hero--page, .ids-article-hero { padding-top: calc(clamp(3.5rem, 8vw, 5rem) * var(--ids-esp, .85)) !important; padding-bottom: calc(clamp(3.5rem, 8vw, 5rem) * var(--ids-esp, .85)) !important; }
	.ids-cta { padding-top: calc(clamp(2.5rem, 6vw, 4rem) * var(--ids-esp, .85)) !important; padding-bottom: calc(clamp(2.5rem, 6vw, 4rem) * var(--ids-esp, .85)) !important; }
	.ids-footer { padding-top: calc(clamp(3rem, 7vw, 4.5rem) * var(--ids-esp, .85)) !important; }
	.ids-article { padding-top: calc(clamp(2.5rem, 5vw, 3.5rem) * var(--ids-esp, .85)) !important; }
	.ids-proj-hero { min-height: calc(clamp(380px, 58vh, 580px) * var(--ids-esp, .85)); padding-top: calc(clamp(5rem, 10vw, 7rem) * var(--ids-esp, .85)); padding-bottom: calc(clamp(5rem, 9vw, 6.5rem) * var(--ids-esp, .85)); }
	.ids-slide { min-height: calc(clamp(460px, 62vh, 640px) * var(--ids-esp, .85)) !important; padding-top: calc(clamp(4rem, 9vw, 6rem) * var(--ids-esp, .85)) !important; padding-bottom: calc(clamp(7.5rem, 12vw, 8.5rem) * var(--ids-esp, .85)) !important; }
	.ids-related { margin-top: calc(clamp(3rem, 6vw, 4.5rem) * var(--ids-esp, .85)) !important; padding-top: calc(clamp(2.5rem, 5vw, 3.5rem) * var(--ids-esp, .85)); }
}
