/**
 * Hally Blocks : variables de la charte et styles des blocs natifs.
 * Les styles propres à chaque bloc custom sont dans blocks/<bloc>/style.css.
 */

:root {
	--hally-violet: #766798;
	--hally-violet-clair: #998cbe;
	--hally-violet-fonce: #5d4f80;
	--hally-encre: #2d293f;
	--hally-texte: #4a4857;
	--hally-lavande: #f8f5fc;
	--hally-lavande-2: #f1ecf8;
	--hally-bordure: #e3ddee;
	--hally-bordure-claire: #f0ecf6;
	--hally-corail: #d9997e;
	--hally-corail-clair: #fbeee8;
	--hally-texte-sur-fonce: #dcd6e8;
	--hally-blanc: #ffffff;
	--hally-serif: 'Lora', Georgia, serif;
	--hally-sans: 'DM Sans', system-ui, sans-serif;
	--hally-ancre-decalage: 120px; /* en-tête collant du site */
}

body {
	counter-reset: hally-section;
}

/* Chapô : premier paragraphe d'introduction */
p.is-style-hally-chapo {
	font-size: 19px;
	line-height: 1.7;
	color: var(--hally-encre);
}

/* Titre de section numéroté (01, 02…) */
h2.wp-block-heading.is-style-hally-numerote {
	counter-increment: hally-section;
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 16px;
	align-items: baseline;
	font-family: var(--hally-serif);
	font-weight: 600;
	font-size: clamp(26px, 3vw, 32px);
	line-height: 1.2;
	color: var(--hally-encre);
	margin: 56px 0 18px;
	scroll-margin-top: var(--hally-ancre-decalage);
}

h2.wp-block-heading.is-style-hally-numerote::before {
	content: counter(hally-section, decimal-leading-zero);
	font-family: var(--hally-sans);
	font-size: 15px;
	font-weight: 700;
	color: var(--hally-corail);
}

h2.wp-block-heading.is-style-hally-numerote strong {
	font-weight: inherit;
}

/* Ancres du sommaire */
h2[id] {
	scroll-margin-top: var(--hally-ancre-decalage);
}

/* Encadré violet (core/group). Thème classique : les enfants sont dans .wp-block-group__inner-container */
.wp-block-group.is-style-hally-encadre {
	background: linear-gradient(135deg, var(--hally-violet), var(--hally-violet-clair));
	border-radius: 28px;
	padding: 32px 36px;
	color: var(--hally-blanc);
	font-size: 17px;
	line-height: 1.75;
	margin: 28px 0;
}

.wp-block-group.is-style-hally-encadre > *,
.wp-block-group.is-style-hally-encadre > .wp-block-group__inner-container > * {
	color: inherit;
}

.wp-block-group.is-style-hally-encadre > * + *,
.wp-block-group.is-style-hally-encadre > .wp-block-group__inner-container > * + * {
	margin-top: 18px;
}

.wp-block-group.is-style-hally-encadre > :first-child,
.wp-block-group.is-style-hally-encadre > .wp-block-group__inner-container > :first-child {
	margin-top: 0;
}

.wp-block-group.is-style-hally-encadre > :last-child,
.wp-block-group.is-style-hally-encadre > .wp-block-group__inner-container > :last-child {
	margin-bottom: 0;
}

.wp-block-group.is-style-hally-encadre :where(h2, h3, h4) {
	color: var(--hally-blanc);
	font-family: var(--hally-serif);
}

.wp-block-group.is-style-hally-encadre a {
	color: var(--hally-blanc);
	text-decoration: underline;
	text-underline-offset: 3px;
}

@media (max-width: 600px) {
	.wp-block-group.is-style-hally-encadre {
		padding: 24px 22px;
		border-radius: 22px;
	}
}

