/* ==========================================================================
   Altitude Store : navigation, pied de page, boutique (v1.1)
   Chargé après main.css et woocommerce.css : ces règles ont le dernier mot.
   ========================================================================== */

/* ---------- Boutons : variantes ---------- */
.btn-petit { padding: 11px 20px; font-size: 12px; gap: 8px; }
.btn-bloc { display: flex; width: 100%; justify-content: center; }
.btn-lien {
	display: inline-flex; align-items: center; gap: 8px; padding: 0;
	background: none; border: 0; cursor: pointer;
	font: inherit; font-size: 13px; letter-spacing: .06em; color: var(--c-primaire);
	text-decoration: underline; text-underline-offset: 4px;
	transition: color .25s;
}
.btn-lien:hover { color: var(--c-accent); }

/* Bouton transparent à bordure claire (sur les visuels sombres) */
.btn-contour-clair { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .75); }
.btn-contour-clair:hover { background: #fff; color: var(--c-primaire); border-color: #fff; }

/* Deux boutons côte à côte dans le carrousel */
.hero-boutons { display: flex; flex-wrap: wrap; gap: 14px; }
@media (max-width: 480px) {
	.hero-boutons .btn { flex: 1 1 100%; justify-content: center; }
}

/* ---------- Barre du haut ---------- */
.annonce-grille {
	display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 20px;
}
.annonce-grille > p { padding: 10px 0; text-align: center; }
.annonce-liens { justify-self: end; }
.menu-utilitaire { display: flex; gap: 22px; margin: 0; padding: 0; list-style: none; }
.menu-utilitaire a {
	display: block; padding: 10px 0; opacity: .8;
	font-size: 11px; letter-spacing: .14em; text-transform: uppercase;
	transition: opacity .25s;
}
.menu-utilitaire a:hover { opacity: 1; }
@media (max-width: 860px) {
	.annonce-grille { grid-template-columns: 1fr; }
	.annonce-vide, .annonce-liens { display: none; }
}

/* ---------- En-tête : actions ---------- */
.entete-actions { gap: 4px; }
.entete-cta { margin-right: 14px; white-space: nowrap; }

.panier-bouton { width: auto; gap: 10px; padding: 0 6px; }
.panier-icone { position: relative; display: inline-flex; }
.panier-icone .panier-compteur { top: -6px; right: -9px; }
.panier-total {
	font-size: 13px; font-weight: 600; letter-spacing: .04em; white-space: nowrap;
}
.panier-total.est-vide { display: none; }

@media (max-width: 1180px) { .entete-cta { display: none; } }
@media (max-width: 1100px) { .panier-total { display: none; } }
@media (max-width: 480px)  { .btn-compte { display: none; } }

/* En-tête transparent sur l'accueil : il devient blanc dès qu'on le survole ou qu'on le parcourt au clavier */
.accueil .site-header:not(.est-defile):hover,
.accueil .site-header:not(.est-defile):focus-within {
	background: #fff; color: var(--c-primaire); border-color: var(--c-ligne);
}
.accueil .site-header:not(.est-defile):hover .logo-texte,
.accueil .site-header:not(.est-defile):focus-within .logo-texte { color: var(--c-primaire); }
.accueil .site-header:not(.est-defile):hover .menu > li > a,
.accueil .site-header:not(.est-defile):focus-within .menu > li > a { color: var(--c-primaire); }

.accueil .site-header:not(.est-defile) .entete-cta {
	color: #fff; border-color: rgba(255, 255, 255, .7);
}
.accueil .site-header:not(.est-defile) .entete-cta:hover {
	background: #fff; color: var(--c-primaire); border-color: #fff;
}
.accueil .site-header:not(.est-defile):hover .entete-cta,
.accueil .site-header:not(.est-defile):focus-within .entete-cta {
	color: var(--c-primaire); border-color: var(--c-primaire);
}
.accueil .site-header:not(.est-defile):hover .entete-cta:hover { background: var(--c-primaire); color: #fff; }

/* ---------- Menu principal : lien d'action (« Promotions ») ---------- */
.site-header .nav-principal .menu > li.cta { align-self: center; }
.site-header .nav-principal .menu > li.cta > a {
	padding: 10px 20px; border: 1px solid currentColor; border-radius: var(--rayon);
	transition: background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease);
}
.site-header .nav-principal .menu > li.cta > a::after { display: none; }
.site-header .nav-principal .menu > li.cta > a:hover {
	background: var(--c-accent); border-color: var(--c-accent); color: #fff;
}

/* Page courante : soulignement permanent */
.nav-principal .menu > li.current-menu-item > a::after,
.nav-principal .menu > li.current-menu-ancestor > a::after,
.nav-principal .menu > li.current-product_cat-ancestor > a::after { transform: scaleX(1); }

/* ---------- Sous-menus classiques (profondeur 2 et 3) ---------- */
@media (min-width: 1025px) {
	.nav-principal .sub-menu li { position: relative; }
	.nav-principal .sub-menu .sub-menu {
		left: 100%; top: -14px; margin-left: 2px;
	}
	.nav-principal .sub-menu .menu-item-has-children > a::after {
		content: ""; float: right; width: 7px; height: 7px; margin-top: 8px;
		border-top: 1px solid currentColor; border-right: 1px solid currentColor;
		transform: rotate(45deg); opacity: .6;
	}

	/* ---------- Méga-menu ---------- */
	.nav-principal .menu > li.mega { position: static; }

	.nav-principal .mega > .sub-menu {
		left: 0; right: 0; top: 100%; min-width: 0; margin: 0;
		display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px 36px;
		padding: 44px max(32px, calc((100% - 1480px) / 2 + 32px)) 52px;
		border-top: 1px solid var(--c-ligne);
		box-shadow: 0 30px 50px rgba(0, 20, 60, .12);
		transform: translateY(8px);
	}
	.nav-principal .mega:hover > .sub-menu,
	.nav-principal .mega:focus-within > .sub-menu,
	.nav-principal .mega.mega-ouvert > .sub-menu { transform: none; opacity: 1; visibility: visible; transition-delay: 0s; }

	/* Colonnes : titre (catégorie) puis liste (sous-catégories) */
	.nav-principal .mega > .sub-menu > li:not(.mega-promo) { align-self: start; }
	.nav-principal .mega > .sub-menu > li > a {
		display: block; padding: 0 0 12px; margin-bottom: 14px;
		border-bottom: 1px solid var(--c-ligne);
		font-size: 12px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--c-primaire);
	}
	.nav-principal .mega > .sub-menu > li > a:hover { padding-left: 0; color: var(--c-accent); }
	.nav-principal .mega .sub-menu .sub-menu {
		position: static; min-width: 0; margin: 0; padding: 0;
		opacity: 1; visibility: visible; transform: none; box-shadow: none; background: none;
	}
	.nav-principal .mega .sub-menu .sub-menu a {
		padding: 6px 0; font-size: 15px; color: var(--c-doux);
	}
	.nav-principal .mega .sub-menu .sub-menu a:hover { padding-left: 8px; color: var(--c-primaire); }
	.nav-principal .mega .sub-menu .menu-item-has-children > a::after { display: none; }

	/* Carte promotionnelle */
	.mega-promo { grid-column: span 2; min-width: 280px; }
	.nav-principal .mega .mega-promo a { padding: 0; }
	.nav-principal .mega .mega-promo a:hover { padding: 0; }
}

