/* ============================================================
   RPM — site vitrine rpm.rentability.fr — RELOOK v2 (27/10/2026)
   Feuille posée PAR-DESSUS le build Bolt (aucune source) :
   Inter auto-hébergée, fond noir, cyan → violet de la marque,
   typo géante, hero sans vidéo ni bandeau, cartes sobres, bouton blanc.
   Retour arrière = retirer cette feuille.
   ============================================================ */
:root{
  --rk-bg:#07080d; --rk-bg-2:#0a0c13; --rk-bg-3:#0d1019;
  --rk-text:#f3f4f8; --rk-muted:rgba(255,255,255,.62);
  --rk-line:rgba(255,255,255,.08);
  --rk-cyan:#4ecaff; --rk-violet:#8b5cf6;
  --grid-color:transparent;
  --glow-cyan:rgba(78,202,255,.10); --glow-violet:rgba(139,92,246,.10); --glow-magenta:rgba(139,92,246,.10);
}
html{background:var(--rk-bg)!important}
body{background:var(--rk-bg)!important;color:var(--rk-text);font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;font-feature-settings:"cv11","ss01";text-rendering:optimizeLegibility}
::selection{background:rgba(78,202,255,.35)}
:focus-visible{outline:2px solid var(--rk-cyan);outline-offset:3px}

