/* ==========================================================================
   Romandie Fishing — socle & composants
   Valeurs issues de design-tokens.md et components.md. Toute modification de
   couleur/typo/espacement passe par les variables ci-dessous, jamais en dur.

   Pas de media query : tout est en clamp() et en
   repeat(auto-fit, minmax(min(Xpx, 100%), 1fr)). C'est ce qui évite les
   débordements sur les libellés longs en français. Seul le JS connaît le
   breakpoint 900px, pour la navigation.
   ========================================================================== */

:root {
	--rf-bg: #08100F;
	--rf-bg-alt: #0C1614;
	--rf-bg-raised: #0E1A18;

	--rf-text: #F2EEE6;
	--rf-text-soft: #C7D2CF;
	--rf-text-muted: #B9C6C3;
	--rf-text-dim: #93A5A2;
	--rf-text-faint: #7F918E;
	--rf-text-faintest: #6E827F;

	--rf-accent: #C8A06A;
	--rf-accent-hover: #E4CBA1;
	--rf-accent-soft: rgba(200, 160, 106, 0.14);
	--rf-accent-line: rgba(200, 160, 106, 0.28);

	--rf-line: rgba(242, 238, 230, 0.12);
	--rf-line-strong: rgba(242, 238, 230, 0.16);
	--rf-line-strongest: rgba(242, 238, 230, 0.28);

	--rf-serif: 'Instrument Serif', Georgia, 'Times New Roman', serif;
	--rf-sans: 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;

	--rf-overlay-hero: linear-gradient(180deg, rgba(8, 16, 15, 0.70) 0%, rgba(8, 16, 15, 0.22) 40%, rgba(8, 16, 15, 0.95) 100%);
	--rf-overlay-card: linear-gradient(180deg, rgba(8, 16, 15, 0.12) 30%, rgba(8, 16, 15, 0.92) 100%);

	/* Deux gouttières coexistent dans la maquette : le header est un peu plus
	   serré que les sections de contenu. */
	--rf-gutter: clamp(18px, 4vw, 40px);
	--rf-gutter-section: clamp(20px, 3vw, 40px);
	--rf-section-y: clamp(56px, 9vw, 110px);
	/* Respiration entre deux sections de l'accueil. */
	--rf-rhythm: clamp(56px, 9vw, 120px);
	--rf-max: 1240px;

	--rf-r-card: 3px;
	--rf-r-panel: 4px;
	--rf-r-field: 2px;
	--rf-r-pill: 999px;
}

/* --------------------------------------------------------------------------
   Base — uniquement quand la refonte est active (body.rf-on)
   -------------------------------------------------------------------------- */

body.rf-on {
	background: var(--rf-bg);
	color: var(--rf-text);
	font-family: var(--rf-sans);
	font-weight: 300;
	overflow-x: hidden;
	-webkit-font-smoothing: antialiased;
}

body.rf-on *,
body.rf-on *::before,
body.rf-on *::after {
	box-sizing: border-box;
}

/* Volontairement : aucune couleur de lien globale.
   Une règle « body.rf-on a » pèse (0,1,1) et l'emporterait sur toutes les classes
   de composant à une seule classe — elle repeignait en doré le texte des boutons
   et des cartes. La couleur des liens est donc traitée deux fois : par les
   composants, et par la zone rédactionnelle ci-dessous. */
body.rf-on a {
	text-decoration: none;
}

body.rf-on ::selection {
	background: var(--rf-accent);
	color: var(--rf-bg);
}

body.rf-on :where(h1, h2, h3, h4) {
	font-family: var(--rf-serif);
	font-weight: 400;
	color: var(--rf-text);
	margin: 0;
}

/* Texte rédactionnel : contenus WordPress classiques et blocs de prose de la
   refonte. Les composants, eux, définissent leurs propres couleurs. */
body.rf-on :where(.entry-content, .rf-prose) :where(p, li, dd) {
	color: var(--rf-text-muted);
	font-size: 16px;
	line-height: 1.7;
}

body.rf-on :where(.entry-content, .rf-prose) a {
	color: var(--rf-accent);
}

body.rf-on :where(.entry-content, .rf-prose) a:hover {
	color: var(--rf-accent-hover);
}

body.rf-on input,
body.rf-on select,
body.rf-on textarea,
body.rf-on button {
	font-family: inherit;
}

/* Focus visible doré — Flatsome ne l'assure pas sur fond sombre. */
body.rf-on :focus-visible {
	outline: 2px solid var(--rf-accent);
	outline-offset: 2px;
}

/* L'attribut `hidden` du navigateur ne pose qu'un `display: none` de très faible
   priorité : n'importe quel `display` d'auteur l'emporte. Nos cartes sont en
   `display: grid`, elles restaient donc visibles une fois filtrées. */
body.rf-on [hidden] {
	display: none !important;
}

@keyframes rf-rise {
	from {
		opacity: 0;
		transform: translateY(18px);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

/* --------------------------------------------------------------------------
   Neutralisation de Flatsome
   Le thème parent impose un fond clair, des boutons arrondis et sa propre
   typographie. On coupe le strict nécessaire, sans toucher au back-office.
   -------------------------------------------------------------------------- */

body.rf-on #wrapper,
body.rf-on #main,
body.rf-on .page-wrapper,
body.rf-on .dark {
	background: transparent;
	color: inherit;
}

body.rf-on #main > .page-wrapper {
	padding-top: 0;
	padding-bottom: 0;
}

/* --------------------------------------------------------------------------
   Rythme : sections et conteneurs
   -------------------------------------------------------------------------- */

.rf-section {
	padding: var(--rf-section-y) var(--rf-gutter-section);
}

.rf-section--alt {
	background: var(--rf-bg-alt);
}

/* Section posée sur le fond principal : elle n'a pas de padding bas, c'est la
   suivante qui apporte la respiration. Évite les doubles marges. */
.rf-section--top {
	padding: var(--rf-rhythm) var(--rf-gutter-section) 0;
}

/* Section colorée détachée de la précédente. */
.rf-section--spaced {
	margin-top: var(--rf-rhythm);
}

/* Section dont le contenu va jusqu'aux bords (galerie). */
.rf-section--flush {
	margin-top: var(--rf-rhythm);
	padding: var(--rf-section-y) 0;
}

.rf-wrap {
	width: 100%;
	max-width: var(--rf-max);
	margin: 0 auto;
}

.rf-wrap--narrow {
	max-width: 1000px;
}

/* --------------------------------------------------------------------------
   Typographie de composition
   -------------------------------------------------------------------------- */

.rf-h1 {
	font-family: var(--rf-serif);
	font-size: clamp(52px, 7vw, 112px);
	line-height: 0.94;
	letter-spacing: -0.02em;
}

.rf-h1--voyage {
	font-size: clamp(40px, 9vw, 104px);
	line-height: 0.95;
}

.rf-h2 {
	font-family: var(--rf-serif);
	font-size: clamp(27px, 5.4vw, 54px);
	line-height: 1.05;
}

.rf-h3 {
	font-family: var(--rf-serif);
	font-size: clamp(23px, 4vw, 30px);
	line-height: 1.15;
}

.rf-lead {
	font-size: clamp(17px, 2vw, 18px);
	line-height: 1.7;
	color: var(--rf-text-soft);
}

.rf-body {
	font-size: 16px;
	line-height: 1.7;
	color: var(--rf-text-muted);
}

.rf-label {
	font-size: 11px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--rf-text-faint);
}

/* .rf-eyebrow — filet + label */
.rf-eyebrow {
	display: flex;
	align-items: center;
	gap: 14px;
	font-size: 11.5px;
	letter-spacing: 0.3em;
	text-transform: uppercase;
	color: var(--rf-accent);
}

.rf-eyebrow--rule::before {
	content: '';
	flex: none;
	width: 42px;
	height: 1px;
	background: var(--rf-accent);
}

/* --------------------------------------------------------------------------
   Boutons
   -------------------------------------------------------------------------- */

.rf-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	border: 0;
	border-radius: var(--rf-r-pill);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.rf-btn--gold {
	padding: 19px 34px;
	background: var(--rf-accent);
	color: var(--rf-bg);
}

.rf-btn--gold:hover {
	background: var(--rf-accent-hover);
	color: var(--rf-bg);
}

/* Version header : contour doré, pastille, se remplit au survol. */
.rf-btn--gold-outline {
	padding: 12px 20px;
	font-size: 12px;
	background: transparent;
	border: 1px solid var(--rf-accent);
	color: var(--rf-accent);
}

.rf-btn--gold-outline::before {
	content: '';
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: currentColor;
}

.rf-btn--gold-outline:hover {
	background: var(--rf-accent);
	color: var(--rf-bg);
}

.rf-btn--ghost {
	padding: 19px 30px;
	background: transparent;
	border: 1px solid var(--rf-line-strongest);
	color: var(--rf-text);
}

.rf-btn--ghost:hover {
	border-color: var(--rf-text);
	color: var(--rf-text);
}

.rf-btn--block {
	width: 100%;
	padding: 19px;
	font-weight: 700;
}

/* --------------------------------------------------------------------------
   .rf-hero
   -------------------------------------------------------------------------- */

.rf-hero {
	position: relative;
	display: flex;
	align-items: end;
	min-height: clamp(540px, 88vh, 780px);
	padding: 0 var(--rf-gutter) 60px;
	overflow: hidden;
}

