/*
Theme Name: sarahenrh
Theme URI: https://github.com/nutridevops/sarahenrh
Author: nutridevops
Description: Thème bloc sur mesure pour le site vitrine de sarahenrh, consultante recrutement (Lyon / Auvergne-Rhône-Alpes). Identité « les deux côtés du miroir », palette lilas→aubergine en usage 80/20, typographie Playfair Display / Inter auto-hébergées (RGPD). Mobile-first.
Version: 0.8.8
Requires at least: 6.5
Tested up to: 7.0
Requires PHP: 8.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: sarahenrh
Tags: block-theme, full-site-editing, business, custom-colors, custom-menu
*/

/* ============================================================
   Compléments à theme.json (le gros du style vit dans theme.json).
   v0.1 : palette PROVISOIRE (codes hex Canva à figer, §14.5).
   ============================================================ */

/* Liste sans puce — pied de page */
.wp-block-list.is-style-no-bullet {
	list-style: none;
	padding-left: 0;
	margin-left: 0;
}

/* Liens du pied de page (fond sombre) */
.site-footer a {
	color: var(--wp--preset--color--lilas);
	text-decoration: none;
}
.site-footer a:hover {
	color: var(--wp--preset--color--blanc);
	text-decoration: underline;
}

/* En-tête : liens de navigation */
.site-header .wp-block-navigation a:hover {
	color: var(--wp--preset--color--violet);
}

/* Titres : retour à la ligne aux espaces uniquement (jamais au milieu d'un mot).
   Corrige le « overflow-wrap: break-word » global de WordPress sur les grands titres. */
h1, h2, h3, h4, h5, h6,
.wp-block-heading {
	overflow-wrap: normal;
	word-break: normal;
	hyphens: none;
}

/* ============================================================
   Bandeau cookies (RGPD / CNIL) — cf. inc/cookie-consent.php
   ============================================================ */