/* Encadré clair (core/group) : extraits de texte, listes de dispositions, repères. Même langage que le résumé. */
.wp-block-group.is-style-hally-encadre-clair {
	position: relative;
	overflow: hidden;
	background: var(--hally-lavande);
	border-radius: 24px;
	padding: 28px 32px;
	margin: 28px 0;
	color: var(--hally-encre);
	font-size: 16px;
	line-height: 1.7;
}

.wp-block-group.is-style-hally-encadre-clair::before {
	content: "";
	position: absolute;
	top: 0;
	left: 32px;
	width: 56px;
	height: 4px;
	background: var(--hally-corail);
	border-radius: 0 0 4px 4px;
}

.wp-block-group.is-style-hally-encadre-clair > * + *,
.wp-block-group.is-style-hally-encadre-clair > .wp-block-group__inner-container > * + * {
	margin-top: 14px;
}

.wp-block-group.is-style-hally-encadre-clair > :first-child,
.wp-block-group.is-style-hally-encadre-clair > .wp-block-group__inner-container > :first-child {
	margin-top: 0;
}

.wp-block-group.is-style-hally-encadre-clair > :last-child,
.wp-block-group.is-style-hally-encadre-clair > .wp-block-group__inner-container > :last-child {
	margin-bottom: 0;
}

.wp-block-group.is-style-hally-encadre-clair :where(ul, ol) {
	margin: 0;
	padding-left: 1.3em;
}

.wp-block-group.is-style-hally-encadre-clair li + li {
	margin-top: 6px;
}

.wp-block-group.is-style-hally-encadre-clair li::marker {
	color: var(--hally-violet);
	font-weight: 700;
}

.wp-block-group.is-style-hally-encadre-clair a {
	color: var(--hally-violet-fonce);
	text-decoration: underline;
	text-underline-offset: 3px;
}

@media (max-width: 600px) {
	.wp-block-group.is-style-hally-encadre-clair {
		padding: 26px 22px 22px;
		border-radius: 20px;
	}

	.wp-block-group.is-style-hally-encadre-clair::before {
		left: 22px;
	}
}

/* FAQ Rank Math, style « FAQ Hally » (rank-math/faq-block) */
.rank-math-block.is-style-hally-faq {
	background: var(--hally-lavande);
	border-radius: 40px;
	padding: 24px 40px;
	margin: 24px 0 0;
	font-family: var(--hally-sans);
	color: var(--hally-texte);
}

.rank-math-block.is-style-hally-faq .rank-math-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.rank-math-block.is-style-hally-faq .rank-math-list-item {
	margin: 0;
	padding: 0;
	border-bottom: 1px solid var(--hally-bordure);
}

.rank-math-block.is-style-hally-faq .rank-math-list-item:last-child {
	border-bottom: 0;
}

.rank-math-block.is-style-hally-faq .rank-math-question {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 20px;
	margin: 0;
	padding: 22px 0;
	font-family: var(--hally-serif);
	font-weight: 600;
	font-size: 18px;
	line-height: 1.35;
	color: var(--hally-encre);
}

.rank-math-block.is-style-hally-faq .rank-math-answer {
	padding: 0 56px 24px 0;
	font-size: 15.5px;
	line-height: 1.7;
	color: var(--hally-texte);
}

.rank-math-block.is-style-hally-faq .rank-math-answer > * {
	margin: 0;
}

.rank-math-block.is-style-hally-faq .rank-math-answer > * + * {
	margin-top: 12px;
}

/* Accordéon (assets/js/faq-accordeon.js) */
.rank-math-block.is-style-hally-faq .hally-faq__repli > * {
	margin: 0;
}

.rank-math-block.is-style-hally-faq .hally-faq__repli > * + * {
	margin-top: 12px;
}

.rank-math-block.is-style-hally-faq.hally-faq-js .rank-math-question {
	cursor: pointer;
}