.rf-hero--home {
	min-height: clamp(540px, 88vh, 820px);
}

.rf-hero__media,
.rf-hero__media img,
.rf-hero__media video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.rf-hero__overlay {
	position: absolute;
	inset: 0;
	background: var(--rf-overlay-hero);
}

.rf-hero__inner {
	position: relative;
	z-index: 2;
	width: 100%;
	max-width: var(--rf-max);
	margin: 0 auto;
	animation: rf-rise 0.7s ease both;
}

/* --------------------------------------------------------------------------
   .rf-facts — barre de faits en overlap
   -------------------------------------------------------------------------- */

.rf-facts {
	position: relative;
	z-index: 5;
	margin: -34px auto 0;
	max-width: var(--rf-max);
	padding: clamp(20px, 4vw, 28px) clamp(18px, 4vw, 34px);
	background: var(--rf-bg-raised);
	border: 1px solid var(--rf-accent-line);
	border-radius: var(--rf-r-panel);
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(165px, 100%), 1fr));
	gap: clamp(18px, 3vw, 28px);
	align-items: center;
}

.rf-facts__label {
	display: block;
	margin-bottom: 8px;
	font-size: 10.5px;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: var(--rf-text-faint);
}

.rf-facts__value {
	font-family: var(--rf-serif);
	font-size: clamp(21px, 3vw, 26px);
	line-height: 1.1;
	color: var(--rf-text);
}

/* --------------------------------------------------------------------------
   .rf-card-photo
   -------------------------------------------------------------------------- */

.rf-card-photo {
	position: relative;
	display: block;
	height: clamp(190px, 38vw, 260px);
	border-radius: var(--rf-r-card);
	overflow: hidden;
	color: var(--rf-text);
}

.rf-card-photo--tall {
	height: clamp(260px, 52vw, 430px);
}

.rf-card-photo__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s ease;
}

.rf-card-photo:hover .rf-card-photo__img {
	transform: scale(1.04);
}

.rf-card-photo::after {
	content: '';
	position: absolute;
	inset: 0;
	background: var(--rf-overlay-card);
}

.rf-card-photo__body {
	position: absolute;
	inset: auto 0 0 0;
	z-index: 2;
	padding: clamp(20px, 3vw, 30px) clamp(20px, 3vw, 26px);
}

/* --------------------------------------------------------------------------
   .rf-list-rows — listes en grille 1px (programme, étapes)
   -------------------------------------------------------------------------- */

.rf-list-rows {
	display: grid;
	gap: 1px;
	background: var(--rf-line);
}

.rf-list-rows__row {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(210px, 100%), 1fr));
	gap: clamp(14px, 3vw, 40px);
	align-items: baseline;
	padding: 34px 4px;
	background: var(--rf-bg);
}

.rf-section--alt .rf-list-rows__row {
	background: var(--rf-bg-alt);
}

/* --------------------------------------------------------------------------
   .rf-species-card
   -------------------------------------------------------------------------- */

.rf-species-card {
	border: 1px solid rgba(242, 238, 230, 0.14);
	border-radius: var(--rf-r-card);
	overflow: hidden;
}

.rf-species-card__img {
	display: block;
	width: 100%;
	height: clamp(180px, 36vw, 240px);
	object-fit: cover;
}

.rf-species-card__body {
	padding: 30px 28px 32px;
}

.rf-species-card__tackle {
	margin: 10px 0 14px;
	font-size: 12px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--rf-accent);
}

/* --------------------------------------------------------------------------
   .rf-date-card — sélection d'un départ
   -------------------------------------------------------------------------- */

.rf-date-card {
	display: flex;
	flex-direction: column;
	gap: 22px;
	padding: 34px 30px 30px;
	text-align: left;
	background: var(--rf-bg-alt);
	border: 1px solid var(--rf-line-strong);
	border-radius: var(--rf-r-card);
	cursor: pointer;
	transition: background 0.2s ease, border-color 0.2s ease;
}

.rf-date-card__tag {
	font-size: 11px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--rf-text-dim);
}

.rf-date-card__dot {
	width: 18px;
	height: 18px;
	border-radius: 50%;
	border: 1px solid var(--rf-line-strongest);
}

.rf-date-card[aria-pressed='true'] {
	background: rgba(200, 160, 106, 0.10);
	border-color: var(--rf-accent);
}

.rf-date-card[aria-pressed='true'] .rf-date-card__tag {
	color: var(--rf-accent);
}

.rf-date-card[aria-pressed='true'] .rf-date-card__dot {
	background: var(--rf-accent);
	border-color: var(--rf-accent);
}

/* --------------------------------------------------------------------------
   .rf-form — pré-réservation
   -------------------------------------------------------------------------- */

/* Le panneau se place tantôt sur le fond principal (pages voyage), tantôt sur une
   section alternée (accueil) : il inverse alors ses deux fonds. D'où les variables,
   redéfinies par le contexte plutôt que dupliquer le composant. */
.rf-form {
	padding: clamp(22px, 5vw, 40px);
	background: var(--rf-form-bg, var(--rf-bg-alt));
	border: 1px solid rgba(200, 160, 106, 0.3);
	border-radius: var(--rf-r-panel);
}

.rf-hero--voyage ~ * .rf-form,
.rf-section--alt .rf-form {
	--rf-form-bg: var(--rf-bg);
	--rf-form-field-bg: var(--rf-bg-alt);
}

.rf-form__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(230px, 100%), 1fr));
	gap: 18px;
}

.rf-form__field {
	display: block;
}

.rf-form input[type='text'],
.rf-form input[type='email'],
.rf-form input[type='tel'],
.rf-form input[type='number'],
.rf-form input[type='date'],
.rf-form select,
.rf-form textarea {
	width: 100%;
	min-width: 0;
	margin: 0;
	padding: 14px 16px;
	background: var(--rf-form-field-bg, var(--rf-bg));
	border: 1px solid var(--rf-line-strong);
	border-radius: var(--rf-r-field);
	color: var(--rf-text);
	font-size: 15px;
	box-shadow: none;
}

.rf-form textarea {
	resize: vertical;
}

.rf-form input:focus,
.rf-form select:focus,
.rf-form textarea:focus {
	border-color: var(--rf-accent);
}