.srh-cookie {
	position: fixed;
	left: 16px;
	right: 16px;
	bottom: 16px;
	z-index: 9999;
	background: var(--wp--preset--color--noir-encre);
	color: #fff;
	border-radius: 16px;
	box-shadow: 0 10px 40px rgba(26, 19, 32, 0.35);
}
.srh-cookie[hidden] { display: none; }
.srh-cookie__inner {
	max-width: 1080px;
	margin: 0 auto;
	padding: 18px 22px;
	display: flex;
	flex-wrap: wrap;
	gap: 14px 24px;
	align-items: center;
	justify-content: space-between;
}
.srh-cookie__text {
	margin: 0;
	flex: 1 1 320px;
	font-size: 0.88rem;
	line-height: 1.5;
	color: #E3D4F2;
}
.srh-cookie__text a { color: #fff; text-decoration: underline; }
.srh-cookie__actions {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
}
.srh-cookie__btn {
	font-family: inherit;
	font-weight: 600;
	font-size: 0.9rem;
	padding: 11px 22px;
	border-radius: 999px;
	cursor: pointer;
	border: 2px solid transparent;
	line-height: 1.2;
}
.srh-cookie__btn--solid {
	background: var(--wp--preset--color--violet);
	color: #fff;
	border-color: var(--wp--preset--color--violet);
}
.srh-cookie__btn--solid:hover { background: var(--wp--preset--color--violet-fonce); border-color: var(--wp--preset--color--violet-fonce); }
.srh-cookie__btn--ghost {
	background: transparent;
	color: #fff;
	border-color: var(--wp--preset--color--lavande);
}
.srh-cookie__btn--ghost:hover { background: rgba(255, 255, 255, 0.1); }
.srh-cookie__btn:focus-visible { outline: 3px solid var(--wp--preset--color--lilas); outline-offset: 2px; }

@media (max-width: 600px) {
	.srh-cookie__inner { padding: 16px; }
	.srh-cookie__actions { width: 100%; }
	.srh-cookie__btn { flex: 1 1 auto; }
}

/* ============================================================
   Refonte premium v0.3 — composants d'accueil
   ============================================================ */

/* En-tête collant + wordmark en capitales (SARAHENRH) */
.site-header { position: sticky; top: 0; z-index: 100; }
.wp-block-site-title a {
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

/* Listes à coches (cartes audience, tarifs) */
.srh-check { list-style: none; padding-left: 0; }
.srh-check li {
	position: relative;
	padding-left: 1.6em;
}
.srh-check li::before {
	content: "✓";
	position: absolute;
	left: 0;
	color: var(--wp--preset--color--violet);
	font-weight: 700;
}
.srh-check-light li::before { color: var(--wp--preset--color--lilas); }
.srh-trust { list-style: none; padding-left: 0; }

/* Bande de preuve : une ligne propre avec points séparateurs en desktop,
   grille 2×2 sous tablette (fini les coupures ligne par ligne). */
.srh-proof { gap: 10px 0 !important; align-items: center; }
.srh-proof p { margin: 0; }
.srh-proof p:not(:first-child)::before {
	content: "·";
	display: inline-block;
	margin-inline: 16px;
	color: var(--wp--preset--color--violet);
	font-weight: 700;
}
@media (max-width: 781px) {
	.srh-proof {
		display: grid !important;
		grid-template-columns: 1fr 1fr;
		gap: 14px 22px !important;
		justify-items: center;
		text-align: center;
	}
	.srh-proof p:not(:first-child)::before { content: none; }
}

/* Frise méthode : pastilles numérotées + ligne de liaison */
.srh-timeline { position: relative; align-items: flex-start; }
.srh-timeline > .srh-step { flex: 1; }
.srh-num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border-radius: 999px;
	background: var(--wp--preset--color--violet);
	color: #fff;
	font-family: var(--wp--preset--font-family--titre);
	font-size: 1.3rem;
	font-weight: 700;
	margin: 0;
}
@media (min-width: 782px) {
	.srh-timeline::before {
		content: "";
		position: absolute;
		top: 28px;
		left: 12%;
		right: 12%;
		height: 2px;
		background: var(--wp--preset--color--bordure);
		z-index: 0;
	}
	.srh-timeline > .srh-step { position: relative; z-index: 1; }
}
@media (max-width: 781px) {
	.srh-timeline { flex-direction: column; }
}

/* Tarif central mis en avant */
@media (min-width: 782px) {
	.srh-featured {
		transform: translateY(-14px);
		box-shadow: 0 18px 50px rgba(62, 42, 77, 0.25);
	}
}

/* FAQ — accordéon natif (wp:details) */
.srh-faq .wp-block-details { background: #fff; }
.srh-faq .wp-block-details summary {
	font-family: var(--wp--preset--font-family--titre);
	font-weight: 600;
	font-size: 1.05rem;
	color: var(--wp--preset--color--aubergine);
	cursor: pointer;
	list-style: none;
	display: flex;
	justify-content: space-between;
	gap: 16px;
}
.srh-faq .wp-block-details summary::-webkit-details-marker { display: none; }
.srh-faq .wp-block-details summary:hover { color: var(--wp--preset--color--violet); }
/* Chevron qui pivote (plutôt qu'un +/-) */
.srh-faq .wp-block-details summary::after {
	content: "";
	width: 9px;
	height: 9px;
	border-right: 2px solid var(--wp--preset--color--violet);
	border-bottom: 2px solid var(--wp--preset--color--violet);
	transform: rotate(45deg);
	transition: transform 200ms cubic-bezier(0.16, 1, 0.3, 1);
	flex: 0 0 auto;
	margin-top: 4px;
}
.srh-faq .wp-block-details[open] summary::after { transform: rotate(-135deg); }
.srh-faq .wp-block-details[open] summary { margin-bottom: 6px; }

/* ---------------------------------------------------------------------------
   Marque — logo (en-tête / pied) & portraits de Sarah
   --------------------------------------------------------------------------- */

/* Logo de marque (en-tête + pied de page) */
.site-brand-logo { margin: 0; }
.site-brand-logo a { display: inline-block; line-height: 0; }
.site-brand-logo img { display: block; height: auto; }
/* Largeur du logo d'en-tête pilotée en CSS (plus d'inline style) → les
   réductions mobiles ci-dessous peuvent réellement s'appliquer. */
.site-header .site-brand-logo img { width: 156px; }

/* En-tête : bloc marque = wordmark + sous-titre en TEXTE (lisible, accessible,
   net à toute taille) plutôt que la micro-typo gravée dans l'image. */
.site-brand { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; }
.site-brand-tagline {
	margin: 0;
	font-size: 0.6rem;
	font-weight: 600;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--wp--preset--color--aubergine);
	white-space: nowrap;
}

/* Version blanche pour le pied sombre : on inverse le logo couleur (un seul fichier) */
.site-brand-logo--invert img { filter: brightness(0) invert(1); }

/* ============================================================
   CTA d'en-tête « Parler à Sarah » — pilule soignée
   ------------------------------------------------------------
   1) Robustesse : largeur = contenu + ne se replie JAMAIS
      (corrige le texte « vertical » sur mobile, même si WordPress
      réinjecte la classe « largeur 100 % » wp-block-button__width-100).
   2) UX/UI : profondeur discrète, flèche qui avance au survol,
      état pressé, anneau de focus clavier (accessibilité).
   ============================================================ */
.site-header .wp-block-buttons { flex: 0 0 auto; }
.site-header .wp-block-button,
.site-header .wp-block-button.wp-block-button__width-100 { width: auto; max-width: none; }

.site-header .wp-block-button__link {
	width: auto;
	white-space: nowrap;
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	line-height: 1.1;
	background-color: var(--wp--preset--color--violet);
	box-shadow: 0 6px 16px -8px rgba(122, 79, 163, 0.65);
	transition: transform 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease;
}
/* Flèche « → » en SVG (hérite de la couleur du texte via mask). */
.site-header .wp-block-button__link::after {
	content: "";
	width: 0.85em;
	height: 0.85em;
	flex: 0 0 auto;
	background-color: currentColor;
	-webkit-mask: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
	mask: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
	transition: transform 0.18s ease;
}
.site-header .wp-block-button__link:hover {
	background-color: var(--wp--preset--color--violet-fonce);
	box-shadow: 0 12px 24px -10px rgba(91, 55, 129, 0.7);
	transform: translateY(-1px);
}
.site-header .wp-block-button__link:hover::after { transform: translateX(3px); }
.site-header .wp-block-button__link:active {
	transform: translateY(0);
	box-shadow: 0 4px 12px -8px rgba(91, 55, 129, 0.6);
}
.site-header .wp-block-button__link:focus-visible {
	outline: 3px solid var(--wp--preset--color--lilas);
	outline-offset: 2px;
}

/* Mobile : rangée d'en-tête nette → [logo] ………… [CTA] [menu ☰].
   flex-wrap:wrap = filet de sécurité : sur un écran vraiment étroit, le CTA
   passe proprement à la ligne au lieu de déborder. */
@media (max-width: 600px) {
	.site-header__row { gap: 8px; flex-wrap: wrap; row-gap: 10px; }
	.site-header__row .site-brand { margin-right: auto; }
	.site-header__row .wp-block-buttons { order: 2; }
	.site-header__row .wp-block-navigation { order: 3; }
	.site-header .wp-block-button__link { padding: 10px 16px; font-size: 0.85rem; }
	.site-brand-tagline { display: none; } /* libère de la place ; le logo suffit */
}

/* Très petits écrans : CTA compact + flèche masquée pour rester à côté du ☰. */
@media (max-width: 380px) {
	.site-header .wp-block-button__link { padding: 9px 14px; font-size: 0.8rem; gap: 0; }
	.site-header .wp-block-button__link::after { display: none; }
}

/* Respect des préférences de mouvement réduit. */
@media (prefers-reduced-motion: reduce) {
	.site-header .wp-block-button__link,
	.site-header .wp-block-button__link::after { transition: none; }
	.site-header .wp-block-button__link:hover { transform: none; }
	.site-header .wp-block-button__link:hover::after { transform: none; }
}

/* ============================================================
   Menu overlay mobile (hamburger ☰) — liste lisible et aérée
   ------------------------------------------------------------
   Par défaut WordPress collait les liens à droite (nav « justifié à
   droite ») → texte au ras du bord, moitié gauche vide. On repasse en
   liste alignée à gauche, pleine largeur, grandes zones tactiles.
   Sélecteurs préfixés .site-header pour battre le CSS du cœur (:where).
   ============================================================ */
.site-header .wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation__responsive-container-content {
	align-items: stretch;                 /* liens pleine largeur */
	justify-content: flex-start;
	padding-top: calc(3rem + 28px);        /* dégage sous le bouton fermer (X) */
	padding-inline: clamp(22px, 7vw, 40px);
	padding-bottom: 40px;
}
.site-header .wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation__container {
	width: 100%;
	gap: 0;
	align-items: stretch;
}
.site-header .wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation-item {
	width: 100%;
	border-bottom: 1px solid rgba(255, 255, 255, 0.14);
}
.site-header .wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation-item:last-child { border-bottom: 0; }

.site-header .wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation-item__content {
	display: block;
	width: 100%;
	padding: 16px 2px;                     /* cible tactile confortable (> 48 px) */
	text-align: left;
	font-size: 1.35rem;
	font-weight: 500;
	line-height: 1.2;
	color: var(--wp--preset--color--blanc);
	transition: color 0.15s ease, padding-left 0.15s ease;
}
.site-header .wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation-item__content:hover,
.site-header .wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation-item__content:focus-visible {
	color: var(--wp--preset--color--lilas);
	padding-left: 8px;                     /* léger décalage au survol/focus */
}
/* Bouton fermer (X) : zone tactile nette, bien détachée du bord. */
.site-header .wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation__responsive-container-close {
	top: 20px;
	right: clamp(18px, 6vw, 34px);
	width: 44px;
	height: 44px;
}
@media (prefers-reduced-motion: reduce) {
	.site-header .wp-block-navigation__responsive-container.is-menu-open
		.wp-block-navigation-item__content { transition: none; }
}

/* Portraits de Sarah (accueil + à propos) */
.brand-portrait { margin: 0; }
.brand-portrait img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 16px;
	box-shadow: 0 18px 40px -18px rgba(40, 16, 48, 0.35);
}

/* Mobile : logo d'en-tête un peu réduit, portrait centré et borné */
@media (max-width: 600px) {
	.site-header .site-brand-logo img { width: 124px; }
	.brand-portrait { max-width: 360px; margin-inline: auto; }
}
@media (max-width: 380px) {
	.site-header .site-brand-logo img { width: 116px; }
}

/* ============================================================
   Carte de visite numérique — hub /carte (cf. inc/carte.php)
   Style « link-in-bio » : autonome, mobile-first, accessible.
   ============================================================ */
