/* ==========================================================================
   Rotter'Dev — V1.1 « harmonie » : le style du nouvel accueil appliqué aux autres pages.
   S'ajoute par-dessus theme.css, seulement sur <body class="v11">.
   Même famille de couleurs que l'accueil : nuit → prune → rose → blush ; or en filets seulement.
   ========================================================================== */
.v11 {
  --a-prune: #3A0830;
  --a-prune-2: #1C0718;
  --a-blush: #FFB3E6;
  --a-or-clair: #E9D3A6;
  --a-degrade: linear-gradient(100deg, #FFB3E6 0%, #FF2EBE 45%, #E9D3A6 100%);
  --a-trait: rgba(255,179,230,.14);
}

/* ---------- En-tête en verre ---------- */
.v11 .entete { background: rgba(11,11,13,.55); backdrop-filter: blur(18px) saturate(1.4); -webkit-backdrop-filter: blur(18px) saturate(1.4); border-bottom-color: rgba(255,179,230,.08); }

/* ---------- Lueur qui suit la souris ---------- */
.v11 .curseur-lueur { position: fixed; left: 0; top: 0; width: 520px; height: 520px; margin: -260px 0 0 -260px; border-radius: 50%; pointer-events: none; z-index: 1; background: radial-gradient(closest-side, rgba(255,46,190,.14), transparent 70%); mix-blend-mode: screen; opacity: 0; transition: opacity .6s; }
@media (hover: hover) { .v11:hover .curseur-lueur { opacity: 1; } }

/* ---------- Typo : titres pleins et serrés comme l'accueil ---------- */
.v11 h1, .v11 h2 { font-weight: 600 !important; letter-spacing: -.04em; line-height: 1.02; }
.v11 h3 { font-weight: 600; letter-spacing: -.02em; }
.v11 h1 .texte-gris, .v11 h2 .texte-gris { color: rgba(245,245,247,.42); }
.v11 .sur-titre { color: var(--a-blush); }
.v11 .texte-degrade { background: var(--a-degrade); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* ---------- En-tête de page : le décor du héros en plus calme ---------- */
.v11 .page-tete { background:
    radial-gradient(70% 90% at 85% 0%, rgba(122,15,94,.75), transparent 60%),
    radial-gradient(40% 60% at 100% 30%, rgba(255,46,190,.28), transparent 70%),
    linear-gradient(180deg, transparent 70%, var(--noir) 100%); }
.v11 .page-tete::before { display: none; }
.v11 .page-tete::after { content: ""; position: absolute; inset: -50%; z-index: -1; pointer-events: none; opacity: .06; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.v11 .page-tete h1 { font-size: clamp(2.4rem, 5.6vw, 4.8rem); max-width: 15ch; }
.v11 .page-tete-image h1 { font-size: clamp(2.2rem, 4.4vw, 3.9rem); }
.v11 .page-tete .chapo { color: rgba(245,245,247,.75); }
.v11 .page-tete-image figure { border-radius: 28px; border-color: rgba(255,179,230,.18); box-shadow: 0 40px 80px -30px rgba(255,46,190,.45); }

/* ---------- Boutons ---------- */
.v11 .btn { --h: 56px; padding: 0 28px; }
.v11 .btn-petit { --h: 42px; padding: 0 20px; }
.v11 .btn-principal { position: relative; overflow: hidden; background: linear-gradient(180deg, #F02BB4, #C8128F); box-shadow: 0 0 0 1px rgba(255,179,230,.55) inset, 0 14px 44px -6px rgba(255,46,190,.6); animation: none; }
.v11 .btn-principal::after { content: ""; position: absolute; inset: 0; background: linear-gradient(105deg, transparent 35%, rgba(255,255,255,.35) 50%, transparent 65%) -200% 0 / 250% 100% no-repeat; animation: v11-balaye 4.5s ease-in-out infinite; pointer-events: none; }
.v11 .btn-principal:hover { box-shadow: 0 0 0 1px rgba(255,220,245,.9) inset, 0 18px 60px -6px rgba(255,46,190,.85); }
.v11 .btn-secondaire { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.18); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.v11 .btn-secondaire:hover { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.4); }
.v11 .btn[disabled], .v11 .btn.desactive { background: #1C1C20; box-shadow: none; }
.v11 .btn[disabled]::after, .v11 .btn.desactive::after { display: none; }
@keyframes v11-balaye { 0%, 60% { background-position: -200% 0; } 100% { background-position: 200% 0; } }

/* ---------- Cartes : verre + projecteur sous la souris ---------- */
.v11 .carte { border-radius: 28px; border-color: rgba(255,255,255,.08); background-color: transparent; background-image: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.015)); }
.v11 .carte.carte-alu.carte-photo, .v11 .carte.carte-satin.carte-photo, .v11 .carte.carte-filet-or { background-image: radial-gradient(90% 70% at 100% 100%, rgba(255,46,190,.2), transparent 60%), linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015)); }
.v11 .carte::before { inset: 0; width: auto; height: auto; right: auto; bottom: auto; border: 0; border-radius: inherit; -webkit-mask: none; mask: none; z-index: 0; background: radial-gradient(420px circle at var(--x, 50%) var(--y, -30%), rgba(255,46,190,.14), transparent 60%); opacity: 0; transition: opacity .4s; }
.v11 .carte::after { inset: 0; padding: 1px; border-radius: inherit; background: radial-gradient(300px circle at var(--x, 50%) var(--y, -30%), rgba(255,179,230,.9), transparent 60%); -webkit-mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0); mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0); opacity: 0; transition: opacity .4s; }
.v11 .carte:hover::before, .v11 .carte:hover::after { opacity: 1; }
.v11 .carte > * { position: relative; z-index: 1; }
.v11 .site-carte > .badges { position: absolute; z-index: 2; } /* badge « Admin inclus » en haut à droite, au-dessus de la capture */
.v11 a.carte:hover, .v11 .carte.interactive:hover { transform: translateY(-6px); }