/* Pilules de niveau — exclusives */
.rf-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.rf-pill {
	flex: 1 1 auto;
	min-width: 0;
	padding: 13px 10px;
	background: transparent;
	border: 1px solid rgba(242, 238, 230, 0.18);
	border-radius: var(--rf-r-pill);
	color: var(--rf-text-muted);
	font-size: 13.5px;
	cursor: pointer;
	transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.rf-pill[aria-pressed='true'] {
	background: var(--rf-accent-soft);
	border-color: var(--rf-accent);
	color: var(--rf-accent);
}

/* État confirmé */
.rf-form__done {
	text-align: center;
}

.rf-form__check {
	display: grid;
	place-items: center;
	width: 62px;
	height: 62px;
	margin: 0 auto 22px;
	border: 1px solid var(--rf-accent);
	border-radius: 50%;
	color: var(--rf-accent);
}

/* --------------------------------------------------------------------------
   .rf-faq
   -------------------------------------------------------------------------- */

.rf-faq {
	display: grid;
	gap: 1px;
	background: var(--rf-line);
}

.rf-faq__item {
	background: var(--rf-bg);
}

.rf-section--alt .rf-faq__item {
	background: var(--rf-bg-alt);
}

.rf-faq__btn {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	width: 100%;
	padding: 28px 4px;
	background: none;
	border: 0;
	text-align: left;
	cursor: pointer;
	font-family: var(--rf-serif);
	font-size: clamp(20px, 3vw, 24px);
	color: var(--rf-text);
}

.rf-faq__sign {
	flex: none;
	display: grid;
	place-items: center;
	width: 30px;
	height: 30px;
	border: 1px solid var(--rf-line-strongest);
	border-radius: 50%;
	color: var(--rf-accent);
	font-family: var(--rf-sans);
	font-size: 16px;
	line-height: 1;
}

.rf-faq__panel {
	padding: 0 4px 28px;
	font-size: 16px;
	line-height: 1.75;
	color: var(--rf-text-muted);
}

.rf-faq__btn[aria-expanded='false'] + .rf-faq__panel {
	display: none;
}

/* --------------------------------------------------------------------------
   .rf-sticky-cta
   -------------------------------------------------------------------------- */

.rf-sticky-cta {
	position: fixed;
	inset: auto 0 0 0;
	z-index: 45;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	flex-wrap: wrap;
	padding: 14px var(--rf-gutter);
	background: rgba(12, 22, 20, 0.94);
	backdrop-filter: blur(14px);
	border-top: 1px solid rgba(200, 160, 106, 0.34);
	transform: translateY(110%);
	transition: transform 0.35s ease;
}

.rf-sticky-cta.is-visible {
	transform: translateY(0);
}

/* --------------------------------------------------------------------------
   Header, navigation, méga-menus
   -------------------------------------------------------------------------- */

.rf-header {
	position: sticky;
	top: 0;
	z-index: 40;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: clamp(14px, 2vw, 32px);
	padding: 14px clamp(18px, 3vw, 40px);
	background: rgba(8, 16, 15, 0.82);
	backdrop-filter: blur(14px);
	border-bottom: 1px solid rgba(242, 238, 230, 0.09);
}

.rf-header__logo {
	flex: none;
}

.rf-header__logo img {
	display: block;
	width: auto;
	height: 44px;
}

/* Le logo actuellement en médiathèque est sombre : on l'inverse en blanc.
   Dès que le SVG blanc est livré (assets/img/logo.svg), cette classe disparaît. */
.rf-header__logo--invert img {
	filter: brightness(0) invert(1);
}

.rf-header__end {
	display: flex;
	align-items: center;
	gap: 18px;
	flex: none;
}

.rf-nav {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: clamp(10px, 1.8vw, 30px);
	flex: 1 1 auto;
	min-width: 0;
	margin: 0;
	padding: 0;
	list-style: none;
	white-space: nowrap;
}

/* Flatsome pose une marge basse sur tous les <li> : elle décalerait la nav
   et écarterait les entrées des panneaux. */
.rf-nav li,
.rf-dropdown li {
	margin: 0;
	list-style: none;
}

.rf-nav__item {
	position: relative;
}

/* La règle globale « body.rf-on a » colore tous les liens en doré et l'emporte
   sur les classes de composant : on repasse devant avec la même racine. */
body.rf-on .rf-nav__link {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 6px 0;
	color: var(--rf-text-muted);
	font-size: 12.5px;
	font-weight: 300;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	transition: color 0.2s ease;
}

body.rf-on .rf-nav__link:hover,
body.rf-on .rf-nav__link.is-current,
body.rf-on .rf-nav__item.is-open > .rf-nav__link {
	color: var(--rf-text);
}

.rf-nav__caret {
	font-size: 9px;
	color: var(--rf-accent);
}

.rf-dropdown {
	position: absolute;
	top: 100%;
	left: -16px;
	min-width: 240px;
	margin: 0;
	padding: 10px 0;
	background: var(--rf-bg-alt);
	border: 1px solid rgba(242, 238, 230, 0.14);
	border-radius: var(--rf-r-card);
	list-style: none;
	display: none;
	z-index: 40;
}

.rf-nav__item.is-open > .rf-dropdown {
	display: block;
}

.rf-dropdown li {
	list-style: none;
}

body.rf-on .rf-dropdown a {
	display: block;
	padding: 11px 16px;
	color: var(--rf-text-muted);
	font-size: 12px;
	line-height: 1.2;
	letter-spacing: 0.1em;
	white-space: nowrap;
}

body.rf-on .rf-dropdown a:hover {
	color: var(--rf-accent);
}

/* Panier — visible seulement s'il contient quelque chose */
.rf-cart {
	position: relative;
	display: inline-flex;
	align-items: center;
	padding: 6px;
	color: var(--rf-text-muted);
	transition: color 0.2s ease;
}

.rf-cart:hover {
	color: var(--rf-accent);
}

.rf-cart--empty {
	display: none;
}

.rf-cart__count {
	position: absolute;
	top: -2px;
	right: -4px;
	min-width: 17px;
	height: 17px;
	padding: 0 4px;
	border-radius: var(--rf-r-pill);
	background: var(--rf-accent);
	color: var(--rf-bg);
	font-size: 10px;
	font-weight: 700;
	line-height: 17px;
	text-align: center;
}

/* Sélecteur de langue */
.rf-lang {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 11px;
	letter-spacing: 0.18em;
	color: var(--rf-text-faintest);
	white-space: nowrap;
}

.rf-lang a {
	color: var(--rf-text-faintest);
}

.rf-lang a:hover {
	color: var(--rf-text);
}

.rf-lang .is-current {
	color: var(--rf-text);
}

/* En desktop, la langue est dans .rf-header__end ; l'entrée de menu est masquée. */
.rf-nav__item--lang {
	display: none;
}

.rf-burger {
	display: none;
	flex: none;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 5px;
	width: 46px;
	height: 46px;
	padding: 0;
	background: transparent;
	border: 1px solid rgba(242, 238, 230, 0.2);
	border-radius: var(--rf-r-panel);
	cursor: pointer;
}

.rf-burger span {
	display: block;
	width: 20px;
	height: 1px;
	background: var(--rf-text);
}

/* Bascule mobile : pilotée par la classe is-narrow posée en JS (breakpoint 900px),
   pas par une media query, pour rester aligné sur l'état applicatif des maquettes. */
.rf-header.is-narrow .rf-burger {
	display: grid;
	place-items: center;
}

.rf-header.is-narrow .rf-header__logo img {
	height: 30px;
}

.rf-header.is-narrow .rf-nav {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	z-index: 30;
	flex: none;
	flex-direction: column;
	align-items: flex-start;
	gap: 2px;
	padding: 8px 22px 18px;
	background: var(--rf-bg-alt);
	border-bottom: 1px solid rgba(242, 238, 230, 0.12);
	display: none;
}

.rf-header.is-narrow.is-open .rf-nav {
	display: flex;
}

.rf-header.is-narrow .rf-nav__link {
	padding: 14px 0;
}

/* En mobile la langue descend dans le panneau, et disparaît du bloc de droite. */
.rf-header.is-narrow .rf-nav__item--lang {
	display: block;
	padding-top: 14px;
}

.rf-header.is-narrow .rf-header__end .rf-lang {
	display: none;
}

/* Sur mobile les sous-menus sont dépliés, pas en accordéon. */
.rf-header.is-narrow .rf-dropdown {
	position: static;
	display: block;
	left: auto;
	min-width: 0;
	padding: 0 0 6px 10px;
	background: transparent;
	border: 0;
}

/* Le CTA se resserre en mobile. */
.rf-header.is-narrow .rf-btn--gold-outline {
	padding: 11px 14px;
	font-size: 11px;
	letter-spacing: 0.08em;
}

/* ==========================================================================
   Accueil
   ========================================================================== */

/* Utilitaires d'espacement — les seuls tolérés, pour coller aux marges de la
   maquette sans multiplier les classes de composant. */
.rf-mt-24 { margin-top: 24px; }
.rf-mt-26 { margin-top: 26px; }
.rf-mt-32 { margin-top: 32px; }

/* Image de remplissage d'un bloc positionné. */
.rf-cover {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.rf-media {
	position: relative;
	min-width: 0;
	overflow: hidden;
	border-radius: var(--rf-r-card);
}

.rf-media--riviere { height: clamp(280px, 55vw, 460px); }
.rf-media--boat    { height: clamp(200px, 42vw, 300px); }
.rf-media--guide   { height: clamp(300px, 60vw, 540px); }
.rf-media--cadeau  { height: clamp(260px, 52vw, 420px); }

/* Deux colonnes qui retombent l'une sous l'autre sans media query. */
.rf-split {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr));
	gap: clamp(30px, 5vw, 70px);
}

.rf-split--center { align-items: center; }
.rf-split--start  { align-items: start; }

/* Titre de section + note à droite. */
.rf-section-head {
	display: flex;
	align-items: end;
	justify-content: space-between;
	gap: 30px;
	flex-wrap: wrap;
}

.rf-section-head--gallery {
	margin-bottom: 46px;
	padding-left: var(--rf-gutter-section);
	padding-right: var(--rf-gutter-section);
}

.rf-section-head__note {
	max-width: 330px;
	margin: 0;
	font-size: 15px;
	line-height: 1.7;
	color: var(--rf-text-dim);
}

.rf-h2--lg {
	font-size: clamp(38px, 4.4vw, 56px);
}

.rf-section-head .rf-h2 {
	margin-top: 18px;
}

.rf-note {
	font-size: 14px;
	line-height: 1.7;
	color: var(--rf-text-faint);
}

.rf-link-underline {
	display: inline-block;
	padding-bottom: 4px;
	border-bottom: 1px solid var(--rf-accent);
	font-size: 12px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--rf-accent);
}

.rf-tag {
	padding: 7px 14px;
	border-radius: var(--rf-r-pill);
	background: var(--rf-accent-soft);
	color: var(--rf-accent);
	font-size: 10.5px;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	white-space: nowrap;
}

/* --- Hero ---------------------------------------------------------------- */

.rf-hero--home {
	padding-top: 90px;
}

.rf-hero__inner {
	padding-bottom: 70px;
}

.rf-hero__title {
	max-width: 940px;
	margin: 22px 0 0;
	text-wrap: balance;
}

.rf-hero__lead {
	max-width: 540px;
	margin: 26px 0 0;
	font-size: 18px;
	line-height: 1.65;
}

.rf-hero__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px;
	margin-top: 38px;
}

/* --- Bandeau voyages ----------------------------------------------------- */

.rf-voyages-banner {
	position: relative;
	z-index: 5;
	display: block;
	max-width: var(--rf-max);
	margin: -34px auto 0;
	padding: 0 var(--rf-gutter-section);
	color: var(--rf-text);
}

.rf-voyages-banner__inner {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr));
	align-items: center;
	gap: 30px;
	padding: clamp(20px, 4vw, 26px) clamp(18px, 4vw, 34px);
	background: var(--rf-bg-raised);
	border: 1px solid var(--rf-accent-line);
	border-radius: var(--rf-r-panel);
}

.rf-voyages-banner__main {
	display: flex;
	align-items: center;
	gap: 24px;
	flex-wrap: wrap;
}