.srh-carte-page {
	min-height: 100vh;
	min-height: 100dvh;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: clamp(20px, 6vw, 56px) 16px;
	background: var(--wp--preset--color--creme);
	background-image:
		radial-gradient(60rem 60rem at 85% -10%, var(--wp--preset--color--lilas) 0%, transparent 55%),
		radial-gradient(48rem 48rem at -10% 110%, var(--wp--preset--color--surface) 0%, transparent 60%);
	background-attachment: fixed;
}
.srh-carte { width: 100%; }
.srh-carte__card {
	max-width: 460px;
	margin: 0 auto;
	padding: clamp(28px, 6vw, 40px) clamp(20px, 5vw, 34px) clamp(24px, 5vw, 32px);
	background: var(--wp--preset--color--blanc);
	border: 1px solid var(--wp--preset--color--bordure);
	border-radius: 28px;
	box-shadow: 0 24px 60px rgba(62, 42, 77, 0.18);
	text-align: center;
}
.srh-carte__avatar {
	width: 132px;
	height: 132px;
	border-radius: 50%;
	object-fit: cover;
	object-position: center top;
	margin: 0 auto 18px;
	display: block;
	border: 4px solid var(--wp--preset--color--blanc);
	box-shadow: 0 0 0 2px var(--wp--preset--color--lavande), 0 10px 24px rgba(62, 42, 77, 0.22);
}
.srh-carte__name {
	font-family: var(--wp--preset--font-family--titre);
	font-weight: 600;
	font-size: 2rem;
	line-height: 1.1;
	color: var(--wp--preset--color--aubergine);
	margin: 0 0 4px;
}
.srh-carte__role {
	font-size: 0.82rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--violet);
	margin: 0 0 10px;
}
.srh-carte__slogan {
	font-family: var(--wp--preset--font-family--titre);
	font-style: italic;
	font-size: 1.1rem;
	color: var(--wp--preset--color--violet-fonce);
	margin: 0 0 26px;
}
.srh-carte__actions {
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.srh-carte__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: 100%;
	padding: 14px 20px;
	border-radius: 999px;
	font-family: var(--wp--preset--font-family--corps);
	font-weight: 600;
	font-size: 0.98rem;
	text-decoration: none;
	color: var(--wp--preset--color--aubergine);
	background: var(--wp--preset--color--blanc);
	border: 1.5px solid var(--wp--preset--color--bordure);
	transition: transform 0.16s ease, border-color 0.16s ease, background-color 0.16s ease, color 0.16s ease;
}
.srh-carte__btn:hover {
	transform: translateY(-2px);
	border-color: var(--wp--preset--color--lavande);
	background: var(--wp--preset--color--creme);
}
.srh-carte__btn:focus-visible {
	outline: 3px solid var(--wp--preset--color--lavande);
	outline-offset: 2px;
}
.srh-carte__icon { flex-shrink: 0; }
.srh-carte__btn--primary {
	color: var(--wp--preset--color--blanc);
	background: var(--wp--preset--color--violet);
	border-color: var(--wp--preset--color--violet);
}
.srh-carte__btn--primary:hover {
	background: var(--wp--preset--color--violet-fonce);
	border-color: var(--wp--preset--color--violet-fonce);
	color: var(--wp--preset--color--blanc);
}
.srh-carte__btn--save {
	color: var(--wp--preset--color--blanc);
	background: var(--wp--preset--color--aubergine);
	border-color: var(--wp--preset--color--aubergine);
}
.srh-carte__btn--save:hover {
	background: var(--wp--preset--color--noir-encre);
	border-color: var(--wp--preset--color--noir-encre);
	color: var(--wp--preset--color--blanc);
}
.srh-carte__socials {
	display: flex;
	justify-content: center;
	gap: 14px;
	margin-top: 22px;
}
.srh-carte__socials a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	color: var(--wp--preset--color--violet);
	background: var(--wp--preset--color--surface);
	transition: background-color 0.16s ease, color 0.16s ease, transform 0.16s ease;
}
.srh-carte__socials a:hover {
	background: var(--wp--preset--color--violet);
	color: var(--wp--preset--color--blanc);
	transform: translateY(-2px);
}
.srh-carte__socials a:focus-visible {
	outline: 3px solid var(--wp--preset--color--lavande);
	outline-offset: 2px;
}
.srh-carte__legal {
	margin: 24px 0 0;
	font-size: 0.78rem;
	color: var(--wp--preset--color--gris-texte);
}

/* --- Carte /carte : refonte conversion (hero, CTA, audiences, secondaire) --- */
/* Contenu plus long → top-aligné (évite tout rognage), centrage horizontal conservé. */
.srh-carte-page { align-items: flex-start; }

.srh-carte__hero { margin-bottom: 22px; }
.srh-carte__role { margin-bottom: 12px; }
.srh-carte__pitch {
	margin: 0 0 16px;
	font-size: 0.98rem;
	line-height: 1.5;
	color: var(--wp--preset--color--noir-encre);
}
.srh-carte__hero .srh-carte__slogan { margin-bottom: 4px; }
.srh-carte__slogan-sub {
	margin: 0;
	font-size: 0.82rem;
	line-height: 1.45;
	color: var(--wp--preset--color--gris-texte);
}

/* CTA principal dominant */
.srh-carte__primary { margin: 0; }
.srh-carte__btn--lg { padding: 16px 22px; font-size: 1.05rem; }
.srh-carte__cta-sub {
	margin: 8px 0 0;
	font-size: 0.8rem;
	color: var(--wp--preset--color--gris-texte);
}

/* Sections étiquetées (scanning rapide) */
.srh-carte__block,
.srh-carte__secondary {
	margin-top: 22px;
	padding-top: 20px;
	border-top: 1px solid var(--wp--preset--color--bordure);
	text-align: left;
}
.srh-carte__h2 {
	margin: 0 0 10px;
	font-family: var(--wp--preset--font-family--corps);
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--wp--preset--color--violet);
}
.srh-carte__block-text {
	margin: 0 0 12px;
	font-size: 0.88rem;
	line-height: 1.5;
	color: var(--wp--preset--color--gris-texte);
}
.srh-carte__block .srh-carte__btn + .srh-carte__btn { margin-top: 10px; }

/* Boutons « audience » : libellé à gauche, flèche à droite */
.srh-carte__btn--audience { justify-content: space-between; }
.srh-carte__btn--audience .srh-carte__icon { color: var(--wp--preset--color--violet); }

/* Actions secondaires : style léger (liens texte + petite icône) */
.srh-carte__secondary { display: flex; flex-direction: column; gap: 2px; }
.srh-carte__link {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 8px 2px;
	font-size: 0.92rem;
	font-weight: 500;
	color: var(--wp--preset--color--gris-texte);
	text-decoration: none;
	transition: color 0.16s ease;
}
.srh-carte__link .srh-carte__icon { color: var(--wp--preset--color--lavande); flex-shrink: 0; }
.srh-carte__link:hover { color: var(--wp--preset--color--violet); }
.srh-carte__link:hover .srh-carte__icon { color: var(--wp--preset--color--violet); }
.srh-carte__link:focus-visible { outline: 3px solid var(--wp--preset--color--lavande); outline-offset: 2px; border-radius: 6px; }
.srh-carte__hint {
	margin: 0 0 6px 30px;
	font-size: 0.76rem;
	font-style: italic;
	line-height: 1.4;
	color: var(--wp--preset--color--gris-texte);
}

/* Correctif marges & débordement de la carte /carte :
   - box-sizing fiable sur tout le sous-arbre (le bouton 100% ne déborde plus) ;
   - inset latéral de 16px sur le contenu (la carte ne touche plus les bords). */
.srh-carte { box-sizing: border-box; padding-left: 16px; padding-right: 16px; }
.srh-carte *, .srh-carte *::before, .srh-carte *::after { box-sizing: border-box; }

/* Respiration latérale interne de la carte = 1.5rem (24px) min, comme demandé. */
.srh-carte__card { padding-left: clamp(24px, 6vw, 34px); padding-right: clamp(24px, 6vw, 34px); }

/* ===========================================================================
   Accueil — section signature « Deux côtés » + système de mouvement (v0.5)
   Brand conservée (violet/aubergine, Playfair/Inter) : on ne touche qu'au
   rythme, à la respiration et aux micro-animations.
   =========================================================================== */

/* --- Section audience : intro + deux cartes à hauteur égale, CTA en bas --- */
.srh-audience { --srh-card-gap: clamp(1.5rem, 3vw, 3rem); }
/* Intro alignée au bord gauche de la grille (pas de centrage).
   Titre + chapô tiennent chacun sur une ligne (pas de plafond de largeur). */
