/* ═══════════════════════════════════════════════════════════════════════════════════════
   KIT RIHMA AGENCY — univers clair, lumineux et joyeux
   Palette de la graphiste : teal #027F81 · menthe #E0F9F5 · rose #FFCDF2 ; bleu canard du logo #134C5C. Interface « Solar Neon » (02/11) : blanc, jaune solaire.
   Parcours en carrousels (formules, propositions, réalisations), boutique avec ajout depuis la carte, fenêtre « Ma demande ».
   Effets : halos teal et roses, néon fin, bulles légères, verre translucide. Tout est lisible sans animation ; le
   mouvement s'éteint avec « réduire les animations » et sur les appareils sans pointeur précis pour les effets coûteux.
   ═══════════════════════════════════════════════════════════════════════════════════════ */
:root { --rh-teal: #027F81; --rh-deep: #134C5C; --rh-mint: #E0F9F5; --rh-rose: #FFCDF2; --rh-cream: #FFFCEE; --rh-rose-ink: #8E2F73; --rh-gold: #B98A2E;
  --rh-neon: 0 0 0 1px color-mix(in srgb, var(--rh-teal) 26%, transparent), 0 10px 40px -18px color-mix(in srgb, var(--rh-teal) 70%, transparent); }

/* ═══ SOFT STUDIO GLOW ═══ Direction artistique (04/11) : un studio de création contemporain — ivoire minéral, lumière
   tamisée et chaude, reflets délicats, photographies et illustrations de studio. Retours de RIHMA appliqués : plus de grand
   soleil, plus de halos jaunes intenses ni d'étiquettes flottantes autour du portrait, titre plus respirant, logo dégagé.
   Le jaune reste un éclairage doux, jamais une couleur de texte. Aucun filtre global sur les photographies. */
:root { --sun: #FFE45C; --sun-neon: #FFEFA6; --sun-soft: #FBF1D6; --sun-deep: #D9AE4A; --ink: #17383A;
  --ivory: #FAF8F4; --champagne: #EDE4D7; --cream: #F5EFE6; --rh-line: color-mix(in srgb, #8C6E4A 18%, transparent);
  --studio-shadow: 0 30px 60px -38px rgba(60, 44, 24, .42), 0 2px 8px -3px rgba(60, 44, 24, .1); }

/* Fond : ivoire lumineux, grain minéral presque imperceptible (bruit SVG, aucune requête), lumières de studio fixes */
.u-body { background: var(--ivory); }
.u-body::before { content: ''; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%27240%27%20height%3D%27240%27%3E%3Cfilter%20id%3D%27n%27%3E%3CfeTurbulence%20type%3D%27fractalNoise%27%20baseFrequency%3D%27.8%27%20numOctaves%3D%272%27%20stitchTiles%3D%27stitch%27%2F%3E%3CfeColorMatrix%20values%3D%270%200%200%200%20.47%200%200%200%200%20.38%200%200%200%200%20.27%200%200%200%20.06%200%27%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D%27100%25%27%20height%3D%27100%25%27%20filter%3D%27url(%23n)%27%2F%3E%3C%2Fsvg%3E"),
    radial-gradient(60vmax 40vmax at 92% 0%, rgba(237, 228, 215, .9), transparent 70%),
    radial-gradient(40vmax 34vmax at 0% 46%, color-mix(in srgb, var(--rh-mint) 45%, transparent), transparent 70%),
    radial-gradient(36vmax 30vmax at 96% 96%, rgba(255, 205, 242, .2), transparent 70%); }
.u-netbar { background: color-mix(in srgb, var(--ivory) 80%, transparent); }