/* Icône + / − dessinée en dégradés pour pouvoir l'animer */
.rank-math-block.is-style-hally-faq.hally-faq-js .rank-math-question::after {
	content: "";
	flex: none;
	width: 30px;
	height: 30px;
	box-sizing: border-box;
	border-radius: 50%;
	border: 1.5px solid var(--hally-corail);
	background-color: transparent;
	background-image: linear-gradient(var(--hally-corail), var(--hally-corail)), linear-gradient(var(--hally-corail), var(--hally-corail));
	background-position: center;
	background-repeat: no-repeat;
	background-size: 12px 1.5px, 1.5px 12px;
}

.rank-math-block.is-style-hally-faq.hally-faq-js .is-open .rank-math-question::after {
	background-color: var(--hally-corail-clair);
	background-size: 12px 1.5px, 1.5px 0;
	transform: rotate(180deg);
}

/* Réponse repliée : hauteur 0 (grid 0fr), dépliée : hauteur du contenu (1fr) */
.rank-math-block.is-style-hally-faq.hally-faq-js .rank-math-answer {
	display: grid;
	grid-template-rows: 0fr;
	opacity: 0;
	padding-bottom: 0;
}

.rank-math-block.is-style-hally-faq.hally-faq-js .is-open .rank-math-answer {
	grid-template-rows: 1fr;
	opacity: 1;
	padding-bottom: 24px;
}

.rank-math-block.is-style-hally-faq.hally-faq-js .hally-faq__repli {
	min-height: 0;
	overflow: hidden;
}

/* Transitions activées après l'état initial (pas d'animation au chargement) */
.rank-math-block.is-style-hally-faq.hally-faq-ready .rank-math-answer {
	transition: grid-template-rows 0.35s ease, padding-bottom 0.35s ease, opacity 0.25s ease;
}

.rank-math-block.is-style-hally-faq.hally-faq-ready .is-open .rank-math-answer {
	transition: grid-template-rows 0.35s ease, padding-bottom 0.35s ease, opacity 0.3s ease 0.1s;
}

.rank-math-block.is-style-hally-faq.hally-faq-ready .rank-math-question::after {
	transition: transform 0.35s ease, background-size 0.35s ease, background-color 0.35s ease;
}

.rank-math-block.is-style-hally-faq .rank-math-question:focus-visible {
	outline: 2px solid var(--hally-violet);
	outline-offset: 4px;
	border-radius: 4px;
}

@media (prefers-reduced-motion: reduce) {
	.rank-math-block.is-style-hally-faq.hally-faq-ready .rank-math-answer,
	.rank-math-block.is-style-hally-faq.hally-faq-ready .is-open .rank-math-answer,
	.rank-math-block.is-style-hally-faq.hally-faq-ready .rank-math-question::after {
		transition: none;
	}
}

@media (max-width: 600px) {
	.rank-math-block.is-style-hally-faq {
		padding: 12px 22px;
		border-radius: 28px;
	}

	.rank-math-block.is-style-hally-faq .rank-math-answer {
		padding-right: 0;
	}
}

/* Colonne latérale des articles [hally_sidebar] : sommaire collant + carte d'appel à l'action */
.bde-shortcode:has(> .hally-sidebar) {
	position: sticky;
	top: calc(var(--wp-admin--admin-bar--height, 0px) + 100px);
	width: 100%;
}

.hally-sidebar {
	display: flex;
	flex-direction: column;
	gap: 20px;
	font-family: var(--hally-sans);
}

.hally-toc {
	background: var(--hally-lavande);
	border-radius: 24px;
	padding: 24px;
}

.hally-toc__entete {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 16px;
}

.hally-toc__titre {
	font-family: var(--hally-serif);
	font-weight: 600;
	font-size: 20px;
	color: var(--hally-encre);
}

.hally-toc__progression {
	font-size: 12px;
	font-weight: 500;
	color: var(--hally-violet-fonce);
	white-space: nowrap;
}

