/*
Theme Name: Rudy Sevin
Description: Thème bloc autonome du site de Rudy Sevin, vidéaste (Nouvelle-Aquitaine). Charte : rouge #B01828, noir #111111, blanc ; alternance de sections noires et blanches.
Author: Rudy Sevin
Version: 0.1.0
Requires at least: 6.6
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: rudysevin
*/
/*
 * Link styles
 * https://github.com/WordPress/gutenberg/issues/42319
 */
a {
	text-decoration-thickness: 1px !important;
	text-underline-offset: .1em;
}

/* Focus styles */
:where(.wp-site-blocks *:focus) {
	outline-width: 2px;
	outline-style: solid;
}

/* Increase the bottom margin on submenus, so that the outline is visible. */
.wp-block-navigation .wp-block-navigation-submenu .wp-block-navigation-item:not(:last-child) {
	margin-bottom: 3px;
}

/* Increase the outline offset on the parent menu items, so that the outline does not touch the text. */
.wp-block-navigation .wp-block-navigation-item .wp-block-navigation-item__content {
	outline-offset: 4px;
}

/* Remove outline offset from the submenus, otherwise the outline is visible outside the submenu container. */
.wp-block-navigation .wp-block-navigation-item ul.wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	outline-offset: 0;
}

/*
 * Progressive enhancement to reduce widows and orphans
 * https://github.com/WordPress/gutenberg/issues/55190
 */
h1, h2, h3, h4, h5, h6, blockquote, caption, figcaption, p {
	text-wrap: pretty;
}

/*
 * Change the position of the more block on the front, by making it a block level element.
 * https://github.com/WordPress/gutenberg/issues/65934
*/
.more-link {
	display: block;
}

/* ---------- Charte Rudy Sevin ---------- */
/* Section blanche (style « section-1 ») : liens rouges, séparateurs gris. */
.is-style-section-1 a:where(:not(.wp-element-button)) { color: var(--wp--preset--color--accent-1); }