.mega-promo { list-style: none; }
.mega-promo-carte {
	position: relative; display: flex; align-items: flex-end; min-height: 220px; height: 100%;
	overflow: hidden; color: #fff !important; background: var(--c-primaire);
}
.mega-promo-fond {
	position: absolute; inset: 0; background-size: cover; background-position: center;
	background-image: linear-gradient(135deg, #0a3d91, #001a4d);
	transition: transform 1s var(--ease);
}
.mega-promo-fond[style] { background-image: none; }
.mega-promo-carte::after {
	content: ""; position: absolute; inset: 0;
	background: linear-gradient(0deg, rgba(0, 12, 38, .8), rgba(0, 12, 38, .1) 70%);
}
.mega-promo-carte:hover .mega-promo-fond { transform: scale(1.07); }
.mega-promo-texte { position: relative; z-index: 2; display: flex; flex-direction: column; gap: 6px; padding: 22px 24px; }
.mega-promo-texte strong { font-size: 1.35rem; font-weight: 300; line-height: 1.2; }
.mega-promo-texte > span { font-size: 14px; opacity: .88; line-height: 1.5; }
.mega-promo-lien {
	display: inline-flex; align-items: center; gap: 8px; margin-top: 8px;
	font-size: 12px !important; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; opacity: 1 !important;
}
.mega-promo-lien .icone { transition: transform .3s var(--ease); }
.mega-promo-carte:hover .mega-promo-lien .icone { transform: translateX(5px); }

/* ---------- Menu mobile ---------- */
.nav-mobile-pied { display: none; }

@media (max-width: 1024px) {
	.nav-principal .sub-menu li { display: flex; flex-wrap: wrap; align-items: center; }
	.nav-principal .sub-menu li > a { flex: 1; padding: 12px 0; font-size: 15px; color: var(--c-texte); }
	.nav-principal .sub-menu .sub-menu { width: 100%; padding-left: 14px; }
	.nav-principal .sub-menu .sub-menu a { font-size: 14px; color: var(--c-doux); }
	.nav-principal .sub-menu .sub-menu { display: none; }
	.nav-principal .sub-menu .sous-menu-ouvert > .sub-menu { display: block; }

	.nav-principal .sub-menu a:hover { padding-left: 0; }
	.nav-principal .menu > li.cta > a { padding: 18px 0; border: 0; border-radius: 0; color: var(--c-accent) !important; }
	.nav-principal .menu > li.cta > a:hover { background: none; color: var(--c-primaire) !important; }
	.nav-principal .menu > li.cta { display: block; }

	.mega-promo { width: 100%; padding-top: 6px; }
	.mega-promo-carte { min-height: 150px; }

	.nav-mobile-pied {
		display: block; margin-top: auto; padding-top: 28px;
	}
	.nav-mobile-liens { list-style: none; margin: 22px 0 0; padding: 0; display: grid; gap: 4px; }
	.nav-mobile-liens a {
		display: block; padding: 10px 0; font-size: 14px; color: var(--c-doux);
	}
	.nav-mobile-liens a:hover { color: var(--c-accent); }
	.nav-principal { padding-bottom: 36px; }
}

/* ---------- Paiement : en-tête et pied de page épurés ---------- */
.site-header-tunnel { position: static; height: 76px; }
.tunnel-grille {
	height: 100%; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 20px;
}
.tunnel-grille .logo { text-align: center; }
.tunnel-retour {
	display: inline-flex; align-items: center; gap: 8px; justify-self: start;
	font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--c-primaire);
	transition: color .25s, gap .3s var(--ease);
}
.tunnel-retour:hover { color: var(--c-accent); gap: 12px; }
.tunnel-securise {
	display: inline-flex; align-items: center; gap: 8px; justify-self: end; margin: 0;
	font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: #1f7a4d;
}
@media (max-width: 640px) {
	.tunnel-retour span, .tunnel-securise span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); }
	.tunnel-grille { grid-template-columns: 44px 1fr 44px; }
	.tunnel-retour, .tunnel-securise { justify-self: center; }
}
.site-footer-tunnel { padding-top: 0; margin-top: 50px; }
.site-footer-tunnel .footer-bas { border-top: 0; }