.hally-sidebar .hally-toc__liste {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.hally-sidebar .hally-toc__liste li {
	margin: 0;
	padding: 0;
}

.hally-sidebar .hally-toc__lien {
	display: grid;
	grid-template-columns: 26px 1fr;
	gap: 8px;
	padding: 10px 12px;
	border-radius: 12px;
	font-size: 14px;
	line-height: 1.4;
	font-weight: 400;
	color: var(--hally-texte);
	background: transparent;
	text-decoration: none;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.hally-sidebar .hally-toc__lien:hover,
.hally-sidebar .hally-toc__lien:focus-visible {
	color: var(--hally-encre);
}

.hally-sidebar .hally-toc__lien.is-active {
	background: var(--hally-blanc);
	color: var(--hally-encre);
	font-weight: 700;
}

.hally-toc__num {
	font-size: 12px;
	font-weight: 700;
	color: var(--hally-corail);
	padding-top: 1px;
}

/* Sommaire repliable (mobile, tablette) */
.hally-toc__bascule {
	flex: none;
	width: 36px;
	height: 36px;
	margin: -6px -8px -6px 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--hally-blanc);
	cursor: pointer;
	position: relative;
}

.hally-toc__bascule::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 8px;
	height: 8px;
	border-right: 2px solid var(--hally-violet-fonce);
	border-bottom: 2px solid var(--hally-violet-fonce);
	transform: translate(-50%, -70%) rotate(45deg);
	transition: transform 0.25s ease;
}

.hally-toc.is-replie .hally-toc__bascule::before {
	transform: translate(-50%, -70%) rotate(45deg);
}

.hally-toc:not(.is-replie) .hally-toc__bascule::before {
	transform: translate(-50%, -30%) rotate(-135deg);
}

.hally-toc__bascule:focus-visible {
	outline: 2px solid var(--hally-violet);
	outline-offset: 2px;
}

.hally-toc.is-replie .hally-toc__entete {
	margin-bottom: 0;
}

.hally-toc__bascule[hidden],
.hally-sidebar .hally-toc__liste[hidden] {
	display: none;
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

.hally-sidebar .wp-block-hally-appel-action.hally-cta--carte {
	max-width: none;
	margin: 0;
}

@media (max-width: 1023px) {
	.bde-shortcode:has(> .hally-sidebar) {
		position: static;
	}
}

/* ==========================================================================
   Template article : [hally_hero], [hally_etiquettes], [hally_bas_article]
   ========================================================================== */

/* Barre de progression de lecture */
.hally-progression {
	position: fixed;
	top: var(--wp-admin--admin-bar--height, 0px);
	left: 0;
	right: 0;
	height: 4px;
	z-index: 1000;
	background: transparent;
	pointer-events: none;
}

.hally-progression__barre {
	width: 0;
	height: 100%;
	background: linear-gradient(90deg, var(--hally-violet), var(--hally-corail));
	border-radius: 0 4px 4px 0;
	transition: width 0.1s linear;
}

/* Hero */
.hally-hero {
	margin: 0 20px;
	padding: 56px 0 0;
	background: var(--hally-lavande);
	border-radius: 40px;
	font-family: var(--hally-sans);
	color: var(--hally-texte);
}

.hally-hero__inner {
	max-width: 1240px;
	margin: 0 auto;
	padding: 0 24px;
	display: flex;
	flex-wrap: wrap;
	gap: 48px;
	align-items: flex-end;
}

.hally-hero__texte {
	flex: 1 1 420px;
	min-width: 0;
	padding-bottom: 72px;
}

/* Fil d'Ariane : styles globaux du site (wearehally-svc-crumbs), rien à redéfinir ici */

.hally-hero__surtitre,
.hally-surtitre {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0;
	font-size: 14px;
	font-weight: 500;
	color: var(--hally-violet-fonce);
}

.hally-hero__surtitre {
	margin-top: 0; /* l'espace vient du fil d'Ariane du site (margin-bottom 32px) */
}

.hally-hero__surtitre span,
.hally-surtitre span {
	flex: none;
	width: 28px;
	height: 1px;
	background: var(--hally-corail);
}

.hally-hero .hally-hero__titre {
	margin: 16px 0 28px;
	padding: 0;
	font-family: var(--hally-serif);
	font-weight: 600;
	font-size: clamp(38px, 5vw, 64px);
	line-height: 1.06;
	letter-spacing: -0.01em;
	color: var(--hally-encre);
	text-wrap: balance;
}

.hally-hero--titre-moyen .hally-hero__titre.hally-hero__titre {
	font-size: clamp(30px, 3.6vw, 50px);
	line-height: 1.1;
}

.hally-hero--titre-long .hally-hero__titre.hally-hero__titre {
	font-size: clamp(27px, 2.9vw, 40px);
	line-height: 1.15;
	letter-spacing: 0;
}

/* Titre long : la colonne de texte prend un peu plus de place que l'image */
.hally-hero--titre-long .hally-hero__texte {
	flex: 1.3 1 480px;
}

.hally-hero--titre-long .hally-hero__visuel {
	flex: 1 1 440px;
}

.hally-hero__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 24px;
	font-size: 14px;
	color: var(--hally-texte);
}