.srh-audience-intro { text-align: left; }
.srh-audience-intro h2 { max-width: none; }
.srh-audience-intro p { max-width: none; }

.srh-audience-grid { align-items: stretch; }
.srh-audience-grid.wp-block-columns { gap: var(--srh-card-gap); }

/* Chaque colonne devient une carte en colonne flex → CTA poussé en bas.
   (L'espacement interne reste géré par le blockGap natif de la colonne.) */
.srh-audience-card.wp-block-column {
	display: flex;
	flex-direction: column;
}
.srh-audience-card h3 { line-height: 1.1; text-wrap: balance; }
.srh-audience-card p { max-width: 42ch; line-height: 1.65; }
/* Carte sombre : un peu plus d'interligne (les fonds foncés resserrent l'œil). */
.srh-audience-card--alt p,
.srh-audience-card--alt .srh-check li { line-height: 1.72; }
/* L'espace heading→texte→liste reste serré ; l'espace avant le CTA s'étire. */
.srh-audience-card .wp-block-buttons { margin-top: auto !important; padding-top: clamp(1rem, 2vw, 1.5rem); }
.srh-audience-card .wp-block-button,
.srh-audience-card .wp-block-button__link { width: 100%; }
.srh-audience-card .wp-block-button__link { text-align: center; }

/* Liste de bénéfices : un peu plus d'air entre les lignes. */
.srh-audience-card .srh-check li { line-height: 1.5; }

@media (max-width: 781px) {
	.srh-audience-grid.wp-block-columns { gap: clamp(1.25rem, 5vw, 2rem); }
}

/* --- Système de mouvement : révélations + survol (sobre) --- */
/* Les états masqués ne s'appliquent que si JS est actif (.js). Sans JS : visible. */
.js [data-reveal] {
	opacity: 0;
	transform: translateY(18px);
	transition:
		opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
		transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
	will-change: opacity, transform;
}
.js [data-reveal].is-visible { opacity: 1; transform: none; }

/* Cascade : les enfants directs d'un conteneur révélé entrent en décalé. */
.js [data-stagger] > * { opacity: 0; transform: translateY(18px); }
.js [data-stagger].is-visible > * {
	animation: srh-rise 0.7s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
.js [data-stagger].is-visible > :nth-child(1) { animation-delay: 40ms; }
.js [data-stagger].is-visible > :nth-child(2) { animation-delay: 120ms; }
.js [data-stagger].is-visible > :nth-child(3) { animation-delay: 200ms; }
.js [data-stagger].is-visible > :nth-child(4) { animation-delay: 280ms; }
	.js [data-stagger].is-visible > :nth-child(5) { animation-delay: 360ms; }
	.js [data-stagger].is-visible > :nth-child(6) { animation-delay: 440ms; }
	.js [data-stagger].is-visible > :nth-child(7) { animation-delay: 520ms; }
	.js [data-stagger].is-visible > :nth-child(8) { animation-delay: 600ms; }
@keyframes srh-rise { to { opacity: 1; transform: none; } }

/* Survol : élévation douce sur les éléments cliquables (boutons) + cartes. */
.wp-block-button__link {
	transition:
		transform 180ms cubic-bezier(0.16, 1, 0.3, 1),
		box-shadow 180ms cubic-bezier(0.16, 1, 0.3, 1),
		background-color 180ms ease;
}
.wp-block-button__link:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 24px rgba(62, 42, 77, 0.22);
}
.srh-audience-card {
	transition: box-shadow 220ms cubic-bezier(0.16, 1, 0.3, 1);
}
.srh-audience-card:hover { box-shadow: 0 22px 55px rgba(31, 18, 48, 0.12); }

/* Accessibilité : pas de mouvement si l'utilisateur le refuse. */
@media (prefers-reduced-motion: reduce) {
	.js [data-reveal],
	.js [data-reveal].is-visible,
	.js [data-stagger] > *,
	.js [data-stagger].is-visible > * {
		opacity: 1 !important;
		transform: none !important;
		animation: none !important;
		transition: none !important;
	}
	.wp-block-button__link:hover,
	.srh-audience-card:hover { transform: none; }
}

/* ===========================================================================
   Accueil — incrément 2 : cartes d'offres alignées + formulaire ressource
   =========================================================================== */

/* Offres : chaque carte en colonne flex → CTA épinglé en bas, même ligne. */
.srh-offers .wp-block-column { display: flex; flex-direction: column; }
.srh-offers .wp-block-column > .wp-block-buttons:last-child { margin-top: auto !important; padding-top: var(--wp--preset--spacing--40); }
.srh-offers .wp-block-button,
.srh-offers .wp-block-button__link { width: 100%; }
.srh-offers .wp-block-button__link { text-align: center; }

/* Mention CGV près des tarifs / CTA : discrète mais lisible. */
.srh-cgv-note {
	margin: var(--wp--preset--spacing--40) auto 0;
	max-width: 640px;
	font-size: 0.82rem;
	line-height: 1.55;
	color: var(--wp--preset--color--gris-texte);
}
.srh-cgv-note a { color: var(--wp--preset--color--violet); text-decoration: underline; }