h1, h2, h3 { font-weight: 800; letter-spacing: -.025em; }
h1 { font-size: clamp(2.2rem, 6.4vw, 4.2rem); line-height: 1.04; }
h2 { font-size: clamp(1.7rem, 4.2vw, 2.8rem); }
.u-btn { border-radius: 999px; font-weight: 700; }
.u-btn--primary { background: linear-gradient(120deg, var(--rh-teal), #03999B); box-shadow: 0 12px 30px -16px var(--rh-teal), inset 0 1px 0 rgba(255, 255, 255, .25); }
.u-btn--primary:hover { box-shadow: 0 16px 36px -16px var(--rh-teal), 0 0 0 4px color-mix(in srgb, var(--rh-rose) 55%, transparent); }
.u-btn--line { background: color-mix(in srgb, #fff 76%, transparent); border-color: color-mix(in srgb, var(--rh-teal) 35%, transparent); color: var(--rh-deep); }
.u-btn--line:hover { border-color: var(--rh-teal); background: #fff; }

.rh-tag { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 14px; padding: 6px 14px; border-radius: 999px; font: 700 .72rem/1 var(--u-text); letter-spacing: .14em; text-transform: uppercase;
  color: var(--rh-teal); background: color-mix(in srgb, #fff 80%, transparent); box-shadow: 0 0 0 1px var(--rh-line); }
.rh-tag::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--rh-teal); }
.rh-tag--gold { color: #7A5A17; background: #FFF8E6; box-shadow: 0 0 0 1px color-mix(in srgb, var(--rh-gold) 40%, transparent); }
.rh-tag--gold::before { background: var(--rh-gold); }
.rh-hint { margin: 0 0 14px; color: var(--u-muted); font-size: .92rem; }
.rh-small { margin: 14px 0 0; color: var(--u-muted); font-size: .86rem; }
.rh-small a, .rh-hint a { color: var(--rh-teal); font-weight: 600; }
/* Mention « Illustration » des visuels générés (jamais présentés comme des réalisations ou des résultats) */
.rh-illus { margin: 6px 2px 0; font: 600 .7rem/1.3 var(--u-text); letter-spacing: .06em; text-transform: uppercase; color: var(--u-muted); }
.rh-illus::before { content: '◇ '; color: var(--rh-teal); }

/* ─── 1. Accueil : message à gauche, portrait officiel dans une arche de studio à droite ─── */
#accueil { padding-top: clamp(18px, 4vw, 48px); padding-bottom: clamp(36px, 5vw, 64px); isolation: isolate; }
#accueil > * { animation: none; }   /* l'apparition commune au défilement est remplacée par l'entrée propre de l'accueil */
/* Lumière champagne tamisée derrière le portrait, reflets rose et teal très diffus ; finit dans l'ivoire */
#accueil::before { content: ''; position: absolute; z-index: -2; top: 0; bottom: -160px; -webkit-mask: linear-gradient(#000 calc(100% - 260px), transparent); mask: linear-gradient(#000 calc(100% - 260px), transparent); left: calc(50% - 50vw); right: calc(50% - 50vw); pointer-events: none;
  background: radial-gradient(50vmax 42vmax at 76% 40%, rgba(237, 228, 215, .95), rgba(237, 228, 215, 0) 70%),
    radial-gradient(26vmax 22vmax at 96% 4%, rgba(255, 205, 242, .3), transparent 70%),
    radial-gradient(32vmax 26vmax at 2% 82%, color-mix(in srgb, var(--rh-teal) 8%, transparent), transparent 70%),
    radial-gradient(30vmax 22vmax at 30% 0%, rgba(255, 236, 160, .22), transparent 70%),
    linear-gradient(180deg, #FBF8F2, var(--ivory)); }

.rh-hero { position: relative; display: grid; gap: clamp(22px, 4vw, 56px); align-items: center; }
@media (min-width: 940px) { .rh-hero { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); min-height: min(78vh, 720px); } }
.rh-hero-copy { position: relative; z-index: 2; }
.rh-hero-copy > * { animation: rh-rise .9s cubic-bezier(.2, .8, .2, 1) backwards; }
.rh-hero-copy > :nth-child(2) { animation-delay: .06s; } .rh-hero-copy > :nth-child(3) { animation-delay: .14s; }
.rh-hero-copy > :nth-child(4) { animation-delay: .26s; } .rh-hero-copy > :nth-child(5) { animation-delay: .36s; }
.rh-hero-copy > :nth-child(6) { animation-delay: .46s; } .rh-hero-copy > :nth-child(7) { animation-delay: .54s; }
@keyframes rh-rise { from { opacity: 0; transform: translateY(14px); } }

.rh-kicker { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 clamp(20px, 2.6vw, 28px); padding: 8px 16px 8px 12px; border-radius: 999px; font: 700 .72rem/1.2 var(--u-text); letter-spacing: .18em; text-transform: uppercase;
  color: var(--ink); background: rgba(255, 255, 255, .7); box-shadow: 0 0 0 1px var(--rh-line); }
.rh-spark { flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--sun); box-shadow: 0 0 0 3px color-mix(in srgb, var(--sun) 30%, transparent); }
/* Logo : bien détaché du titre (retour de RIHMA) */
.rh-wordmark { margin: 0 0 clamp(18px, 2.4vw, 28px); font: 500 clamp(2rem, 5vw, 2.8rem)/1 Georgia, 'Times New Roman', serif; letter-spacing: .04em; color: var(--rh-deep); }
.rh-logo { display: none; }
@supports ((mask-image: url(x)) or (-webkit-mask-image: url(x))) {
  .rh-logo { display: block; width: clamp(150px, 22vw, 210px); aspect-ratio: 452 / 143; background: linear-gradient(100deg, var(--rh-deep), var(--rh-teal) 60%, #1FA9A8);
    -webkit-mask: url(/u/rihma/logo-mark.png) center / contain no-repeat; mask: url(/u/rihma/logo-mark.png) center / contain no-repeat; }
  .rh-wordmark-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
.rh-wordmark em { font: 400 1.1em/1 var(--u-script); color: var(--rh-teal); letter-spacing: 0; margin-left: .1em; }

/* Titre : légèrement plus petit et plus respirant ; « rayonner » souligné d'une lumière douce (sans halo) */
.rh-hero h1 { margin: 0 0 .42em; font-size: clamp(2.35rem, 5vw, 4.2rem); line-height: 1.05; letter-spacing: -.03em; color: var(--ink); max-width: 13ch; }
.rh-ray { position: relative; display: inline-block; white-space: nowrap; isolation: isolate; }
.rh-ray::before { content: ''; position: absolute; z-index: -1; left: -.04em; right: -.06em; bottom: .06em; height: .3em; border-radius: .14em; transform-origin: left;
  background: linear-gradient(100deg, rgba(255, 228, 92, .62), rgba(255, 228, 92, .42) 70%, rgba(255, 205, 242, .55)); animation: rh-ray-in 1s .5s cubic-bezier(.2, .8, .2, 1) backwards; }
.rh-ray-word { color: var(--ink); }
@keyframes rh-ray-in { from { transform: scaleX(0); } }
.rh-lead { margin: 0; font-size: clamp(1.04rem, 1.6vw, 1.16rem); line-height: 1.65; color: color-mix(in srgb, var(--ink) 84%, #fff); max-width: 50ch; }

/* Boutons : jaune doux (principal) et verre (secondaire) */
.rh-actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 30px 0 22px; }
@media (max-width: 520px) { .rh-actions .u-btn { flex: 1 1 100%; } }
.rh-cta-sun { position: relative; overflow: hidden; isolation: isolate; color: var(--ink); font-weight: 800;
  background: linear-gradient(115deg, #FFEE94 0%, var(--sun) 100%); border: 1px solid color-mix(in srgb, #B98A2E 40%, transparent);
  box-shadow: 0 14px 28px -18px rgba(140, 100, 20, .7), inset 0 1px 0 rgba(255, 255, 255, .7); transition: transform .2s cubic-bezier(.2, .7, .2, 1), box-shadow .3s; }
.rh-cta-sun::after { content: ''; position: absolute; inset: 0; z-index: -1; transform: translateX(-130%); background: linear-gradient(110deg, transparent 30%, rgba(255, 255, 255, .8) 48%, transparent 66%); }
.rh-cta-sun:hover, .rh-cta-sun:focus-visible { color: var(--ink); transform: translateY(-2px); box-shadow: 0 18px 32px -18px rgba(140, 100, 20, .8), 0 0 0 4px color-mix(in srgb, var(--sun) 35%, transparent), inset 0 1px 0 rgba(255, 255, 255, .7); }
.rh-cta-sun:hover::after, .rh-cta-sun:focus-visible::after { animation: rh-shine .8s cubic-bezier(.2, .7, .2, 1) both; }
.rh-cta-sun:active { transform: scale(.98); }
@keyframes rh-shine { from { transform: translateX(-130%); } to { transform: translateX(130%); } }
.rh-cta-glass { color: var(--ink); background: rgba(255, 255, 255, .74); border: 1.5px solid color-mix(in srgb, var(--rh-teal) 40%, transparent); backdrop-filter: blur(10px);
  box-shadow: 0 10px 26px -20px var(--rh-teal); transition: transform .2s, box-shadow .3s, border-color .2s, background .2s; }
.rh-cta-glass:hover, .rh-cta-glass:focus-visible { color: var(--ink); background: #fff; border-color: var(--rh-teal); transform: translateY(-2px); box-shadow: 0 14px 30px -18px var(--rh-teal); }
.rh-signature { margin: 0; font: 400 clamp(1.5rem, 3.4vw, 2rem)/1.1 var(--u-script); color: var(--rh-teal); }

/* Scène : arche de studio couleur champagne, photographie officielle en relief doux, légende sous le cadre */
.rh-stage { position: relative; z-index: 1; display: grid; place-items: center; isolation: isolate; padding: clamp(10px, 2vw, 22px) 0; }
.rh-stage--studio::before { content: ''; position: absolute; z-index: -1; width: min(94%, 480px); aspect-ratio: 3 / 4; top: clamp(0px, 1vw, 10px); left: 50%; translate: calc(-50% + clamp(12px, 2vw, 22px)) 0;
  border-radius: 999px 999px 40px 40px; background: radial-gradient(70% 50% at 50% 26%, rgba(255, 255, 255, .85), transparent 70%), linear-gradient(180deg, #F3EADF, var(--champagne) 70%, #E6D9C6);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .7); }
.rh-portrait { position: relative; z-index: 1; margin: 0; animation: rh-enter 1.1s .15s cubic-bezier(.2, .8, .2, 1) backwards; }
@keyframes rh-enter { from { opacity: 0; transform: translateY(12px); } }
.rh-portrait--studio { width: min(86%, 430px); }
.rh-portrait--studio picture, .rh-portrait--studio > img { display: block; aspect-ratio: 3 / 4; border-radius: 999px 999px 30px 30px; overflow: hidden; background: var(--champagne);
  box-shadow: var(--studio-shadow), 0 0 0 6px rgba(255, 255, 255, .55); }
.rh-portrait--studio img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; }
.rh-portrait figcaption { display: grid; justify-items: center; gap: 1px; margin-top: 14px; font-size: .84rem; line-height: 1.3; }
.rh-portrait figcaption b { color: var(--ink); }
.rh-portrait figcaption span { color: var(--u-muted); }
.rh-portrait--cutout { width: min(80%, 460px); }
.rh-portrait--cutout img { display: block; width: 100%; height: auto; }
.rh-card { width: min(64%, 370px); border-radius: 26px; overflow: hidden; box-shadow: var(--studio-shadow); }
.rh-card img { display: block; width: 100%; height: auto; }
@media (max-width: 939px) { .rh-portrait--studio { width: min(78%, 360px); } .rh-stage--studio::before { width: min(86%, 400px); } }
@media (max-width: 600px) {
  .rh-kicker { font-size: .64rem; letter-spacing: .12em; padding: 7px 12px 7px 10px; }
  .u-netbar-nav a { white-space: nowrap; padding: 8px 8px; }
  .rh-hero h1 { font-size: clamp(2.15rem, 10.2vw, 2.9rem); }
}

.rh-quick { display: flex; gap: 8px; margin-top: clamp(22px, 3vw, 36px); overflow-x: auto; scrollbar-width: none; padding: 4px 2px 8px; -webkit-mask: linear-gradient(90deg, #000 88%, transparent); mask: linear-gradient(90deg, #000 88%, transparent); }
.rh-quick::-webkit-scrollbar { display: none; }
.rh-quick a { flex: none; padding: 10px 16px; border-radius: 999px; text-decoration: none; font-weight: 600; font-size: .88rem; color: var(--ink); background: rgba(255, 255, 255, .78);
  border: 1px solid rgba(255, 255, 255, .95); box-shadow: 0 0 0 1px color-mix(in srgb, var(--rh-teal) 16%, transparent); backdrop-filter: blur(10px); transition: background .2s, box-shadow .2s, transform .2s; }
.rh-quick a:hover { background: #fff; box-shadow: 0 0 0 1px var(--rh-teal), 0 8px 20px -12px var(--rh-teal); transform: translateY(-2px); }
@media (min-width: 940px) { .rh-quick { -webkit-mask: none; mask: none; } }

/* Photos du shooting à côté des en-têtes de section (cadre lumineux ; recadrées sur téléphone) */
.rh-head-split { display: grid; gap: 18px 44px; align-items: center; margin-bottom: clamp(22px, 4vw, 44px); }
.rh-head-split .u-head { margin-bottom: 0; }
@media (min-width: 900px) { .rh-head-split { grid-template-columns: minmax(0, 1fr) minmax(260px, .64fr); } }
.rh-head-photo { position: relative; margin: 0; justify-self: center; width: min(100%, 460px); isolation: isolate; }
.rh-head-photo--tall { width: min(100%, 360px); }
.rh-head-photo::before { content: ''; position: absolute; z-index: -1; inset: 7% -5% -5% 7%; border-radius: 34px; transform: rotate(3deg);
  background: linear-gradient(135deg, var(--sun-neon), var(--sun) 50%, var(--rh-rose)); box-shadow: 0 0 60px 6px rgba(255, 228, 92, .5); }
.rh-head-photo img { display: block; width: 100%; height: auto; border-radius: 30px; box-shadow: 0 30px 60px -36px rgba(19, 76, 92, .8), 0 0 0 6px #fff; }
.rh-head-photo--tall img { aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 18%; }
@media (max-width: 899px) {
  .rh-head-photo, .rh-head-photo--tall { width: min(100%, 520px); }
  .rh-head-photo img, .rh-head-photo--tall img { aspect-ratio: 4 / 3; object-fit: cover; object-position: 50% 4%; }
}

/* Transition vers les abonnements : la lumière jaune se mêle au teal et au rose */
#formules { isolation: isolate; padding-top: clamp(28px, 5vw, 64px); }
#formules .rh-plans-head .rh-tag { color: var(--ink); background: linear-gradient(90deg, var(--sun-soft), #fff); box-shadow: 0 0 0 1px rgba(242, 183, 5, .45), 0 10px 26px -16px rgba(226, 170, 0, .9); }
#formules .rh-plans-head .rh-tag::before { background: var(--sun-neon); box-shadow: 0 0 10px 3px rgba(248, 255, 54, .9); }
#formules::before { content: ''; position: absolute; z-index: -1; top: 0; bottom: 0; -webkit-mask: linear-gradient(transparent, #000 240px); mask: linear-gradient(transparent, #000 240px); left: calc(50% - 50vw); right: calc(50% - 50vw); pointer-events: none;
  background: linear-gradient(180deg, #FFFBE0 0%, rgba(255, 251, 224, 0) 30%),
    radial-gradient(48vmax 26vmax at 50% 0%, rgba(255, 228, 92, .32), transparent 70%),
    radial-gradient(40vmax 30vmax at 6% 26%, color-mix(in srgb, var(--rh-teal) 20%, transparent), transparent 70%),
    radial-gradient(34vmax 28vmax at 96% 34%, color-mix(in srgb, var(--rh-rose) 62%, transparent), transparent 70%); }

/* Raccourcis mobiles : barre basse affichée après l'accueil (script), jamais sur ordinateur */
.rh-dock { position: fixed; left: 50%; bottom: max(12px, env(safe-area-inset-bottom)); z-index: 45; display: none; gap: 4px; padding: 6px; border-radius: 999px;
  transform: translate(-50%, 140%); transition: transform .4s cubic-bezier(.2, .7, .2, 1); background: color-mix(in srgb, var(--rh-deep) 88%, transparent); backdrop-filter: blur(16px);
  box-shadow: 0 18px 40px -16px rgba(7, 59, 61, .7), 0 0 0 1px rgba(255, 255, 255, .12); }
.rh-dock a { display: grid; justify-items: center; gap: 1px; min-width: 66px; padding: 7px 10px; border-radius: 999px; color: #fff; text-decoration: none; font: 600 .7rem/1.1 var(--u-text); }
.rh-dock a span { font-size: 1rem; line-height: 1; }
.rh-dock a.is-on { background: color-mix(in srgb, #fff 18%, transparent); }
@media (max-width: 939px) { html.rh-js .rh-dock { display: flex; } html.rh-js .rh-dock.is-shown { transform: translate(-50%, 0); } }
/* La barre basse ne suit pas l’apparition au défilement des sections (elle serait décalée hors de l’écran). */
.rh-dock { animation: none !important; }

/* ─── 2. Formules Instagram : carrousel central ─── */
.rh-plans-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 0 28px; }
.rh-plans-head .u-head { margin-bottom: 14px; }
.rh-from { display: flex; align-items: baseline; gap: 6px; margin: 0 0 20px; color: var(--rh-deep); }
.rh-from b { font-size: clamp(2.4rem, 7vw, 3.6rem); line-height: 1; font-weight: 800; letter-spacing: -.03em; color: var(--rh-teal); }
.rh-from span { font-weight: 600; color: var(--u-muted); }

/* Carrousel commun : défilement par glisser, accès direct, flèches, carte active annoncée ; jamais automatique */
.rh-carousel { position: relative; container-type: inline-size; min-width: 0; }
.rh-car-title { display: grid; gap: 2px; margin: 0 0 10px; }
.rh-car-title b { color: var(--rh-deep); font-size: 1.05rem; }
.rh-car-title span { color: var(--u-muted); font-size: .9rem; }
.rh-picker { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding: 4px 2px 8px; }
.rh-picker::-webkit-scrollbar { display: none; }
.rh-picker a { flex: none; display: grid; justify-items: center; min-width: 76px; min-height: 48px; padding: 7px 14px; border-radius: 16px; text-decoration: none; color: var(--rh-deep);
  background: #fff; border: 1.5px solid color-mix(in srgb, var(--rh-teal) 22%, transparent); transition: background .2s, color .2s, border-color .2s; }
.rh-picker a:hover { border-color: var(--rh-teal); }
.rh-picker b { font-size: .8rem; letter-spacing: .06em; }
.rh-picker span { font-size: .78rem; color: var(--u-muted); }
.rh-picker a[aria-current='true'] { background: var(--rh-teal); border-color: var(--rh-teal); color: #fff; box-shadow: 0 10px 24px -14px var(--rh-teal); }
.rh-picker a[aria-current='true'] span { color: rgba(255, 255, 255, .9); }
.rh-track { --w: min(80vw, 380px); position: relative; list-style: none; margin: 0; padding: 12px 10vw 18px; display: grid; grid-auto-flow: column; grid-auto-columns: var(--w); gap: 12px; align-items: start;
  overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: color-mix(in srgb, var(--rh-teal) 40%, transparent) transparent; }
@supports (width: 1cqi) { .rh-track { --w: min(80cqi, 380px); padding-inline: calc((100cqi - var(--w)) / 2); } }
.rh-track:focus-visible { outline: 2px solid var(--rh-teal); outline-offset: 2px; border-radius: 26px; }
@container (min-width: 860px) {
  .rh-track { align-items: stretch; }
  .rh-carousel--plans .rh-track, .rh-carousel--reco .rh-track { --w: 31cqi; }
  .rh-carousel--works .rh-track { --w: 30cqi; }
}
.rh-slide { scroll-snap-align: center; min-width: 0; transition: transform .35s cubic-bezier(.2, .7, .2, 1), opacity .35s, box-shadow .35s, border-color .35s; }
html.rh-js .rh-slide:not(.is-active) { opacity: .6; transform: scale(.95); }
@container (min-width: 860px) { html.rh-js .rh-slide:not(.is-active) { opacity: .94; transform: scale(.97); } }
.rh-car-ctrl { display: none; align-items: center; justify-content: center; gap: 14px; margin-top: 2px; }
html.rh-js .rh-car-ctrl { display: flex; }
.rh-arrow { flex: none; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; cursor: pointer; background: #fff; color: var(--rh-teal);
  border: 1.5px solid color-mix(in srgb, var(--rh-teal) 30%, transparent); font: 700 1.7rem/1 var(--u-text); box-shadow: 0 8px 20px -14px var(--rh-deep); transition: background .2s, color .2s; }
.rh-arrow:hover:not(:disabled) { background: var(--rh-teal); color: #fff; }
.rh-arrow:disabled { opacity: .35; cursor: default; }
.rh-car-status { margin: 0; min-width: 0; text-align: center; font-weight: 600; font-size: .9rem; color: var(--rh-deep); }

/* Carte de formule : prix et volumes d'abord, l'essentiel, le détail sur place, l'action toujours visible */
.rh-plan { display: flex; flex-direction: column; gap: 14px; padding: 22px 20px; border-radius: 26px; background: color-mix(in srgb, #fff 92%, transparent);
  border: 1.5px solid color-mix(in srgb, var(--rh-teal) 16%, transparent); box-shadow: 0 24px 50px -40px rgba(19, 76, 92, .7); }
.rh-plan.is-active { border-color: var(--rh-teal); box-shadow: 0 30px 60px -34px rgba(2, 127, 129, .7), 0 0 0 4px color-mix(in srgb, var(--rh-rose) 75%, transparent); }
.rh-plan:target { border-color: var(--rh-teal); }
.rh-plan--top { background: linear-gradient(170deg, #fff 30%, color-mix(in srgb, var(--rh-rose) 45%, #fff)); border-color: color-mix(in srgb, #C2479F 40%, transparent); }
.rh-plan header { display: grid; gap: 2px; }
.rh-tier { font: 700 .7rem/1 var(--u-text); letter-spacing: .12em; text-transform: uppercase; color: var(--rh-teal); }
.rh-plan--top .rh-tier { color: var(--rh-rose-ink); }
.rh-plan h3 { font-size: 1.5rem; margin: 6px 0 0; letter-spacing: .02em; }
.rh-price { margin: 0; display: flex; align-items: baseline; gap: 2px; color: var(--rh-deep); }
.rh-price b { font-size: 2.3rem; font-weight: 800; letter-spacing: -.03em; }
.rh-price span { font-weight: 600; color: var(--u-muted); }
.rh-badge { justify-self: start; margin-bottom: 4px; padding: 5px 11px; border-radius: 999px; font: 700 .72rem/1.2 var(--u-text); background: var(--rh-rose); color: var(--rh-deep); }
.rh-vols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.rh-vol { position: relative; display: grid; gap: 2px; padding: 12px 12px 15px; border-radius: 18px; overflow: hidden; background: color-mix(in srgb, var(--rh-mint) 80%, #fff); }
.rh-vol b { font-size: 2rem; line-height: 1; font-weight: 800; color: var(--rh-deep); }
.rh-vol span { font-size: .8rem; font-weight: 600; color: var(--u-muted); }
.rh-vol i { position: absolute; left: 0; bottom: 0; width: 100%; height: 5px; transform-origin: left; transform: scaleX(var(--v)); background: linear-gradient(90deg, var(--rh-teal), #5BD0CF); }
.rh-vol--reel { background: color-mix(in srgb, var(--rh-rose) 38%, #fff); }
.rh-vol--reel i { background: linear-gradient(90deg, #C2479F, #FF9EDD); }
.rh-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; align-content: start; }
.rh-list li { position: relative; padding-left: 24px; font-size: .9rem; line-height: 1.45; }
.rh-list li::before { content: ''; position: absolute; left: 0; top: .32em; width: 15px; height: 15px; border-radius: 50%; background: var(--rh-mint) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23027F81' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 10px no-repeat; }
.rh-list--key li { font-weight: 600; color: var(--rh-deep); }
.rh-more > summary { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; cursor: pointer; list-style: none; font-weight: 700; font-size: .9rem; color: var(--rh-teal); }
.rh-more > summary::-webkit-details-marker { display: none; }
.rh-more > summary::after { content: '+'; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--rh-mint); font-size: 1rem; }
.rh-more[open] > summary::after { content: '−'; }
.rh-more-close, .rh-more[open] .rh-more-open { display: none; }
.rh-more[open] .rh-more-close { display: inline; }
.rh-more > :not(summary) { margin: 6px 0 0; }
.rh-more p { color: var(--u-muted); font-size: .9rem; }
.rh-choose { margin-top: auto; width: 100%; white-space: normal; text-align: center; }

/* Comparaison en tableau (ouverture à la demande) */
.rh-compare { margin: 14px 0 20px; }
.rh-compare > summary { display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 10px 20px; border-radius: 999px; cursor: pointer; list-style: none; font-weight: 700; color: var(--rh-deep);
  background: #fff; border: 1.5px solid color-mix(in srgb, var(--rh-teal) 30%, transparent); }
.rh-compare > summary::-webkit-details-marker { display: none; }
.rh-compare > summary::before { content: '▦'; color: var(--rh-teal); }
.rh-compare[open] > summary { background: var(--rh-mint); }
.rh-table-wrap { margin-top: 12px; overflow-x: auto; border-radius: 22px; background: #fff; border: 1.5px solid color-mix(in srgb, var(--rh-teal) 16%, transparent); }
.rh-table { width: 100%; min-width: 760px; border-collapse: collapse; font-size: .88rem; }
.rh-table th, .rh-table td { padding: 12px 14px; text-align: left; vertical-align: top; border-bottom: 1px solid color-mix(in srgb, var(--rh-teal) 12%, transparent); }
.rh-table thead th { font-size: .8rem; letter-spacing: .08em; color: var(--rh-teal); }
.rh-table tbody th { position: sticky; left: 0; z-index: 1; background: #fff; color: var(--rh-deep); white-space: nowrap; }
.rh-table b { font-size: 1.1rem; color: var(--rh-deep); }
.rh-table ul { margin: 0; padding-left: 16px; display: grid; gap: 4px; }
.rh-table-go { display: inline-flex; min-height: 40px; align-items: center; font-weight: 700; color: var(--rh-teal); }
.rh-notes { list-style: none; margin: 10px 0 0; padding: 0; display: grid; gap: 10px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 760px) { .rh-notes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .rh-notes { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.rh-notes li { display: grid; gap: 4px; align-content: start; padding: 16px; border-radius: 18px; background: color-mix(in srgb, var(--rh-mint) 70%, transparent); border: 1px solid color-mix(in srgb, var(--rh-teal) 14%, transparent); }
.rh-notes b { color: var(--rh-deep); font-size: .92rem; }
.rh-notes span { font-size: .86rem; color: var(--u-muted); }

/* Partenaire stratégique, dès l'accueil */
.rh-ally { display: inline-flex; align-items: center; gap: 12px; margin: 0 0 18px; padding: 7px 18px 7px 7px; border-radius: 999px; text-decoration: none; background: #FFFEF8;
  border: 1.5px solid color-mix(in srgb, var(--rh-gold) 45%, transparent); box-shadow: 0 12px 30px -22px #7A5A17; transition: transform .2s, box-shadow .2s; }
.rh-ally:hover { transform: translateY(-2px); box-shadow: 0 16px 34px -20px #7A5A17; }
.rh-ally-mark { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: radial-gradient(circle at 30% 25%, #2A7E86, #0E3F45); box-shadow: 0 0 0 2px #E8C877; }
.rh-ally-mark img { width: 30px; height: auto; }
.rh-ally-text { display: grid; line-height: 1.3; }
.rh-ally-text b { color: #5E4512; font-size: .86rem; }
.rh-ally-text span { color: var(--u-muted); font-size: .8rem; }

/* Questionnaire : compteur, accès direct, champ « autre activité », propositions en carrousel */
.rh-quiz-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 16px; margin-bottom: 14px; }
.rh-quiz-count { margin: 0; font-weight: 700; font-size: .9rem; color: var(--rh-teal); }
.rh-quiz-skip { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; font-weight: 600; font-size: .9rem; color: var(--rh-deep); }
.rh-other { margin-top: 12px; }
html.rh-js .rh-other:not(.is-on) { display: none; }
.rh-carousel--reco { margin-top: 4px; }
.rh-reco-card { display: flex; flex-direction: column; gap: 10px; padding: 22px 20px; border-radius: 26px; background: #fff; border: 1.5px solid color-mix(in srgb, var(--rh-teal) 18%, transparent); }
.rh-reco-card h3 { margin: 0; font-size: clamp(1.25rem, 3vw, 1.6rem); }
.rh-reco-card p { margin: 0; color: var(--u-muted); font-size: .94rem; }
.rh-reco-tag { align-self: flex-start; padding: 5px 12px; border-radius: 999px; font: 700 .7rem/1.2 var(--u-text); letter-spacing: .1em; text-transform: uppercase; background: var(--rh-mint); color: var(--rh-teal); }
.rh-reco-card--main { color: #fff; border-color: transparent; background: radial-gradient(80% 120% at 100% 0%, color-mix(in srgb, var(--rh-rose) 70%, transparent), transparent 60%), linear-gradient(145deg, var(--rh-teal), var(--rh-deep)); }
.rh-reco-card--main h3, .rh-reco-card--main .rh-reco-price { color: #fff; }
.rh-reco-card--main p { color: rgba(255, 255, 255, .92); }
.rh-reco-card--main .rh-reco-tag { background: var(--rh-rose); color: var(--rh-deep); }
.rh-reco-card--main .u-btn--primary { background: #fff; color: var(--rh-deep); }
.rh-reco-card--main .u-btn--line { color: #fff; border-color: rgba(255, 255, 255, .55); background: transparent; }
.rh-reco-card--extra { background: linear-gradient(160deg, #fff, color-mix(in srgb, var(--rh-rose) 40%, #fff)); border-color: color-mix(in srgb, #C2479F 30%, transparent); }
.rh-reco-card--extra .rh-reco-tag { background: var(--rh-rose-ink); color: #fff; }
.rh-reco-price { font-size: 1.35rem; font-weight: 800; color: var(--rh-deep); }
.rh-reco-card .rh-reco-note { font-size: .84rem; font-weight: 600; color: var(--rh-rose-ink); }
.rh-reco-acts { display: grid; gap: 8px; margin-top: auto; }
.rh-reco-acts .u-btn { width: 100%; white-space: normal; text-align: center; }
.rh-reco-card .u-btn.is-added { background: var(--rh-teal); color: #fff; border-color: var(--rh-teal); }

/* ─── 3. Questionnaire ─── */
.rh-quiz { position: relative; padding: clamp(18px, 4vw, 40px); border-radius: 30px; background: color-mix(in srgb, #fff 78%, transparent); backdrop-filter: blur(18px);
  border: 1px solid color-mix(in srgb, var(--rh-teal) 18%, transparent); box-shadow: 0 30px 70px -40px rgba(19, 76, 92, .5); }
.rh-progress { list-style: none; margin: 0 0 24px; padding: 0; display: none; grid-template-columns: repeat(5, 1fr); gap: 6px; counter-reset: q; }
.rh-progress li { counter-increment: q; display: grid; gap: 8px; font-size: .74rem; font-weight: 600; color: var(--u-muted); }
.rh-progress li::before { content: ''; height: 6px; border-radius: 3px; background: color-mix(in srgb, var(--rh-teal) 14%, transparent); transition: background .4s; }
.rh-progress li.is-done::before, .rh-progress li.is-on::before { background: linear-gradient(90deg, var(--rh-teal), #FF8AD6); }
.rh-progress li.is-on { color: var(--rh-deep); }
@media (max-width: 520px) { .rh-progress li { font-size: 0; gap: 0; } }
.rh-step { border: 0; margin: 0 0 28px; padding: 0; min-width: 0; }
.rh-step legend:focus, .rh-result h3:focus { outline: none; }
.rh-step legend { padding: 0; margin-bottom: 8px; font: 800 clamp(1.25rem, 3vw, 1.7rem)/1.2 var(--u-display); color: var(--rh-deep); letter-spacing: -.02em; }
.rh-fields { display: grid; gap: 14px; margin-top: 10px; }
@media (min-width: 760px) { .rh-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); } .rh-fields .rh-field:last-child { grid-column: 1 / -1; } }
.rh-field { display: grid; gap: 6px; font-weight: 600; font-size: .92rem; color: var(--rh-deep); }
.rh-field i { font-weight: 400; color: var(--u-muted); }
.rh-field input { font: 500 1rem var(--u-text); min-height: 52px; padding: 12px 16px; border-radius: 16px; border: 1.5px solid color-mix(in srgb, var(--rh-teal) 25%, transparent); background: #fff; color: var(--u-ink); transition: border-color .2s, box-shadow .2s; }
.rh-field input:focus { outline: none; border-color: var(--rh-teal); box-shadow: 0 0 0 4px color-mix(in srgb, var(--rh-mint) 90%, transparent), 0 0 0 5px color-mix(in srgb, var(--rh-teal) 30%, transparent); }
.rh-picks { display: grid; gap: 10px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) { .rh-picks { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1040px) { .rh-picks { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.rh-pick { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 14px; min-height: 64px; padding: 14px 16px; border-radius: 20px; cursor: pointer;
  background: #fff; border: 1.5px solid color-mix(in srgb, var(--rh-teal) 16%, transparent); transition: border-color .2s, box-shadow .25s, transform .2s, background .25s; }
.rh-pick:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--rh-teal) 45%, transparent); }
.rh-pick input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.rh-pick b { font-weight: 600; font-size: .96rem; color: var(--rh-deep); }
.rh-pick-ico { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 14px; background: var(--rh-mint); color: var(--rh-teal); transition: background .25s, color .25s; }
.rh-pick-ico svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.rh-pick-check { width: 24px; height: 24px; border-radius: 8px; border: 1.5px solid color-mix(in srgb, var(--rh-teal) 35%, transparent); transition: background .2s, border-color .2s; }
.rh-pick:has(input:checked) { border-color: var(--rh-teal); background: linear-gradient(135deg, #fff, var(--rh-mint)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--rh-rose) 80%, transparent), 0 16px 32px -20px var(--rh-teal); }
.rh-pick:has(input:checked) .rh-pick-ico { background: var(--rh-teal); color: #fff; }
.rh-pick:has(input:checked) .rh-pick-check { background: var(--rh-teal) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 16px no-repeat; border-color: var(--rh-teal); }
.rh-pick:has(input:focus-visible) { outline: 2px solid var(--rh-teal); outline-offset: 3px; }
.rh-quiz-nav { display: none; flex-wrap: wrap; gap: 10px; justify-content: space-between; margin-top: 22px; }
.rh-quiz-nav [data-next] { margin-left: auto; }
@media (max-width: 520px) { .rh-quiz-nav .u-btn { flex: 1; } }
/* Avec le script : une étape à la fois, transitions douces */
.rh-quiz.is-live .rh-progress { display: grid; }
.rh-quiz.is-live .rh-quiz-nav { display: flex; }
.rh-quiz.is-live .rh-step { display: none; margin: 0; }
.rh-quiz.is-live .rh-step.is-on { display: block; animation: rh-in .45s cubic-bezier(.2, .7, .2, 1); }
.rh-quiz:not(.is-live) .rh-result { display: block; }
@keyframes rh-in { from { opacity: 0; transform: translateX(18px); } }
.rh-reco { display: grid; gap: 16px; }
.rh-reco-main { position: relative; display: grid; gap: 10px; padding: clamp(20px, 3vw, 30px); border-radius: 26px; overflow: hidden; color: #fff;
  background: radial-gradient(80% 120% at 100% 0%, color-mix(in srgb, var(--rh-rose) 75%, transparent), transparent 60%), linear-gradient(145deg, var(--rh-teal), var(--rh-deep)); }
.rh-reco-main h3 { color: #fff; font-size: clamp(1.4rem, 3.4vw, 2rem); margin: 0; }
.rh-reco-main p { margin: 0; color: rgba(255, 255, 255, .9); }
.rh-reco-main .rh-reco-price { font-size: 1.4rem; font-weight: 800; }
.rh-reco-main .u-btn { justify-self: start; background: #fff; color: var(--rh-deep); }
.rh-reco-label { font: 700 .72rem/1 var(--u-text); letter-spacing: .14em; text-transform: uppercase; opacity: .85; }
.rh-reco-more { display: grid; gap: 10px; }
@media (min-width: 760px) { .rh-reco-more { grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); } }
.rh-reco-more a { display: grid; gap: 6px; padding: 18px; border-radius: 20px; text-decoration: none; background: #fff; border: 1.5px solid color-mix(in srgb, var(--rh-teal) 18%, transparent); transition: transform .2s, border-color .2s; }
.rh-reco-more a:hover { transform: translateY(-3px); border-color: var(--rh-teal); }
.rh-reco-more b { color: var(--rh-deep); }
.rh-reco-more span { color: var(--u-muted); font-size: .9rem; }
.rh-reco-more em { font-style: normal; font-weight: 700; color: var(--rh-teal); }
.rh-reco-tools { display: flex; flex-wrap: wrap; gap: 10px; }

/* ─── 5. Méthodes A / B ─── */
.rh-modes { display: grid; gap: 16px; }
@media (min-width: 900px) { .rh-modes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.rh-mode { position: relative; display: grid; align-content: start; gap: 12px; padding: clamp(22px, 3.4vw, 34px); border-radius: 28px; overflow: hidden; }
.rh-mode p { margin: 0; color: var(--u-muted); }
.rh-mode h3 { font-size: clamp(1.3rem, 2.6vw, 1.7rem); margin: 0; }
.rh-mode--a { background: linear-gradient(160deg, #fff, var(--rh-mint)); border: 1.5px solid color-mix(in srgb, var(--rh-teal) 22%, transparent); }
.rh-mode--b { background: linear-gradient(160deg, #fff, color-mix(in srgb, var(--rh-rose) 55%, #fff)); border: 1.5px solid color-mix(in srgb, #C2479F 30%, transparent); }
.rh-mode-badge { justify-self: start; padding: 6px 12px; border-radius: 999px; font: 700 .74rem/1.2 var(--u-text); background: var(--rh-teal); color: #fff; }
.rh-mode--b .rh-mode-badge { background: var(--rh-rose-ink); }
.rh-chips { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.rh-chips li { padding: 7px 12px; border-radius: 999px; font-size: .84rem; font-weight: 600; color: var(--rh-deep); background: #fff; border: 1px solid color-mix(in srgb, var(--rh-teal) 22%, transparent); }
.rh-trips { display: grid; gap: 8px; }
.rh-trip { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; align-items: center; padding: 14px 16px; border-radius: 18px; text-decoration: none; background: #fff;
  border: 1.5px solid color-mix(in srgb, #C2479F 22%, transparent); transition: transform .2s, border-color .2s, box-shadow .2s; }
.rh-trip:hover { transform: translateX(4px); border-color: #C2479F; box-shadow: 0 12px 28px -18px #C2479F; }
.rh-trip b { color: var(--rh-deep); }
.rh-trip-price { font-weight: 800; font-size: 1.15rem; color: var(--rh-deep); }
.rh-trip-go { grid-column: 1 / -1; font-size: .82rem; font-weight: 600; color: var(--rh-rose-ink); }
.rh-rules { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 6px; grid-template-columns: repeat(2, minmax(0, 1fr)); counter-reset: r; }
.rh-rules li { counter-increment: r; display: flex; gap: 8px; align-items: center; padding: 10px 12px; border-radius: 14px; background: rgba(255, 255, 255, .75); font-size: .82rem; font-weight: 600; color: var(--rh-deep); }
.rh-rules li::before { content: counter(r); flex: none; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--rh-rose-ink); color: #fff; font-size: .72rem; }

/* ─── 4. Prestations à la carte : ajout depuis la carte, rubriques en onglets, sélection en direct ─── */
.rh-shop { display: grid; gap: 18px; align-items: start; }
@media (min-width: 1000px) { .rh-shop:not(.rh-shop--plain) { grid-template-columns: minmax(0, 1fr) 340px; } }
.rh-cats { display: grid; gap: 16px; min-width: 0; }
.rh-cat-nav { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding: 4px 2px; }
.rh-cat-nav::-webkit-scrollbar { display: none; }
.rh-cat-nav a { flex: none; display: inline-flex; align-items: center; gap: 8px; min-height: 46px; padding: 8px 18px; border-radius: 999px; text-decoration: none; font-weight: 600; font-size: .9rem;
  color: var(--rh-deep); background: #fff; border: 1.5px solid color-mix(in srgb, var(--rh-teal) 22%, transparent); transition: background .2s, color .2s; }
.rh-cat-nav a:hover { border-color: var(--rh-teal); }
.rh-cat-nav a[aria-selected='true'] { background: var(--rh-teal); color: #fff; border-color: var(--rh-teal); }
.rh-cat-count { min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px; font: 700 .74rem/22px var(--u-text); font-style: normal; text-align: center; background: var(--rh-rose); color: var(--rh-deep); }
.rh-cat { scroll-margin-top: 80px; }
.rh-cat > h3 { font-size: 1.1rem; margin-bottom: 10px; color: var(--rh-teal); }
html.rh-js .rh-cat > h3 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.rh-items { display: grid; gap: 10px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) { .rh-items { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.rh-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 12px; align-content: start; padding: 16px; border-radius: 22px; background: color-mix(in srgb, #fff 92%, transparent);
  border: 1.5px solid color-mix(in srgb, var(--rh-teal) 14%, transparent); transition: border-color .2s, box-shadow .25s, background .25s; }
.rh-item.is-picked { border-color: var(--rh-teal); background: linear-gradient(135deg, #fff, var(--rh-mint)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--rh-rose) 80%, transparent); }
.rh-item-main h4 { margin: 0; font: 700 1rem/1.3 var(--u-display); color: var(--rh-deep); }
.rh-item-main p { margin: 3px 0 0; font-size: .86rem; color: var(--u-muted); }
.rh-item-price { margin: 0; font-weight: 800; color: var(--rh-deep); white-space: nowrap; text-align: right; }
.rh-item-price span { display: block; font-weight: 500; font-size: .76rem; color: var(--u-muted); }
.rh-item > .rh-add, .rh-item > .rh-qty, .rh-item > .rh-item-go, .rh-item > .rh-why, .rh-item > .rh-item-link { grid-column: 1 / -1; }
.rh-add, .rh-add-btn { position: relative; display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 10px 16px; border-radius: 999px; cursor: pointer;
  font: 700 .92rem/1.2 var(--u-text); color: var(--rh-teal); background: var(--rh-mint); border: 1.5px solid color-mix(in srgb, var(--rh-teal) 35%, transparent); transition: background .2s, color .2s; }
.rh-add:hover, .rh-add-btn:hover { border-color: var(--rh-teal); }
.rh-add input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
html:not(.rh-js) .rh-add input { position: static; width: 20px; height: 20px; opacity: 1; accent-color: var(--rh-teal); }
.rh-add-on { display: none; }
.rh-add-on::before { content: '✓ '; }
.rh-item.is-picked .rh-add { background: var(--rh-teal); color: #fff; border-color: var(--rh-teal); }
.rh-item.is-picked .rh-add-on { display: inline; }
.rh-item.is-picked .rh-add-off { display: none; }
.rh-item.is-blocked .rh-add { opacity: .5; cursor: not-allowed; }
.rh-add:has(input:focus-visible) { outline: 2px solid var(--rh-teal); outline-offset: 3px; }
.rh-qty { display: flex; align-items: center; justify-content: flex-end; gap: 10px; }
.rh-add-btn { display: none; flex: 1; }
html.rh-js .rh-add-btn { display: flex; }
html.rh-js .rh-qty .rh-stepper { display: none; }
html.rh-js .rh-qty.is-picked .rh-add-btn { display: none; }
html.rh-js .rh-qty.is-picked .rh-stepper { display: flex; }
html.rh-js .rh-qty.is-picked::before { content: '✓ Dans ma sélection'; margin-right: auto; font-weight: 700; font-size: .88rem; color: var(--rh-teal); }
.rh-stepper { display: flex; align-items: center; gap: 4px; padding: 4px; border-radius: 999px; background: var(--rh-mint); }
.rh-stepper button { width: 44px; height: 44px; border-radius: 50%; border: 0; background: #fff; color: var(--rh-teal); font: 700 1.25rem/1 var(--u-text); cursor: pointer; box-shadow: 0 2px 6px -2px rgba(7, 59, 61, .3); transition: transform .15s, background .2s; }
.rh-stepper button:hover { background: var(--rh-teal); color: #fff; }
.rh-stepper button:active { transform: scale(.92); }
.rh-stepper input { width: 46px; text-align: center; border: 0; background: transparent; font: 800 1.05rem var(--u-text); color: var(--rh-deep); -moz-appearance: textfield; appearance: textfield; }
.rh-stepper input::-webkit-inner-spin-button, .rh-stepper input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.rh-why { margin: 0; font-size: .84rem; font-weight: 600; color: var(--rh-rose-ink); }
.rh-item-link { justify-self: start; font-size: .82rem; color: var(--u-muted); }
.rh-item-go { width: 100%; white-space: normal; }
.rh-basket { position: sticky; top: 76px; display: grid; gap: 12px; padding: 22px; border-radius: 28px; color: #fff; scroll-margin-top: 80px;
  background: radial-gradient(80% 60% at 100% 0%, color-mix(in srgb, var(--rh-rose) 55%, transparent), transparent 60%), linear-gradient(160deg, var(--rh-teal), var(--rh-deep)); box-shadow: 0 30px 60px -36px rgba(19, 76, 92, .9); }
.rh-basket h3 { color: #fff; margin: 0; }
.rh-basket-lines { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; max-height: 300px; overflow: auto; }
.rh-basket-lines li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 8px; font-size: .9rem; padding: 6px 0; border-bottom: 1px dashed rgba(255, 255, 255, .25); }
.rh-basket-lines button { width: 36px; height: 36px; border-radius: 50%; border: 0; cursor: pointer; background: rgba(255, 255, 255, .16); color: #fff; font: 700 1rem/1 var(--u-text); }
.rh-basket-lines button:hover { background: rgba(255, 255, 255, .3); }
.rh-basket-lines .rh-basket-empty { display: block; opacity: .85; border: 0; }
.rh-nudge { margin: 0; padding: 10px 12px; border-radius: 14px; background: rgba(255, 255, 255, .14); font-size: .86rem; }
.rh-nudge button { margin: 6px 0 0; border: 0; border-radius: 999px; padding: 8px 14px; min-height: 40px; background: #fff; color: var(--rh-deep); font: 700 .82rem var(--u-text); cursor: pointer; }
.rh-total { display: flex; align-items: baseline; justify-content: space-between; padding-top: 4px; }
.rh-total b { font-size: 2rem; font-weight: 800; }
.rh-total b.is-bump { animation: rh-bump .4s ease; }
@keyframes rh-bump { 40% { transform: scale(1.08); } }
.rh-basket .u-btn--primary { background: #fff; color: var(--rh-deep); }
.rh-basket .u-btn[disabled] { opacity: .55; pointer-events: none; }
.rh-basket .rh-small { color: rgba(255, 255, 255, .85); margin: 0; }
@media (max-width: 999px) { .rh-basket { position: relative; top: 0; } }
/* Barre basse (téléphone) : la sélection y est résumée ; la page garde une marge pour que rien ne soit masqué */
.rh-dock a { position: relative; }
.rh-dock-count { position: absolute; top: 1px; right: 8px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; font: 800 .66rem/18px var(--u-text); font-style: normal; text-align: center; background: var(--rh-rose); color: var(--rh-deep); }
@media (max-width: 939px) { html.rh-js { scroll-padding-bottom: 100px; } html.rh-js body.u-body { padding-bottom: calc(86px + env(safe-area-inset-bottom)); } }

/* ─── 8. Méthode : cinq cartes alignées (même hauteur, titres sur la même ligne, une icône par étape) ─── */
#methode .u-steps { gap: 14px; align-items: stretch; }
@media (min-width: 640px) { #methode .u-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1000px) { #methode .u-steps { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
#methode .u-steps li { position: relative; display: grid; grid-template-rows: auto auto 1fr; align-content: start; gap: 10px; padding: 22px 20px 24px; border-radius: 24px;
  background: rgba(255, 255, 255, .86); border: 1px solid var(--rh-line); box-shadow: var(--studio-shadow); }
#methode .u-steps li::before { content: ''; position: absolute; top: 18px; right: 18px; width: 42px; height: 42px; border-radius: 14px; background: color-mix(in srgb, var(--rh-mint) 85%, #fff); }
#methode .u-steps li::after { content: ''; position: absolute; top: 29px; right: 29px; width: 20px; height: 20px; background: var(--rh-teal); -webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat; }
#methode .u-steps li:nth-child(1) { --ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%279%27%20cy%3D%278%27%20r%3D%273.2%27%2F%3E%3Cpath%20d%3D%27M3%2020c.6-3.4%203-5%206-5s5.4%201.6%206%205%27%2F%3E%3Cpath%20d%3D%27M15%204h6v5h-3l-2%202V9h-1z%27%2F%3E%3C%2Fsvg%3E"); }
#methode .u-steps li:nth-child(2) { --ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2712%27%20r%3D%279%27%2F%3E%3Cpath%20d%3D%27m15.5%208.5-2%205-5%202%202-5z%27%2F%3E%3C%2Fsvg%3E"); }
#methode .u-steps li:nth-child(3) { --ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M4%208h3l2-3h6l2%203h3v11H4z%27%2F%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2713%27%20r%3D%273.5%27%2F%3E%3C%2Fsvg%3E"); }
#methode .u-steps li:nth-child(4) { --ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%274%27%20y%3D%275%27%20width%3D%2716%27%20height%3D%2715%27%20rx%3D%273%27%2F%3E%3Cpath%20d%3D%27M8%203v4M16%203v4M4%2010h16M9%2015l2%202%204-4%27%2F%3E%3C%2Fsvg%3E"); }
#methode .u-steps li:nth-child(5) { --ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M4%2020h16M7%2016v-5M12%2016V7M17%2016v-8%27%2F%3E%3C%2Fsvg%3E"); }
#methode .u-step-n { display: flex; align-items: center; min-height: 42px; font: 800 1.5rem/1 var(--u-text); color: var(--rh-teal); letter-spacing: 0; }
#methode .u-steps b { display: block; font-size: 1.04rem; line-height: 1.3; color: var(--ink); }
#methode .u-steps span:last-child { font-size: .9rem; line-height: 1.55; }
@media (min-width: 640px) { #methode .u-steps b { min-height: 2.6em; } }

/* ─── Réalisations : carrousel (réalisations réelles et autorisées seulement) ─── */
.rh-carousel--works { margin-bottom: 18px; }
.rh-work { display: grid; gap: 8px; align-content: start; padding: 14px; border-radius: 24px; background: #fff; border: 1.5px solid color-mix(in srgb, var(--rh-teal) 14%, transparent); }
.rh-work.is-active { border-color: var(--rh-teal); box-shadow: 0 0 0 4px color-mix(in srgb, var(--rh-rose) 70%, transparent); }
.rh-work-art { margin: 0; aspect-ratio: 4 / 3; border-radius: 18px; overflow: hidden; display: grid; place-items: center; background: linear-gradient(135deg, var(--rh-mint), var(--rh-rose)); }
.rh-work-art img { width: 100%; height: 100%; object-fit: cover; }
.rh-work-art span { font: 800 3.4rem/1 var(--u-display); color: var(--rh-teal); }
.rh-work-kind { justify-self: start; padding: 4px 11px; border-radius: 999px; font-weight: 700; font-size: .76rem; background: var(--rh-mint); color: var(--rh-teal); }
.rh-work h3 { margin: 0; font-size: 1.12rem; }
.rh-works { display: grid; gap: 12px; }

.rh-ig { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 18px 22px; border-radius: 24px; text-decoration: none; grid-column: 1 / -1;
  background: linear-gradient(120deg, #fff, var(--rh-mint) 60%, color-mix(in srgb, var(--rh-rose) 70%, #fff)); border: 1.5px solid color-mix(in srgb, var(--rh-teal) 22%, transparent); transition: transform .2s, box-shadow .2s; }
.rh-ig:hover { transform: translateY(-3px); box-shadow: 0 20px 40px -26px var(--rh-teal); }
.rh-ig-ring { width: 52px; height: 52px; border-radius: 50%; padding: 3px; background: conic-gradient(from 210deg, var(--rh-teal), #5BD0CF, var(--rh-rose), #FF8AD6, var(--rh-teal)); animation: rh-spin 8s linear infinite; }
.rh-ig-ring span { display: block; width: 100%; height: 100%; border-radius: 50%; background: url(/u/rihma/logo.png) center / 260% no-repeat; border: 2px solid #fff; animation: rh-spin 8s linear infinite reverse; }
@keyframes rh-spin { to { transform: rotate(1turn); } }
.rh-contact { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 10px; }
.rh-contact a { padding: 12px 18px; border-radius: 999px; background: #fff; border: 1.5px solid color-mix(in srgb, var(--rh-teal) 22%, transparent); color: var(--rh-deep); font-weight: 600; text-decoration: none; }
.rh-contact a:hover { border-color: var(--rh-teal); }
.rh-ig-text { display: grid; }
.rh-ig-text b { color: var(--rh-deep); font-size: 1.1rem; }
.rh-ig-text span { color: var(--u-muted); font-size: .9rem; }

/* ─── 10. Partenariat La Maison Million × RIHMA Agency : deux univers, une fusion lumineuse ─── */
/* Gauche : La Maison Million (teal profond, or subtil). Droite : RIHMA (jaune solaire, teal lumineux, rose). Au centre, la
   lumière jaune et teal réunit les deux marques. Deux entreprises indépendantes. */
.rh-duo { position: relative; display: grid; overflow: hidden; isolation: isolate; border-radius: 34px; color: var(--ink);
  box-shadow: 0 60px 110px -60px rgba(14, 63, 69, .9), 0 0 0 1px rgba(255, 255, 255, .6), 0 0 0 8px color-mix(in srgb, var(--sun) 22%, transparent); }
@media (min-width: 900px) { .rh-duo { grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); } }
.rh-duo-art { position: relative; display: grid; place-items: center; min-height: 250px; padding: 28px;
  background: radial-gradient(55% 60% at 26% 18%, rgba(232, 200, 119, .32), transparent 70%), radial-gradient(70% 70% at 100% 100%, rgba(2, 127, 129, .6), transparent 70%),
    linear-gradient(150deg, #072A2F 0%, #0E3F45 45%, #0F5C63 100%); }
/* Fines lignes dorées (univers premium de La Maison Million) */
.rh-duo-art::before { content: ''; position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background: repeating-linear-gradient(135deg, rgba(232, 200, 119, .14) 0 1px, transparent 1px 22px); -webkit-mask: radial-gradient(75% 75% at 30% 30%, #000, transparent); mask: radial-gradient(75% 75% at 30% 30%, #000, transparent); }
.rh-duo-copy { position: relative; display: grid; justify-items: start; align-content: center; gap: 4px; padding: clamp(26px, 4.6vw, 58px);
  background: radial-gradient(70% 90% at 100% 0%, rgba(255, 205, 242, .8), transparent 60%), radial-gradient(60% 80% at 0% 100%, rgba(2, 127, 129, .16), transparent 60%),
    linear-gradient(160deg, #FFFEF6 0%, #FFF5A6 62%, var(--sun) 100%); }
/* Fusion : halo jaune et teal à la jonction des deux univers */
.rh-duo-fusion { position: absolute; z-index: 1; left: 41%; top: 50%; width: 380px; aspect-ratio: 1; translate: -50% -50%; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, rgba(255, 255, 255, .9) 0 5%, rgba(248, 255, 54, .7) 16%, rgba(47, 198, 196, .42) 36%, transparent 64%); mix-blend-mode: screen; animation: rh-breathe 6s ease-in-out infinite; }
@media (max-width: 899px) { .rh-duo-fusion { left: 50%; top: 250px; width: 300px; } }
.rh-duo-marks { position: relative; z-index: 2; display: flex; align-items: center; }
.rh-duo-lmm, .rh-duo-rh { display: grid; place-items: center; width: clamp(108px, 12vw, 138px); aspect-ratio: 1; border-radius: 50%; }
.rh-duo-lmm { background: radial-gradient(circle at 30% 25%, #2A7E86, #0E3F45 70%); box-shadow: 0 0 0 2px #E8C877, 0 0 0 10px rgba(232, 200, 119, .14), 0 30px 50px -24px #000; }
.rh-duo-lmm img { width: 74%; height: auto; }
.rh-duo-rh { background: radial-gradient(circle at 32% 26%, #FFFEF2, var(--sun) 72%); box-shadow: 0 0 0 2px #fff, 0 0 0 10px rgba(255, 228, 92, .3), 0 0 60px 8px rgba(255, 228, 92, .7); }
.rh-duo-rh b { font: 500 1.5rem/1 Georgia, serif; color: var(--rh-deep); }
@supports ((mask-image: url(x)) or (-webkit-mask-image: url(x))) {
  .rh-duo-rh b { width: 76%; aspect-ratio: 452 / 143; font-size: 0; background: linear-gradient(100deg, var(--rh-deep), var(--rh-teal));
    -webkit-mask: url(/u/rihma/logo-mark.png) center / contain no-repeat; mask: url(/u/rihma/logo-mark.png) center / contain no-repeat; }
}
.rh-duo-x { position: relative; z-index: 3; display: grid; place-items: center; width: 42px; height: 42px; margin: 0 -8px; border-radius: 50%; font: 800 1.1rem/1 var(--u-text);
  color: var(--ink); background: #fff; box-shadow: 0 0 26px 8px rgba(248, 255, 54, .85), 0 0 0 1px rgba(232, 200, 119, .8); }
.rh-tag--duo { color: var(--ink); background: rgba(255, 255, 255, .8); box-shadow: 0 0 0 1px rgba(201, 162, 75, .55), 0 10px 26px -16px rgba(226, 170, 0, .9); }
.rh-tag--duo::before { background: linear-gradient(135deg, #E8C877, var(--sun-neon)); box-shadow: 0 0 10px 2px rgba(248, 255, 54, .9); }
/* Le texte passe au-dessus de la lumière de fusion : contraste intact */
.rh-duo-copy > * { position: relative; z-index: 2; }
.rh-duo-copy h2 { margin: 0 0 .25em; color: var(--ink); }
.rh-duo-copy p { margin: 0; color: color-mix(in srgb, var(--ink) 86%, #fff); max-width: 58ch; }
.rh-duo-copy .rh-duo-note { margin: 10px 0 16px; font-size: .86rem; font-weight: 600; color: color-mix(in srgb, var(--ink) 78%, #fff); }

/* Demande sur mesure (section commune) */
#sur-mesure .u-cta { background: radial-gradient(70% 120% at 100% 0%, color-mix(in srgb, var(--rh-rose) 75%, transparent), transparent 60%), linear-gradient(145deg, #fff, var(--rh-mint)); border: 1.5px solid color-mix(in srgb, var(--rh-teal) 25%, transparent); border-radius: 30px; }
.u-faq details { background: #fff; border-color: color-mix(in srgb, var(--rh-teal) 16%, transparent); border-radius: 20px; }
.u-faq details[open] { box-shadow: 0 16px 34px -26px var(--rh-teal); }

/* ─── Ma demande : configuration, récapitulatif et envoi sur la page (fenêtre accessible) ─── */
html.rh-sheet-open { overflow: hidden; }
.rh-sheet { width: min(640px, calc(100% - 32px)); max-width: none; max-height: min(92dvh, 900px); margin: auto; padding: 0; border: 0; border-radius: 28px; overflow: hidden;
  background: var(--rh-cream); color: var(--u-ink); box-shadow: 0 40px 100px -30px rgba(7, 59, 61, .6); }
.rh-sheet::backdrop { background: rgba(7, 59, 61, .45); }
@media (max-width: 640px) { .rh-sheet { width: 100%; max-height: 94dvh; margin: auto 0 0; border-radius: 26px 26px 0 0; } }
.rh-sheet-in { display: flex; flex-direction: column; max-height: inherit; }
.rh-sheet-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; align-items: center; padding: 16px 18px 12px 20px; background: #fff; border-bottom: 1px solid color-mix(in srgb, var(--rh-teal) 14%, transparent); }
.rh-sheet-kicker { margin: 0; font: 700 .72rem/1.3 var(--u-text); letter-spacing: .1em; text-transform: uppercase; color: var(--rh-teal); }
.rh-sheet-head h2 { grid-column: 1; margin: 0; font-size: clamp(1.15rem, 4vw, 1.45rem); }
.rh-sheet-head h2:focus { outline: none; }
.rh-sheet-x { grid-column: 2; grid-row: 1 / span 2; width: 44px; height: 44px; border-radius: 50%; cursor: pointer; background: #fff; color: var(--rh-deep); border: 1.5px solid color-mix(in srgb, var(--rh-teal) 25%, transparent); font: 600 1.4rem/1 var(--u-text); }
.rh-sheet-body { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; display: grid; gap: 16px; align-content: start; padding: 16px 20px 22px; }
.rh-sheet-foot { display: flex; flex-wrap: wrap; gap: 10px; padding: 12px 20px calc(12px + env(safe-area-inset-bottom)); background: #fff; border-top: 1px solid color-mix(in srgb, var(--rh-teal) 14%, transparent); }
.rh-sheet-foot .u-btn { flex: 1 1 150px; white-space: normal; }
.rh-sheet-foot:empty { display: none; }
.rh-sheet fieldset { margin: 0; padding: 0; border: 0; min-width: 0; display: grid; gap: 8px; }
.rh-sheet legend { padding: 0; margin-bottom: 6px; font-weight: 800; color: var(--rh-deep); }
.rh-sheet .rh-hint { margin: 0; }
.rh-opt { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; min-height: 56px; padding: 12px 16px; border-radius: 18px; cursor: pointer; background: #fff; border: 1.5px solid color-mix(in srgb, var(--rh-teal) 18%, transparent); }
.rh-opt input { width: 20px; height: 20px; margin: 0; accent-color: var(--rh-teal); }
.rh-opt b { font-size: .95rem; color: var(--rh-deep); }
.rh-opt em { font-style: normal; font-weight: 700; font-size: .84rem; color: var(--rh-teal); white-space: nowrap; }
.rh-opt.is-on { border-color: var(--rh-teal); background: linear-gradient(135deg, #fff, var(--rh-mint)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--rh-rose) 80%, transparent); }
.rh-explain { margin: 0; padding: 12px 14px; border-radius: 16px; font-size: .88rem; color: var(--rh-deep); background: color-mix(in srgb, var(--rh-rose) 45%, #fff); }
.rh-recap { display: grid; gap: 8px; padding: 18px; border-radius: 22px; color: #fff; background: radial-gradient(80% 80% at 100% 0%, color-mix(in srgb, var(--rh-rose) 55%, transparent), transparent 60%), linear-gradient(150deg, var(--rh-teal), var(--rh-deep)); }
.rh-recap h3 { margin: 0; color: #fff; font-size: 1.05rem; }
.rh-recap ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.rh-recap li { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; font-size: .9rem; border-bottom: 1px dashed rgba(255, 255, 255, .28); }
.rh-recap li span:last-child { white-space: nowrap; font-weight: 700; }
.rh-recap-total { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.rh-recap-total b { font-size: 1.9rem; font-weight: 800; }
.rh-recap .rh-small { margin: 0; color: rgba(255, 255, 255, .88); }
.rh-recap-edit { justify-self: start; min-height: 44px; padding: 8px 16px; border-radius: 999px; cursor: pointer; background: rgba(255, 255, 255, .14); color: #fff; border: 1px solid rgba(255, 255, 255, .45); font: 700 .88rem var(--u-text); }
.rh-sheet .rh-fields { margin: 0; }
.rh-sheet .rh-field textarea { font: 500 1rem/1.5 var(--u-text); min-height: 110px; padding: 12px 16px; border-radius: 16px; resize: vertical; color: var(--u-ink); background: #fff; border: 1.5px solid color-mix(in srgb, var(--rh-teal) 25%, transparent); }
.rh-sheet .rh-field textarea:focus { outline: none; border-color: var(--rh-teal); box-shadow: 0 0 0 4px color-mix(in srgb, var(--rh-mint) 90%, transparent); }
.rh-check { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px; align-items: start; font-size: .86rem; color: var(--u-muted); cursor: pointer; }
.rh-check input { width: 22px; height: 22px; margin: 1px 0 0; accent-color: var(--rh-teal); }
.rh-check a { color: var(--rh-teal); font-weight: 600; }
.rh-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.rh-alert { margin: 0; padding: 12px 14px; border-radius: 14px; font-weight: 600; font-size: .9rem; background: #FDE8EF; color: #8A1538; }
.rh-done { display: grid; gap: 8px; justify-items: center; text-align: center; }
.rh-done p { margin: 0; color: var(--u-muted); }
.rh-done-mark { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; font-size: 2rem; color: #fff; background: var(--rh-teal); box-shadow: 0 0 0 8px var(--rh-mint); }
.rh-next { display: grid; gap: 10px; padding: 18px; border-radius: 22px; background: linear-gradient(160deg, #fff, color-mix(in srgb, var(--rh-rose) 55%, #fff)); border: 1.5px solid color-mix(in srgb, #C2479F 30%, transparent); }
.rh-next h3 { margin: 0; font-size: 1.1rem; }
.rh-next p { margin: 0; font-size: .9rem; color: var(--u-muted); }
button.rh-trip { width: 100%; font: inherit; text-align: left; cursor: pointer; }

/* Sobriété : moins d'effets coûteux sur les petits appareils, aucun mouvement sur demande */
@media (max-width: 700px) { .u-body::before { animation: none; } }
@media (prefers-reduced-motion: reduce) {
  html.rh-js .rh-slide:not(.is-active) { transform: none; }
  .u-body::before, .rh-spark, .rh-card-sheen, .rh-ig-ring, .rh-ig-ring span, .rh-total b.is-bump, .rh-quiz.is-live .rh-step.is-on { animation: none; }
  .rh-hero-copy > *, .rh-ray::before, .rh-cta-sun::after, .rh-portrait, .rh-duo-fusion, .rh-at-scene-i { animation: none; }
  .rh-cta-sun, .rh-cta-glass, .rh-quick a { transition: none; }
  .rh-slide, .rh-item, .rh-picker a, .rh-ally, .rh-pick { transition: none; }
}
html[data-motion='none'] .rh-card, html[data-motion='none'].rh-js .rh-slide:not(.is-active) { transform: none; }
html[data-motion='none'] .rh-slide { transition: none; }
/* Petits écrans : rayons tournants arrêtés (économie de batterie) */

/* ═══════════════════════════════════════════════════════════════════════════════════════
   ATELIER RAYONNEMENT (04/11) — diagnostic adaptatif, profil en direct, restitution, projet
   Solaire et néon : jaune lumineux, teal, touches roses, fonds brillants. Ordinateur : interaction à gauche, profil
   évolutif à droite. Téléphone : profil compact au-dessus, cartes tactiles, conseils sous la question.
   ═══════════════════════════════════════════════════════════════════════════════════════ */
/* Départ depuis l'accueil */
.rh-starter { display: grid; gap: 10px; margin-top: 18px; padding: 14px; border-radius: 24px; max-width: 620px;
  background: linear-gradient(135deg, rgba(255, 255, 255, .86), color-mix(in srgb, var(--sun-soft) 55%, #fff));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--sun-deep) 30%, transparent), 0 18px 44px -26px var(--sun-deep); backdrop-filter: blur(10px); }
.rh-starter > p { margin: 0; display: flex; flex-wrap: wrap; gap: 2px 10px; align-items: baseline; }
.rh-starter > p b { color: var(--rh-deep); }
.rh-starter > p span { font-size: .84rem; color: var(--u-muted); }
.rh-starter-opts { display: grid; gap: 8px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.rh-starter-opt { display: grid; justify-items: start; gap: 8px; min-height: 92px; padding: 12px; border-radius: 18px; text-decoration: none; color: var(--rh-deep); background: #fff;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--rh-teal) 18%, transparent); transition: transform .25s, box-shadow .25s; }
.rh-starter-opt b { font-size: .86rem; line-height: 1.25; }
.rh-starter-opt:hover, .rh-starter-opt:focus-visible { transform: translateY(-3px); box-shadow: 0 0 0 2px var(--rh-teal), 0 14px 30px -18px var(--rh-teal), 0 0 24px -6px color-mix(in srgb, var(--sun-neon) 70%, transparent); }
@media (max-width: 520px) { .rh-starter-opts { grid-template-columns: minmax(0, 1fr); } .rh-starter-opt { grid-template-columns: auto minmax(0, 1fr); align-items: center; min-height: 56px; } }

/* Fond de section : lumière solaire, reflets teal et rose, pleine largeur */
#atelier { isolation: isolate; scroll-margin-top: 64px; }
.rh-at-stage, .rh-at-result, .rh-at-grid { scroll-margin-top: 72px; }
#atelier::before { content: ''; position: absolute; z-index: -1; inset: 0 calc(50% - 50vw); pointer-events: none;
  background: radial-gradient(40vmax 30vmax at 92% 8%, rgba(255, 241, 107, .75), transparent 70%), radial-gradient(36vmax 28vmax at 2% 30%, color-mix(in srgb, var(--rh-mint) 95%, transparent), transparent 70%),
    radial-gradient(30vmax 26vmax at 70% 100%, color-mix(in srgb, var(--rh-rose) 85%, transparent), transparent 70%), linear-gradient(180deg, #FFFDF4, #FFFFFF 40%, #FFF9FC); }
.rh-at-head { display: grid; gap: 16px 32px; align-items: end; margin-bottom: clamp(18px, 3vw, 28px); }
.rh-at-head .u-head { margin-bottom: 0; }
@media (min-width: 980px) { .rh-at-head { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); } }
.rh-at-promise { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.rh-at-promise li { display: grid; gap: 2px; padding: 12px 14px; border-radius: 18px; background: rgba(255, 255, 255, .8); box-shadow: var(--rh-neon); }
.rh-at-promise b { color: var(--rh-deep); font-size: .92rem; }
.rh-at-promise span { color: var(--u-muted); font-size: .8rem; line-height: 1.35; }
@media (max-width: 560px) { .rh-at-promise { gap: 6px; } .rh-at-promise li { padding: 8px 6px; text-align: center; border-radius: 14px; } .rh-at-promise b { font-size: .78rem; } .rh-at-promise span { display: none; } }

.rh-at-grid { display: grid; gap: 18px; align-items: start; }
.rh-at-grid[hidden], .rh-at-result[hidden], .rh-at-pass[hidden], .rh-at-q[hidden] { display: none; }
@media (min-width: 980px) { .rh-at-grid { grid-template-columns: minmax(0, 1.45fr) minmax(300px, .85fr); gap: 24px; } }

/* Scène des questions */
.rh-at-stage { position: relative; padding: clamp(16px, 3vw, 32px); border-radius: 30px; background: rgba(255, 255, 255, .88); backdrop-filter: blur(16px);
  border: 1.5px solid transparent; background-clip: padding-box; box-shadow: 0 0 0 1.5px color-mix(in srgb, var(--rh-teal) 20%, transparent), 0 30px 70px -40px color-mix(in srgb, var(--rh-teal) 80%, transparent); }
.rh-at-bar { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 14px; align-items: center; margin-bottom: 18px; }
.rh-at-step { margin: 0; font-weight: 800; font-size: .9rem; color: var(--rh-teal); }
.rh-at-bar .rh-at-skip { justify-self: end; }
@media (max-width: 560px) { .rh-at-bar { grid-template-columns: minmax(0, 1fr); } .rh-at-bar .rh-at-skip { justify-self: start; min-height: 32px; order: 3; } .rh-res-orbs b { font-size: .66rem; } .rh-res-orbs span { font-size: .64rem; } .rh-res-orbs .rh-at-orb { width: 40px; height: 40px; } }
.rh-at-skip { font-size: .84rem; font-weight: 600; color: var(--rh-deep); min-height: 44px; display: inline-flex; align-items: center; }
.rh-at-track { grid-column: 1 / -1; height: 8px; border-radius: 999px; background: color-mix(in srgb, var(--rh-teal) 12%, transparent); overflow: hidden; }
.rh-at-track i { display: block; height: 100%; width: var(--p, 4%); border-radius: inherit; background: linear-gradient(90deg, var(--rh-teal), #2FC6C4 45%, var(--sun-deep) 80%, #FF8AD6);
  box-shadow: 0 0 14px color-mix(in srgb, var(--sun-neon) 80%, transparent); transition: width .6s cubic-bezier(.2, .8, .2, 1); }
html.rh-js .rh-at.is-live .rh-at-screen:not(.is-on) { display: none; }
.rh-at-screen.is-on { animation: rh-at-in .45s cubic-bezier(.2, .8, .2, 1) both; }
@keyframes rh-at-in { from { opacity: 0; transform: translateX(18px); } }
.rh-at-q { border: 0; margin: 0 0 18px; padding: 0; min-width: 0; }
.rh-at-q + .rh-at-q { padding-top: 18px; border-top: 1px dashed color-mix(in srgb, var(--rh-teal) 22%, transparent); animation: rh-at-in .4s both; }
.rh-at-q legend { padding: 0; margin-bottom: 6px; font: 800 clamp(1.25rem, 3vw, 1.75rem)/1.18 var(--u-display); color: var(--rh-deep); letter-spacing: -.02em; }
.rh-at-q legend:focus { outline: none; }
.rh-at-hint { margin: 0 0 12px; font-size: .88rem; color: var(--u-muted); }
.rh-at-opts { display: grid; gap: 10px; grid-template-columns: minmax(0, 1fr); margin-top: 10px; }
@media (min-width: 560px) { .rh-at-opts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1180px) { .rh-at-opts--many { grid-template-columns: repeat(3, minmax(0, 1fr)); } .rh-at-q[data-type='single'] .rh-at-opts--many .rh-at-check { display: none; } .rh-at-opts--many .rh-at-opt { grid-template-columns: auto minmax(0, 1fr) auto; padding-right: 10px; } }
.rh-at-opt { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; min-height: 64px; padding: 12px 14px; border-radius: 20px; cursor: pointer;
  background: #fff; border: 1.5px solid color-mix(in srgb, var(--rh-teal) 16%, transparent); transition: transform .2s, border-color .2s, box-shadow .25s, background .25s;
  animation: rh-at-pop .45s cubic-bezier(.2, .8, .2, 1) both; animation-delay: calc(var(--i, 0) * 35ms); }
@keyframes rh-at-pop { from { opacity: 0; transform: translateY(8px) scale(.98); } }
.rh-at-opt:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--rh-teal) 45%, transparent); box-shadow: 0 14px 30px -22px var(--rh-teal); }
.rh-at-opt input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
.rh-at-txt { display: grid; gap: 2px; }
.rh-at-txt b { font-weight: 650; font-size: .96rem; color: var(--rh-deep); line-height: 1.25; }
.rh-at-txt small { font-size: .78rem; color: var(--u-muted); }
.rh-at-ico { display: grid; place-items: center; flex: none; width: 42px; height: 42px; border-radius: 14px; background: var(--rh-mint); color: var(--rh-teal); transition: background .25s, color .25s, box-shadow .25s; }
.rh-at-ico svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.rh-at-check { width: 24px; height: 24px; border-radius: 50%; border: 1.5px solid color-mix(in srgb, var(--rh-teal) 35%, transparent); transition: background .2s, border-color .2s, transform .25s; }
.rh-at-q[data-type='multi'] .rh-at-check { border-radius: 8px; }
.rh-at-opt:has(input:checked) { border-color: var(--rh-teal); background: linear-gradient(135deg, #fff 30%, color-mix(in srgb, var(--sun-soft) 70%, #fff));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--sun) 70%, transparent), 0 0 26px -6px color-mix(in srgb, var(--sun-neon) 80%, transparent), 0 16px 32px -22px var(--rh-teal); }
.rh-at-opt:has(input:checked) .rh-at-ico { background: var(--rh-teal); color: #fff; box-shadow: 0 0 0 4px color-mix(in srgb, var(--rh-rose) 70%, transparent); }
.rh-at-opt:has(input:checked) .rh-at-check { transform: scale(1.08); border-color: var(--rh-teal); background: var(--rh-teal) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 15px no-repeat; }
.rh-at-opt:has(input:focus-visible) { outline: 2px solid var(--rh-teal); outline-offset: 3px; }
.rh-at-opt.is-off { opacity: .45; }
.rh-at-opt.is-off:hover { transform: none; box-shadow: none; }
.rh-at-opt--only { border-style: dashed; }
.rh-at-tip { display: none; margin: 12px 0 0; padding: 10px 12px; border-radius: 14px; font-size: .84rem; line-height: 1.45; color: var(--rh-deep);
  background: linear-gradient(120deg, color-mix(in srgb, var(--sun-soft) 70%, #fff), #fff); box-shadow: 0 0 0 1px color-mix(in srgb, var(--sun-deep) 30%, transparent); }
.rh-at-tip-k { font-weight: 800; color: #7A5A17; }
.rh-at-nav { display: none; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 6px; }
.rh-at.is-live .rh-at-nav { display: flex; }
.rh-at-nav [data-at-next] { margin-left: auto; }
.rh-at-nav [data-at-back]:disabled { visibility: hidden; }
.rh-at-pass { min-height: 44px; padding: 0 12px; border: 0; background: none; font: 600 .9rem var(--u-text); color: var(--rh-deep); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
@media (max-width: 520px) { .rh-at-nav .u-btn { flex: 1 1 40%; } .rh-at-pass { order: 3; flex: 1 1 100%; } }

/* Profil en direct */
.rh-at-live { position: relative; display: grid; gap: 14px; padding: 20px; border-radius: 30px; overflow: hidden; color: var(--rh-deep);
  background: linear-gradient(155deg, #FFFDF0 0%, color-mix(in srgb, var(--sun-soft) 80%, #fff) 30%, color-mix(in srgb, var(--rh-rose) 55%, #fff) 70%, color-mix(in srgb, var(--rh-mint) 90%, #fff));
  box-shadow: 0 0 0 1.5px color-mix(in srgb, #fff 70%, transparent), 0 0 0 3px color-mix(in srgb, var(--rh-teal) 14%, transparent), 0 30px 60px -36px color-mix(in srgb, #C2479F 70%, transparent); }
.rh-at-live::before { content: ''; position: absolute; z-index: -1; width: 260px; height: 260px; right: -90px; top: -90px; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, rgba(255, 245, 100, .95), rgba(255, 228, 92, 0) 70%); }
@media (min-width: 980px) { .rh-at-live { position: sticky; top: 76px; z-index: 0; } }
.rh-at-live h3 { margin: 0; font-size: 1.12rem; }
.rh-at-coach { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 12px; align-items: center; }
.rh-at-coach img { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; object-position: 50% 18%; box-shadow: 0 0 0 3px #fff, 0 0 0 5px var(--sun), 0 0 22px var(--sun-neon); }
.rh-at-coach p { margin: 0; display: grid; gap: 3px; font-size: .86rem; line-height: 1.45; }
.rh-at-coach b { font-size: .8rem; color: var(--rh-teal); }
.rh-at-dims { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.rh-at-dim { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px; align-items: center; padding: 6px 10px 6px 6px; border-radius: 16px; background: rgba(255, 255, 255, .55); transition: background .3s, box-shadow .3s; }
.rh-at-dim.is-current { background: #fff; box-shadow: 0 0 0 1.5px var(--rh-teal), 0 10px 22px -16px var(--rh-teal); }
.rh-at-dim-txt { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 8px; font-size: .86rem; }
.rh-at-dim-txt span { font-weight: 700; font-size: .78rem; color: var(--u-muted); }
.rh-at-orb { position: relative; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; color: color-mix(in srgb, var(--rh-deep) 45%, transparent); background: rgba(255, 255, 255, .7);
  border: 1.5px dashed color-mix(in srgb, var(--rh-teal) 25%, transparent); transition: background .4s, color .4s, border-color .4s, box-shadow .4s; }
.rh-at-orb svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
[data-state='appui'] > .rh-at-orb { border: 0; color: #fff; background: linear-gradient(135deg, var(--rh-teal), #2FC6C4); box-shadow: 0 0 16px -2px color-mix(in srgb, #2FC6C4 80%, transparent); }
[data-state='consolider'] > .rh-at-orb { border: 0; color: var(--rh-deep); background: linear-gradient(135deg, var(--sun), var(--sun-deep)); box-shadow: 0 0 18px -2px color-mix(in srgb, var(--sun-neon) 90%, transparent); }
[data-state='priorite'] > .rh-at-orb { border: 0; color: #fff; background: linear-gradient(135deg, #FF8AD6, #C2479F); box-shadow: 0 0 0 4px color-mix(in srgb, var(--rh-rose) 80%, transparent), 0 0 20px -2px #FF8AD6; }
[data-state='preciser'] > .rh-at-orb { color: var(--rh-teal); border-color: var(--rh-teal); }
[data-state='appui'] .rh-at-dim-txt span { color: var(--rh-teal); }
[data-state='consolider'] .rh-at-dim-txt span { color: #7A5A17; }
[data-state='priorite'] .rh-at-dim-txt span { color: #8E2F73; }
.rh-at-dim.is-bump .rh-at-orb { animation: rh-at-bump .6s cubic-bezier(.2, .8, .2, 1); }
@keyframes rh-at-bump { 40% { transform: scale(1.18); } }
.rh-at-k { margin: 0 0 6px; font-size: .74rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--rh-teal); }
.rh-at-facts ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: .84rem; line-height: 1.45; }
.rh-at-facts li { padding-left: 16px; position: relative; animation: rh-at-pop .4s both; }
.rh-at-facts li::before { content: ''; position: absolute; left: 0; top: .55em; width: 7px; height: 7px; border-radius: 50%; background: var(--sun-deep); box-shadow: 0 0 8px var(--sun-neon); }
.rh-at-facts li.rh-at-empty::before { background: color-mix(in srgb, var(--rh-teal) 25%, transparent); box-shadow: none; }
.rh-at-empty { color: var(--u-muted); }
.rh-at-paths p[data-at-paths] { margin: 0; display: grid; gap: 3px; padding: 12px 14px; border-radius: 18px; background: #fff; box-shadow: var(--rh-neon); font-size: .86rem; }
.rh-at-paths b { color: var(--rh-deep); font-size: .98rem; }
.rh-at-price { font-weight: 800; color: var(--rh-teal); }
.rh-at-note { margin: 0; font-size: .76rem; color: var(--u-muted); }
.rh-at-live-toggle { display: none; }
@media (max-width: 979px) {
  .rh-at-live { order: -1; gap: 10px; padding: 14px; border-radius: 24px; }
  .rh-at-coach, .rh-at-live h3, .rh-at-note { display: none; }
  .rh-at-dims { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px; }
  .rh-at-dim { grid-template-columns: minmax(0, 1fr); justify-items: center; text-align: center; padding: 6px 2px; background: transparent; }
  .rh-at-dim.is-current { background: rgba(255, 255, 255, .85); }
  .rh-at-dim-txt { display: grid; justify-items: center; font-size: .7rem; }
  .rh-at-dim-txt span { font-size: .64rem; line-height: 1.15; }
  .rh-at-orb { width: 34px; height: 34px; }
  .rh-at-orb svg { width: 17px; height: 17px; }
  .rh-at-facts, .rh-at-paths { display: none; }
  .rh-at-live.is-open .rh-at-facts, .rh-at-live.is-open .rh-at-paths { display: block; }
  .rh-at-live-toggle { display: flex; justify-content: center; gap: 6px; min-height: 40px; align-items: center; border: 0; border-radius: 999px; background: rgba(255, 255, 255, .7); font: 700 .82rem var(--u-text); color: var(--rh-deep); cursor: pointer; }
  .rh-at-tip { display: block; }
}

/* ─── Restitution ─── */
.rh-at-result:focus { outline: none; }
.rh-res { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr); animation: rh-at-in .5s both; }
@media (min-width: 980px) { .rh-res { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 20px; } .rh-res > * { grid-column: 1 / -1; } .rh-res-sit { grid-column: span 7; } .rh-res-prio { grid-column: span 5; } }
.rh-res-top { display: grid; gap: 14px; align-items: end; }
@media (min-width: 980px) { .rh-res-top { grid-template-columns: minmax(0, 1fr) auto; } }
.rh-res-top h3 { margin: 0; font-size: clamp(1.5rem, 3.4vw, 2.2rem); }
.rh-res-disc { margin: 6px 0 0; color: var(--u-muted); font-size: .9rem; }
.rh-res-tools { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.rh-res-block { position: relative; padding: clamp(16px, 3vw, 26px); border-radius: 28px; background: rgba(255, 255, 255, .9); box-shadow: 0 0 0 1.5px color-mix(in srgb, var(--rh-teal) 14%, transparent), 0 24px 50px -36px color-mix(in srgb, var(--rh-teal) 70%, transparent); animation: rh-at-pop .5s both; }
.rh-res-block h4 { margin: 0 0 12px; padding-right: 44px; font-size: clamp(1.15rem, 2.4vw, 1.45rem); color: var(--rh-deep); }
.rh-res-k { position: absolute; top: clamp(14px, 3vw, 24px); right: clamp(14px, 3vw, 24px); margin: 0; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%;
  font-weight: 800; color: var(--rh-deep); background: linear-gradient(135deg, var(--sun), var(--sun-deep)); box-shadow: 0 0 16px -2px var(--sun-neon); }
.rh-res-orbs { list-style: none; margin: 0 0 14px; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
.rh-res-orbs li { display: grid; justify-items: center; text-align: center; gap: 4px; font-size: .74rem; }
.rh-res-orbs .rh-at-orb { width: 46px; height: 46px; }
.rh-res-orbs b { font-size: .78rem; color: var(--rh-deep); }
.rh-res-orbs span { color: var(--u-muted); line-height: 1.2; }
.rh-res-list { margin: 0; padding-left: 18px; display: grid; gap: 6px; font-size: .9rem; line-height: 1.5; }
.rh-res-prio ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.rh-res-prio li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px 12px; padding: 12px; border-radius: 18px; background: linear-gradient(120deg, #fff, color-mix(in srgb, var(--rh-rose) 35%, #fff)); }
.rh-res-prio li b { color: var(--rh-deep); }
.rh-res-prio li > span:last-child { grid-column: 2; font-size: .86rem; color: var(--u-muted); line-height: 1.45; }
.rh-res-num { grid-row: span 2; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 12px; font-weight: 800; color: #fff; background: linear-gradient(135deg, #FF8AD6, #C2479F); }
.rh-res-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; counter-reset: s; }
@media (min-width: 760px) { .rh-res-steps { grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); } }
.rh-res-steps li { position: relative; display: grid; gap: 4px; align-content: start; padding: 16px 14px 14px; border-radius: 20px; background: linear-gradient(160deg, #fff, color-mix(in srgb, var(--rh-mint) 80%, #fff)); font-size: .86rem; line-height: 1.45; }
.rh-res-steps li::after { content: ''; position: absolute; left: 14px; right: 14px; top: 0; height: 4px; border-radius: 0 0 4px 4px; background: linear-gradient(90deg, var(--rh-teal), var(--sun-deep)); }
.rh-res-steps b { color: var(--rh-deep); font-size: .98rem; }
.rh-res-when { font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--rh-teal); }
.rh-res-main { background: linear-gradient(135deg, #0B5E62 0%, var(--rh-teal) 45%, #13999A 100%); color: #fff; overflow: hidden; isolation: isolate; }
.rh-res-main::before { content: ''; position: absolute; z-index: -1; width: 420px; height: 420px; right: -120px; top: -160px; border-radius: 50%; background: radial-gradient(circle, rgba(255, 241, 107, .55), transparent 70%); }
.rh-res-main::after { content: ''; position: absolute; z-index: -1; width: 300px; height: 300px; left: -80px; bottom: -150px; border-radius: 50%; background: radial-gradient(circle, rgba(255, 138, 214, .45), transparent 70%); }
.rh-res-main h4 { color: #fff; }
.rh-res-offer { display: grid; gap: 18px; }
@media (min-width: 900px) { .rh-res-offer { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); align-items: start; } }
.rh-res-offer h5 { margin: 0 0 12px; font-size: clamp(1.4rem, 3vw, 2rem); line-height: 1.15; color: #fff; }
.rh-res-prices { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 6px; }
.rh-res-prices > span { display: grid; gap: 2px; padding: 10px 14px; border-radius: 16px; background: rgba(255, 255, 255, .12); }
.rh-res-main .rh-res-prices b { font-size: 1.5rem; color: #fff; text-shadow: 0 0 18px rgba(248, 255, 54, .6); }
.rh-res-main .rh-res-prices > span { box-shadow: inset 0 -3px 0 var(--sun); }
.rh-res-prices small { font-size: .74rem; opacity: .9; }
.rh-res-why { display: flex; align-items: center; gap: 8px; margin: 0 0 6px; font-size: .74rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: #fff; }
.rh-res-why::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--sun); box-shadow: 0 0 10px var(--sun-neon); }
.rh-res-offer ul { margin: 0 0 12px; padding-left: 18px; display: grid; gap: 6px; font-size: .9rem; line-height: 1.5; }
.rh-res-cap { margin: 0 0 14px; font-size: .84rem; opacity: .95; }
.rh-res-warn { margin: 0 0 12px; padding: 8px 12px; border-radius: 12px; font-size: .84rem; background: color-mix(in srgb, var(--sun) 25%, transparent); color: inherit; }
.rh-res-alts .rh-res-warn { background: #FFF6DC; color: #7A5A17; }
.rh-res-main .u-btn--primary { background: linear-gradient(120deg, var(--sun), var(--sun-deep)); color: var(--rh-deep); box-shadow: 0 0 30px -6px var(--sun-neon); }
.rh-res-altlist { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
@media (max-width: 700px) { .rh-res-altlist { grid-auto-flow: column; grid-auto-columns: 82%; grid-template-columns: none; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 6px; } .rh-res-alt { scroll-snap-align: start; } }
.rh-res-alt { display: grid; gap: 8px; align-content: start; padding: 16px; border-radius: 22px; background: #fff; box-shadow: 0 0 0 1.5px color-mix(in srgb, var(--rh-teal) 16%, transparent); animation: rh-at-pop .45s both; animation-delay: calc(var(--i, 0) * 60ms); }
.rh-res-alt h5 { margin: 0; font-size: 1.02rem; color: var(--rh-deep); }
.rh-res-alt .rh-res-prices > span { display: inline-flex; align-items: baseline; gap: 5px; background: var(--rh-mint); font-size: .84rem; }
.rh-res-alt .rh-res-prices b { color: var(--rh-deep); }
.rh-res-alt ul { margin: 0; padding-left: 18px; font-size: .84rem; line-height: 1.45; color: var(--u-muted); display: grid; gap: 4px; }
.rh-res-alt .u-btn { justify-self: start; margin-top: auto; }
.rh-res-tag { justify-self: start; padding: 4px 10px; border-radius: 999px; font-size: .72rem; font-weight: 800; color: #8E2F73; background: color-mix(in srgb, var(--rh-rose) 70%, #fff); }

/* Projet */
.rh-proj { display: grid; gap: 18px; }
@media (min-width: 980px) { .rh-proj { grid-template-columns: minmax(0, 1.25fr) minmax(320px, .9fr); align-items: start; } .rh-proj-sum { position: sticky; top: 76px; } }
.rh-proj-build { display: grid; gap: 16px; }
.rh-proj fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.rh-proj legend, .rh-proj-label { margin: 0 0 8px; padding: 0; font-weight: 800; color: var(--rh-deep); }
.rh-proj-label small { display: block; font-weight: 500; font-size: .8rem; color: var(--u-muted); }
.rh-proj-planlist { display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(138px, 1fr)); }
.rh-plan-pick, .rh-chip { position: relative; display: grid; gap: 2px; padding: 10px 12px; border-radius: 16px; cursor: pointer; background: #fff; border: 1.5px solid color-mix(in srgb, var(--rh-teal) 18%, transparent); transition: border-color .2s, box-shadow .2s, transform .2s; }
.rh-plan-pick input, .rh-chip input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
.rh-plan-pick b, .rh-chip b { color: var(--rh-deep); font-size: .92rem; }
.rh-plan-pick small, .rh-chip small { color: var(--u-muted); font-size: .76rem; }
.rh-plan-pick i { position: absolute; top: -9px; right: 10px; padding: 2px 8px; border-radius: 999px; font: 800 .66rem/1.4 var(--u-text); font-style: normal; color: var(--rh-deep); background: linear-gradient(135deg, var(--sun), var(--sun-deep)); }
.rh-plan-pick.is-on, .rh-chip.is-on { border-color: var(--rh-teal); background: linear-gradient(135deg, #fff, var(--rh-mint)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--rh-rose) 75%, transparent); }
.rh-plan-pick:has(input:focus-visible), .rh-chip:has(input:focus-visible) { outline: 2px solid var(--rh-teal); outline-offset: 3px; }
.rh-proj-chips { display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }
.rh-proj-chips legend { grid-column: 1 / -1; }
.rh-proj-items { display: grid; gap: 12px; }
.rh-proj-group > p { margin: 0 0 6px; font-size: .74rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--rh-teal); }
.rh-proj-group ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.rh-proj-group li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 8px 8px 8px 14px; border-radius: 16px; background: #fff; border: 1.5px solid color-mix(in srgb, var(--rh-teal) 12%, transparent); transition: border-color .2s, background .2s; }
.rh-proj-group li.is-on { border-color: var(--rh-teal); background: linear-gradient(120deg, #fff, color-mix(in srgb, var(--sun-soft) 55%, #fff)); }
.rh-proj-group li.is-blocked { opacity: .6; }
.rh-proj-group li > span { display: grid; gap: 1px; }
.rh-proj-group li b { color: var(--rh-deep); font-size: .9rem; }
.rh-proj-group li small { color: var(--u-muted); font-size: .78rem; }
.rh-proj-group output { min-width: 32px; text-align: center; font-weight: 800; color: var(--rh-deep); }
.rh-proj-group .rh-stepper button:disabled { opacity: .4; cursor: default; }
.rh-proj-toggle { min-height: 44px; min-width: 96px; padding: 0 14px; border-radius: 999px; border: 1.5px solid var(--rh-teal); background: #fff; font: 700 .86rem var(--u-text); color: var(--rh-teal); cursor: pointer; }
.rh-proj-toggle.is-on { background: var(--rh-teal); color: #fff; }
.rh-proj-toggle:disabled { opacity: .5; cursor: not-allowed; }
.rh-proj-sum { display: grid; gap: 12px; padding: 18px; border-radius: 24px; background: linear-gradient(160deg, #FFFDF0, color-mix(in srgb, var(--sun-soft) 60%, #fff) 50%, color-mix(in srgb, var(--rh-rose) 40%, #fff));
  box-shadow: 0 0 0 1.5px color-mix(in srgb, var(--sun-deep) 30%, transparent), 0 22px 46px -30px var(--sun-deep); }
.rh-proj-sum h5 { margin: 0; font-size: 1.05rem; color: var(--rh-deep); }
.rh-proj-sum dl { margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.rh-proj-sum dl div { display: grid; gap: 2px; padding: 10px 12px; border-radius: 16px; background: #fff; }
.rh-proj-sum dt { font-size: .74rem; font-weight: 700; color: var(--u-muted); }
.rh-proj-sum dd { margin: 0; font-size: 1.3rem; font-weight: 800; color: var(--rh-deep); }
.rh-proj-sum .rh-small { margin: 0; }
.rh-proj-sum .rh-fields { display: grid; gap: 10px; grid-template-columns: minmax(0, 1fr); }
.rh-proj-sum .rh-fields .rh-field:last-child { grid-column: auto; }
.rh-proj-more summary { min-height: 44px; display: flex; align-items: center; font-weight: 700; font-size: .9rem; color: var(--rh-deep); cursor: pointer; }
.rh-proj-more summary i { font-weight: 400; color: var(--u-muted); margin-left: 4px; }
.rh-proj-more .rh-field { margin-top: 8px; }
.rh-proj .rh-field textarea { font: 500 1rem/1.5 var(--u-text); min-height: 90px; padding: 12px 16px; border-radius: 16px; resize: vertical; color: var(--u-ink); background: #fff; border: 1.5px solid color-mix(in srgb, var(--rh-teal) 25%, transparent); }
.rh-proj .u-btn--lg { width: 100%; justify-content: center; }
.rh-res-proj .rh-done { padding: 22px; border-radius: 22px; background: linear-gradient(160deg, #fff, var(--rh-mint)); margin-bottom: 12px; }

@media (prefers-reduced-motion: reduce) {
  .rh-at-screen.is-on, .rh-at-opt, .rh-at-q + .rh-at-q, .rh-at-facts li, .rh-res, .rh-res-block, .rh-res-alt { animation: none; }
  .rh-at-track i { transition: none; }
}
html[data-motion='none'] .rh-at-screen.is-on, html[data-motion='none'] .rh-at-opt, html[data-motion='none'] .rh-res-block { animation: none; }
.rh-res-human { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 12px; align-items: center; margin: 16px 0 0; padding: 12px; border-radius: 20px; background: rgba(255, 255, 255, .1); }
.rh-res-human img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; object-position: 50% 18%; box-shadow: 0 0 0 3px rgba(255, 255, 255, .85), 0 0 0 5px var(--sun), 0 0 24px var(--sun-neon); }
.rh-res-human figcaption { display: grid; gap: 2px; font-size: .84rem; line-height: 1.4; }
.rh-res-human b { color: #fff; }

/* ═══════════════════════════════════════════════════════════════════════════════════════
   SOFT STUDIO GLOW (04/11) — mise en scène des visuels et lumières par univers
   Hero champagne · Atelier teal très diffus · Formules reflets jaunes et roses · Sections informatives ivoire chaud.
   Images : AVIF/WebP aux tailles de l'écran, chargement différé hors accueil, dimensions déclarées, « Illustration » visible.
   ═══════════════════════════════════════════════════════════════════════════════════════ */
/* Photos du shooting à côté des en-têtes : arche champagne au lieu du cadre jaune et rose lumineux */
.rh-head-photo::before { inset: 5% -3.5% -3.5% 5%; border-radius: 32px; transform: none; background: linear-gradient(180deg, #F3EADF, var(--champagne)); box-shadow: none; }
.rh-head-photo img { box-shadow: var(--studio-shadow), 0 0 0 6px rgba(255, 255, 255, .7); }

/* Formules : reflets jaunes et roses très doux sur ivoire */
#formules::before { background: linear-gradient(180deg, var(--ivory) 0%, rgba(250, 248, 244, 0) 30%),
    radial-gradient(46vmax 26vmax at 80% 6%, rgba(255, 228, 92, .14), transparent 70%),
    radial-gradient(38vmax 30vmax at 4% 30%, color-mix(in srgb, var(--rh-mint) 50%, transparent), transparent 70%),
    radial-gradient(34vmax 28vmax at 96% 40%, rgba(255, 205, 242, .3), transparent 70%); }
#formules .rh-plans-head .rh-tag { background: #FFF9E6; box-shadow: 0 0 0 1px rgba(201, 160, 40, .35); }
#formules .rh-plans-head .rh-tag::before { background: var(--sun-deep); box-shadow: none; }

/* Mise en scène Instagram : profil de démonstration (B2), réactions (B3), mois de la formule active (volumes réels) */
.rh-plans-head--scene { display: grid; gap: 18px 44px; align-items: center; margin-bottom: 8px; }
@media (min-width: 900px) { .rh-plans-head--scene { grid-template-columns: minmax(0, 1fr) minmax(0, .92fr); } }
.rh-plans-copy { min-width: 0; }
.rh-plans-copy .u-head { margin-bottom: 14px; }
.rh-scene { margin: 0; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); grid-template-rows: auto auto auto; gap: 12px; align-items: end; }
.rh-scene-main { grid-row: 1 / span 2; min-width: 0; }
.rh-scene-main img, .rh-scene-inset img { display: block; width: 100%; height: auto; border-radius: 26px; box-shadow: var(--studio-shadow); }
.rh-scene-main img { aspect-ratio: 4 / 5; object-fit: cover; object-position: 52% 46%; }
.rh-scene-inset { min-width: 0; }
.rh-scene-inset img { aspect-ratio: 1; object-fit: cover; object-position: 50% 44%; border-radius: 22px; }
.rh-scene > .rh-illus { grid-column: 1 / -1; }
.rh-board { min-width: 0; padding: 14px; border-radius: 22px; background: rgba(255, 255, 255, .9); border: 1px solid var(--rh-line); box-shadow: var(--studio-shadow); }
.rh-board-k { margin: 0; font-size: .78rem; color: var(--u-muted); }
.rh-board-k b { color: var(--ink); letter-spacing: .04em; }
.rh-board-v { display: flex; flex-wrap: wrap; gap: 4px 12px; margin: 4px 0 10px; font-size: .84rem; font-weight: 600; color: var(--ink); }
.rh-dot { display: inline-block; width: 9px; height: 9px; margin-right: 5px; border-radius: 50%; vertical-align: .05em; background: var(--rh-teal); }
.rh-dot--r { background: #D9479F; }
.rh-board-days { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.rh-board-days li { aspect-ratio: 1; border-radius: 6px; background: color-mix(in srgb, var(--champagne) 75%, #fff); transition: background .35s, transform .35s; }
.rh-board-days li.rh-board-dow { aspect-ratio: auto; background: none; font: 700 .6rem/1.2 var(--u-text); text-align: center; color: var(--u-muted); }
.rh-board-days li.is-p { background: var(--rh-teal); }
.rh-board-days li.is-r { background: #D9479F; }
.rh-board-note { margin: 8px 0 0; font-size: .7rem; line-height: 1.35; color: var(--u-muted); }
@media (max-width: 599px) {
  .rh-scene { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; }
  .rh-scene-main { grid-row: auto; }
  .rh-scene-inset { display: none; }
  .rh-board { padding: 10px; }
  .rh-board-v { font-size: .76rem; }
}

/* Atelier : lumière teal très diffuse ; visuel contextuel de la dimension en cours */
#atelier::before { background: radial-gradient(46vmax 32vmax at 90% 8%, color-mix(in srgb, var(--rh-teal) 10%, transparent), transparent 70%),
    radial-gradient(38vmax 30vmax at 2% 34%, color-mix(in srgb, var(--rh-mint) 75%, transparent), transparent 70%),
    radial-gradient(30vmax 24vmax at 70% 100%, rgba(255, 205, 242, .22), transparent 70%), linear-gradient(180deg, #F6F5F0, var(--ivory)); }
.rh-at-live { background: linear-gradient(160deg, #FFFEFB 0%, var(--cream) 52%, color-mix(in srgb, var(--rh-mint) 55%, #fff)); box-shadow: 0 0 0 1px var(--rh-line), var(--studio-shadow); }
.rh-at-live::before { background: radial-gradient(circle, color-mix(in srgb, var(--rh-teal) 14%, transparent), transparent 70%); }
.rh-at-coach img { box-shadow: 0 0 0 3px #fff, 0 0 0 4px var(--champagne); }
.rh-at-scene { margin: 0; }
.rh-at-scene-i { display: none; }
.rh-at:not([data-at-dim]) .rh-at-scene-i[data-scene='identite'],
.rh-at[data-at-dim='identite'] .rh-at-scene-i[data-scene='identite'], .rh-at[data-at-dim='visibilite'] .rh-at-scene-i[data-scene='visibilite'],
.rh-at[data-at-dim='production'] .rh-at-scene-i[data-scene='production'], .rh-at[data-at-dim='strategie'] .rh-at-scene-i[data-scene='strategie'],
.rh-at[data-at-dim='organisation'] .rh-at-scene-i[data-scene='organisation'] { display: block; animation: rh-scene-in .5s ease both; }
@keyframes rh-scene-in { from { opacity: 0; } }
.rh-at-scene-i img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; object-position: 50% 45%; border-radius: 18px; box-shadow: var(--studio-shadow); }
.rh-at-scene-cap { margin: 8px 0 0; font-size: .8rem; line-height: 1.4; color: var(--u-muted); }
.rh-at-scene-cap b { color: var(--rh-teal); }
.rh-at-scene .rh-illus { margin-top: 2px; }
@media (max-width: 979px) { .rh-at-scene { display: none; } }
.rh-at-track i { box-shadow: none; }

/* Deux façons de produire : la différence se lit d'un coup d'œil (qui filme ?) */
.rh-mode-art { margin: calc(clamp(22px, 3.4vw, 34px) * -1) calc(clamp(22px, 3.4vw, 34px) * -1) 0; }
.rh-mode-art img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; object-position: 50% 52%; }
.rh-mode-art .rh-illus { margin: 8px clamp(22px, 3.4vw, 34px) 0; }
.rh-mode-who { margin: 2px 0 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.rh-mode-who b { font-size: clamp(1.25rem, 2.4vw, 1.5rem); line-height: 1.15; color: var(--ink); letter-spacing: -.02em; }
.rh-mode-who span { font-weight: 600; color: var(--u-muted); }
.rh-mode--a { background: linear-gradient(170deg, #fff, color-mix(in srgb, var(--rh-mint) 70%, var(--ivory))); border-color: var(--rh-line); }
.rh-mode--b { background: linear-gradient(170deg, #fff, color-mix(in srgb, var(--rh-rose) 30%, var(--ivory))); border-color: var(--rh-line); }

/* Prestations : couverture de rubrique (illustration ou planche de marque en code) */
.rh-cat-cover { margin: 0 0 12px; }
.rh-cat-cover img { display: block; width: 100%; height: clamp(120px, 15vw, 168px); object-fit: cover; object-position: 50% 52%; border-radius: 22px; box-shadow: var(--studio-shadow); }
.rh-cat-cover--brand { display: flex; align-items: center; justify-content: center; gap: clamp(14px, 3vw, 30px); height: clamp(120px, 15vw, 168px); padding: 0 20px; border-radius: 22px;
  background: radial-gradient(60% 80% at 80% 20%, rgba(255, 205, 242, .35), transparent 70%), linear-gradient(120deg, #FFFDF9, var(--cream)); border: 1px solid var(--rh-line); box-shadow: var(--studio-shadow); }
.rh-cc-logo { width: clamp(96px, 14vw, 140px); aspect-ratio: 452 / 143; background: linear-gradient(100deg, var(--rh-deep), var(--rh-teal));
  -webkit-mask: url(/u/rihma/logo-mark.png) center / contain no-repeat; mask: url(/u/rihma/logo-mark.png) center / contain no-repeat; }
.rh-cc-type { font: 800 clamp(1.8rem, 4vw, 2.6rem)/1 var(--u-display); color: var(--ink); }
.rh-cc-sw { display: flex; gap: 6px; }
.rh-cc-sw i { width: clamp(18px, 2.4vw, 26px); aspect-ratio: 1; border-radius: 50%; box-shadow: 0 0 0 2px #fff; background: var(--rh-teal); }
.rh-cc-sw i:nth-child(2) { background: var(--rh-deep); } .rh-cc-sw i:nth-child(3) { background: var(--rh-mint); } .rh-cc-sw i:nth-child(4) { background: var(--rh-rose); } .rh-cc-sw i:nth-child(5) { background: var(--sun); }
@media (max-width: 420px) { .rh-cc-type { display: none; } }

/* Pourquoi communiquer : section pédagogique, ivoire chaud */
#pourquoi { isolation: isolate; }
#pourquoi::before { content: ''; position: absolute; z-index: -1; inset: 0 calc(50% - 50vw); pointer-events: none; -webkit-mask: linear-gradient(transparent, #000 160px, #000 calc(100% - 160px), transparent); mask: linear-gradient(transparent, #000 160px, #000 calc(100% - 160px), transparent);
  background: radial-gradient(40vmax 30vmax at 90% 20%, rgba(237, 228, 215, .8), transparent 70%), radial-gradient(30vmax 24vmax at 4% 90%, rgba(255, 205, 242, .18), transparent 70%); }
.rh-pq { display: grid; gap: 20px 48px; align-items: center; margin-bottom: clamp(20px, 3vw, 34px); }
@media (min-width: 900px) { .rh-pq--visual { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); } }
.rh-pq-copy .u-head { margin-bottom: 20px; }
.rh-pq-art { margin: 0; }
.rh-pq-art img { display: block; width: 100%; height: auto; aspect-ratio: 5 / 4; object-fit: cover; object-position: 50% 40%; border-radius: 28px; box-shadow: var(--studio-shadow); }
@media (max-width: 899px) { .rh-pq-art img { aspect-ratio: 16 / 10; } }
.rh-pq-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) { .rh-pq-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .rh-pq-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.rh-pq-grid li { display: grid; gap: 6px; align-content: start; padding: 18px 18px 20px; border-radius: 22px; background: rgba(255, 255, 255, .86); border: 1px solid var(--rh-line); }
.rh-pq-viz { width: 120px; height: 56px; margin-bottom: 4px; overflow: visible; }
.rh-pq-viz .v-line { fill: none; stroke: var(--rh-teal); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.rh-pq-viz .v-soft { stroke: color-mix(in srgb, var(--rh-teal) 35%, transparent); }
.rh-pq-viz .v-fill { fill: color-mix(in srgb, var(--rh-teal) 72%, #fff); stroke: none; }
.rh-pq-viz .v-fill.v-alt { fill: #EFA3D1; }
.rh-pq-grid b { color: var(--ink); font-size: 1.04rem; }
.rh-pq-grid span { font-size: .9rem; line-height: 1.55; color: var(--u-muted); }
.rh-pq-note { margin: 14px 0 0; font-size: .8rem; color: var(--u-muted); }

/* Partenariat : composition conservée (appréciée par RIHMA) ; lumière jaune remplacée par le champagne */
.rh-duo { box-shadow: 0 50px 100px -60px rgba(14, 63, 69, .75), 0 0 0 1px rgba(255, 255, 255, .6), 0 0 0 8px color-mix(in srgb, var(--champagne) 55%, transparent); }
.rh-duo-copy { background: radial-gradient(70% 90% at 100% 0%, rgba(255, 205, 242, .45), transparent 60%), radial-gradient(60% 80% at 0% 100%, rgba(2, 127, 129, .1), transparent 60%),
    linear-gradient(160deg, #FFFDF9 0%, #F8F1E6 60%, #F1E5D2 100%); }
.rh-duo-fusion { background: radial-gradient(circle, rgba(255, 255, 255, .7) 0 5%, rgba(255, 240, 190, .45) 18%, rgba(47, 198, 196, .22) 38%, transparent 64%); animation: none; }
.rh-duo-rh { background: radial-gradient(circle at 32% 26%, #FFFEF8, #F4E8D2 74%); box-shadow: 0 0 0 2px #fff, 0 0 0 10px rgba(237, 228, 215, .45), 0 24px 40px -22px rgba(60, 44, 24, .5); }
.rh-duo-x { box-shadow: 0 0 18px 4px rgba(255, 240, 190, .7), 0 0 0 1px rgba(232, 200, 119, .8); }
.rh-tag--duo { box-shadow: 0 0 0 1px rgba(201, 162, 75, .45); }
.rh-tag--duo::before { background: #E8C877; box-shadow: none; }

/* Restitution et projet : reflets jaunes adoucis */
.rh-res-main::before { opacity: .35; }
.rh-proj-sum { box-shadow: 0 0 0 1px var(--rh-line), var(--studio-shadow); }