.hally-hero__auteur {
	display: flex;
	align-items: center;
	gap: 10px;
}

.hally-hero__auteur b {
	color: var(--hally-encre);
}

.hally-hero__avatar {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--hally-encre);
	color: var(--hally-blanc);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--hally-serif);
	font-weight: 700;
	font-size: 15px;
}

.hally-hero__infos {
	display: inline-flex;
	align-items: center;
	gap: 10px 24px;
	white-space: nowrap;
}

.hally-hero__point {
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: var(--hally-corail);
}

.hally-hero__visuel {
	position: relative;
	flex: 1 1 520px;
	min-width: 0;
	margin-bottom: -88px;
}

.hally-hero .hally-hero__image {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	object-position: left center;
	border-radius: 32px;
	box-shadow: 0 30px 60px -30px rgba(45, 41, 63, 0.45);
}

.hally-hero__chiffre {
	position: absolute;
	left: -28px;
	bottom: 36px;
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 14px 20px;
	background: var(--hally-blanc);
	border-radius: 20px;
	box-shadow: 0 12px 30px -12px rgba(45, 41, 63, 0.35);
}

.hally-hero__valeur {
	font-family: var(--hally-serif);
	font-weight: 700;
	font-size: 30px;
	line-height: 1;
	color: var(--hally-encre);
	white-space: nowrap;
}

.hally-hero__valeur span {
	font-size: 18px;
	color: var(--hally-violet);
}

.hally-hero__libelle {
	max-width: 120px;
	font-size: 12px;
	line-height: 1.35;
	color: var(--hally-texte);
}

/* Étiquettes sous l'article */
.hally-etiquettes {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 40px 0 0;
	padding: 0;
	list-style: none;
	font-family: var(--hally-sans);
}

.hally-etiquettes li {
	margin: 0;
}

.hally-etiquettes a {
	display: inline-block;
	padding: 7px 14px;
	border-radius: 999px;
	background: var(--hally-lavande);
	color: var(--hally-violet-fonce);
	font-size: 13px;
	text-decoration: none;
}

.hally-etiquettes a:hover,
.hally-etiquettes a:focus-visible {
	background: var(--hally-lavande-2);
}

/* Section FAQ pleine largeur */
.hally-bas-faq {
	margin: 40px 20px 0;
	padding: 72px 0;
	background: var(--hally-lavande);
	border-radius: 40px;
	font-family: var(--hally-sans);
	color: var(--hally-texte);
	scroll-margin-top: var(--hally-ancre-decalage);
}

.hally-bas-faq__inner {
	max-width: 1240px;
	margin: 0 auto;
	padding: 0 24px;
	display: flex;
	flex-wrap: wrap;
	gap: 48px 64px;
}