/* ---------- Pied de page : contact et newsletter ---------- */
.pied-haut {
	padding: clamp(50px, 7vw, 90px) 0; color: #fff;
	background: linear-gradient(135deg, #001a4d, #0a3d91);
}
.pied-haut-grille {
	display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 7vw, 120px); align-items: start;
}
.pied-newsletter { padding-left: clamp(0px, 4vw, 70px); border-left: 1px solid rgba(255, 255, 255, .22); }
.pied-haut h2 { margin-bottom: 14px; font-size: clamp(1.5rem, 2.6vw, 2.1rem); color: #fff; }
.pied-haut p { color: rgba(255, 255, 255, .85); }
.pied-horaires { margin: 22px 0 0; font-size: 13px; letter-spacing: .06em; opacity: .75; }

.pied-newsletter .newsletter-ligne { margin: 24px 0 14px; max-width: 520px; }
.pied-newsletter .consentement { justify-content: flex-start; margin: 0; }
.pied-newsletter .newsletter-message { margin: 18px 0 0; max-width: 520px; }

@media (max-width: 860px) {
	.pied-haut-grille { grid-template-columns: 1fr; }
	.pied-newsletter { padding: 36px 0 0; border-left: 0; border-top: 1px solid rgba(255, 255, 255, .22); }
}

/* ---------- Pied de page : colonnes ---------- */
.footer-grille.avec-colonne-4 { grid-template-columns: 1.5fr repeat(4, 1fr); }
.footer-col ul { list-style: none; margin: 0; padding: 0; }
.footer-contact li { display: flex; gap: 12px; align-items: flex-start; }
.footer-contact .icone { margin-top: 3px; opacity: .7; }
.site-footer .footer-contact li a:hover { padding-left: 0; color: #fff; text-decoration: underline; }
.site-footer .widget { background: none; padding: 0; margin-bottom: 24px; }
.footer-bas { row-gap: 14px; }

.paiements { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.site-footer .paiements li {
	margin: 0; padding: 4px 10px; border: 1px solid rgba(255, 255, 255, .25); border-radius: 3px;
	font-size: 11px; letter-spacing: .1em; text-transform: uppercase;
}

@media (max-width: 1100px) {
	.footer-grille.avec-colonne-4 { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
	.footer-grille.avec-colonne-4 { grid-template-columns: 1fr; }
}

/* ==========================================================================
   Boutique
   ========================================================================== */

/* ---------- Bandeau de catégorie ---------- */
.bandeau-boutique { position: relative; overflow: hidden; }
.bandeau-contenu { position: relative; z-index: 2; }
.bandeau-description { max-width: 680px; margin-top: 14px; color: var(--c-doux); font-size: 1.05rem; }
.bandeau-description p:last-child { margin-bottom: 0; }

.bandeau-boutique.a-image { min-height: 300px; display: flex; align-items: flex-end; border-bottom: 0; }
.bandeau-boutique.a-image .conteneur-large { width: 100%; }
.bandeau-image { position: absolute; inset: 0; background-size: cover; background-position: center; }
.bandeau-image::after {
	content: ""; position: absolute; inset: 0;
	background: linear-gradient(90deg, rgba(0, 12, 38, .82), rgba(0, 12, 38, .3));
}
.a-image .bandeau-titre, .a-image .fil-ariane, .a-image .fil-ariane a,
.a-image .bandeau-description { color: #fff; }

/* ---------- Pastilles de catégories ---------- */
.puces { display: flex; flex-wrap: wrap; gap: 10px; margin: 24px 0 0; padding: 0; list-style: none; }
.puce {
	display: inline-block; padding: 9px 20px; background: #fff;
	border: 1px solid var(--c-ligne);
	font-size: 12px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--c-texte);
	transition: background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease);
}
.puce:hover, .puce.est-actif { background: var(--c-primaire); border-color: var(--c-primaire); color: #fff; }
@media (max-width: 760px) {
	.bandeau-boutique .puces {
		flex-wrap: nowrap; overflow-x: auto; margin-right: -20px; padding-right: 20px; padding-bottom: 6px;
		scrollbar-width: none;
	}
	.bandeau-boutique .puces::-webkit-scrollbar { display: none; }
	.puce { white-space: nowrap; }
}

/* ---------- Barre d'outils : filtres actifs, choix de la grille ---------- */
.filtres-actifs { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 22px; }
.puce-filtre {
	display: inline-flex; align-items: center; gap: 10px; padding: 7px 12px 7px 14px;
	background: var(--c-alt); border: 1px solid var(--c-ligne); font-size: 13px;
	transition: background .25s, color .25s, border-color .25s;
}
.puce-filtre:hover { background: var(--c-primaire); border-color: var(--c-primaire); color: #fff; }
.effacer-filtres {
	margin-left: 6px; font-size: 12px; letter-spacing: .08em; text-transform: uppercase;
	color: var(--c-doux); text-decoration: underline; text-underline-offset: 4px;
}
.effacer-filtres:hover { color: var(--c-accent); }

.vue-boutons { display: inline-flex; gap: 6px; margin-left: auto; }
.vue-bouton {
	width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; padding: 0;
	background: #fff; border: 1px solid var(--c-ligne); color: var(--c-doux); cursor: pointer;
	transition: background .25s, color .25s, border-color .25s;
}
.vue-bouton:hover { border-color: var(--c-primaire); color: var(--c-primaire); }
.vue-bouton[aria-pressed="true"] { background: var(--c-primaire); border-color: var(--c-primaire); color: #fff; }
@media (max-width: 760px) { .vue-boutons { display: none; } }

/* Grille choisie par les boutons */
@media (min-width: 761px) {
	.boutique-contenu[data-vue="2"] ul.products { --cols: 2; }
	.boutique-contenu[data-vue="3"] ul.products { --cols: 3; }
}
@media (min-width: 1025px) {
	.boutique-contenu[data-vue="4"] ul.products { --cols: 4; }
}

/* ---------- Cartes produit ---------- */
.carte-cat {
	margin: 0 0 3px; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--c-doux);
}

/* ---------- Filtres (colonne de gauche) ---------- */
.filtres .widget { background: none; padding: 0 0 30px; border-radius: 0; }
.filtres .product-categories { padding: 0; }
.filtres .product-categories .children { padding-left: 16px; margin-top: 4px; }
.filtres .current-cat > a, .filtres .chosen a { color: var(--c-accent); font-weight: 600; }
.filtres .woocommerce-widget-layered-nav-list__item { display: flex; justify-content: space-between; }
.filtre-bascule {
	display: flex; align-items: center; gap: 12px; font-size: 15px;
	transition: color .25s;
}
.filtre-bascule:hover { color: var(--c-accent); }
.filtre-case {
	width: 20px; height: 20px; display: inline-flex; align-items: center; justify-content: center;
	border: 1px solid #aeb6c5; background: #fff; color: #fff; transition: background .25s, border-color .25s;
}
.filtre-bascule.est-actif .filtre-case { background: var(--c-primaire); border-color: var(--c-primaire); }

@media (max-width: 1024px) {
	.filtres-bouton { margin-bottom: 4px; }
	.filtres { border: 1px solid var(--c-ligne); }
	.filtres .widget:last-child { border-bottom: 0; margin-bottom: 0; padding-bottom: 0; }
}

/* ---------- Fiche produit ---------- */
.produit-cat {
	margin: 0 0 10px; font-size: 12px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase;
}
.produit-cat a { color: var(--c-accent); }
.produit-cat a:hover { color: var(--c-primaire); }
.guide-lien { margin: -8px 0 22px; }

/* Fenêtre : guide des tailles */
.modal {
	position: fixed; inset: 0; z-index: 170;
	display: flex; align-items: center; justify-content: center; padding: 24px;
	background: rgba(0, 12, 38, .6);
	opacity: 0; visibility: hidden;
	transition: opacity .35s var(--ease), visibility 0s .35s;
}
.modal.est-ouvert { opacity: 1; visibility: visible; transition-delay: 0s; }
.modal-boite {
	width: min(100%, 820px); max-height: 88vh; display: flex; flex-direction: column;
	background: #fff; box-shadow: var(--ombre);
	transform: translateY(26px); transition: transform .45s var(--ease);
}
.modal.est-ouvert .modal-boite { transform: none; }
.modal-entete {
	display: flex; align-items: center; justify-content: space-between; gap: 16px;
	padding: 14px 14px 14px 28px; border-bottom: 1px solid var(--c-ligne);
}
.modal-entete h2 { margin: 0; font-size: 1.4rem; }
.modal-corps { overflow-y: auto; padding: 24px 28px 30px; }
.modal-corps h2 { margin-top: 1.4em; font-size: 1.2rem; }
.modal-corps h2:first-child { margin-top: 0; }
body.modal-ouverte { overflow: hidden; }

/* Barre d'achat fixe */
.achat-barre {
	position: fixed; left: 0; right: 0; bottom: 0; z-index: 95;
	padding: 12px 0; background: #fff; border-top: 1px solid var(--c-ligne);
	box-shadow: 0 -12px 34px rgba(0, 20, 60, .1);
	transform: translateY(110%); transition: transform .45s var(--ease);
}
.achat-barre.est-visible { transform: none; }
.achat-barre-grille { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.achat-barre-produit { display: flex; align-items: center; gap: 16px; min-width: 0; }
.achat-barre-image { flex: none; width: 46px; height: 58px; background: var(--c-alt); overflow: hidden; }
.achat-barre-image img { width: 100%; height: 100%; object-fit: cover; }
.achat-barre-texte { display: flex; flex-direction: column; min-width: 0; }
.achat-barre-titre { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--c-primaire); }
.achat-barre-prix { font-size: 14px; color: var(--c-doux); }
.achat-barre .btn { flex: none; padding: 14px 28px; }
body.achat-visible .retour-haut { bottom: 100px; }
@media (max-width: 640px) {
	.achat-barre-image, .achat-barre-titre { display: none; }
	.achat-barre .btn { padding: 14px 20px; font-size: 12px; }
	.achat-barre-prix { font-size: 17px; font-weight: 600; color: var(--c-primaire); }
}

/* ---------- Contact et questions fréquentes ---------- */
.contact-grille { display: grid; grid-template-columns: 1fr 1.4fr; gap: clamp(30px, 6vw, 90px); align-items: start; }
.contact-infos h2 { font-size: 1.8rem; }
.contact-infos p { color: var(--c-doux); }
.contact-liste { list-style: none; margin: 30px 0 0; padding: 0; }
.contact-liste li {
	display: flex; flex-direction: column; gap: 4px; padding: 16px 0; border-top: 1px solid var(--c-ligne);
}
.contact-liste strong { font-size: 11px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--c-doux); }
.contact-liste a:hover { color: var(--c-accent); }
.contact-formulaire { padding: clamp(24px, 4vw, 44px); background: var(--c-alt); }
.contact-formulaire label { display: block; margin-bottom: 6px; font-size: 13px; font-weight: 500; }
.contact-formulaire p { margin-bottom: 18px; }
.champ-double { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; }
.contact-formulaire .consentement { display: flex; font-weight: 400; color: var(--c-doux); }
.contact-formulaire .consentement input { width: auto; flex: none; }
.message-formulaire { margin: 0 0 22px; padding: 14px 18px; font-size: 14px; }
.message-ok { background: #e8f6ee; border-left: 3px solid #1f9d62; color: #14532d; }
.message-erreur { background: #fdecec; border-left: 3px solid #d63638; color: #7a1b1b; }
@media (max-width: 860px) {
	.contact-grille, .champ-double { grid-template-columns: 1fr; }
}

.article-contenu details { border-bottom: 1px solid var(--c-ligne); }
.article-contenu details:first-of-type { border-top: 1px solid var(--c-ligne); }
.article-contenu summary {
	position: relative; padding: 22px 40px 22px 0; cursor: pointer; list-style: none;
	font-size: 1.1rem; color: var(--c-primaire); transition: color .25s;
}
.article-contenu summary::-webkit-details-marker { display: none; }
.article-contenu summary::after {
	content: "+"; position: absolute; right: 4px; top: 50%; transform: translateY(-50%);
	font-size: 1.6rem; font-weight: 300; transition: transform .3s var(--ease);
}
.article-contenu summary:hover { color: var(--c-accent); }
.article-contenu details[open] summary::after { content: "−"; }
.article-contenu details > p { margin: 0 0 22px; color: var(--c-doux); }