/* Formulaire « ressource offerte » : plus d'air, champs cohérents. */
.srh-visually-hidden { position: absolute; left: -9999px; }
.srh-capture { display: flex; gap: 12px; flex-wrap: wrap; }
.srh-capture__input {
	flex: 1 1 240px;
	min-width: 220px;
	padding: 15px 20px;
	border: 0;
	border-radius: 999px;
	font-family: inherit;
	font-size: 0.95rem;
	color: var(--wp--preset--color--noir-encre);
}
.srh-capture__input::placeholder { color: #8a7d96; }
.srh-capture__input:focus-visible { outline: 3px solid var(--wp--preset--color--lilas); outline-offset: 2px; }
.srh-capture__btn {
	background: var(--wp--preset--color--violet);
	color: #fff;
	border: 0;
	padding: 15px 28px;
	border-radius: 999px;
	font-family: inherit;
	font-weight: 600;
	font-size: 0.95rem;
	cursor: pointer;
	white-space: nowrap;
	transition: transform 180ms cubic-bezier(0.16, 1, 0.3, 1), background-color 180ms ease;
}
.srh-capture__btn:hover { background: var(--wp--preset--color--violet-fonce); transform: translateY(-2px); }
.srh-consent {
	margin: 18px 0 0;
	font-size: 0.8rem;
	line-height: 1.55;
	color: #E3D4F2;
	display: flex;
	gap: 10px;
	align-items: flex-start;
}
.srh-consent input { margin-top: 3px; flex: 0 0 auto; }
.srh-consent a { color: #fff; text-decoration: underline; }

/* Lead magnet « Guide 7 erreurs CV » : formulaire de capture + état de succès. */
.srh-lead__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.srh-lead__consent {
	margin: 18px 0 0;
	font-size: 0.8rem;
	line-height: 1.55;
	color: #E3D4F2; /* fond sombre par défaut (accueil). */
	display: flex;
	gap: 10px;
	align-items: flex-start;
}
.srh-lead__consent input { margin-top: 3px; flex: 0 0 auto; }
.srh-lead__consent a { color: #fff; text-decoration: underline; }
.srh-lead__error {
	margin: 0 0 14px;
	padding: 12px 16px;
	border-radius: 12px;
	background: #FCEDED;
	color: #B23A3A;
	font-size: 0.9rem;
}
/* Variante fond clair (page Candidats). */
.srh-lead--light .srh-capture { max-width: 480px; margin: 0 auto; justify-content: center; }
.srh-lead--light .srh-capture__input { border: 1px solid var(--wp--preset--color--bordure); }
.srh-lead--light .srh-lead__consent { max-width: 480px; margin: 14px auto 0; color: var(--wp--preset--color--gris-texte); }
.srh-lead--light .srh-lead__consent a { color: var(--wp--preset--color--violet); }
/* État de succès : lien de téléchargement direct (fallback fiable). */
.srh-lead__success { text-align: center; }
/* Couleurs explicites (fini le color:inherit qui rendait le texte noir illisible sur fond sombre). */
.srh-lead__success-title { margin: 0 0 6px; font-weight: 700; color: #fff; }
.srh-lead__success-text { margin: 0 0 18px; font-size: 0.9rem; color: #E3D4F2; }
.srh-lead--light .srh-lead__success-title { color: var(--wp--preset--color--aubergine); }
.srh-lead--light .srh-lead__success-text { color: var(--wp--preset--color--gris-texte); }
/* CTA « lien » (section qui renvoie vers la landing, pas de formulaire en double). */
.srh-lead__cta { display: inline-block; text-decoration: none; }
/* Bouton centré (le titre et le texte de la section le sont aussi). */
.srh-lead--cta { text-align: center; }
.srh-lead__btn {
	display: inline-block;
	background: var(--wp--preset--color--violet);
	color: #fff;
	padding: 14px 28px;
	border-radius: 999px;
	font-weight: 600;
	font-size: 0.95rem;
	text-decoration: none;
	transition: transform 180ms cubic-bezier(0.16, 1, 0.3, 1), background-color 180ms ease;
}
.srh-lead__btn:hover { background: var(--wp--preset--color--violet-fonce); transform: translateY(-2px); }

/* ============================================================
   Page Contact — carte « Me contacter », rangées et pastilles réseaux
   ============================================================ */
.srh-cc-title {
	font-family: var(--wp--preset--font-family--titre);
	font-weight: 600;
	color: var(--wp--preset--color--aubergine);
	font-size: 1.3rem;
	line-height: 1.2;
	margin: 0 0 6px;
}
.srh-cc-card {
	background: var(--wp--preset--color--blanc);
	border: 1px solid var(--wp--preset--color--bordure);
	border-radius: 16px;
	padding: var(--wp--preset--spacing--60);
	box-shadow: 0 14px 40px -28px rgba(62, 42, 77, 0.45);
}
.srh-cc-reassure {
	margin: 0 0 22px;
	font-size: 0.92rem;
	line-height: 1.55;
	color: var(--wp--preset--color--gris-texte);
}
.srh-cc-rows { list-style: none; margin: 0; padding: 0; }
.srh-cc-row {
	display: flex;
	gap: 14px;
	align-items: flex-start;
	padding: 16px 0;
	border-top: 1px solid var(--wp--preset--color--bordure);
}
.srh-cc-row:first-child { border-top: 0; padding-top: 0; }
.srh-cc-row__ico {
	flex-shrink: 0;
	width: 40px;
	height: 40px;
	border-radius: 11px;
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--violet);
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.srh-cc-row__ico .srh-cc-ico { width: 19px; height: 19px; }
.srh-cc-row__body { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.srh-cc-row__label {
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.11em;
	text-transform: uppercase;
	color: var(--wp--preset--color--lavande);
}
.srh-cc-row__value {
	font-size: 0.98rem;
	font-weight: 500;
	color: var(--wp--preset--color--aubergine);
	text-decoration: none;
	word-break: break-word;
}
a.srh-cc-row__value:hover { color: var(--wp--preset--color--violet); text-decoration: underline; }
/* E-mail : garder l'adresse insécable (empêche le « m » de .com de passer seul à la ligne). */
a.srh-cc-row__value[href^="mailto:"] {
	white-space: nowrap;
	word-break: normal;
	overflow-wrap: normal;
	font-size: 0.92rem;
	letter-spacing: -0.006em;
}

.srh-cc-social {
	margin-top: 20px;
	padding-top: 18px;
	border-top: 1px solid var(--wp--preset--color--bordure);
}
.srh-cc-social__label {
	display: block;
	margin: 0 0 12px;
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.11em;
	text-transform: uppercase;
	color: var(--wp--preset--color--lavande);
}
.srh-cc-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.srh-cc-pill {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 15px;
	border-radius: 999px;
	border: 1px solid var(--wp--preset--color--bordure);
	background: var(--wp--preset--color--blanc);
	color: var(--wp--preset--color--aubergine);
	font-size: 0.85rem;
	font-weight: 600;
	text-decoration: none;
	transition: border-color 0.16s ease, background-color 0.16s ease, color 0.16s ease, transform 0.16s ease;
}
.srh-cc-pill .srh-cc-ico { width: 16px; height: 16px; color: var(--wp--preset--color--violet); }
.srh-cc-pill:hover {
	border-color: var(--wp--preset--color--lavande);
	background: var(--wp--preset--color--creme);
	color: var(--wp--preset--color--violet-fonce);
	transform: translateY(-1px);
}
.srh-cc-pill:hover .srh-cc-ico { color: var(--wp--preset--color--violet-fonce); }
.srh-cc-pill:focus-visible { outline: 3px solid var(--wp--preset--color--lavande); outline-offset: 2px; }

/* Panneaux droits (réserver / message) : titres alignés, espacement homogène */
.srh-cc-panel .srh-cc-title { margin-bottom: 8px; }
.srh-cc-panel .wp-block-buttons { margin-top: 6px; }

/* ============================================================
   Page Contact v2 — grille égale, carte « Réserver », formulaire, clôture
   ============================================================ */
.srh-cc-lede { max-width: 640px; }

/* Grille 2 colonnes à hauteur égale */
.srh-cc-grid > .wp-block-column { display: flex; }
.srh-cc-grid > .wp-block-column > .srh-cc-card { width: 100%; }

/* Carte « Réserver » : variante teintée, CTA poussé en bas */
.srh-cc-card--book {
	background: var(--wp--preset--color--surface);
	display: flex;
	flex-direction: column;
}
.srh-cc-card--book .srh-cc-reassure { margin-bottom: 18px; }
.srh-cc-perks { list-style: none; margin: 0 0 22px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.srh-cc-perks li {
	display: inline-flex; align-items: center; gap: 7px;
	font-size: 0.82rem; font-weight: 600;
	color: var(--wp--preset--color--violet-fonce);
	background: var(--wp--preset--color--blanc);
	border: 1px solid var(--wp--preset--color--bordure);
	border-radius: 999px; padding: 6px 13px;
}
.srh-cc-perks li::before { content: "\2713"; color: var(--wp--preset--color--violet); font-weight: 700; }
.srh-cc-book__cta { margin-top: auto; }
.srh-cc-book__cta .wp-block-buttons { margin: 0; }

/* Formulaire « Envoyer un message » : rythme et alignement */
.srh-contact { display: flex; flex-direction: column; gap: 24px; margin-top: 24px; font-family: var(--wp--preset--font-family--corps); }
.srh-contact__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.srh-contact__row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
@media (max-width: 600px) { .srh-contact__row { grid-template-columns: 1fr; } }
.srh-contact__group { display: flex; flex-direction: column; gap: 8px; }
.srh-contact__label { font-size: 0.85rem; font-weight: 600; color: var(--wp--preset--color--aubergine); }
.srh-contact__field {
	width: 100%; box-sizing: border-box;
	padding: 13px 16px; border-radius: 12px;
	border: 1px solid var(--wp--preset--color--bordure);
	background: var(--wp--preset--color--blanc);
	color: var(--wp--preset--color--noir-encre);
	font-family: inherit; font-size: 0.95rem;
	transition: border-color 0.16s ease, box-shadow 0.16s ease;
}
.srh-contact__field::placeholder { color: #A99FB3; }
.srh-contact__field:hover { border-color: var(--wp--preset--color--lavande); }
.srh-contact__field:focus,
.srh-contact__field:focus-visible {
	outline: none;
	border-color: var(--wp--preset--color--violet);
	box-shadow: 0 0 0 3px rgba(122, 79, 163, 0.15);
}
.srh-contact__textarea { resize: vertical; min-height: 140px; line-height: 1.5; }
.srh-contact__consent {
	display: flex; gap: 12px; align-items: flex-start;
	margin-top: 2px; padding: 14px 16px;
	background: var(--wp--preset--color--creme);
	border: 1px solid var(--wp--preset--color--bordure);
	border-radius: 12px;
	font-size: 0.82rem; line-height: 1.55; color: var(--wp--preset--color--gris-texte);
}
.srh-contact__consent input[type="checkbox"] { margin-top: 2px; flex-shrink: 0; width: 17px; height: 17px; accent-color: var(--wp--preset--color--violet); }
.srh-contact__consent a { color: var(--wp--preset--color--violet); text-decoration: underline; }
.srh-contact__consent-note { color: #9488A0; }
.srh-contact__note { display: flex; align-items: center; gap: 7px; margin: 0; font-size: 0.76rem; color: #8A7A92; }
.srh-contact__submit {
	align-self: flex-start; margin-top: 8px;
	background: var(--wp--preset--color--violet); color: var(--wp--preset--color--blanc);
	border: 0; padding: 15px 32px; border-radius: 999px;
	font-family: inherit; font-weight: 600; font-size: 0.95rem; cursor: pointer;
	transition: background-color 0.16s ease, transform 0.16s ease;
}
.srh-contact__submit:hover { background: var(--wp--preset--color--violet-fonce); transform: translateY(-1px); }
.srh-contact__submit:focus-visible { outline: 3px solid var(--wp--preset--color--lavande); outline-offset: 2px; }

/* Clôture douce — panneau soft + CTA discret (remplace le CTA global redondant) */
.srh-cc-closing {
	display: flex; align-items: center; justify-content: space-between; gap: 24px;
	padding: clamp(22px, 4vw, 32px) clamp(24px, 4vw, 38px);
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--bordure);
	border-radius: 18px;
}
.srh-cc-closing__text { margin: 0; max-width: 54ch; font-size: 1.02rem; line-height: 1.55; color: var(--wp--preset--color--aubergine); }
.srh-cc-closing__cta {
	flex-shrink: 0; display: inline-flex; align-items: center; gap: 9px;
	padding: 12px 22px; border-radius: 999px;
	background: var(--wp--preset--color--blanc);
	border: 1.5px solid var(--wp--preset--color--lavande);
	color: var(--wp--preset--color--violet-fonce);
	font-weight: 600; font-size: 0.92rem; text-decoration: none;
	transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease, transform 0.16s ease;
}
.srh-cc-closing__cta .srh-cc-ico { width: 18px; height: 18px; color: var(--wp--preset--color--violet); }
.srh-cc-closing__cta:hover { background: var(--wp--preset--color--violet); border-color: var(--wp--preset--color--violet); color: var(--wp--preset--color--blanc); transform: translateY(-1px); }
.srh-cc-closing__cta:hover .srh-cc-ico { color: var(--wp--preset--color--blanc); }
.srh-cc-closing__cta:focus-visible { outline: 3px solid var(--wp--preset--color--lavande); outline-offset: 2px; }
@media (max-width: 640px) {
	.srh-cc-closing { flex-direction: column; align-items: flex-start; gap: 16px; }
	.srh-cc-closing__cta { width: 100%; justify-content: center; box-sizing: border-box; }
}

/* Le CTA global du pied (« Parlons de votre projet ») est redondant sur Contact */
.srh-contact-page .site-footer__cta { display: none; }

/* ---------------------------------------------------------------------------
   Contact — deux parcours (« Je recrute » / « Je cherche un poste »)
   Onglets 100 % CSS : radios masqués + sélecteurs :checked ~ (aucun JS requis).
--------------------------------------------------------------------------- */
.srh-tabs { margin-top: 8px; }
.srh-tabs__radio { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.srh-tabs__nav {
	display: flex; gap: 8px;
	max-width: 520px; margin: 0 auto 30px; padding: 6px;
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--bordure);
	border-radius: 999px;
}
.srh-tabs__tab {
	flex: 1; text-align: center; padding: 12px 18px;
	border-radius: 999px; font-weight: 600; font-size: 0.95rem;
	color: var(--wp--preset--color--gris-texte); cursor: pointer;
	transition: background-color 0.18s ease, color 0.18s ease;
}
.srh-tabs__tab:hover { color: var(--wp--preset--color--violet-fonce); }
#srh-tab-ent:checked ~ .srh-tabs__nav .srh-tabs__tab--ent,
#srh-tab-cand:checked ~ .srh-tabs__nav .srh-tabs__tab--cand {
	background: var(--wp--preset--color--violet); color: var(--wp--preset--color--blanc);
}
#srh-tab-ent:focus-visible ~ .srh-tabs__nav .srh-tabs__tab--ent,
#srh-tab-cand:focus-visible ~ .srh-tabs__nav .srh-tabs__tab--cand {
	outline: 3px solid var(--wp--preset--color--lavande); outline-offset: 2px;
}
.srh-tabs__panel { display: none; }
#srh-tab-ent:checked ~ .srh-tabs__panel--ent,
#srh-tab-cand:checked ~ .srh-tabs__panel--cand { display: block; }

.srh-parcours__grid {
	display: grid; grid-template-columns: 0.85fr 1.15fr; gap: 28px; align-items: start;
}
@media (max-width: 781px) { .srh-parcours__grid { grid-template-columns: 1fr; } }
.srh-parcours__form-lede { margin: 4px 0 18px; font-size: 0.95rem; color: var(--wp--preset--color--gris-texte); }

/* Champ fichier (upload CV) + libellés d'aide. */
.srh-contact__optional { font-weight: 400; color: #9488A0; font-size: 0.85em; }
.srh-contact__file { padding: 12px 14px; cursor: pointer; }
.srh-contact__file::file-selector-button {
	margin-right: 12px; padding: 8px 14px; border: 0; border-radius: 999px;
	background: var(--wp--preset--color--surface); color: var(--wp--preset--color--violet-fonce);
	font-family: inherit; font-weight: 600; font-size: 0.85rem; cursor: pointer;
}
.srh-contact__hint { display: block; margin-top: 6px; font-size: 0.8rem; color: var(--wp--preset--color--gris-texte); }

/* ============================================================
   Blog — archive (home/index) et article (single)
   ============================================================ */
.srh-blog-topics { list-style: none; margin: 6px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.srh-blog-topics li {
	font-size: 0.8rem; font-weight: 600;
	color: var(--wp--preset--color--violet-fonce);
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--bordure);
	border-radius: 999px; padding: 6px 13px;
}
.srh-blog-featured .wp-block-post-featured-image img { border-radius: 14px; object-fit: cover; width: 100%; }
.srh-blog-featured .wp-block-post-title a { text-decoration: none; color: var(--wp--preset--color--aubergine); }
.srh-blog-featured .wp-block-post-title a:hover { color: var(--wp--preset--color--violet); }
.srh-blog-card { display: flex; flex-direction: column; height: 100%; }
.srh-blog-card .wp-block-post-excerpt { flex: 1 1 auto; }
.srh-blog-card__foot { margin-top: auto; align-items: center; }
.srh-blog-card .wp-block-post-title a { text-decoration: none; color: var(--wp--preset--color--aubergine); }
.srh-blog-card .wp-block-post-title a:hover { color: var(--wp--preset--color--violet); }
.srh-blog-card .wp-block-post-terms a { text-decoration: none; }
.srh-blog-empty h2 { color: var(--wp--preset--color--aubergine); }
.srh-blog-empty .wp-block-buttons { margin-top: 6px; }

/* Article (single) */
.srh-article-dek { max-width: 60ch; }
.srh-article-meta > * { margin: 0 !important; }
.srh-article-meta .wp-block-post-date,
.srh-article-meta .wp-block-post-author-name { display: inline; }
.srh-article-body { font-size: 1.05rem; line-height: 1.75; color: var(--wp--preset--color--noir-encre); }
.srh-article-body h2 { font-family: var(--wp--preset--font-family--titre); font-size: 1.55rem; line-height: 1.25; color: var(--wp--preset--color--aubergine); margin: 1.8em 0 0.1em; }
.srh-article-body h3 { font-family: var(--wp--preset--font-family--titre); font-size: 1.2rem; color: var(--wp--preset--color--aubergine); margin: 1.5em 0 0.1em; }
.srh-article-body a { color: var(--wp--preset--color--violet); text-underline-offset: 2px; }
.srh-article-body strong { color: var(--wp--preset--color--aubergine); }
.srh-article-body ul, .srh-article-body ol { padding-left: 1.3em; }
.srh-article-body li { margin: 0.4em 0; }
.srh-article-body img { border-radius: 14px; }
.srh-article-body blockquote { margin: 1.4em 0; padding: 0.2em 0 0.2em 1.3em; border-left: 3px solid var(--wp--preset--color--lavande); font-style: italic; color: var(--wp--preset--color--violet-fonce); }

/* Styles de blocs editoriaux */
.wp-block-group.is-style-callout { background: var(--wp--preset--color--surface); border: 1px solid var(--wp--preset--color--bordure); border-left: 4px solid var(--wp--preset--color--violet); border-radius: 12px; padding: clamp(18px, 3vw, 26px) clamp(20px, 3vw, 28px); }
.wp-block-group.is-style-callout > *:first-child { margin-top: 0; }
.wp-block-quote.is-style-editorial { border: 0; border-left: 3px solid var(--wp--preset--color--lavande); padding: 0 0 0 1.4em; margin: 1.4em 0; font-family: var(--wp--preset--font-family--titre); font-style: italic; font-size: 1.2rem; color: var(--wp--preset--color--violet-fonce); }

/* Bloc auteur */
.srh-article-author { display: flex; gap: 18px; align-items: flex-start; padding: clamp(20px, 3vw, 28px); background: var(--wp--preset--color--creme); border: 1px solid var(--wp--preset--color--bordure); border-radius: 18px; }
.srh-article-author__photo { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; flex-shrink: 0; border: 3px solid var(--wp--preset--color--blanc); box-shadow: 0 0 0 1px var(--wp--preset--color--bordure); }
.srh-article-author__body { display: flex; flex-direction: column; }
.srh-article-author__name { margin: 0; font-family: var(--wp--preset--font-family--titre); font-weight: 600; font-size: 1.1rem; color: var(--wp--preset--color--aubergine); }
.srh-article-author__role { margin: 3px 0 0; font-size: 0.74rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--wp--preset--color--violet); }
.srh-article-author__bio { margin: 10px 0 0; font-size: 0.92rem; line-height: 1.55; color: var(--wp--preset--color--gris-texte); }
.srh-article-author__link { margin-top: 10px; align-self: flex-start; font-size: 0.9rem; font-weight: 600; color: var(--wp--preset--color--violet); text-decoration: none; }
.srh-article-author__link:hover { color: var(--wp--preset--color--violet-fonce); text-decoration: underline; }
@media (max-width: 540px) { .srh-article-author { flex-direction: column; } }

/* ============================================================
   Boutons — correctifs & finition (fix « texte invisible »)
   ============================================================ */
/* Boutons « contour » : fond réellement transparent. Sans ça, le fond violet du
   thème (.wp-element-button) reste et le texte violet devient invisible. */
.wp-block-button.is-style-outline > .wp-block-button__link:not([class*="-background-color"]) {
	background-color: transparent;
}
/* Centrage fiable + cible tactile confortable sur tous les boutons */
.wp-block-button__link,
.wp-element-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
}
/* Focus visible (accessibilité) */
.wp-block-button__link:focus-visible,
.wp-element-button:focus-visible {
	outline: 3px solid var(--wp--preset--color--lavande);
	outline-offset: 2px;
}

/* Boutons pleins : légère profondeur + survol (respecte prefers-reduced-motion) */
.wp-block-button:not(.is-style-outline) > .wp-element-button {
	box-shadow: 0 8px 20px -12px rgba(62, 42, 77, 0.55);
	transition: transform 0.16s ease, box-shadow 0.16s ease, background-color 0.16s ease;
}
.wp-block-button:not(.is-style-outline) > .wp-element-button:hover {
	transform: translateY(-1px);
	box-shadow: 0 12px 26px -12px rgba(62, 42, 77, 0.6);
}
@media (prefers-reduced-motion: reduce) {
	.wp-block-button:not(.is-style-outline) > .wp-element-button { transition: none; }
	.wp-block-button:not(.is-style-outline) > .wp-element-button:hover { transform: none; }
}

/* ============================================================
   Candidats — jeu d'icônes cohérent (outline, tuile plum)
   ============================================================ */
.srh-ic {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	flex-shrink: 0;
	border-radius: 13px;
	background: rgba(122, 79, 163, 0.12);
	color: var(--wp--preset--color--violet-fonce);
}
.srh-ic__svg { width: 22px; height: 22px; }
.srh-step-ic { text-align: center; margin-bottom: 12px; }

/* Badge « Le plus choisi » — étoile de la même famille */
.srh-badge-choice {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 5px 12px;
	border-radius: 999px;
	background: var(--wp--preset--color--violet);
	color: var(--wp--preset--color--blanc);
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* Listes de tarifs : puces = coche outline (même famille) */
.srh-ticks { list-style: none; padding-left: 0; margin-left: 0; }
.srh-ticks li { position: relative; padding-left: 1.9em; }
.srh-ticks li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.14em;
	width: 1.15em;
	height: 1.15em;
	background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235B3781' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m20 6-11 11-5-5'/%3E%3C/svg%3E");
}
.srh-ticks--light li::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E3D4F2' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m20 6-11 11-5-5'/%3E%3C/svg%3E");
}

/* ============================================================
   Entreprises — panneau réassurance, bénéfices, étapes
   ============================================================ */
/* Panneau « En pratique » (hero) — grille icône/texte alignée, dividers doux */
.srh-panel {
	background: var(--wp--preset--color--blanc);
	border: 1px solid rgba(62, 42, 77, 0.10);
	border-radius: 22px;
	padding: clamp(26px, 2.6vw, 36px);
	box-shadow: 0 22px 44px rgba(62, 42, 77, 0.08);
}
.srh-panel__label {
	display: inline-block;
	margin: 0 0 18px;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--violet);
}
.srh-panel__list { list-style: none; margin: 0; padding: 0; }
.srh-panel__row {
	display: grid;
	grid-template-columns: 1.5rem 1fr;
	gap: 0.85rem;
	align-items: start;
	padding: 0.85rem 0;
	border-top: 1px solid rgba(62, 42, 77, 0.10);
}
.srh-panel__row:first-child { border-top: 0; padding-top: 0; }
.srh-panel__row:last-child { padding-bottom: 0; }
.srh-panel__ic {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	inline-size: 1.5rem;
	block-size: 1.5rem;
	margin-top: 0.12rem;
	color: var(--wp--preset--color--violet);
}
.srh-panel__txt {
	font-size: 1rem;
	line-height: 1.45;
	color: var(--wp--preset--color--aubergine);
}

/* « Ce que vous gagnez » — bénéfices concrets */
.srh-gains {
	list-style: none;
	margin: 26px 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 20px;
}
@media (max-width: 900px) { .srh-gains { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .srh-gains { grid-template-columns: 1fr; } }
.srh-gain { display: flex; flex-direction: column; gap: 9px; }
.srh-gain__label {
	font-family: var(--wp--preset--font-family--titre);
	font-weight: 600;
	font-size: 1rem;
	line-height: 1.2;
	color: var(--wp--preset--color--aubergine);
}
.srh-gain__text {
	font-size: 0.85rem;
	line-height: 1.45;
	color: var(--wp--preset--color--gris-texte);
}

/* Méthode — numéro d'étape affirmé */
.srh-step__num {
	margin: 0;
	font-size: 1.7rem;
	font-weight: 700;
	line-height: 1;
	color: var(--wp--preset--color--lavande);
}

/* ---------- Témoignages : carrousel horizontal (gain de place) ---------- */
.srh-testimonials-lede { margin-top: 6px; }

.srh-tcarousel { position: relative; margin-top: var(--wp--preset--spacing--60); }
/* Viewport injecté par le JS pour centrer les flèches sur la piste (pas sur les points). */
.srh-tcarousel__viewport { position: relative; }

/* La piste : défilement tactile natif + accroche (swipe même sans JS). */
.srh-tcarousel__track {
	display: flex;
	flex-wrap: nowrap;
	align-items: stretch; /* cartes de hauteur uniforme (diapos homogènes). */
	gap: var(--wp--preset--spacing--40);
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	-webkit-overflow-scrolling: touch;
	padding: 4px 4px 6px;
	scrollbar-width: none;
}
.srh-tcarousel__track::-webkit-scrollbar { display: none; }

/* Chaque carte = une diapo (≈2 visibles en desktop, 1 en mobile avec aperçu de la suivante). */
.srh-tcarousel .srh-testimonial {
	flex: 0 0 clamp(280px, 46%, 460px);
	max-width: 460px;
	scroll-snap-align: start;
	text-align: left;
}
@media (max-width: 782px) {
	.srh-tcarousel .srh-testimonial { flex-basis: 86%; }
}

/* Résultat clé mis en avant dans la citation (repérage rapide, ton sobre/premium). */
.srh-testimonial .has-titre-font-family strong {
	font-weight: 700;
	color: var(--wp--preset--color--violet);
}

/* Étoiles dorées. */
.srh-stars { margin: 0; color: #C9A227; }

/* Flèches de navigation (desktop ; masquées en tactile où le swipe suffit). */
.srh-tcarousel__btn {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 44px;
	height: 44px;
	border-radius: 50%;
	border: 1px solid var(--wp--preset--color--bordure);
	background: var(--wp--preset--color--blanc);
	color: var(--wp--preset--color--violet);
	display: none;
	place-items: center;
	cursor: pointer;
	box-shadow: 0 6px 18px rgba(62, 42, 77, 0.14);
	transition: background 0.15s ease, color 0.15s ease, opacity 0.15s ease;
	z-index: 2;
}
.srh-tcarousel__btn:hover { background: var(--wp--preset--color--violet); color: #fff; }
.srh-tcarousel__btn:disabled { opacity: 0.32; cursor: default; }
.srh-tcarousel__btn:disabled:hover { background: var(--wp--preset--color--blanc); color: var(--wp--preset--color--violet); }
.srh-tcarousel__btn--prev { left: -10px; }
.srh-tcarousel__btn--next { right: -10px; }
@media (min-width: 900px) {
	.srh-tcarousel__btn { display: grid; }
}

/* Points indicateurs (toujours affichés dès qu'il y a plusieurs diapos). */
.srh-tcarousel__dots { display: flex; justify-content: center; gap: 8px; margin-top: 16px; }
.srh-tcarousel__dot {
	width: 8px;
	height: 8px;
	padding: 0;
	border: none;
	border-radius: 50%;
	background: var(--wp--preset--color--bordure);
	cursor: pointer;
	transition: width 0.2s ease, background 0.2s ease;
}
.srh-tcarousel__dot[aria-current="true"] { width: 22px; border-radius: 4px; background: var(--wp--preset--color--violet); }

@media (prefers-reduced-motion: reduce) {
	.srh-tcarousel__track { scroll-behavior: auto; }
}

/* ---------- Tarifs candidats : cartes de hauteur égale, CTA aligné en bas ---------- */
.srh-pricing { align-items: stretch; }
.srh-pricing .wp-block-column { display: flex; flex-direction: column; }
/* Le bloc bouton est poussé en bas : les 3 CTA s'alignent quel que soit le contenu au-dessus. */
.srh-pricing .wp-block-column > .wp-block-buttons { margin-top: auto; }
/* Formule centrale « le plus choisi » : légère élévation en desktop (hiérarchie claire). */
@media (min-width: 782px) {
	.srh-pricing .srh-price-featured {
		transform: translateY(-12px);
		box-shadow: 0 20px 50px rgba(62, 42, 77, 0.28);
	}
}

/* ---------- Bande de réassurance (accueil) : 4 cartes icône + bénéfice ----------
   Rendu en HTML pur (bloc wp:html) : pas d'imbrication de groupes WordPress, donc
   la grille n'est pas perturbée par les classes de layout injectées (is-layout-*). */
.srh-reassure__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	align-items: stretch; /* cartes de hauteur égale */
	gap: var(--wp--preset--spacing--40);
	max-width: 1080px;
	margin: 0 auto;
}
.srh-rcard {
	display: flex;
	flex-direction: column;
	background: var(--wp--preset--color--blanc);
	border: 1px solid var(--wp--preset--color--bordure);
	border-radius: 16px;
	padding: 20px;
	box-shadow: 0 6px 18px rgba(62, 42, 77, 0.05);
}
.srh-rcard .srh-ic { margin-bottom: 12px; }
/* Titre sur 2 lignes réservées : les sous-titres s'alignent d'une carte à l'autre. */
.srh-rcard__t {
	margin: 0 0 2px;
	font-size: 0.98rem;
	font-weight: 700;
	line-height: 1.25;
	min-height: 2.5em;
	color: var(--wp--preset--color--aubergine);
}
.srh-rcard__s {
	margin: 0;
	font-size: 0.85rem;
	line-height: 1.4;
	color: var(--wp--preset--color--gris-texte);
}
@media (max-width: 781px) {
	.srh-reassure__grid { grid-template-columns: 1fr 1fr; }
	.srh-rcard__t { min-height: 0; } /* en 2×2 mobile, hauteur naturelle */
}

/* ============================================================
   Landing « 7 erreurs CV » — page de capture + remerciement
   ============================================================ */
/* Formulaire empilé (prénom + e-mail + bouton en colonne, pleine largeur).
   NB : en colonne, flex-basis agit sur la HAUTEUR — on neutralise le flex du mode ligne. */
.srh-capture--stacked { flex-direction: column; align-items: stretch; }
.srh-capture--stacked .srh-capture__input,
.srh-capture--stacked .srh-capture__btn {
	flex: 0 0 auto;
	width: 100%;
	min-width: 0;
}
.srh-lp-formwrap .srh-lead { margin: 0 auto; }

/* Grille des 7 erreurs. */
.srh-lp-errs {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: var(--wp--preset--spacing--40);
	margin-top: var(--wp--preset--spacing--60);
	text-align: left;
}
.srh-lp-err {
	background: var(--wp--preset--color--blanc);
	border: 1px solid var(--wp--preset--color--bordure);
	border-radius: 16px;
	padding: 24px;
	box-shadow: 0 6px 18px rgba(62, 42, 77, 0.05);
}
.srh-lp-err__n {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 11px;
	background: rgba(122, 79, 163, 0.12);
	color: var(--wp--preset--color--violet-fonce);
	font-family: var(--wp--preset--font-family--titre);
	font-weight: 700;
	font-size: 0.95rem;
	margin-bottom: 14px;
}
.srh-lp-err__t {
	margin: 0 0 6px;
	font-size: 1.05rem;
	line-height: 1.3;
	color: var(--wp--preset--color--aubergine);
}
.srh-lp-err__d {
	margin: 0;
	font-size: 0.9rem;
	line-height: 1.55;
	color: var(--wp--preset--color--gris-texte);
}

/* Page de remerciement : médaillon de confirmation. */
.srh-lp-merci-badge {
	width: 66px;
	height: 66px;
	margin: 0 auto 22px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.14);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
}