.hally-bas-faq__intro {
	flex: 1 1 300px;
	min-width: 0;
	max-width: 400px;
}

.hally-bas-faq__liste {
	flex: 999 1 480px;
	min-width: 0;
}

.hally-bas-faq .hally-bas-faq__titre {
	margin: 14px 0 16px;
	padding: 0;
	font-family: var(--hally-serif);
	font-weight: 600;
	font-size: clamp(30px, 3.4vw, 40px);
	line-height: 1.15;
	color: var(--hally-encre);
}

.hally-bas-faq__intro > p:not([class]),
.hally-bas-faq__intro > .wp-block-paragraph {
	margin: 0 0 28px;
	font-size: 15px;
	line-height: 1.65;
}

.hally-bas-faq__contact {
	display: grid;
	grid-template-columns: 40px 1fr;
	gap: 14px;
	padding: 24px;
	background: var(--hally-blanc);
	border-radius: 24px;
}

.hally-bas-faq__icone {
	width: 40px;
	height: 40px;
	border-radius: 12px;
	background: var(--hally-violet);
	color: var(--hally-blanc);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 18px;
}

.hally-bas-faq .hally-bas-faq__contact-titre {
	margin: 0;
	font-family: var(--hally-serif);
	font-weight: 600;
	font-size: 18px;
	color: var(--hally-encre);
}

.hally-bas-faq .hally-bas-faq__contact-texte {
	margin: 6px 0 12px;
	font-size: 14px;
	line-height: 1.55;
}

.hally-bas-faq__contact a {
	color: var(--hally-violet-fonce);
	text-decoration: underline;
	text-underline-offset: 3px;
	word-break: break-word;
}

/* L'accordéon prend le fond de la section */
.hally-bas-faq .rank-math-block.is-style-hally-faq {
	margin: 0;
	padding: 0;
	background: none;
	border-radius: 0;
}

.hally-bas-faq .rank-math-block.is-style-hally-faq .rank-math-list-item:last-child {
	border-bottom: 1px solid var(--hally-bordure);
}

/* « À lire aussi » et bandeau final */
.hally-bas-section {
	max-width: 1240px;
	margin: 0 auto;
	padding: 0 24px;
}

.hally-bas-section--lies {
	padding-top: 80px;
	padding-bottom: 40px;
}

.hally-bas-section--cta {
	margin-top: 40px;
	margin-bottom: 64px; /* espace avant le pied de page (maquette : footer margin-top 64px) */
}

.hally-bas-section .wp-block-hally-articles-lies.hally-lies,
.hally-bas-section .wp-block-hally-appel-action.hally-cta--bandeau {
	margin: 0;
}

/* Hero empilé : l'image passe sous le texte */
@media (max-width: 1080px) {
	.hally-hero__texte {
		padding-bottom: 8px;
	}

	.hally-hero__chiffre {
		left: 16px;
		bottom: 20px;
	}
}

@media (max-width: 767px) {
	.hally-hero {
		margin: 0 12px;
		padding-top: 36px;
		border-radius: 28px;
	}

	.hally-hero__inner {
		padding: 0 18px;
		gap: 32px;
	}

	.hally-hero__texte {
		padding-bottom: 8px;
	}

	.hally-hero__visuel {
		margin-bottom: -56px;
	}

	.hally-hero .hally-hero__image {
		border-radius: 22px;
	}

	.hally-hero__chiffre {
		left: 12px;
		bottom: 16px;
		padding: 10px 14px;
	}

	.hally-bas-faq {
		margin: 32px 12px 0;
		padding: 48px 0;
		border-radius: 28px;
	}

	.hally-bas-faq__inner {
		padding: 0 18px;
	}

	.hally-bas-section {
		padding: 0 16px;
	}

	.hally-bas-section--lies {
		padding-top: 56px;
	}

	.hally-bas-section--cta {
		margin-bottom: 40px;
	}
}