.rf-voyages-banner__title {
	font-family: var(--rf-serif);
	font-size: 25px;
}

.rf-voyages-banner__note {
	font-size: 14.5px;
	color: var(--rf-text-dim);
}

.rf-voyages-banner__cta {
	justify-self: end;
	padding: 15px 26px;
	border: 1px solid var(--rf-accent);
	border-radius: var(--rf-r-pill);
	color: var(--rf-accent);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	white-space: nowrap;
	transition: background 0.2s ease, color 0.2s ease;
}

.rf-voyages-banner:hover .rf-voyages-banner__cta {
	background: var(--rf-accent);
	color: var(--rf-bg);
}

/* --- Trois partis pris --------------------------------------------------- */

.rf-values {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(255px, 100%), 1fr));
	gap: 1px;
	background: var(--rf-line);
}

.rf-values__item {
	padding: 40px 34px 44px;
	background: var(--rf-bg);
}

.rf-values__label {
	margin: 0;
	font-size: 11px;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: var(--rf-accent);
}

.rf-values__text {
	margin: 20px 0 0;
	font-size: 17px;
	line-height: 1.7;
	color: var(--rf-text-muted);
}

/* --- Activités ------------------------------------------------------------ */

.rf-activites {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(230px, 100%), 1fr));
	gap: 22px;
	margin-top: 50px;
}

.rf-card-photo__title {
	margin: 0;
	font-size: clamp(23px, 4vw, 34px);
}

.rf-card-photo__text {
	max-width: 430px;
	margin: 10px 0 0;
	font-size: 15.5px;
	line-height: 1.6;
	color: var(--rf-text-soft);
}

.rf-card-photo .rf-link-underline {
	margin-top: 18px;
}

/* Emplacement photo manquant — visible uniquement en aperçu, il sert de
   liste de courses pour le client. */
.rf-missing {
	position: absolute;
	inset: 0;
	display: grid;
	align-content: center;
	justify-items: center;
	gap: 10px;
	padding: 24px;
	background: var(--rf-bg-alt);
	border: 1px dashed var(--rf-accent-line);
	border-radius: var(--rf-r-card);
	text-align: center;
}

.rf-missing__label {
	font-size: 10.5px;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: var(--rf-accent);
}

.rf-missing__text {
	max-width: 320px;
	font-size: 14px;
	line-height: 1.6;
	color: var(--rf-text-dim);
}

/* Dans un hero, l'emplacement vide ne doit pas concurrencer le titre : il se
   réduit à une pastille en bas à droite. */
.rf-hero__media .rf-missing {
	inset: auto 20px 20px auto;
	align-content: end;
	justify-items: end;
	gap: 4px;
	padding: 12px 16px;
	background: rgba(12, 22, 20, 0.9);
	text-align: right;
}

.rf-hero__media .rf-missing__text {
	max-width: 240px;
	font-size: 12.5px;
}

/* --- Les six formules mouche ---------------------------------------------- */

.rf-formules {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(255px, 100%), 1fr));
	gap: 18px;
	margin-top: 56px;
}

/* Overlay un peu plus léger que sur les grandes cartes : les vignettes sont
   plus petites, le texte y tient sur deux lignes. */
.rf-card-photo--formule::after {
	background: linear-gradient(180deg, rgba(8, 16, 15, 0.10) 35%, rgba(8, 16, 15, 0.88) 100%);
}

.rf-card-photo__body--tight {
	padding: 0 20px 18px;
}

.rf-formule__title {
	display: block;
	font-family: var(--rf-serif);
	font-size: 24px;
	line-height: 1.15;
}

.rf-formule__meta {
	display: block;
	margin-top: 6px;
	font-size: 13px;
	color: var(--rf-accent);
}

/* --- Le bateau ------------------------------------------------------------ */

.rf-specs {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(190px, 100%), 1fr));
	gap: 24px;
	margin: 36px 0 0;
	padding-top: 30px;
	border-top: 1px solid rgba(242, 238, 230, 0.14);
	font-size: 15px;
}

.rf-specs__label {
	font-size: 10.5px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--rf-text-faintest);
}

.rf-specs__value {
	margin: 8px 0 0;
}

.rf-saisons {
	margin-top: 40px;
}

.rf-saisons .rf-list-rows__row {
	grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr));
	gap: 20px;
	padding: 18px 2px;
	align-items: baseline;
}

.rf-saisons__head {
	font-size: 12px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--rf-text-faintest);
}

.rf-saisons__row {
	font-size: 16px;
}

.rf-saisons__flag {
	color: var(--rf-accent);
	font-size: 12px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

.rf-saisons__period {
	color: var(--rf-text-muted);
}

.rf-pricebox {
	margin-top: 22px;
	padding: 32px 30px;
	background: var(--rf-bg-alt);
	border: 1px solid var(--rf-accent-line);
	border-radius: var(--rf-r-panel);
}

.rf-pricebox__label {
	margin: 0;
	font-size: 11px;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--rf-accent);
}

.rf-pricebox__list {
	display: grid;
	gap: 18px;
	margin-top: 22px;
}

.rf-pricebox__row {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	font-size: 16px;
}

.rf-pricebox__price {
	font-family: var(--rf-serif);
	font-size: 24px;
	white-space: nowrap;
}

.rf-pricebox__note {
	margin: 24px 0 0;
	font-size: 13.5px;
	line-height: 1.65;
	color: var(--rf-text-faint);
}

/* --- Bandeau vidéo + citation --------------------------------------------- */

.rf-quote {
	position: relative;
	display: grid;
	align-items: center;
	min-height: clamp(300px, 58vw, 520px);
	margin-top: var(--rf-rhythm);
	padding: var(--rf-section-y) var(--rf-gutter-section);
	overflow: hidden;
}

/* Dégradé horizontal ici, contrairement au hero : le texte est calé à gauche. */
.rf-quote__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(8, 16, 15, 0.92) 0%, rgba(8, 16, 15, 0.55) 60%, rgba(8, 16, 15, 0.35) 100%);
	pointer-events: none;
}

.rf-quote__inner {
	position: relative;
	z-index: 2;
}

.rf-quote__block {
	max-width: 720px;
	margin: 0;
	padding: 0;
	border: 0;
}

.rf-quote__text {
	margin: 0;
	font-family: var(--rf-serif);
	font-size: clamp(28px, 3.2vw, 40px);
	line-height: 1.35;
	font-style: italic;
	color: var(--rf-text);
}

.rf-quote__author {
	margin-top: 28px;
	font-size: 12px;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--rf-accent);
}

/* --- Le guide -------------------------------------------------------------- */

.rf-stats {
	display: flex;
	flex-wrap: wrap;
	gap: 40px;
	margin-top: 38px;
	padding-top: 32px;
	border-top: 1px solid rgba(242, 238, 230, 0.14);
}

.rf-stats__value {
	margin: 0;
	font-family: var(--rf-serif);
	font-size: clamp(23px, 4vw, 34px);
	color: var(--rf-accent);
}

.rf-stats__label {
	margin: 6px 0 0;
	font-size: 13.5px;
	color: var(--rf-text-dim);
}

/* --- Galerie ---------------------------------------------------------------- */

.rf-gallery {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(190px, 100%), 1fr));
	gap: 12px;
	padding: 0 var(--rf-gutter-section);
}

.rf-gallery__item {
	position: relative;
	height: clamp(190px, 38vw, 260px);
	min-width: 0;
	overflow: hidden;
	border-radius: var(--rf-r-card);
}

.rf-gallery__more {
	margin-top: 30px;
	padding-left: var(--rf-gutter-section);
	padding-right: var(--rf-gutter-section);
}

/* --- Réservation ------------------------------------------------------------ */

.rf-points {
	display: grid;
	gap: 14px;
	margin: 36px 0 0;
	padding: 0;
	list-style: none;
	font-size: 16px;
	color: var(--rf-text-muted);
}

.rf-points li {
	display: flex;
	gap: 14px;
	margin: 0;
	list-style: none;
}

.rf-points li span:first-child {
	color: var(--rf-accent);
}

.rf-form__title {
	margin: 0;
	font-family: var(--rf-serif);
	font-size: 28px;
}

.rf-field-group {
	display: grid;
	gap: 12px;
	margin-top: 24px;
}

.rf-form__title + .rf-field-group {
	margin-top: 28px;
}

.rf-choices {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(230px, 100%), 1fr));
	gap: 10px;
}

