/* Styles communs du site robbsecco.com : fenêtres « Réserver » et « Espace client » (liquid glass, maquettes validées),
   boutons de la navigation, accessibilité. Le style propre à chaque page est dans pages/<page>.css. */
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
img{max-width:100%}
.rs-bouton{cursor:pointer;font:inherit;color:#F5F2EF;background:transparent;border:0}
.rs-cache{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
[hidden]{display:none !important}
@media (max-width: 760px){.bouton-espace-mobile{display:inline-flex !important}}

.rs-voile{position:fixed;inset:0;z-index:100;background:rgba(4,6,8,0.42);display:flex;align-items:center;justify-content:center;padding:16px;font-family:Inter,system-ui,sans-serif;color:#fff}
.lg{position:relative;isolation:isolate;background:linear-gradient(160deg,rgba(255,255,255,0.22) 0%,rgba(255,255,255,0.07) 38%,rgba(255,255,255,0.03) 62%,rgba(255,255,255,0.12) 100%),rgba(14,18,20,0.35);-webkit-backdrop-filter:blur(30px) saturate(190%) brightness(1.06);backdrop-filter:blur(30px) saturate(190%) brightness(1.06);box-shadow:inset 0 1px 0 rgba(255,255,255,0.6),inset 0 -1px 0 rgba(255,255,255,0.14),inset 1px 0 0 rgba(255,255,255,0.2),inset -1px 0 0 rgba(255,255,255,0.08),inset 0 0 30px rgba(255,255,255,0.07),0 30px 70px rgba(0,0,0,0.38);text-shadow:0 1px 2px rgba(0,0,0,0.3)}
.lg::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.3px;background:linear-gradient(135deg,rgba(255,255,255,0.85),rgba(255,255,255,0.1) 32%,rgba(255,255,255,0) 55%,rgba(255,255,255,0.4) 100%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.lg::after{content:"";position:absolute;left:0;right:0;top:0;height:55%;border-radius:inherit;background:radial-gradient(90% 100% at 22% 0%,rgba(255,255,255,0.2),rgba(255,255,255,0) 60%);pointer-events:none;z-index:-1}
.rs-carte{width:100%;max-width:540px;max-height:calc(100vh - 32px);overflow:auto;box-sizing:border-box;border-radius:34px;padding:28px;display:flex;flex-direction:column;gap:16px}
.rs-entete{display:flex;justify-content:space-between;align-items:center;gap:12px}
.rs-entete h2,.rs-merci-titre{margin:0;font-family:Epilogue,sans-serif;font-weight:800;font-size:28px;letter-spacing:-0.03em}
.rs-fermer{width:44px;height:44px;border-radius:44px;border:0;color:#fff;font-size:20px;cursor:pointer;background:linear-gradient(180deg,rgba(255,255,255,0.28),rgba(255,255,255,0.08));box-shadow:inset 0 1px 0 rgba(255,255,255,0.7),inset 0 -1px 0 rgba(255,255,255,0.12),0 4px 12px rgba(0,0,0,0.2)}
.rs-form{display:flex;flex-direction:column;gap:14px}
.rs-form label{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:500;min-width:0}
.rs-form input[type=text],.rs-form input[type=email],.rs-form input[type=tel],.rs-form input[type=date],.rs-form input[type=password],.rs-form textarea{width:100%;min-width:0;background:rgba(0,0,0,0.22);border:0;border-radius:16px;color:#fff;padding:12px 16px;min-height:48px;box-sizing:border-box;font:inherit;box-shadow:inset 0 2px 5px rgba(0,0,0,0.35),inset 0 -1px 0 rgba(255,255,255,0.18);resize:vertical}
.rs-duo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
@media (max-width: 480px){.rs-duo{grid-template-columns:1fr}}
.rs-note{margin:0;color:rgba(255,255,255,0.85);font-size:14px}
.rs-mini{margin:0;font-size:13px;color:rgba(255,255,255,0.7);text-align:center}
.rs-puces{border:0;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.rs-puce{flex-direction:row !important;cursor:pointer}
.rs-puce input,.rs-segment input{position:absolute;opacity:0;pointer-events:none}
.rs-puce span{display:inline-flex;align-items:center;border-radius:40px;padding:9px 14px;min-height:40px;box-sizing:border-box;font-weight:600;font-size:14px;color:rgba(255,255,255,0.85);background:rgba(0,0,0,0.18);box-shadow:inset 0 1px 3px rgba(0,0,0,0.3),inset 0 -1px 0 rgba(255,255,255,0.14)}
.rs-puce input:checked+span,.rs-segment input:checked+span{color:#fff;background:linear-gradient(180deg,rgba(255,255,255,0.42),rgba(255,255,255,0.14));box-shadow:inset 0 1px 0 rgba(255,255,255,0.9),0 6px 16px rgba(0,0,0,0.25)}
.rs-puce input:focus-visible+span,.rs-segment input:focus-visible+span{outline:2px solid #fff;outline-offset:2px}
.rs-segment{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;border-radius:40px;background:rgba(0,0,0,0.16);box-shadow:inset 0 1px 3px rgba(0,0,0,0.3),inset 0 -1px 0 rgba(255,255,255,0.14)}
.rs-segment label{flex-direction:row !important;cursor:pointer}
.rs-segment span{display:flex;align-items:center;justify-content:center;width:100%;border-radius:40px;padding:10px;min-height:44px;box-sizing:border-box;font-weight:600;font-size:15px;color:rgba(255,255,255,0.78)}
.rs-case{flex-direction:row !important;align-items:flex-start;gap:10px !important;font-weight:400 !important;color:rgba(255,255,255,0.85)}
.rs-case input{width:20px;height:20px;margin:0;flex:none;accent-color:var(--accent)}
.rs-pot{position:absolute !important;left:-9999px;width:1px;height:1px;overflow:hidden}
.rs-erreur{margin:0;color:#FFB4A8;font-size:14px;font-weight:600}
.rs-bouton-plein{color:#1A0C05;border:0;border-radius:50px;padding:14px;font:600 16px Inter,sans-serif;min-height:48px;cursor:pointer;text-shadow:none;background:linear-gradient(180deg,rgba(255,255,255,0.45),rgba(255,255,255,0) 52%),var(--accent);box-shadow:inset 0 1px 0 rgba(255,255,255,0.85),inset 0 -3px 8px rgba(120,30,0,0.25),0 10px 28px rgba(0,0,0,0.3)}
.rs-bouton-plein[disabled]{opacity:.6;cursor:wait}
.rs-merci{display:flex;flex-direction:column;align-items:center;text-align:center;gap:16px;padding:8px 0}
.rs-ok{width:64px;height:64px;border-radius:64px;display:inline-flex;align-items:center;justify-content:center;font-size:30px;color:#1A0C05;background:linear-gradient(180deg,rgba(255,255,255,0.45),rgba(255,255,255,0) 52%),var(--accent)}
.rs-merci .rs-bouton-plein{width:100%}
.rs-admin{display:flex;flex-direction:column;gap:12px}
.rs-choix{text-decoration:none;padding:18px 20px;border-radius:22px;display:flex;justify-content:space-between;align-items:center;gap:12px;color:#fff}
.rs-choix strong{display:block;font-family:Epilogue,sans-serif;font-size:20px}
.rs-choix small{display:block;font-size:14px;color:rgba(255,255,255,0.8)}
@media (max-width: 760px){.rs-voile{align-items:flex-end;padding:0}.rs-carte{max-width:none;border-radius:30px 30px 0 0;max-height:92vh;padding:22px 20px 30px}}
button.onglet{font-size:11px;font-family:inherit}
/* Les images gardent leur proportion (aspect-ratio de la maquette) malgré les attributs width/height. */
img[height]{height:auto}
/* Halos : la lumière se déplace doucement au défilement (site.js règle --halo-x et --halo-y). */
.rs-halo{background-size:cover;background-position:var(--halo-x,50%) var(--halo-y,50%) !important}
/* … et dérive très lentement toute seule, même sans défiler (site.js, 4 novembre). */
@media (min-width: 761px){.rs-halo{background-attachment:fixed;background-size:max(130vw,208vh) auto}}
@media (prefers-reduced-motion: reduce){.rs-halo{background-attachment:scroll}}
/* Grain net par-dessus les halos (au-dessus du voile, sous le contenu). */
.rs-halo::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:url(/rs/assets/img/grain.png);background-size:256px 256px;opacity:.55;mix-blend-mode:overlay}
.rs-halo{position:relative;isolation:isolate}

/* Menus déroulants (Prestations, Underground, Menu du téléphone) : verre plus sombre, texte toujours lisible
   même au-dessus d'un grand titre (retour de Robin, 4 novembre). */
.panneau-bureau,.feuille-mobile{background:linear-gradient(160deg,rgba(255,255,255,.16),rgba(255,255,255,.03) 45%,rgba(255,255,255,.07)) padding-box,linear-gradient(rgba(11,15,17,.9),rgba(11,15,17,.9)) padding-box,linear-gradient(135deg,rgba(255,255,255,.6) 0%,rgba(255,255,255,.05) 22%,rgba(255,255,255,0) 50%,rgba(255,255,255,.28) 100%) border-box !important;-webkit-backdrop-filter:blur(36px) saturate(170%) !important;backdrop-filter:blur(36px) saturate(170%) !important}
.panneau-bureau a,.feuille-mobile a{transition:background .2s}
.panneau-bureau a:hover,.feuille-mobile a:hover{background:rgba(255,255,255,.08);color:#F5F2EF}

/* Grand titre à côté d'une photo : il ne touche jamais l'image (le mot le plus long tient dans sa colonne). */
.ouverture div:has(> figure) > div > h1.titre{font-size:clamp(40px,4.9vw,80px) !important}
@media (max-width: 760px){.ouverture div:has(> figure) > div > h1.titre{font-size:clamp(36px,10.5vw,58px) !important}}

/* Apparitions au défilement, sur toutes les pages (site.js ajoute rs-anime, puis « vu » quand le bloc arrive). */
.rs-anime .rs-apparait{opacity:0;transform:translateY(26px);transition:opacity .9s ease,transform 1s cubic-bezier(.2,.7,.2,1);transition-delay:var(--rs-delai,0ms)}
.rs-anime .rs-apparait.vu{opacity:1;transform:none}
.rs-anime img.rs-apparait{transform:translateY(26px) scale(1.03)}
.rs-anime img.rs-apparait.vu{transform:none}
a.verre,.carte{transition:transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .45s}
a.verre:hover,.carte:hover{transform:translateY(-4px)}
@media (prefers-reduced-motion: reduce){.rs-anime .rs-apparait,.rs-anime img.rs-apparait{opacity:1;transform:none;transition:none}a.verre:hover,.carte:hover{transform:none}}

/* Tablette et petit ordinateur (761 à 1100 px) : la capsule ne tient plus sur une ligne avec Galeries et Boutique,
   on passe à la barre d'onglets du téléphone (Menu donne accès à tout). */
@media (min-width: 761px) and (max-width: 1100px){
.nav-capsule,.panneau-bureau{display:none !important}
.barre-onglets{display:grid !important;max-width:620px;margin:0 auto}
.logo-mobile{display:block !important}
.bouton-espace-mobile{display:flex !important}
.feuille-mobile:not([hidden]){display:flex !important;max-width:600px;margin:0 auto}
}