/**
 * Kookla v2 — Feuille de styles principale
 *
 * Ce fichier regroupe tous les styles développés dans le cadre
 * de la refonte v2 du site (espace B2C et espace Pro/Partenaires).
 *
 * Organisation :
 * 1. Variables CSS (design tokens)
 * 2. Reset / base
 * 3. Composants globaux (boutons, badges, forms...)
 * 4. Layout partagé (topbar, header, footer)
 * 5. Espace Pro — spécifique
 * 6. Espace B2C — spécifique
 */
/* =========================================================================
   0. Polices locales
   ========================================================================= */

/* Inter — normale */
@font-face {
    font-family: 'Inter';
    src: url('../fonts/Inter-VariableFont_opsz,wght.ttf') format('truetype');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

/* Inter — italique */
@font-face {
    font-family: 'Inter';
    src: url('../fonts/Inter-Italic-VariableFont_opsz,wght.ttf') format('truetype');
    font-weight: 100 900;
    font-style: italic;
    font-display: swap;
}

/* Noto Serif — normale */
@font-face {
    font-family: 'Noto Serif';
    src: url('../fonts/NotoSerif-VariableFont_wdth,wght.ttf') format('truetype');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

/* Noto Serif — italique */
@font-face {
    font-family: 'Noto Serif';
    src: url('../fonts/NotoSerif-Italic-VariableFont_wdth,wght.ttf') format('truetype');
    font-weight: 100 900;
    font-style: italic;
    font-display: swap;
}
/* =========================================================================
   1. Variables CSS
   ========================================================================= */

:root {
    /* Couleurs principales */
    --color-brand:#d4746c;
    --color-brand-rgb: 212, 116, 108;
    --color-brand-hover: #d67772;
    --color-brand-light: #f4d4d3;
    --color-brand-very-light: #f7efec;
    --color-white: #ffffff;
    --color-primary: #4c3f3f;
    --color-primary-rgb: 76, 63, 63;
    --color-beige-light: #f9f9f7;
    /* --color-beige-light: #fbfbf9; */
    --color-beige-dark: #f7f2ed;
    /* --color-beige-dark: #f5f1ed; */
    --color-beige-dark-rgb: 247, 242, 237;
    /* --color-beige-dark-rgb: 245, 241, 237; */
    --color-alert: #d9534f;
    --color-alert-rgb: 217, 83, 79;
    --color-alert-light: #f9d6d5;
    --color-green: #6cd3a0;
    --color-green-bg: #edf6f0;
    --color-green-badge: #77c19a;
    --color-kcoin: #856cd3;
    --color-blue-bg: #6ca0d3;
    --color-blue-bg-light: #7dbef4;
    --color-grey-bg: #d3d3d3;
    

    /* Typographie */
    --font-family: 'Inter', sans-serif;
    --font-family-serif: 'Noto Serif', serif;
    --font-size-xs: 1.2rem;
    --font-size-sm: 1.3rem;
    --font-size-base: 1.4rem;
    --font-size-lg: 1.5rem;
    --font-size-xl: 1.8rem;

    /* Bordures */
    --border-radius-sm: 0.4rem;
    --border-radius: 0.6rem;
    --border-radius-lg: 1rem;
    --border-radius-xl: 1.6rem;

    /* Ombres */  
    --shadow-sm: 0 1px 2px rgba(var(--color-beige-dark-rgb), 0.8);
    --shadow:    0 1px 3px rgba(var(--color-beige-dark-rgb), 0.8), 0 1px 2px rgba(var(--color-beige-dark-rgb), 0.6);

    /* Transitions */
    --transition: all 0.2s ease;

    /* Layout */
    --container-max-width: 1280px;
    --container-padding-x: 2rem;

  /* --- Breakpoints (référence — ne pas utiliser dans @media, CSS custom props non supportées) ---
   * sm  : 599px  — mobiles
   * md  : 768px  — tablettes portrait
   * lg  : 1024px — tablettes paysage / petits laptops
   * xl  : 1280px — desktop
   * 2xl : 1536px — grands écrans
   * ---------------------------------------------------------------- */

}
/* =========================================================================
   2. Reset / Base
   ========================================================================= */

html {
    font-size: 62.5%;
}

*, *::before, *::after {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: var(--font-family);
    font-size: var(--font-size-base);
    color: rgba(var(--color-primary-rgb), 0.9);
    background-color: var(--color-beige-light);
    -webkit-font-smoothing: antialiased;
}

a {
    color: inherit;
    text-decoration: none;
}

p {
    margin: 0;
    line-height: 1.7;
}

h1, h2, h3, h4, h5, h6 {
    margin: 0;
    font-family: var(--font-family-serif);
    font-weight: 600;
    line-height: 1.2;
    color: var(--color-brand);
}

ul, ol {
    margin: 0;
    padding: 0;
    list-style: none;
}

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

[tabindex="-1"]:focus {
    outline: none;
}
/* =========================================================================
   3. Composants globaux
   ========================================================================= */

/* --- Boutons --- */

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 1.2rem 2rem 1.3rem;
    font-size: var(--font-size-xs);
    font-weight: 600;
    border-radius: var(--border-radius);
    border: 1px solid transparent;
    cursor: pointer;
    transition: var(--transition);
    white-space: nowrap;
    transform: translateY(0);
}

.btn:focus-visible {
    outline: 2px solid var(--color-brand);
    outline-offset: 2px;
}

/* Bouton / lien non encore disponible */
.btn[aria-disabled="true"] {
    opacity: 0.45;
    cursor: not-allowed;
    pointer-events: none;
}

/* Bouton primaire (plein) */
.btn-primary {
    background-color: var(--color-brand);
    border-color: var(--color-brand);
    color: var(--color-white);
}

.btn-primary:hover {
    background-color: var(--color-brand-hover);
    border-color: var(--color-brand-hover);
    color: var(--color-white);
    transform: translateY(-2px);
    box-shadow: 0 4px 4px rgba(var(--color-brand-rgb), 0.1);
}

.btn-primary:active {
    transform: translateY(0);
    box-shadow: 0 4px 4px rgba(var(--color-brand-rgb), 0.1);
}

.header__cta-reserver {
    position: relative;
}

.header__cta-badge {
	position: absolute;
	top: -0.7rem;
	right: -0.7rem;
	display: none;
	align-items: center;
	justify-content: center;
	min-width: 1.8rem;
	height: 1.8rem;
	padding: 0 0.4rem;
	border-radius: 50%;
	background-color: var(--color-green-badge);
	color: var(--color-white);
	font-size: 0.9rem;
	font-weight: 700;
	line-height: 1;
}

.header__account-badge {
    position: absolute;
    top: -0.4rem;
    right: -0.4rem;
    display: none;
    align-items: center;
    justify-content: center;
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 50%;
    background-color: var(--color-green-badge);
    color: var(--color-white);
}

/* Bouton secondaire (contour) */
.btn-outline {
    position: relative;
    overflow: hidden;
    background-color: var(--color-beige-light);
    border-color: rgba(var(--color-brand-rgb), 0.3);
    color: rgba(var(--color-brand-rgb), 0.9);
}

.btn-outline:hover {
    border-color: rgba(var(--color-brand-rgb), 0.7);
    color: rgba(var(--color-brand-rgb), 1);
    transform: translateY(-2px);
    box-shadow: 0 4px 4px rgba(var(--color-brand-rgb), 0.1);
}

/* --- Champ de formulaire avec label flottant --- */

.form-field {
    position: relative;
    flex: 1;
}

.register-form__row.register-form__row--numero-rue .form-field:first-child {
    flex: 0 0 10rem;
}

.form-field input {
    width: 100%;
    height: 5.6rem;
    padding: 2rem 1.4rem 0.6rem;
    font-family: var(--font-family);
    font-size: var(--font-size-sm);
    color: var(--color-primary);
    background-color: var(--color-white);
    border: 1.5px solid var(--color-beige-dark);
    border-radius: var(--border-radius);
    outline: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    appearance: none;
}

.form-field input:focus {
    border-color: var(--color-brand);
    box-shadow: 0 0 0 3px rgba(var(--color-brand-rgb), 0.1);
}

.pbt-page.pbt-checkout .form-field input {
    border-color: rgba(var(--color-brand-rgb), 0.2);
}

.form-field label {
    position: absolute;
    top: 50%;
    left: 1.4rem;
    transform: translateY(-50%);
    font-size: var(--font-size-xs);
    color: rgba(var(--color-primary-rgb), 0.5);
    pointer-events: none;
    transition: top 0.18s ease, transform 0.18s ease, font-size 0.18s ease, color 0.18s ease;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: calc(100% - 2.8rem);
}

.form-field.form-field--radio-group .reg-toggle-group label {
	position: relative;
	top: initial;
	left: initial;
	transform: none;
	max-width: none;
    pointer-events: initial;
}

.form-field label abbr {
    text-decoration: none;
}

.form-field input:focus ~ label,
.form-field input:not(:placeholder-shown) ~ label {
    top: 1rem;
    transform: translateY(0);
    font-size: 1rem;
    color: var(--color-brand);
}

/* --- Select (genre, profession) dans le formulaire d'inscription --- */
.form-field--select select {
    width: 100%;
    height: 5.6rem;
    padding: 2rem 1.4rem 0.6rem;
    font-family: var(--font-family);
    font-size: var(--font-size-sm);
    color: var(--color-primary);
    background-color: var(--color-white);
    border: 1.5px solid var(--color-beige-dark);
    border-radius: var(--border-radius);
    outline: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 1.4rem center;
    cursor: pointer;
}

.form-field--select select:focus {
    border-color: var(--color-brand);
    box-shadow: 0 0 0 3px rgba(var(--color-brand-rgb), 0.1);
}

/* Un <select> n'a pas d'état :placeholder-shown : on garde le label en haut. */
.form-field--select label {
    top: 1rem;
    transform: translateY(0);
    font-size: 1rem;
}

.form-field--select select:focus ~ label {
    color: var(--color-brand);
}

/* --- Groupe oui/non (exerce une activité de lasériste) --- */
.form-field--radio-group {
    flex: 1;
}

.form-field__legend {
    display: block;
    font-size: var(--font-size-sm);
    color: var(--color-primary);
    margin-bottom: 1rem;
}

.form-field.form-field--radio-group .form-field__legend {
	display: block;
	font-size: var(--font-size-xs);
	color: var(--color-primary);
	margin-bottom: 0.6rem;
	font-weight: 500;
	margin-top: 1rem;
}

.reg-toggle-group {
    display: flex;
    gap: 1rem;
}

.reg-toggle-btn {
    position: relative;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 4.8rem;
    font-family: var(--font-family);
    font-size: var(--font-size-sm);
    color: var(--color-primary);
    background-color: var(--color-white);
    border: 1.5px solid var(--color-beige-dark);
    border-radius: var(--border-radius);
    cursor: pointer;
    transition: border-color 0.2s ease, background-color 0.2s ease, color 0.2s ease;
}

.reg-toggle-btn input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.reg-toggle-btn:has(input:checked) {
    border-color: var(--color-brand);
    background-color: rgba(var(--color-brand-rgb), 0.08);
    color: var(--color-brand);
    font-weight: 600;
}

/* ---  link-animated — soulignement depuis le centre --- */

.link-animated {
    position: relative;
}

/* Trait bilatéral */
.link-animated::before {
    content: '';
    position: absolute;
    bottom: -3px;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: currentColor;
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 0.3s ease 0.08s;
    pointer-events: none;
}

.link-animated:hover::before {
    transform: scaleX(1);
}


input[type="search"] {
    -moz-box-sizing: border-box!important;
    -webkit-box-sizing: border-box!important;
    box-sizing: border-box!important;
}


/* =========================================================================
   4. Layout partagé
   ========================================================================= */

/* --- Logo --- */

.logo {
    position: relative;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    width: fit-content;
}

.page-template-btoc .header .logo {
    top: -2px;
}

.logo svg {
    width: auto;
    fill: var(--color-brand);
}

.header__logo.logo--pro svg {
    height: 26px;
}

.header__action-icon {
    display: none;
}

.footer__logo.logo--pro svg {
    height: 34px;
}

.footer__logo {
    margin-bottom: 1.8rem;
}

.logo__label-pro {
    position: absolute;
    top: -1px;
    right: -3px;
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.1px;
    color: var(--color-brand);
    text-transform: uppercase;
}

.footer__logo .logo__label-pro {
    top: 0;
    right: -2px;
    font-size: 0.9rem;
}

.reg-header__logo[aria-disabled="true"] {
    pointer-events: none;
}

/* --- Header --- */

.header {
    position: sticky;
    top: 0;
    z-index: 10;
    padding: 1.4rem 0;
    background-color: var(--color-beige-light);
    border: 0 solid transparent;
    transition: border 0.2s ease;
}

.header--scrolled {
    /* border-bottom: 1px solid var(--color-beige-dark); */
    box-shadow: 0 4px 10px rgba(var(--color-primary-rgb), 0.05);
}

.header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-x);
    height: 100%;
}

.header__right {
    display: flex;
    align-items: center;
    gap: 3.2rem;
}

.header__nav {
    display: flex;
    align-items: center;
    gap: 3.2rem;
}

.header__nav-link {
    font-weight: 500;
    transition: var(--transition);
    white-space: nowrap;
    font-size: var(--font-size-sm);
}

.header__nav-link:hover,
.header__nav-link:focus-visible {
    color: var(--color-brand);
}

.header__actions {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-shrink: 0;
}

.header__left {
	display: none;
}

.header__burger {
	display: none;
	flex-direction: column;
	justify-content: center;
	gap: 0.4rem;
	width: 2.4rem;
	height: 2.4rem;
	padding: 0;
	border: none;
	background: none;
	cursor: pointer;
	flex-shrink: 0;
}

.header__burger-bar {
	display: block;
	width: 100%;
	height: 2px;
	background-color: var(--color-brand);
	border-radius: 2px;
	transition: var(--transition);
}

.header__burger.is-open .header__burger-bar:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.header__burger.is-open .header__burger-bar:nth-child(2) {
    opacity: 0;
}

.header__burger.is-open .header__burger-bar:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

.header__mobile-menu {
    display: none;
}

/* --- Footer --- */

.footer {
    background-color: var(--color-beige-dark);
}

.footer__main {
    padding: 12rem 0 10rem;
}

.footer__inner {
    display: flex;
    align-items: flex-start;
    width: 100%;
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-x);
}

.footer__brand {
    display: flex;
    flex-direction: column;
    flex: 0 0 26rem;
}

.footer__desc {
    font-family: var(--font-family-serif);
    font-weight: 500;
    color: var(--color-brand);
    margin-bottom: 2rem;
    font-size: var(--font-size-sm);
}

.footer__social {
    display: flex;
    gap: 1rem;
}

.footer__social-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 4rem;
    height: 4rem;
    border-radius: 50%;
    border: 1px solid var(--color-brand);
    color: var(--color-brand);
    transition: var(--transition);
}

.footer__social-link:hover {
    transform: translateY(-4px);
}

.footer__social-link svg {
    width: 15px;
    height: 15px;
    fill: currentColor;
}

.footer__nav {
    display: flex;
    gap: 8rem;
    flex: 1;
    justify-content: flex-end;
}

.footer__col {
    display: flex;
    flex-direction: column;
}

.footer__col-title {
    font-size: 1.6rem;
    font-weight: 600;
    margin-bottom: 1.6rem;
}

.footer__col ul {
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
}

.footer__col ul li a {
    color: rgba(var(--color-primary-rgb), 0.8);
    transition: var(--transition);
    font-size: var(--font-size-sm);
}

.footer__col ul li a:hover {
    color: var(--color-brand);
}

.footer__col-text {
    position: relative;
    top: -2.5px;
    color: rgba(var(--color-primary-rgb), 0.8);
    max-width: 260px;
    margin-bottom: 1rem;
    font-size: var(--font-size-sm);
}

.footer__col-text + .btn {
    width: fit-content;
}

.footer__visual {
    position: relative;
    padding: 3rem 0;
}

.footer__visual-bg {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    user-select: none;
}

.footer__visual-bg svg {
    height: 100%;
    width: auto;
    fill: var(--color-brand);
    opacity: 0.05;
}

.footer__visual-content {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.2rem;
}

.footer__visual-svg {
    width: 90px;
    height: auto;
    fill: none;
    stroke: var(--color-brand);
    stroke-linecap: round;
    stroke-width: .8px;
}

@keyframes pictolaser-envol {
    0%   { stroke-dashoffset: 0; opacity: 1; }
    45%  { stroke-dashoffset: 20; opacity: 0; }
    46%  { stroke-dashoffset: 0; opacity: 0; }
    100% { stroke-dashoffset: 0; opacity: 1; }
}

.pictolaser-animate {
    stroke-dasharray: 20;
    stroke-dashoffset: 0;
    animation: pictolaser-envol 3.5s ease-in-out infinite;
}

@keyframes pictolaser-envol-reverse {
    0%   { stroke-dashoffset: 0; opacity: 1; }
    45%  { stroke-dashoffset: -20; opacity: 0; }
    46%  { stroke-dashoffset: 0; opacity: 0; }
    100% { stroke-dashoffset: 0; opacity: 1; }
}

.pictolaser-animate-reverse {
    stroke-dasharray: 20;
    stroke-dashoffset: 0;
    animation: pictolaser-envol-reverse 3.5s ease-in-out infinite;
}

@keyframes pictolaser-pulse {
    0%   { transform: scale(1); opacity: 1; }
    50%  { transform: scale(0.6); opacity: 0; }
    100% { transform: scale(1); opacity: 1; }
}

.pictolaser-pulse {
    transform-box: fill-box;
    transform-origin: center;
    animation: pictolaser-pulse 3.5s ease-in-out infinite;
}

.footer__tagline {
    font-family: var(--font-family-serif);
    font-size: 1.8rem;
    font-style: italic;
    color: var(--color-brand);
}

.footer__btoc-cta {
    background: var(--color-brand);
    padding: 2.4rem 0;
}

.page-template-page-mon-compte-pro .footer__btoc-cta {
    display: none;
}

.footer__btoc-cta .footer__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2.4rem;
    flex-wrap: wrap;
}

.footer__btoc-cta__text {
    color: #fff;
    font-size: var(--font-size-sm);
    font-weight: 500;
    margin: 0;
}

.footer__btoc-cta__btn {
    background: #fff;
    color: var(--color-brand);
}

.footer__btoc-cta__btn:hover {
    background: var(--color-brand-very-light);
    color: var(--color-brand);
}

@media (max-width: 600px) {
    .footer__btoc-cta .footer__inner {
        flex-direction: column;
        align-items: flex-start;
    }
}

.footer__copyright {
    padding: 2rem 0;
    text-align: center;
}

.footer__copyright p {
    font-size: var(--font-size-xs);
    font-weight: 500;
    color: var(--color-brand);
}

/* =========================================================================
   5. Espace Pro — spécifique
   ========================================================================= */

/* --- Hero homepage bicolore --- */

.hero-home-pro {
    display: flex;
    min-height: calc(100vh - 66px);
}

.hero-home-pro__left {
    flex: 1;
    background-color: var(--color-beige-dark);
    display: flex;
    justify-content: center;
}

.hero-home-pro__left-inner {
    width: 100%;
    max-width: 50rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.hero-home-pro__right {
    flex: 1;
    background-color: var(--color-beige-light);
    display: flex;
    justify-content: center;
}

.hero-home-pro__right-inner {
    width: 100%;
    max-width: 500px;
    display: flex;
    align-items: center;
}
/* --- Section « Pourquoi Kookla » --- */

.why-home-pro {
    padding: 12rem 0;
    background-color: var(--color-white);
}

.why-home-pro__inner {
    display: flex;
    width: 100%;
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-x);
}

.why-home-pro__left {
    flex: 1;
}

.why-home-pro__sticky {
    position: sticky;
    top: calc(66px + 6rem);
}

.why-home-pro__title {
    font-size: 5.4rem;
    font-weight: 300;
    line-height: 1.35;
    padding-right: 5rem;
}

.why-home-pro__list {
    flex: 1;
    display: flex;
    flex-direction: column;
    border-left: 1.5px solid var(--color-beige-dark);
}

.why-home-pro__item {
    display: flex;
    align-items: center;
    gap: 2.4rem;
    padding: 8rem 0;
}

.why-home-pro__item + .why-home-pro__item {
    border-top: 1.5px solid var(--color-beige-dark);
}

.why-home-pro__icon {
    position: relative;
    flex-shrink: 0;
    width: 6.4rem;
    height: 6.4rem;
    margin-left: 6rem;
    border-radius: 50%;
    background-color: var(--color-beige-light);
    border: 1.5px solid var(--color-beige-dark);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
}

.why-home-pro__icon::before {
    content: '';
    position: absolute;
    right: 100%;
    top: 50%;
    transform: translateY(-50%);
    width: 0;
    height: 1.5px;
    background-color: var(--color-beige-dark);
    transition: width 0.6s ease 0.3s; /* 0.3s de délai pour démarrer après le fade-up */
}

.why-home-pro__icon.is-visible::before {
    width: 6rem;
}

.why-home-pro__icon img {
    height: auto;
}

.icon-pin,
.icon-calendar {
    width: 26px;
}

.icon-lock {
    width: 20px;
}

.icon-handshake {
    width: 36px;
    position: relative;
    top: 2px;
}

.icon-loyalty {
    width: 28px;
}

.why-home-pro__content {
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
}

.why-home-pro__item-title {
    font-size: 2.2rem;
    font-weight: 400;
    margin-bottom: 1.4rem;
}

/* ----- Section 3 : Marché ------------------------------------------------ */

.market-home-pro {
    background-color: var(--color-beige-light);
    padding: 10rem 0;
}

.market-home-pro__inner {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-x);
    display: flex;
    flex-direction: column;
    align-items: center;
}

.market-home-pro__icon-circle {
    position: relative;
    width: 6.4rem;
    height: 6.4rem;
    border-radius: 50%;
    background-color: var(--color-white);
    border: 1.5px solid var(--color-beige-dark);
    overflow: visible;
    margin-bottom: 2rem;
    box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
}

.market-home-pro__icon-circle svg {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 8rem;
	height: auto;
}

.market-graph-st0 {
    fill: none;
    stroke: var(--color-brand);
    stroke-width: .6px;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.market-graph-st1 {
    fill: none;
    stroke: var(--color-brand);
    stroke-width: .6px;
    stroke-miterlimit: 10;
}

/* --- Animation graphique market --- */

/* État initial : éléments masqués */
.market-home-pro__icon-circle .mg-l1,
.market-home-pro__icon-circle .mg-l2,
.market-home-pro__icon-circle .mg-l3,
.market-home-pro__icon-circle .mg-l4,
.market-home-pro__icon-circle .mg-l5,
.market-home-pro__icon-circle .mg-arrow {
    stroke-dasharray: 50;
    stroke-dashoffset: 50;
    opacity: 0;
}

.market-home-pro__icon-circle .mg-c1,
.market-home-pro__icon-circle .mg-c2,
.market-home-pro__icon-circle .mg-c3,
.market-home-pro__icon-circle .mg-c4 {
    opacity: 0;
    transform-box: fill-box;
    transform-origin: center;
}

/* Keyframes */
@keyframes mg-line-draw {
    from {
        stroke-dashoffset: 50;
        opacity: 0;
    }
    15% {
        opacity: 1;
    }
    to {
        stroke-dashoffset: 0;
        opacity: 1;
    }
}

@keyframes mg-circle-pop {
    0%   { opacity: 0; transform: scale(0);   }
    55%  { opacity: 1; transform: scale(1.25); }
    100% { opacity: 1; transform: scale(1);   }
}

/* Déclenchement quand is-visible */
.market-home-pro__icon-circle.is-visible .mg-l1    { animation: mg-line-draw   0.40s  0.00s both; }
.market-home-pro__icon-circle.is-visible .mg-c1    { animation: mg-circle-pop  0.30s  0.35s both; }
.market-home-pro__icon-circle.is-visible .mg-l2    { animation: mg-line-draw   0.35s  0.60s both; }
.market-home-pro__icon-circle.is-visible .mg-c2    { animation: mg-circle-pop  0.30s  0.90s both; }
.market-home-pro__icon-circle.is-visible .mg-l3    { animation: mg-line-draw   0.40s  1.15s both; }
.market-home-pro__icon-circle.is-visible .mg-c3    { animation: mg-circle-pop  0.30s  1.50s both; }
.market-home-pro__icon-circle.is-visible .mg-l4    { animation: mg-line-draw   0.25s  1.75s both; }
.market-home-pro__icon-circle.is-visible .mg-c4    { animation: mg-circle-pop  0.30s  1.95s both; }
.market-home-pro__icon-circle.is-visible .mg-l5    { animation: mg-line-draw   0.45s  2.20s both; }
.market-home-pro__icon-circle.is-visible .mg-arrow { animation: mg-line-draw   0.20s  2.60s both; }

.market-home-pro__title {
	font-size: 5rem;
	font-weight: 300;
	text-align: center;
	max-width: 75rem;
	line-height: 1.35;
	margin-bottom: 6rem;
}

.market-home-pro__stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2.4rem;
    width: 100%;
    margin-bottom: 7rem;
}

.market-home-pro__stat-wrap {
    display: flex;
    flex-direction: column;
    gap: 1.6rem;
}

.market-home-pro__stat {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    flex: 1;
    padding: 5.2rem 2.4rem;
    text-align: center;
    background-color: var(--color-white);
    border: 1.5px solid var(--color-beige-dark);
    border-radius: var(--border-radius);
    box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
}

.market-home-pro__stat-value {
    display: flex;
    justify-content: center;
    font-family: var(--font-family-serif);
    font-size: 10rem;
    font-weight: 300;
    line-height: 1;
    color: var(--color-brand);
}

.market-home-pro__stat-value-pre-number {
    font-size: 7rem;
    align-self: center;
}

.market-home-pro__stat-value sup {
    padding-top: 2rem;
    font-size: 0.25em;
    font-weight: 500;
    color: var(--color-brand);
}

.market-home-pro__stat-wrap:last-of-type .market-home-pro__stat sup {
    font-size: 0.35em;
}

.market-home-pro__stat-label {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-brand);
}

.market-home-pro__stat-note {
    font-family: var(--font-family-serif);
    color: var(--color-brand);
    text-align: center;
    font-size: var(--font-size-lg);
    font-style: italic;
}

.market-home-pro__quote {
	font-family: var(--font-family-serif);
	font-size: 3rem;
	font-weight: 300;
	text-align: center;
	max-width: 78rem;
	line-height: 1.45;
	color: var(--color-brand);
	margin-bottom: 2rem;
}

.market-home-pro__connector {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 1rem;
}

.market-home-pro__connector-line {
    display: block;
    width: 1.5px;
    height: 0;
    background-color: var(--color-beige-dark);
    transition: height 0.6s ease;
}

.market-home-pro__connector.is-visible .market-home-pro__connector-line {
    height: 6rem;
}

.market-home-pro__bulb {
    width: 6.4rem;
    height: 6.4rem;
    border-radius: 50%;
    background-color: var(--color-white);
    border: 1.5px solid var(--color-beige-dark);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
}

.market-home-pro__bulb img {
    width: 3rem;
    height: auto;
}

.market-home-pro__conclusion {
	font-family: var(--font-family-serif);
	font-size: 4rem;
	font-weight: 300;
	text-align: center;
	max-width: 92rem;
	line-height: 1.45;
	color: var(--color-brand);
}

/* ----- Section 4 : Rejoindre Kookla en 4 étapes ------------------------------------------------ */

.steps-home-pro {
    padding: 10rem 0;
    background-color: var(--color-white);
}

.steps-home-pro__inner {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-x);
    display: flex;
    flex-direction: column;
    align-items: center;
}

.steps-home-pro__title {
    font-size: 4.2rem;
    font-weight: 300;
    text-align: center;
    margin-bottom: 7rem;
    line-height: 1.35;
}

.steps-home-pro__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2.4rem;
    width: 100%;
    margin-bottom: 5rem;
    padding-top: 3rem;
}

.steps-home-pro__item {
    position: relative;
    background-color: var(--color-beige-light);
    border: 1.5px solid var(--color-beige-dark);
    border-radius: var(--border-radius);
    padding: 5rem 3.4rem 4rem;
    text-align: center;
    box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
}

.steps-home-pro__number {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 6rem;
    height: 6rem;
    border-radius: 50%;
    background-color: var(--color-beige-light);
    border: 1.5px solid var(--color-beige-dark);
    color: var(--color-brand);
    font-family: var(--font-family-serif);
    font-size: 2.2rem;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    z-index: -1;
}

@keyframes steps-number-pop {
    0%   { transform: translate(-50%, 10%);  }
    55%  { transform: translate(-50%, -120%); }
    100% { transform: translate(-50%, -50%); }
}

.steps-home-pro__item.is-visible .steps-home-pro__number {
    z-index: 1;
    animation: steps-number-pop 0.75s cubic-bezier(0.33, 1, 0.68, 1) both;
}

.steps-home-pro__item-title {
    font-size: var(--font-size-lg);
    font-weight: 600;
    color: var(--color-brand);
    margin: 0 0 1.2rem;
    line-height: 1.3;
}

.steps-home-pro__cta {
    display: flex;
    justify-content: center;
}

/* ----- Section 5 : Créneaux dédiés ------------------------------------------------ */

.slots-cross-path {
    fill: none;
    stroke: var(--color-brand);
    stroke-miterlimit: 10;
    stroke-width: .6px;
}

.slots-home-pro__col--no .slots-home-pro__bubble svg {
    width: 20px;
    height: 20px;
}

.slots-home-pro__col--yes .slots-home-pro__bubble svg {
    width: 24px;
    height: 20px;
}

.slots-check-path {
    fill: none;
    stroke: var(--color-brand);
    stroke-miterlimit: 10;
    stroke-width: .6px;
}

.slots-thumb-path {
    fill: none;
    stroke: var(--color-brand);
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: .6px;
}

.slots-home-pro {
    background-color: var(--color-beige-dark);
    padding: 10rem 0;
}

.slots-home-pro__inner {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-x);
    display: flex;
    flex-direction: column;
    align-items: center;
}

.slots-home-pro__suptitle,
.booking-home-pro__suptitle,
.guides-home-pro__suptitle,
.contact-home-pro__suptitle,
.guides-aide-pro__suptitle,
.guide-single-pro__suptitle,
.legal-pro__suptitle,
.commission-tarifs-pro__suptitle {
    position: relative;
    font-size: 1.1rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin-bottom: 4rem;
}

.slots-home-pro__suptitle::after,
.booking-home-pro__suptitle::after,
.guides-home-pro__suptitle::after,
.contact-home-pro__suptitle::after,
.guides-aide-pro__suptitle::after,
.guide-single-pro__suptitle::after,
.legal-pro__suptitle::after,
.commission-tarifs-pro__suptitle::after {
    content: '';
    position: absolute;
    bottom: -12px;
    left: 50%;
    transform: translateX(-50%);
    width: 20px;
    height: 1.5px;
    background-color: var(--color-primary);
}

.slots-home-pro__title {
    font-size: 5rem;
    font-weight: 300;
    text-align: center;
    margin-bottom: 5rem;
}

.slots-home-pro__compare {
    position: relative;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    width: 100%;
    padding-bottom: 10rem;
}

.slots-home-pro__compare::before {
    content: '';
    position: absolute;
    top: 3.2rem;
    left: 50%;
    transform: translateX(-50%);
    right: 0;
    width: 0;
    height: 1.5px;
    background-color: var(--color-brand-light);
    z-index: 0;
}

.slots-home-pro__compare.is-visible::before {
    width: 50%;
    transition: width 3s ease;
}

.slots-home-pro__sep {
    position: relative;
    z-index: 1;
    width: 1.5px;
    height: 0;
    align-self: stretch;
    background-color: var(--color-brand-light);
    margin: 0 4rem;
}

.slots-home-pro__sep.is-visible {
    height: calc(100% + 10rem);
    transition: height 3s ease;
}

.slots-home-pro__col {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.slots-home-pro__bubble {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 6.4rem;
    height: 6.4rem;
    border-radius: 50%;
    background-color: var(--color-white);
    border: 1.5px solid var(--color-brand-light);
    flex-shrink: 0;
    margin-bottom: 0;
    box-shadow: 4px 4px 10px rgba(var(--color-brand-rgb), 0.1);
}

.slots-home-pro__col-join {
    display: block;
    width: 1.5px;
    height: 0;
    background-color: var(--color-brand-light);
    flex-shrink: 0;
}

.slots-home-pro__col-join.is-visible {
    height: 3.2rem;
    transition: height 3s ease;
}

.slots-home-pro__col-title {
    font-family: var(--font-family-serif);
    font-size: 2.2rem;
    font-weight: 400;
    color: var(--color-brand);
    text-align: center;
    margin: 1rem 0 2.4rem;
}

.slots-home-pro__col-title strong {
    font-weight: 700;
    color: var(--color-primary);
}

.slots-home-pro__list {
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
    width: 100%;
}

.slots-home-pro__list li {
    text-align: center;
    padding: 2rem 2.6rem;
    background-color: var(--color-white);
    border-radius: var(--border-radius);
    box-shadow: 4px 4px 10px rgba(var(--color-brand-rgb), 0.1);
}

.slots-home-pro__bottom {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

.slots-home-pro__thumb-circle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 6.4rem;
    height: 6.4rem;
    border-radius: 50%;
    background-color: var(--color-white);
    border: 1px solid var(--color-brand-light);
    flex-shrink: 0;
    margin-bottom: 1.2rem;
    box-shadow: 4px 4px 10px rgba(var(--color-brand-rgb), 0.1);
}

.slots-home-pro__thumb-circle svg {
    width: 28px;
    height: auto;
}

.slots-home-pro__thumb-text {
    font-family: var(--font-family-serif);
    font-size: 2.2rem;
    text-align: center;
    color: var(--color-brand);
    margin-bottom: 0;
}

.slots-home-pro__fork {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 1rem 0;
}

.slots-home-pro__fork-line {
    display: block;
    width: 1.5px;
    height: 0;
    background-color: var(--color-brand-light);
}

.slots-home-pro__fork.is-visible .slots-home-pro__fork-line {
    height: 10rem;
    transition: height 2s ease;
}

.slots-home-pro__fork-bar {
    display: block;
    width: 40px;
    height: 1.5px;
    background-color: var(--color-brand-light);
    transform: scaleX(0);
    transform-origin: center;
}

.slots-home-pro__fork.is-visible .slots-home-pro__fork-bar {
    transform: scaleX(1);
    transition: transform 2s ease;
}

.slots-home-pro__conclusion {
    font-family: var(--font-family-serif);
    font-size: 4rem;
    font-weight: 300;
    text-align: center;
    line-height: 1.45;
    color: var(--color-brand);
}
/* ----- Section 6 : Interface de réservation ------------------------------------------------ */

.booking-conv-st0 {
    fill: none;
    stroke: var(--color-brand);
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: .5px;
}

.booking-conv-st1 {
    fill: none;
    stroke: var(--color-brand);
    stroke-miterlimit: 10;
    stroke-width: .5px;
}

.booking-home-pro {
    background-color: var(--color-white);
    padding: 10rem 0 12rem;
}

.booking-home-pro__inner {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-x);
    display: flex;
    flex-direction: column;
    align-items: center;
}

.booking-home-pro__title {
    font-size: 5rem;
    font-weight: 300;
    text-align: center;
    line-height: 1.35;
    max-width: 78rem;
    margin-bottom: 6rem;
}

.booking-home-pro__steps {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2.4rem;
    width: 100%;
    max-width: 94rem;
    margin-bottom: 4rem;
}

.booking-home-pro__step {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.booking-home-pro__step-bubble {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 4rem;
    height: 4rem;
    border-radius: 50%;
    background-color: var(--color-brand);
    color: var(--color-white);
    font-family: var(--font-family-serif);
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 1;
    flex-shrink: 0;
    margin-bottom: 1rem;
    box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
}

.booking-home-pro__step-title {
    font-family: var(--font-family);
    font-size: var(--font-size-base);
    font-weight: 500;
    text-align: center;
    margin-bottom: 3rem;
}

@keyframes booking-float {
    0%, 100% { transform: translateY(0);      box-shadow: 0 4px 16px rgba(var(--color-beige-dark-rgb), 0.5); }
    50%       { transform: translateY(-1rem);  box-shadow: 0 14px 28px rgba(var(--color-beige-dark-rgb), 0.7); }
}

.booking-home-pro__step-img-wrap {
    width: 100%;
    border-radius: var(--border-radius-xl);
    border: 1.5px solid var(--color-beige-dark);
    overflow: hidden;
    animation: booking-float 4s ease-in-out infinite;
}

/* Décalage pour que les 3 cartes ne flottent pas en phase */
.booking-home-pro__step:nth-child(2) .booking-home-pro__step-img-wrap { animation-delay: -1.3s; }
.booking-home-pro__step:nth-child(3) .booking-home-pro__step-img-wrap { animation-delay: -2.6s; }

.booking-home-pro__step-img {
    width: 100%;
    height: auto;
    display: block;
}

.booking-home-pro__tagline {
    font-family: var(--font-family-serif);
    font-size: 2.2rem;
    text-align: center;
    color: var(--color-brand);
}

.booking-home-pro__connector {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 2rem 0;
}

.booking-home-pro__connector-line {
    display: block;
    width: 1.5px;
    height: 0;
    background-color: var(--color-beige-dark);
}

.booking-home-pro__connector-line.is-visible {
    height: 5rem;
    transition: height 2s ease;
}

.booking-home-pro__connector-bubble {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 6.4rem;
    height: 6.4rem;
    border-radius: 50%;
    background-color: var(--color-beige-light);
    border: 1.5px solid var(--color-beige-dark);
    flex-shrink: 0;
    box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
}

.booking-home-pro__connector-bubble svg {
    width: 28px;
    height: auto;
}

.booking-home-pro__conclusion {
    font-family: var(--font-family-serif);
    font-size: 4.6rem;
    font-weight: 300;
    text-align: center;
    color: var(--color-brand);
}
/* ----- Section 7 : Guides pratiques ------------------------------------------------ */

.g-st0 {
    fill: none;
    stroke: var(--color-brand);
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: .6px;
}

.g-st1 {
    fill: none;
    stroke: var(--color-brand);
    stroke-miterlimit: 10;
    stroke-width: .6px;
}

.g-fill {
    fill: var(--color-brand);
}

.guides-home-pro {
    background-color: var(--color-beige-light);
    padding: 10rem 0 12rem;
}

.guides-home-pro__inner {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-x);
    display: flex;
    flex-direction: column;
    align-items: center;
}

.guides-home-pro__title {
    font-size: 5rem;
    font-weight: 300;
    text-align: center;
    line-height: 1.35;
    max-width: 60rem;
    margin-bottom: 5rem;
}

.guides-home-pro__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6rem 3rem;
    width: 100%;
    padding-top: 3.2rem;
    margin-bottom: 5rem;
}

.guides-home-pro__card {
    position: relative;
    background-color: var(--color-white);
    border: 1.5px solid var(--color-beige-dark);
    border-radius: var(--border-radius);
    padding: 6rem 4rem 5rem;
    box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
}

.guides-home-pro__card-bubble {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 6.4rem;
    height: 6.4rem;
    border-radius: 50%;
    background-color: var(--color-white);
    border: 1.5px solid var(--color-beige-dark);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    z-index: -1;
}

.guides-home-pro__card.is-visible .guides-home-pro__card-bubble {
    z-index: 1;
    animation: steps-number-pop 0.75s cubic-bezier(0.33, 1, 0.68, 1) both;
}

.guides-home-pro__card-body {
    display: flex;
    flex-direction: column;
}

.guides-home-pro__card-title {
    font-family: var(--font-family-serif);
    font-size: 1.7rem;
    font-weight: 500;
    color: var(--color-brand);
    text-align: center;
}

.guides-home-pro__card-desc {
    margin: 2rem 0 1.2rem;
}

.guides-home-pro__card-nav {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.guides-home-pro__card-nav li {
    display: flex;
    align-items: baseline;
    padding: 0.3rem 0;
    transition: color 0.15s ease;
}

.guides-home-pro__card-nav li:hover {
    color: var(--color-brand);
}

.guides-home-pro__card-nav-num {
    flex-shrink: 0;
    font-weight: 500;
    color: var(--color-brand);
    min-width: 1.8rem;
}

.guides-home-pro__cta {
    display: flex;
    justify-content: center;
}
/* ----- Section 8 : FAQ --------------------------------------------------- */

.faq-home-pro {
    padding: 12rem 0;
}

.faq-home-pro__inner {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-x);
    display: flex;
}

.faq-home-pro__left {
    width: 30%;
}

.faq-home-pro__sticky {
    position: sticky;
    top: 10rem;
}

.faq-home-pro__title {
    font-size: 12rem;
    font-weight: 300;
}

.faq-home-pro__list {
    width: 70%;
    display: flex;
    flex-direction: column;
}

.faq-home-pro__item {
    padding: 3.4rem 0 2.45rem;
    border-bottom: 1.5px solid rgba(var(--color-primary-rgb), 0.1);
}

.faq-home-pro__item:first-child {
    border-top: 1.5px solid rgba(var(--color-primary-rgb), 0.1);
}

.faq-home-pro__question {
    display: flex;
    padding: 0;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    gap: 2.4rem;
    background: none;
    border: none;
    cursor: pointer;
    text-align: left;
}

.faq-home-pro__question-text {
    font-family: var(--font-family-serif);
    font-size: 2rem;
    color: var(--color-brand);
    flex: 1;
}

.faq-home-pro__cross {
    flex-shrink: 0;
    display: block;
    color: var(--color-brand);
    transform: rotate(0deg);
    transform-origin: center;
    transition: transform 0.25s ease;
}

.faq-home-pro__cross line {
    stroke: currentColor;
    stroke-width: 1.3;
}

.faq-home-pro__item.is-open .faq-home-pro__cross {
    transform: rotate(45deg);
    transition: none;
}

@keyframes faq-cross-open {
    0%   { transform: rotate(0deg);   }
    65%  { transform: rotate(720deg); animation-timing-function: cubic-bezier(0, 0.6, 0.4, 1); }
    100% { transform: rotate(765deg); }
}

@keyframes faq-cross-close {
    0%   { transform: rotate(765deg); }
    100% { transform: rotate(0deg);   }
}

.faq-home-pro__cross.is-animating-open {
    animation: faq-cross-open 1s cubic-bezier(0.55, 0, 0.1, 1) forwards;
    transition: none;
}

.faq-home-pro__cross.is-animating-close {
    animation: faq-cross-close 0.3s cubic-bezier(0.55, 0, 0.1, 1) forwards;
    transition: none;
}

.faq-home-pro__answer {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.45s ease-in-out;
}

.faq-home-pro__item.is-open .faq-home-pro__answer {
    grid-template-rows: 1fr;
}

.faq-home-pro__answer-inner {
    overflow: hidden;
    min-height: 0;
    padding: 1rem 8rem 0 0;
}
/* ----- Section 9 : Contact ----------------------------------------------- */

.contact-home-pro {
    background-color: var(--color-white);
    padding: 10rem 0 12rem;
}

.page-template-page-aide-btoc .contact-home-pro {
    background-color: var(--color-white);
}

.page-template-page-aide-btoc .contact-home-pro .contact-home-pro__choice-btn {
    box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
}

.contact-home-pro__inner {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-x);
    display: flex;
    flex-direction: column;
    align-items: center;
}

.contact-home-pro__title {
    font-size: 5rem;
    font-weight: 300;
    text-align: center;
    margin-bottom: 5rem;
}

.contact-home-pro__prompt {
    font-family: var(--font-family-serif);
    font-size: 1.6rem;
    font-style: italic;
    text-align: center;
    color: var(--color-brand);
    margin-bottom: 0;
}

.contact-home-pro__choice {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.6rem;
    width: 100%;
    max-width: 50rem;
}

.contact-home-pro__btns {
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
    width: 100%;
}

.contact-home-pro__choice-btn {
	position: relative;
	flex: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 1rem;
	padding: 1.6rem 2rem;
	font-family: var(--font-family);
	font-size: var(--font-size-sm);
	font-weight: 500;
	border-radius: var(--border-radius);
	border: 1.5px solid var(--color-beige-dark);
	background-color: var(--color-white);
	color: rgba(var(--color-primary-rgb), 0.9);
	cursor: pointer;
	text-decoration: none;
	transition: var(--transition);
	white-space: nowrap;
    box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
}

.page-template-page-aide-btoc .contact-home-pro__choice-btn {
    background-color: var(--color-beige-light);
}

.contact-home-pro__choice-btn svg {
    position: absolute;
    right: 2rem;
    flex-shrink: 0;
    fill: none;
    stroke: currentColor;
    stroke-width: 0.8px;
    width: 15px;
    height: 10px;
    transform: translateX(0);
    transition: transform 0.3s ease;
}

.contact-home-pro__choice-btn:hover {
    border-color: var(--color-brand-hover);
    color: var(--color-brand);
}

.contact-home-pro__choice-btn:hover svg {
    transform: translateX(4px);
}

.contact-home-pro__form-wrap {
    width: 100%;
    max-width: 74rem;
    display: flex;
    flex-direction: column;
    gap: 1.6rem;
}

.contact-home-pro__form {
    display: flex;
    flex-direction: column;
}

.contact-home-pro__form-row {
    display: flex;
    gap: 1.2rem;
    margin-bottom: 1.2rem;
}

.contact-home-pro__slots {
    border: 1px solid var(--color-beige-dark);
    border-radius: var(--border-radius);
    padding: 2.7rem 4rem 3.2rem;
    background-color: var(--color-white);
    margin: 0 0 1rem;
}

.contact-home-pro__hp {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
}

.contact-home-pro__slots-title {
    font-weight: 500;
    margin-bottom: 1.6rem;
}

.contact-home-pro__slots-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.8rem 2rem;
}

.contact-home-pro__slot-option {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    cursor: pointer;
    transition: color 0.15s ease;
    user-select: none;
    padding: 0.3rem 0;
}

.contact-home-pro__slot-option:hover {
    color: var(--color-primary);
}

.contact-home-pro__slot-radio {
    position: absolute;
    opacity: 0;
    pointer-events: none;
    width: 0;
    height: 0;
}

.contact-home-pro__slot-indicator {
    flex-shrink: 0;
    position: relative;
    width: 1.7rem;
    height: 1.7rem;
    border: 1px solid var(--color-brand-light);
    border-radius: 0.2rem;
    background-color: var(--color-white);
    transition: border-color 0.15s ease;
}

.contact-home-pro__slot-indicator::after {
    content: '';
    position: absolute;
    inset: 4px;
    background-color: var(--color-brand);
    border-radius: 1px;
    opacity: 0;
    transition: opacity 0.15s ease;
}

.contact-home-pro__slot-radio:checked + .contact-home-pro__slot-indicator {
    border-color: var(--color-brand);
}

.contact-home-pro__slot-radio:checked + .contact-home-pro__slot-indicator::after {
    opacity: 1;
}

.contact-home-pro__slot-radio:focus-visible + .contact-home-pro__slot-indicator {
    outline: 2px solid var(--color-brand);
    outline-offset: 2px;
}

.contact-home-pro__form-actions {
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: 1.6rem;
}

.contact-home-pro__rgpd {
    font-size: var(--font-size-xs);
    color: rgba(var(--color-primary-rgb), 0.45);
    text-align: center;
    line-height: 1.6;
    max-width: 52rem;
}

.contact-home-pro__rgpd a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.contact-home-pro__rgpd a:hover {
    color: var(--color-brand);
}

.contact-home-pro__back {
    background: none;
    border: none;
    cursor: pointer;
    font-size: var(--font-size-sm);
    color: rgba(var(--color-primary-rgb), 0.5);
    margin-top: 1rem;
    padding: 0;
    transition: color 0.15s ease;
}

.contact-home-pro__back span {
    position: relative;
    top: 0.5px;
    display: inline-block;
    transition: transform 0.3s ease;
}

.contact-home-pro__back:hover {
    color: var(--color-primary);
}

.contact-home-pro__back:hover span {
    transform: translateX(-2px);
}

.contact-home-pro__form-feedback {
    font-size: var(--font-size-sm);
    min-height: 2rem;
    line-height: 1.5;
}

.contact-home-pro__form-feedback--error {
    color: #c0392b;
}

.contact-home-pro__form-feedback--success {
    color: var(--color-brand);
}

.contact-home-pro__cookie-notice {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2rem;
    padding: 3.4rem 4.2rem;
    background-color: var(--color-white);
    border: 1px solid var(--color-beige-dark);
    border-radius: var(--border-radius);
    max-width: 45rem;
    text-align: center;
}

.contact-home-pro__cookie-reset {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--color-brand);
    text-decoration: underline;
    text-underline-offset: 2px;
    padding: 0;
    transition: opacity 0.15s ease;
}

.contact-home-pro__cookie-reset:hover {
    opacity: 0.65;
}
/* =========================================================================
   6. Animations au scroll
   ========================================================================= */

[data-anim="fade-up"] {
    opacity: 0;
    transform: translateY(4rem);
    transition: opacity 1s ease, transform 1s ease;
}

[data-anim="fade-up"].is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Désactive les animations au scroll sur tablette/mobile (économie de ressources) */
@media (max-width: 1024px) {
    [data-anim="fade-up"] {
        opacity: 1;
        transform: none;
        transition: none;
    }

    [data-anim="fade-up"].is-visible {
        opacity: 1;
        transform: none;
    }
}
/* =========================================================================
   7. Espace B2C — spécifique
   ========================================================================= */

/* À compléter lors du refonte du B2C */
/* =========================================================================
   8. Accessibilité — prefers-reduced-motion
   ========================================================================= */

@media (prefers-reduced-motion: reduce) {

    /* Désactive les animations au scroll */
    [data-anim="fade-up"] {
        opacity: 1;
        transform: none;
        transition: none;
    }

    [data-anim="fade-up"].is-visible {
        opacity: 1;
        transform: none;
    }

    /* Désactive l’animation du graphique marche */
    .market-home-pro__icon-circle .mg-l1,
    .market-home-pro__icon-circle .mg-l2,
    .market-home-pro__icon-circle .mg-l3,
    .market-home-pro__icon-circle .mg-l4,
    .market-home-pro__icon-circle .mg-l5,
    .market-home-pro__icon-circle .mg-arrow {
        stroke-dashoffset: 0;
        opacity: 1;
        animation: none;
    }

    .market-home-pro__icon-circle .mg-c1,
    .market-home-pro__icon-circle .mg-c2,
    .market-home-pro__icon-circle .mg-c3,
    .market-home-pro__icon-circle .mg-c4 {
        opacity: 1;
        transform: none;
        animation: none;
    }

    /* Désactive le pop du numéro d'étape */
    .steps-home-pro__item.is-visible .steps-home-pro__number {
        animation: none;
        transform: translate(-50%, -50%);
    }

    /* Désactive le float des captures booking */
    .booking-home-pro__step-img-wrap {
        animation: none;
    }

    /* Désactive les transitions de taille (slots) */
    .slots-home-pro__col-join.is-visible,
    .slots-home-pro__compare.is-visible::before,
    .slots-home-pro__sep.is-visible,
    .slots-home-pro__fork.is-visible .slots-home-pro__fork-line,
    .slots-home-pro__fork.is-visible .slots-home-pro__fork-bar {
        transition: none;
    }

    .slots-home-pro__col-join { height: 3.2rem; }
    .slots-home-pro__compare::before { width: 50%; }
    .slots-home-pro__sep { height: calc(100% + 10rem); }
    .slots-home-pro__fork-line { height: 10rem; }
    .slots-home-pro__fork-bar { transform: scaleX(1); }

    /* Désactive les particules Three.js */
    .why-home-pro__particles {
        display: none;
    }
}

/* ========================================================================
   9. PAGE INSCRIPTION PARTENAIRE (page-register-pro)
   ======================================================================== */

/* ── Variables locales ────────────────────────────────────────────────── */
.kookla-register {
    --reg-progress-h    : 4.8rem;
    --reg-form-width    : 60rem;
    --reg-plans-width   : 110rem;
    --step-transition-ms: 500ms;
}

/* ── Reset body plein écran ───────────────────────────────────────────── */
.kookla-register {
    min-height: 100vh;
    background-color: var(--color-beige-light);
    overflow-x: hidden;
}

/* ------ Header d'inscription --------- */

.reg-header__inner {
    position: fixed;
    top: 0; 
    left: 0; 
    right: 0;
    height: 6rem;
    z-index: 10;
}

.reg-header__back {
    position: absolute;
    top: 2rem;
    left: 2rem;
}

.reg-header__back svg {
    position: relative;
    top: 0.5px;
    stroke: currentColor;
    flex-shrink: 0;
    fill: none;
    stroke-width: 0.8;
    transform: translateX(0);
    transition: transform 0.3s ease;
}

.reg-header__back:hover svg {
    transform: translateX(-4px);
}

.reg-header__logo {
    position: absolute;
    top: 2rem;
    left: 50%;
    transform: translateX(-50%);
}

.reg-progress {
    width: 90%;
    max-width: 40rem;
    margin: 0 auto 3rem;
}

.reg-progress__steps {
    display: flex;
    gap: 0.5rem;
}

.reg-progress__step {
    flex: 1;
    height: 7px;
    background-color: var(--color-brand-light);
    transition: background-color 0.3s ease;
}

.reg-progress__step[data-step="1"] { 
    border-top-left-radius: 3.5px;
    border-bottom-left-radius: 3.5px;
}

.reg-progress__step[data-step="3"] { 
    border-top-right-radius: 3.5px;
    border-bottom-right-radius: 3.5px;
}

.reg-progress__step.is-active {
    background-color: var(--color-brand);
}

/* --------- Slides ---------- */

.register-pro__slides {
    min-height: 100vh;
    position: relative;
}

.register-pro__slide {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0;
    transition: opacity var(--step-transition-ms, 340ms) ease;
    will-change: opacity;
}

.register-pro__slide[data-slide="3"] {
    padding-bottom: 10rem;
}

.register-pro__slide[hidden] {
    display: none !important;
}

.register-pro__slide.is-active {
    opacity: 1;
}

.register-pro__slide.is-leaving-left {
    pointer-events: none;
    opacity: 0;
}

.register-pro__slide.is-leaving-right {
    pointer-events: none;
    opacity: 0;
}

.register-pro__slide.is-entering-right {
    opacity: 0;
}

.register-pro__slide.is-entering-left {
    opacity: 0;
}

.register-pro__slide-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
}

[data-current="0"] .register-pro__slide-inner {
    min-height: 100vh;
    justify-content: center;
    padding: 0;
}

.register-pro__form {
    padding-top: 12rem;
}

.register-pro__slides[data-current="0"] .register-pro__form {
    padding: 0;
}

/* --------- Slide 0 — Introduction (beige-dark) ---------- */

.register-pro__slide.register-pro__slide--intro {
    background-color: var(--color-beige-dark);
    left: 0;
    right: 0;
    transform: none;
}

.reg-intro__title {
    font-size: 4.1rem;
    font-weight: 300;
    line-height: 1.3;
    margin-bottom: 3rem;
}

.reg-intro__desc {
    max-width: 67ch;
    font-size: var(--font-size-lg);
    margin-bottom: 2rem;
}

.reg-intro__features {
    display: flex;
    flex-direction: column;
    gap: 1.4rem;
}

.reg-intro__feature {
    display: flex;
    align-items: center;
    gap: 1rem;
    font-size: var(--font-size-lg);
}

.reg-intro__feature svg {
    width: 28px;
    height: 28px;
    flex-shrink: 0;
    fill: var(--color-brand);
}
/* ════════════════════════════════════════════════════════════════════════
   Slides 1-4 — Formulaire (beige-light)
   ════════════════════════════════════════════════════════════════════════ */

.reg-form__title {
    font-size: 2rem;
    font-weight: 500;
    margin-bottom: 3rem;
    text-align: center;
}

.reg-form__step-label {
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-brand);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 1rem;
    text-align: center;
}

.register-pro__slide--form {
    width: 80%;
    max-width: var(--reg-form-width);
    background-color: var(--color-beige-light);
}

.register-pro__slide--form[data-slide="3"] {
    max-width: none;
}

.reg-form-wrap {
    width: 100%;
}

.reg-form-input-wrap {
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
}

.register-form__row {
    display: flex;
    gap: 1.2rem;
}

.register-form__row--half > .form-field {
    flex: 1;
    min-width: 0;
}

.reg-form__required-note {
    font-size: var(--font-size-xs);
    color: rgba(var(--color-primary-rgb), 0.55);
    margin-bottom: 2.4rem;
}

.reg-form__required-note abbr {
    text-decoration: none;
    color: var(--color-brand);
}

.reg-home-form__error {
    padding: 2rem;
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-alert);
    background-color: var(--color-alert-light);
    border: 1px solid rgba(var(--color-alert-rgb), 0.3);
    border-radius: var(--border-radius);
    text-align: center;
}

.reg-form__actions {
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
    margin-top: 2rem;
}

.reg-form__next,
.reg-form__submit,
.reg-intro__cta {
    position: relative;
    margin: 0.8rem 0 0 auto;
    padding-right: 12rem;
    justify-content: center;
    width: fit-content;
}

.reg-intro__cta {
    margin: 3rem 0 0;
}

.reg-form__submit {
    margin: 0 auto;
    padding-right: 2rem;
}

.reg-form__next svg,
.reg-intro__cta svg {
    position: absolute;
    top: 15px;
    right: 2rem;
    flex-shrink: 0;
    fill: none;
    stroke: var(--color-white);
    stroke-width: 0.8px;
    width: 15px;
    height: 10px;
    transform: translateX(0);
    transition: transform 0.3s ease;
}

.reg-form__next:hover svg,
.reg-intro__cta:hover svg {
    transform: translateX(4px);
}

.register-pro__hp {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
}

/* ── Gestion des champs en erreur ──────────────────────────────────────── */

.form-field .is-error input,
.form-field.is-error input,
.reg-form-wrap .form-field:has(input.is-error) input {
    border-color: #c0392b !important;
    box-shadow: 0 0 0 3px rgba(192, 57, 43, 0.15);
}

input.is-error,
input[aria-invalid="true"] {
    border-color: #c0392b !important;
    box-shadow: 0 0 0 3px rgba(192, 57, 43, 0.15) !important;
}

.form-field__error,
.form-field__phone-error {
    display: block;
    font-size: var(--font-size-xs);
    color: var(--color-brand);
    margin-top: 0.4rem;
    padding-left: 0.4rem;
}
.form-field__phone-error[hidden] { display: none; }

/* Message d'erreur global */
.reg-form__error {
    background-color: rgba(192, 57, 43, 0.08);
    border: 1px solid rgba(192, 57, 43, 0.3);
    border-radius: 0.8rem;
    padding: 1.4rem 1.8rem;
    font-size: var(--font-size-sm);
    color: #8b1a1a;
    margin-top: 2rem;
    line-height: 1.5;
}

.reg-form__error a {
    color: inherit;
    font-weight: 600;
    text-decoration: underline;
}

/* Loader dans le bouton submit */
.reg-form__submit-loader {
    width: 1.8rem;
    height: 1.8rem;
    border: 2px solid rgba(255,255,255,0.4);
    border-top-color: #fff;
    border-radius: 50%;
    animation: reg-spin 0.7s linear infinite;
}

@keyframes reg-spin {
    to { transform: rotate(360deg); }
}

/* ════════════════════════════════════════════════════════════════════════
   Slide 3 — Formules (plans)
   ════════════════════════════════════════════════════════════════════════ */

.register-pro__slide--plans .register-pro__slide-inner {
    align-items: center;
}

.register-pro__slide--plans .register-form__step-label {
    text-align: center;
    margin-bottom: 3.6rem;
}

.reg-plans {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
    width: 120rem;
}

.reg-plan {
    background-color: var(--color-white);
    border: 1.5px solid var(--color-beige-dark);
    border-radius: 1.8rem;
    padding: 3.8rem 2.4rem 4rem;
    display: flex;
    flex-direction: column;
    gap: 0;
    position: relative;
    transition: box-shadow 0.2s ease;
}

.reg-plan:hover {
    cursor: pointer;
    box-shadow: 0 4px 24px rgba(var(--color-primary-rgb), 0.1);
}

.reg-plan--featured {
    border-color: var(--color-brand);
}

.reg-plan__suptitle-wrap {
    position: relative;
    margin-bottom: 0.8rem;
    text-align: center;
}

.reg-plan__suptitle {
    display: block;
    font-size: 1rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-weight: 600;
}

.reg-plan__star {
    position: absolute;
    top: -17px;
    left: 50%;
    transform: translateX(-50%);
    color: var(--color-brand);
}

.reg-plan__title {
	font-size: var(--font-size-xl);
	margin-bottom: 2rem;
	text-align: center;
	font-weight: 500;
	font-size: 1.6rem;
}

.reg-plan__pricing {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    text-align: center;
    min-height: 138px;
}

.reg-plan__pricing-note {
    font-family: var(--font-family-serif);
    font-size: var(--font-size-xs);
    font-weight: 500;
    color: var(--color-brand);
}

.reg-plan__price {
    position: relative;
    font-family: var(--font-family-serif);
    font-size: 10rem;
    font-weight: 600;
    color: var(--color-brand);
    line-height: 1;
}

.reg-plan__price sup {
    position: absolute;
    top: 30px;
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 0;
}

.reg-plan__price--text {
    font-size: 8rem;
}

.reg-plan__pricing-sub {
    font-family: var(--font-family-serif);
    color: var(--color-brand);
    font-weight: 500;
    margin-top: 0.5rem;
}

.reg-plan__divider {
	width: 1px;
	height: 3rem;
	background-color: var(--color-beige-dark);
	margin: 1rem auto 0;
}

.reg-plan__bubble {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 4.4rem;
    height: 4.4rem;
    background-color: var(--color-beige-light);
    border: 1px solid var(--color-beige-dark);
    border-radius: 50%;
    margin: 0 auto 0.4rem;
}

.reg-plan__bubble svg {
    display: block;
}

.icon-calendar-slots svg {
    fill: none;
    stroke: var(--color-brand);
    stroke-width: .5px;
    width: 18px;
    height: auto;
}

.icon-pin-simple {
    fill:none;
    stroke: var(--color-brand);
    stroke-miterlimit:10;
    stroke-width: .6px;
    width: 16px;
    height: auto;
}

.icon-group-building {
    fill:none;
    stroke: var(--color-brand);
    stroke-width: .6px;
    width: 20px;
    height: auto;
}

.reg-plan__bubble-label {
    font-family: var(--font-family-serif);
    font-size: 1.6rem;
    font-weight: 500;
    color: var(--color-brand);
    margin-bottom: 2rem;
    text-align: center;
}

.reg-plan__features {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    flex: 1;
    margin-bottom: 2.4rem;
}

.reg-plan__feature {
    display: flex;
    align-items: center;
    gap: 1rem;
    font-size: var(--font-size-sm);
    font-weight: 500;
}

.reg-plan__feature span {
    flex: 1;
}

.reg-plan__feature--no span {
    color: rgba(var(--color-primary-rgb), 0.4);
}

.feature-checkmark {
    fill: var(--color-brand);
}

.feature-cross-path {
    fill: var(--color-brand-light);
}

.reg-plan__action {
    position: relative;
}

.reg-plan__cta {
    width: 100%;
    text-align: center;
}

.reg-plan__cta-note {
    position: absolute;
    bottom: -2.5rem;
    width: 100%;
    text-align: center;
    font-size: var(--font-size-xs);
    color: var(--color-brand);
    font-weight: 600;
    margin: 0;
}

/* ════════════════════════════════════════════════════════════════════════
   Slide 4 — Confirmation
   ════════════════════════════════════════════════════════════════════════ */

.reg-confirm__suptitle {
    display: block;
    font-size: 1.1rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    text-align: center;
    color: var(--color-brand);
    font-weight: 600;
    margin-bottom: 1.2rem;
}

.reg-confirm__title {
    font-size: 2.6rem;
    margin-bottom: 2.4rem;
    text-align: center;
}

.reg-confirm__text {
    margin-bottom: 1.6rem;
}

.reg-confirm__recap {
    background-color: var(--color-white);
    border-radius: var(--border-radius);
    border: 1px solid var(--color-beige-dark);
    padding: 2.1rem 2rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.2rem;
    margin-bottom: 2.8rem;
}

.reg-confirm__recap-label {
    font-size: var(--font-size-sm);
    color: rgba(var(--color-primary-rgb), 0.65);
}

.reg-confirm__recap-value {
    font-size: var(--font-size-sm);
    font-weight: 500;
}

/* ── Checkbox CGU personnalisée ─────────────────────────────────────────── */

.reg-confirm__cgu {
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
    margin-bottom: 2.8rem;
}

.reg-checkbox {
    background-color: var(--color-white);
    border: 1px solid rgba(var(--color-brand-rgb), 0.3);
    border-radius: var(--border-radius);
    padding: 2rem;
}

.reg-checkbox {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    cursor: pointer;
}

.reg-checkbox input[type="checkbox"] {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.reg-checkbox__box {
    flex-shrink: 0;
    width: 1.7rem;
    height: 1.7rem;
    border: 1px solid var(--color-brand-light);
    border-radius: 0.2rem;
    background-color: var(--color-white);
    transition: border-color 0.2s ease, background-color 0.2s ease;
    position: relative;
}

.reg-checkbox__box::after {
    content: '';
    position: absolute;
    inset: 4px;
    background-color: var(--color-brand);
    border-radius: 1px;
    opacity: 0;
    transition: opacity 0.15s ease;
}

.reg-checkbox input[type="checkbox"]:checked ~ .reg-checkbox__box {
    border-color: var(--color-brand);
}

.reg-checkbox input[type="checkbox"]:checked ~ .reg-checkbox__box::after {
    opacity: 1;
}

.reg-checkbox input[type="checkbox"]:focus-visible ~ .reg-checkbox__box {
    outline: 2px solid var(--color-brand);
    outline-offset: 2px;
}

.reg-checkbox input.is-error ~ .reg-checkbox__box,
.reg-checkbox input[aria-invalid="true"] ~ .reg-checkbox__box {
    border-color: #c0392b;
}

.reg-checkbox__label {
    font-size: var(--font-size-sm);
    font-family: var(--font-family-serif);
    color: var(--color-brand);
}

.reg-checkbox__label a {
    text-decoration: underline;
    text-underline-offset: 2px;
}

/* ════════════════════════════════════════════════════════════════════════
   Slide 5 — Succès
   ════════════════════════════════════════════════════════════════════════ */

.register-pro__success {
    min-height: 100vh;
    background-color: var(--color-beige-light);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: calc(6rem + 4rem) 2rem 6rem;
}

.register-pro__success[hidden] {
    display: none;
}

.reg-success {
    width: 100%;
    max-width: 44rem;
    text-align: center;
}

.reg-success__icon {
    color: var(--color-brand);
    margin-bottom: 1rem;
}

.reg-success__icon svg {
    display: inline-block;
    width: 46px;
    height: 46px;
}

.reg-success__title {
    font-size: 3.4rem;
    font-weight: 300;
    margin-bottom: 3rem;
}

.reg-success__text {
    margin-bottom: 1.4rem;
    text-align: left;
}

.reg-success__cta {
    display: inline-flex;
    align-items: center;
    gap: 1rem;
    margin-top: 2rem;
}

.reg-success__cta svg {
    fill: none;
    stroke: var(--color-white);
    stroke-width: 0.8px;
    width: 15px;
    height: 10px;
    transform: translateX(0);
    transition: transform 0.3s ease;
}

.reg-success__cta:hover svg {
    transform: translateX(4px);
}

/* ════════════════════════════════════════════════════════════════════════
   prefers-reduced-motion — inscription
   ════════════════════════════════════════════════════════════════════════ */

@media (prefers-reduced-motion: reduce) {
    .register-pro__slide {
        transition: none;
    }
    .reg-form__submit-loader {
        animation: none;
    }
}
/* ════════════════════════════════════════════════════════════════════════
   Page Connexion Partenaire — login-pro
   ════════════════════════════════════════════════════════════════════════ */
.kookla-login {
    overflow: hidden;
}

.page-template-page-inscription-btoc.kookla-login {
    overflow: auto;
}

.login-pro {
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: 100vh;
}

.woocommerce-lost-password .login-pro,
.page-template-page-inscription-btoc .login-pro {
    grid-template-columns: 1fr;
}

.login-pro__left {
    position: relative;
    background-color: var(--color-beige-light);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 6rem 4rem;
}

.login-pro__left-inner {
    width: 100%;
    max-width: 40rem;
    display: flex;
    flex-direction: column;
    gap: 4rem;
}

.woocommerce-lost-password .login-pro__left-inner,
.page-template-page-inscription-btoc .login-pro__left-inner {
    max-width: 60rem;
}

.page-template-page-inscription-btoc .login-pro__left-inner {
    margin-top: 4rem;
}

.login-pro__logo,
.login__logo {
    position: absolute;
    top: 2rem;
    left: 50%;
    transform: translateX(-50%);
}

.login__logo svg {
    width: 120px;
    height: 32px;
}

.login-pro__form-wrap {
    display: flex;
    flex-direction: column;
}

.login-pro__title {
    font-size: 1.8rem;
    font-weight: 500;
    margin-bottom: 1.8rem;
    text-align: center;
}

.login-pro__error {
    display: flex;
    align-items: flex-start;
    gap: 0.8rem;
    background-color: var(--color-alert-light);
    color: var(--color-alert);
    font-size: var(--font-size-sm);
    border: 1px solid rgba(var(--color-alert-rgb), 0.25);
    border-radius: var(--border-radius);
    padding: 1.2rem 1.6rem;
    margin-bottom: 2.4rem;
    line-height: 1.55;
}

.page-template-page-login-btoc .login-pro__error {
    margin-bottom: 1.4rem;
}

.login-pro__success {
    display: flex;
    align-items: flex-start;
    gap: 0.8rem;
    background-color: var(--color-green-bg);
    color: #2f8a63;
    font-size: var(--font-size-sm);
    border: 1px solid rgba(108, 211, 160, 0.4);
    border-radius: var(--border-radius);
    padding: 1.2rem 1.6rem;
    margin-bottom: 2.4rem;
    line-height: 1.55;
}

.login-pro__form {
    display: flex;
    flex-direction: column;
}

/* ── Champ mot de passe + toggle ────────────────────────────────────────── */

.form-field--password {
    position: relative;
}

/* Laisser de l'espace à droite pour éviter que le texte passe sous le bouton */
.form-field--password input {
    padding-right: 4.8rem;
}

.login-pro__pw-toggle,
.form-field__toggle-pw {
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3.2rem;
    height: 3.2rem;
    padding: 0;
    background: none;
    border: none;
    border-radius: var(--border-radius-sm);
    color: rgba(var(--color-primary-rgb), 0.4);
    cursor: pointer;
    transition: color 0.2s ease;
}

.login-pro__pw-toggle:hover,
.form-field__toggle-pw:hover {
    color: var(--color-primary);
}

.login-pro__pw-toggle:focus-visible,
.form-field__toggle-pw:focus-visible {
    outline: 2px solid var(--color-brand);
    outline-offset: 2px;
    color: var(--color-primary);
}

/* Icônes : par défaut, l'œil ouvert est visible, l'œil barré masqué */
.login-pro__pw-icon--hide {
    display: none;
}

/* Quand le bouton a la classe .is-visible (mot de passe affiché) */
.login-pro__pw-toggle.is-visible .login-pro__pw-icon--show {
    display: none;
}

.login-pro__pw-toggle.is-visible .login-pro__pw-icon--hide {
    display: block;
}

.login-pro__submit {
    width: fit-content;
    margin: 3rem auto 2rem;
    padding-left: 4rem;
    padding-right: 4rem;
}

.login-pro__forgot {
	font-size: var(--font-size-xs);
	color: rgba(var(--color-primary-rgb), 0.55);
	text-align: center;
	text-decoration: underline;
	text-underline-offset: 3px;
	transition: color 0.2s ease;
	width: fit-content;
	margin: 0 auto;
}

.login-pro__forgot:hover {
    color: var(--color-brand);
}

.login-pro__right {
    background-color: var(--color-white);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 6rem 5rem;
}

.login-pro__right-inner {
    width: 80%;
}

.login-pro__desc {
    font-size: var(--font-size-sm);
    margin-bottom: 1rem;
}

.woocommerce-privacy-policy-text p,
.birthday__desc {
    font-size: var(--font-size-xs);
    color: rgba(var(--color-primary-rgb), 0.55);
    margin: 0;
}

.woocommerce-privacy-policy-text {
    padding-top: 3rem;
    border-top: 1px solid rgba(var(--color-primary-rgb), 0.1);
    margin-top: 0.95rem;
}

.birthday__desc {
    margin-top: 0.5rem;
}

.woocommerce-privacy-policy-link {
    text-decoration: underline;
}
/* ════════════════════════════════════════════════════════════════════════
   Page Contact Partenaires — contact-pro
   ════════════════════════════════════════════════════════════════════════ */

.send-plane-st0 {
    fill: none;
    stroke: currentColor;
    stroke-width: .7px;
}

.contact-pro__hero {
    position: relative;
    overflow: hidden;
    background-color: var(--color-beige-light);
}

.contact-pro__diamonds {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}

.contact-pro__diamond {
    position: absolute;
    width:  42rem;
    height: 42rem;
    background: none;
    border: 1px solid var(--color-brand);
    left: calc(50% - 21rem);
    top:  calc(50% - 21rem);
    transform-origin: center center;
}

.contact-pro__diamond--1 { margin-top: -10rem; opacity: .14; animation: diamond-cw  40s ease-in-out infinite; }
.contact-pro__diamond--2 { margin-top:  -5rem; opacity: .10; animation: diamond-ccw 38s ease-in-out infinite; animation-delay: -5s; }
.contact-pro__diamond--3 { margin-top:    0;   opacity: .16; animation: diamond-cw  50s ease-in-out infinite; animation-delay: -11s; }
.contact-pro__diamond--4 { margin-top:   5rem; opacity: .9; animation: diamond-ccw 44s ease-in-out infinite; animation-delay: -3s; }
.contact-pro__diamond--5 { margin-top:  10rem; opacity: .12; animation: diamond-cw  34s ease-in-out infinite; animation-delay: -8s; }

@keyframes diamond-cw {
    0%   { transform: rotate(45deg)  scale(1);    opacity: .18; }
    25%  { transform: rotate(90deg)  scale(1.2); opacity: .1; }
    50%  { transform: rotate(135deg)  scale(1.4);  opacity: .05; }
    75%  { transform: rotate(90deg)  scale(1.2);  opacity: .1; }
    100% { transform: rotate(45deg)  scale(1);    opacity: .18; }
}

@keyframes diamond-ccw {
    0%   { transform: rotate(45deg)  scale(1);   opacity: .18; }
    25%  { transform: rotate(0deg)   scale(1.2); opacity: .1; }
    50%  { transform: rotate(-45deg) scale(1.4); opacity: .05; }
    75%  { transform: rotate(0deg)   scale(1.2); opacity: .1; }
    100% { transform: rotate(45deg)  scale(1);   opacity: .18; }
}

@media (prefers-reduced-motion: reduce) {
    .contact-pro__diamond {
        animation: none;
        transform: rotate(45deg);
    }
}

.contact-pro__hero-inner {
	position: relative;
	z-index: 1;
	display: flex;
	gap: 6rem;
	max-width: var(--container-max-width);
	margin: 0 auto;
	padding: 8rem var(--container-padding-x);
	align-items: center;
}

.contact-pro__left {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    max-width: 60rem;
}

.contact-pro__title {
    font-size: 6rem;
    font-weight: 400;
}

.contact-pro__desc {
    font-size: var(--font-size-base);
    line-height: 1.8;
    color: rgba(var(--color-primary-rgb), 0.75);
}

.contact-pro__right {
    max-width: 50rem;
}

.contact-pro__form-title {
    font-size: 1.8rem;
    font-weight: 500;
    text-align: center;
    font-style: italic;
    margin-bottom: 1.5rem;
}

.contact-pro__form {
    display: flex;
    flex-direction: column;
    gap: 1.6rem;
}

.contact-pro__form-row {
    display: flex;
    flex-direction: column;
    gap: 1.6rem;
}

.contact-pro__form-row--half {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.6rem;
}

/* Honeypot */
.contact-pro__hp {
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
}

.contact-pro__rgpd-checkbox.reg-checkbox {
    align-items: center;
    gap: 1.4rem;
    border: 1px solid var(--color-beige-dark);
}

.contact-pro__rgpd-checkbox.reg-checkbox .reg-checkbox__label {
    font-size: var(--font-size-xs);
    color: rgba(var(--color-primary-rgb), 0.8);
}

.pbt-legal-link.reg-legal-link {
    border: none;
    background-color: transparent;
    padding: 0;
    margin: 0;
    font-family: var(--font-family-serif);
    font-size: var(--font-size-xs);
    color: rgba(var(--color-primary-rgb), 0.8);
    text-decoration: underline;
    text-underline-offset: 2px;
    transition: color 0.2s ease;
}

.pbt-legal-link.reg-legal-link:hover {
    color: var(--color-brand);
}

.contact-pro__rgpd-checkbox.reg-checkbox .reg-checkbox__box {
    border-color: rgba(var(--color-primary-rgb), 0.2);
}

.form-field--textarea {
    position: relative;
}

.form-field--textarea textarea {
    display: block;
    width: 100%;
    border: 1px solid var(--color-beige-dark);
    border-radius: var(--border-radius);
    background: var(--color-white);
    font-family: var(--font-family);
    font-size: var(--font-size-sm);
    color: var(--color-primary);
    padding: 2.4rem 1.6rem 1rem;
    outline: none;
    transition: border-color 0.2s ease, background 0.2s ease;
    resize: none;
    min-height: 13rem;
}

.form-field--textarea textarea:focus {
    border-color: var(--color-brand);
    box-shadow: 0 0 0 3px rgba(var(--color-brand-rgb), 0.1);
}

.form-field--textarea label {
    position: absolute;
    top: 1.8rem;
    left: 1.6rem;
    font-size: var(--font-size-xs);
    color: rgba(var(--color-primary-rgb), 0.5);
    pointer-events: none;
    transition: all 0.15s ease;
    transform-origin: left top;
}

.form-field--textarea textarea:focus ~ label,
.form-field--textarea textarea:not(:placeholder-shown) ~ label {
    transform: translateY(-0.8rem) scale(0.8);
    color: var(--color-brand);
}

.form-field--textarea textarea.is-error,
.form-field--textarea textarea[aria-invalid="true"] {
    border-color: var(--color-alert);
}

.contact-pro__feedback {
	font-size: var(--font-size-sm);
    margin: 0 0 2rem;
	padding: 1.4rem;
	text-align: center;
	border: 1px solid transparent;
    border-radius: var(--border-radius);
    display: none;
}

.contact-pro__feedback--error {
    display: block;
    color: var(--color-alert);
    border-color: rgba(var(--color-alert-rgb), 0.25);
    background-color: var(--color-alert-light);
}

.contact-pro__feedback--success {
    color: #2e7d32;
}

.contact-pro__success {
    background-color: #e8f5e9;
    border: 1px solid rgba(46, 125, 50, 0.25);
    border-radius: var(--border-radius);
    padding: 2rem 2.4rem;
    color: #2e7d32;
    font-size: var(--font-size-sm);
    line-height: 1.6;
}

.contact-pro__success:focus {
    outline: none;
}

.woocommerce-lost-password .contact-pro__success {
    margin-bottom: 2rem;
    font-size: var(--font-size-sm);
}

/* ── Bouton submit ──────────────────────────────────────────────────────── */

.contact-pro__submit {
    width: 100%;
    margin-top: 0.4rem;
    gap: 1rem;
}

.contact-pro__submit svg {
    flex-shrink: 0;
    transition: transform 0.2s ease;
}

.contact-pro__submit:hover svg {
    transform: translateX(3px) translateY(-3px);
}

.contact-home-pro--direct {
    background-color: var(--color-white);
}
/* ============================================================
   PAGE AIDE PRO
   ============================================================ */

.guides-aide-pro {
    background-color: var(--color-beige-light);
    padding: 10rem 0 12rem;
}

.guides-aide-pro__inner {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-x);
    display: flex;
    flex-direction: column;
    align-items: center;
}

.guides-aide-pro__title {
    font-size: 6rem;
    font-weight: 300;
    text-align: center;
    margin-bottom: 2rem;
}

.guides-aide-pro__desc {
    text-align: center;
    margin-bottom: 6rem;
}

.guides-aide-pro__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8rem 3rem;
    width: 100%;
    padding-top: 3.2rem;
}

.guides-aide-pro__card {
    position: relative;
    background-color: var(--color-white);
    border: 1.5px solid var(--color-beige-dark);
    border-radius: var(--border-radius);
    padding: 6rem 4rem 5rem;
    text-decoration: none;
    transition: box-shadow 0.2s ease, transform 0.2s ease;
    box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
}

.guides-aide-pro__card:hover {
    box-shadow: 8px 8px 20px rgba(var(--color-primary-rgb), 0.05);
    transform: translateY(-3px);
}

.guides-aide-pro__card-bubble {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 6.4rem;
    height: 6.4rem;
    border-radius: 50%;
    background-color: var(--color-white);
    border: 1.5px solid var(--color-beige-dark);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.guides-aide-pro__card.is-visible .guides-aide-pro__card-bubble {
    animation: steps-number-pop 0.75s cubic-bezier(0.33, 1, 0.68, 1) both;
}

.guides-aide-pro__card-body {
    display: flex;
    flex-direction: column;
}

.guides-aide-pro__card-title {
    font-size: 1.8rem;
    font-weight: 500;
    text-align: center;
    margin-bottom: 1.2rem;
}

.guides-aide-pro__card-desc {
    margin-bottom: 2rem;
    font-size: var(--font-size-sm);
}

.guides-aide-pro__card-nav {
    display: flex;
    flex-direction: column;
}

.guides-aide-pro__card-nav li {
    display: flex;
    padding: 0.9rem 0;
    transition: color 0.15s ease;
    border-bottom: 1.5px solid var(--color-beige-dark);
    font-size: var(--font-size-sm);
}

.guides-aide-pro__card-nav li a:hover {
    color: var(--color-brand);
}

.guides-aide-pro__card-nav-num {
    flex-shrink: 0;
    font-weight: 500;
    color: var(--color-brand);
    min-width: 1.8rem;
}

/* ----- Section 2 : FAQ ------------------------------------------- */

.faq-aide-pro {
    background-color: var(--color-white);
    padding: 12rem 0;
}

.page-template-page-aide-btoc .faq-aide-pro {
    background-color: transparent;
}

.faq-aide-pro__inner {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-x);
    display: flex;
}

.faq-aide-pro__left {
    width: 32%;
    flex-shrink: 0;
}

.faq-aide-pro__sticky {
    position: sticky;
    top: 10rem;
}

.faq-aide-pro__title {
    font-size: 5rem;
    font-weight: 300;
    text-align: center;
    margin-bottom: 8.2rem;
}

.faq-aide-pro__nav {
    display: flex;
    justify-content: flex-end;
}

.faq-aide-pro__nav-list {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.faq-aide-pro__nav-btn {
    display: block;
    width: 100%;
    text-align: right;
    background: none;
    border: none;
    padding: 0.9rem 1.4rem;
    border-radius: 0.6rem;
    font-family: var(--font-family-serif);
    font-size: 1.8rem;
    color: rgba(var(--color-brand-rgb), 0.65);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

.faq-aide-pro__nav-btn:hover {
    color: var(--color-brand);
}

.faq-aide-pro__nav-btn.is-active {
    color: var(--color-brand);
}

/* Panel + accordéon */
.faq-aide-pro__content {
    flex: 1;
    padding-left: 6rem;
}

.faq-aide-pro__item {
    padding: 3.4rem 0 2.45rem;
    border-bottom: 1.5px solid rgba(var(--color-primary-rgb), 0.1);
}

.faq-aide-pro__item:first-child {
    border-top: 1.5px solid rgba(var(--color-primary-rgb), 0.1);
}

.faq-aide-pro__question {
    display: flex;
    padding: 0;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    gap: 2.4rem;
    background: none;
    border: none;
    cursor: pointer;
    text-align: left;
}

.faq-aide-pro__question-text {
    font-family: var(--font-family-serif);
    font-size: 2.2rem;
    color: var(--color-brand);
    flex: 1;
}

.faq-aide-pro__cross {
    flex-shrink: 0;
    display: block;
    color: var(--color-brand);
    transform: rotate(0deg);
    transform-origin: center;
    transition: transform 0.25s ease;
}

.faq-aide-pro__cross line {
    stroke: currentColor;
    stroke-width: 1.3;
}

.faq-aide-pro__item.is-open .faq-aide-pro__cross {
    transform: rotate(45deg);
    transition: none;
}

/* Réutilisation des keyframes faq-cross-open / faq-cross-close déjà déclarées */
.faq-aide-pro__cross.is-animating-open {
    animation: faq-cross-open 1s cubic-bezier(0.55, 0, 0.1, 1) forwards;
    transition: none;
}

.faq-aide-pro__cross.is-animating-close {
    animation: faq-cross-close 0.3s cubic-bezier(0.55, 0, 0.1, 1) forwards;
    transition: none;
}

.faq-aide-pro__answer {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.45s ease-in-out;
}

.faq-aide-pro__item.is-open .faq-aide-pro__answer {
    grid-template-rows: 1fr;
}

.faq-aide-pro__answer-inner {
    overflow: hidden;
    min-height: 0;
    padding: 1rem 8rem 0 0;
    line-height: 1.7;
}

.faq-aide-pro__answer-inner p + p {
    margin-top: 1em;
}
/* ============================================================
   Guide Pratique — single-guide_pratique
   ============================================================ */

.guide-single-pro__hero {
    border-bottom: 1.5px solid var(--color-beige-dark);
    padding: 8rem 2rem;
    text-align: center;
}

.guide-single-pro__hero-inner {
    max-width: 80rem;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

.guide-single-pro__hero-title {
    font-family: var(--font-family-serif);
    font-size: 5rem;
    font-weight: 300;
    color: var(--color-brand);
    line-height: 1;
}

.guide-single-pro__body-inner {
    max-width: var(--container-max-width);
    padding: 0 var(--container-padding-x);
    margin: 0 auto;
    display: flex;
    align-items: stretch;
    gap: 6rem;
}

.guide-single-pro__sidebar {
    width: 36rem;
    flex-shrink: 0;
    padding: 8rem 0;
}

.guide-single-pro__sidebar-sticky {
    position: sticky;
    top: 10rem;
    z-index: 1;
}

.guide-single-pro__nav-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.guide-single-pro__nav-item {
    overflow: hidden;
}

.guide-single-pro__nav-cat {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 1.1rem 0;
    background: none;
    border: none;
    border-radius: 0.8rem;
    font-family: var(--font-family-serif);
    font-size: 1.8rem;
    font-weight: 500;
    text-align: left;
    cursor: pointer;
    color: var(--color-brand);
    transition: background 0.18s, color 0.18s;
}

.guide-single-pro__nav-chevron {
    flex-shrink: 0;
    margin-left: 0.8rem;
    transition: transform 0.22s ease;
    color: currentColor;
    width: 11px;
    height: auto;
}

.guide-single-pro__nav-item.is-active > .guide-single-pro__nav-cat .guide-single-pro__nav-chevron {
    transform: rotate(180deg);
}

.guide-single-pro__nav-sub {
    list-style: none;
    margin: 0;
    padding: 0.4rem 0 0.8rem 0;
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.guide-single-pro__nav-link {
    display: block;
    padding: 0.7rem 1.4rem 0.7rem 2.4rem;
    text-decoration: none;
    border-radius: 0.6rem;
    transition: background 0.15s, color 0.15s;
    position: relative;
}

.guide-single-pro__nav-link::before {
    content: '';
    position: absolute;
    left: 1.4rem;
    top: calc(50% + 0.5px);
    transform: translateY(-50%);
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: currentColor;
}

.guide-single-pro__nav-link:hover {
    color: var(--color-brand);
    background-color: var(--color-beige-light);
}

.guide-single-pro__nav-link.is-current {
    color: var(--color-brand);
}

.guide-single-pro__nav-link.is-current::before {
    background: var(--color-brand);
}

.guide-single-pro__content {
    flex: 1;
    min-width: 0;
    border-left: 1.5px solid var(--color-beige-dark);
    padding: 8rem 0 8rem 6rem;
}

.guide-single-pro__body {
    border-bottom: 1.5px solid var(--color-beige-dark);
}

/* Fil d'Ariane */
.guide-single-pro__breadcrumb-list {
    list-style: none;
    margin: 0 0 3rem;
    padding: 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.4rem;
    font-size: var(--font-size-xs);
    color: rgba(var(--color-primary-rgb), 0.65);
}

.guide-single-pro__breadcrumb-list a {
    color: var(--color-text-light);
    text-decoration: none;
}

.guide-single-pro__breadcrumb-list a:hover {
    color: var(--color-brand);
    text-decoration: underline;
}

.guide-single-pro__breadcrumb-sep {
    opacity: 0.5;
}

.guide-single-pro__title {
    font-size: 3.6rem;
    font-weight: 400;
    margin-bottom: 3rem;
}

.guide-single-pro__article h2 {
    font-size: 2rem;
    font-weight: 500;
    margin: 4rem 0 1.4rem;
}

.guide-single-pro__article h3 {
    font-size: var(--font-size-md);
    font-weight: 600;
    margin: 3rem 0 1.2rem;
}

.guide-single-pro__article p {
    margin: 0 0 1.4em;
}

.guide-single-pro__article ul,
.guide-single-pro__article ol {
    margin: 0 0 1.6em 2.4rem;
    line-height: 1.75;
}

.guide-single-pro__article li {
    margin-bottom: 0.5em;
}

.guide-single-pro__article a {
    color: var(--color-brand);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.guide-single-pro__article a:hover {
    opacity: 0.8;
}

.guide-single-pro__article strong {
    font-weight: 600;
    color: var(--color-primary);
}

.guide-single-pro__article blockquote {
    border-left: 3px solid var(--color-brand);
    padding: 1.2rem 1.6rem;
    margin: 2rem 0;
    background: var(--color-beige-light);
    border-radius: 0 0.6rem 0.6rem 0;
    font-style: italic;
    color: var(--color-text-light);
}

.guide-single-pro__article hr {
    border: none;
    border-top: 1px solid var(--color-border);
    margin: 3.2rem 0;
}

/* ── Pagination article précédent / suivant ─────────────── */

.guide-single-pro__pagination {
    margin-top: 5rem;
    padding-top: 3rem;
    border-top: 1px solid var(--color-border);
}

.guide-single-pro__pagination-inner {
    display: flex;
    justify-content: space-between;
    gap: 2rem;
}

.guide-single-pro__pagination-link--prev svg,
.guide-single-pro__pagination-link--next svg {
    position: relative;
    top: 1px;
    fill: none;
    stroke: var(--color-brand);
    stroke-width: 0.8px;
    width: 15px;
    height: 10px;
    transition: transform 0.3s ease;
    transform: translateX(0);
}

.guide-single-pro__pagination-link--prev:hover svg {
    transform: translateX(-4px);
}

.guide-single-pro__pagination-link--next:hover svg {
    transform: translateX(4px);
}
/* ============================================================
   Pages légales Pro — page-legal-pro
   ============================================================ */

.legal-pro__body {
    background: var(--color-beige-light);
    padding: 6rem 2rem 0;
    overflow-x: clip;
}

.legal-pro__body-inner {
    max-width: var(--container-max-width);
    padding: 0 var(--container-padding-x);
    margin: 0 auto;
    display: flex;
    align-items: stretch;
    gap: 4rem;
}

/* ── Sidebar ─────────────────────────────────────────────── */

.legal-pro__sidebar {
    width: 25rem;
    flex-shrink: 0;
    padding: 3rem 0 8rem;
}

.legal-pro__sidebar-sticky {
    position: sticky;
    top: 10rem;
}

.legal-pro__nav .legal-pro__nav-list + a.legal-pro__nav-link {
    position: relative;
    margin-top: 5rem;
}

.legal-pro__nav .legal-pro__nav-list + a.legal-pro__nav-link::before {
    content: '';
    position: absolute;
    right: 0;
    top: -1rem;
    width: 2rem;
    height: 1px;
    background: var(--color-brand);
}

.legal-pro__nav-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.legal-pro__nav-link {
    display: block;
    padding: 0.5rem 0;
    font-family: var(--font-family-serif);
    font-size: 2.5rem;
    color: rgba(var(--color-brand-rgb), 0.65);
    text-decoration: none;
    transition: background 0.18s, color 0.18s;
    text-align: right;
}

.legal-pro__nav-link:hover {
    color: var(--color-brand);
}

.legal-pro__nav-link.is-active {
    color: var(--color-brand);
}

.legal-pro__content {
    flex: 1;
    min-width: 0;
    position: relative;
    isolation: isolate;
    padding: 6rem 2rem 8rem 6rem;
}

.legal-pro__content::before {
    content: '';
    position: absolute;
    inset: 0;
    right: -100vw;
    background: #fff;
    z-index: -1;
}

.legal-pro__title {
    font-size: 9rem;
    font-weight: 300;
    padding-bottom: 2.4rem;
}

.legal-pro__article h2 {
    font-size: 2.6rem;
    font-weight: 500;
    margin: 4rem 0 1.4rem;
}

.legal-pro__article h3 {
    margin: 3rem 0 1.4rem;
    font-weight: 500;
    font-size: 1.8rem;
}

.legal-pro__article p {
    margin: 0 0 1.4rem;
}

.legal-pro__article ul,
.legal-pro__article ol {
    margin: 0 0 1.4rem 2.4rem;
}

.legal-pro__article li {
    position: relative;
    margin-bottom: 0.6rem;
    line-height: 1.7;
}

.legal-pro__article li::before {
    content: '';
    position: absolute;
    left: -12px;
    top: 13px;
    width: 4px;
    height: 4px;
    background: var(--color-brand);
    border-radius: 50%;
    transform: translateY(-50%);
}

.legal-pro__article a {
    color: var(--color-brand);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.legal-pro__article a:hover {
    opacity: 0.8;
}

.legal-pro__article strong {
    font-weight: 600;
    color: var(--color-primary);
}

.legal-pro__article em {
    font-style: italic;
    color: var(--color-text-light);
}

.legal-pro__article hr {
    border: none;
    border-top: 1px solid var(--color-border);
    margin: 3.2rem 0;
}

.legal-pro__updated {
    margin-top: 3.6rem;
    color: rgba(var(--color-primary-rgb), 0.45);
    font-family: var(--font-family-serif);
    font-style: italic;
}

.legal-pro__article table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--font-size-sm);
    margin: 2rem 0 2.4rem;
}

.legal-pro__article th {
    background: var(--color-beige-light);
    font-weight: 600;
    padding: 1rem 1.4rem;
    text-align: left;
    border: 1px solid var(--color-border);
}

.legal-pro__article td {
    padding: 0.9rem 1.4rem;
    border: 1px solid var(--color-border);
    vertical-align: top;
}

.legal-pro__article tr:nth-child(even) td {
    background: var(--color-beige-light);
}
/* ════════════════════════════════════════════════════════════════════════
   Page Tarifs Pro
   ════════════════════════════════════════════════════════════════════════ */

.plans-tarifs-pro {
    background: var(--color-beige-light);
    padding: 12rem 2rem;
}

.plans-tarifs-pro__inner {
    max-width: var(--content-max-width, 128rem);
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
}

.plans-tarifs-pro__title {
    font-size: 6rem;
    font-weight: 300;
    text-align: center;
    margin-bottom: 2.6rem;
}

.plans-tarifs-pro__desc {
    text-align: center;
    margin-bottom: 5rem;
}

.plans-tarifs-pro__rule {
    border: none;
    width: 2rem;
    height: 1.5px;
    background: var(--color-brand);
    margin: 0 auto 1.8rem;
}

.plans-tarifs-pro__sub {
    font-family: var(--font-family-serif);
    font-size: 1.6rem;
    color: var(--color-brand);
    text-align: center;
    margin-bottom: 3rem;
}

.reg-plans--tarifs .reg-plan {
    padding-bottom: 3rem;
}

.reg-plans--tarifs .reg-plan__features {
    gap: 0.8rem;
    margin-bottom: 0;
}

.reg-plans--tarifs .reg-plan__feature svg {
    width: 24px;
    height: 24px;
}

.reg-plans--tarifs .reg-plan__bubble-label {
    font-size: var(--font-size-lg);
}

.reg-plans--tarifs .reg-plan__price {
    font-size: 8rem;
}

.reg-plans--tarifs .reg-plan__pricing {
    min-height: 117px;
}

.reg-plans--tarifs .reg-plan__pricing-sub {
    font-size: var(--font-size-xs);
}

.reg-plans--tarifs .reg-plan__price--text {
    font-size: 5rem;
}

.plans-tarifs-pro__cta {
    margin-top: 5.6rem;
    text-align: center;
}

.commission-tarifs-pro {
    background: #fff;
    padding: 12rem 2rem;
}

.commission-tarifs-pro__inner {
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.commission-tarifs-pro__title {
    font-size: 5rem;
    font-weight: 300;
    text-align: center;
    margin-bottom: 4.6rem;
}

.commission-tarifs-pro__lead {
    text-align: center;
    margin-bottom: 2rem;
}

.commission-tarifs-pro__flow {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

.commission-tarifs-pro__flow-intro {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
}

.commission-tarifs-pro__flow-line {
    display: block;
    width: 1.5px;
    height: 0;
    background: var(--color-beige-dark);
    transition: height 1.5s ease;
}

.commission-tarifs-pro__flow-line--top {
    height: 0;
    margin-bottom: 1rem;
    transition: height 1.5s ease;
}

.commission-tarifs-pro__flow-line--top.is-visible {
    height: 7rem;
}

.commission-tarifs-pro__flow-line.is-visible {
    height: 10rem;
}

.commission-tarifs-pro__flow-label {
    font-size: 1.1rem;
    color: rgba(var(--color-primary-rgb), 0.4);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-weight: 600;
    margin-bottom: 1rem;
}

.commission-tarifs-pro__bloc {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: var(--color-beige-light);
    border: 1.5px solid var(--color-beige-dark);
    border-radius: var(--border-radius, 0.8rem);
    width: 36rem;
    height: 20rem;
    text-align: center;
    box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
}

.commission-tarifs-pro__bloc-amount {
    position: relative;
    font-family: var(--font-family-serif);
    font-size: 10rem;
    font-weight: 300;
    line-height: 1;
    color: var(--color-brand);
    margin: 0;
}

.commission-tarifs-pro__bloc-amount sup {
    position: absolute;
    top: 10px;
    font-size: 2.4rem;
    font-weight: 700;
}

.commission-tarifs-pro__bloc-legend {
    font-size: var(--font-size-xs);
    color: var(--color-brand);
    margin: 0.8rem 0 0;
}

.commission-tarifs-pro__bloc--net .commission-tarifs-pro__bloc-amount,
.commission-tarifs-pro__bloc--net .commission-tarifs-pro__bloc-amount sup {
    color: var(--color-brand);
}

.commission-tarifs-pro__handshake-bubble {
    width: 6.4rem;
    height: 6.4rem;
    border-radius: 50%;
    background: var(--color-beige-light);
    border: 1.5px solid var(--color-beige-dark);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
}

/* Animation serrage de main — déclenchée une seule fois à l'apparition */
@keyframes handshake-pump {
    0%   { transform: translateY(0)    rotate(0deg);  }
    12%  { transform: translateY(-5px) rotate(-5deg); }
    25%  { transform: translateY(4px)  rotate( 4deg); }
    38%  { transform: translateY(-4px) rotate(-4deg); }
    50%  { transform: translateY(3px)  rotate( 3deg); }
    63%  { transform: translateY(-2px) rotate(-2deg); }
    75%  { transform: translateY(2px)  rotate( 2deg); }
    88%  { transform: translateY(-1px) rotate(-1deg); }
    100% { transform: translateY(0)    rotate(0deg);  }
}

.commission-tarifs-pro__handshake-bubble.is-visible .icon-handshake {
    animation: handshake-pump 0.9s ease-in-out 0.35s 1 forwards;
}

.commission-tarifs-pro__fork {
    position: relative;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    width: calc(20rem + 36rem + 1px);
    height: 2.4rem;
}

.commission-tarifs-pro__fork-line {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 1.5px;
    height: 2.4rem;
    background: var(--color-beige-dark);
}

.commission-tarifs-pro__fork-bar {
    position: absolute;
    top: 2.3rem;
    left: 0;
    right: 0;
    height: 1.5px;
    background: var(--color-beige-dark);
}

.commission-tarifs-pro__results {
    display: flex;
    gap: 20rem;
    justify-content: center;
    align-items: flex-start;
}

.commission-tarifs-pro__result {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.commission-tarifs-pro__result-line {
    display: block;
    width: 1.5px;
    height: 5rem;
    background: var(--color-beige-dark);
}

.commission-tarifs-pro__offer {
    margin-top: 7rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 85rem;
    text-align: center;
}

.commission-tarifs-pro__offer-title {
    font-family: var(--font-family-serif);
    font-size: 2.8rem;
    color: var(--color-brand);
    margin-bottom: 1rem;
}

.commission-tarifs-pro__offer-rule {
    border: none;
    width: 3rem;
    height: 1.5px;
    background: var(--color-beige-dark);
    margin: 0 auto 0;
}

.commission-tarifs-pro__offer-connector {
    display: block;
    width: 1.5px;
    height: 0;
    background: var(--color-beige-dark);
    margin: 0 auto 1.4rem;
    transition: height 1.5s ease;
}

.commission-tarifs-pro__offer-connector.is-visible {
    height: 6rem;
}

.commission-tarifs-pro__offer-text {
    font-size: var(--font-size-base);
    color: var(--color-text-light, #666);
    line-height: 1.7;
}
.simulator-tarifs-pro {
    background: var(--color-beige-dark);
    padding: 12rem 2rem;
}

.simulator-tarifs-pro__inner {
    max-width: var(--content-max-width, 128rem);
    margin: 0 auto;
}

.simulator-tarifs-pro__title {
    font-size: 4rem;
    font-weight: 300;
    text-align: center;
    margin-bottom: 3.8rem;
}

.simulator-tarifs-pro__bloc {
    display: flex;
    align-items: center;
    border-top: 1.5px solid var(--color-brand-light);
    border-bottom: 1.5px solid var(--color-brand-light);
    max-width: 80rem;
    margin: 0 auto;
    padding: 6rem 0;
    gap: 8rem;
}

.simulator-tarifs-pro__left {
    position: relative;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
    border-right: 1.5px solid var(--color-brand-light);
    padding-right: 2rem;
}

.simulator-tarifs-pro__left::after {
    content: '';
    position: absolute;
    top: 50%;
    right: -6rem;
    transform: translateY(-50%);
    width: 6rem;
    height: 1.5px;
    background: var(--color-brand-light);
}

.simulator-tarifs-pro__field {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.simulator-tarifs-pro__label {
	font-size: var(--font-size-xs);
	font-weight: 500;
	color: rgba(var(--color-primary-rgb),0.9);
	line-height: 1;
}

.simulator-tarifs-pro__input-wrap {
    position: relative;
    display: flex;
    align-items: center;
    width: 11rem;
}

.simulator-tarifs-pro__field:last-of-type .simulator-tarifs-pro__input-wrap {
    width: 13rem;
}

.simulator-tarifs-pro__input-wrap::after {
    content: '';
    position: absolute;
    top: 0;
    right: 4rem;
    width: 1.5px;
    height: 100%;
    background: var(--color-brand-light);
}

.simulator-tarifs-pro__field:last-of-type .simulator-tarifs-pro__input-wrap::after {
    right: 6.65rem;
}

.simulator-tarifs-pro__input-wrap:has(.simulator-tarifs-pro__input:focus)::after {
    background: var(--color-brand);
}

.simulator-tarifs-pro__input {
	width: 100%;
	padding: 1.2rem 6.65rem 1.2rem 1.6rem;
	border: 1.5px solid var(--color-brand-light);
	border-radius: var(--border-radius);
	background: #fff;
	font-size: var(--font-size-base);
	font-weight: 500;
	color: var(--color-primary);
	box-shadow: 4px 4px 10px rgba(var(--color-brand-rgb), 0.1);
	font-family: var(--font-family-serif);
}

.simulator-tarifs-pro__field:last-of-type .simulator-tarifs-pro__input {
    padding-right: 6.65rem;
}

.simulator-tarifs-pro__input:focus {
    border-color: var(--color-brand);
}

.simulator-tarifs-pro__input::-webkit-inner-spin-button,
.simulator-tarifs-pro__input::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.simulator-tarifs-pro__input[type=number] {
    appearance: textfield;
}

.simulator-tarifs-pro__input-unit {
    position: absolute;
    right: 1.7rem;
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: rgba(var(--color-primary-rgb), 0.55);
    pointer-events: none;
    user-select: none;
}

.simulator-tarifs-pro__field:first-of-type .simulator-tarifs-pro__input-unit {
    font-size: 1.6rem;
    font-weight: 400;
}

.simulator-tarifs-pro__sep {
    width: 1px;
    background: var(--color-brand-light);
    align-self: stretch;
    flex-shrink: 0;
    position: relative;
}

.simulator-tarifs-pro__sep::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 3.2rem;
    height: 1px;
    background: var(--color-brand-light);
}

.simulator-tarifs-pro__right {
    position: relative;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.simulator-tarifs-pro__results-label {
    position: absolute;
    top: -25px;
    left: 50%;
    transform: translateX(-50%);
    text-wrap: nowrap;
    font-size: var(--font-size-xs);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--color-brand);
    text-align: center;
}

.simulator-tarifs-pro__table-wrap {
    overflow-x: auto;
    border-radius: var(--border-radius);
    border: 1.5px solid var(--color-brand-light);
    box-shadow: 4px 4px 10px rgba(var(--color-brand-rgb), 0.1)
}

.simulator-tarifs-pro__table {
    width: 100%;
    background-color: white;
    overflow: hidden;
}

.simulator-tarifs-pro__row td {
    padding: 1.2rem 2rem;
    border-bottom: 1.5px solid var(--color-brand-light);
    vertical-align: middle;
}

.simulator-tarifs-pro__row:last-child td {
    border-bottom: none;
}

.simulator-tarifs-pro__row-label {
    font-size: var(--font-size-sm);
    color: rgba(var(--color-primary-rgb), 0.55);
    border-right: 1.5px solid var(--color-brand-light);
}

.simulator-tarifs-pro__row-value {
    font-family: var(--font-family-serif);
    font-size: 1.6rem;
    font-weight: 500;
    text-align: center;
    white-space: nowrap;
}

.simulator-tarifs-pro__row-value--net {
    color: var(--color-brand);
}

.simulator-tarifs-pro__annual {
    text-align: center;
    margin-top: 2rem;
    font-family: var(--font-family-serif);
    font-weight: 300;
    font-size: 3rem;
    color: var(--color-brand);
}

.simulator-tarifs-pro__annual strong {
    font-size: 6rem;
    font-weight: 300;
}
.compare-tarifs-pro {
    background: var(--color-beige-light);
    padding: 12rem 2rem;
}

.compare-tarifs-pro__inner {
    max-width: var(--content-max-width, 128rem);
    margin: 0 auto;
}

.compare-tarifs-pro__title {
    font-size: 4rem;
    font-weight: 300;
    text-align: center;
    margin-bottom: 3rem;
}

.compare-tarifs-pro__table-wrap {
    overflow-x: auto;
    border-radius: var(--border-radius, 0.8rem);
    border: 1.5px solid var(--color-beige-dark);
    max-width: 84rem;
    margin: 0 auto;
    box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
}

.compare-tarifs-pro__table {
    width: 100%;
    font-size: var(--font-size-base);
}
.compare-tarifs-pro__head-row th {
    background: var(--color-beige-dark);
    font-weight: 600;
    padding: 1.4rem 2rem;
    text-align: center;
    font-size: var(--font-size-sm);
    letter-spacing: 0.04em;
    border-bottom: 1px solid var(--color-beige-dark);
}

.compare-tarifs-pro__row td,
.compare-tarifs-pro__row th {
    padding: 1.4rem 2rem;
    border-bottom: 1.5px solid var(--color-beige-dark);
    vertical-align: middle;
    font-size: var(--font-size-sm);
    text-align: center;
}

.compare-tarifs-pro__row th {
    font-weight: 500;
}

.compare-tarifs-pro__row:last-child td {
    background-color: var(--color-white);
    border-bottom: none;
}

.compare-tarifs-pro__row--alt td,
.compare-tarifs-pro__row:not(.compare-tarifs-pro__row--alt):not(.compare-tarifs-pro__row--kookla) td {
    background: var(--color-white);
}

.compare-tarifs-pro__row--kookla td,
.compare-tarifs-pro__row--kookla th {
    color: var(--color-brand);
    font-weight: 500;
}

.compare-tarifs-pro__row--kookla td:last-child {
    text-transform: uppercase;
}

.compare-tarifs-pro__row th {
    background-color: var(--color-white);
}

.compare-tarifs-pro__row:last-child th {
    border-bottom: none;
}

.compare-tarifs-pro__outro {
    margin-top: 4rem;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.compare-tarifs-pro__outro-title {
    font-family: var(--font-family-serif);
    font-size: 2.6rem;
    font-weight: 400;
    color: var(--color-brand);
    text-align: center;
}

.compare-tarifs-pro__outro-line {
    display: block;
    width: 1.5px;
    height: 0;
    background: var(--color-brand-very-light);
    margin: 1.6rem 0 0;
    transition: height 1.5s ease;
    box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
}

.compare-tarifs-pro__outro-line.is-visible {
    height: 5rem;
}

.compare-tarifs-pro__outro-bubble {
    width: 6.4rem;
    height: 6.4rem;
    border-radius: 50%;
    background: var(--color-white);
    border: 1.5px solid var(--color-beige-dark);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
}

.compare-tarifs-pro__outro-bubble svg {
    width: 2.4rem;
    height: 2.4rem;
}

.compare-tarifs-pro__outro-text {
    font-family: var(--font-family-serif);
    font-size: 5rem;
    font-weight: 300;
    color: var(--color-brand);
    line-height: 1.5;
    text-align: center;
    max-width: 95rem;
}

.faq-tarifs-pro {
    padding: 12rem 2rem;
    background-color: var(--color-white);
}

.faq-tarifs-pro__inner {
    max-width: var(--content-max-width, 128rem);
    padding: 0 var(--container-padding-x);
    margin: 0 auto;
    display: flex;
}

.faq-tarifs-pro__left {
    flex: 0 0 30%;
}

.faq-tarifs-pro__sticky {
    position: sticky;
    top: 10rem;
}

.faq-tarifs-pro__title {
    font-size: 12rem;
    font-weight: 300;
}

.faq-tarifs-pro__list {
    flex: 1;
}

.cta-tarifs-pro {
    background: var(--color-beige-light);
}

.cta-tarifs-pro__inner {
    max-width: var(--content-max-width, 128rem);
    margin: 0 auto;
    padding: 12rem 2rem 0;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.cta-tarifs-pro__hero {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-bottom: 2rem;
}

.cta-tarifs-pro__title {
    font-size: 6rem;
    font-weight: 300;
    margin-bottom: 3rem;
}

.cta-tarifs-pro__desc {
    margin-bottom: 5rem;
}

.cta-tarifs-pro__action {
    margin-bottom: 0;
}

.cta-tarifs-pro__connector {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.cta-tarifs-pro__connector-line {
    display: block;
    width: 1.5px;
    height: 0;
    background: var(--color-brand-very-light);
    transition: height 1.5s ease;
}

.cta-tarifs-pro__connector.is-visible .cta-tarifs-pro__connector-line {
    height: 12rem;
}

.cta-tarifs-pro .contact-home-pro {
    padding-top: 2rem;
    background: var(--color-beige-light);
}

.page-template-page-aide-pro .contact-home-pro,
.single-guide_pratique .contact-home-pro {
    background: var(--color-beige-light);
}


/* =========================================================================
   ESPACE CLIENT — Mon compte BtoC (.account-btoc)
   ========================================================================= */

/* ── Wrapper principal ── */

.account-btoc {
    background: var(--color-beige-light);
    padding: 3rem 0 6rem;
}

.account-btoc__inner {
    display: flex;
    align-items: flex-start;
    gap: 2.4rem;
    max-width: var(--container-max-width);
    padding: 0 var(--container-padding-x);
    margin: 0 auto;
}

/* ── Sidebar navigation ── */

.account-btoc__sidebar {
    flex-shrink: 0;
    width: 22rem;
    background: var(--color-white);
    border-radius: var(--border-radius-lg);
    overflow: hidden;
    box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
    position: sticky;
    top: 9rem;
}

.account-btoc__nav-fade {
    display: none;
}

.account-btoc__nav {
    list-style: none;
    margin: 0;
}

.account-btoc__nav li + li {
    border-top: 1.5px solid var(--color-beige-dark);
}

.account-btoc__nav li a {
    display: block;
    padding: 1.1rem 1.8rem;
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    text-decoration: none;
    transition: background 0.15s, color 0.15s;
}

.account-btoc__nav li:first-child a {
    padding-top: 1.3rem;
}

.account-btoc__nav li:last-child a {
    padding-bottom: 1.3rem;
}

.account-btoc__nav li a:hover {
    background: var(--color-beige-dark);
    color: var(--color-brand);
}

.account-btoc__nav li.is-active a,
.account-btoc__nav li.woocommerce-MyAccount-navigation-link--is-active a {
    color: var(--color-brand);
    font-weight: 600;
    background: var(--color-beige-dark);
}

/* ── Contenu principal ── */

.account-btoc__main {
    flex: 1;
    min-width: 0;
    background: var(--color-white);
    border-radius: var(--border-radius-lg);
    padding: 3.2rem;
    box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
}

.account-btoc__main h2 {
	font-size: 2.4rem;
	margin: 0 0 1.4rem;
	font-weight: 500;
}

.account-btoc__main .conf-resa__banner h2 {
	font-size: 3rem;
	margin: 0 0 1.4rem;
	color: var(--color-green);
	font-weight: 400;
}

.account-btoc__main.account-btoc__main--prise-de-rdv h2 {
    font-size: 1.1rem;
    margin: 3rem 0 2.4rem;
}

.account-btoc__main h3 {
	font-size: 1.8rem;
	color: var(--color-brand);
	margin: 0 0 2.2rem;
	text-align: center;
	font-weight: 500;
}

.woocommerce-edit-account .account-btoc__main h3 {
	font-size: 1.4rem;
	margin: 0 0 0.8rem;
	text-align: left;
}

.woocommerce-mes-kcoins .account-btoc__main h3 {
	font-size: 1.8rem;
    margin-bottom: 2rem;
}

.woocommerce-mon-parrainage .account-btoc__main h3 {
    margin-top: 4rem;
    font-size: 1.8rem;
}

/* ── Dashboard ── */

.account-btoc__dashboard-welcome {
    font-size: var(--font-size-base);
    color: var(--color-primary);
    margin-bottom: 2.4rem;
    padding-bottom: 2.4rem;
    border-bottom: 1px solid rgba(var(--color-primary-rgb), 0.08);
    font-weight: 500;
}

.account-btoc__dashboard-welcome strong {
    color: var(--color-brand);
}

.account-btoc__dashboard-links {
    display: flex;
    flex-wrap: wrap;
    gap: 1.2rem;
}

.account-btoc__dashboard-card {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.4rem 2rem;
    border: 1px solid rgba(var(--color-primary-rgb), 0.1);
    border-radius: var(--border-radius);
    color: var(--color-primary);
    text-decoration: none;
    font-size: var(--font-size-sm);
    font-weight: 500;
    background: var(--color-beige-light);
    transition: border-color 0.15s, color 0.15s, background 0.15s;
}

.account-btoc__dashboard-card:hover {
    border-color: var(--color-brand);
    color: var(--color-brand);
    background: var(--color-white);
}

/* ── Tableau commandes ── */

.account-btoc__orders-table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--font-size-sm);
}

.account-btoc__remb-intro {
	font-size: var(--font-size-xs);
	max-width: 600px;
	margin-bottom: 2rem;
}

.account-btoc__orders-table thead th {
	text-align: left;
	padding: 0.8rem 0;
	font-weight: 600;
	font-size: var(--font-size-xs);
	color: rgba(var(--color-primary-rgb), 0.6);
	border-bottom: 1.5px solid var(--color-beige-dark);
}

.account-btoc__orders-table thead th:last-child,
.account-btoc__orders-table tbody tr td:last-child {
    text-align: right;
}

.account-btoc__orders-table tbody tr {
    border-bottom: 1.5px solid var(--color-beige-dark);
}

.account-btoc__orders-table tbody tr:last-child {
    border-bottom: none;
}

.account-btoc__orders-table tbody td,
.account-btoc__orders-table tbody th {
    padding: 1.2rem 0;
    vertical-align: middle;
    color: var(--color-primary);
    font-size: var(--font-size-xs);
}

.account-btoc__orders-table a {
    color: var(--color-brand);
    text-decoration: none;
    font-weight: 500;
}

.account-btoc__orders-table a:hover {
    text-decoration: underline;
}

.account-btoc__order-status {
    display: inline-block;
    padding: 0.3rem 0.8rem;
    border-radius: 99px;
    font-size: var(--font-size-xs);
    font-weight: 500;
}

.account-btoc__order-status--completed  { background: #d1fae5; color: #065f46; }
.account-btoc__order-status--processing { background: #dbeafe; color: #1e40af; }
.account-btoc__order-status--pending    { background: #fef9c3; color: #854d0e; }
.account-btoc__order-status--cancelled  { background: #fee2e2; color: #991b1b; }
.account-btoc__order-status--refunded   { background: #f3f4f6; color: #374151; }
.account-btoc__order-status--on-hold    { background: #ede9fe; color: #5b21b6; }
.account-btoc__order-status--default    { background: #f3f4f6; color: var(--color-primary); }

.account-btoc__orders-empty {
    text-align: center;
    padding: 4rem 2rem;
    color: rgba(var(--color-primary-rgb), 0.55);
    font-size: var(--font-size-base);
}

/* ── Détail commande ── */

.account-btoc__order-info {
    background: var(--color-beige-light);
    border: 1px solid rgba(var(--color-primary-rgb), 0.1);
    border-radius: var(--border-radius);
    padding: 1.6rem 2rem;
    margin-bottom: 2.4rem;
    font-size: var(--font-size-sm);
    color: var(--color-primary);
    line-height: 1.6;
}

.account-btoc__order-updates {
    list-style: none;
    margin: 0 0 2.4rem;
    padding: 0;
}

.account-btoc__order-updates li {
    border-left: 3px solid var(--color-brand);
    padding: 0.8rem 0 0.8rem 1.4rem;
    margin-bottom: 1rem;
}

.account-btoc__order-updates time {
    display: block;
    font-size: var(--font-size-xs);
    color: rgba(var(--color-primary-rgb), 0.5);
    margin-bottom: 0.4rem;
}

/* ── Formulaire modification compte ── */

.account-btoc__form {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.account-btoc__form-section {
    padding: 2.4rem 0;
    border-top: 1.5px solid var(--color-beige-dark);
}

.account-btoc__form.woocommerce-EditAccountForm.edit-account .account-btoc__form-section:nth-child(3) {
    padding-top: 1.6rem;
}

.account-btoc__form-section:first-child {
    padding-top: 0;
    border-top: none;
}

.account-btoc__form-section-title {
    font-size: var(--font-size-lg);
    font-weight: 600;
    color: var(--color-primary);
    margin: 0 0 2rem;
}

.account-btoc__form-actions {
    padding-top: 2.4rem;
    border-top: 1.5px solid var(--color-beige-dark);
    display: flex;
    justify-content: flex-end;
}

/* ── Adresses ── */

.account-btoc__addresses {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(26rem, 1fr));
    gap: 2rem;
}

.account-btoc__address-card {
    border: 1px solid rgba(var(--color-primary-rgb), 0.1);
    border-radius: var(--border-radius);
    padding: 2rem;
}

.account-btoc__address-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.2rem;
}

.account-btoc__address-card-title {
    font-size: var(--font-size-base);
    font-weight: 600;
    color: var(--color-primary);
    margin: 0;
}

.account-btoc__address-edit {
    font-size: var(--font-size-xs);
    color: var(--color-brand);
    text-decoration: none;
    font-weight: 500;
}

.account-btoc__address-edit:hover {
    text-decoration: underline;
}

.account-btoc__address-text {
    font-size: var(--font-size-sm);
    color: rgba(var(--color-primary-rgb), 0.7);
    line-height: 1.6;
}

.account-btoc__address-empty {
    font-size: var(--font-size-sm);
    color: rgba(var(--color-primary-rgb), 0.45);
    font-style: italic;
}

/* ── WooCommerce notices dans l'espace compte ── */

.account-btoc .woocommerce-message,
.account-btoc .woocommerce-info,
.account-btoc .woocommerce-error {
    list-style: none;
    margin: 0 0 2.4rem;
    padding: 1.4rem 1.8rem;
    border-radius: var(--border-radius);
    font-size: var(--font-size-sm);
}

.account-btoc .woocommerce-message {
    background: #d1fae5;
    color: #065f46;
    border: 1px solid #a7f3d0;
}

/* .account-btoc .woocommerce-error {
    background: var(--color-alert-light);
    color: var(--color-alert);
    border: 1px solid rgba(var(--color-alert-rgb), 0.3);
} */

.woocommerce-error {
	background-color: var(--color-brand-very-light)!important;
	color: var(--color-brand)!important;
	border-left: 4px solid var(--color-brand)!important;
	padding-block: 2rem!important;
}

.woocommerce-error::before {
    display: none;
}

.woocommerce-checkout {
	background-color: var(--color-beige-dark)!important;
}

/* =========================================================================
   ESPACE CLIENT — Réservations, Séances, Kcoins, Parrainage
   ========================================================================= */

/* ── Messages vides ── */

.account-btoc__empty-notice {
    color: rgba(var(--color-primary-rgb), 0.55);
    font-size: var(--font-size-sm);
}

/* ── Carte réservation ── */

.account-btoc__reservations {
    display: flex;
    flex-direction: column;
    gap: 1.4rem;
}

.account-btoc__resa-card {
    border: 1.5px solid var(--color-beige-dark);
    border-radius: var(--border-radius-lg);
    overflow: hidden;
    scroll-margin-top: 8rem;
}
.account-btoc__resa-card--collapsed .account-btoc__resa-body {
    display: none;
}
.account-btoc__resa-toggle {
    background: none;
    border: none;
    padding: 0.25rem;
    cursor: pointer;
    color: var(--color-primary);
    opacity: 0.65;
    flex-shrink: 0;
    line-height: 0;
    transition: opacity 0.15s;
}
.account-btoc__resa-toggle:hover {
    opacity: 0.85;
}
.account-btoc__resa-toggle svg {
    transition: transform 0.22s ease;
}
.account-btoc__resa-toggle[aria-expanded="true"] svg {
    transform: rotate(180deg);
}

.account-btoc__resa-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
    padding: 1.6rem 2rem;
    background: var(--color-beige-dark);
}

.account-btoc__resa-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 2.5rem;
    align-items: center;
}

.account-btoc__resa-id {
    font-weight: 600;
    font-size: var(--font-size-sm);
    color: var(--color-brand);
    position: relative;
}

.account-btoc__resa-id::after {
	content: '';
	position: absolute;
	right: -14px;
	top: 7.5px;
	width: 3px;
	height: 3px;
	background: var(--color-brand);
	border-radius: 50%;
}

.account-btoc__resa-date,
.account-btoc__resa-centre {
    font-size: var(--font-size-sm);
    color: rgba(var(--color-primary-rgb), 0.65);
}

.account-btoc__resa-badges {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.account-btoc__resa-card.account-btoc__resa-card--collapsed .account-btoc__resa-badges {
    display: none;
}

.account-btoc__resa-prix {
    font-weight: 600;
    font-size: var(--font-size-sm);
    color: var(--color-primary);
}

/* Statuts réservation */
.account-btoc__res-statut {
    display: inline-block;
    padding: 0.8rem 1.4rem;
    border-radius: 5px;
    font-size: 1rem;
    font-weight: 500;
}

.account-btoc__res-statut--pending    { background: #fef9c3; color: #854d0e; }
.account-btoc__res-statut--confirmed  { background: #dbeafe; color: #1e40af; }
.account-btoc__res-statut--completed  { background: #d1fae5; color: #065f46; }
.account-btoc__res-statut--cancelled  { background: #fee2e2; color: #991b1b; }
.account-btoc__res-statut--refunded   { background: #ede9fe; color: #5b21b6; }
.account-btoc__res-statut--default    { background: #f3f4f6; color: var(--color-primary); }

/* Sections internes de la carte */
.account-btoc__resa-section {
    padding: 3rem;
    border-top: 1.5px solid var(--color-beige-dark);
}

.page-template-page-mon-compte-pro .account-btoc__resa-section {
    padding: 2.4rem 3rem 3rem;
}

.account-btoc__resa-section:first-child {
    border-top: none;
}

.account-btoc__resa-section-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 600;
    margin: 0 0 1.6rem;
    font-family: var(--font-family);
    color: var(--color-primary);
}

.account-btoc__resa-section:last-of-type .account-btoc__resa-section-title {
    margin: 0 0 1rem;
}

.account-btoc__resa-seance-count {
	text-transform: none;
	letter-spacing: 0;
	color: white;
	background: var(--color-brand);
	border-radius: 50%;
	width: 2rem;
	height: 2rem;
	text-align: center;
	line-height: 1.8;
	font-size: 1.1rem;
	font-weight: 600;
}

.account-btoc__resa-seance-count span {
	position: relative;
	left: -0.5px;
	top: 0.5px;
}

/* Section tarification */
.account-btoc__resa-section--pricing {
    padding: 2rem 3rem;
}

.account-btoc__pricing {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    max-width: 26rem;
    margin-left: auto;
}

.account-btoc__pricing-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 1rem;
    font-size: var(--font-size-xs);
    color: rgba(var(--color-primary-rgb), 0.7);
}

.account-btoc__pricing-row--remise {
    color: var(--color-green);
}

.account-btoc__pricing-row--total {
    border-top: 1.5px solid var(--color-beige-dark);
    padding-top: 0.6rem;
    margin-top: 0.4rem;
    color: var(--color-primary);
}

.account-btoc__pricing-label {
    flex: 1;
}

.account-btoc__pricing-value {
    font-weight: 500;
    white-space: nowrap;
}

.account-btoc__pricing-value--striked {
    text-decoration: line-through;
    font-weight: 400;
    color: rgba(var(--color-primary-rgb), 0.4);
}

.account-btoc__pricing-value--remise {
    font-weight: 500;
    color: var(--color-green);
}
.account-btoc__pricing-value--kcoin {
    color: var(--color-green);
}

.account-btoc__pricing-value--total {
    font-weight: 700;
}

/* ── Bouton remboursement ── */
.account-btoc__remb-btn {
    font-size: 1.1rem;
    padding: 0.9rem 1.2rem;
    border-color: rgba(var(--color-brand-rgb), 0.3);
    color: rgba(var(--color-brand-rgb), 0.9);
}

.account-btoc__remb-btn:hover {
    border-color: rgba(var(--color-brand-rgb), 1);
    color: rgba(var(--color-brand-rgb), 1);
}

/* ── Modal confirmation remboursement ── */
.account-btoc__modal {
    position: fixed;
    inset: 0;
    z-index: 9000;
    display: flex;
    align-items: center;
    justify-content: center;
}

.account-btoc__modal[hidden] {
    display: none;
}

.account-btoc__modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(var(--color-beige-dark-rgb), 0.5);
    cursor: pointer;
}

.account-btoc__modal-inner {
    position: relative;
    z-index: 1;
    background: var(--color-white);
    border-radius: var(--border-radius);
    padding: 3.2rem;
    max-width: 48rem;
    width: calc(100% - 3.2rem);
    box-shadow: 20px 20px 15px rgba(var(--color-primary-rgb), 0.15);
}

.account-btoc__modal-close-btn {
	position: absolute;
	top: 0.85rem;
	right: 0.85rem;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.4rem;
	height: 2.4rem;
	border-radius: 50%;
	background: var(--color-beige-dark);
	border: none;
	cursor: pointer;
	color: var(--color-brand);
	transition: background 0.15s, color 0.15s;
}

.account-btoc__modal-close-btn:hover {
    background: var(--color-brand);
    color: var(--color-beige-dark);
}

.account-btoc__main h3 {
	font-size: 2rem;
	color: var(--color-brand);
	margin: 0 0 1.2rem;
	text-align: center;
	font-weight: 500;
}

.js-ci-modal-seance {
	margin: 0 0 2.5rem;
	font-size: 1.1rem;
	text-align: center;
	font-weight: 500;
    color: var(--color-brand);
}

.account-btoc__modal-body {
	font-size: var(--font-size-sm);
	margin: 0 0 1.2rem;
}

.account-btoc__modal-actions {
	display: flex;
	gap: 1.2rem;
	flex-wrap: wrap;
	padding-top: 2rem;
	border-top: 1px solid var(--color-beige-dark);
	margin-top: 2rem;
	justify-content: flex-end;
}

.account-btoc__modal-feedback {
	font-size: var(--font-size-sm);
	padding: 1.4rem 2.4rem;
	border-radius: var(--border-radius-lg);
	line-height: 1.5;
}

.account-btoc__modal-feedback--success {
    background: var(--color-green);
    color: white;
}

.account-btoc__modal-feedback--error {
    background: #fee2e2;
    color: #991b1b;
}

.account-btoc__resa-id-badge--refunded-ci {
    display: inline-block;
    margin-left: 0.6rem;
    padding: 0.1rem 0.7rem;
    background: #ede9fe;
    color: #5b21b6;
    border-radius: 9999px;
    font-size: 1.15rem;
    font-weight: 600;
    vertical-align: middle;
}

.account-btoc__ci-refund-notice {
	padding: 1.2rem 3rem;
	font-size: var(--font-size-sm);
	border-top: 1px solid var(--color-beige-dark);
	background-color: var(--color-beige-dark);
	color: var(--color-brand);
}

.account-btoc__ci-refund-notice .link-animated {
    font-weight: 600;
}

.account-btoc__ci-success-toast {
    position: fixed;
    bottom: 2.4rem;
    left: 50%;
    transform: translateX(-50%);
    background: var(--color-green);
    color: white;
    padding: 1.4rem 2.4rem;
    border-radius: var(--border-radius-lg);
    font-size: var(--font-size-sm);
    line-height: 1.5;
    z-index: 9999;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.14);
    text-align: center;
    max-width: 48rem;
    width: calc(100% - 3.2rem);
}

/* ── Table prestations ── */

.account-btoc__prestations-table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--font-size-sm);
}

.account-btoc__prestations-table thead th {
    text-align: left;
    padding: 0.6rem 0;
    font-size: var(--font-size-xs);
    font-weight: 600;
    color: rgba(var(--color-primary-rgb), 0.55);
    border-bottom: 1.5px solid var(--color-beige-dark);
}

.account-btoc__prestations-table thead th:last-child,
.account-btoc__prestations-table tbody td:last-child {
    text-align: right;
}

.account-btoc__prestations-table tbody td {
    padding: 1rem 0;
    color: var(--color-primary);
    border-bottom: 1.5px solid var(--color-beige-dark);
    font-size: var(--font-size-xs);
}

.account-btoc__prestations-table tbody tr:last-child td {
    border-bottom: none;
}

.account-btoc__prestations-table--compact thead {
    display: none;
}

/* ── Séances ── */

.account-btoc__seances-list {
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
}

.account-btoc__seance-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.8rem;
    padding: 1.4rem 1.4rem;
    background: var(--color-beige-light);
    border-radius: var(--border-radius);
    border-left: 3px solid rgba(var(--color-brand-rgb), 0.35);
    box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
}

/* Séance en cours : peut être programmée */
.account-btoc__seance-item--current {
    border-left-color: var(--color-brand);
}

/* Séance verrouillée : en attente de la précédente */
.account-btoc__seance-item--locked {
    border-left-color: rgba(var(--color-brand-rgb), 0.35);
}

.account-btoc__seance-locked-note {
    font-size: var(--font-size-xs);
    color: rgba(var(--color-primary-rgb), 0.65);
    font-style: italic;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.account-btoc__seance-locked-note svg {
    position: relative;
    top: -0.5px;
}

.account-btoc__seance-confirmed-badge {
	font-size: 1.1rem;
	font-weight: 500;
	color: var(--color-green);
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
}

.account-btoc__seance-absence-notice {
	font-size: var(--font-size-xs);
	font-weight: 500;
	color: var(--color-brand);
}

.account-btoc__seance-absence-notice--accordee {
	color: var(--color-green);
}

.account-btoc__seance-absence-notice--reprogrammee {
	color: var(--color-brand);
}

.account-btoc__seance-absence-notice--non-realisable {
	color: var(--color-brand);
}

.account-btoc__seance-absence-notice--ci-pending {
	color: var(--color-brand);
}

.account-btoc__seance-left {
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
}

.account-btoc__seance-left-top {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.account-btoc__seance-num {
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-primary);
}

.account-btoc__seance-date {
    font-size: var(--font-size-xs);
    color: rgba(var(--color-primary-rgb), 0.65);
}

.account-btoc__seance-item--current .account-btoc__seance-date {
    color: var(--color-brand);
    font-weight: 500;
}

.account-btoc__seance-date--pending {
    font-style: italic;
}

.account-btoc__seance-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.8rem;
}

/* Statuts séance */
.account-btoc__seance-statut {
    display: inline-block;
    padding: 0.5rem 1rem;
    border-radius: 5px;
    font-size: 1rem;
    font-weight: 600;
    color: rgba(var(--color-primary-rgb), 0.65);
    background-color: white;
}

/* ── Contre-indication ── */

.account-btoc__ci-btn {
    border-color: rgba(var(--color-brand-rgb), 0.3);
    color: rgba(var(--color-brand-rgb), 0.9);
    font-size: 1.1rem;
    padding: 0.9rem 1.2rem;
}

.account-btoc__ci-btn:hover {
    border-color: rgba(var(--color-brand-rgb), 1);
    color: rgba(var(--color-brand-rgb), 1);
}

.account-btoc__ci-form {
    width: 100%;
    max-width: 34rem;
    background: var(--color-white);
    border: 1px solid rgba(var(--color-primary-rgb), 0.12);
    border-radius: var(--border-radius);
    padding: 1.2rem;
}

.account-btoc__ci-intro {
    font-size: var(--font-size-xs);
    color: rgba(var(--color-primary-rgb), 0.65);
    margin: 0 0 0.8rem;
    line-height: 1.5;
}

.account-btoc__ci-textarea {
	width: 100%;
	font-size: var(--font-size-sm);
	font-family: var(--font-family);
	color: var(--color-primary);
	background: var(--color-beige-light);
	border: 1px solid var(--color-beige-dark);
	border-radius: var(--border-radius-sm);
	padding: 1.2rem;
	resize: vertical;
	min-height: 13rem;
	line-height: 1.5;
    margin-bottom: 2rem;
}

.account-btoc__ci-textarea:focus {
    border-color: var(--color-brand);
    box-shadow: 0 0 0 3px rgba(var(--color-brand-rgb), 0.1);
    outline: none;
}

.js-ci-pj-name {
    font-size: 1rem;
    font-weight: 500;
}

.js-ci-pj-name + span {
    font-size: 0.9rem;
    color: rgba(var(--color-primary-rgb), 0.45);
}

.js-ci-pj-label {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.35rem;
	border: 1.5px dashed rgba(var(--color-primary-rgb), 0.15);
	border-radius: 10px;
	padding: 1rem;
	cursor: pointer;
	background: var(--color-beige-light);
	text-align: center;
	transition: border-color 0.15s,background 0.15s;
}

.js-ci-pj-label svg {
    stroke: rgba(var(--color-primary-rgb), 0.65);
}

.account-btoc__ci-actions {
    display: flex;
    gap: 0.8rem;
    margin-top: 0.8rem;
}

.account-btoc__ci-feedback {
    margin-top: 0.6rem;
    font-size: var(--font-size-xs);
}

.account-btoc__ci-feedback--success { color: #065f46; }
.account-btoc__ci-feedback--error   { color: var(--color-alert); }

.account-btoc__ci-sent {
	font-size: var(--font-size-sm);
	color: var(--color-brand);
	font-weight: 600;
}

.account-btoc__resa-completed-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	font-size: var(--font-size-xs);
	font-weight: 600;
	color: var(--color-green);
}

.account-btoc__resa-completed-badge svg {
    flex-shrink: 0;
}

/* ── Carte remboursement ── */

/* ── Encart info remboursements ── */
.account-btoc__remb-info {
    margin-top: 2rem;
}

.account-btoc__remb-info-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 1.4rem;
    font-size: var(--font-size-sm);
    line-height: 1.6;
}

.account-btoc__remb-info-list li {
    padding: 0.6rem 0 0.6rem 1.2rem;
    border-left: 2px solid var(--color-beige-dark);
}

.account-btoc__remb-info-list strong {
    display: block;
}

.account-btoc__remb-info-list a {
    color: var(--color-brand);
}

/* ── Carte remboursement ── */

.account-btoc__remb-list {
    display: flex;
    flex-direction: column;
    gap: 1.6rem;
}

.account-btoc__remb-card {
    border: 1px solid rgba(var(--color-primary-rgb), 0.1);
    border-radius: var(--border-radius-lg);
    overflow: hidden;
}

.account-btoc__remb-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
    padding: 1.4rem 1.8rem;
    background: var(--color-beige-light);
}

.account-btoc__remb-right {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.account-btoc__remb-motif {
    padding: 0.8rem 1.8rem;
    font-size: var(--font-size-sm);
    color: var(--color-primary);
    border-top: 1px solid rgba(var(--color-primary-rgb), 0.06);
    margin: 0;
}

.account-btoc__remb-card .account-btoc__prestations-table {
    padding: 0 1.8rem 1.4rem;
}

.account-btoc__remb-detail {
    border-top: 1px solid rgba(var(--color-primary-rgb), 0.06);
    padding: 1rem 1.8rem 1.4rem;
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
}

.account-btoc__remb-detail-line {
    padding: 0.8rem 1.2rem;
    background: #fefce8;
    border: 1px solid #fde68a;
    border-radius: var(--border-radius-sm);
}

.account-btoc__remb-detail-title {
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: #92400e;
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
    margin-bottom: 0.4rem;
}

.account-btoc__remb-detail-badge {
    font-size: 1rem;
    font-weight: 500;
    color: #92400e;
    background: #fef3c7;
    border: 1px solid #f59e0b;
    border-radius: 9999px;
    padding: 0.1rem 0.6rem;
}

.account-btoc__remb-detail-body {
    font-size: 1.1rem;
    color: #6b7280;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    padding-left: 0.8rem;
}

.account-btoc__remb-detail-kcoin {
    color: #7c3aed;
}

.account-btoc__remb-detail-net {
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: #92400e;
    margin-top: 0.3rem;
}

/* ── Kcoins ── */

.account-btoc__kcoin-balance-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1.6rem;
    background: var(--color-beige-light);
    border: 1.5px solid var(--color-beige-dark);
    border-radius: var(--border-radius-lg);
    padding: 2.4rem;
    margin-bottom: 5rem;
}

.account-btoc__kcoin-balance-left {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.account-btoc__kcoin-balance-value {
	font-size: 6rem;
	font-weight: 600;
	color: var(--color-brand);
	line-height: 1;
	font-family: var(--font-family-serif);
}

.account-btoc__kcoin-balance-label {
	font-size: var(--font-size-xs);
	color: rgba(var(--color-primary-rgb), 0.65);
	font-weight: 500;
}

.account-btoc__kcoin-balance-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.4rem;
}

.account-btoc__kcoin-euros {
    font-size: var(--font-size-xl);
    font-weight: 600;
    color: var(--color-primary);
}

.account-btoc__kcoin-rate {
    font-size: var(--font-size-xs);
    color: rgba(var(--color-primary-rgb), 0.5);
    margin-bottom: 0.8rem;
}

.account-btoc__kcoin-cta {
    margin-top: 0.4rem;
    padding: 0.7rem 1.2rem;
}

.account-btoc__kcoin-badge {
    display: inline-block;
    background: var(--color-beige-dark);
    color: var(--color-brand);
    font-size: var(--font-size-xs);
    font-weight: 600;
    padding: 0.25rem 0.7rem;
    border-radius: 99px;
}

.account-btoc__kcoin-row--credit td:first-child::before { content: ''; }
.account-btoc__kcoin-amount { font-weight: 600; font-size: var(--font-size-sm); }

.account-btoc__orders-table tbody td.account-btoc__kcoin-amount--credit { 
    color: var(--color-green); 
}

.account-btoc__orders-table tbody td.account-btoc__kcoin-amount--debit {
    color: var(--color-brand); 
}

.account-btoc__kcoin-note {
    display: block;
    font-size: var(--font-size-xs);
    color: rgba(var(--color-primary-rgb), 0.5);
    margin-top: 0.4rem;
}

.account-btoc__kcoin-statut {
    display: inline-block;
    padding: 0.2rem 0.6rem;
    border-radius: 99px;
    font-size: var(--font-size-xs);
}

.account-btoc__kcoin-statut--actif  { background: #d1fae5; color: #065f46; }
.account-btoc__kcoin-statut--expire { background: #f3f4f6; color: #6b7280; }
.account-btoc__kcoin-statut--annule { background: #fee2e2; color: #991b1b; }

/* ── Parrainage ── */

.account-btoc__parrainage-code-wrap {
    display: flex;
    justify-content: space-between;
    gap: 2rem;
    background: var(--color-beige-light);
    border: 1.5px solid var(--color-beige-dark);
    border-radius: var(--border-radius-lg);
    padding: 2rem 2.4rem;
    margin-bottom: 2.4rem;
}

.account-btoc__parrainage-code-label {
    font-size: 1rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: rgba(var(--color-primary-rgb), 0.55);
    margin: 0 0 0.6rem;
}

.account-btoc__parrainage-link-block {
    max-width: 50rem;
    width: 50rem;
}

.account-btoc__parrainage-code {
    font-size: 2.4rem;
    font-weight: 700;
    color: var(--color-brand);
    letter-spacing: 0.08em;
    margin: 0;
    line-height: 1;
}

.account-btoc__parrainage-link-row {
    display: flex;
    gap: 0.8rem;
}

.account-btoc__parrainage-link-input {
    flex: 1;
    font-size: var(--font-size-sm);
    font-family: var(--font-family);
    color: var(--color-primary);
    background: var(--color-white);
    border: 1.5px solid var(--color-beige-dark);
    border-radius: var(--border-radius-sm);
    padding: 1.1rem 1rem;
    cursor: text;
}

.account-btoc__parrainage-stats {
    display: flex;
    gap: 2rem;
    margin-bottom: 3.4rem;
}

.account-btoc__parrainage-stat {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1.6rem;
    background: var(--color-beige-light);
    border: 1.5px solid var(--color-beige-dark);
    border-radius: var(--border-radius);
}

.account-btoc__parrainage-stat-value {
    font-size: 2.8rem;
    font-weight: 700;
    color: var(--color-brand);
    line-height: 1;
}

.account-btoc__parrainage-stat-label {
    font-size: var(--font-size-xs);
    color: rgba(var(--color-primary-rgb), 0.55);
    margin-top: 0.4rem;
}

.account-btoc__parrainage-explain {
    margin-bottom: 2.4rem;
}

.account-btoc__parrainage-steps {
    padding-left: 1rem;
    font-size: var(--font-size-sm);
    color: var(--color-primary);
    line-height: 1.8;
    border-left: 2px solid var(--color-beige-dark);
}

.account-btoc__filleuls-table thead th:first-child {
    width: 22rem;
}

/* ── Bouton small ── */
.btn--sm {
    padding: 0.5rem 1.2rem;
    font-size: var(--font-size-xs);
}

/* ═══════════════════════════════════════════════════════════
   Bouton "Modifier le créneau" — séance BtoC
   ═══════════════════════════════════════════════════════════ */

.account-btoc__modifier-btn {
    font-size: 1.1rem;
    padding: 0.9rem 1.4rem 0.8rem;
    border-color: var(--color-brand);
    color: var(--color-brand);
    border-radius: 5px;
    text-decoration: none;
    display: inline-block;
    line-height: 1.4;
    transition: all 0.15s ease-in-out;
}

.account-btoc__modifier-btn:hover {
    background: var(--color-brand);
    color: #fff;
}

/* ═══════════════════════════════════════════════════════════
   Informations pratiques du centre
   ═══════════════════════════════════════════════════════════ */

.account-btoc__resa-section--centre {
    background: var(--color-beige-light);
}

.account-btoc__centre-info {
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
}
.account-btoc__centre-info-row {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
}

.account-btoc__centre-info-label {
	font-size: var(--font-size-xs);
	font-weight: 600;
	min-width: 100px;
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
}

.account-btoc__centre-info-value {
    font-size: var(--font-size-xs);
    color: var(--color-primary);
}
.account-btoc__centre-info-tel {
    text-decoration: none;
    color: var(--color-primary);
}
.account-btoc__centre-info-tel:hover {
    color: var(--color-brand);
    text-decoration: underline;
}
.account-btoc__centre-maps-link {
    color: var(--color-brand);
    text-decoration: none;
    white-space: nowrap;
    margin-top: 0.5rem;
    display: block;
}

/* ═══════════════════════════════════════════════════════════
   Page Prise de RDV — Choisir un créneau
   ═══════════════════════════════════════════════════════════ */

.account-btoc__back-link {
	font-size: var(--font-size-xs);
	color: var(--color-brand);
	font-weight: 500;
}

.account-btoc__prise-rdv-title {
	font-size: 1.1rem;
	color: rgba(var(--color-primary-rgb), 0.65);
	display: flex;
	align-items: center;
	gap: 0.75rem;
	flex-wrap: wrap;
	justify-content: center;
	flex-direction: column;
	font-family: var(--font-family);
	color: var(--color-primary);
}

.account-btoc__prise-rdv-subtitle {
	font-size: 2rem;
	font-weight: 400;
	color: var(--color-brand);
	font-family: var(--font-family-serif);
}

.account-btoc__prise-rdv-current {
    font-size: var(--font-size-xs);
    color: white;
    background-color: var(--color-green);
    border-radius: 5px;
    padding: 1.4rem 0;
    font-weight: 500;
    text-align: center;
}

.account-btoc__prise-rdv-current p:first-child {
    font-weight: 600;
}

.account-btoc__prise-rdv-current p:last-child {
    font-size: 1.1rem;
}

.account-btoc__prise-rdv-confirmed {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    background: #f0fdf4;
    border: 1px solid #86efac;
    border-radius: 8px;
    padding: 0.9rem 1.2rem;
    font-size: 0.9rem;
    font-weight: 600;
    color: #15803d;
    margin-top: 1rem;
}
.account-btoc__prise-rdv-confirmed svg {
    flex-shrink: 0;
    stroke: #16a34a;
}

.account-btoc__prise-rdv-infirme {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    background: #fef2f2;
    border: 1px solid #fca5a5;
    border-radius: 8px;
    padding: 0.9rem 1.2rem;
    font-size: 0.9rem;
    font-weight: 500;
    color: #b91c1c;
    margin-top: 1rem;
    margin-bottom: 0.5rem;
}
.account-btoc__prise-rdv-infirme svg {
    flex-shrink: 0;
    stroke: var(--color-brand);
}
.account-btoc__planning-nav {
	display: flex;
	align-items: center;
	gap: 2rem;
	margin: 4rem 0 2.6rem;
	justify-content: center;
}

.account-btoc__planning-nav-btn {
	background: none;
	border: none;
	border-radius: 4px;
	padding: 0.5rem 1rem;
	font-size: var(--font-size-xs);
	cursor: pointer;
	transition: all 0.15s ease-in-out;
	color: white;
	background: var(--color-brand);
	font-weight: 500;
}

.account-btoc__planning-nav-btn:hover:not(:disabled) {
    background: var(--color-brand-hover);
    transform: translateY(-2px);
}

.account-btoc__planning-nav-btn:disabled {
    opacity: 0.35;
    cursor: default;
}

.account-btoc__planning-nav-label {
    text-align: center;
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-primary);
}

/* ── Grille des créneaux ── */
.account-btoc__planning-grid {
    transition: opacity 0.2s ease;
    min-height: 3rem;
}
.account-btoc__planning-grid--loading {
    opacity: 0.35;
    pointer-events: none;
}
.account-btoc__planning-loading,
.account-btoc__planning-empty {
    font-size: 0.9rem;
    color: #888;
    padding: 1.5rem 0;
    text-align: center;
}

/* ── Endpoint prise-de-rdv : masquer la sidebar ── */
.account-btoc__inner:has(.account-btoc__main--prise-de-rdv) .account-btoc__sidebar {
    display: none;
}
.account-btoc__main--prise-de-rdv {
    flex: 1 1 auto;
    max-width: 100%;
}

/* ── Grille des créneaux : colonnes par jour ── */
.account-btoc__planning-days {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	/* border-radius: 10px; */
	overflow: hidden;
	/* border: 1px solid var(--color-beige-dark); */
}

.account-btoc__planning-day {
    border-right: 1.5px solid var(--color-beige-dark);
    display: flex;
    flex-direction: column;
}

.account-btoc__planning-day:last-child {
    border-right: none;
}

.account-btoc__planning-day-label {
	padding: 0 0 1.4rem;
	text-align: center;
}

.account-btoc__planning-day-label .kc-day-name {
	display: block;
	font-size: 1rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--color-primary);
}

.account-btoc__planning-day-label .kc-day-date {
	display: block;
	font-size: 1rem;
	font-weight: 400;
	color: rgba(var(--color-primary-rgb), 0.5);
	margin-top: 0.4rem;
}

.account-btoc__planning-day-slots {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 1rem;
	padding-inline: 1rem;
}

.account-btoc__planning-slot {
	display: block;
	width: 100%;
	text-align: center;
	border-radius: 3px;
	padding: 1rem 0.25rem;
	font-size: 1.1rem;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.1s ease-in-out;
	border: none;
	background-color: var(--color-beige-dark);
	color: var(--color-primary);
}
.account-btoc__planning-slot--past {
    background-color: transparent;
    background-image: repeating-linear-gradient(
        45deg,
        transparent,
        transparent 4px,
        rgba(var(--color-beige-dark-rgb), 0.7) 4px,
        rgba(var(--color-beige-dark-rgb), 0.7) 8px
    );
    color: rgba(var(--color-primary-rgb), 0.35);
    cursor: not-allowed;
    pointer-events: none;
}
.account-btoc__planning-slot--current {
    background-color: var(--color-brand);
    color: #fff;
    cursor: default;
}
.account-btoc__planning-slot--current:hover {
    background-color: var(--color-brand);
    opacity: 0.92;
}

.account-btoc__planning-day-empty {
	font-size: 1.1rem;
	color: rgba(var(--color-primary-rgb), 0.5);
	text-align: center;
	padding: 0 2rem;
	font-style: italic;
	line-height: 1.4;
	margin: 0;
}


.account-btoc__planning-slot:hover {
    background-color: var(--color-brand);
    color: white;
    box-shadow: 0 4px 4px rgba(var(--color-brand-rgb), 0.1);
}

.account-btoc__planning-slot--selected {
    border-color: var(--color-brand);
    background: var(--color-brand);
    color: #fff;
    box-shadow: 0 2px 8px rgba(212,116,108,0.25);
}

/* ── Panneau de confirmation ── */
.account-btoc__planning-confirm {
	margin-top: 2rem;
	border-top: 1.5px solid var(--color-beige-dark);
    padding-top: 2rem;
}

.account-btoc__prise-rdv .account-btoc__planning-confirm:not([hidden]) {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 3rem;
}

.account-btoc__planning-confirm-text {
	font-size: 1.1rem;
	color: rgba(var(--color-primary-rgb), 0.55);
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	font-weight: 500;
}

.account-btoc__prise-rdv .account-btoc__planning-confirm-text {
    font-size: var(--font-size-xs);
    font-weight: 500;
    color: var(--color-primary);
    display: initial;
}

.rbk-hold-countdown {
    text-align: right;
    font-size: var(--font-size-xs);
    margin-top: 0.5rem;
}

.account-btoc__planning-confirm-text strong {
	color: var(--color-brand);
	font-size: var(--font-size-sm);
    margin-top: 0.4rem;
}

#rbk-confirm-btn {
    width: 100%;
    margin-top: 2rem;
}

.account-btoc__planning-confirm-actions {
    display: flex;
    gap: 0.75rem;
    flex-wrap: nowrap;
    align-items: center;
}

.account-btoc__planning-confirm-feedback {
	font-size: 1.1rem;
	text-align: center;
	margin-top: 0.3rem;
	font-weight: 500;
}

.account-btoc__planning-confirm-feedback--success {
    color: var(--color-green);
}

.account-btoc__planning-confirm-feedback--error {
    color: var(--color-brand);
}
/* =========================================================================
   7. Fiche centre BtoC (.fc-*)
   ========================================================================= */

/* ── Variables locales ──────────────────────────────────────────────────── */
.fc-page {
	max-width: var(--container-max-width);
	margin: 0 auto;
	padding: 0 var(--container-padding-x);
}

/* ── Hero ───────────────────────────────────────────────────────────────── */
.fc-hero {
    background: var(--fc-warm);
}

.fc-hero__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5rem;
    padding-block: 5.4rem 6rem;
}

.fc-hero__title {
	font-family: var(--font-family-serif);
	font-weight: 500;
	font-size: 4rem;
	color: var(--color-brand);
	margin-bottom: 1.6rem;
}

.fc-hero__meta,
.rbk-header__meta {
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
}

.fc-hero__meta-row {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 1.35rem;
    color: rgba(var(--color-primary-rgb), 0.45);
}

.fc-hero__meta-row svg {
    color: rgba(var(--color-primary-rgb), 0.45);
    flex: none;
}

.fc-hero__meta-row a {
    color: rgba(var(--color-primary-rgb), 0.45);
}

.fc-hero__desc {
    margin-block: 4rem 2.6rem;
}

/* Galerie */
.fc-hero__gallery {
	display: grid;
	grid-template-columns: 2fr 1fr;
	grid-template-rows: 1fr 1fr;
	gap: 1.4rem;
	height: 50rem;
}

.fc-hero__gallery-main {
    grid-row: 1 / span 2;
    border-radius: 1.4rem;
    overflow: hidden;
    box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.2)
}

.fc-hero__gallery-side {
    display: contents;
}

.fc-hero__gallery-thumb {
    border-radius: 1.4rem;
    overflow: hidden;
    box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.2)
}

.fc-hero__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.35s ease;
}

/* Hover zoom sur les items de galerie */
.js-fc-lightbox-item {
    cursor: zoom-in;
}

.js-fc-lightbox-item:hover .fc-hero__img {
    transform: scale(1.05);
}

/* ── Lightbox ───────────────────────────────────────────────────────────── */
.fc-lightbox {
    position: fixed;
    inset: 0;
    z-index: 9000;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s ease;
}

.fc-lightbox.is-open {
    opacity: 1;
    pointer-events: all;
}

.fc-lightbox__overlay {
    position: absolute;
    inset: 0;
    background: rgba(var(--color-beige-dark-rgb), 0.9);
    cursor: zoom-out;
}

.fc-lightbox__img-wrap {
    position: relative;
    z-index: 1;
    max-width: min(90vw, 120rem);
    max-height: 80vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fc-lightbox__img {
    display: block;
    max-width: 100%;
    max-height: 90vh;
    border-radius: 1rem;
    box-shadow: 20px 20px 15px rgba(var(--color-primary-rgb), 0.15);
    object-fit: contain;
    transition: opacity 0.2s ease;
}

.fc-lightbox__img.is-loading {
    opacity: 0;
}

.fc-lightbox__close {
    position: absolute;
    top: 2rem;
    right: 2rem;
    z-index: 2;
    width: 4rem;
    height: 4rem;
    border-radius: 50%;
    background: var(--color-white);
    border: none;
    color: var(--color-primary);
    font-size: 1.8rem;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.15s;
}

.fc-lightbox__close:hover {
    color: var(--color-brand);
}

.fc-lightbox__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    width: 4.8rem;
    height: 4.8rem;
    border-radius: 50%;
    background: var(--color-brand);
    border: none;
    color: #fff;
    font-size: 2.4rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s, box-shadow 0.15s, transform 0.15s;
}

.fc-lightbox__nav:hover {
    background-color: var(--color-brand-hover);
    box-shadow: 0 4px 4px rgba(var(--color-brand-rgb), 0.1);
}

.fc-lightbox__nav--prev { left: 2rem; }
.fc-lightbox__nav--next { right: 2rem; }

.fc-lightbox__nav--prev:hover {
    transform: translateY(-50%) translateX(-4px);
}

.fc-lightbox__nav--next:hover {
    transform: translateY(-50%) translateX(4px);
}

.fc-lightbox__nav[hidden],
.fc-lightbox__nav.is-hidden {
    visibility: hidden;
    pointer-events: none;
}

.fc-lightbox__counter {
	position: absolute;
	bottom: 2rem;
	left: 50%;
	transform: translateX(-50%);
	z-index: 2;
	font-size: var(--font-size-xs);
	letter-spacing: 0.05em;
	pointer-events: none;
	font-weight: 500;
}

.fc-hero__gallery-placeholder {
    width: 100%;
    height: 100%;
    background: var(--color-beige-dark);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--fc-muted2);
}

/* ── Booking head ───────────────────────────────────────────────────────── */
.fc-booking-head {
    scroll-margin-top: 8rem;
    padding-block: 4rem 2rem;
    border-top: 1.5px solid rgba(var(--color-brand-rgb), 0.1);
}

#prestations {
    scroll-margin-top: 6rem;
}

.fc-booking-head__title {
	font-family: var(--font-family-serif);
	font-weight: 500;
	font-size: 3rem;
	color: var(--color-brand);
}

.fc-booking-head__sub {
	margin-top: 0.9rem;
	color: rgba(var(--color-primary-rgb), 0.65);
}

/* ── Layout 2 colonnes ──────────────────────────────────────────────────── */
.fc-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 37.2rem;
    gap: 4.6rem;
    align-items: start;
    padding-block: 3.2rem 7.2rem;
}

.fc-aside {
    display: flex;
    flex-direction: column;
    gap: 8rem;
}

/* ── Chooser (toggle genre) ─────────────────────────────────────────────── */
.fc-chooser {
    margin-bottom: 3.2rem;
    position: relative;
}

.fc-chooser__title {
	font-weight: 500;
	font-size: 2.2rem;
}

.fc-chooser__sub {
    color: rgba(var(--color-primary-rgb), 0.65);
    margin-top: 0.6rem;
}

.fc-chooser__genre-label {
	border: none;
	padding: 1rem 2.2rem;
	border-radius: 0.5rem;
	cursor: pointer;
	transition: background 0.15s, color 0.15s;
	background: var(--color-brand);
	color: #fff;
	width: fit-content;
	margin-top: 2rem;
	font-size: var(--font-size-xs);
	font-weight: 600;
}

.fc-toggle {
	display: inline-flex;
	background: #fff;
	border: 1px solid var(--color-beige-dark);
	border-radius: 1rem;
	padding: 0.5rem;
	margin-top: 1.4rem;
}

.fc-chooser__dot {
	position: absolute;
	width: 3.8rem;
	height: 3.8rem;
	border-radius: 50%;
	background: var(--color-brand-very-light);
	right: 0;
	bottom: 5px;
}

.fc-chooser__genre-label + .fc-chooser__dot {
    bottom: 1px;
}

.fc-chooser__dot::before {
	content: '';
	position: absolute;
	right: 100%;
	top: 50%;
	transform: translateY(-50%);
	width: 57rem;
	height: 1.5px;
	background: var(--color-brand-very-light);
}

.fc-chooser__genre-label + .fc-chooser__dot::before {
    width: 60rem;
}

.fc-toggle__btn {
	font-weight: 500;
    border: none;
	background: transparent;
	padding: 1rem 2.2rem;
	border-radius: 0.5rem;
	cursor: pointer;
	transition: background 0.15s, color 0.15s;
    color: rgba(var(--color-primary-rgb), 0.65);
}

.fc-toggle__btn.is-active {
    background: var(--color-brand);
    color: #fff;
}

.fc-toggle__btn:not(.is-active):hover {
    color: var(--color-brand);
}

/* ── Groupes de prix ────────────────────────────────────────────────────── */
.fc-price-group {
    margin-top: 4rem;
}

.fc-price-group__header {
	display: flex;
	align-items: center;
	gap: 1.2rem;
	margin-bottom: 0.8rem;
	position: relative;
	z-index: 2;
	padding-left: 4rem;
}

.fc-price-group__label {
	font-family: var(--font-family-serif);
	font-weight: 500;
	font-size: 2rem;
	color: var(--color-brand);
}

.fc-price-group__note {
    margin-top: 1.4rem;
    text-align: right;
    max-width: 60rem;
    margin-left: auto;
    font-size: 1.1rem;
    color: rgba(var(--color-primary-rgb), 0.55);
}

.fc-price-group__note strong {
    color: var(--color-brand);
    font-weight: 600;
}

/* ── Table des prix ─────────────────────────────────────────────────────── */
.fc-table-wrap {
    padding-top: 3rem;
    position: relative;
    box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
    border-radius: 20px;
    background-color: var(--color-white);
    padding: 4rem 4rem 5rem;
}

.fc-prices {
    width: 100%;
    border-collapse: collapse;
}

.fc-prices thead th {
    font-weight: 600;
    font-size: var(--font-size-xs);
    color: rgba(var(--color-primary-rgb), 0.55);
    text-align: left;
    padding: 0 0 0.8rem;
    vertical-align: bottom;
    border-bottom: 1.5px solid var(--color-beige-dark);
    white-space: nowrap;
}

.fc-prices__th--pack {
    text-align: center !important;
}

.fc-pack-badge {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 4.6rem;
    height: 4.6rem;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 82.2 82.2'%3E%3Cpath fill='%23d4746c' d='M82.2,41.1c0,2.1-3.1,3.9-3.4,6-.3,2.1,2.1,4.8,1.4,6.7-.6,2-4.2,2.8-5.1,4.6-.9,1.9.5,5.2-.7,6.8-1.2,1.7-4.8,1.3-6.3,2.8-1.5,1.5-1.1,5.1-2.8,6.3-1.7,1.2-5-.2-6.8.7-1.8.9-2.6,4.5-4.6,5.1-2,.6-4.7-1.8-6.7-1.4-2,.3-3.9,3.4-6,3.4s-3.9-3.1-6-3.4c-2.1-.3-4.8,2.1-6.7,1.4-2-.6-2.8-4.2-4.6-5.1-1.9-.9-5.2.5-6.8-.7-1.7-1.2-1.3-4.8-2.8-6.3-1.5-1.5-5.1-1.1-6.3-2.8-1.2-1.7.2-5-.7-6.8-.9-1.8-4.5-2.6-5.1-4.6-.6-2,1.8-4.7,1.4-6.7-.3-2-3.4-3.9-3.4-6s3.1-3.9,3.4-6c.3-2.1-2.1-4.8-1.4-6.7.6-2,4.2-2.8,5.1-4.6.9-1.9-.5-5.2.7-6.8,1.2-1.7,4.8-1.3,6.3-2.8,1.5-1.5,1.1-5.1,2.8-6.3,1.7-1.2,5,.2,6.8-.7,1.8-.9,2.6-4.5,4.6-5.1,2-.6,4.7,1.8,6.7,1.4,2-.3,3.9-3.4,6-3.4s3.9,3.1,6,3.4c2.1.3,4.8-2.1,6.7-1.4,2,.6,2.8,4.2,4.6,5.1,1.9.9,5.2-.5,6.8.7,1.7,1.2,1.3,4.8,2.8,6.3,1.5,1.5,5.1,1.1,6.3,2.8,1.2,1.7-.2,5,.7,6.8.9,1.8,4.5,2.6,5.1,4.6.6,2-1.8,4.7-1.4,6.7.3,2,3.4,3.9,3.4,6Z'/%3E%3C/svg%3E") center / contain no-repeat;
    color: #fff;
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0 auto 0.9rem;
}

.fc-prices tbody td {
	padding: 1rem 0;
	border-bottom: 1.5px solid var(--color-beige-dark);
	vertical-align: middle;
	font-size: var(--font-size-sm);
}

.fc-prices tbody td.fc-prices__pack,
.fc-prices thead th.fc-prices__th--pack {
    background-color: var(--color-beige-light);
}

.fc-prices tbody tr:last-child td {
    border-bottom: 0;
}

.fc-prices thead th.fc-prices__th--pack {
    padding-top: 1.8rem;
}

.fc-prices thead th.fc-prices__th--pack:nth-child(3) {
    border-top-left-radius: 1rem;
    position: relative;
}

.fc-prices thead th.fc-prices__th--pack:nth-child(3)::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 1.5px;
    height: 100%;
    background: repeating-linear-gradient(
        to bottom,
        var(--color-beige-dark) 0px,
        var(--color-beige-dark) 5px,
        transparent 5px,
        transparent 10px
    );
}

.fc-prices thead th.fc-prices__th--pack:nth-child(4) {
    border-top-right-radius: 1rem;
}

.fc-prices tbody tr td.fc-prices__pack {
    position: relative;
}

.fc-prices tbody tr:last-child td.fc-prices__pack:nth-child(3)::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    height: 1rem;
    background: var(--color-beige-light);
    border-bottom-left-radius: 1rem;
}

.fc-prices tbody tr:last-child td.fc-prices__pack:nth-child(4)::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    height: 1rem;
    background: var(--color-beige-light);
    border-bottom-right-radius: 1rem;
}

.fc-prices tbody tr td.fc-prices__pack:nth-child(3)::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 1px;
    height: 100%;
    background: repeating-linear-gradient(
        to bottom,
        var(--color-beige-dark) 0px,
        var(--color-beige-dark) 5px,
        transparent 5px,
        transparent 10px
    );
}

.fc-prices__unit {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    font-weight: 600;
}

.fc-prices__pack {
    text-align: center;
    background: var(--fc-warm);
}

.fc-prices__was {
	display: block;
	font-size: 1rem;
	text-decoration: line-through;
	line-height: 1.2;
	color: rgba(var(--color-primary-rgb), 0.55);
	font-weight: 600;
}

.fc-prices__now {
	display: block;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	margin-top: 0.1rem;
}

.fc-prices__na {
    color: var(--fc-muted2);
}

.fc-prices__choose {
    text-align: right;
}

.fc-prices__choose-btn {
	font-size: 1.15rem;
	font-weight: 600;
	color: #fff;
	background: var(--color-brand);
	border: none;
	border-radius: 0.8rem;
	padding: 1rem 1.6rem;
	cursor: pointer;
	transition: all 0.15s;
	white-space: nowrap;
}

.fc-prices__choose-btn:hover {
    background: var(--color-brand-hover);
    transform: translateY(-2px);
    box-shadow: 0 4px 4px rgba(var(--color-brand-rgb), 0.1);
}

.fc-prices__choose-btn--disabled,
.fc-prices__choose-btn[disabled] {
    background: var(--color-beige-light);
    color: rgba(var(--color-brand-rgb), 0.35);
    pointer-events: none;
    transform: none;
    box-shadow: none;
}

.fc-prices__choose-btn--disabled:hover,
.fc-prices__choose-btn[disabled].reg-form__next:hover {
    cursor: not-allowed;
}

.fc-annuaire-notice {
	display: flex;
	align-items: flex-start;
	gap: 0.8rem;
	padding: 2.2rem 1.6rem;
	border-radius: 0.8rem;
	font-size: var(--font-size-sm);
	line-height: 1.5;
	margin-bottom: 3rem;
	font-weight: 500;
	background: var(--color-brand-very-light);
	color: var(--color-brand);
	border: 1px solid var(--color-brand);
}

/* ── Modal de confirmation changement de centre ── */
.kc-confirm-overlay {
	position: fixed;
	inset: 0;
	background: rgba(var(--color-beige-dark-rgb), 0.9);
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
}

.kc-confirm-overlay[hidden] { display: none; }
.kc-confirm-dialog {
	background: #fff;
	border-radius: 1.2rem;
	padding: 2.8rem 2.4rem 2.4rem;
	max-width: 44rem;
	width: calc(100% - 3.2rem);
	box-shadow: 20px 20px 15px rgba(var(--color-primary-rgb), 0.15);
}

.kc-confirm-dialog__title {
	font-size: 1.8rem;
	font-weight: 500;
	margin: 0 0 1.2rem;
	color: var(--color-brand);
	text-align: center;
	font-family: var(--font-family-serif);
}

.kc-confirm-dialog__icon {
	display: block;
	margin: 0 auto 0.4rem;
	color: var(--color-brand);
	width: 3.2rem;
	height: 3.2rem;
}

.kc-confirm-dialog__body {
	font-size: var(--font-size-sm);
	line-height: 1.6;
	margin: 0 0 2.4rem;
}

.kc-confirm-dialog__body strong {
    color: var(--color-brand);
    font-weight: 600;
}

.kc-confirm-dialog__actions {
	display: flex;
	gap: 1.2rem;
	justify-content: flex-end;
}

.kc-confirm-dialog--pt {
	max-width: 52rem;
}
.kc-confirm-dialog--pt .kc-confirm-dialog__body {
	margin-bottom: 1.6rem;
}

.kc-confirm-dialog__actions--col {
	flex-direction: column;
	align-items: stretch;
}
.kc-confirm-dialog__actions--col .btn {
	width: 100%;
	text-align: center;
}

.kc-pt-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.8rem;
	margin-bottom: 1.6rem;
}

.kc-pt-chip {
	display: inline-flex;
	align-items: center;
	gap: 0.8rem;
	padding: 0.5rem 1rem 0.5rem 0.7rem;
	border-radius: 10rem;
	font-size: var(--font-size-sm);
	font-weight: 500;
	line-height: 1;
}

.kc-pt-chip__roman {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2rem;
	height: 2rem;
	border-radius: 50%;
	background: rgba(255, 255, 255, .25);
	font-size: 1.1rem;
	font-weight: 700;
}

.kc-pt-chip__label {
	font-size: var(--font-size-xs);
}

.fc-annuaire-notice svg {
	flex-shrink: 0;
	width: 20px;
	height: 20px;
}

.fc-prices__th--unit {
    width: 120px;
}

@media (max-width: 599px) {
    .fc-prices__th--unit {
        visibility: hidden;
    }
}

.fc-prices__th--pack {
    width: 100px;
}

.fc-prices__th--cta {
    width: 120px;
}

/* ── Aside — carte infos ────────────────────────────────────────────────── */
.fc-card {
    background-color: var(--color-white);
    border-radius: 1.6rem;
    box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
    border-radius: 20px;
    position: relative;
}

.fc-dispo {
	padding: 3rem;
}

.fc-infos-supplémentaires {
    padding: 3rem 2rem;
}

.fc-card::before {
	content: '';
	position: absolute;
	bottom: calc(100% + 1rem);
	left: 50%;
	transform: translateX(-50%);
	width: 1.5px;
	height: 6rem;
	background-color: var(--color-brand-very-light);
}

.fc-card::after {
	content: '';
	position: absolute;
	bottom: calc(100% + 3rem);
	left: 50%;
	transform: translateX(-50%);
	width: 2rem;
	height: 2rem;
	border-radius: 50%;
	background-color: var(--color-brand-very-light);
}

.fc-card:nth-child(2)::before,
.fc-card:nth-child(2)::after {
    display: none;
}

.fc-info__title {
	font-family: var(--font-family-serif);
	font-weight: 500;
	font-size: 1.8rem;
	text-align: center;
	margin-block: 3rem 1rem;
	padding-inline: 2rem;
}

.fc-info__addr {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.4rem;
	font-size: var(--font-size-sm);
	color: rgba(var(--color-primary-rgb), 0.55);
	text-align: center;
	margin-bottom: 5rem;
    padding-inline: 2rem;
}

.fc-info__addr svg {
	color: rgba(var(--color-primary-rgb), 0.55);
	flex: none;
	position: relative;
	top: 0.5px;
}

.fc-info__addr span,
.fc-info__addr a {
    color: rgba(var(--color-primary-rgb), 0.55);
}

.fc-info__addr:hover a,
.fc-info__addr:hover svg {
    color: var(--color-brand);
}

/* ── Horaires ───────────────────────────────────────────────────────────── */
.fc-hours {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 0.9rem;
	max-width: 22rem;
	margin-inline: auto;
}

.fc-hours::before {
	content: '';
	position: absolute;
	top: -3rem;
	left: 50%;
	transform: translateX(-50%);
	width: 2.4rem;
	height: 1.5px;
	background: var(--color-brand);
	z-index: 0;
}

.fc-hours__row {
    display: flex;
    align-items: center;
    font-size: var(--font-size-xs);
}

.fc-hours__dot {
	width: 0.8rem;
	height: 0.8rem;
	border-radius: 50%;
	background: var(--color-green);
	flex: none;
	margin-right: 0.6rem;
	position: relative;
	top: 0.5px;
}

.fc-hours__row--closed .fc-hours__dot {
    background: rgba(var(--color-primary-rgb), 0.15);
}

.fc-hours__day {
    flex: 1;
    color: #54514f;
}

.fc-hours__time {
    color: #6c6863;
    font-variant-numeric: tabular-nums;
}

.fc-hours__row--closed .fc-hours__time,
.fc-hours__row--closed .fc-hours__day {
    color: rgba(var(--color-primary-rgb), 0.55);
}

/* ── Carte MapTiler ─────────────────────────────────────────────────────── */
.maplibregl-ctrl-attrib.maplibregl-compact-show .maplibregl-ctrl-attrib-inner {
    font-size: 1.1rem!important;
}

.fc-map {
    margin-top: 3rem;
    border-bottom-left-radius: 2rem;
    border-bottom-right-radius: 2rem;
    overflow: hidden;
    height: 30rem;
}

.fc-map-link {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-top: 1.6rem;
    font-size: var(--font-size-sm);
    color: var(--color-brand);
    text-decoration: underline;
    text-underline-offset: 2px;
}

/* ── Info rows (chips) ──────────────────────────────────────────────────── */
.fc-info-rows {
    display: flex;
    flex-direction: column;
}

.fc-info-row {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 1.6rem;
	border-bottom: 1.5px solid var(--color-beige-dark);
	padding-block: 2rem;
}

.fc-info-row:first-child {
    padding-top: 0;
}

.fc-info-row:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.fc-info-row__key {
	font-size: var(--font-size-sm);
	flex: none;
	color: rgba(var(--color-primary-rgb), 0.55);
}

.fc-info-row__vals {
	display: flex;
	gap: 0.6rem;
	flex-direction: column;
	align-items: flex-end;
}

.fc-chip {
    font-size: var(--font-size-sm);
}

/* ── Pas d'offres ───────────────────────────────────────────────────────── */
.fc-no-offres {
    padding-block: 4rem 6rem;
    text-align: center;
    color: var(--fc-muted);
    font-size: 1.4rem;
}

/* =========================================================================
   8. Mes avis — espace client BtoC (.account-btoc__avis-*)
   ========================================================================= */

/* ── Rating row dans le hero ──────────────────────────────────────────────── */
.fc-hero__rating-note {
    color: rgba(var(--color-primary-rgb), 0.45);
    position: relative;
    margin-right: 1.3rem;
}

.account-btoc__avis-submitted-header {
    display: flex;
    gap: 2rem;
}

.fc-hero__rating-note::after {
	content: '';
	position: absolute;
	top: 8px;
	right: -10px;
	width: 3px;
	height: 3px;
	border-radius: 50%;
	background-color: var(--color-brand);
}

.rbk-header__meta .fc-hero__rating-note::after {
    display: none;
}

.fc-hero__rating-link {
    color: rgba(var(--color-primary-rgb), 0.65);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.fc-hero__rating-link:hover {
    color: var(--color-brand);
}

/* ── Bloc avis dans la sidebar ────────────────────────────────────────────── */
.fc-aside-avis {
    display: flex;
    flex-direction: column;
    scroll-margin-top: 9rem;
}

.fc-aside-avis__header {
	display: flex;
	background-color: var(--color-beige-dark);
    border-top-right-radius: 19px;
    border-top-left-radius: 19px;
}

.fc-aside-avis__avg-block {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	flex: none;
	background-color: var(--color-brand);
	width: 14rem;
	height: 15rem;
	color: white;
	border-top-left-radius: 20px;
}

.fc-aside-avis__avg-block svg {
    width: 1.6rem;
    height: 1.6rem;
    margin-bottom: 0.4rem;
}

.fc-aside-avis__avg-score {
	font-size: 4rem;
	font-weight: 700;
	font-family: var(--font-family-serif);
	line-height: 1;
}

.fc-aside-avis__count {
	font-size: 1rem;
	white-space: nowrap;
	font-weight: 600;
	margin-top: 0.6rem;
}

.fc-aside-avis__criteria-block {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 0.5rem;
	padding-inline: 2rem;
}

.fc-aside-avis__criteria-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    font-size: var(--font-size-xs);
}

.fc-aside-avis__criteria-label {
	color: rgba(var(--color-primary-rgb), 0.55);
	font-weight: 500;
}

.fc-aside-avis__criteria-score {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-weight: 600;
	font-size: var(--font-size-sm);
    flex: none;
}

.fc-aside-avis__criteria-score svg {
    color: var(--color-brand);
    width: 14px;
    height: 14px;
}

.fc-aside-avis__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 1.4rem;
	max-height: 48rem;
	overflow-y: auto;
	scrollbar-width: thin;
	scrollbar-color: var(--color-beige-dark) transparent;
	padding: 3rem 3rem 4rem;
}

.fc-aside-avis__item {
	padding-bottom: 2rem;
	border-bottom: 1.5px solid var(--color-beige-dark);
}

.fc-aside-avis__item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.fc-aside-avis__item-header {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    margin-bottom: 0.3rem;
}

.fc-aside-avis__item-name {
    font-weight: 600;
    font-size: var(--font-size-sm);
    color: var(--color-primary);
}

.fc-aside-avis__item-date {
    font-size: 1.1rem;
    color: rgba(var(--color-primary-rgb), 0.55);
}

.fc-aside-avis__item-stars {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    margin-left: auto;
    font-weight: 600;
    flex: none;
    font-size: var(--font-size-sm);
}

.fc-aside-avis__item-stars svg {
    width: 13px;
    height: 13px;
    color: var(--color-brand);
}

.fc-aside-avis__item-comment {
    font-size: var(--font-size-sm);
    line-height: 1.55;
    margin: 0;
}

.fc-aside-avis__reply {
	margin-top: 1.4rem;
	padding: 1rem 1.4rem;
	background: rgba(var(--color-primary-rgb), 0.03);
	border-left: 2px solid var(--color-brand);
	border-radius: 0 10px 10px 0;
}

.fc-aside-avis__reply-label {
	display: block;
	font-size: var(--font-size-sm);
	font-weight: 600;
	color: var(--color-brand);
	margin-bottom: 0.6rem;
}

.fc-aside-avis__reply p {
    font-size: var(--font-size-sm);
    margin: 0;
    line-height: 1.5;
}

/* ── Bloc Prochaines disponibilités ──────────────────────────────────────── */
.fc-dispo {
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
}

.fc-dispo__title {
	font-size: 1.8rem;
	font-weight: 500;
	margin: 0;
	text-align: center;
	font-family: var(--font-family-serif);
	color: var(--color-brand);
}

.fc-dispo__cols {
    display: flex;
    gap: 0.6rem;
}

.fc-dispo__col {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.4rem;
    padding: 1rem 0.4rem 0.8rem;
    background: var(--color-beige-light);
    border: 1px solid var(--color-beige-dark);
    border-radius: 8px;
    text-align: center;
}

.fc-dispo__col-day {
	font-size: 0.8rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	line-height: 1;
	color: rgba(var(--color-primary), 0.55);
}

.fc-dispo__col-num {
	font-size: var(--font-size-xs);
	font-weight: 600;
	color: var(--color-primary);
	line-height: 1;
}

.fc-dispo__col-slot {
	font-size: 1.35rem;
	font-weight: 700;
	color: var(--color-brand);
	line-height: 1;
	margin-block: 0.5rem;
}

.fc-dispo__col-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    font-weight: 600;
    color: var(--color-brand);
    background: rgba(212, 116, 108, 0.1);
    border-radius: 20px;
    padding: 0.2rem 0.5rem;
    white-space: nowrap;
    line-height: 1.4;
}

.fc-dispo__note {
    font-size: 1.1rem;
    color: var(--fc-muted2);
    margin: 0;
    line-height: 1.5;
    font-style: italic;
}

/* ── Nom lasériste dans item avis ───────────────────────────────────────── */
.fc-aside-avis__item-laseriste {
    font-size: var(--font-size-xs);
    color: rgba(var(--color-primary-rgb), 0.55);
    margin: 0 0 0.8rem;
    font-style: italic;
}

.account-btoc__avis-intro {
    font-size: var(--font-size-sm);
    color: rgba(var(--color-primary-rgb), 0.65);
    margin-bottom: 2.4rem;
}

.account-btoc__avis-kcoin-teaser {
	display: inline-flex;
	align-items: center;
	font-size: var(--font-size-sm);
	color: rgba(var(--color-primary-rgb), 0.65);
	display: flex;
	margin-top: 0.6rem;
}

.account-btoc__avis-kcoin-teaser strong {
    color: var(--color-brand);
}

/* ── Bloc par réservation ─────────────────────────────────────────────── */
.account-btoc__avis-list {
    display: flex;
    flex-direction: column;
    gap: 3.2rem;
}

.account-btoc__avis-resa-block {
    display: flex;
    flex-direction: column;
    gap: 1.6rem;
}

/* ── Carte séance ─────────────────────────────────────────────────────── */
.account-btoc__avis-card {
    border: 1.5px solid var(--color-beige-dark);
    border-radius: var(--border-radius-lg);
    overflow: hidden;
}

.account-btoc__avis-card-header {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    flex-wrap: wrap;
    padding: 1.6rem 1.8rem;
    background: var(--color-beige-light);
    border-bottom: 1.5px solid var(--color-beige-dark);
    justify-content: space-between;
}

.account-btoc__avis-card-resa {
	font-size: 1.6rem;
	font-weight: 600;
	color: var(--color-brand);
	font-family: var(--font-family-serif);
    margin-bottom: 0.7rem;
}

.account-btoc__avis-card-seance {
    font-size: var(--font-size-xs);
    color: rgba(var(--color-primary-rgb), 0.65);
    font-weight: 500;
    margin-bottom: 1.4rem;
}

.account-btoc__avis-card-seance strong {
    color: var(--color-brand);
}

.account-btoc__avis-card-sep {
    color: rgba(var(--color-primary-rgb), 0.35);
    margin: 0 0.3rem;
}

.account-btoc__avis-form-wrapper {
    display: flex;
    justify-content: space-between;
    gap: 5rem;
}

.account-btoc__avis-comment-wrap {
    flex: auto;
}

.account-btoc__avis-card-centre {
    position: relative;
    margin-left: 2.6rem;
    color: var(--color-brand);
}
.account-btoc__avis-card-centre::after {
    content: '';
    position: absolute;
    left: -14px;
    top: 7.5px;
    width: 3px;
    height: 3px;
    background: var(--color-brand);
    border-radius: 50%;
}

.account-btoc__avis-card-prestas {
	display: flex;
	flex-wrap: wrap;
    align-items: center;
	gap: 0.6rem;
    font-size: 1.1rem;
    font-weight: 600;
}

.account-btoc__avis-card-presta-chip {
	font-size: 1.1rem;
	border-radius: 6px;
	padding: 0.7rem 1.4rem;
	background: var(--color-beige-dark);
	color: var(--color-brand);
}

/* ── Avis déjà soumis ─────────────────────────────────────────────────── */
.account-btoc__avis-submitted {
    padding: 3rem;
    display: flex;
    gap: 2rem;
}

.account-btoc__avis-comment-wrapper {
	flex: 1;
	border-left: 2px solid var(--color-beige-dark);
	padding-left: 1.4rem;
	margin-left: 2rem;
	padding-block: 1rem;
}

.account-btoc__avis-submitted-top {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background-color: var(--color-beige-light);
    border: 1.5px solid var(--color-beige-dark);
    width: 160px;
    min-width: 160px;
    height: 160px;
    border-radius: 10px;
}

.account-btoc__avis-note-globale-label {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--color-brand);
}

.account-btoc__avis-note-globale {
	font-size: 6rem;
	font-weight: 600;
	font-family: var(--font-family-serif);
	line-height: 1;
	position: relative;
	margin-top: 0.1rem;
    color: var(--color-brand);
}

.account-btoc__avis-note-globale sup {
	position: absolute;
	top: 9px;
	right: -18px;
	font-size: 2rem;
}

.account-btoc__avis-status {
    display: inline-block;
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--color-brand);
}

.account-btoc__avis-globale {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: var(--font-size-sm);
    color: rgba(var(--color-primary-rgb), 0.65);
}

.account-btoc__avis-globale strong {
    color: var(--color-primary);
    font-size: 1.4rem;
}

/* ── Critères (lecture et saisie) ─────────────────────────────────────── */
.account-btoc__avis-criteria {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 1rem;
    min-width: 290px;
}

.account-btoc__avis-criteria-title {
    font-weight: 500;
    font-family: var(--font-family-serif);
    color: var(--color-brand);
    line-height: 1.4;
    margin-bottom: 0.6rem;
}

.account-btoc__avis-criterion {
    display: flex;
    align-items: center;
    gap: 1.2rem;
    flex-wrap: wrap;
}

.account-btoc__avis-criterion-label {
    font-size: 1.25rem;
    color: rgba(var(--color-primary-rgb), 0.65);
    min-width: 18rem;
}

/* Étoiles — lecture */
.account-btoc__avis-stars-readonly {
    display: flex;
    gap: 0.2rem;
}

.account-btoc__avis-stars-readonly .account-btoc__avis-star {
    font-size: 1.6rem;
    color: var(--color-beige-dark);
    line-height: 1;
}

.account-btoc__avis-stars-readonly .account-btoc__avis-star.is-filled {
    color: var(--color-brand);
}

.account-btoc__avis-stars-readonly .account-btoc__avis-star.is-half {
    color: var(--color-brand);
    opacity: 0.5;
}

/* Étoiles — saisie */
.account-btoc__avis-star-input {
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

button.account-btoc__avis-star {
    background: none;
    border: none;
    padding: 0;
    font-size: 2rem;
    line-height: 1;
    cursor: pointer;
    color: var(--color-beige-dark);
    transition: color 0.1s, transform 0.1s;
}

button.account-btoc__avis-star:hover,
button.account-btoc__avis-star.is-filled {
    color: var(--color-brand);
}

button.account-btoc__avis-star:hover {
    transform: scale(1.15);
}

/* ── Commentaire ─────────────────────────────────────────────────────── */
.account-btoc__avis-comment {
	font-size: var(--font-size-sm);
	font-style: italic;
	line-height: 1.6;
}

/* ── Réponse du centre ───────────────────────────────────────────────── */
.account-btoc__avis-reply {
    margin-top: 2rem;
}

.account-btoc__avis-reply-label {
	display: block;
	font-size: 1rem;
	font-weight: 600;
	color: rgba(var(--color-primary-rgb), 0.55);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin-bottom: 0.7rem;
}

.account-btoc__avis-reply p {
    font-size: var(--font-size-sm);
    line-height: 1.6;
}

/* ── Formulaire ─────────────────────────────────────────────────────── */
.account-btoc__avis-form {
    padding: 3rem;
    display: flex;
    flex-direction: column;
    gap: 3rem;
}

.account-btoc__avis-comment-wrap {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.account-btoc__avis-comment-label {
	font-weight: 500;
	font-family: var(--font-family-serif);
	color: var(--color-brand);
}

.account-btoc__avis-comment-label span {
    font-weight: 400;
    font-size: 1.15rem;
}

.account-btoc__avis-textarea {
	width: 100%;
	font-size: var(--font-size-xs);
	font-family: var(--font-family);
	color: var(--color-primary);
	background: var(--color-beige-light);
	border: 1.5px solid var(--color-beige-dark);
	border-radius: var(--border-radius-sm);
	padding: 1rem 1.2rem;
	resize: none;
	min-height: 16rem;
	line-height: 1.5;
}

.account-btoc__avis-textarea:focus {
    border-color: var(--color-brand);
    box-shadow: 0 0 0 3px rgba(var(--color-brand-rgb), 0.1);
    outline: none;
}

.account-btoc__avis-form-footer {
	display: flex;
	gap: 1.4rem;
	flex-wrap: wrap;
	justify-content: flex-end;
	border-top: 1.5px solid var(--color-beige-dark);
	padding-top: 2rem;
}

.account-btoc__avis-submit-btn {
    flex-shrink: 0;
}

.account-btoc__avis-feedback {
    font-size: var(--font-size-sm);
    line-height: 1.4;
}

.account-btoc__avis-feedback--success { color: var(--color-green); }
.account-btoc__avis-feedback--error   { color: var(--color-alert); }

/* =============================================================================
   Page Réservation BtoC (.rbk-*)
   ============================================================================= */

.rbk-wrapper {
    display: flex;
    gap: 3rem;
    justify-content: space-between;
}

.rbk-wrapper__right {
    width: 36rem;
    min-width: 36rem;
    flex-shrink: 0;
}

.rbk-wrapper__left {
    flex: 1;
}

.rbk-page {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 4rem var(--container-padding-x) 8rem;
}

.rbk-kcoin-encart {
	font-size: var(--font-size-xs);
	padding-block: 2rem;
	border-bottom: 1px solid var(--color-beige-dark);
}

.rbk-kcoin-encart__header {
    text-align: right;
    font-weight: 500;
}

#rbk-kcoin-equiv {
    text-align: right;
    margin-top: 0.6rem;
}

.rbk-kcoin-encart__solde strong,
.rbk-kcoin-encart__taux {
    color: var(--color-kcoin);
}

.rbk-kcoin-warning {
    text-align: right;
    font-size: 1.1rem;
    color: var(--color-brand);
    font-weight: 500;
    margin-top: 0.8rem;
}

.rbk-kcoin-encart__row {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin-top: 1rem;
	justify-content: flex-end;
}

.rbk-kcoin-encart__row label {
    font-weight: 500;
}

.rbk-kcoin-encart__note {
	font-size: 1.1rem;
	color: var(--color-brand);
	margin-top: 0.6rem;
	font-style: italic;
}

.rbk-kcoin-spinner {
	display: inline-flex;
	align-items: stretch;
	border: 1px solid var(--color-beige-dark);
	border-radius: 0.3rem;
	overflow: hidden;
	background: var(--color-beige-dark);
}

.rbk-kcoin-spinner__btn {
	background: none;
	border: none;
	cursor: pointer;
	width: 4rem;
	line-height: 1;
	color: var(--color-brand);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.15s, color 0.15s;
	flex-shrink: 0;
	background: var(--color-beige-dark);
}

.rbk-kcoin-spinner__btn:hover:not(:disabled) {
	background: var(--color-brand-very-light);
}

.rbk-kcoin-spinner__btn:active:not(:disabled) {
	background: var(--color-brand-light);
}

.rbk-kcoin-spinner__btn:disabled {
	color: var(--color-brand-light);
	cursor: default;
}

#rbk-kcoin-input {
	border: none;
	outline: none;
	text-align: center;
	width: 6rem;
	padding: 1.5rem 0;
	font-size: var(--font-size-xs);
	background: transparent;
	-moz-appearance: textfield;
	appearance: textfield;
	font-weight: 500;
    background-color: var(--color-white);
}

#rbk-kcoin-input::-webkit-inner-spin-button,
#rbk-kcoin-input::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* Header */
.rbk-header {
	margin-bottom: 28px;
	padding-bottom: 2rem;
	border-bottom: 1.5px solid var(--color-brand-very-light);
}

.rbk-header__title {
	margin: 2rem 0 1.2rem;
	font-size: 3rem;
	font-weight: 500;
}

.rbk-header__title strong {
    color: var(--color-primary, #d4746c);
}

/* Cards */
.rbk-card {
    position: relative;
    box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
    border-radius: 20px;
    background-color: var(--color-white);
    padding: 4rem;
}

#rbk-planning-card.rbk-card {
    padding: 4rem 3rem;
}

.rbk-card.rbk-card--panier {
    padding: 3rem 2rem;
}

.rbk-wrapper__right-sticky {
    position: sticky;
    top: 5rem;
}

.rbk-card__subtitle {
	width: 3.4rem;
	height: 3.4rem;
	border-radius: 50%;
	background: var(--color-brand);
	display: flex;
	align-items: center;
	justify-content: center;
	color: white;
	font-weight: 500;
	font-size: 1.6rem;
	margin: 0 auto 1.2rem;
	font-family: var(--font-family-serif);
}

.rbk-card__subtitle span {
	position: relative;
	bottom: 1px;
}

.rbk-card__title {
	font-size: 1.8rem;
	font-weight: 500;
	font-family: var(--font-family-serif);
	color: var(--color-brand);
    margin-bottom: 5rem;
    text-align: center;
    position: relative;
}

.rbk-card__title::after {
    content: '';
    position: absolute;
    bottom: -1.5rem;
    left: 50%;
    transform: translateX(-50%);
    width: 2rem;
    height: 1.5px;
    background: var(--color-brand);
}

/* Prestation initiale */
.rbk-presta-head {
	display: flex;
	gap: 12px;
	margin-bottom: 1rem;
	background-color: var(--color-beige-dark);
	padding: 1.8rem 2rem;
	border-radius: 1rem;
    justify-content: space-between;
}

.rbk-presta-head__info-bottom {
    display: flex;
    align-items: center;
    gap: 2rem;
}

.btn.rbk-del-init-btn,
.btn.rbk-del-btn {
    flex-shrink: 0;
    padding: 0;
    width: 4rem;
    height: 4rem;
    border-radius: 50%;
}

.rbk-presta-head__info {
	display: flex;
	gap: 6px;
	flex-direction: column;
}

.rbk-presta-head__nom {
    font-weight: 600;
}

.rbk-presta-head__badge {
	font-size: 1rem;
	padding: 2px 8px;
	background: var(--color-white);
	border-radius: 20px;
	font-weight: 500;
}

.rbk-presta-head__info-top {
	display: flex;
	align-items: center;
	gap: 0.6rem;
}

.rbk-presta-head__prix {
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: rgba(var(--color-primary-rgb), 0.55);
}

.rbk-presta-head__duree {
    font-size: var(--font-size-sm);
    color: rgba(var(--color-primary-rgb), 0.55);
    position: relative;
}

.rbk-presta-head__duree::before {
	content: '';
	position: absolute;
	top: 7.5px;
	left: -11.5px;
	width: 3px;
	height: 3px;
	background: rgba(var(--color-primary-rgb), 0.55);
	border-radius: 50%;
}

.rbk-add-header {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-direction: row-reverse;
}

/* Séances selector */
.rbk-seances-label {
    font-size: 13px;
    color: #374151;
    margin: 0 0 12px;
}

.rbk-seances-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 1rem;
}

.rbk-seances-btn {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 2px;
	padding: 10px 14px;
	border: 1.5px solid var(--color-beige-dark);
	border-radius: 8px;
	background: var(--color-beige-light);
	cursor: pointer;
	font-size: var(--font-size-xs);
	transition: border-color .15s, background .15s;
	text-align: left;
	flex: 1;
    color: var(--color-primary);
}

.rbk-seances-btn:hover {
    border-color: var(--color-brand);
    background: var(--color-beige-dark);
    border-style: dashed;
}

.rbk-seances-btn.is-active {
    border-color: var(--color-brand);
    background: var(--color-beige-dark);
    border-style: dashed;
}

.rbk-seances-btn--pack {
	position: relative;
	min-width: 20rem;
}

.rbk-seances-btn__label {
	font-weight: 600;
	font-size: var(--font-size-sm);
}

.rbk-seances-btn__prix {
	font-size: var(--font-size-xs);
	color: rgba(var(--color-primary-rgb), 0.55);
	font-weight: 500;
}

.rbk-seances-btn__prix strong {
    color: var(--color-brand);
}

.rbk-seances-btn__gift {
	font-size: 1rem;
	color: rgba(var(--color-brand-rgb), 0.90);
	border-radius: 4px;
	margin-top: 1rem;
	font-weight: 500;
}

.rbk-presta-block {
    margin-top: 1.4rem;
    padding-top: 1.4rem;
    border-top: 1.5px solid var(--color-beige-dark);
}

.rbk-presta-block:first-child {
    margin-top: 0;
    padding-top: 0;
    border-top: none;
}

/* Info multi-séances */
.rbk-ms-info {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 1.1rem;
	color: var(--color-brand);
	justify-content: flex-end;
    max-width: 60rem;
    line-height: 1.5;
    font-weight: 500;
    margin-top: 1.4rem;
}

.rbk-ms-info svg {
	flex-shrink: 0;
	width: 18px;
	height: 18px;
}

/* Ajouter soins */
.rbk-add-wrap {
    margin-block: 2rem 4rem;
}

.rbk-mt-teaser {
	display: flex;
	align-items: center;
	gap: 5px;
	font-size: var(--font-size-xs);
	color: var(--color-brand);
}

.rbk-mt-teaser svg {
	flex-shrink: 0;
	color: var(--color-brand);
	position: relative;
	top: -0.5px;
}

.rbk-mt-teaser__ex {
    font-style: italic;
    color: #c2410c;
}

.rbk-add-btn {
	display: inline-flex;
	align-items: center;
	gap: 3px;
	padding: 1.4rem 2rem 1.3rem;
	border-radius: 8px;
	background: #fff;
	cursor: pointer;
	font-size: var(--font-size-xs);
	font-weight: 600;
	transition: all .15s;
	background-color: transparent;
	color: var(--color-brand);
	border: none;
	white-space: nowrap;
	border: 1px solid var(--color-brand);
}

.rbk-add-btn:hover {
    background-color: var(--color-brand-hover);
    border-color: var(--color-brand-hover);
    color: var(--color-white);
    transform: translateY(-2px);
    box-shadow: 0 4px 4px rgba(var(--color-brand-rgb), 0.1);
}

.rbk-add-btn svg { 
    color: currentColor; 
}

/* Panel ajouter */
.rbk-add-panel {
	margin-top: 2rem;
	border: 1px solid var(--color-beige-dark);
	background: #fff;
	padding: 4rem;
    box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
    border-radius: 20px;
}

/* Tabs genre */
.rbk-offres-tabs {
    display: flex;
    gap: 8px;
    margin-bottom: 20px;
}
.rbk-offres-tab {
    padding: 6px 16px;
    border: 1px solid #d1d5db;
    border-radius: 20px;
    background: #fff;
    cursor: pointer;
    font-size: 13px;
    color: #374151;
    transition: all .15s;
}
.rbk-offres-tab.is-active {
    background: var(--color-primary, #d4746c);
    border-color: var(--color-primary, #d4746c);
    color: #fff;
    font-weight: 600;
}

/* Zone titre */
.rbk-offres-zone-title {
	font-size: 1.6rem;
	margin: 3rem 0 0.9rem 2rem;
	font-weight: 600;
}

.rbk-offres-zone-title:first-child { margin-top: 0; }
.rbk-offres-zone {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* Ligne offre dans le panel */
.rbk-offre-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 1.5rem 2rem;
	border: 1px solid var(--color-beige-dark);
	border-radius: 6px;
	background: var(--color-beige-light);
	flex-wrap: wrap;
}

.rbk-offre-row:hover {
    background: var(--color-beige-dark);
}

.rbk-offre-row--in-cart {
    background: #f0fdf4;
    border-color: #86efac;
}

.rbk-offre-row__info {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.rbk-offre-row__meta{
    display: flex;
    gap: 1.6rem;
    font-size: var(--font-size-sm);
    color: rgba(var(--color-primary-rgb), 0.55);
}

.rbk-offre-row__nom {
	font-size: var(--font-size-sm);
	font-weight: 600;
}

.rbk-offre-row__prix {
    position: relative;
}

.rbk-offre-row__prix::after {
    content: '';
    position: absolute;
    top: 8px;
    right: -10px;
    width: 3px;
    height: 3px;
    background: rgba(var(--color-primary-rgb), 0.55);
    border-radius: 50%;
}

.rbk-offre-row__btns {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.rbk-nb-btn {
    padding: 4px 10px;
    border: 1px solid #d1d5db;
    border-radius: 5px;
    background: #fff;
    cursor: pointer;
    font-size: 12px;
    color: #374151;
    transition: all .12s;
}
.rbk-nb-btn:hover { border-color: var(--color-primary, #d4746c); color: var(--color-primary, #d4746c); }
.rbk-nb-btn.is-active {
    background: var(--color-primary, #d4746c);
    border-color: var(--color-primary, #d4746c);
    color: #fff;
    font-weight: 600;
}
.rbk-nb-btn--pack {
    border-style: dashed;
}

/* Cart table */
.rbk-cart-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.rbk-cart-table th {
    padding: 10px 12px;
    text-align: left;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: #9ca3af;
    border-bottom: 1px solid #f3f4f6;
    font-weight: 600;
}

.rbk-cart-table td {
    padding: 12px;
    border-bottom: 1px solid var(--color-beige-dark);
    vertical-align: middle;
}

td.rbk-tfoot-label.rbk-tfoot-label--total,
td.rbk-tfoot-value.rbk-tfoot-value--total {
    border-bottom: none;
}

.rbk-cart-th--montant,
.rbk-cart-td--montant { text-align: right; }
.rbk-cart-th--prix,
.rbk-cart-td--prix { text-align: right; }
.rbk-cart-th--del,
.rbk-cart-td--del { width: 36px; text-align: center; }

.rbk-cart-nom { 
    font-weight: 600; 
    font-size: var(--font-size-sm); 
}

.rbk-cart-td--presta .rbk-cart-td--presta-head {
	margin-bottom: 0.6rem;
	display: flex;
	gap: 0.4rem;
	align-items: center;
}

.rbk-cart-row {
    padding-block: 2rem;
    border-bottom: 1.5px solid var(--color-beige-dark);
}

.pbt-card--panier .rbk-cart-row {
    border-bottom: 1.5px solid rgba(var(--color-brand-rgb), 0.2);
}

.rbk-cart-row:first-child { 
    padding-top: 0; 
}

.rbk-cart-totaux {
	margin-top: 2rem;
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.rbk-cart-genre {
	font-size: 1rem;
	padding: 1px 6px;
	border-radius: 10px;
	background-color: var(--color-beige-dark);
	font-weight: 500;
}

.rbk-cart-td--presta-nb-seances {
    position: relative;
    margin-left: 1.6rem;
}

.pbt-card--panier .rbk-cart-td--presta-nb-seances {
    margin-left: 1.2rem;
}

.rbk-cart-td--presta-nb-seances::before {
    content: '';
    position: absolute;
    left: -9.5px;
    top: 7.5px;
    width: 3px;
    height: 3px;
    background: rgba(var(--color-primary-rgb), 0.65);
    border-radius: 50%;
}

.rbk-cart-duree {
    position: relative;
    margin-left: 1.6rem;
}

.rbk-cart-duree::before {
    content: '';
    position: absolute;
    top: 7.5px;
    left: -9.5px;
    width: 3px;
    height: 3px;
    background: var(--color-primary);
    border-radius: 50%;
}

.rbk-cart-td--presta-details {
    font-size: var(--font-size-xs);
    font-weight: 500;
    color: rgba(var(--color-primary-rgb),0.55);
}

.rbk-tfoot-row {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.4rem;
    font-size: var(--font-size-sm);
}

.rbk-brut {
    color: #9ca3af;
    font-style: normal;
    margin-right: 4px;
}
.rbk-net { color: #111827; }

.rbk-pack-gift {
    display: inline-block;
    font-size: 10px;
    background: #fef3c7;
    color: #92400e;
    padding: 1px 5px;
    border-radius: 4px;
    margin-left: 4px;
    font-weight: 400;
}

/* Tfoot */
.rbk-tfoot-label,
.rbk-tfoot-label--total { 
    text-align: right; 
    color: rgba(var(--color-primary-rgb), 0.55);
    font-weight: 500;
}

.rbk-tfoot-label--discount { 
    color: var(--color-green);
 }

 .rbk-tfoot-label--kcoin,
 .rbk-tfoot-value.rbk-tfoot-value--kcoin{
    color: var(--color-kcoin);
 }

.rbk-tfoot-value { 
    text-align: right; 
    font-weight: 600; 
    min-width: 12rem;
}

.rbk-tfoot-value--discount { 
    color: var(--color-green); 
}

.rbk-tfoot-value--total { 
    font-weight: 600; 
    font-size: var(--font-size-lg); 
    color: var(--color-brand); 
}

.rbk-cart-empty {
    text-align: center;
    padding: 20px;
    color: #9ca3af;
    font-style: italic;
    font-size: 13px;
}

/* Info créneaux */
.rbk-creneaux-info {
    font-size: 13px;
    color: #6b7280;
    margin-bottom: 16px;
    padding: 8px 14px;
    background: #f9fafb;
    border-radius: 6px;
}

/* Confirmation panel — résumé panier */
.rbk-confirm-lines {
    list-style: none;
    margin: 8px 0 12px;
    padding: 0;
    font-size: 13px;
    color: #374151;
}
.rbk-confirm-lines li::before {
    content: '✓ ';
    color: var(--color-primary, #d4746c);
    font-weight: 700;
}
.rbk-confirm-footer { margin-top: 12px !important; }
.rbk-confirm-summary {
    background: #f9fafb;
    border-radius: 6px;
    padding: 10px 14px;
}

/* =============================================================================
   Page Paiement BtoC (.pbt-*)
   ============================================================================= */

.pbt-card--panier {
    padding: 3rem 2rem 2rem;
    border: 1.5px solid rgba(var(--color-brand-rgb), 0.2);
    position: relative;
    border-radius: 10px;
}

.pbt-page .rbk-header { 
    margin-bottom: 3rem; 
}

.pbt-alert {
	padding: 12px 16px;
	border-radius: 8px;
	font-size: var(--font-size-sm);
	margin-bottom: 20px;
	font-weight: 400;
}

.pbt-alert--error {
	background: var(--color-brand-very-light);
	color: var(--color-brand);
	border: 1px solid var(--color-brand);
}

.pbt-card--loading {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 48px 24px;
    gap: 16px;
}

.pbt-card__title {
	font-size: 1.6rem;
	font-weight: 500;
	font-family: var(--font-family-serif);
	color: var(--color-brand);
	text-align: center;
	position: absolute;
	top: -16px;
	background: var(--color-beige-dark);
	width: fit-content;
	margin: 0 auto;
	padding: 0 1.6rem;
	left: 50%;
	transform: translateX(-50%);
    z-index: 10;
    white-space: nowrap;
}

.pbt-spinner {
    width: 36px; height: 36px;
    border: 3px solid #e5e7eb;
    border-top-color: var(--color-primary, #d4746c);
    border-radius: 50%;
    animation: pbt-spin .7s linear infinite;
}
@keyframes pbt-spin { to { transform: rotate(360deg); } }
.pbt-loading-text { font-size: 15px; color: #6b7280; }

.pbt-card--error { text-align: center; padding: 36px 24px; }
.pbt-error-text { color: #6b7280; font-size: 14px; margin-bottom: 16px; }
.pbt-back-link { margin-top: 12px; }

.pbt-card--login { max-width: 480px; }
.pbt-login-intro { font-size: 14px; color: #374151; margin-bottom: 24px; padding-bottom: 20px; border-bottom: 1px solid #f3f4f6; }
.pbt-login-form { display: flex; flex-direction: column; }
.pbt-fields { display: flex; flex-direction: column; gap: 16px; margin-bottom: 20px; }
.pbt-submit-btn { width: 100%; justify-content: center; height: 5rem;}

.pbt-forgot {
	display: block;
	text-align: center;
	font-size: var(--font-size-xs);
	color: rgba(var(--color-primary-rgb), 0.45);
	width: fit-content;
	margin: 1.2rem auto 0;
}

.pbt-forgot:hover { 
    color: var(--color-brand); 
}

.pbt-register-link { margin-top: 28px; padding-top: 20px; border-top: 1px solid #f3f4f6; text-align: center; }
.pbt-register-link p { font-size: 14px; color: #6b7280; margin-bottom: 12px; }
.pbt-register-link .btn { width: 100%; justify-content: center; }

.pbt-card--summary { margin-bottom: 16px; }
.pbt-summary-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.pbt-summary-table td { padding: 10px 8px; border-bottom: 1px solid #f3f4f6; }
.pbt-summary-name { color: #1d2327; font-weight: 500; }
.pbt-summary-qty  { color: #6b7280; text-align: center; width: 60px; }
.pbt-summary-price { text-align: right; font-weight: 600; color: #1d2327; width: 100px; }
.pbt-summary-total td { padding-top: 14px; font-weight: 700; font-size: 15px; border-bottom: none; }
.pbt-summary-total td:last-child { color: var(--color-primary, #d4746c); }
.pbt-creneau { margin-top: 12px; padding-top: 12px; border-top: 1px solid #f3f4f6; font-size: 13px; color: #374151; }

.pbt-gateways { list-style: none; margin: 0 0 24px; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.pbt-gateway { border: 2px solid #e5e7eb; border-radius: 8px; padding: 14px 16px; transition: border-color .15s; }
.pbt-gateway:has(.pbt-gateway__radio:checked) { border-color: var(--color-primary, #d4746c); background: #fdf2f1; }
.pbt-gateway__label { display: flex; align-items: center; gap: 10px; cursor: pointer; }
.pbt-gateway__radio { accent-color: var(--color-primary, #d4746c); width: 16px; height: 16px; }
.pbt-gateway__title { font-weight: 600; font-size: 14px; color: #1d2327; }
.pbt-gateway__desc { font-size: 12px; color: #6b7280; margin: 6px 0 0 26px; }
.pbt-gateway__fields { margin-top: 14px; padding-top: 14px; border-top: 1px solid #f0f0f0; }
.pbt-pay-error { color: var(--color-brand); font-size: 13px; margin-bottom: 12px; }

.pbt-pay-btn {
	width: 100%;
	justify-content: center;
	font-size: 1.5rem;
	padding: 1.6rem;
	font-weight: 600;
}

.pbt-pay-btn[disabled] {
    opacity: 0.6;
    cursor: not-allowed!important;
}

.pbt-paid-text { font-size: 14px; color: #374151; padding: 16px 0; }

.pbt-gateway__fields input[type="text"],
.pbt-gateway__fields input[type="email"],
.pbt-gateway__fields input[type="tel"],
.pbt-gateway__fields select,
.pbt-gateway__fields textarea {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 14px;
    font-family: inherit;
    background: #fff;
    box-sizing: border-box;
}
.pbt-gateway__fields label { font-size: 12px; color: #6b7280; display: block; margin-bottom: 4px; }
.pbt-gateway__fields .form-row { margin-bottom: 12px; }

/* Stripe card element */
.pbt-stripe-loading {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 0;
    color: rgba(var(--color-primary-rgb), 0.9);
    font-size: var(--font-size-xs);
}

.pbt-stripe-loading .pbt-spinner {
    width: 22px; height: 22px;
    border-width: 2px;
}

.pbt-card-label {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: #374151;
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.pbt-card-element {
    width: 100%;
    height: 5.6rem;
    padding: 2.4rem 1.4rem 0.6rem;
    border: 1.5px solid rgba(var(--color-brand-rgb), 0.2);
    border-radius: var(--border-radius);
    background: var(--color-white);
    transition: border-color .2s ease, box-shadow .2s ease;
    box-sizing: border-box;
}

.pbt-card-element.StripeElement--focus {
    border-color: var(--color-brand);
    box-shadow: 0 0 0 3px rgba(var(--color-brand-rgb), 0.1);
}
.pbt-card-element.StripeElement--invalid { border-color: var(--color-brand); }

.pbt-stripe-secure {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: var(--font-size-xs);
    color: rgba(var(--color-primary-rgb), 0.45);
}

.pbt-stripe-secure svg { 
    flex-shrink: 0; 
}

/* ── Mini-header paiement ───────────────────────────────────────────────── */
.pbt-checkout-page body { display: flex; flex-direction: column; min-height: 100vh; }

.pbt-header {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 5rem;
	flex-direction: column;
	gap: 1.8rem;
	font-weight: 500;
}

.pbt-header__logo svg {
    display: block;
    fill: var(--color-brand);
    width: 120px;
    height: auto;
}

/* ── Layout page paiement ───────────────────────────────────────────────── */
.pbt-checkout {
    max-width: 100rem;
    margin: 0 auto;
    padding: 5rem var(--container-padding-x, 2rem) 8rem;
}

.pbt-checkout--centered {
    max-width: 52rem;
    margin: 0 auto;
    padding-top: 2rem;
}
.pbt-checkout__title {
    font-size: 2.2rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 2.4rem;
    text-align: center;
}

.pbt-header__subtitle {
    text-align: center;
    font-size: var(--font-size-xs);
}

/* ── Tabs auth ──────────────────────────────────────────────────────────── */
/* ── Paiement express (Google Pay / Apple Pay / Amazon Pay) ─────────────── */
.pbt-card--express {
    position: relative;
    margin-bottom: 0.5rem;
}

.pbt-card--express #pbt-express-checkout {
	min-height: 4.4rem;
	border: 1.5px solid rgba(var(--color-brand-rgb), 0.2);
	padding: 4rem 3rem 3rem;
	position: relative;
	border-radius: 10px;
}

/* ── PayPal (redirection vers la page order-pay native) ─────────────────── */
.pbt-card--paypal {
	margin-top: 5rem;
}
.pbt-installments-text {
	font-size: var(--font-size-sm);
	color: var(--color-brand);
	margin: 0 0 1rem;
	font-weight: 500;
}
.pbt-installments-sim {
	display: flex;
	gap: 1.2rem;
	margin-bottom: 2rem;
}
.pbt-installment {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.4rem;
	padding: 1.2rem 1rem;
	border: 1.5px solid rgba(var(--color-brand-rgb), 0.2);
	border-radius: 8px;
}
.pbt-installment__n {
	font-size: 1.1rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04rem;
	color: rgba(var(--color-brand-rgb), 0.65);
}
.pbt-installment__amount {
	font-size: 1.6rem;
	font-weight: 600;
	color: var(--color-brand);
}
.pbt-paypal-btn {
	width: 100%;
    height: 5.25rem;
    background-color: var(--color-brand);
    color: var(--color-white);
    font-size: 1.5rem;
    font-weight: 600;
    border: none;
}
.pbt-paypal-btn:hover {
    color: var(--color-white);
}
.pbt-paypal-btn[disabled] {
	opacity: 0.6;
	cursor: not-allowed !important;
	pointer-events: none;
}

/* ── Page order-pay habillée (surcharge woocommerce/checkout/form-pay.php) ── */
/* Mise en page deux colonnes : assurée par .rbk-wrapper / .pbt-checkout-wrapper
   (réutilisées depuis /paiement/). Pas de layout propre ici. */
/* Liste des moyens de paiement WooCommerce (PayPal injecté par PPCP) :
   on neutralise le style par défaut (fond gris-lavande #dfdcde + flèche). */
.pbt-orderpay .wc_payment_methods {
	list-style: none;
	margin: 0 0 2rem;
	padding: 0;
}
.pbt-orderpay .wc_payment_methods li {
	list-style: none;
	margin: 0 0 1.2rem;
	padding: 0;
	background: none;
}
.pbt-orderpay .wc_payment_methods li > label {
	font-weight: 600;
	color: var(--color-primary);
    font-size: var(--font-size-sm);
    display: flex;
    align-items: center;
}

.woocommerce-checkout #payment div.payment_box {
	position: relative;
	box-sizing: border-box;
	width: 100%;
	padding: 0!important;
	margin: 0!important;
	font-size: initial!important;
	border-radius: 0!important;
	line-height: 1.3!important;
	background-color: transparent!important;
	color: rgba(var(--color-primary-rgb), 0.9)!important;
    border: none;
}

/* Radios « moyen de paiement » stylisés comme .account-btob__check-box : la case
   coche WooCommerce est un <input type="radio"> natif sans span frère, on l'habille
   donc directement via appearance:none + ::after pour le carré de remplissage. */
.pbt-orderpay .wc_payment_methods li input[type="radio"] {
	appearance: none;
	-webkit-appearance: none;
	margin: 0 !important;
	flex-shrink: 0;
	width: 1.7rem;
	height: 1.7rem;
	border: 1px solid var(--color-brand-light);
	border-radius: 0.2rem;
	background-color: var(--color-white);
	transition: border-color 0.2s ease, background-color 0.2s ease;
	position: relative;
	cursor: pointer;
}
.pbt-orderpay .wc_payment_methods li input[type="radio"]:checked {
	border-color: var(--color-brand);
}
.pbt-orderpay .wc_payment_methods li input[type="radio"]::after {
	content: '';
	position: absolute;
	inset: 4px;
	background-color: var(--color-brand);
	border-radius: 1px;
	opacity: 0;
	transition: opacity 0.15s ease;
}
.pbt-orderpay .wc_payment_methods li input[type="radio"]:checked::after {
	opacity: 1;
}
.pbt-orderpay .wc_payment_methods li input[type="radio"]:focus-visible {
	outline: 2px solid var(--color-brand);
	outline-offset: 2px;
}

/* Descriptif maison (Klarna / PayPal) injecté dans payment-method.php : on masque le
   contenu natif (.pbt-method-fields) et on affiche un libellé court + une mention de
   redirection. Voir woocommerce/checkout/payment-method.php pour --keep vs --hide. */
/* Ces deux box restent affichées EN PERMANENCE (pas seulement quand le radio est coché) :
   on neutralise le display:none initial ET le slideUp de payment.js (qui repose sur un
   display:none inline en fin d'animation, battu par !important). */
.pbt-orderpay .wc_payment_methods .payment_box.payment_method_ppcp-gateway,
.pbt-orderpay .wc_payment_methods .payment_box.payment_method_stripe_klarna {
	display: block !important;
}
.pbt-orderpay .wc_payment_methods label.pbt-method-info {
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
	margin: 0;
	cursor: pointer;
}
.pbt-orderpay .wc_payment_methods .pbt-method-info__headline {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	font-weight: 600;
	font-size: var(--font-size-sm);
	color: var(--color-primary);
}
.pbt-orderpay .wc_payment_methods .pbt-method-info__logo {
	flex-shrink: 0;
	width: 2rem;
	height: 2rem;
}
.pbt-orderpay .wc_payment_methods .pbt-method-info__redirect {
	display: flex;
	align-items: center;
	gap: 1rem;
	font-size: var(--font-size-xs);
	line-height: 1.5;
	color: rgba(var(--color-primary-rgb), 0.55);
	padding: 2rem;
	background-color: var(--color-beige-dark);
	border-radius: var(--border-radius);
	margin-top: 0.3rem;
}
.pbt-orderpay .wc_payment_methods .pbt-method-info__icon {
	flex-shrink: 0;
	width: 2.2rem;
	height: auto;
	margin-top: 0.1rem;
	color: var(--color-brand);
}
/* PayPal : contenu natif inutile à l'affichage (bouton injecté hors box) → on le retire. */
.pbt-orderpay .wc_payment_methods .pbt-method-fields--hide {
	display: none;
}
/* Klarna : le PaymentElement Stripe doit rester monté → masquage visuel sans display:none. */
.pbt-orderpay .wc_payment_methods .pbt-method-fields--keep {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
/* Encadré déroulant d'une méthode : fond clair à la charte, pas de lavande ni flèche */
.pbt-orderpay .wc_payment_methods .payment_box {
	margin: 1rem 0 0;
	padding: 2rem;
	font-size: 1.4rem;
	color: var(--color-primary);
	background: var(--color-beige, #faf6f1);
	border: 1.5px solid rgba(var(--color-brand-rgb), 0.2);
	border-radius: 10px;
}
.pbt-orderpay .wc_payment_methods .payment_box::before {
	display: none !important; /* supprime la flèche triangulaire lavande par défaut */
}
/* Bouton « Payer » natif WooCommerce, aligné sur les boutons du site */
.pbt-orderpay #place_order {
	width: 100%;
	margin-top: 0 !important;
	height: 5.25rem !important;
	font-size: 1.5rem !important;
	font-weight: 600 !important;
}

#add_payment_method #payment ul.payment_methods::after, 
#add_payment_method #payment ul.payment_methods::before, 
.woocommerce-cart #payment ul.payment_methods::after, 
.woocommerce-cart #payment ul.payment_methods::before, 
.woocommerce-checkout #payment ul.payment_methods::after, 
.woocommerce-checkout #payment ul.payment_methods::before {
	display: none!important;
}

#add_payment_method #payment div.form-row, 
.woocommerce-cart #payment div.form-row, 
.woocommerce-checkout #payment div.form-row {
	padding: 0!important;
}

#add_payment_method #payment ul.payment_methods li, 
.woocommerce-cart #payment ul.payment_methods li, 
.woocommerce-checkout #payment ul.payment_methods li {
	line-height: 1!important;
	margin: 0!important;
	font-weight: 400;
	display: flex!important;
	align-items: center!important;
	gap: 2rem!important;
	padding: 2rem!important;
	background-color: white!important;
	border: 1.5px solid rgba(var(--color-brand-rgb), 0.2)!important;
	border-radius: var(--border-radius)!important;
}

#add_payment_method #payment ul.payment_methods, 
.woocommerce-cart #payment ul.payment_methods, 
.woocommerce-checkout #payment ul.payment_methods {
	text-align: left;
	padding: 0 !important;
	border-bottom: none !important;
	margin: 0;
	list-style: none outside;
	gap: 1rem !important;
	display: flex !important;
	flex-direction: column !important;
}

#add_payment_method #payment ul.payment_methods li:not(.woocommerce-notice)::after, 
#add_payment_method #payment ul.payment_methods li:not(.woocommerce-notice)::before, 
.woocommerce-cart #payment ul.payment_methods li:not(.woocommerce-notice)::after, 
.woocommerce-cart #payment ul.payment_methods li:not(.woocommerce-notice)::before, 
.woocommerce-checkout #payment ul.payment_methods li:not(.woocommerce-notice)::after, 
.woocommerce-checkout #payment ul.payment_methods li:not(.woocommerce-notice)::before {
    display: none!important;
}

.woocommerce-error, 
.woocommerce-message, .woocommerce-info {
	margin-bottom: 5rem!important;
}

.woocommerce-error li, 
.woocommerce-info li, 
.woocommerce-message li {
	font-size: var(--font-size-sm) !important;
	font-weight: 500 !important;
}

.woocommerce #payment #place_order, 
.woocommerce-page #payment #place_order {
	float: initial!important;
}
/* Masquer les boutons express Stripe sur la page order-pay : ils font doublon avec
   la section express de /paiement/. Ces ids n'existent que sur les pages WC, donc
   le scope .pbt-checkout-page ne vise en pratique que la coquille order-pay. */
.pbt-checkout-page #wc-stripe-express-checkout-element,
.pbt-checkout-page #wc-stripe-express-checkout-button-separator {
	display: none !important;
}
/* Verrouillage tant que les consentements (CGV + renonciation) ne sont pas cochés :
   appliqué à la liste des moyens (place_order + radios), au bouton place_order, ET au
   conteneur PayPal .ppc-button-wrapper (injecté par PPCP, souvent hors du <ul>), en
   laissant les cases à cocher (entre les deux) interactives. */
.pbt-pay-lockable,
.pbt-orderpay .ppc-button-wrapper {
	position: relative;
	transition: opacity .15s;
}
.pbt-pay-lockable.is-locked,
.pbt-orderpay .ppc-button-wrapper.is-locked {
	opacity: 0.5;
	pointer-events: none;
}
/* Le bouton PayPal est une iframe : pointer-events sur l'ancêtre ne suffit pas toujours.
   On superpose une surcouche transparente (réactivée via pointer-events:auto) qui passe
   au-dessus de l'iframe (z-index) et capte/bloque réellement les clics. */
.pbt-pay-lockable.is-locked::after,
.pbt-orderpay .ppc-button-wrapper.is-locked::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 30;
	cursor: not-allowed;
	pointer-events: auto;
}

.pbt-auth-or-manual {
	margin: 4rem 0 0;
	text-align: center;
	font-size: 1rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04rem;
    font-style: italic;
}

.pbt-auth-then-manual {
	margin: 0 0 3rem;
	text-align: center;
	font-size: 1rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04rem;
    font-style: italic;
}

.pbt-card--auth {
    position: relative;
    border-top: 1.5px solid rgba(var(--color-brand-rgb), 0.2);
    padding-top: 4rem;
    margin-bottom: 5rem;
    margin-top: 3rem;
}

.pbt-auth-tabs {
    display: flex;
    border-bottom: 2px solid var(--color-beige-dark, #e9e2d9);
    margin: -2.4rem -2.4rem 2.8rem;
}
.pbt-auth-tab {
    flex: 1;
    padding: 1.4rem 1.6rem;
    background: none;
    border: none;
    font-size: 1.4rem;
    font-weight: 600;
    color: #6b7280;
    cursor: pointer;
    transition: color .15s;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
}
.pbt-auth-tab:hover { color: #374151; }
.pbt-auth-tab.is-active {
    color: var(--color-primary, #d4746c);
    border-bottom-color: var(--color-primary, #d4746c);
}
.pbt-auth-panel { animation: pbt-fadein .18s ease; }
@keyframes pbt-fadein { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

/* ── Séparateur OU + bouton toggle inscription ──────────────────────────── */
.pbt-auth-or {
	display: flex;
	align-items: center;
	gap: 1.2rem;
	margin: 3rem 0 3.4rem;
	color: var(--color-brand);
	font-size: 1.6rem;
	font-weight: 500;
	font-family: var(--font-family-serif);
}

.pbt-auth-or::before,
.pbt-auth-or::after {
    content: '';
    flex: 1;
    height: 1.5px;
    background: rgba(var(--color-brand-rgb), 0.2);
    margin-top: 2px;
}

.pbt-toggle-register { 
    width: 100%; 
    justify-content: center; 
    height: 5rem;
}

#pbt-panel-register:not([hidden]) { margin-top: 2.4rem; }

/* ── Grille champs inscription ──────────────────────────────────────────── */
.pbt-fields {
	display: flex;
	gap: 1.4rem;
	margin-bottom: 1.4rem;
}

.pbt-login-form .pbt-fields {
    flex-direction: row;
}

.pbt-fields--full { grid-column: 1 / -1; }
.pbt-reg-note {
    font-size: 1.1rem;
    color: #9ca3af;
    margin-top: 1.2rem;
    text-align: center;
}

/* ── Informations client (mode pay) ─────────────────────────────────────── */
.pbt-card--client { 
    border-top: 1.5px solid rgba(var(--color-brand-rgb), 0.2);
    padding-top: 4rem;
    margin-bottom: 4rem;
    position: relative;
    margin-top: 3rem;
}

.pbt-info-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.6rem;
}
.pbt-info-field--full { grid-column: 1 / -1; }
.pbt-info-field {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}
.pbt-info-field__label {
    font-size: 1.1rem;
    font-weight: 600;
    color: #9ca3af;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.pbt-info-field__value {
    font-size: 1.4rem;
    color: #111827;
    font-weight: 500;
}

/* Inputs éditables dans la grille infos client */
.pbt-info-grid .form-field input[readonly] {
	cursor: default;
	background-color: var(--color-beige-light);
	color: rgba(var(--color-primary-rgb), 0.55);
}

.pbt-profile-feedback {
    margin-top: 1.2rem;
    font-size: var(--font-size-xs);
    padding: .6rem 1rem;
    border-radius: 6px;
}
.pbt-profile-feedback--ok  { background: #f0fdf4; color: #16a34a; }
.pbt-profile-feedback--err { background: #fef2f2; color: #dc2626; }
.pbt-spinner--sm { width: 20px; height: 20px; border-width: 2px; margin: 1.6rem auto; }
.pbt-summary-empty { font-size: var(--font-size-sm); color: #9ca3af; margin: 1.2rem 0; }

/* ── Stripe champs séparés ──────────────────────────────────────────────── */
.pbt-stripe-fields { 
    display: flex; 
    flex-direction: column; 
}

.pbt-stripe-fields-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.6rem; }
.pbt-stripe-field {
    position: relative;
}
.pbt-stripe-label {
    position: absolute;
    top: 1rem;
    left: 1.4rem;
    font-size: 1rem;
    font-weight: 400;
    color: var(--color-brand);
    pointer-events: none;
    z-index: 1;
}

.pbt-card-errors {
	font-size: var(--font-size-xs);
	color: var(--color-brand);
	margin: 0.4rem 0 1.8rem;
}

/* ── Consentements paiement ─────────────────────────────────────────────── */
.pbt-consents {
    padding: 2rem 0 0;
    border-top: 1.5px solid rgba(var(--color-brand-rgb), 0.2);
}

.pbt-consent {
	display: grid;
	grid-template-columns: 18px 1fr;
	gap: 0 0.7rem;
	align-items: start;
	cursor: pointer;
    margin-bottom: 2rem;
}

.pbt-consent { display: grid; grid-template-columns: 18px 1fr; gap: 0 1rem; align-items: start; cursor: pointer; }
.pbt-consent input[type="checkbox"] { position: absolute; opacity: 0; width: 0; height: 0; }

.pbt-consent__box {
    grid-column: 1; 
    grid-row: 1;
    width: 18px; 
    height: 18px;
    border: 1px solid rgba(var(--color-primary-rgb), 0.75); 
    border-radius: 4px;
    background: #fff; 
    flex-shrink: 0; 
    transition: border-color .15s, background .15s;
    position: relative;
}

.pbt-consent input[type="checkbox"]:checked + .pbt-consent__box { 
    background: var(--color-brand); 
    border-color: var(--color-brand); 
}

.pbt-consent input[type="checkbox"]:checked + .pbt-consent__box::after {
	content: '';
	position: absolute;
	left: 5px;
	top: 1.5px;
	width: 6px;
	height: 10px;
	border: 1.5px solid #fff;
	border-top: none;
	border-left: none;
	transform: rotate(45deg);
}

.pbt-consent input[type="checkbox"]:focus-visible + .pbt-consent__box { 
    outline: 2px solid var(--color-brand); 
    outline-offset: 2px; }

.pbt-consent__text {
	font-size: var(--font-size-xs);
	line-height: 1.5;
	font-weight: 500;
}

.pbt-consent__link { 
    background: none; 
    border: none; 
    padding: 0; 
    font: inherit; 
    color: rgba(var(--color-primary-rgb), 0.9); 
    cursor: pointer; 
    text-decoration: underline; 
}

.pbt-consent__link:hover {
    color: var(--color-brand);
}

/* ── Bouton annuler ─────────────────────────────────────────────────────── */
.pbt-cancel-link {
	display: flex;
	align-items: center;
	gap: 0.4rem;
	font-size: var(--font-size-xs);
	color: rgba(var(--color-brand-rgb), 0.55);
	margin: 1.2rem auto 0;
	text-decoration: none;
	transition: color .15s;
	justify-content: center;
    width: fit-content;
}

.pbt-cancel-link svg {
    position: relative;
    top: 0.5px;
}

.pbt-cancel-link:hover { 
    color: var(--color-brand); 
}

/* ── Résumé commande (colonne droite) ───────────────────────────────────── */
.pbt-summary-centre {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: var(--font-size-sm);
	font-weight: 500;
	margin-bottom: 2rem;
	padding-bottom: 1.7rem;
	border-bottom: 1.5px solid rgba(var(--color-brand-rgb), 0.2);
}

.pbt-creneau-row {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	font-size: var(--font-size-xs);
	margin: 1.6rem 0 0;
	padding: 1.2rem 2rem;
	background: var(--color-white);
	border-radius: 8px;
	justify-content: space-between;
}

.pbt-creneau-row__top {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    position: relative;
    bottom: 1px;
}

.pbt-creneau-row__top svg {
    position: relative;
    top: 1px;
}

.pbt-stripe-secure--summary {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1.5px solid var(--color-beige-dark);
    justify-content: center;
}

/* ── Barre légale ───────────────────────────────────────────────────────── */
.pbt-legal-bar {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 2rem;
	padding-top: 2rem;
}

.pbt-legal-bar .pbt-legal-link {
    background: none;
    border: none;
    padding: 0;
    font-size: var(--font-size-xs);
    color: rgba(var(--color-primary-rgb), 0.9);
    cursor: pointer;
    transition: color .15s;
    font-weight: 500;
}

.pbt-legal-bar .pbt-legal-link:hover { 
    color: var(--color-brand); 
}

.pbt-legal-sep { font-size: 1rem; color: #d1d5db; }

.pbt-card--pay {
    border: 1.5px solid rgba(var(--color-brand-rgb), 0.2);
    padding: 4rem 3rem 3rem;
    position: relative;
    border-radius: 10px;
}

.pbt-card--pay-locked { opacity: .55; pointer-events: none; user-select: none; }
.pbt-pay-locked-msg { font-size: var(--font-size-sm); color: #6b7280; margin-top: 1.2rem; }

.pbt-retract-text {
    font-size: var(--font-size-xs);
    line-height: 1.6;
}

.pbt-retract-text a { 
    color: var(--color-brand); 
    text-decoration: underline; 
}

/* ── Panneau latéral légal ──────────────────────────────────────────────── */
.pbt-legal-panel[hidden] { display: none; }
.pbt-legal-panel {
    position: fixed;
    inset: 0;
    z-index: 9998;
    display: flex;
}

.pbt-legal-panel__overlay {
    position: absolute;
    inset: 0;
    background: rgba(var(--color-beige-dark-rgb), 0.5);
}

.pbt-legal-panel__drawer {
	position: relative;
	width: 70rem;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	animation: pbt-slide-in .25s ease;
	box-shadow: 20px 0 15px rgba(var(--color-primary-rgb), 0.15);
	background: var(--color-beige-light);
}

@keyframes pbt-slide-in { from { transform: translateX(-100%); } to { transform: translateX(0); } }

.pbt-legal-panel__header {
	display: flex;
	align-items: center;
	gap: 1.2rem;
	padding: 2rem 5rem;
	border-bottom: 1.5px solid var(--color-brand-very-light);
	flex-shrink: 0;
	justify-content: space-between;
}

.pbt-legal-panel__close {
	width: 4rem;
	height: 4rem;
	border-radius: 50%;
	background: var(--color-white);
	border: none;
	color: var(--color-primary);
	font-size: 1.8rem;
	line-height: 1;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.15s;
}

.pbt-legal-panel__close:hover { 
    background: var(--color-beige-dark); 
    color: var(--color-brand); 
}

.pbt-legal-panel__title {
    font-size: 3rem;
    font-weight: 500;
    color: var(--color-brand);
    font-family: var(--font-family-serif);
}

.pbt-legal-panel__content {
    overflow-y: auto;
    flex: 1;
    padding: 5rem;
}

.pbt-legal-section__title {
    font-size: 1.8rem;
    font-weight: 700;
    margin: 0 0 1.6rem;
}
.pbt-legal-body { font-size: 1.4rem; line-height: 1.7; color: #374151; }

.pbt-legal-body p {
	margin-bottom: 1.2rem;
	font-size: var(--font-size-sm);
}

.pbt-legal-body h2 {
    font-weight: 600;
    font-size: 1.8rem;
    margin-bottom: 1.2rem;
}

.pbt-legal-body h3 { 
    font-size: 1.5rem!important; 
    font-weight: 600!important; 
    margin: 2rem 0 1.2rem!important;
    color: var(--color-brand)!important;
}

.pbt-legal-body h2 + h3 {
    margin-top: 0!important;
}

.pbt-legal-body p + h2 {
    margin-top: 4rem!important;
}

.pbt-legal-body ul, 
.pbt-legal-body ol {
	margin: 0 0 1.4em 2.4rem;
    font-size: var(--font-size-sm);
}

.pbt-legal-body li {
	position: relative;
	margin-bottom: 0.6em;
}

.pbt-legal-body li::before {
	content: '';
	position: absolute;
	left: -12px;
	top: 10.5px;
	width: 4px;
	height: 4px;
	background: var(--color-brand);
	border-radius: 50%;
	transform: translateY(-50%);
}

/* ============================================================================
   Trouver un centre (trc)
   ============================================================================ */

/* ── Hero + Recherche ─────────────────────────────────────────────────────── */

.trc-hero {
    background: var(--color-beige-light);
    padding: 4rem 0 1.4rem;
    text-align: center;
    border-bottom: 1.5px solid var(--color-beige-dark);
}

.trc-hero__back {
    display: inline-flex;
    align-items: center;
    gap: 0.7rem;
    font-size: var(--font-size-xs);
    font-weight: 500;
    color: rgba(var(--color-primary-rgb), 0.55);
    text-decoration: none;
    margin-bottom: 1.6rem;
    transition: color 0.15s;
}

.trc-hero__back:hover {
    color: var(--color-brand);
}

.trc-hero__title {
	font-size: 3rem;
	font-weight: 400;
	margin: 0 0 1rem;
}

.trc-hero__sub {
	font-size: var(--font-size-sm);
	margin: 0 0 3rem;
	font-weight: 500;
}

.trc-search {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    max-width: 74rem;
    margin: 0 auto 2rem;
    padding: 0 2rem;
}

.trc-search__input {
	flex: 1;
	min-width: 0;
	height: 4.4rem;
	padding: 0 1.4rem;
	border: 1.5px solid var(--color-beige-dark);
	border-radius: var(--border-radius);
	font-size: var(--font-size-sm);
	background: #fff;
	color: var(--color-primary);
	transition: border-color 0.15s;
}

.trc-search__input:focus {
    outline: none;
    border-color: var(--color-brand);
    box-shadow: 0 0 0 3px rgba(var(--color-brand-rgb), 0.12);
}
.trc-search__input::placeholder { color: #b0a8a8; }

/* ── Filtres ─────────────────────────────────────────────────────────────── */

.trc-filters {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: 0 2rem 0.4rem;
}
.trc-filters::-webkit-scrollbar {
    display: none;
}

.trc-filter-chip {
	display: inline-flex;
	align-items: center;
	height: 4rem;
	padding: 0 2.4rem;
	border: 1.5px solid var(--color-beige-dark);
	border-radius: var(--border-radius);
	background: #fff;
	font-size: var(--font-size-xs);
	color: rgba(var(--color-primary-rgb), 0.55);
	cursor: pointer;
	transition: border-color 0.15s, color 0.15s;
	white-space: nowrap;
	user-select: none;
	font-family: inherit;
	font-weight: 500;
}

.trc-filter-chip.is-active,
.trc-filter-chip:hover {
    border-color: var(--color-brand);
    color: var(--color-brand);
}

.trc-filter-sep {
	display: inline-block;
	width: 1.5px;
	height: 1.4rem;
	background: var(--color-brand-very-light);
	align-self: center;
	flex-shrink: 0;
	margin: 0 1rem;
}

/* ── Filter bar ──────────────────────────────────────────────────────────── */
.trc-filter-bar {
    display: flex;
    gap: 1rem;
    flex-wrap: nowrap;
    padding: 0 4rem;
}

.trc-filter-bar::-webkit-scrollbar { display: none; }

.trc-filter-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    height: 4rem;
    padding: 0 1.8rem;
    border: 1.5px solid var(--color-brand);
    border-radius: var(--border-radius);
    background: var(--color-brand);
    font-size: var(--font-size-xs);
    font-family: inherit;
    font-weight: 600;
    color: var(--color-white);
    cursor: pointer;
    transition: all 0.15s;
    white-space: nowrap;
    flex-shrink: 0;
}

.trc-filter-btn:hover {
    background-color: var(--color-brand-hover);
    transform: translateY(-2px);
    color: var(--color-white);
    box-shadow: 0 4px 4px rgba(var(--color-brand-rgb), 0.1);
}

.trc-filter-btn__badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.8rem;
	height: 1.8rem;
	padding: 0 0.4rem;
	border-radius: 50%;
	background: var(--color-white);
	color: var(--color-brand);
	font-size: 1rem;
	font-weight: 800;
	line-height: 1;
}

.trc-active-chips {
    display: flex;
    gap: 0.6rem;
    flex-wrap: wrap;
}

.trc-active-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0 1.4rem;
    border: 1.5px solid var(--color-brand);
    border-radius: var(--border-radius);
    background: color-mix(in srgb, var(--color-brand) 8%, white);
    font-size: var(--font-size-xs);
    font-family: inherit;
    font-weight: 500;
    color: var(--color-brand);
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.12s;
}
.trc-active-chip:hover {
    background: color-mix(in srgb, var(--color-brand) 15%, white);
}

.trc-active-chip svg {
    position: relative;
    top: 0.5px;
}

/* ── Modal filtres ───────────────────────────────────────────────────────── */
.trc-fmodal {
    position: fixed;
    inset: 0;
    z-index: 9000;
    display: flex;
    align-items: flex-start;
}
.trc-fmodal[hidden] { display: none; }

.trc-fmodal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(var(--color-beige-dark-rgb), 0.9);
}

.trc-fmodal__panel {
	position: relative;
	z-index: 1;
	width: min(48rem, 100vw);
	height: 100dvh;
	display: flex;
	flex-direction: column;
	background: #fff;
	box-shadow: 10px 0 15px rgba(var(--color-primary-rgb), 0.15);
	overflow: hidden;
}

.trc-fmodal__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 2rem 2.4rem;
    border-bottom: 1px solid var(--color-beige-dark);
    flex-shrink: 0;
}

.trc-fmodal__title {
	font-size: 2.4rem;
	font-weight: 500;
	margin: 0;
}

.trc-fmodal__close {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 3.6rem;
	height: 3.6rem;
	border: none;
	border-radius: 50%;
	background: var(--color-beige-light);
	color: rgba(var(--color-primary-rgb), 0.45);
	cursor: pointer;
	transition: all 0.12s;
}

.trc-fmodal__close:hover { 
    background: var(--color-beige-dark);
    color: var(--color-brand);
}

.trc-fmodal__body {
    flex: 1;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 0 2.4rem 2rem;
}

.trc-fmodal__section {
    padding: 2rem 0;
    border-bottom: 1.5px solid var(--color-beige-dark);
}
.trc-fmodal__section--last { border-bottom: none; }

.trc-fmodal__section--zone { 
    padding-bottom: 0; 
}

.trc-fmodal__section.trc-fmodal__section--zone {
    border-bottom: none;
}

.trc-fmodal__section-label {
	display: block;
	font-size: 1rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.07em;
	margin-bottom: 0.7rem;
	color: var(--color-brand);
}

/* Zone tabs inside modal (override for compact display) */
.trc-fmodal__section .hb-app__zone-tabs {
    flex-wrap: wrap;
    gap: 0.6rem;
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}
.trc-fmodal__section .hb-app__zone-tab {
    height: 3.4rem;
    padding: 0 1.4rem;
    font-size: var(--font-size-xs);
    border: 1.5px solid var(--color-beige-dark);
    border-radius: var(--border-radius);
}

.trc-fmodal__section .hb-app__zone-tab.is-active {
    border-color: var(--color-brand);
    color: var(--color-brand);
}

.trc-fmodal__section .hb-app__zone-panel { display: none; margin-top: 1.2rem; }
.trc-fmodal__section .hb-app__zone-panel.is-active { display: block; }
.trc-fmodal__section .hb-app__selector--list-only { grid-template-columns: 1fr; }

.trc-fmodal__selected {
    padding: 1.4rem 0 1.6rem;
    border-bottom: 1.5px solid var(--color-beige-dark);
}

.trc-fmodal__selected-label {
	display: block;
	font-size: 1rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.07em;
	color: var(--color-brand);
	margin-bottom: 0.6rem;
}

.trc-fmodal__selected-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    align-items: center;
}
.trc-fmodal__no-sel {
    font-size: 1.25rem;
    color: var(--color-text-light);
    font-style: italic;
}
.trc-fmodal__soin-tag {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 1rem;
    border: 1.5px solid var(--color-brand);
    border-radius: var(--border-radius);
    background: color-mix(in srgb, var(--color-brand) 8%, white);
    font-size: var(--font-size-xs);
    font-weight: 500;
    color: var(--color-brand);
}
.trc-fmodal__soin-rm {
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    background: transparent;
    color: inherit;
    cursor: pointer;
    padding: 0;
    line-height: 1;
}

.trc-fmodal__phototype-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.trc-fmodal__chips-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}
.trc-fmodal__chips-row .trc-filter-chip {
    height: 3.6rem;
    padding: 0 1.6rem;
}

.trc-fmodal__foot {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 1rem;
    padding: 1.6rem 2.4rem;
    border-top: 1.5px solid var(--color-beige-dark);
    flex-shrink: 0;
}

.trc-fmodal__btn-reset {
    height: 4.4rem;
    padding: 0 2rem;
    border: 1.5px solid var(--color-beige-dark);
    border-radius: var(--border-radius);
    background: transparent;
    font-size: var(--font-size-xs);
    font-family: inherit;
    font-weight: 500;
    color: var(--color-text-light);
    cursor: pointer;
    transition: border-color 0.12s, color 0.12s;
}
.trc-fmodal__btn-reset:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
}
.trc-fmodal__btn-apply {
    height: 4.4rem;
    padding: 0 2.4rem;
    font-size: var(--font-size-xs);
}

body.trc-fmodal-open { overflow: hidden; }

/* ── Layout liste + carte ────────────────────────────────────────────────── */

.trc-page { display: flex; flex-direction: column; }

.trc-body {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: start;
    background-color: white;
}

.trc-list-col {
	position: relative;
	min-height: 60vh;
	width: 70rem;
	min-width: 70rem;
	background-color: white;
	border-right: 1.5px solid var(--color-beige-dark);
	height: 100%;
}

.trc-map-col {
    position: sticky;
    top: 7rem;
    height: calc(100vh - 7rem);
}
#trc-map {
    width: 100%;
    height: 100%;
}

/* ── Switcher liste/carte (mobile/tablette) ───────────────────────────────── */

.trc-view-switcher {
	display: none;
	gap: 0.8rem;
	padding: 1.2rem var(--container-padding-x);
	border-bottom: 1.5px solid var(--color-beige-dark);
	background-color: var(--color-beige-light);
	position: sticky;
	top: 6.4rem;
	z-index: 10;
}

.trc-view-switcher .trc-filter-btn {
	flex-shrink: 0;
}

.trc-view-btn {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    padding: 1rem 1.2rem;
    border: 1px solid rgba(var(--color-brand-rgb), 0.3);
    border-radius: var(--border-radius);
    background-color: var(--color-beige-light);
    color: rgba(var(--color-brand-rgb), 0.9);
    font-size: var(--font-size-sm);
    font-weight: 600;
    cursor: pointer;
    transition: var(--transition);
}

.trc-view-btn svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

.trc-view-btn.is-active {
    background-color: var(--color-brand);
    border-color: var(--color-brand);
    color: var(--color-white);
}

/* ── Résultats méta ──────────────────────────────────────────────────────── */

.trc-results-meta {
	border-bottom: 1.5px solid var(--color-beige-dark);
	padding: 3rem 4rem;
}

.trc-results-count {
	font-size: 1.8rem;
	font-weight: 600;
	color: var(--color-brand);
	font-family: var(--font-family-serif);
}

.trc-results-sub {
    font-size: var(--font-size-sm);
    color: rgba(var(--color-primary-rgb), 0.55);
}

/* ── Cartes centres ──────────────────────────────────────────────────────── */

.trc-cards {
    display: flex;
    flex-direction: column;
}

.trc-card {
	border-bottom: 1.5px solid var(--color-beige-dark);
    transition: box-shadow 0.15s;
}

.trc-card:last-of-type { 
    border-bottom: none; 
}

.trc-card:hover,
.trc-card--active {
    box-shadow: 0 0 20px rgba(var(--color-primary-rgb), 0.1)
}

.trc-card:hover .trc-card__photo img {
    transform: scale(1.05);
}

.trc-card__photo {
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 20rem;
	border-radius: 10px;
	height: 26rem;
}

.trc-card__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.3s ease;
}

.trc-card__photo-ph {
    color: #ccc;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    min-height: 12rem;
}

.trc-card__body {
    padding: 4rem;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

/* En-tête carte */
.trc-card__header {
	display: flex;
    align-items: center;
	gap: 1.6rem;
    margin-bottom: 2rem;
}

.trc-card__infos {
    flex: 1;
}

.trc-card__name {
	font-size: 2rem;
	font-weight: 500;
	color: var(--color-brand);
    margin-bottom: 0.4rem;
}

.trc-card__address {
	display: flex;
	align-items: center;
	gap: 0.4rem;
	margin: 0;
	font-size: var(--font-size-sm);
	color: rgba(var(--color-primary-rgb), 0.65);
}

.trc-card__address svg { flex-shrink: 0; }

.trc-card__rating {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin: 0;
    font-size: var(--font-size-sm);
    color: rgba(var(--color-primary-rgb), 0.65);
}

.trc-card__rating svg { 
    flex-shrink: 0; 
    stroke: rgba(var(--color-primary-rgb), 0.65);
}

.trc-card__rating a {
    position: relative;
    padding-left: 1.4rem;
}

.trc-card__rating a::before {
	content: '';
	position: absolute;
	top: 10px;
	left: 4px;
	width: 3px;
	height: 3px;
	border-radius: 50%;
	background-color: rgba(var(--color-primary-rgb), 0.65);
}

.trc-card__phototypes {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem;
    margin-top: 2rem;
}

.trc-card__pt-label {
	margin-right: 0.5rem;
	flex-shrink: 0;
	font-size: var(--font-size-xs);
	color: rgba(var(--color-primary-rgb),0.45);
	font-weight: 500;
}

.trc-card__pt {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.6rem;
    height: 2.6rem;
    border-radius: 50%;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1;
    cursor: default;
}

.leaflet-touch .leaflet-bar {
	border: none!important;
}

.leaflet-touch .leaflet-bar a:first-child {
    margin-bottom: 0.5rem;
}

.leaflet-touch .leaflet-bar a {
	width: 3.6rem!important;
	height: 3.6rem!important;
	line-height: 3.6rem!important;
	border-radius: 50%!important;
    box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1)!important;
}

.leaflet-touch .leaflet-control-zoom-in, 
.leaflet-touch .leaflet-control-zoom-out {
	font-size: 1.8rem!important;
    line-height: 1.8rem!important;
}

.leaflet-bar a,
.leaflet-bar a span {
	color: rgba(var(--color-primary-rgb), 0.9)!important;
}

.leaflet-touch .leaflet-bar a:first-child span {
	position: relative!important;
	top: -2px!important;
	left: -1px!important;
}

.leaflet-touch .leaflet-bar a:last-child span {
	position: relative!important;
	top: -2px!important;
	left: -1px!important;
}

.leaflet-touch .leaflet-bar a.leaflet-disabled {
	background-color: var(--color-beige-light)!important;
}

.leaflet-touch .leaflet-bar a.leaflet-disabled span {
	color: rgba(var(--color-primary-rgb), 0.25)!important;
}

.leaflet-left {
    left: auto!important;
    right: 0!important;
}

.leaflet-left .leaflet-control {
	margin-left: 0!important;
    margin-right: 20px!important;
}

.leaflet-container {
	font-family: var(--font-family)!important;
	font-size: 1.1rem!important;
	line-height: 1!important;
}

.leaflet-control-attribution, 
.leaflet-control-scale-line {
	padding: 5px 10px 6px!important;
	color: rgba(var(--color-primary-rgb), 0.55)!important;
	line-height: 1!important;
    font-weight: 500!important;
}

.leaflet-control-attribution.leaflet-control .leaflet-attribution-flag {
	display: none!important;
}

.leaflet-container a {
	color: var(--color-brand)!important;
}

.leaflet-container .leaflet-control-attribution a {
	color: var(--color-primary)!important;
}

/* Calendrier disponibilités */
.trc-cal {
	display: flex;
	flex-direction: column;
	gap: 0.7rem;
	margin-block: 2rem 0;
}

.trc-cal__row { display: flex; align-items: center; gap: 0.8rem; }

.trc-cal__label {
	width: 8rem;
	flex-shrink: 0;
	font-size: var(--font-size-xs);
	color: rgba(var(--color-primary-rgb),0.45);
	font-weight: 500;
}

.trc-cal__days {
	display: flex;
	gap: 0.7rem;
	flex: 1;
}

.trc-cal__cell {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	flex: 1;
	height: 4rem;
	border-radius: var(--border-radius);
	background: var(--color-beige-light);
	color: rgba(var(--color-primary-rgb), 0.45);
	transition: border-color 0.12s, background 0.12s;
    max-width: 8rem;
}

.trc-cal__cell--ok {
    color: rgba(var(--color-primary-rgb), 0.9);
}

.trc-cal__ab {
	font-size: 0.9rem;
	line-height: 1;
	font-weight: 500;
}

.trc-cal__num {
	font-size: var(--font-size-xs);
	line-height: 1;
	font-weight: 700;
	margin-top: 0.1rem;
}

/* Offres */
.trc-card__offers {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.trc-card__offer {
	display: flex;
	align-items: center;
	gap: 0.8rem;
	font-size: var(--font-size-sm);
	padding: 1.6rem 0;
	border-top: 1.5px solid var(--color-beige-dark);
}

.trc-card__offer-name {
	flex: 1;
	min-width: 0;
	color: var(--color-primary);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	display: flex;
	align-items: center;
	gap: 0.6rem;
}

.trc-card__offer-price {
	font-size: var(--font-size-xs);
	color: rgba(var(--color-primary-rgb), 0.45);
	white-space: nowrap;
	flex-shrink: 0;
}

.btn.trc-card__offer-btn {
    background: none;
    padding: 0.9rem 1.4rem;
}

.trc-card__offer-badge {
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--color-brand);
	border: 1px solid var(--color-brand);
	border-radius: 4px;
	padding: 0.4rem 0.6rem 0.3rem;
}

/* Boutons d'action */
.trc-card__actions {
	display: flex;
	gap: 1rem;
	margin-top: auto;
	flex-wrap: wrap;
	justify-content: flex-end;
	padding-top: 2rem;
	border-top: 1.5px solid var(--color-beige-dark);
}

.trc-btn--arrow {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.trc-btn--arrow .trc-btn__arrow {
	transition: transform 0.2s ease;
	flex-shrink: 0;
	position: relative;
	top: 1px;
}

.trc-btn--arrow:hover .trc-btn__arrow {
    transform: translateX(4px);
}
.trc-btn--locate {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}
.trc-btn--locate.is-active {
    border-color: var(--color-brand);
    color: var(--color-brand);
    background: rgba(var(--color-brand-rgb), 0.06);
}

.trc-card__total-block {
	border-top: 1.5px solid var(--color-beige-dark);
	padding-top: 1.6rem;
	margin-top: 0;
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
}

.trc-card__total-row {
	display: flex;
	justify-content: flex-end;
	align-items: baseline;
	gap: 1rem;
	font-size: var(--font-size-xs);
	color: rgba(var(--color-primary-rgb), 0.55);
	padding-block: 0.4rem;
}

.trc-card__total-row--discount .trc-card__total-label,
.trc-card__total-row--discount .trc-card__total-value {
    color: var(--color-green);
}

.trc-card__total-row--total .trc-card__total-label,
.trc-card__total-row--total .trc-card__total-value {
    color: var(--color-brand);
    font-weight: 500;
    font-size: 1.6rem;
    line-height: 1;
}

.trc-card__total-row--total .trc-card__total-label,
.trc-card__total-block .trc-card__total-row .trc-card__total-label {
    width: 20rem;
}

.trc-card__total-value {
	white-space: nowrap;
	flex-shrink: 0;
	width: 8rem;
	text-align: right;
}

.trc-card__soins-row {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	border-top: 1.5px solid var(--color-beige-dark);
	padding-top: 1.6rem;
	margin-top: 1.6rem;
	margin-bottom: 2rem;
	justify-content: flex-end;
}

.trc-card__total-block + .trc-card__soins-row {
	padding-top: 2rem;
	margin-top: 1.4rem;
	justify-content: flex-end;
}

.trc-card__actions--search {
    justify-content: space-between;
    align-items: center;
    margin-top: 4rem;
}

.trc-card__actions-left {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.trc-card__soins-count {
    font-size: var(--font-size-xs);
    white-space: nowrap;
    font-weight: 500;
}

.btn.trc-btn--sec {
    background: none;
    padding: 0.9rem 1.4rem;
}

/* ── Popup marqueur (bulle condensée de la card) ─────────────────────────── */

.trc-popup {
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
    min-width: 18rem;
    font-size: 1.3rem;
}
.trc-popup__name {
    font-weight: 600;
    font-size: 1.35rem;
    color: var(--color-primary);
    text-decoration: none;
    line-height: 1.3;
    padding-right: 2rem!important;
}
.trc-popup__name:hover { color: var(--color-brand); }
.trc-popup__total {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.8rem;
    margin: 0;
    color: var(--color-primary);
}
.trc-popup__total strong { 
    font-size: 1.2rem; 
    white-space: nowrap; 
}
.btn.trc-popup__btn {
    justify-content: center;
    text-align: center;
    padding: 0.8rem 1.2rem;
    color: var(--color-white)!important;
}

.leaflet-popup-content {
	margin: 1.4rem!important;
}

.leaflet-container a.leaflet-popup-close-button {
	top: 3px!important;
	right: 8px!important;
}

.leaflet-popup-content p {
	margin: 0!important;
	font-size: 1.2rem!important;
}

/* ── Chargement ──────────────────────────────────────────────────────────── */

.trc-loading {
    display: none;
    position: absolute;
    inset: 0;
    background: rgba(249, 249, 247, 0.72);
    z-index: 5;
    align-items: center;
    justify-content: center;
}
.trc-loading.is-visible { display: flex; }
.trc-loading__spinner {
    width: 3.6rem;
    height: 3.6rem;
    border: 3px solid var(--color-brand-light);
    border-top-color: var(--color-brand);
    border-radius: 50%;
    animation: trc-spin 0.7s linear infinite;
}
@keyframes trc-spin { to { transform: rotate(360deg); } }

/* ── État vide ───────────────────────────────────────────────────────────── */

.trc-empty {
    text-align: center;
    padding: 5rem 2rem;
    color: #999;
}

.trc-empty p.trc-empty__title {
	font-size: 1.8rem;
	font-weight: 500;
	color: var(--color-brand);
	margin: 0 0 0.4rem;
	font-family: var(--font-family-serif);
}

.trc-empty p {
    font-size: var(--font-size-sm);
    color: rgba(var(--color-primary-rgb), 0.45);
}

/* ── Marqueurs Leaflet ───────────────────────────────────────────────────── */

.trc-marker-icon { background: none; border: none; }
.leaflet-attribution-flag { display: none !important; }

/* ── Page confirmation réservation ──────────────────────────────────────── */
.conf-resa__banner {
    background: var(--color-green-bg);
    border: 1.5px solid var(--color-green);
    border-radius: var(--border-radius-lg);
    padding: 4rem;
    margin-bottom: 2rem;
    text-align: center;
}

.conf-resa__check {
    display: flex;
    justify-content: center;
    margin-bottom: 1rem;
}
.conf-resa__title {
    font-size: 1.45rem;
    font-weight: 700;
    color: var(--color-primary);
    margin: 0 0 0.6rem;
}

.conf-resa__intro {
	font-size: var(--font-size-sm);
	margin-bottom: 3rem;
	font-weight: 500;
}

.conf-resa__infos {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 1rem;
	text-align: center;
	margin-inline: auto;
	align-items: center;
}

.conf-resa__info-item {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: var(--font-size-sm);
	font-weight: 500;
	color: var(--color-green);
}

.conf-resa__info-item svg {
    flex-shrink: 0;
    color: var(--color-green);
    width: 16px;
    height: 16px;
}

.conf-resa__info-item:last-child svg {
	position: relative;
	top: -0.5px;
}

.conf-resa__footer {
    margin-top: 2rem;
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    flex-wrap: wrap;
}

/* =========================================================================
   BtoC — Homepage hero (hb-*)
   ========================================================================= */

/* ── Hero ─────────────────────────────────────────────────────────────── */

.hb-main {
    background: var(--color-beige-light);
}

.hb-hero {
    padding: 5rem 0 10rem;
}

.hb-hero__inner {
	max-width: var(--container-max-width);
	margin: 0 auto;
	padding: 0 var(--container-padding-x);
	display: flex;
	gap: 4rem;
	justify-content: space-between;
}

#femme-maillot,
#homme-maillot {
    max-width: 370px;
}

.hb-hero__text-wrap {
    flex: 1;
    padding-top: 10rem;
}

.hb-hero__text {
    position: sticky;
    top: 10rem;
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.hb-hero__title {
	margin-bottom: 1rem;
	font-size: 5rem;
	font-weight: 400;
    line-height: 1.3;
}

.hb-hero__title em {
    font-style: italic;
    color: var(--color-brand);
    margin-bottom: 1rem;
}

.hb-hero__subtitle {
    font-weight: 500;
    margin: 0;
}

/* ── App widget ───────────────────────────────────────────────────────── */

.hb-app {
	background: var(--color-white);
	border-radius: var(--border-radius-xl);
	padding: 2.8rem 3rem 3rem;
	box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
	display: flex;
	flex-direction: column;
	gap: 2rem;
}

/* ── Steps ────────────────────────────────────────────────────────────── */

.drawing-stroke {
    fill: #4c3f3f;
}

.drawing-zone {
    fill: var(--color-brand);
    opacity: 0.55;
}

.hb-app__step {
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
}

.hb-app__step-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background: rgba(var(--color-brand-rgb), 0.12);
    color: var(--color-brand);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1;
    margin-bottom: -0.2rem;
}

.hb-app__step-label {
	font-size: var(--font-size-sm);
	font-weight: 600;
	margin-bottom: 1rem;
}

/* ── Genre ────────────────────────────────────────────────────────────── */

.hb-hero__app-wrap {
	display: flex;
	flex-direction: column;
	gap: 2rem;
	flex: 1;
}

.hb-app__gender {
    display: flex;
    gap: 1rem;
}

.hb-app__gender-btn {
	flex: 1;
	border-radius: var(--border-radius);
	background: transparent;
	color: rgba(var(--color-primary-rgb), 0.65);
	font-size: var(--font-size-xs);
	font-weight: 600;
	cursor: pointer;
	transition: var(--transition);
	background-color: white;
	border: 1.5px solid var(--color-beige-dark);
	padding: 1.2rem 2rem 1.3rem;
	box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
}

.hb-app__gender-btn:hover {
    border-color: var(--color-brand);
    color: var(--color-brand);
    transform: translateY(-2px)
}

.hb-app__gender-btn.is-active {
    background: var(--color-brand);
    border-color: var(--color-brand);
    color: var(--color-white);
}

/* ── Zone tabs ────────────────────────────────────────────────────────── */

.hb-app__zone-tabs {
	display: flex;
	gap: 3rem;
	border-bottom: 1.5px solid var(--color-beige-dark);
    margin-bottom: 1rem;
}

.hb-app__zone-tabs::-webkit-scrollbar { display: none; }

.hb-app__zone-tab {
	padding: 0.8rem 0;
	background: transparent;
	color: rgba(var(--color-primary-rgb), 0.45);
	font-size: var(--font-size-sm);
	font-weight: 500;
	cursor: pointer;
	transition: var(--transition);
	white-space: nowrap;
	border: none;
	font-weight: 600;
    position: relative;
}

.hb-app__zone-tab::after {
    content: '';
    position: absolute;
    bottom: -1.5px;
    left: 0;
    width: 100%;
    height: 2px;
    background: transparent;
    transition: background 0.15s;
}

.trc-fmodal__section.trc-fmodal__section--zone .hb-app__zone-tab::after {
    display: none;
}

.hb-app__zone-tab:hover,
.hb-app__zone-tab.is-active {
    color: var(--color-brand);
    border-color: var(--color-brand);
}

.hb-app__zone-tab:hover::after,
.hb-app__zone-tab.is-active::after {
    background: var(--color-brand);
}

/* ── Zone panels ──────────────────────────────────────────────────────── */

.hb-app__zone-panel {
    display: none;
}

.hb-app__zone-panel.is-active {
    display: block;
}

/* ── Selector : SVG + checklist ──────────────────────────────────────── */

.hb-app__selector {
    display: flex;
    gap: 2rem;
    flex-direction: column;
}

.hb-app__selector--list-only {
    grid-template-columns: 1fr;
}

/* ── Illustration SVG ─────────────────────────────────────────────────── */

.hb-app__illu {
	position: relative;
	margin: 0 auto;
	height: 300px;
}

.hb-illu-svg {
    display: flex;
    width: auto;
    height: 100%;
}

.hb-app__illu svg {
    width: 100%;
    height: 100%;
    display: block;
}

/* Wrapper checklist dans la grille SVG/liste */
.hb-app__checklist-wrap {
    overflow-y: auto;
}

/* ── Zones SVG interactives — règle universelle sur .drawing-zone ────────────
   Tous les SVGs utilisent désormais class="drawing-zone" sur les zones activables
   (femme-* et homme-* comme IDs uniques). Plus besoin de règles par zone.           */

[id^="hb-illu-"] .drawing-zone {
    opacity: 0;
    cursor: pointer;
    transition: opacity 0.18s ease;
}

/* Sélection directe d'une zone leaf */
[id^="hb-illu-"] .drawing-zone.hb-svg-hover    { opacity: 0.55; }
[id^="hb-illu-"] .drawing-zone.hb-svg-selected { opacity: 0.55; }

/* Sélection d'un groupe conteneur (femme-visage-entier, femme-bras-entiers…)
   → illumine toutes ses .drawing-zone descendantes                               */
[id^="hb-illu-"] .hb-svg-hover  .drawing-zone  { opacity: 0.55; }
[id^="hb-illu-"] .hb-svg-selected .drawing-zone { opacity: 0.55; }

/* ── Checklist ────────────────────────────────────────────────────────── */

.hb-app__checklist {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

/* Quand genre change, l'ancienne liste est masquée via [hidden] */
.hb-app__checklist--genre[hidden] { display: none; }

.hb-app__checklist--full {
	gap: 0.6rem;
}

.hb-app__check-item {
	display: flex;
	align-items: center;
	gap: 0.7rem;
	font-size: var(--font-size-xs);
	color: rgba(var(--color-primary-rgb), 0.75);
	cursor: pointer;
	border-radius: var(--border-radius-sm);
	transition: background 0.12s ease, color 0.12s ease;
	user-select: none;
	line-height: 1.3;
	background-color: var(--color-beige-light);
	border-radius: var(--border-radius-sm);
	padding: 1.4rem 1.6rem;
    font-weight: 500;
}

.hb-app__check-item:hover,
.hb-app__check-item.is-hover {
    background: rgba(var(--color-brand-rgb), 0.07);
    color: var(--color-brand);
}

.hb-app__check-item input:checked ~ .hb-app__check-box,
.hb-app__check-item:has(input:checked) {
    color: var(--color-brand);
}

.hb-app__check-item:has(input:checked) {
    color: var(--color-brand);
    font-weight: 600;
}

.hb-app__check-box {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 3px;
    border: 1.5px solid rgba(var(--color-primary-rgb), 0.25);
    background: var(--color-white);
    transition: var(--transition);
    position: relative;
}

.hb-app__check-item input:checked ~ .hb-app__check-box {
    background: var(--color-brand);
    border-color: var(--color-brand);
}

.hb-app__check-item input:checked ~ .hb-app__check-box::after {
	content: '';
	position: absolute;
	left: 3.5px;
	top: 1px;
	width: 5px;
	height: 8px;
	border: 1.5px solid white;
	border-top: none;
	border-left: none;
	transform: rotate(45deg);
}

/* ── Tags soins sélectionnés ─────────────────────────────────────────── */

.hb-app__selected {
	display: flex;
	flex-direction: column;
	padding-top: 2rem;
	border-top: 1.5px solid var(--color-beige-dark);
}

.hb-app__phototype {
    display: flex;
    flex-direction: column;
    padding-top: 2rem;
    border-top: 1.5px solid var(--color-beige-dark);
}

.hb-app__phototype-label {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: var(--font-size-sm);
    font-weight: 600;
    margin-bottom: 0.6rem;
}

.hb-pt-info-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    background: none;
    border: none;
    cursor: pointer;
    color: rgba(var(--color-primary-rgb), 0.25);
    transition: color 0.15s;
    line-height: 1;
    position: relative;
    top: 0.5px;
}
.hb-pt-info-btn:hover,
.hb-pt-info-btn:focus-visible {
    color: var(--color-brand);
    outline: none;
}

/* ── Modal phototypes ──────────────────────────────────────────────────────── */
.hb-pt-modal {
    position: fixed;
    inset: 0;
    z-index: 9000;
    display: flex;
    align-items: center;
    justify-content: center;
}
.hb-pt-modal[hidden] { display: none; }

.hb-pt-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(var(--color-beige-dark-rgb), 0.9);
    backdrop-filter: blur(2px);
}

.hb-pt-modal__panel {
    position: relative;
    z-index: 1;
    background: #fff;
    border-radius: 1.2rem;
    padding: 3.2rem;
    max-width: 58rem;
    width: calc(100% - 3.2rem);
    max-height: 88vh;
    overflow-y: auto;
    box-shadow: 20px 20px 15px rgba(var(--color-primary-rgb), 0.15);
}

.hb-pt-modal__close {
    position: absolute;
    top: 1.6rem;
    right: 1.6rem;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3.2rem;
    height: 3.2rem;
    background: var(--color-beige-light);
    border: none;
    border-radius: 50%;
    cursor: pointer;
    color: var(--color-primary);
    transition: background 0.15s;
}
.hb-pt-modal__close:hover { background: var(--color-beige-dark); }

.hb-pt-modal__title {
	font-size: 1.8rem;
	font-weight: 500;
	margin: 0 0 3rem;
}

.hb-pt-modal__grid {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.hb-pt-modal__card {
	display: flex;
	align-items: center;
	gap: 2rem;
}

.hb-pt-modal__img {
	width: 7rem;
	height: auto;
	flex-shrink: 0;
}

.hb-pt-modal__content {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.hb-pt-modal__name {
	color: var(--color-brand);
	font-family: var(--font-family-serif);
	font-size: 1.5rem;
}

.hb-pt-modal__desc {
    font-size: var(--font-size-xs);
}

.hb-app__phototype-list {
    list-style: none;
    margin-top: 0.4rem;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}

.trc-fmodal__section .hb-app__phototype-list {
    margin-top: 0;
    flex-direction: row;
}

.trc-fmodal__section .hb-app__phototype-list li {
    width: fit-content;
}

.hb-app__selected-label {
	font-size: var(--font-size-sm);
	font-weight: 600;
	margin-bottom: 0.6rem;
}

.hb-app__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    min-height: 2.6rem;
    align-items: center;
}

.hb-app__no-selection {
    font-size: 1.25rem;
    color: rgba(var(--color-primary-rgb), 0.38);
    font-style: italic;
}

.hb-app__tag {
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
	background: rgba(var(--color-brand-rgb), 0.1);
	color: var(--color-brand);
	border-radius: 2rem;
	padding: 0.4rem 0.9rem 0.5rem 1rem;
	font-size: var(--font-size-xs);
	font-weight: 500;
}

.hb-app__tag-remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    color: var(--color-brand);
    font-size: 1.4rem;
    line-height: 1;
    cursor: pointer;
    padding: 0;
    opacity: 0.7;
    transition: opacity 0.12s ease;
    margin-left: 0.1rem;
}

.hb-app__tag-remove:hover { opacity: 1; }

/* ── Astuce ───────────────────────────────────────────────────────────── */

.hb-app__astuce {
    font-size: var(--font-size-xs);
    color: rgba(var(--color-primary-rgb), 0.48);
    margin: -0.4rem 0 0;
    line-height: 1.5;
}

/* ── Localisation ─────────────────────────────────────────────────────── */

.hb-app__loc-wrap {
    position: relative;
    display: flex;
    align-items: center;
}

.gb-app-location {
    flex: 1.3;
    position: relative;
}

.hb-app__loc-icon {
	position: absolute;
	left: 1rem;
	color: var(--color-brand);
	pointer-events: none;
	width: 22px;
	height: 22px;
	stroke-width: 1.6;
}

.hb-app__loc-input {
	width: 100%;
	height: 4.8rem;
	padding: 1.3rem 1.4rem 1.3rem 3.4rem;
	font-family: var(--font-family);
	font-size: var(--font-size-sm);
	color: var(--color-primary);
	background-color: var(--color-white);
	border: 1.5px solid var(--color-beige-dark);
	border-radius: var(--border-radius);
	outline: none;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
	appearance: none;
	font-weight: 500;
}

.hb-app__loc-input::placeholder {
    color: rgba(var(--color-primary-rgb), 0.45);
}

.hb-app__loc-input:focus {
    border-color: var(--color-brand);
    box-shadow: 0 0 0 3px rgba(var(--color-brand-rgb), 0.1);
}

.hb-app__loc-input.hb-loc--error {
	border-color: var(--color-brand);
	background-color: rgba(var(--color-brand-rgb), 0.1);
}

.hb-app__actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
}

.hb-app__loc-error {
	margin-top: 0.2rem;
	color: var(--color-brand);
	font-size: 1.1rem;
	font-weight: 500;
	position: absolute;
}

.hb-app__loc-error[hidden] {
    display: none;
}

/* ── Bouton Rechercher ───────────────────────────────────────────────── */

.hb-app__submit {
    width: 100%;
    height: 4.8rem;
    justify-content: center;
    padding: 1.2rem;
    font-weight: 600;
    border-radius: var(--border-radius);
    gap: 0.8rem;
    flex: 0.7;
    font-size: var(--font-size-sm);
}

/* ═══════════════════════════════════════════════════════════════════════
   Avantages
   ══════════════════════════════════════════════════════════════════════ */

.hb-advantages {
    padding-block: 10rem;
    background: var(--color-white);
}

.hb-advantages__inner {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-x);
}

.hb-advantages__title {
	font-size: 4rem;
	font-weight: 400;
	text-align: center;
	line-height: 1.3;
	margin: 0 0 7rem;
}

.hb-advantages__title em {
    font-style: italic;
    color: var(--color-brand);
}

.hb-advantages__cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
}

.hb-adv-card {
	background: var(--color-white);
	border-radius: var(--border-radius-lg);
	padding: 5rem 6rem 3rem;
	text-align: center;
	border: 1.5px solid var(--color-beige-dark);
	position: relative;
}

.fc-aside__title--mobile {
    display: none;
}

.hb-adv-card__icon {
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: -3.5rem;
	left: 50%;
	transform: translateX(-50%);
	width: 7rem;
	height: 7rem;
	border-radius: 50%;
	background: var(--color-beige-light);
	border: 1.5px solid var(--color-beige-dark);
	background: white;
}

.hb-adv-card__title {
	font-weight: 600;
	margin: 0 0 0.8rem;
	font-size: 1.7rem;
}

.hb-adv-card__text {
	font-size: var(--font-size-sm);
	color: rgba(var(--color-primary-rgb), 0.65);
	margin: 0;
}

/* ═══════════════════════════════════════════════════════════════════════
   CTA Pro
   ══════════════════════════════════════════════════════════════════════ */

.hb-cta-pro {
    background: var(--color-beige-dark);
    padding: 0;
    overflow: hidden;
}

.hb-cta-pro__inner {
	max-width: var(--container-max-width);
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1fr 1fr;
	min-height: 420px;
	padding: 10rem var(--container-padding-x);
}

.hb-cta-pro__image {
	position: relative;
	overflow: hidden;
	border-radius: 20px;
	box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
    aspect-ratio: 4 / 5;
}

.hb-cta-pro__image img {
	display: block;
	object-fit: cover;
	width: 100%;
	height: 100%;
	transition: transform 0.35s ease;
}

.hb-cta-pro__image-placeholder {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg,
        rgba(var(--color-brand-rgb), 0.15) 0%,
        rgba(var(--color-beige-dark-rgb), 0.4) 100%
    );
}

.hb-cta-pro__content {
    padding: 4rem var(--container-padding-x) 4rem 3.5rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 1.4rem;
}

.hb-cta-pro__title {
	font-size: 4.6rem;
	font-weight: 400;
	line-height: 1.3;
	margin-bottom: 1rem;
}

.hb-cta-pro__list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
}

.hb-cta-pro__list li {
	display: flex;
	align-items: center;
	gap: 0.8rem;
}

.hb-cta-pro__list li svg {
    flex-shrink: 0;
    margin-top: 0.25rem;
}

.hb-cta-pro__btn {
    align-self: flex-start;
    margin-top: 2rem;
    padding-right: 7rem;
}

.hb-cta-pro__inner:has(.hb-cta-pro__btn:hover) .hb-cta-pro__image img {
    transform: scale(1.05);
}

.hb-cta-pro__btn svg {
	position: absolute;
	top: 15.5px;
	right: 2rem;
	flex-shrink: 0;
	fill: none;
	stroke: var(--color-white);
	stroke-width: 0.8px;
	width: 15px;
	height: 10px;
	transform: translateX(0);
	transition: transform 0.3s ease;
}

.hb-cta-pro__btn:hover svg {
    transform: translateX(4px);
}

/* ═══════════════════════════════════════════════════════════════════════
   FAQ
   ══════════════════════════════════════════════════════════════════════ */

.hb-faq {
    padding: 6rem 0 5rem;
    background: var(--color-beige-light);
}

.hb-faq__inner {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding-x);
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 3rem;
    align-items: start;
}

.hb-faq__heading {
    position: sticky;
    top: 6rem;
}

.hb-faq__big-text {
    font-family: var(--font-family-serif);
    font-size: 8rem;
    font-weight: 800;
    color: var(--color-brand);
    line-height: 1;
    display: block;
}

.hb-faq__items {
    display: flex;
    flex-direction: column;
}

.hb-faq__item {
    border-bottom: 1px solid rgba(var(--color-primary-rgb), 0.1);
}

.hb-faq__item:first-child {
    border-top: 1px solid rgba(var(--color-primary-rgb), 0.1);
}

.hb-faq__question {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.6rem 0;
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--color-primary);
    cursor: pointer;
    user-select: none;
    transition: color 0.15s ease;
}

.hb-faq__question::-webkit-details-marker { display: none; }

.hb-faq__question:hover {
    color: var(--color-brand);
}

.hb-faq__icon {
    flex-shrink: 0;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    border: 1.5px solid rgba(var(--color-primary-rgb), 0.25);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    transition: var(--transition);
}

.hb-faq__icon::before,
.hb-faq__icon::after {
    content: '';
    position: absolute;
    background: currentColor;
    border-radius: 1px;
    transition: transform 0.2s ease, opacity 0.2s ease;
}

.hb-faq__icon::before { width: 10px; height: 1.5px; }
.hb-faq__icon::after  { width: 1.5px; height: 10px; }

.hb-faq__item[open] .hb-faq__icon::after {
    transform: rotate(90deg);
    opacity: 0;
}

.hb-faq__item[open] .hb-faq__question {
    color: var(--color-brand);
}

.hb-faq__item[open] .hb-faq__icon {
    border-color: var(--color-brand);
    color: var(--color-brand);
}

.hb-faq__answer {
    padding: 0 0 1.6rem;
}

.hb-faq__answer p {
    font-size: var(--font-size-sm);
    color: rgba(var(--color-primary-rgb), 0.7);
    line-height: 1.7;
}

.legal__confiance-intro {
	font-size: 1.8rem;
	font-weight: 400;
	font-style: italic;
	font-family: var(--font-family-serif);
}

.fc-hero__cta--mobile {
    display: none;
}

#add_payment_method #payment ul.payment_methods, 
.woocommerce-cart #payment ul.payment_methods, 
.woocommerce-checkout #payment ul.payment_methods {
	text-align: left;
	padding: 0!important;
	border-bottom: none!important;
	margin: 0;
	list-style: none outside;
}

.woocommerce-checkout #payment ul.payment_methods {
    margin-bottom: 2rem!important;
}

#add_payment_method #payment, 
.woocommerce-cart #payment, 
.woocommerce-checkout #payment {
	background: transparent!important;
	border-radius: 0!important;
}

#add_payment_method #payment ul.payment_methods li, 
.woocommerce-cart #payment ul.payment_methods li, 
.woocommerce-checkout #payment ul.payment_methods li {
	margin-bottom: 0 !important;
}

.ppcp-messages {
    margin-bottom: 1rem;
}

#add_payment_method #payment ul.payment_methods li input, 
.woocommerce-cart #payment ul.payment_methods li input, 
.woocommerce-checkout #payment ul.payment_methods li input {
	margin: 0!important;
}

.pbt-card--retract {
    margin-top: 5rem;
}

@media (max-width: 1536px) {

    :root {
        --container-max-width: 1200px;
    }

    .legal-pro__title {
        font-size: 7rem;
        max-width: 70rem;
    }

    .legal-pro__article h2 {
        font-size: 2.3rem;
        font-weight: 400;
    }

    .legal-pro__nav-link {
        font-size: 2.2rem;
    }

    .legal-pro__sidebar {
        width: 21rem;
    }

    .legal-pro__body-inner {
        gap: 3rem;
    }

    .contact-pro__title {
        font-size: 5rem;
    }

    .contact-pro__hero-inner {
        justify-content: space-between;
    }

    .hb-app__illu {
        height: 250px;
    }

    .trc-list-col {
        width: 60rem;
        min-width: 60rem;
    }

    .trc-cal {
        margin-block: 1.4rem 0;
    }

    .trc-card__name {
        font-size: 1.8rem;
    }

    .trc-card__photo {
        width: 16rem;
        height: 26rem;
    }

    .trc-card__phototypes {
        margin-top: 1.4rem;
    }

    .fc-chooser__dot::before {
        width: 49rem;
    }

    .pbt-legal-panel__title {
        font-size: 2.4rem;
    }

    .reg-intro__title {
        font-size: 4rem;
    }

    .reg-intro__desc,
    .reg-intro__feature {
        font-size: var(--font-size-sm);    
    }

    .why-home-pro__title {
        font-size: 4.4rem;
    }

    .market-home-pro__title {
        font-size: 4rem;
        max-width: 60rem;
    }

    .market-home-pro__stat-value {
        font-size: 8rem;
    }

    .market-home-pro__conclusion {
        font-size: 3.4rem;
        max-width: 82rem;
    }

    .slots-home-pro__title {
        font-size: 4.4rem;
    }

    .slots-home-pro__conclusion {
        font-size: 3.4rem;
        max-width: 90rem;
    }

    .booking-home-pro__title {
        font-size: 4.4rem;
        max-width: 68rem;
    }

}

@media (max-width: 1280px) {

    :root {
        --container-max-width: 100%;
        --font-size-xs: 1.15rem;
        --font-size-sm: 1.25rem;
        --font-size-base: 1.3rem;
    }

    .header__right {
        gap: 2rem;
    }

    .header__nav {
        gap: 2.4rem;
    }

    .header__nav-link {
        font-size: 1.25rem;
    }

    .btn {
        padding: 1.2rem 2rem 1.2rem;
    }

    .faq-aide-pro {
        padding: 10rem 0;
    }

    .faq-aide-pro__title {
        font-size: 4rem;
        margin-bottom: 7rem;
    }

    .faq-aide-pro__left {
        width: auto;
        min-width: 260px;
    }

    .faq-aide-pro__question-text {
        font-size: 2rem;
    }

    .faq-aide-pro__cross {
        width: 20px;
        height: 20px;
    }

    .faq-aide-pro__nav-list {
        gap: 0;
    }

    .faq-aide-pro__item {
        padding: 2.9rem 0 2.45rem;
    }

    .faq-aide-pro__cross line {
        stroke-width: 1.6;
    }

    .contact-home-pro__title {
        font-size: 4rem;
    }

    .contact-home-pro__choice {
        gap: 1rem;
        max-width: 40rem;
    }

    .contact-home-pro__choice-btn {
        padding: 1.4rem 2rem;
    }

    .footer__brand {
        flex: 0 0 20rem;
    }

    .footer__nav {
        gap: 5rem;
    }

    .footer__inner {
        gap: 8rem;
    }

    .page-template-btoc .footer__logo {
        width: 120px;
        height: auto;
    }

    .footer__col-title {
        font-size: 1.5rem;
        margin-bottom: 1.2rem;
    }

    .footer__tagline {
        font-size: 1.6rem;
    }

    .footer__visual {
        padding: 2rem 0;
    }

    .faq-aide-pro__content {
        padding-left: 4rem;
    }

    .legal-pro__nav-link {
        font-size: 1.8rem;
    }

    .legal-pro__body-inner {
        padding: 0;
        gap: 3rem;
    }

    .legal-pro__sidebar {
        width: 20rem;
    }

    .legal-pro__content {
        padding: 6rem 0 8rem 5rem;
    }

    .legal-pro__title {
        font-size: 6rem;
        max-width: 56rem;
    }

    .legal-pro__article li::before {
        top: 12px;
    }

    .legal__confiance-intro {
        font-size: 1.6rem;
    }

    .contact-pro__title {
        font-size: 4rem;
    }

    .contact-pro__desc {
        max-width: 40rem;
    }

    .contact-pro__hero-inner {
        justify-content: center;
    }

    .hb-advantages__title {
        font-size: 3rem;
        line-height: 1.4;
    }

    .hb-adv-card__title {
        font-weight: 500;
        font-size: 1.6rem;
    }

    .hb-adv-card {
        padding: 5rem 3rem 3rem;
    }

    .hb-adv-card__icon {
        width: 6rem;
        height: 6rem;
    }

    .hb-cta-pro__title {
        font-size: 3.6rem;
        max-width: 40rem;
        line-height: 1.4;
    }

    .hb-cta-pro__list li svg {
        flex-shrink: 0;
        margin-top: 0;
    }

    .btn.hb-cta-pro__btn {
        padding-right: 7rem;
    }

    .hb-cta-pro__btn svg {
        stroke-width: 0.7px;
    }

    .hb-cta-pro__inner {
        grid-template-columns: 0.9fr 1.1fr;
    }

    .faq-home-pro__title {
        font-size: 10rem;
    }

    .faq-home-pro__left {
        width: 26rem;
    }

    .faq-home-pro__inner {
        justify-content: center;
    }

    .faq-home-pro__list {
        max-width: 60rem;
    }

    .faq-home-pro__cross {
        width: 20px;
        height: 20px;
    }

    .faq-home-pro__cross line {
        stroke-width: 1.6;
    }

    .hb-hero__title {
        font-size: 4rem;
    }

    .hb-hero__text-wrap {
        max-width: 40rem;
    }

    .hb-hero__inner {
        gap: 6rem;
    }

    .hb-app__submit {
        height: 4.2rem;
    }

    .hb-app__loc-input {
        height: 4.2rem;
    }

    .hb-app__loc-icon {
        width: 20px;
        height: 20px;
    }

    .trc-filter-bar {
        padding: 0 2rem;
    }

    .trc-search {
        margin: 0 auto 3rem;
    }

    .trc-results-meta {
        padding: 2rem 2rem;
    }

    .trc-card__body {
        padding: 3rem 2rem;
    }

    .trc-list-col {
        width: 52rem;
        min-width: 52rem;
    }

    .trc-card__photo {
        width: 14rem;
        height: 22rem;
    }

    .trc-cal__cell {
        height: 3.4rem;
    }

    .fc-layout {
        grid-template-columns: minmax(0, 1fr) 34rem;
        gap: 4rem;
    }

    .fc-dispo {
        padding: 2rem;
    }

    .fc-dispo__title {
        font-size: 1.6rem;
    }

    .fc-aside-avis__avg-block {
        width: 12rem;
        height: 14rem;
    }

    .fc-aside-avis__avg-score {
        font-size: 3.4rem;
    }

    .fc-aside-avis__count {
        font-size: 0.9rem;
    }

    .fc-aside-avis__criteria-block {
        padding-inline: 1.4rem;
    }

    .fc-aside-avis__criteria-score svg {
        width: 13px;
        height: 13px;
    }

    .fc-aside-avis__item-stars svg {
        width: 12px;
        height: 12px;
    }

    .fc-aside-avis__item-date {
        font-size: 1rem;
    }

    .fc-info__title {
        font-size: 1.7rem;
    }

    .fc-chooser__dot::before {
        width: calc(100vw - 34rem - 4rem - 21rem - 4rem - 3.8rem);
    }

    .fc-toggle__btn {
        font-size: var(--font-size-sm);
    }

    .fc-price-group__header {
        padding-left: 3rem;
    }

    .fc-price-group__label {
        font-size: 1.8rem;
    }

    .fc-table-wrap {
        padding: 3rem 3rem 4rem;
    }

    .fc-prices__th--presta {
        width: 17rem;
    }

    .fc-lightbox__img {
        max-width: 90%;
    }

    .fc-lightbox__nav {
        width: 3.8rem;
        height: 3.8rem;
    }

    .fc-lightbox__nav svg {
        width: 19px;
        height: 19px;
    }

    .rbk-header__title {
        font-size: 2.5rem;
    }

    .fc-hero__meta-row {
        font-size: 1.25rem;
    }

    .rbk-card__title {
        font-size: 1.7rem;
        margin-bottom: 4rem;
    }

    .rbk-card__subtitle span {
        bottom: 0.5px;
    }

    .rbk-card__subtitle {
        width: 3rem;
        height: 3rem;
        font-weight: 600;
        font-size: 1.3rem;
    }

    .rbk-card {
        padding: 2rem;
    }

    #rbk-planning-card.rbk-card {
        padding: 3rem 1rem;
    }

    .pbt-legal-panel__title {
        font-size: 2rem;
    }

    .pbt-legal-body h2 {
        font-size: 1.6rem;
    }

    .pbt-legal-body h3 {
        font-size: 1.4rem !important;
    }

    .login-pro__right {
        padding: 4rem 5rem;
    }

    .login-pro__right-inner {
        width: 100%;
    }

    .btn.reg-intro__cta {
        padding-right: 6rem;
    }

    .reg-intro__title {
        font-size: 3.4rem;
        margin-bottom: 2rem;
    }

    .login-pro__title {
        font-size: 1.6rem;
    }

    .account-btoc__main h2 {
        font-size: 2rem;
    }

    .account-btoc__avis-criteria-title,
    .account-btoc__avis-comment-label {
        font-size: 1.4rem;
    }

    .account-btoc__avis-criterion-label {
        font-size: 1.15rem;
        font-weight: 500;
    }

    .account-btoc__avis-criteria {
        gap: 0.6rem;
    }

    .account-btoc__avis-comment-wrapper {
        margin-left: 0;
        flex: 0 0 100%;
        border-left: 1.5px solid var(--color-beige-dark);
    }

    .account-btoc__avis-submitted {
        flex-wrap: wrap;
    }

    .account-btoc__parrainage-code {
        font-size: 2rem;
    }

    .account-btoc__parrainage-code-label {
        font-size: 0.9rem;
        font-weight: 700;
    }

    .account-btoc__parrainage-code-wrap {
        gap: 4rem;
        margin-bottom: 1.4rem;
    }

    .account-btoc__parrainage-stats {
        gap: 1.4rem;
    }

    .account-btoc__kcoin-balance-value {
        font-size: 5rem;
    }

    .account-btoc__kcoin-euros {
        font-size: 1.4rem;
    }

    .guides-aide-pro__grid {
        gap: 8rem 2rem;
    }

    .guides-aide-pro__card {
        padding: 5rem 3rem 4rem;
    }

    .guides-aide-pro__title {
        font-size: 5rem;
    }

    .slots-home-pro__suptitle, 
    .booking-home-pro__suptitle, 
    .guides-home-pro__suptitle, 
    .contact-home-pro__suptitle, 
    .guides-aide-pro__suptitle, 
    .guide-single-pro__suptitle, 
    .legal-pro__suptitle, 
    .commission-tarifs-pro__suptitle {
        font-size: 1rem;
    }

    .guides-aide-pro__card-title {
        font-size: 1.6rem;
    }

    .guide-single-pro__body-inner {
        gap: 2rem;
    }

    .guide-single-pro__sidebar {
        width: 30rem;
        padding: 4rem 0;
    }

    .guide-single-pro__nav-list {
        gap: 0;
    }

    .guide-single-pro__nav-cat {
        font-size: 1.6rem;
    }

    .guide-single-pro__content {
        padding: 5rem 0 5rem 4rem;
    }

    .plans-tarifs-pro__title {
        font-size: 5rem;
    }

    .reg-plan {
        padding: 3.8rem 1.8rem 4rem;
    }

    .reg-plans {
        width: 100%;
        gap: 1.2rem;
    }

    .reg-plan__feature {
        font-size: var(--font-size-xs);
    }

    .commission-tarifs-pro__title {
        font-size: 4rem;
    }

    .compare-tarifs-pro__outro-text {
        font-size: 4rem;
        max-width: 88rem;
    }

    .faq-tarifs-pro__title {
        font-size: 10rem;
    }

    .cta-tarifs-pro__title {
        font-size: 5rem;
    }

    .btn.reg-header__back {
        font-size: 1.05rem;
        padding: 1rem 1.2rem 1rem;
    }

    .reg-header__back svg {
        stroke-width: 0.7;
    }

    .btn.reg-form__next {
        padding-right: 12rem;
    }

    .register-pro__slide--form {
        width: calc(100% - 4rem);
    }

    .reg-plan__price--text {
        font-size: 6rem;
    }

    .reg-plan__price {
        font-size: 8rem;
    }

    .hero-home-pro__right-inner {
        max-width: 40rem;
    }

    .hero-home-pro__left-inner {
        max-width: 40rem;
    }

    .reg-intro__title {
        font-size: 3rem;
        line-height: 1.5;
        font-weight: 400;
    }

    .reg-intro__desc {
        max-width: 40ch;
    }

    .why-home-pro__title {
        font-size: 3.8rem;
    }

    .why-home-pro__item-title {
        font-size: 2rem;
        line-height: 1.5;
    }

    .why-home-pro__icon {
        width: 5.4rem;
        height: 5.4rem;
    }

    .icon-pin, 
    .icon-calendar {
        width: 22px;
    }

    .icon-handshake {
        width: 30px;
    }

    .icon-lock {
        width: 18px;
    }

    .market-home-pro__stat-value {
        font-size: 6rem;
    }

    .market-home-pro__stat-label {
        font-size: var(--font-size-xs);
    }

    .market-home-pro__stat-value-pre-number {
        font-size: 5rem;
    }

    .steps-home-pro__item {
        padding: 5rem 1.8rem 4rem;
    }

    .slots-home-pro__col-title {
        font-size: 2rem;
    }

    .slots-home-pro__conclusion {
        font-size: 3.4rem;
        max-width: 78rem;
    }

    .booking-home-pro__title {
        font-size: 4rem;
        max-width: 61rem;
    }

    .guides-home-pro__title {
        font-size: 4rem;
    }

    .guides-home-pro__grid {
        gap: 6rem 2rem;
    }

    .guides-home-pro__card {
        padding: 5rem 3rem 4rem;
    }

}

@media (max-width: 1024px) {
    .hb-hero__inner {
        flex-direction: column;
        gap: 4rem;
        align-items: center;
    }

    .hb-hero__text-wrap {
        max-width: none;
        padding-top: 0;
    }

    .header__left {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        flex: 0 0 8.2rem;
        gap: 2.4rem;
    }

    .hb-hero__app-wrap {
        max-width: 64rem;
    }

    .header__right {
        flex: 0 0 8.2rem;
        justify-content: flex-end;
    }

    .header__logo {
        flex: 1 1 auto;
        width: auto;
        justify-content: center;
    }

    .hb-hero__text { 
        text-align: center; 
    }

    .hb-hero__title {
        font-size: 3rem;
        line-height: 1.4;
    }

    .hb-advantages__cards {
        grid-template-columns: 1fr;
        max-width: 480px;
        margin-inline: auto;
        gap: 6rem;
    }

    .hb-cta-pro__content {
        padding: 0 0 0 3rem;
        min-width: 43rem;
    }

    .hb-cta-pro__title {
        font-size: 2.6rem;
        max-width: 28rem;
        margin-bottom: 0;
    }

    .hb-faq__inner {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .hb-faq__heading {
        position: static;
        text-align: center;
    }

    .hb-cta-pro__inner {
        align-items: center;
    }

    .hb-cta-pro__image {
        aspect-ratio: auto;
        min-height: 44rem;
        height: 44rem;
    }

    .faq-home-pro__title {
        font-size: 8.4rem;
    }

    .faq-home-pro__question-text {
        font-size: 1.8rem;
    }

    .faq-home-pro__cross {
        width: 18px;
        height: 18px;
    }

    .faq-home-pro__left {
        width: 20rem;
    }

    /* --- Header mobile (burger menu) --- */

    .header__burger {
        display: flex;
    }

    .header__nav {
        display: none;
    }

    .header__actions .btn-outline {
        border-color: var(--color-brand);
    }

    .header__actions .btn {
        position: relative;
        padding: 0;
        width: 3.6rem;
        height: 3.6rem;
        border-radius: 50%;
        gap: 0;
    }

    .header__actions .btn-outline {
        overflow: initial;
    }

    .header__action-icon {
        display: block;
    }

    .header__action-label,
    .header__cta-label {
        display: none;
    }

    .header__cta-badge,
    .header__account-badge {
        display: inline-flex;
    }

    .header__cta-badge[hidden] {
        display: none;
    }

    .header__mobile-overlay {
        position: fixed;
        inset: 0;
        background-color: rgba(var(--color-beige-dark-rgb), 0.9);
        z-index: 990;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.3s ease;
    }

    .header__mobile-overlay.is-visible {
        opacity: 1;
        pointer-events: auto;
    }

    .header__mobile-overlay[hidden] {
        display: none;
    }

    .header__mobile-menu {
        display: flex;
        flex-direction: column;
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        width: 40rem;
        max-width: 85vw;
        background-color: var(--color-beige-light);
        z-index: 991;
        padding: 9rem 4rem 3rem;
        overflow-y: auto;
        visibility: hidden;
        transform: translateX(-100%);
        transition: transform 0.3s ease, visibility 0.3s ease;
        box-shadow: 10px 0 30px rgba(var(--color-primary-rgb), 0.15);
    }

    .header__mobile-menu.is-open {
        visibility: visible;
        transform: translateX(0);
    }

    .header__mobile-menu-top {
        position: absolute;
        right: 3rem;
        top: 3rem;
    }

    .header__mobile-close {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 3.2rem;
        height: 3.2rem;
        border: none;
        background: var(--color-beige-dark);
        color: rgba(var(--color-brand-rgb), 1);
        cursor: pointer;
        border-radius: 50%;
    }

    .header__mobile-nav {
        display: flex;
        flex-direction: column;
        gap: 3rem;
    }

    .header__mobile-nav-group {
        display: flex;
        flex-direction: column;
        gap: 1.2rem;
    }

    .header__mobile-nav-group:first-child {
        gap: 2rem;
    }

    .header__mobile-nav-group:first-child .header__mobile-nav-link {
        font-family: var(--font-family-serif);
        font-size: 2rem;
        font-weight: 400;
        color: var(--color-brand);
        line-height: 1;
    }

    .header__mobile-nav-group + .header__mobile-nav-group {
        padding-top: 3rem;
        border-top: 1px solid rgba(var(--color-brand-rgb), 0.15);
    }

    .header__mobile-nav-link {
        font-weight: 500;
        font-size: 1.3rem;
    }

    .header__mobile-nav-link:hover,
    .header__mobile-nav-link:focus-visible {
        color: var(--color-brand);
    }

    .header__mobile-footer {
        margin-top: auto;
        padding-top: 3rem;
        display: flex;
        flex-direction: column;
        gap: 1.6rem;
        border-top: 1px solid rgba(var(--color-brand-rgb), 0.15);
    }

    .header__mobile-legal {
        display: flex;
        flex-direction: column;
        gap: 0.8rem;
    }

    .header__mobile-social {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 1.6rem;
    }

    .header__mobile-social-logo svg {
        width: auto;
        height: 2.7rem;
    }

    .header__mobile-social-text {
        font-size: var(--font-size-xs);
        color: var(--color-brand);
        text-align: center;
        font-family: var(--font-family-serif);
        font-weight: 500;
    }

    .header__mobile-social-icons {
        display: flex;
        align-items: center;
        gap: 1.2rem;
    }

    .header__mobile-social-link {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 3.4rem;
        height: 3.4rem;
        border-radius: 50%;
        border: 1px solid var(--color-brand);
        color: var(--color-brand);
        transition: var(--transition);
    }

    .header__mobile-social-link:hover,
    .header__mobile-social-link:focus-visible {
        background-color: var(--color-brand);
        color: var(--color-white);
    }

    .header__mobile-social-link svg {
        width: 15px;
        height: 15px;
        fill: currentColor;
    }

    .faq-aide-pro__title {
        font-size: 3rem;
        margin-bottom: 6rem;
        font-weight: 400;
    }

    .faq-aide-pro {
        padding: 7rem 0;
    }

    .faq-aide-pro__left {
        width: 220px;
        min-width: 220px;
    }

    .faq-aide-pro__nav-btn {
        padding: 0.6rem 0;
        font-size: 1.6rem;
        font-weight: 500;
    }

    .faq-aide-pro__nav-list {
        width: 100%;
    }

    .faq-aide-pro__question-text {
        font-size: 1.8rem;
    }

    .faq-aide-pro__cross {
        width: 18px;
        height: 18px;
    }

    .slots-home-pro__suptitle, 
    .booking-home-pro__suptitle, 
    .guides-home-pro__suptitle, 
    .contact-home-pro__suptitle, 
    .guides-aide-pro__suptitle, 
    .guide-single-pro__suptitle, 
    .legal-pro__suptitle, 
    .commission-tarifs-pro__suptitle {
        font-size: 1rem;
    }

    .slots-home-pro__suptitle::after, 
    .booking-home-pro__suptitle::after, 
    .guides-home-pro__suptitle::after, 
    .contact-home-pro__suptitle::after, 
    .guides-aide-pro__suptitle::after, 
    .guide-single-pro__suptitle::after, 
    .legal-pro__suptitle::after, 
    .commission-tarifs-pro__suptitle::after {
        height: 1px;
    }

    .contact-home-pro__title {
        font-size: 3rem;
        font-weight: 400;
    }

    .contact-home-pro__prompt {
        font-size: 1.5rem;
        font-weight: 500;
    }

    .contact-home-pro__choice {
        max-width: 34rem;
    }

    .footer__copyright p {
        font-size: 1rem;
        font-weight: 600;
    }

    .footer__tagline {
        font-size: 1.5rem;
    }

    .footer__visual-svg {
        width: 70px;
    }

    .footer__visual {
        padding: 1.2rem 0;
    }

    .footer__main {
        padding: 12rem 0 7rem;
    }

    .footer__nav {
        gap: 4rem 2rem;
        flex-wrap: wrap;
        justify-content: flex-start;
        max-width: 42rem;
    }

    .footer__inner {
        gap: 5rem;
        justify-content: space-between;
    }

    .footer__col {
        flex: calc(50% - 1rem);
    }

    .page-template-btoc .footer__logo {
        width: 110px;
    }

    .footer__desc {
        font-size: var(--font-size-xs);
    }

    .footer__brand {
        flex: 0 0 18rem;
    }

    .legal-pro__sidebar {
        width: 15rem;
    }

    .legal-pro__nav-link {
        font-size: 1.6rem;
    }

    .legal-pro__content {
        padding: 4rem 0 8rem 4rem;
    }

    .legal-pro__title {
        font-size: 4rem;
        max-width: 40rem;
        line-height: 1.3;
        font-weight: 400;
    }

    .legal-pro__article h2 {
        font-size: 2rem;
        font-weight: 500;
    }

    .legal-pro__article h2:first-child {
        margin-top: 2rem;
    }

    .legal-pro__article h3 {
        font-size: 1.6rem;
    }

    .legal__confiance-intro {
        font-size: 1.5rem;
    }

    .contact-pro__title {
        font-size: 3rem;
    }

    .contact-pro__desc {
        max-width: 56rem;
    }

    .contact-pro__hero-inner {
        gap: 4rem;
    }

    .contact-pro__form-title {
        font-size: 1.5rem;
    }

    .contact-pro__form-row--half {
        gap: 1rem;
    }

    .contact-pro__form {
        gap: 1rem;
    }

    .contact-pro__rgpd-checkbox.reg-checkbox .reg-checkbox__label {
        font-size: 1rem;
        line-height: 1.9;
    }

    .trc-list-col {
        width: 100%;
        min-width: auto;
        border-right: none;
    }

    .trc-card__photo {
        width: 25rem;
        height: 30rem;
    }

    .trc-cal__days {
        justify-content: flex-start;
    }

    .trc-active-chip {
        height: 4rem;
    }

    .trc-hero__title {
        font-size: 2.6rem;
    }

    .trc-view-switcher { display: flex; }

    .trc-filter-bar .trc-filter-btn { display: none; }

    .trc-body { grid-template-columns: 1fr; }

    .trc-list-col { display: block; }

    .trc-map-col {
        position: static;
        height: 80vh;
        top: auto;
        display: none;
    }

    .trc-body.show-map .trc-list-col { display: none; }
    .trc-body.show-map .trc-map-col  { display: block; }

    .trc-search { flex-wrap: wrap; }
    .trc-cal__label { width: 7rem; }
    .trc-cal__cell { width: 3rem; height: 3rem; }

    .fc-hero__title {
        font-size: 2.8rem;
    }

    .fc-layout {
        grid-template-columns: 1fr;
        gap: 3.4rem;
    }

    .fc-aside {
        position: static;
        max-width: 50rem;
        margin-inline: auto;
        margin-top: 8rem;
    }

    .fc-aside__title--mobile {
        display: block;
        text-align: center;
        font-family: var(--font-family-serif);
        color: var(--color-brand);
        font-size: 2.4rem;
        font-weight: 500;
    }

    .fc-hero__inner {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .fc-hero__gallery {
        height: 36rem;
    }

    .fc-hero__cta {
        display: none;
    }

    .fc-hero__cta--mobile {
        display: flex;
    }

    .fc-hero__meta-wrapper {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .fc-hero__desc {
        margin-block: 4rem 0;
    }

    .fc-booking-head__title {
        font-size: 2.4rem;
    }

    .fc-chooser__title {
        font-size: 2rem;
    }

    .fc-chooser__dot::before {
        width: calc(100vw - 21rem - 4rem - 3.8rem);
    }

    .fc-toggle__btn {
        font-size: var(--font-size-xs);
    }

    .fc-chooser__dot {
        bottom: 3px;
    }

    .rbk-wrapper {
        flex-direction: column;
        max-width: 54rem;
        margin-inline: auto;
        gap: 0;
    }

    .rbk-wrapper__left {
        width: 100%;
        max-width: none;
    }

    /* Paiement BtoC : injecte le récapitulatif entre le header et le bloc connexion/infos */
    .pbt-checkout-wrapper .rbk-wrapper__left,
    .pbt-checkout-wrapper .rbk-wrapper__right,
    .pbt-checkout-wrapper .rbk-wrapper__right-sticky {
        display: contents;
    }

    .pbt-checkout-wrapper .pbt-header { 
        order: 1; 
        width: 100%;
        margin-bottom: 5rem;
    }

    .pbt-checkout-wrapper .pbt-card--summary-order {
        order: 2;
        width: 100%;
        margin-bottom: 3rem;
    }

    .pbt-checkout-wrapper .pbt-card--express       {
        order: 3;
        width: 100%;
        margin-top: 2rem;
    }

    .pbt-checkout-wrapper .pbt-card--auth,
    .pbt-checkout-wrapper .pbt-card--client        {
        order: 4;
        width: 100%;
    }

    .pbt-card--client {
        margin-top: 3rem;
    }

    .pbt-checkout-wrapper .pbt-auth-then-manual    {
        order: 5;
        width: 100%;
    }
    .pbt-checkout-wrapper .pbt-card--paid,
    .pbt-checkout-wrapper .pbt-card--pay           {
        order: 6;
        width: 100%;
    }
    .pbt-checkout-wrapper .pbt-card--paypal        {
        order: 6;
        width: 100%;
    }
    .pbt-checkout-wrapper .pbt-legal-bar           {
        order: 7;
        width: 100%;
    }
    .pbt-checkout-wrapper .pbt-cancel-link         {
        order: 8;
        width: 100%;
        margin-top: 4rem;
    }

    .pbt-legal-panel__drawer {
        width: 50rem;
    }

    .pbt-legal-panel__content {
        padding: 3rem;
    }

    .pbt-legal-panel__header {
        padding: 2rem 3rem;
    }

    .pbt-checkout {
        max-width: 54rem;
    }

    .login-pro {
        grid-template-columns: 1fr;
    }

    .login-pro__logo, .login__logo {
        position: initial;
        transform: none;
        margin-inline: auto;
    }

    .login-pro__right-inner {
        max-width: 40rem;
    }

    .kookla-login {
        overflow: initial;
    }

    .login-pro__right {
        padding: 4rem 0 8rem;
    }

    .reg-intro__title {
        font-size: 2.4rem;
        font-weight: 400;
    }

    .woocommerce-lost-password .login-pro__left-inner, 
    .page-template-page-inscription-btoc .login-pro__left-inner {
        max-width: 40rem;
    }

    .rbk-page .rbk-wrapper__right {
        width: 100%;
        max-width: none;
    }

    .account-btoc__inner {
        flex-direction: column;
        gap: 1.4rem;
    }

    .account-btoc__sidebar {
        width: 100%;
    }

    .account-btoc__nav {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        padding: 0;
        gap: 1rem;
    }

    .account-btoc__nav::-webkit-scrollbar {
        display: none;
    }

    .account-btoc__nav li {
        flex-shrink: 0;
    }

    .account-btoc__nav li + li {
        border-top: none;
    }

    .account-btoc__nav li a {
        padding: 0.8rem 1.6rem 0.9rem;
        border-radius: var(--border-radius);
        font-size: var(--font-size-xs);
        opacity: 0.45;
        border: 1px solid var(--color-brand);
        font-weight: 500;
        color: var(--color-brand);
        white-space: nowrap;
    }

    .account-btoc__main {
        padding: 2rem;
        width: 100%;
    }

    .account-btoc__sidebar {
        background: transparent;
        border-radius: 0;
        overflow: initial;
        box-shadow: none;
        position: relative;
        top: 0;
    }

    .account-btoc__nav-fade {
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        width: 4rem;
        background: linear-gradient(to right, transparent, var(--color-beige-light));
        pointer-events: none;
        opacity: 1;
        transition: opacity 0.2s ease;
    }

    .account-btoc__nav-fade.is-hidden {
        opacity: 0;
    }

    .account-btoc__nav li:first-child a {
        padding-top: 0.8rem;
    }

    .account-btoc__nav li.is-active a, 
    .account-btoc__nav li.woocommerce-MyAccount-navigation-link--is-active a {
        background: var(--color-brand);
        opacity: 1;
        color: var(--color-white);
        font-weight: 500;
        border: 1px solid var(--color-brand);
    }

    .account-btoc__nav li:last-child a {
        padding-bottom: 0.9rem;
    }

    .account-btoc {
        padding: 6rem 0 8rem;
    }

    .leaflet-pane {
        z-index: 5!important;
    }

    .leaflet-top, 
    .leaflet-bottom {
        z-index: 6!important;
    }

    .pbt-card--auth {
        margin-top: 0rem;
    }

    .pbt-auth-then-manual {
        margin: 0 0 3rem;
    }

    .pbt-stripe-fields-row {
        gap: 0;
    }

    .fc-card:nth-child(2)::before,
    .fc-card:nth-child(2)::after {
        display: block;
    }


}

@media (max-width: 768px) {
    .account-btoc__remb-centre span {
        display: inline-block;
        max-width: 16ch;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        vertical-align: bottom;
    }

    .footer {
        padding-top: 10rem;
    }

    .fc-hero__gallery {
        height: 40rem;
    }

    .footer__main {
        display: none;
    }

    .faq-aide-pro__title {
        font-size: 2.6rem;
        margin-bottom: 5rem;
    }

    .faq-aide-pro__inner {
        flex-direction: column;
    }

    .faq-aide-pro__left {
        width: 100%;
        min-width: auto;
        margin-bottom: 2rem;
    }

    .faq-aide-pro__sticky {
        position: initial;
    }

    .faq-aide-pro__nav {
        justify-content: flex-start;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .faq-aide-pro__nav::-webkit-scrollbar {
        display: none;
    }

    .faq-aide-pro__content {
        padding-left: 0;
    }

    .faq-aide-pro__question-text {
        font-size: 1.6rem;
    }

    .faq-aide-pro__item {
        padding: 2.9rem 0 2.2rem;
    }

    .faq-aide-pro__item:last-child {
        border-bottom: none;
    }

    .faq-aide-pro__nav-list {
        flex-direction: row;
        flex-wrap: nowrap;
        gap: 4rem;
        width: max-content;
    }

    .faq-aide-pro__nav-btn {
        display: inline-block;
        width: auto;
        text-align: center;
        white-space: nowrap;
        padding: 0;
        font-size: 1.4rem;
    }

    .contact-pro__left {
        gap: 1.4rem;
        max-width: none;
    }

    .contact-pro__title {
        font-size: 2.8rem;
        margin-bottom: 1rem;
    }

    .contact-pro__right {
        max-width: none;
    }

    .contact-pro__form-title {
        text-align: left;
        margin-bottom: 1rem;
    }

    .contact-pro__hero-inner {
        gap: 6rem;
    }

    .contact-pro__desc {
        max-width: none;
    }

    .contact-pro__hero-inner {
        flex-direction: column;
        padding-top: 5rem;
    }

    .header__mobile-nav-link {
        font-size: 1.2rem;
    }

    .legal-pro__sidebar {
        display: none;
    }

    .legal-pro__content {
        padding: 0;
    }

    .legal-pro__content::before {
        display: none;
    }

    .legal-pro__title {
        font-size: 3rem;
        padding-bottom: 1rem;
        max-width: none;
    }

    .legal-pro__body {
        padding: 6rem 2rem 8rem;
    }

    .legal__confiance-intro {
        font-size: 1.4rem;
    }

    .hb-app__selector {
        grid-template-columns: 1fr;
    }

    .hb-app__checklist--full {
        grid-template-columns: 1fr;
    }

    .hb-advantages { 
        padding-block: 8rem; 
    }

    .hb-faq { padding: 4rem 0 3rem; }

    .hb-faq__big-text { font-size: 5rem; }

    .hb-advantages__title {
        font-size: 2.4rem;
        line-height: 1.5;
    }

    .hb-cta-pro__image {
        aspect-ratio: 7/4;
        min-height: auto;
        height: auto;
    }

    .hb-cta-pro__inner {
        align-items: center;
        grid-template-columns: 1fr;
        gap: 3rem;
        padding: 5rem;
    }

    .hb-cta-pro__content {
        padding: 0;
    }

    .hb-cta-pro__title {
        font-size: 2.4rem;
        max-width: none;
    }

    .faq-home-pro__left {
        width: 100%;
    }

    .faq-home-pro__inner {
        justify-content: center;
        flex-direction: column;
        align-items: center;
        gap: 4rem;
    }

    .faq-home-pro__sticky {
        position: initial;
    }

    .faq-home-pro__title {
        font-size: 7rem;
        text-align: center;
    }

    .faq-home-pro {
        padding: 8rem 0;
    }

    .faq-home-pro__list {
        max-width: 50rem;
        width: 100%;
    }

    .trc-hero__title {
        font-size: 2.2rem;
    }

    .trc-hero__sub {
        font-size: var(--font-size-xs);
    }

    .trc-card__photo {
        width: 20rem;
        height: 25rem;
    }

    .trc-cal__label {
        font-size: 1.05rem;
        width: 6rem;
    }

    .trc-card__pt-label {
        font-size: 1.05rem;
    }

    .fc-booking-head__title {
        font-size: 2rem;
    }

    .fc-layout {
        padding-block: 2rem 7.2rem;
    }

    .fc-prices__choose-btn {
        font-size: 1.05rem;
    }

    .fc-pack-badge {
        width: 4rem;
        height: 4rem;
        font-size: 1rem;
    }

    .fc-prices__th--presta {
        width: 20rem;
    }

    .fc-lightbox__nav--prev {
        left: 1rem;
    }

    .fc-lightbox__nav--next {
        right: 1rem;
    }

    .fc-lightbox__nav {
        width: 3rem;
        height: 3rem;
    }

    .fc-lightbox__nav svg {
        width: 18px;
        height: 18px;
    }

    .rbk-header__title {
        font-size: 2.2rem;
    }

    .pbt-info-grid { grid-template-columns: 1fr; }
    .pbt-info-field--full { grid-column: auto; }
    .pbt-stripe-fields-row { grid-template-columns: 1fr; }
    .pbt-fields--grid { grid-template-columns: 1fr; }
    .pbt-fields--full { grid-column: auto; }
    .pbt-auth-tabs { margin: -2rem -2rem 2.4rem; }

    .account-btoc__main h2 {
        font-size: 1.8rem;
    }

    .account-btoc__parrainage-code-wrap {
        gap: 2rem;
        flex-direction: column;
    }

    .account-btoc__parrainage-link-block {
        width: auto;
    }

    .account-btoc__parrainage-steps {
        font-size: var(--font-size-xs);
    }

    .woocommerce-mon-parrainage .account-btoc__main h3 {
        font-size: 1.6rem;
    }

    .account-btoc__remb-info-list {
        font-size: var(--font-size-xs);
    }

    .account-btoc__avis-card-resa {
        font-size: 1.5rem;
    }

    .account-btoc__avis-form-wrapper {
        gap: 3rem;
        flex-direction: column;
    }

    .account-btoc__avis-submitted {
        flex-direction: row;
    }

    .account-btoc__avis-submitted-top {
        width: 130px;
        min-width: 130px;
        height: 130px;
    }

    .account-btoc__avis-note-globale {
        font-size: 5rem;
    }

    .account-btoc__avis-note-globale-label {
        font-size: 1rem;
    }

    .account-btoc__resa-section-title {
        font-size: var(--font-size-sm);
    }

    .account-btoc__centre-info-row {
        gap: 0;
    }

    .account-btoc__centre-info-label {
        min-width: 90px;
    }

    .account-btoc__seance-num {
        font-size: var(--font-size-xs);
    }

    .account-btoc__seance-date {
        font-size: 1.05rem;
    }

    .account-btoc__prise-rdv-subtitle {
        font-size: 1.8rem;
        font-weight: 500;
    }

    .account-btoc__prise-rdv .account-btoc__planning-confirm:not([hidden]) {
        align-items: flex-start;
        gap: 1rem;
        flex-direction: column;
    }

    .rbk-wrapper__right-sticky {
        position: initial;
    }

    .pbt-fields {
        gap: 1rem;
        margin-bottom: 1rem;
    }

}

@media ( max-width: 599px ) {

    :root {
        --font-size-xs: 1.10rem;
        --font-size-sm: 1.15rem;
        --font-size-base: 1.2rem;
    }

    .logo svg {
        height: 24px;
    }

    .header__actions .btn {
        width: 3.2rem;
        height: 3.2rem;
    }

    .header__actions {
        gap: 0.6rem;
    }

    .page-template-btoc .header .logo {
        top: 0;
    }

    .header__mobile-menu {
        width: 40rem;
        max-width: 85%;
        padding: 6rem 3rem 3rem;
    }

    .header__mobile-menu-top {
        right: 2rem;
        top: 2rem;
    }

    .header__mobile-nav {
        gap: 2rem;
    }

    .header__mobile-nav-group + .header__mobile-nav-group {
        padding-top: 2rem;
    }

    .header__mobile-nav-group:first-child {
        gap: 1.6rem;
        padding-bottom: 0.4rem;
    }

    .header__mobile-nav-group {
        gap: 1rem;
    }

    .header__mobile-nav-group:first-child .header__mobile-nav-link {
        font-size: 2rem;
    }

    .header__mobile-social-logo svg {
        height: 2.2rem;
    }

    .header__mobile-social-text {
        font-size: 1rem;
        line-height: 1.8;
        max-width: 26rem;
    }

    .header__mobile-social-icons {
        gap: 1rem;
    }

    .header__mobile-social-link {
        width: 3rem;
        height: 3rem;
    }

    .header__mobile-social-link svg {
        width: 12px;
        height: 12px;
    }

    .faq-aide-pro__title {
        font-size: 2rem;
        font-weight: 500;
    }

    .faq-aide-pro__left {
        margin-bottom: 1rem;
    }

    .faq-aide-pro {
        padding: 4rem 0;
    }

    .faq-aide-pro__question-text {
        font-size: 1.4rem;
    }

    .faq-aide-pro__answer-inner {
        padding: 1rem 0rem 0 0;
    }

    .faq-aide-pro__item {
        padding: 1.9rem 0 1.2rem;
    }

    .faq-aide-pro__item:first-child {
        border-top: none;
    }

    .faq-aide-pro__nav-list {
        gap: 0.5rem;
    }

    .faq-aide-pro__nav-btn.is-active {
        background-color: var(--color-brand);
        color: var(--color-white);
    }

    .faq-aide-pro__nav-btn {
        padding: 0.6rem 1rem;
        font-size: 1.1rem;
        border: 1px solid rgba(var(--color-brand-rgb), 0.65);
    }

    .contact-home-pro {
        padding: 6rem 0 8rem;
    }

    .slots-home-pro__suptitle, 
    .booking-home-pro__suptitle, 
    .guides-home-pro__suptitle, 
    .contact-home-pro__suptitle, 
    .guides-aide-pro__suptitle, 
    .guide-single-pro__suptitle, 
    .legal-pro__suptitle, 
    .commission-tarifs-pro__suptitle {
        font-size: 0.9rem;
        margin-bottom: 3rem;
    }

    .contact-home-pro__title {
        font-size: 1.8rem;
        font-weight: 400;
        margin-bottom: 3rem;
    }

    .contact-home-pro__prompt {
        font-size: 1.2rem;
    }

    .footer {
        padding-top: 5rem;
    }

    .footer__visual-svg {
        width: 60px;
    }

    .footer__tagline {
        font-size: 1.2rem;
    }

    .footer__copyright p {
        font-size: 0.8rem;
    }

    .footer__visual-bg svg {
        height: 80%;
    }

    .contact-home-pro__choice {
        max-width: 30rem;
    }

    .legal-pro__body {
        padding: 3rem 2rem 5rem;
    }

    .legal-pro__title {
        font-size: 4rem;
    }

    .legal-pro__article h2 {
        font-size: 1.6rem;
    }

    .legal-pro__article h3 {
        font-size: 1.4rem;
    }

    .legal-pro__article li::before {
        top: 10px;
    }

    .contact-pro__form-title {
        font-size: 1.4rem;
    }

    .contact-pro__title {
        font-size: 2.4rem;
        margin-bottom: 0rem;
        font-weight: 500;
    }

    .contact-pro__hero-inner {
        gap: 3rem;
    }

    .hb-hero__title {
        font-size: 2.4rem;
        font-weight: 500;
    }

    .hb-hero__subtitle {
        font-weight: 500;
        margin: 0 auto;
        max-width: 18rem;
    }

    .hb-hero__app-wrap {
        gap: 1.2rem;
    }

    .hb-app__step-label {
        font-size: var(--font-size-xs);
        max-width: 18rem;
    }

    .hb-app {
        padding: 2rem 2rem 2rem;
    }

    .hb-app__checklist {
        gap: 0.4rem;
    }

    .hb-app__check-item {
        gap: 0.5rem;
        padding: 0.8rem 1rem;
    }

    .hb-app__check-box {
        width: 1.3rem;
        height: 1.3rem;
    }

    .hb-app__check-item input:checked ~ .hb-app__check-box::after {
        left: 2.5px;
        top: 0px;
    }

    .hb-app__illu {
        height: 200px;
    }

    .hb-app__selected-label {
        font-size: var(--font-size-xs);
    }

    .hb-app__phototype-label {
        gap: 0.4rem;
        font-size: var(--font-size-xs);
    }

    .hb-pt-info-btn svg {
        height: 16px;
        width: 16px;
    }

    .hb-app__phototype-list {
        gap: 0.4rem;
    }

    .hb-app__actions {
        display: flex;
        justify-content: space-between;
        align-items: initial;
        gap: 1rem;
        flex-direction: column;
    }

    .hb-hero {
        padding: 5rem 0 3rem;
    }

    .hb-pt-modal__title {
        font-size: 1.5rem;
    }

    .hb-pt-modal__name {
        font-size: 1.2rem;
    }

    .hb-pt-modal__desc {
        font-size: 1rem;
    }

    .hb-advantages {
        padding-block: 5rem;
    }

    .hb-advantages__title {
        font-size: 1.8rem;
        font-weight: 500;
        margin-bottom: 6rem;
    }

    .hb-adv-card__title {
        font-size: 1.5rem;
    }

    .hb-adv-card__icon {
        width: 5rem;
        height: 5rem;
        top: -2.5rem;
    }

    .hb-adv-card {
        padding: 4rem 5rem 3rem;
    }

    .hb-advantages__cards {
        gap: 4rem;
    }

    .hb-cta-pro__inner {
        gap: 2rem;
        padding: 0 0 6rem;
    }

    .hb-cta-pro__content {
        padding-inline: 2rem;
        min-width: 0;
    }

    .hb-cta-pro__title {
        font-size: 3rem;
    }

    .hb-cta-pro__image {
        aspect-ratio: 4/5;
        min-height: auto;
        height: auto;
        margin: 3rem 2rem 0;
    }

    .faq-home-pro {
        padding: 5rem 0px 8rem;
    }

    .faq-home-pro__title {
        font-size: 6rem;
        font-weight: 400;
    }

    .faq-home-pro__item:first-child {
        border-top: none;
    }

    .faq-home-pro__question-text {
        font-size: 1.4rem;
    }

    .faq-home-pro__answer-inner {
        padding: 1rem 0rem 0 0;
    }

    .faq-home-pro__item {
        padding: 1.9rem 0 1.2rem;
    }

    .faq-home-pro__inner {
        gap: 2rem;
    }

    .faq-home-pro__item:last-child {
        border-bottom: none;
    }

    .trc-hero__title {
        font-size: 2rem;
        font-weight: 500;
        max-width: 23rem;
        margin: 0 auto 1rem;
    }

    .trc-hero__sub {
        max-width: 23rem;
        margin: 0 auto 3rem;
    }

    .trc-search {
        flex-direction: column;
        align-items: initial;
    }

    .trc-search__input {
        height: 4.4rem;
        flex: auto;
    }

    .trc-search__btn {
        width: 100%;
    }

    .trc-results-count {
        font-size: 1.6rem;
    }

    .trc-results-sub {
        font-size: var(--font-size-xs);
        max-width: 24rem;
    }

    .trc-card__header {
        flex-direction: column;
        align-items: flex-start;
    }

    .trc-card__photo {
        height: 24rem;
        width: 100%;
    }

    .trc-card__name {
        font-size: 2rem;
    }

    .trc-cal__label {
        display: flex;
    }

    .trc-cal__cell {
        width: 6rem;
        height: 3rem;
    }

    .trc-card__body {
        padding: 2rem 2rem 4rem;
    }

    .trc-view-switcher {
        top: 6rem;
    }

    .leaflet-left {
        left: 0!important;
        right: auto!important;
        bottom: 0!important;
        top: auto!important;
    }

    .leaflet-top .leaflet-control {
        margin-bottom: 20px;
    }

    .leaflet-left .leaflet-control {
        margin-left: 14px!important;
        margin-right: 0!important;
    }

    .leaflet-container .leaflet-control-attribution {
        font-size: 1rem;
    }

    .trc-fmodal__title {
        font-size: 2rem;
    }

    .trc-fmodal__panel { 
        width: 100vw; 
    }

    .trc-active-chip {
        height: 3rem;
    }

    .fc-hero__inner {
        padding-block: 3.4rem 4rem;
    }

    .fc-hero__title {
        font-size: 2.2rem;
    }

    .fc-hero__meta-wrapper {
        align-items: flex-start;
        flex-direction: column;
        gap: 2rem;
    }

    .fc-hero__desc {
        margin-block: 2rem 0;
    }

    .fc-booking-head {
        padding-block: 2.2rem 2rem;
    }

    .fc-booking-head__title {
        font-size: 2.8rem;
        line-height: 1.3;
    }

    .fc-lightbox__nav {
        bottom: -0.2rem;
        transform: translateY(-50%);
    }

    .fc-lightbox__nav--next {
        right: 10rem;
    }

    .fc-lightbox__nav--next {
        right: 10rem;
    }

    .fc-lightbox__img {
        max-width: 100%;
    }

    .fc-table-wrap {
        padding: 2rem 1.4rem 3rem;
    }

    .fc-price-group__header {
        padding-left: 2rem;
    }

    .fc-pack-badge {
        width: 3rem;
        height: 3rem;
        font-size: 0.8rem;
    }

    .fc-prices thead th {
        font-size: 1rem;
    }

    .fc-prices tbody td {
        font-size: var(--font-size-xs);
    }

    .fc-prices tbody td.fc-prices__unit {
        text-align: right;
        padding-right: 1rem;
    }

    .fc-prices__choose-btn {
        font-size: 0.95rem;
    }

    .fc-prices__choose-btn {
        font-size: 0.95rem;
        padding: 0.8rem 1rem;
    }

    .fc-price-group__note {
        font-size: 1rem;
    }

    .fc-prices__presta {
        line-height: 1.4;
    }

    .fc-price-group__label {
        font-size: 1.6rem;
    }

    .fc-price-group__header {
        padding-left: 1.4rem;
    }

    .fc-aside__title--mobile {
        font-size: 2rem;
    }

    .maplibregl-ctrl-attrib.maplibregl-compact-show .maplibregl-ctrl-attrib-inner {
        font-size: 1rem!important;
    }

    .kc-confirm-dialog__title {
        font-size: 1.4rem;
    }

    .kc-confirm-dialog__icon {
        width: 2.8rem;
        height: 2.8rem;
    }

    .rbk-header__title {
        font-size: 3rem;
        line-height: 1.3;
    }

    .rbk-card__title {
        font-size: 1.5rem;
        max-width: 20rem;
        margin-inline: auto;
    }

    .rbk-seances-btn--pack {
        min-width: auto;
    }

    .rbk-add-btn {
        padding: 1.1rem 1.4rem 1rem;
        font-size: 1rem;
    }

    .rbk-add-btn svg {
        width: 13px;
        height: 13px;
    }

    .rbk-ms-info {
        font-size: 1rem;
    }

    .rbk-mt-teaser {
        font-size: 1rem;
        font-weight: 500;
    }

    .account-btoc__planning-day-label .kc-day-name {
        font-size: 0.8rem;
    }

    .account-btoc__planning-day-label .kc-day-date {
        font-size: 0.9rem;
        margin-top: 0.2rem;
    }

    #rbk-planning-card.rbk-card {
        padding: 3rem 0.6rem;
    }

    .account-btoc__planning-slot {
        padding: 0.7rem 0.15rem;
        font-size: 1rem;
    }

    .account-btoc__planning-day-slots {
        flex: 1;
        display: flex;
        flex-direction: column;
        gap: 0.4rem;
        padding-inline: 0.6rem;
    }

    .rbk-add-panel {
        padding: 2rem;
    }

    .rbk-offre-row {
        padding: 1rem;
    }

    .rbk-offres-zone-title {
        font-size: 1.4rem;
        margin: 3rem 0 0.7rem 1rem;
        font-weight: 600;
    }

    .btn.btn-outline.rbk-add-offre-btn {
        padding: 0.8rem 1.6rem;
        font-size: 1rem;
    }

    .rbk-presta-head {
        padding: 1.4rem 1.6rem;
        gap: 0;
    }

    .rbk-presta-head__info-top {
        gap: 0.5rem;
    }

    .rbk-presta-head__badge {
        font-size: 0.8rem;
        padding: 2px 5px;
        font-weight: 600;
    }

    .rbk-presta-head__nom {
        font-size: var(--font-size-sm);
    }

    .btn.rbk-del-init-btn, 
    .btn.rbk-del-btn {
        width: 3.4rem;
        height: 3.4rem;
    }

    .btn.btn-outline.rbk-del-init-btn svg {
        width: 13px;
        height: 13px;
        position: relative;
        left: -1px;
        top: -1px;
    }

    .pbt-legal-bar {
        gap: 1rem;
        padding: 1.4rem 0 0;
    }

    .pbt-card__title {
        font-size: 1.5rem;
        top: -14px;
        white-space: nowrap;
    }

    .pbt-card--pay {
        padding: 4rem 2rem 3rem;
    }

    .pbt-stripe-fields-row { 
        gap: 0; 
    }

    .account-btoc__main .conf-resa__banner h2 {
        font-size: 2rem;
    }

    .conf-resa__banner {
        padding: 3rem;
    }

    .conf-resa__infos {
        text-align: left;
    }

    .conf-resa__info-item {
        gap: 0.8rem;
    }

    .conf-resa__intro {
        margin-bottom: 2rem;
    }

    .login-pro__title {
        font-size: 1.4rem;
    }

    .login-pro__right-inner {
        padding-inline: 4rem;
    }

    .login-pro__right {
        padding: 4rem 0 5rem;
    }

    .birthday__desc {
        margin-top: 0.2rem;
        font-size: 1rem;
        text-align: center;
    }

    .page-template-page-inscription-btoc .login-pro__left-inner {
        margin-top: 0;
    }

    .login-pro__left {
        padding: 3rem 2rem;
    }

    .contact-pro__rgpd-checkbox.reg-checkbox .reg-checkbox__label {
        max-width: 22rem;
    }

    .login-pro__title {
        font-size: 1.5rem;
    }

    .login-pro__left {
        padding: 4rem 2rem;
    }

    .login-pro__title {
        font-size: 1.5rem;
    }

    .account-btoc__main {
        padding: 0;
        margin-top: 2rem;
        background: transparent;
        border-radius: 0;
        box-shadow: none;
    }

    .account-btoc__main h2 {
        font-size: 1.6rem;
        margin: 0 0 1rem;
    }

    .account-btoc__nav li a {
        padding: 0.6rem 1rem 0.6rem;
        font-size: 1rem;
    }

    .account-btoc__nav li:first-child a {
        padding-top: 0.6rem;
    }

    .account-btoc__nav li:last-child a {
        padding-bottom: 0.6rem;
    }

    .account-btoc__sidebar {
        padding-bottom: 1.2rem;
        border-bottom: 1.5px solid var(--color-beige-dark);
    }

    .account-btoc__kcoin-balance-card {
        background: var(--color-white);
    }

    .btn.btn-primary.account-btoc__kcoin-cta {
        padding: 1rem 1.6rem 1rem;
    }

    .woocommerce-mes-kcoins .account-btoc__main h3 {
        font-size: 1.5rem;
        text-align: left;
    }

    .account-btoc__kcoin-table thead th:first-child,
    .account-btoc__kcoin-table thead th:last-child {
        width: 8rem;
    }

    .account-btoc__kcoin-note {
        line-height: 1.6;
    }

    table.account-btoc__kcoin-table tbody td {
        vertical-align: top;
    }
    
    .account-btoc__kcoin-balance-label {
        font-size: 1rem;
    }

    .account-btoc__parrainage-code-wrap {
        background-color: var(--color-white);
    }

    .account-btoc__parrainage-stat {
        background: var(--color-white);
    }

    .woocommerce-mon-parrainage .account-btoc__main h3 {
        font-size: 1.5rem;
    }

    .account-btoc__remb-info-list li,
    ol.account-btoc__parrainage-steps {
        padding: 1.6rem 2rem 1.6rem 1.2rem;
        border-left: 2px solid var(--color-brand-light);
        background-color: var(--color-white);
        border-top-right-radius: 10px;
        border-bottom-right-radius: 10px;
    }

    .account-btoc__remb-info-list strong {
        margin-bottom: 0.4rem;
    }

    .account-btoc__remb-table tbody tr td:last-child {
        display: none;
    }

    .account-btoc__remb-table thead th:nth-child(4) {
        text-align: right;
    }

    .account-btoc__remb-table .account-btoc__remb-montant {
        text-align: right;
    }

    .account-btoc__avis-card {
        background-color: white;
    }

    .account-btoc__avis-card {
        background-color: var(--color-white);
        box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
    }

    .account-btoc__avis-card-header {
        background: var(--color-white);
        padding: 1.6rem 1.8rem 1.4rem;
    }

    .account-btoc__avis-card-seance {
        line-height: 1.6;
    }

    .account-btoc__avis-form {
        padding: 1.8rem;
        gap: 1.8rem;
    }

    .account-btoc__avis-criterion {
        justify-content: space-between;
    }

    button.account-btoc__avis-star {
        font-size: 1.6rem;
    }

    .account-btoc__avis-form-footer {
        padding-top: 1.8rem;
    }

    .btn.btn-primary.account-btoc__avis-submit-btn {
        padding: 1rem 1.8rem;
    }

    .account-btoc__avis-card-presta-chip {
        font-size: 1rem;
        padding: 0.5rem 0.7rem;
    }

    .account-btoc__avis-card-prestas {
        font-size: 1rem;
    }

    .account-btoc__avis-card-centre {
        margin-left: 0;
        margin-top: 0.2rem;
        display: block;
    }

    .account-btoc__avis-card-centre::after {
        display: none;
    }

    .account-btoc__avis-submitted {
        padding: 1.8rem;
        gap: 1.8rem;
    }

    .account-btoc__avis-stars-readonly {
        gap: 0;
    }

    .account-btoc__avis-stars-readonly .account-btoc__avis-star {
        font-size: 1.4rem;
    }

    .account-btoc__avis-criterion {
        flex-wrap: nowrap;
        justify-content: space-between;
    }

    .account-btoc__avis-criterion-label {
        font-size: 1.05rem;
        min-width: 12.5rem;
    }

    .account-btoc__avis-submitted-top .account-btoc__avis-criteria {
        min-width: auto;
    }

    .account-btoc__avis-submitted-header {
        justify-content: space-between;
        width: 100%;
        gap : 1rem;
    }

    .account-btoc__avis-submitted-top {
        width: 10rem;
        min-width: 10rem;
        height: 10rem;
    }

    .account-btoc__avis-note-globale-label {
        font-size: 0.9rem;
    }

    .account-btoc__avis-note-globale {
        font-size: 4.4rem;
    }

    .account-btoc__avis-comment-wrapper {
        border-left: 1.5px solid var(--color-brand-light);
        background-color: var(--color-beige-light);
        border-top-right-radius: 10px;
        border-bottom-right-radius: 10px;
        padding: 1.4rem 1.8rem 1.4rem 1.4rem;
    }

    .account-btoc__avis-reply-label {
        font-size: 0.9rem;
        margin-bottom: 0.5rem;
    }

    .account-btoc__orders-table.account-btoc__remb-table thead th:last-child {
        display: none;
    }

    .account-btoc__avis-submitted-header .account-btoc__avis-criteria {
        min-width: auto;
    }

    .account-btoc__resa-card {
        border: 1.5px solid var(--color-beige-dark);
        background-color: var(--color-white);
        box-shadow: 4px 4px 10px rgba(var(--color-primary-rgb), 0.1);
    }

    .account-btoc__resa-section {
        padding: 2rem 1.4rem;
    }

    .account-btoc__prestations-table thead th:nth-child(2),
    .account-btoc__prestations-table tbody td:nth-child(2) {
        display: none;
    }

    .account-btoc__resa-section--pricing {
        padding: 2rem 1.4rem;
    }

    .account-btoc__seance-item {
        flex-direction: column;
        align-items: flex-start;
        gap: 2rem;
    }

    .account-btoc__modifier-btn {
        font-size: 1rem;
        padding: 1rem 1.4rem 0.9rem;
    }

    .account-btoc__seance-locked-note {
        font-size: 1.05rem;
    }

    .account-btoc__resa-header {
        padding: 1.6rem 1.4rem;
    }

    .account-btoc__resa-meta {
        gap: 1.5rem;
    }

    .account-btoc__resa-id::after {
        right: -9px;
    }

    .account-btoc__prestations-table thead th {
        font-size: 1rem;
    }

    .account-btoc__prise-rdv-subtitle {
        font-size: 1.5rem;
        font-weight: 500;
    }

    .account-btoc__main.account-btoc__main--prise-de-rdv h2 {
        font-size: 1rem;
        margin: 3rem 0 1.4rem;
    }

    .account-btoc__prise-rdv-current p:last-child {
        font-size: 1rem;
        max-width: 29rem;
        margin: 0 auto;
    }

    .account-btoc__main.account-btoc__main--prise-de-rdv {
        margin-top: 0;
    }

    .rbk-wrapper__right {
        width: 36rem;
    }

    .account-btoc__avis-criteria {
        min-width: 0;
    }

}

@media ( max-width: 399px ) {

    .account-btoc__avis-submitted-header {
        flex-direction: column;
        gap: 1.6rem;
    }
    
    .account-btoc__avis-submitted-top {
        width: 100%;
    }

}