.rf-choice {
	padding: 14px 12px;
	background: transparent;
	border: 1px solid rgba(242, 238, 230, 0.18);
	border-radius: var(--rf-r-field);
	color: var(--rf-text-muted);
	font-size: 14px;
	text-align: left;
	cursor: pointer;
	transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.rf-choice[aria-pressed='true'] {
	background: var(--rf-accent-soft);
	border-color: var(--rf-accent);
	color: var(--rf-accent);
}

.rf-form__grid {
	margin-top: 24px;
}

.rf-form__field {
	display: grid;
	gap: 9px;
	min-width: 0;
}

.rf-form .rf-btn--block {
	margin-top: 28px;
}

.rf-form__legal {
	margin: 14px 0 0;
	font-size: 12.5px;
	line-height: 1.6;
	color: var(--rf-text-faint);
}

.rf-form__error {
	margin: 14px 0 0;
	padding: 12px 14px;
	border: 1px solid var(--rf-accent);
	border-radius: var(--rf-r-field);
	font-size: 14px;
	color: var(--rf-accent-hover);
}

.rf-form__done {
	padding: 36px 10px;
	text-align: center;
}

.rf-form__done .rf-h3 {
	margin-top: 26px;
}

.rf-form__summary {
	max-width: 380px;
	margin: 14px auto 0;
	font-size: 16px;
	line-height: 1.7;
	color: var(--rf-text-muted);
}

.rf-form__reset {
	margin-top: 28px;
	padding: 14px 26px;
	font-size: 12px;
	font-weight: 400;
}

/* Pot de miel anti-robots : hors écran, jamais atteignable au clavier. */
.rf-honeypot {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* --- Pied de page ------------------------------------------------------------ */

.rf-footer {
	margin-top: var(--rf-rhythm);
	/* Padding bas généreux : la barre CTA fixe vient se poser dessus. */
	padding: clamp(56px, 9vw, 90px) var(--rf-gutter-section) 120px;
	background: var(--rf-bg-alt);
	border-top: 1px solid rgba(242, 238, 230, 0.1);
}

.rf-footer__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr));
	gap: 50px;
}

.rf-footer__logo {
	display: block;
	width: auto;
	height: 44px;
}

.rf-footer__logo--invert {
	filter: brightness(0) invert(1);
}

.rf-footer__baseline {
	max-width: 320px;
	margin: 20px 0 0;
	font-size: 15px;
	line-height: 1.7;
	color: var(--rf-text-dim);
}

.rf-footer__col {
	display: grid;
	gap: 12px;
	align-content: start;
	font-size: 15px;
}

.rf-footer__partner-logo {
	display: block;
	width: auto;
	max-width: 150px;
	height: auto;
	margin-bottom: 4px;
	filter: brightness(0) invert(1);
	opacity: 0.85;
}

.rf-footer__title {
	margin: 0;
	font-size: 11px;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--rf-text-faintest);
}

body.rf-on .rf-footer__col a,
body.rf-on .rf-footer__col span {
	color: var(--rf-text-muted);
}

body.rf-on .rf-footer__col a:hover {
	color: var(--rf-accent);
}

.rf-footer__bar {
	display: flex;
	justify-content: space-between;
	gap: 20px;
	flex-wrap: wrap;
	margin-top: 60px;
	padding-top: 26px;
	border-top: 1px solid rgba(242, 238, 230, 0.1);
	font-size: 13px;
	color: var(--rf-text-faintest);
}

.rf-footer__legal {
	display: flex;
	gap: 24px;
}

body.rf-on .rf-footer__legal a {
	color: var(--rf-text-faintest);
}

body.rf-on .rf-footer__legal a:hover {
	color: var(--rf-text);
}

/* ==========================================================================
   Pages voyage
   ========================================================================== */

.rf-mt-18 { margin-top: 18px; }

.rf-hero--voyage {
	padding-top: clamp(70px, 12vw, 90px);
}

/* Le dégradé vertical de la maquette est au plus clair à 40 % de hauteur —
   exactement là où se trouvent le surtitre et le titre. Sur une photo lumineuse
   (rivière au soleil, ciel), le texte devient illisible. On ajoute donc un voile
   latéral sous le contenu : le procédé est déjà celui du bandeau citation, et il
   garantit la lisibilité quelle que soit la photo, sans toucher au dégradé. */
.rf-hero--voyage .rf-hero__overlay::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(8, 16, 15, 0.62) 0%, rgba(8, 16, 15, 0.28) 45%, rgba(8, 16, 15, 0) 75%);
}

.rf-hero__note {
	font-size: 13px;
	color: var(--rf-text-faint);
}

/* Barre de faits : le conteneur porte la gouttière, la barre le chevauchement. */
.rf-facts-wrap {
	position: relative;
	z-index: 5;
	padding: 0 var(--rf-gutter-section);
}

.rf-facts__suffix {
	margin-left: 6px;
	font-family: var(--rf-sans);
	font-size: 13px;
	color: var(--rf-text-faint);
}

.rf-facts__cta {
	justify-self: end;
}

/* --- Page pilier « Nos Voyages » ------------------------------------------ */

.rf-facts__value--accent {
	color: var(--rf-accent);
}

.rf-destinations {
	display: grid;
	gap: 22px;
	margin-top: 46px;
}

/* Photo à gauche, détails à droite ; les deux se superposent sous 760 px sans
   media query, grâce au minmax(). */
.rf-destination {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(340px, 100%), 1fr));
	border: 1px solid var(--rf-accent-line);
	border-radius: var(--rf-r-card);
	overflow: hidden;
	background: var(--rf-bg-alt);
}

.rf-destination__media {
	position: relative;
	min-height: clamp(260px, 40vw, 420px);
}

.rf-destination__badge {
	position: absolute;
	top: 18px;
	left: 18px;
	z-index: 2;
	padding: 8px 16px;
	border-radius: var(--rf-r-pill);
	background: rgba(8, 16, 15, 0.8);
	backdrop-filter: blur(8px);
	border: 1px solid var(--rf-accent-line);
	font-size: 10.5px;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--rf-accent);
}

.rf-destination__body {
	padding: clamp(26px, 4vw, 40px);
}

.rf-destination__place {
	margin: 0;
	font-size: 11px;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--rf-text-faint);
}

.rf-destination__title {
	margin-top: 14px;
	font-size: clamp(26px, 3.6vw, 38px);
}

.rf-destination__text {
	margin: 18px 0 0;
	font-size: 16px;
	line-height: 1.7;
	color: var(--rf-text-muted);
}

.rf-destination__specs {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(150px, 100%), 1fr));
	gap: 22px;
	margin: 28px 0 0;
	padding-top: 26px;
	border-top: 1px solid var(--rf-line);
}

.rf-destination__specs dt {
	font-size: 10.5px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--rf-text-faintest);
}

.rf-destination__specs dd {
	margin: 8px 0 0;
	font-size: 15.5px;
	color: var(--rf-text);
}

.rf-destination__price {
	color: var(--rf-accent) !important;
}

.rf-destination .rf-btn {
	margin-top: 30px;
}

/* Les quatre principes */
.rf-principes {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
	gap: 1px;
	margin-top: 44px;
	background: var(--rf-line);
}

.rf-principes__item {
	padding: 32px 30px 36px;
	background: var(--rf-bg-alt);
}

.rf-principes__title {
	margin: 0;
	font-family: var(--rf-serif);
	font-size: clamp(23px, 3vw, 28px);
	color: var(--rf-accent);
}

.rf-principes__text {
	margin: 14px 0 0;
	font-size: 15px;
	line-height: 1.65;
	color: var(--rf-text-muted);
}

/* Chiffres clés de la présentation */
.rf-keyfigures {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr));
	gap: 1px;
	background: var(--rf-line);
}

.rf-keyfigures__item {
	display: grid;
	gap: 10px;
	align-content: start;
	padding: 28px 26px 32px;
	background: var(--rf-bg);
}

.rf-keyfigures__value {
	font-family: var(--rf-serif);
	font-size: clamp(28px, 4vw, 38px);
	color: var(--rf-accent);
}

.rf-keyfigures__label {
	font-size: 14.5px;
	line-height: 1.6;
	color: var(--rf-text-dim);
}

/* Mosaïque : une grande photo, deux empilées */
.rf-mosaic {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
	gap: 18px;
}

.rf-mosaic__main {
	position: relative;
	height: clamp(280px, 52vw, 460px);
	overflow: hidden;
	border-radius: var(--rf-r-card);
}

.rf-mosaic__side {
	display: grid;
	grid-template-rows: 1fr 1fr;
	gap: 18px;
	min-height: clamp(280px, 52vw, 460px);
}

.rf-mosaic__cell {
	position: relative;
	overflow: hidden;
	border-radius: var(--rf-r-card);
}

/* Programme */
.rf-programme__day {
	font-size: 12px;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: var(--rf-accent);
}

.rf-programme__title {
	font-family: var(--rf-serif);
	font-size: clamp(21px, 3vw, 26px);
	line-height: 1.2;
}

.rf-programme__text {
	font-size: 15.5px;
	line-height: 1.7;
	color: var(--rf-text-muted);
}

/* Espèces */
.rf-especes {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
	gap: 18px;
	margin-top: 46px;
}

.rf-species-card__img--empty {
	display: block;
	width: 100%;
	height: clamp(180px, 36vw, 240px);
	background: var(--rf-bg-alt);
}

.rf-media--lodge { height: clamp(280px, 55vw, 460px); }
.rf-media--cross { height: clamp(260px, 52vw, 400px); }

/* Dates & prix */
.rf-dates {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
	gap: 18px;
	margin-top: 46px;
}

.rf-date-card__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}

.rf-date-card__dates {
	display: block;
	font-family: var(--rf-serif);
	font-size: clamp(21px, 3vw, 26px);
	line-height: 1.2;
	color: var(--rf-text);
}

.rf-date-card__season {
	display: block;
	margin-top: 8px;
	font-size: 14px;
	line-height: 1.6;
	color: var(--rf-text-dim);
}

.rf-date-card__price {
	display: flex;
	align-items: baseline;
	gap: 10px;
	flex-wrap: wrap;
}