/* ---- fonds : la palette bleu nuit devient noir ---- */
[class*="bg-[#151828]"]{background-color:var(--rk-bg)!important}
[class*="bg-[#1a1e35]"]{background-color:var(--rk-bg-2)!important}
[class*="bg-[#1e2240]"]{background-color:var(--rk-bg-3)!important}
[class*="bg-[#0d0e1a]"]{background-color:#050609!important}
[class*="bg-[#151828]/"]{background-color:rgba(7,8,13,.92)!important}
.grid-bg{background-image:none!important}
.scanline-overlay,.stream-line,.section-dot{display:none!important}

/* ---- rythme vertical ---- */
@media(min-width:1024px){section.py-20{padding-top:8rem;padding-bottom:8rem}}
@media(max-width:639px){section.py-20{padding-top:4.5rem;padding-bottom:4.5rem}}

/* ---- en-tête ---- */
header.fixed{background:rgba(7,8,13,.62);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.05)}
header.fixed .h-24{height:5rem}
@media(min-width:1024px){header.fixed .lg\:h-28{height:5.5rem}}
header img{height:30px!important;width:auto!important}
header nav button{font-size:12.5px;letter-spacing:.03em;color:rgba(255,255,255,.72);font-weight:500;text-transform:none}
header nav button:hover{color:#fff}
header nav button.text-cyan-400\/70{color:var(--rk-cyan)}
header nav button>span[style]{display:none}
header button.bg-magenta-500{font-size:12px;padding:.65rem 1.15rem;letter-spacing:0}

/* ---- boutons ---- */
button.bg-magenta-500,a.bg-magenta-500{background:#fff!important;color:#0b0d14!important;border-radius:999px!important;box-shadow:0 1px 2px rgba(0,0,0,.25)!important;font-weight:700;letter-spacing:0}
button.bg-magenta-500:hover,a.bg-magenta-500:hover,.hover\:bg-magenta-400:hover{background:#e9ecf5!important}
button.bg-magenta-500 svg{color:#0b0d14}
button[style*="rgb(109, 77, 230)"]{background:#fff!important;color:#0b0d14!important;border-radius:999px!important;box-shadow:0 1px 2px rgba(0,0,0,.25)!important}
button[style*="rgb(109, 77, 230)"] svg{color:#0b0d14}
button[style*="box-shadow"]{box-shadow:0 1px 2px rgba(0,0,0,.25)!important}
button.bg-white\/\[0\.06\].border{border-radius:999px!important;border-color:rgba(78,202,255,.35)!important;background:rgba(78,202,255,.06)!important;color:#fff!important}
button.bg-white\/\[0\.06\].border:hover{background:rgba(78,202,255,.12)!important;border-color:rgba(78,202,255,.6)!important}
.flex.items-center.justify-between{gap:.75rem}

/* ---- hero ---- */
#root>div>section.min-h-screen:first-of-type{background:var(--rk-bg)!important}
#root>div>section.min-h-screen:first-of-type>div.absolute.inset-0.z-0{background:
  radial-gradient(60% 55% at 76% 42%,rgba(78,202,255,.14),transparent 62%),
  radial-gradient(50% 45% at 18% 92%,rgba(139,92,246,.20),transparent 62%),
  radial-gradient(90% 50% at 50% 115%,rgba(139,92,246,.10),transparent 60%)}
#root>div>section.min-h-screen:first-of-type>div.absolute.inset-0.z-0>*{display:none!important}
#root>div>section.min-h-screen:first-of-type>div.absolute.inset-0.z-0::after{content:none!important}
#root>div>section.min-h-screen:first-of-type::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;z-index:3;pointer-events:none;background:linear-gradient(90deg,transparent 5%,rgba(78,202,255,.6) 40%,rgba(139,92,246,.7) 65%,transparent 95%)}
#root>div>section.min-h-screen:first-of-type>div.relative.z-\[2\]:not(.flex-1){display:none!important}
#root>div>section.min-h-screen:first-of-type>button.absolute.bottom-20{display:none!important}
@media(min-width:1024px){#root>div>section.min-h-screen:first-of-type .grid.lg\:grid-cols-2{grid-template-columns:1.15fr .85fr;gap:4rem}}
#root>div>section.min-h-screen:first-of-type .grid>div:first-child>div:first-child{display:none!important}
#root>div>section.min-h-screen:first-of-type h1{font-size:clamp(2.6rem,5.6vw,5.1rem)!important;line-height:.98!important;letter-spacing:-.035em!important;font-weight:800;margin-bottom:1.6rem}
#root>div>section.min-h-screen:first-of-type h1 span.inline-block{background-image:linear-gradient(90deg,var(--rk-cyan),var(--rk-violet))!important}
#root>div>section.min-h-screen:first-of-type h1 span.text-white\/75{color:rgba(255,255,255,.5)}
#root>div>section.min-h-screen:first-of-type .max-w-lg p:first-child{font-size:1.1rem!important;color:var(--rk-muted);line-height:1.55;max-width:30rem}
#root>div>section.min-h-screen:first-of-type .max-w-lg p:last-child{font-size:1.3rem!important;background-image:linear-gradient(90deg,var(--rk-cyan),var(--rk-violet))!important}
#root>div>section.min-h-screen:first-of-type .grid-cols-3{background:transparent!important;border:0!important;border-top:1px solid var(--rk-line)!important;border-radius:0!important;max-width:34rem;padding-top:.25rem}
#root>div>section.min-h-screen:first-of-type .grid-cols-3>div{border-right:1px solid var(--rk-line)!important;padding-left:0;padding-right:1.25rem}
#root>div>section.min-h-screen:first-of-type .grid-cols-3>div+div{padding-left:1.25rem}
#root>div>section.min-h-screen:first-of-type .grid-cols-3>div:last-child{border-right:0!important}
#root>div>section.min-h-screen:first-of-type .grid-cols-3>div>div:first-child{display:none}
#root>div>section.min-h-screen:first-of-type .grid-cols-3 p.text-base{font-size:1.35rem}
#root>div>section.min-h-screen:first-of-type .grid-cols-3 p.text-\[9px\]{font-size:11.5px;color:rgba(255,255,255,.5)}
#root>div>section.min-h-screen:first-of-type .grid>div.order-first{order:2!important}
@media(max-width:1023px){
  #root>div>section.min-h-screen:first-of-type .grid{gap:1.25rem}
  #root>div>section.min-h-screen:first-of-type .grid>div.order-first{margin-top:.25rem}
  #root>div>section.min-h-screen:first-of-type canvas{max-width:170px!important}
  #root>div>section.min-h-screen:first-of-type .grid-cols-3{display:none!important}
}
@media(max-width:639px){
  #root>div>section.min-h-screen:first-of-type h1{font-size:2.5rem!important;margin-bottom:1.1rem}
  #root>div>section.min-h-screen:first-of-type .max-w-lg{margin-bottom:1.5rem!important}
  #root>div>section.min-h-screen:first-of-type .max-w-lg p:first-child{font-size:1rem!important}
  #root>div>section.min-h-screen:first-of-type .max-w-lg p:last-child{font-size:1.15rem!important}
  #root>div>section.min-h-screen:first-of-type .flex.flex-col.sm\:flex-row{margin-bottom:1rem!important}
  #root>div>section.min-h-screen:first-of-type>div.flex-1{padding-top:6rem!important}
  header.fixed .h-24{height:4.25rem}
}

/* ---- titres et accroches ---- */
h2{letter-spacing:-.03em!important;line-height:1.02!important;font-weight:800!important}
h2.lg\:text-7xl{font-size:clamp(2.4rem,5vw,4.6rem)!important}
h2.lg\:text-6xl{font-size:clamp(2.2rem,4.4vw,3.9rem)!important}
h2.lg\:text-5xl{font-size:clamp(2rem,3.8vw,3.3rem)!important}
h2 span.inline-block,h2 span[style*="text"]{background-image:linear-gradient(90deg,var(--rk-cyan),var(--rk-violet))!important}
p.text-magenta-500.uppercase{color:var(--rk-cyan)!important;font-size:12px!important;letter-spacing:.2em}
h3{letter-spacing:-.015em}

/* ---- rose (vue Tarification, pastilles, étapes) → violet ---- */
.text-rose-400{color:#b8a7ff!important}
.bg-rose-400{background-color:var(--rk-violet)!important}
.border-rose-400\/30{border-color:rgba(139,92,246,.35)!important}
.bg-rose-400\/\[0\.1\]{background-color:rgba(139,92,246,.12)!important}
.tabular-nums{white-space:nowrap}
@media(min-width:1280px){header nav button{white-space:nowrap}}

/* ---- cartes ---- */
.glass-card{background:rgba(255,255,255,.035)!important;border:1px solid var(--rk-line)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.glass-card:hover,.glow-card-cyan:hover,.glow-card-magenta:hover{box-shadow:none!important;border-color:rgba(255,255,255,.16)!important}
.rounded-2xl{border-radius:1.25rem}
.rounded-3xl{border-radius:1.6rem}
footer{border-top-color:rgba(255,255,255,.06)!important}

/* ---- formulaires (iPhone : pas de zoom) ---- */
@media(max-width:639px){input,select,textarea{font-size:16px!important}}

/* ============================================================
   PASSE 2 (27/10) — monter d'un cran
   ============================================================ */

/* ---- en-tête : menu lisible, une seule ligne ---- */
header nav button{font-size:13px!important;letter-spacing:0!important;white-space:nowrap;font-weight:500!important}
header button.tracking-wider{font-size:13px!important;letter-spacing:0!important;white-space:nowrap;color:rgba(255,255,255,.72)!important}
header button.tracking-wider:hover{color:#fff!important}
header button.bg-magenta-500{white-space:nowrap;font-size:13px!important}
@media(max-width:1279px){header nav button{padding-left:.6rem!important;padding-right:.6rem!important}}
@media(max-width:1180px){header button.tracking-wider{display:none!important}}

/* ---- menu téléphone : de grandes lignes, faciles au pouce ---- */
div.fixed.md\:hidden{min-height:calc(100dvh - 5rem)}
div.fixed.md\:hidden button.text-left{font-size:22px!important;font-weight:600!important;letter-spacing:-.01em!important;color:rgba(255,255,255,.88)!important;padding:.85rem .5rem!important;border-radius:0!important;border-bottom:1px solid rgba(255,255,255,.06)}
div.fixed.md\:hidden button.text-left.text-cyan-400\/70,div.fixed.md\:hidden button.text-left[class*="cyan"]{color:var(--rk-cyan)!important}
div.fixed.md\:hidden button.bg-magenta-500{font-size:16px!important;padding:1rem!important;margin-top:.75rem}

/* ---- plus aucun texte sous 12 px ---- */
.text-\[9px\],.text-\[10px\],.text-\[11px\]{font-size:12px!important}
.font-mono.text-\[10px\],.font-mono.text-\[11px\]{letter-spacing:.02em!important}

/* ---- pages Tarification et Marché VO : même noir, mêmes accents ---- */
.min-h-screen.bg-\[\#151828\]{background-color:var(--rk-bg)!important}
.text-cyan-400{color:var(--rk-cyan)!important}
.border-cyan-400\/30{border-color:rgba(78,202,255,.3)!important}
.bg-cyan-400\/5{background-color:rgba(78,202,255,.06)!important}

/* ---- pied de page : les chiffres en grand, sans cadres ---- */
footer .glow-card-cyan{background:none!important;border:0!important;box-shadow:none!important;border-radius:0!important;padding:.5rem 1rem!important}
footer .glow-card-cyan::before,footer .glow-card-cyan::after{display:none!important}
footer .glow-card-cyan>*:not(.relative){display:none!important}
footer .glow-card-cyan span[style]{background:none!important;-webkit-text-fill-color:#fff!important;color:#fff!important;font-size:clamp(2.6rem,4.6vw,4.2rem)!important;letter-spacing:-.045em;line-height:1!important;padding-bottom:0!important;margin-bottom:.7rem!important}
footer .glow-card-cyan span:not([style]){color:rgba(255,255,255,.5)!important;font-size:14px!important;max-width:15rem;margin:0 auto}
footer .glow-card-cyan span[style]{white-space:nowrap}
@media(max-width:639px){footer .glow-card-cyan span[style]{font-size:2.15rem!important}footer .glow-card-cyan{padding:.5rem .25rem!important}}
div.fixed.md\:hidden button.text-left:last-of-type{border-bottom:0}
@media(min-width:1024px){footer .glow-card-cyan+.glow-card-cyan,footer .grid>div+div>.glow-card-cyan{border-left:1px solid var(--rk-line)!important}}
footer>div.absolute{display:none!important}

/* ---- pied de page : le logo RPM géant, en gris très sombre, comme une signature ---- */
footer::after{content:"";display:block;max-width:1280px;margin:0 auto;height:clamp(64px,14.5vw,200px);
  background:url(/rpm-logo-footer.png) center 85%/92% auto no-repeat;opacity:.07;filter:grayscale(1)}
@media(max-width:639px){footer::after{background-size:100% auto;height:64px;margin:0 1rem}}

@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