/* Liens discrets du pied de page (mentions légales, confidentialité, cookies). */
.rs-legal-links { margin-top: .4rem; font-size: .8rem; color: rgba(255, 255, 255, .6); }
.rs-legal-links a { color: inherit; text-decoration: none; }
.rs-legal-links a:hover, .rs-legal-links a:focus-visible { color: #fff; text-decoration: underline; text-underline-offset: .15em; }
/* Pense-bête dans les pages légales : informations à compléter avant la mise en ligne. */
mark.rs-todo { background: #ffe14d; color: #111; padding: 0 .25em; }

/* =====================================================================
   En-tête (menu en haut) : transparent par-dessus le bandeau des pages d'accueil et de services.
   Mots-clés : professionnel, cinématographique, classieux, qualité.
   ===================================================================== */
.rs-header { padding: .8rem 0; background: var(--wp--preset--color--contrast, #111111); color: #fff; border-bottom: 1px solid rgba(255, 255, 255, .1); }
/* Barre noire fixée en haut (aussi sur téléphone) : le premier bloc du site (la zone d'en-tête) reste visible au défilement. */
.wp-site-blocks > .wp-block-template-part:first-child { position: sticky; top: 0; z-index: 60; background: var(--wp--preset--color--contrast, #111111); }
.admin-bar .wp-site-blocks > .wp-block-template-part:first-child { top: 32px; }
@media ( max-width: 782px ) { .admin-bar .wp-site-blocks > .wp-block-template-part:first-child { top: 46px; } }
.rs-header__barre { align-items: center; }
.rs-header__logo img { display: block; height: auto; }
.rs-nav { font-size: .72rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; }
.rs-nav .wp-block-navigation-item__content { padding: .5rem .2rem; color: #fff; text-decoration: none; transition: color .3s ease, opacity .3s ease; }
.rs-nav .wp-block-navigation-item__content:hover, .rs-nav .wp-block-navigation-item__content:focus-visible { color: #fff; opacity: .65; }
.rs-nav .current-menu-item > a, .rs-nav [aria-current="page"] { box-shadow: inset 0 -1px 0 currentColor; }
.rs-nav .rs-nav-cta .wp-block-navigation-item__content { padding: .6rem 1.1rem; border: 1px solid #fff; transition: background .3s ease, color .3s ease, border-color .3s ease; }
.rs-nav .rs-nav-cta .wp-block-navigation-item__content:hover, .rs-nav .rs-nav-cta .wp-block-navigation-item__content:focus-visible { opacity: 1; background: var(--wp--preset--color--accent-1, #B01828); border-color: var(--wp--preset--color--accent-1, #B01828); }
/* Sur les pages sans bandeau (mentions légales…), l'en-tête reste au-dessus du contenu. */

/* Bandeau d'en-tête des pages de services. */
.rs-hero-page { display: flex; flex-direction: column; justify-content: center; min-height: clamp(26rem, 72vh, 46rem); padding: clamp(4.5rem, 9vw, 7rem) var(--wp--preset--spacing--50, 30px) clamp(3.5rem, 8vw, 6rem); text-align: center; align-items: center; color: #fff; }
.rs-kicker { margin: 0 0 1rem; font-size: .78rem; font-weight: 700; letter-spacing: .38em; text-transform: uppercase; }
.rs-kicker::before, .rs-kicker::after { content: ""; display: inline-block; width: 2.4rem; height: 1px; margin: 0 1rem; vertical-align: middle; background: currentColor; opacity: .5; }
.rs-titre-hero { margin: 0; max-width: 20ch; font-size: clamp(2.2rem, 6vw, 4.6rem); font-weight: 300; line-height: 1.08; letter-spacing: .01em; text-wrap: balance; }
.rs-lead { max-width: 46ch; margin: 1.4rem 0 0; font-size: clamp(1rem, 1.6vw, 1.2rem); font-weight: 300; line-height: 1.6; opacity: .88; }
.rs-hero-page .rs-lead { margin-inline: auto; }

/* Titres de section : capitales espacées, filet rouge. */
.rs-titre-section { margin-bottom: 1.2rem; font-size: clamp(1.5rem, 3.2vw, 2.4rem); font-weight: 300; line-height: 1.2; letter-spacing: .04em; text-wrap: balance; }
.rs-titre-section.has-text-align-center::after { content: ""; display: block; width: 3rem; height: 1px; margin: 1.1rem auto 0; background: currentColor; opacity: .5; }
.has-text-align-center.rs-kicker { margin-bottom: .6rem; }
.rs-logiciels { font-size: .8rem; font-weight: 700; letter-spacing: .28em; text-transform: uppercase; }

/* Pied de page : le logo seul, avec « Vidéaste · Charente-Maritime » dessous ; réseaux un peu plus petits. */
.rs-baseline { margin-top: 1.3rem !important; font-size: .78rem; font-weight: 600; letter-spacing: .32em; text-transform: uppercase; opacity: .85; }
.wp-block-social-links.is-style-logos-only.has-huge-icon-size { font-size: 40px; }

/* En-tête de section commun à tout le site (repère + titre léger + filet) : espace sous le titre avant le contenu. */
.rs-titre-section.has-text-align-center { margin-bottom: clamp(2rem, 4vw, 3rem); }

/* Menu mobile : bouton « hamburger » blanc sur la barre noire ; panneau plein écran noir, texte blanc. */
.rs-nav .wp-block-navigation__responsive-container-open, .rs-nav .wp-block-navigation__responsive-container-close { color: #fff; }
.rs-nav .wp-block-navigation__responsive-container.is-menu-open { background: var(--wp--preset--color--contrast, #111111); color: #fff; padding: 1.5rem; }
.rs-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap: .4rem; align-items: flex-start; }
.rs-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-size: .9rem; padding: .7rem 0; }
.rs-nav .wp-block-navigation__responsive-container.is-menu-open .rs-nav-cta { margin-top: 1rem; }

/* Bandeau d'accueil : hauteur presque plein écran, boutons discrets (contour blanc, rouge au survol). */
.rs-hero-home { min-height: calc(100vh - var(--rs-entete-h, 4.6rem)); min-height: calc(100svh - var(--rs-entete-h, 4.6rem)); } /* calé entre la barre du menu et le bas de l'écran visible (svh : sans la barre d'adresse des téléphones) */
@media ( max-width: 700px ) { .rs-hero-page.rs-hero-home { padding-top: 2rem; padding-bottom: 3.6rem; } }
.rs-hero-boutons { margin-top: 2.2rem; gap: 1rem; }
.rs-hero-boutons .wp-block-button__link { padding: .85rem 1.8rem; font-size: .72rem; font-weight: 700; letter-spacing: .24em; text-transform: uppercase; color: #fff; background: transparent; border: 1px solid #fff; border-radius: 0; transition: background .3s ease, border-color .3s ease; }
.rs-hero-boutons .wp-block-button__link:hover, .rs-hero-boutons .wp-block-button__link:focus-visible { background: var(--wp--preset--color--accent-1, #B01828); border-color: var(--wp--preset--color--accent-1, #B01828); color: #fff; }

/* Section « Réalisations » : légendes en capitales espacées, vignettes plus grandes et plus aérées. */
.rs-realisations .rs-video figcaption { margin-top: .9rem; font-size: .72rem; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; opacity: .85; }
.rs-realisations .rs-video__play { box-shadow: 0 18px 40px rgba(0, 0, 0, .55); }

/* En-tête sur tablette et téléphone (≤ 1000 px) : menu « hamburger » à droite, LOGO CENTRÉ et un peu plus gros. */
@media ( max-width: 1000px ) {
	.rs-header .rs-header__barre.is-layout-flex { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; justify-content: stretch; padding-inline: clamp(1.1rem, 5vw, 1.9rem); }
	.rs-header__barre .rs-header__logo { grid-column: 2; grid-row: 1; margin: 0; }
	.rs-header__barre .rs-header__logo img { width: 90px !important; height: auto; }
	.rs-header__barre .rs-nav { grid-column: 3; grid-row: 1; justify-self: end; }
	/* Le menu complet est remplacé par le bouton « hamburger » dès 1000 px (WordPress ne le fait qu'à 600 px, trop tard pour 7 entrées). */
	.rs-nav .wp-block-navigation__responsive-container-open { display: flex; }
	.rs-nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
}

/* Logo de l'en-tête : le LOGO LONG sur ordinateur (> 1000 px), le logo actuel (centré) sur tablette et téléphone (≤ 1000 px). */
.rs-header__logo-long { display: block; line-height: 0; }
.rs-header__logo-long img { display: block; width: auto; height: 34px; max-width: none; }
.rs-header__barre .rs-header__logo { display: none; }
@media ( max-width: 1000px ) {
	.rs-header__logo-long { display: none; }
	.rs-header__barre .rs-header__logo { display: block; }
}

/* Logo « haut » : tablette/téléphone dans la barre (centré, voir plus haut) et pied de page. */
.rs-header__logo { line-height: 0; }
.rs-footer__logo { display: block; width: min( 150px, 55% ); margin: 0 auto; line-height: 0; }
.rs-footer__logo img { display: block; width: 100%; height: auto; }


/* =====================================================================
   Animations discrètes (toutes coupées si le visiteur demande « réduire les animations »).
   ===================================================================== */
/* 1. Apparition douce au défilement (classes posées par assets/js/animations.js ; sans JavaScript, rien n'est caché). */
.rs-anim { transition: opacity .9s ease var(--rs-d, 0ms), transform .9s cubic-bezier(.2, .6, .2, 1) var(--rs-d, 0ms); }
.rs-anim:not(.is-visible) { opacity: 0; transform: translateY(18px); }
/* 2. Petit trait sous les titres de section : il se dessine. */
.rs-titre-section.has-text-align-center.rs-anim::after { transition: width .9s ease .35s; }
.rs-titre-section.has-text-align-center.rs-anim:not(.is-visible)::after { width: 0; }
/* 3. Bandeau d'accueil et pages de services : le texte monte en fondu au chargement. */
@keyframes rs-monte { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
.rs-hero-page > * { animation: rs-monte 1s cubic-bezier(.2, .6, .2, 1) both; }
.rs-hero-page > *:nth-child(2) { animation-delay: .12s; }
.rs-hero-page > *:nth-child(3) { animation-delay: .24s; }
.rs-hero-page > *:nth-child(4) { animation-delay: .36s; }
/* 4. Barre noire du haut : elle s'affine quand on descend dans la page. */
.rs-header { transition: padding .3s ease; }
.rs-header__logo-long img { transition: height .3s ease; }
.rs-scrolled .rs-header { padding: .4rem 0; }
.rs-scrolled .rs-header__logo-long img { height: 26px; }
@media ( prefers-reduced-motion: reduce ) {
	.rs-anim, .rs-anim:not(.is-visible) { opacity: 1 !important; transform: none !important; transition: none !important; }
	.rs-titre-section.has-text-align-center.rs-anim::after, .rs-titre-section.has-text-align-center.rs-anim:not(.is-visible)::after { width: 3rem; transition: none; }
	.rs-hero-page > * { animation: none; }
	.rs-header, .rs-header__logo-long img { transition: none; }
}

/* Icône du menu « hamburger » : deux rangées de perforations de pellicule (en haut et en bas), à la place des traits. */
.rs-nav .wp-block-navigation__responsive-container-open { width: 42px; height: 34px; padding: 0; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 23' fill='%23fff'%3E%3Crect x='1' y='1.6' width='3.2' height='3.2' rx='.6'/%3E%3Crect x='1' y='18.2' width='3.2' height='3.2' rx='.6'/%3E%3Crect x='6.4' y='1.6' width='3.2' height='3.2' rx='.6'/%3E%3Crect x='6.4' y='18.2' width='3.2' height='3.2' rx='.6'/%3E%3Crect x='11.8' y='1.6' width='3.2' height='3.2' rx='.6'/%3E%3Crect x='11.8' y='18.2' width='3.2' height='3.2' rx='.6'/%3E%3Crect x='17.2' y='1.6' width='3.2' height='3.2' rx='.6'/%3E%3Crect x='17.2' y='18.2' width='3.2' height='3.2' rx='.6'/%3E%3Crect x='22.6' y='1.6' width='3.2' height='3.2' rx='.6'/%3E%3Crect x='22.6' y='18.2' width='3.2' height='3.2' rx='.6'/%3E%3C/svg%3E") center / 28px 23px no-repeat; color: #fff; transition: opacity .3s ease; }
.rs-nav .wp-block-navigation__responsive-container-open svg { display: none; }
.rs-nav .wp-block-navigation__responsive-container-open:hover, .rs-nav .wp-block-navigation__responsive-container-open:focus-visible { opacity: .65; }

/* Bandeau d'ACCUEIL : bloc de texte plus large (la ligne des services tient sur une seule ligne) et grand titre un peu plus petit. Pages de services inchangées. */
.rs-hero-page.rs-hero-home.is-layout-constrained > * { max-width: min(62rem, 100%); }
.rs-hero-home .rs-titre-hero { font-size: clamp(1.9rem, 4.8vw, 3.7rem); max-width: 26ch; }
.rs-hero-home .rs-lead { max-width: 54ch; }
@media ( min-width: 701px ) { .rs-hero-home .rs-kicker { white-space: nowrap; } }
@media ( max-width: 700px ) {
	.rs-hero-home .rs-kicker { font-size: .66rem; letter-spacing: .2em; }
	.rs-hero-home .rs-kicker::before, .rs-hero-home .rs-kicker::after { display: none; }
}

/* Petits intertitres (ex. page Mariage : Avant le mariage / Le jour J / Après le mariage) : capitales espacées, petit trait. */
.rs-sous-titre { margin: 2.2rem 0 .4rem; font-size: .78rem; font-weight: 700; letter-spacing: .3em; text-transform: uppercase; }
.rs-sous-titre::before { content: ""; display: inline-block; width: 1.6rem; height: 1px; margin-right: .8rem; vertical-align: middle; background: currentColor; opacity: .5; }

/* Pas de bande noire entre le bandeau et la section suivante : on neutralise l espace automatique de WordPress entre blocs. */
.wp-block-post-content > .alignfull, .wp-block-post-content > .rs-hero + *, main > .alignfull { margin-block-start: 0; }

/* Menu responsive : les réseaux sont tout en bas de la fenêtre, centrés ; absents du menu ordinateur. */
.rs-nav .rs-nav-reseaux { display: none; }
.rs-nav .wp-block-navigation__responsive-container.is-menu-open .rs-nav-reseaux { display: flex; position: fixed; left: 0; right: 0; bottom: 1.8rem; margin: 0; padding: 0; justify-content: center; gap: 1.6rem; }
.rs-nav .wp-block-navigation__responsive-container.is-menu-open .rs-nav-reseaux .wp-social-link a { color: #fff; padding: .3rem; }
.rs-nav .wp-block-navigation__responsive-container.is-menu-open .rs-nav-reseaux svg { width: 1.7rem; height: 1.7rem; fill: #fff; }

/* Menu responsive : le logo en haut, centré (même place que dans la barre noire). */
.rs-nav .wp-block-navigation__responsive-container.is-menu-open::before { content: ""; position: fixed; top: 0; left: 50%; z-index: 1; width: 90px; height: 60px; margin-top: 4px; transform: translateX(-50%); background: url("assets/images/logo-haut.png") center / contain no-repeat; pointer-events: none; }
.admin-bar .rs-nav .wp-block-navigation__responsive-container.is-menu-open::before { top: 32px; }

/* Téléphone : le petit mot « Documentaire / Interview » (et les autres) tient toujours sur UNE ligne : pas de traits sur les côtés, lettres moins espacées, marges droite/gauche réduites. */
@media ( max-width: 700px ) {
	.rs-hero-page { padding-left: .8rem; padding-right: .8rem; }
	.rs-hero-page .rs-kicker { white-space: nowrap; font-size: clamp(.58rem, 2.9vw, .7rem); letter-spacing: .16em; }
	.rs-hero-page .rs-kicker::before, .rs-hero-page .rs-kicker::after { display: none; }
}

/* Menu responsive (ajusté) : logo plus gros avec de l'air au-dessus ; liens centrés. */
.rs-nav .wp-block-navigation__responsive-container.is-menu-open::before { width: 150px; height: 100px; margin-top: 1.4rem; }
.rs-nav .wp-block-navigation__responsive-container.is-menu-open { padding-top: 9rem; }
.rs-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.rs-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { align-items: center; justify-content: center; text-align: center; }
.rs-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { justify-content: center; }
.rs-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { text-align: center; }
.rs-nav .wp-block-navigation__responsive-container.is-menu-open .rs-nav-cta { margin-top: 1.4rem; }

/* Téléphone : les traits de chaque côté des petits titres reviennent, en plus courts, pour que « Documentaire / Interview » tienne toujours sur une ligne. */
@media ( max-width: 700px ) {
	.rs-hero-page .rs-kicker::before, .rs-hero-page .rs-kicker::after { display: inline-block; width: 1.2rem; margin: 0 .5rem; }
}

/* Menu responsive (ajusté) : liens centrés aussi en hauteur, entre le logo et les réseaux ; plus d'air au-dessus du logo. */
.rs-nav .wp-block-navigation__responsive-container.is-menu-open { box-sizing: border-box; padding-top: 9.5rem; padding-bottom: 5.5rem; }
.rs-nav .wp-block-navigation__responsive-container.is-menu-open::before { margin-top: 2.2rem; }
.rs-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close,
.rs-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog { height: 100%; }
.rs-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { height: 100%; display: flex; flex-direction: column; justify-content: center; padding-top: 0; }

/* Menu responsive (refait) : le logo fait partie du bloc des liens ; logo + liens sont centrés ensemble sur la hauteur de l'écran. */
.rs-nav .wp-block-navigation__responsive-container.is-menu-open::before { display: none; }
.rs-nav .wp-block-navigation__responsive-container.is-menu-open { padding-top: 4.5rem; padding-bottom: 5.5rem; }
.rs-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content::before { content: ""; flex: none; align-self: center; width: 150px; height: 100px; margin: 0 auto 1.8rem; background: url("assets/images/logo-haut.png") center / contain no-repeat; }

/* Menu : aucun cadre ni soulignement autour de l'élément actif ou cliqué. */
.rs-nav .current-menu-item > a, .rs-nav [aria-current="page"] { box-shadow: none; }
.rs-nav a:focus, .rs-nav a:active, .rs-nav button:focus { outline: none; box-shadow: none; }
.rs-nav .wp-block-navigation-item__content:focus:not(:focus-visible) { outline: none; }

/* Menu responsive : « Accueil » remonte vers le logo (écart réduit d'environ 38 px) ; le logo garde sa place grâce à un bas de bloc équivalent. */
.rs-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { padding-bottom: 2.4rem; }
.rs-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content::before { margin-bottom: -.6rem; }

/* Menu responsive : « Accueil » encore plus près du logo (−2,6 rem sous le logo), le logo garde sa place. */
.rs-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { padding-bottom: 4.4rem; }
.rs-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content::before { margin-bottom: -2.6rem; }

/* Menu responsive : « Accueil » remonté de 10 mm de plus (≈ 2,4 rem), le logo garde sa place. */
.rs-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { padding-bottom: 6.8rem; }
.rs-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content::before { margin-bottom: -5rem; }

/* Accueil, téléphone : « Mariage · Reportage · Interview » sur une ligne, « Captation · Montage » dessous ; un trait de chaque côté du bloc, centré en hauteur. */
@media ( max-width: 700px ) {
	.rs-hero-home .rs-kicker { display: flex; align-items: center; justify-content: center; gap: .5rem; font-size: clamp(.58rem, 2.8vw, .66rem); letter-spacing: .14em; line-height: 1.6; }
	.rs-hero-home .rs-kicker::before, .rs-hero-home .rs-kicker::after { display: block; flex: none; width: 1rem; margin: 0; }
	.rs-hero-home .rs-kicker__texte { display: block; text-align: center; }
	.rs-hero-home .rs-kicker__l1, .rs-hero-home .rs-kicker__l2 { display: block; white-space: nowrap; }
	.rs-hero-home .rs-kicker__sep { display: none; }
}

/* Pages légales (Mentions légales, Politique de confidentialité) : bandeau plus bas, fond du noir des sections, texte aéré, fiches. */
.rs-hero:has(.rs-hero-legal) { background: var(--wp--preset--color--contrast, #111111); }
.rs-hero-legal { min-height: clamp(15rem, 36vh, 21rem); padding-top: clamp(6.5rem, 12vw, 8.5rem); padding-bottom: clamp(2.5rem, 5vw, 4rem); }
.rs-legal { font-size: 1.02rem; line-height: 1.75; }
.rs-legal > p:first-child { font-size: 1.12rem; line-height: 1.7; }
.rs-legal .rs-sous-titre { margin: 3rem 0 .9rem; padding-top: 2rem; border-top: 1px solid rgba(17, 17, 17, .12); font-size: .82rem; }
.rs-legal .rs-sous-titre:first-of-type { margin-top: 2.4rem; }
.rs-legal p, .rs-legal li { margin-block: .6rem; }
.rs-legal a { color: var(--wp--preset--color--accent-1, #B01828); text-underline-offset: .2em; }
.rs-legal .rs-fiches { display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: .9rem; margin: 1rem 0 0; padding: 0; list-style: none; }
.rs-legal .rs-fiches li { margin: 0; padding: 1rem 1.2rem; background: var(--wp--preset--color--accent-5, #F3F3F3); border-left: 3px solid var(--wp--preset--color--accent-1, #B01828); line-height: 1.5; }
.rs-legal .rs-fiches strong { display: block; margin-bottom: .3rem; font-size: .68rem; font-weight: 700; letter-spacing: .24em; text-transform: uppercase; opacity: .6; }
.rs-legal .wp-block-list:not(.rs-fiches) { padding-left: 1.2rem; }

/* Menu responsive : le cadre de « Me contacter » respire à droite et à gauche. */
.rs-nav .wp-block-navigation__responsive-container.is-menu-open .rs-nav-cta .wp-block-navigation-item__content { padding: .85rem 2.4rem; }

/* Menu responsive : les liens redescendent de 2 cm (≈ 4,7 rem) pour ne plus passer sur le logo ; le logo garde sa place. */
.rs-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { padding-bottom: 2.1rem; }
.rs-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content::before { margin-bottom: -.3rem; }

/* Menu responsive — MISE EN PAGE SIMPLE (remplace tous les réglages de position précédents) :
   le logo en haut de l'écran, les liens juste en dessous, tout dans le flux normal (aucune position absolue ni marge négative).
   Seuls les réseaux restent collés en bas de la fenêtre (position fixe, définie plus haut). */
.rs-nav .wp-block-navigation__responsive-container.is-menu-open { box-sizing: border-box; padding: 1.1rem 1.5rem 6rem; }
.rs-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { height: auto; display: flex; flex-direction: column; justify-content: flex-start; padding: 0; }
.rs-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content::before { flex: none; align-self: center; width: 150px; height: 100px; margin: 0 auto 1.4rem; }

/* Menu responsive : marge d'environ 2 cm au-dessus du logo. */
.rs-nav .wp-block-navigation__responsive-container.is-menu-open { padding-top: 4.7rem; }