.rf-date-card__amount {
	font-family: var(--rf-serif);
	font-size: clamp(24px, 3.4vw, 30px);
	color: var(--rf-text);
}

.rf-date-card__unit {
	font-size: 12.5px;
	color: var(--rf-text-faint);
}

.rf-date-card__places {
	font-size: 13px;
	color: var(--rf-text-dim);
}

.rf-date-card[aria-pressed='true'] .rf-date-card__places {
	color: var(--rf-accent);
}

/* Les trois étapes de la pré-réservation */
.rf-steps {
	display: grid;
	gap: 26px;
	margin: 40px 0 0;
	padding: 0;
	list-style: none;
	counter-reset: none;
}

.rf-steps__item {
	display: flex;
	gap: 20px;
	margin: 0;
	list-style: none;
}

.rf-steps__num {
	flex: none;
	font-family: var(--rf-serif);
	font-size: 20px;
	color: var(--rf-accent);
}

.rf-steps__title {
	display: block;
	font-size: 16px;
	color: var(--rf-text);
}

.rf-steps__text {
	display: block;
	margin-top: 6px;
	font-size: 14.5px;
	line-height: 1.6;
	color: var(--rf-text-dim);
}

/* Formulaire de pré-réservation */
.rf-form__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
}

.rf-form__seats {
	font-size: 12.5px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--rf-accent);
}

.rf-consent {
	display: flex;
	align-items: start;
	gap: 12px;
	margin-top: 22px;
	font-size: 13.5px;
	line-height: 1.6;
	color: var(--rf-text-dim);
}

.rf-consent input {
	flex: none;
	margin-top: 3px;
	accent-color: var(--rf-accent);
}

/* Témoignages */
.rf-avis {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
	gap: 18px;
	margin-top: 40px;
}

.rf-avis__item {
	margin: 0;
	padding: 34px 32px 30px;
	background: var(--rf-bg-alt);
	border: 1px solid var(--rf-line-strong);
	border-radius: var(--rf-r-card);
}

.rf-avis__quote {
	margin: 0;
	padding: 0;
	border: 0;
	font-family: var(--rf-serif);
	font-size: clamp(19px, 2.4vw, 22px);
	line-height: 1.45;
	font-style: italic;
	color: var(--rf-text);
}

.rf-avis__meta {
	margin-top: 22px;
}

.rf-avis__author {
	display: block;
	font-size: 12px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--rf-accent);
}

.rf-avis__context {
	display: block;
	margin-top: 6px;
	font-size: 13.5px;
	color: var(--rf-text-dim);
}

/* Barre CTA fixe */
.rf-sticky-cta__text {
	display: flex;
	align-items: baseline;
	gap: 14px;
	flex-wrap: wrap;
	font-size: 14.5px;
	color: var(--rf-text);
}

.rf-sticky-cta__seats {
	font-size: 13px;
	color: var(--rf-text-dim);
}

.rf-sticky-cta__btn {
	padding: 13px 24px;
	font-size: 12px;
}

/* ==========================================================================
   Pages activités
   ========================================================================== */

/* Espèces sans photo : la carte se réduit à son corps. */
.rf-species-card--flat {
	background: var(--rf-bg-alt);
}

.rf-section--alt .rf-species-card--flat {
	background: var(--rf-bg);
}

/* Prix mis en avant */
.rf-tarif__price {
	display: flex;
	align-items: baseline;
	gap: 14px;
	flex-wrap: wrap;
	margin: 26px 0 0;
}

.rf-tarif__amount {
	font-family: var(--rf-serif);
	font-size: clamp(38px, 6vw, 56px);
	line-height: 1;
	color: var(--rf-accent);
}

.rf-tarif__unit {
	font-size: 14.5px;
	color: var(--rf-text-dim);
}

.rf-tarifs {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
	gap: 18px;
	margin-top: 40px;
}

.rf-tarifs .rf-pricebox {
	margin-top: 0;
}

/* Rendez-vous */
.rf-rdv {
	max-width: 720px;
}

/* Filtres de la page pilier */
.rf-filters {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 40px;
}

.rf-filter {
	flex: 0 0 auto;
	border-radius: var(--rf-r-pill);
	padding: 12px 20px;
}

.rf-formules--grid {
	margin-top: 26px;
}

.rf-formule-card {
	display: grid;
	grid-template-rows: auto 1fr;
	background: var(--rf-bg-alt);
	border: 1px solid var(--rf-line-strong);
	border-radius: var(--rf-r-card);
	overflow: hidden;
	color: var(--rf-text);
	transition: border-color 0.2s ease;
}

.rf-formule-card:hover {
	border-color: var(--rf-accent);
	color: var(--rf-text);
}

.rf-formule-card__media {
	position: relative;
	display: block;
	height: clamp(170px, 30vw, 210px);
	overflow: hidden;
}

.rf-formule-card__body {
	display: grid;
	gap: 10px;
	align-content: start;
	padding: 26px 26px 28px;
}

.rf-formule-card__meta {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	font-size: 11px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--rf-text-faint);
}

.rf-formule-card__title {
	font-family: var(--rf-serif);
	font-size: clamp(21px, 3vw, 26px);
	line-height: 1.2;
}

.rf-formule-card__text {
	font-size: 15px;
	line-height: 1.6;
	color: var(--rf-text-muted);
}

.rf-formule-card__price {
	margin-top: 6px;
	font-size: 13px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--rf-accent);
}

/* Boutique — barre de filtres et bascule */
.rf-shop-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	flex-wrap: wrap;
}

.rf-modes {
	display: flex;
	gap: 6px;
	padding: 5px;
	margin-top: 40px;
	background: var(--rf-bg-alt);
	border: 1px solid var(--rf-line-strong);
	border-radius: var(--rf-r-pill);
}

.rf-mode {
	padding: 11px 22px;
	background: transparent;
	border: 0;
	border-radius: var(--rf-r-pill);
	color: var(--rf-text-muted);
	font-size: 12.5px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background 0.2s ease, color 0.2s ease;
}

.rf-mode[aria-pressed='true'] {
	background: var(--rf-accent);
	color: var(--rf-bg);
}

/* Étiquette de catégorie posée sur la photo produit */
.rf-formule-card__tag {
	position: absolute;
	top: 14px;
	left: 14px;
	z-index: 2;
	padding: 7px 13px;
	border-radius: var(--rf-r-pill);
	background: rgba(8, 16, 15, 0.78);
	backdrop-filter: blur(8px);
	font-size: 10.5px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--rf-text-muted);
}

.rf-formule-card__tag.is-gift {
	background: var(--rf-accent-soft);
	color: var(--rf-accent);
}

/* WooCommerce écrit ses prix avec ses propres balises : on les neutralise. */
.rf-formule-card__price .woocommerce-Price-amount,
.rf-formule-card__price bdi,
.rf-formule-card__price del,
.rf-formule-card__price ins {
	color: inherit;
	background: none;
	text-decoration: none;
	font-size: inherit;
}

.rf-formule-card__price .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
}

/* Fiche produit */
.rf-media--product {
	height: clamp(300px, 52vw, 480px);
}

.rf-product__panel {
	position: relative;
}

.rf-product__facts {
	display: grid;
	gap: 1px;
	margin-top: 18px;
	background: var(--rf-line);
}

.rf-product__fact {
	display: grid;
	gap: 8px;
	padding: 24px 22px 26px;
	background: var(--rf-bg-alt);
}

.rf-product__fact-label {
	font-size: 10.5px;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: var(--rf-accent);
}

.rf-product__fact-title {
	font-family: var(--rf-serif);
	font-size: 20px;
}

.rf-product__fact-text {
	font-size: 14.5px;
	line-height: 1.6;
	color: var(--rf-text-muted);
}

.rf-product__form {
	margin-top: 34px;
	padding: clamp(22px, 4vw, 32px);
	background: var(--rf-bg-alt);
	border: 1px solid var(--rf-accent-line);
	border-radius: var(--rf-r-panel);
}

.rf-product__form .rf-form__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr));
	gap: 16px;
}

.rf-product__form input[type='text'],
.rf-product__form input[type='number'],
.rf-product__form select {
	width: 100%;
	padding: 13px 15px;
	background: var(--rf-bg);
	border: 1px solid var(--rf-line-strong);
	border-radius: var(--rf-r-field);
	color: var(--rf-text);
	font-size: 15px;
}

.rf-variation {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
}

.rf-variation__price {
	font-size: 13px;
	color: var(--rf-text-faint);
	white-space: nowrap;
}

.rf-variation[aria-pressed='true'] .rf-variation__price {
	color: var(--rf-accent);
}

.rf-modes--inline {
	margin-top: 0;
	width: fit-content;
}

.rf-product__buy {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	flex-wrap: wrap;
	margin-top: 26px;
	padding-top: 24px;
	border-top: 1px solid var(--rf-line);
}

.rf-qty {
	display: flex;
	align-items: center;
	gap: 4px;
	padding: 4px;
	border: 1px solid var(--rf-line-strong);
	border-radius: var(--rf-r-pill);
}

.rf-qty__btn {
	width: 38px;
	height: 38px;
	background: transparent;
	border: 0;
	border-radius: 50%;
	color: var(--rf-text);
	font-size: 18px;
	cursor: pointer;
}

.rf-qty__btn:hover {
	background: var(--rf-accent-soft);
	color: var(--rf-accent);
}