/* ---------- Icônes, étapes, filets ---------- */
.v11 .icone { border-radius: 16px; background: linear-gradient(180deg, rgba(122,15,94,.45), rgba(28,7,24,.9)); border-color: rgba(255,179,230,.22); }
.v11 .etape::before { color: var(--a-or-clair); }
.v11 .etape::after { width: 100%; background: linear-gradient(90deg, var(--or), var(--rose) 60%, transparent); box-shadow: 0 0 10px rgba(255,46,190,.4); }
.v11 .badge, .v11 .tag, .v11 .filtre { border-radius: 999px; }
.v11 .filtre[aria-pressed="true"], .v11 .filtre.actif { box-shadow: 0 0 0 1px rgba(255,179,230,.6) inset, 0 6px 24px -6px rgba(255,46,190,.6); }

/* ---------- Formulaires ---------- */
.v11 .champ input, .v11 .champ textarea, .v11 .champ select { border-radius: 16px; background: rgba(255,255,255,.04); }
.v11 .champ input:focus, .v11 .champ textarea:focus, .v11 .champ select:focus { border-color: rgba(255,179,230,.6); box-shadow: 0 0 0 4px rgba(255,46,190,.18); }
.v11 .choix { border-radius: 20px; }

/* ---------- Pied de page : l'arc de lumière de l'appel final ---------- */
.v11 .pied { position: relative; overflow: hidden; isolation: isolate; border-top: 0; }
.v11 .pied::before { content: ""; position: absolute; left: 50%; top: 0; width: 140vw; height: 70vw; translate: -50% -2px; border-radius: 50%; border-top: 1px solid rgba(255,179,230,.45); box-shadow: 0 -10px 60px rgba(255,46,190,.25); z-index: -1; pointer-events: none; }
.v11 .pied::after { content: ""; position: absolute; inset: 0; z-index: -2; background: radial-gradient(60% 50% at 50% 0%, rgba(122,15,94,.35), transparent 70%); pointer-events: none; }

/* ---------- 404 et connexion : le R en 3D quand il est prêt ---------- */
.v11 .r3d-toile { position: absolute; inset: -18%; width: 136%; height: 136%; display: block; }
.v11 .hero-objet.r3d-pret .r, .v11 .hero-objet.r3d-pret .reflet { visibility: hidden; }

@media (prefers-reduced-motion: reduce) {
  .v11 .btn-principal::after { animation: none; }
}
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }

/* Navigation hybride fixe : on laisse sa place en haut des pages */
.v11 > main, .v11 #contenu { padding-top: calc(var(--nh-ruban, 34px) + var(--nh-h, 60px)); }
.v11 .curseur-lueur { z-index: 1; }

/* Site codé (2026-11-07) : les pages de l'espace client ont un padding-top écrit dans le gabarit (56 / 48 px),
   qui écrasait la place laissée à la navigation fixe : le titre passait dessous. On ajoute cette place. */
.v11 > main.section[style] { padding-top: calc(var(--nh-ruban, 34px) + var(--nh-h, 60px) + 48px) !important; }

/* Correctif défilement (2026-11-08) : theme.css met « scroll-behavior: smooth » sur <html> ; avec Lenis, le navigateur
   rejouait chaque petit pas de défilement en douceur → page qui « colle » en haut et défilement saccadé. */
html.lenis, html.lenis body { scroll-behavior: auto !important; }
/* Liens vers une ancre (#prix, #fonctions…) : le titre s'arrête sous la barre de navigation fixe, pas dessous. */
[id] { scroll-margin-top: calc(var(--nh-ruban, 34px) + var(--nh-h, 60px) + 24px); }