.rf-product__form .rf-qty__input {
	width: 54px;
	padding: 8px 0;
	background: transparent;
	border: 0;
	text-align: center;
	font-size: 16px;
	-moz-appearance: textfield;
}

.rf-qty__input::-webkit-outer-spin-button,
.rf-qty__input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.rf-product__total {
	display: grid;
	gap: 4px;
	justify-items: end;
	text-align: right;
}

.rf-product__amount {
	font-family: var(--rf-serif);
	font-size: clamp(26px, 3.6vw, 34px);
	color: var(--rf-text);
}

.rf-product__note {
	font-size: 13px;
	color: var(--rf-text-faint);
}

.rf-product__reassurance {
	margin-top: 30px;
}

/* Bandeau d'informations pratiques */
.rf-infos {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(230px, 100%), 1fr));
	gap: 1px;
	background: var(--rf-line);
}

.rf-infos__item {
	padding: 30px 28px 34px;
	background: var(--rf-bg-alt);
}

.rf-infos__label {
	margin: 0;
	font-size: 11px;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: var(--rf-accent);
}

.rf-infos__text {
	margin: 14px 0 0;
	font-size: 15px;
	line-height: 1.65;
	color: var(--rf-text-muted);
}

body.rf-on .rf-infos__text a {
	color: var(--rf-accent);
	border-bottom: 1px solid var(--rf-accent-line);
}

.rf-sticky-cta__price {
	font-family: var(--rf-serif);
	font-size: 20px;
	color: var(--rf-accent);
}

/* Renvois de bas de page */
.rf-cross-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
	gap: 18px;
}

.rf-cross-card {
	display: grid;
	gap: 10px;
	align-content: start;
	padding: 34px 32px 36px;
	background: var(--rf-bg-alt);
	border: 1px solid var(--rf-line-strong);
	border-radius: var(--rf-r-card);
	color: var(--rf-text);
	transition: border-color 0.2s ease;
}

.rf-cross-card:hover {
	border-color: var(--rf-accent);
	color: var(--rf-text);
}

.rf-cross-card__label {
	font-size: 11px;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: var(--rf-accent);
}

.rf-cross-card__title {
	font-family: var(--rf-serif);
	font-size: clamp(21px, 3vw, 26px);
	line-height: 1.2;
}

.rf-cross-card__text {
	font-size: 15px;
	line-height: 1.65;
	color: var(--rf-text-muted);
}

/* --------------------------------------------------------------------------
   Accessibilité
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	body.rf-on *,
	body.rf-on *::before,
	body.rf-on *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}

	.rf-hero__inner {
		animation: none;
	}
}

.rf-visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

/* ==========================================================================
   Galerie
   ========================================================================== */

.rf-galerie-head__lead {
	max-width: 640px;
}

.rf-galerie-section {
	margin-top: clamp(30px, 5vw, 46px);
}

/* Mosaïque : hauteur de ligne fine + spans, comme la maquette. */
.rf-mosaique {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr));
	grid-auto-rows: 10px;
	gap: 12px;
	padding: 0 var(--rf-gutter-section);
}

.rf-mosaique__item {
	position: relative;
	grid-row: span 22;
	padding: 0;
	border: 0;
	border-radius: var(--rf-r-card);
	overflow: hidden;
	background: var(--rf-bg-alt);
	cursor: zoom-in;
}

.rf-mosaique__item--tall { grid-row: span 32; }
.rf-mosaique__item--wide { grid-row: span 18; grid-column: span 2; }

.rf-mosaique__item .rf-cover {
	transition: transform 0.6s ease;
}

.rf-mosaique__item:hover .rf-cover {
	transform: scale(1.04);
}

.rf-mosaique__tag {
	position: absolute;
	left: 12px;
	bottom: 12px;
	padding: 6px 12px;
	border-radius: var(--rf-r-pill);
	background: rgba(8, 16, 15, 0.78);
	backdrop-filter: blur(8px);
	font-size: 10px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--rf-text-muted);
	opacity: 0;
	transition: opacity 0.2s ease;
}

.rf-mosaique__item:hover .rf-mosaique__tag,
.rf-mosaique__item:focus-visible .rf-mosaique__tag {
	opacity: 1;
}

/* --- Visionneuse ---------------------------------------------------------- */

.rf-lightbox {
	position: fixed;
	inset: 0;
	z-index: 60;
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: clamp(8px, 2vw, 24px);
	padding: clamp(16px, 4vw, 48px);
	background: rgba(8, 16, 15, 0.96);
	backdrop-filter: blur(6px);
}

.rf-lightbox__figure {
	margin: 0;
	display: grid;
	justify-items: center;
	gap: 18px;
	min-width: 0;
}

.rf-lightbox__figure img {
	max-width: 100%;
	max-height: 76vh;
	object-fit: contain;
	border-radius: var(--rf-r-card);
}

.rf-lightbox__caption {
	display: flex;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
	justify-content: center;
	font-size: 14.5px;
	color: var(--rf-text-muted);
	text-align: center;
}

.rf-lightbox__tag {
	font-size: 10.5px;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--rf-accent);
}

.rf-lightbox__count {
	font-size: 13px;
	color: var(--rf-text-faint);
}

.rf-lightbox__nav,
.rf-lightbox__close {
	display: grid;
	place-items: center;
	width: 46px;
	height: 46px;
	background: transparent;
	border: 1px solid var(--rf-line-strong);
	border-radius: 50%;
	color: var(--rf-text);
	font-size: 24px;
	line-height: 1;
	cursor: pointer;
	transition: border-color 0.2s ease, color 0.2s ease;
}

.rf-lightbox__nav:hover,
.rf-lightbox__close:hover {
	border-color: var(--rf-accent);
	color: var(--rf-accent);
}

.rf-lightbox__close {
	position: absolute;
	top: clamp(16px, 3vw, 32px);
	right: clamp(16px, 3vw, 32px);
	z-index: 2;
}

/* En-tête de la galerie : filtres à gauche, compteur à droite, filet dessous. */
.rf-galerie-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	flex-wrap: wrap;
	margin-top: 40px;
	padding-bottom: 26px;
	border-bottom: 1px solid var(--rf-line);
}

.rf-galerie-bar .rf-filters {
	margin-top: 0;
}

.rf-galerie-bar__count {
	margin: 0;
	font-size: 12px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--rf-text-faint);
	white-space: nowrap;
}

/* ==========================================================================
   Panier, commande, compte
   --------------------------------------------------------------------------
   Ces trois écrans ne figurent sur aucune maquette. On les habille en CSS pur,
   sur le balisage natif de WooCommerce : aucune surcharge de gabarit, aucune
   modification du tunnel de paiement. Stripe, les taxes et les bons cadeaux
   continuent de fonctionner exactement comme avant.
   ========================================================================== */

body.rf-on.woocommerce-cart #main,
body.rf-on.woocommerce-checkout #main,
body.rf-on.woocommerce-account #main {
	padding: var(--rf-rhythm) var(--rf-gutter-section) var(--rf-section-y);
}

body.rf-on.woocommerce-cart .page-title,
body.rf-on.woocommerce-checkout .page-title,
body.rf-on.woocommerce-account .page-title {
	font-family: var(--rf-serif);
	font-size: clamp(32px, 5vw, 52px);
	color: var(--rf-text);
}

/* --- Messages ------------------------------------------------------------- */

body.rf-on .woocommerce-message,
body.rf-on .woocommerce-info,
body.rf-on .woocommerce-error {
	padding: 18px 22px;
	background: var(--rf-bg-alt);
	border: 1px solid var(--rf-line-strong);
	border-left: 2px solid var(--rf-accent);
	border-radius: var(--rf-r-card);
	color: var(--rf-text-muted);
	list-style: none;
}

body.rf-on .woocommerce-error {
	border-left-color: #C97A6A;
}

body.rf-on .woocommerce-message a,
body.rf-on .woocommerce-info a,
body.rf-on .woocommerce-error a {
	color: var(--rf-accent);
}

/* --- Tableaux (panier et récapitulatif) ----------------------------------- */

body.rf-on .shop_table {
	width: 100%;
	background: transparent;
	border: 0;
	border-collapse: collapse;
}

body.rf-on .shop_table th,
body.rf-on .shop_table td {
	padding: 20px 14px;
	background: transparent;
	border: 0;
	border-bottom: 1px solid var(--rf-line);
	color: var(--rf-text-muted);
	vertical-align: middle;
}

body.rf-on .shop_table th {
	font-size: 11px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--rf-text-faintest);
	font-weight: 400;
}

body.rf-on .shop_table .product-name a {
	color: var(--rf-text);
	font-family: var(--rf-serif);
	font-size: 19px;
}

body.rf-on .shop_table .product-thumbnail img {
	width: 84px;
	height: 84px;
	object-fit: cover;
	border-radius: var(--rf-r-card);
}

body.rf-on .shop_table .amount {
	color: var(--rf-text);
}

body.rf-on .shop_table a.remove {
	display: grid;
	place-items: center;
	width: 26px;
	height: 26px;
	border: 1px solid var(--rf-line-strong);
	border-radius: 50%;
	color: var(--rf-text-faint) !important;
	background: transparent !important;
	font-size: 14px;
	line-height: 1;
}

body.rf-on .shop_table a.remove:hover {
	border-color: var(--rf-accent);
	color: var(--rf-accent) !important;
}

/* Les métadonnées de bon cadeau affichées sous le produit */
body.rf-on .shop_table .variation,
body.rf-on .shop_table dl.variation {
	margin-top: 8px;
	font-size: 13.5px;
	color: var(--rf-text-faint);
}

body.rf-on .shop_table dl.variation dt,
body.rf-on .shop_table dl.variation dd {
	display: inline;
	margin: 0 4px 0 0;
}

/* --- Champs --------------------------------------------------------------- */

body.rf-on .woocommerce input[type='text'],
body.rf-on .woocommerce input[type='email'],
body.rf-on .woocommerce input[type='tel'],
body.rf-on .woocommerce input[type='password'],
body.rf-on .woocommerce input[type='number'],
body.rf-on .woocommerce select,
body.rf-on .woocommerce textarea,
body.rf-on .select2-container .select2-selection {
	padding: 13px 15px;
	background: var(--rf-bg-alt);
	border: 1px solid var(--rf-line-strong);
	border-radius: var(--rf-r-field);
	color: var(--rf-text);
	font-size: 15px;
	box-shadow: none;
	height: auto;
}

body.rf-on .woocommerce input:focus,
body.rf-on .woocommerce select:focus,
body.rf-on .woocommerce textarea:focus {
	border-color: var(--rf-accent);
}

body.rf-on .form-row label,
body.rf-on .woocommerce-form__label {
	font-size: 11px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--rf-text-faint);
}

body.rf-on .quantity input.qty {
	width: 68px;
	text-align: center;
}

/* --- Boutons -------------------------------------------------------------- */

body.rf-on .woocommerce .button,
body.rf-on .woocommerce button.button,
body.rf-on .woocommerce input.button,
body.rf-on #place_order,
body.rf-on .checkout-button {
	padding: 16px 28px;
	background: transparent;
	border: 1px solid var(--rf-line-strongest);
	border-radius: var(--rf-r-pill);
	color: var(--rf-text);
	font-size: 12.5px;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

body.rf-on .woocommerce .button:hover {
	border-color: var(--rf-text);
	background: transparent;
	color: var(--rf-text);
}

/* Les deux boutons qui font avancer la commande passent en doré plein. */
body.rf-on .checkout-button,
body.rf-on #place_order {
	background: var(--rf-accent);
	border-color: var(--rf-accent);
	color: var(--rf-bg);
}

body.rf-on .checkout-button:hover,
body.rf-on #place_order:hover {
	background: var(--rf-accent-hover);
	border-color: var(--rf-accent-hover);
	color: var(--rf-bg);
}

/* --- Encarts totaux et paiement ------------------------------------------- */

body.rf-on .cart-sidebar,
body.rf-on #order_review,
body.rf-on .woocommerce-checkout-review-order {
	padding: clamp(22px, 4vw, 32px);
	background: var(--rf-bg-alt);
	border: 1px solid var(--rf-accent-line);
	border-radius: var(--rf-r-panel);
}

body.rf-on .cart_totals h2,
body.rf-on #order_review_heading,
body.rf-on .woocommerce-billing-fields h3,
body.rf-on .woocommerce-additional-fields h3 {
	font-family: var(--rf-serif);
	font-size: clamp(22px, 3vw, 28px);
	color: var(--rf-text);
}

body.rf-on .order-total .amount {
	font-family: var(--rf-serif);
	font-size: 24px;
	color: var(--rf-accent);
}

body.rf-on .wc_payment_methods {
	padding: 0;
	list-style: none;
	border: 0;
}

body.rf-on .wc_payment_method {
	padding: 14px 0;
	border-bottom: 1px solid var(--rf-line);
}

body.rf-on .wc_payment_method label {
	font-size: 15px;
	letter-spacing: normal;
	text-transform: none;
	color: var(--rf-text);
}

body.rf-on .payment_box {
	margin-top: 12px;
	padding: 16px 18px;
	background: var(--rf-bg);
	border: 1px solid var(--rf-line-strong);
	border-radius: var(--rf-r-field);
	color: var(--rf-text-muted);
	font-size: 14px;
}

body.rf-on .payment_box::before {
	display: none; /* la flèche blanche de Woo n'a plus lieu d'être */
}

/* --- Connexion / coupon --------------------------------------------------- */

body.rf-on .woocommerce-form-login,
body.rf-on .woocommerce-form-coupon,
body.rf-on .woocommerce-form-register {
	padding: clamp(20px, 4vw, 28px);
	background: var(--rf-bg-alt);
	border: 1px solid var(--rf-line-strong);
	border-radius: var(--rf-r-card);
}

body.rf-on .woocommerce-terms-and-conditions-wrapper {
	font-size: 14px;
	color: var(--rf-text-muted);
}

/* Le gabarit panier de Flatsome n'a que quatre colonnes d'en-tête pour six
   colonnes de contenu : sans largeurs explicites, la colonne du nom se retrouve
   écrasée à quelques pixels et le titre s'affiche à la verticale. */
body.rf-on .shop_table .product-remove    { width: 36px; }
body.rf-on .shop_table .product-thumbnail { width: 76px; }
body.rf-on .shop_table .product-name      { min-width: 150px; }

/* La colonne de droite est étroite : le tableau ne doit jamais déborder et
   passer sous le panneau des totaux. */
body.rf-on .cart-wrapper {
	max-width: 100%;
	overflow-x: auto;
}

body.rf-on .shop_table .product-price,
body.rf-on .shop_table .product-subtotal,
body.rf-on .shop_table td[data-title='Prix'],
body.rf-on .shop_table td[data-title='Sous-total'] {
	white-space: nowrap;
	text-align: right;
}

body.rf-on .shop_table th,
body.rf-on .shop_table td {
	padding: 16px 8px;
}

body.rf-on .shop_table .product-thumbnail img {
	width: 64px;
	height: 64px;
}

body.rf-on .shop_table .product-name a {
	font-size: 17px;
}

/* Le panneau intérieur des totaux ne doit pas redoubler le cadre extérieur. */
body.rf-on .cart_totals {
	padding: 0;
	background: transparent;
	border: 0;
}

body.rf-on .cart_totals table,
body.rf-on .cart_totals th,
body.rf-on .cart_totals td {
	background: transparent;
	border-color: var(--rf-line);
}

/* Bloc « commander » des pages activités */
.rf-commande {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr));
	gap: 18px;
	margin-top: 40px;
}

.rf-commande__item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
	padding: 28px 30px;
	background: var(--rf-bg-alt);
	border: 1px solid var(--rf-accent-line);
	border-radius: var(--rf-r-card);
}

.rf-commande__name {
	margin: 0;
	font-family: var(--rf-serif);
	font-size: clamp(19px, 2.6vw, 23px);
	line-height: 1.2;
	color: var(--rf-text);
}

.rf-commande__price {
	margin: 8px 0 0;
	font-size: 15px;
	color: var(--rf-accent);
}

.rf-commande__price .woocommerce-Price-amount,
.rf-commande__price bdi {
	color: inherit;
}

.rf-commande__price .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
}

.rf-commande__alt {
	margin: 26px 0 0;
	font-size: 15px;
	color: var(--rf-text-dim);
}

.rf-commande__alt .rf-link-underline {
	margin-left: 8px;
}

/* Barre de faits de la page Contact : une mention sous chaque valeur. */
.rf-facts__hint {
	display: block;
	margin-top: 8px;
	font-size: 13px;
	color: var(--rf-text-faint);
}

body.rf-on .rf-facts__value a,
body.rf-on .rf-facts__hint a {
	color: inherit;
	border-bottom: 1px solid var(--rf-accent-line);
}

body.rf-on .rf-facts__value a:hover,
body.rf-on .rf-facts__hint a:hover {
	color: var(--rf-accent);
}

.rf-facts--contact .rf-facts__item {
	align-self: start;
}

/* Aperçu de la carte cadeau */
.rf-carte-cadeau {
	display: grid;
	gap: 30px;
	align-content: space-between;
	min-height: clamp(240px, 34vw, 300px);
	padding: clamp(26px, 4vw, 36px);
	background: linear-gradient(150deg, var(--rf-bg-raised) 0%, var(--rf-bg-alt) 100%);
	border: 1px solid var(--rf-accent-line);
	border-radius: var(--rf-r-panel);
}

.rf-carte-cadeau__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
}

.rf-carte-cadeau__marque {
	font-size: 11px;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: var(--rf-text-muted);
}

.rf-carte-cadeau__tag {
	padding: 6px 13px;
	border-radius: var(--rf-r-pill);
	background: var(--rf-accent-soft);
	font-size: 10px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--rf-accent);
}

.rf-carte-cadeau__titre {
	margin: 0;
	font-family: var(--rf-serif);
	font-size: clamp(34px, 5vw, 48px);
	line-height: 1;
	color: var(--rf-text);
}

.rf-carte-cadeau__pied {
	display: flex;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
	padding-top: 22px;
	border-top: 1px solid var(--rf-line);
}

.rf-carte-cadeau__label {
	display: block;
	font-size: 10px;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--rf-text-faintest);
}

.rf-carte-cadeau__valeur {
	display: block;
	margin-top: 6px;
	font-family: var(--rf-serif);
	font-size: 19px;
	color: var(--rf-accent);
}