/* =====================================================
   BERONYX — THEME "DARK VOID"
   Charte : noir absolu, bleu électrique, vert néon, Inter
   Chargé en DERNIER sur chaque page pour surcharger
   proprement style.css / hero.css / modern.css / etc.
===================================================== */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700&display=swap');

:root{
  --primary-blue:#0055FF;
  --sky-blue:#0055FF;
  --sky-blue-light:#00E5A3;
  --secondary-orange:#0055FF;
  --light-gray:#050505;
  --dark-text:#ffffff;
  --shadow:none;
  --shadow-3d:none;
  --bx-void:#000000;
  --bx-card:#050505;
  --bx-text:#ffffff;
  --bx-muted:#9a9a9a;
  --bx-muted2:#bdbdbd;
  --bx-blue:#0055FF;
  --bx-green:#00E5A3;
}

html,body{background:var(--bx-void) !important;}
body{
  font-family:'Inter',ui-sans-serif,system-ui,-apple-system,sans-serif !important;
  color:var(--bx-text) !important;
  font-weight:200;
}
h1,h2,h3,h4,h5{font-weight:400; letter-spacing:-0.02em;}
::selection{background:var(--bx-blue); color:#fff;}
a{ -webkit-tap-highlight-color:transparent; }

/* ---- HEADER / NAV ---- */
header{
  background:rgba(0,0,0,.85) !important;
  backdrop-filter:blur(14px);
  box-shadow:none !important;
}
.floating-logo{
  background:transparent !important;
  box-shadow:none !important;
  filter:none !important;
  width:150px !important; height:56px !important;
  border-radius:0 !important;
  justify-content:flex-start !important;
}
.header-container::before{ width:150px !important; }
.header-phone-cta{
  background:transparent !important;
  border:1px solid rgba(255,255,255,.25);
  box-shadow:none !important;
  color:#fff !important;
}
.header-phone-cta:hover{ border-color:var(--bx-green); color:var(--bx-green) !important; }
.nav-menu a{ color:var(--bx-muted2) !important; font-size:14px; text-transform:uppercase; letter-spacing:.06em; font-weight:600 !important; }
.nav-menu a:hover, .nav-menu a.active{ color:#fff !important; }
.nav-menu a:after{ background:var(--bx-blue) !important; }
.nav-menu li a[href="devis-en-ligne.php"]{
  background:var(--bx-blue) !important;
  border-radius:999px !important;
}
.nav-menu li a[href="devis-en-ligne.php"]:hover{ background:#1a66ff !important; }
.hamburger span{ background:#fff !important; }
.menu-burger{ background:rgba(0,0,0,.97) !important; }
.menu-burger a{ font-weight:400 !important; }
.menu-burger a:hover{ color:var(--bx-green) !important; }

/* ---- BUTTONS ---- */
.btn{ border-radius:999px !important; box-shadow:none !important; font-weight:600; }
.btn-primary{ background:var(--bx-blue) !important; }
.btn-primary:hover{ background:#1a66ff !important; box-shadow:0 8px 26px rgba(0,85,255,.4) !important; }
.btn-secondary{ background:transparent !important; border:1px solid rgba(255,255,255,.3) !important; color:#fff !important; }
.btn-secondary:hover{ border-color:var(--bx-green) !important; color:var(--bx-green) !important; background:transparent !important; }

/* ---- GENERIC SECTIONS ---- */
section h2, .section-title{ color:#fff !important; font-weight:400 !important; letter-spacing:-0.02em; }

/* ---- SERVICES / PRICING / SUBSCRIPTIONS (shared classes) ---- */
.services, .pricing, .subscriptions{ background:var(--bx-void) !important; }
.service-card, .pricing-card, .sub-card{
  background:var(--bx-card) !important;
  border:1px solid rgba(255,255,255,.08) !important;
  box-shadow:none !important;
  border-radius:20px !important;
}
.service-card:hover, .sub-card:hover{ transform:translateY(-8px); border-color:rgba(0,85,255,.4) !important; }
.pricing-card.featured{ border-color:var(--bx-green) !important; box-shadow:none !important; }
.pricing-card:hover{ box-shadow:none !important; border-color:rgba(0,85,255,.4) !important; }
.service-card h3, .pricing-card h3, .sub-card h4{ color:#fff !important; }
.service-card p, .pricing-card p, .sub-card p, .pricing-card li, .description{ color:var(--bx-muted) !important; }
.price, .pricing-card .price{ color:var(--bx-green) !important; }
.badge{ background:var(--bx-blue) !important; border-radius:999px !important; }
.pricing-card li{ border-bottom:1px solid rgba(255,255,255,.08) !important; }

/* ---- HERO (fallback if hero.css classes still used) ---- */
.hero{ background:var(--bx-void) !important; }
.hero::before,.hero::after{ display:none; }
.hero-title{
  background:none !important;
  -webkit-text-fill-color:#fff !important;
  color:#fff !important;
}
.hero-subtitle{ color:var(--bx-muted2) !important; font-weight:200; }
.hero-buttons .btn{ box-shadow:none !important; }

/* ---- FOOTER ---- */
footer{ background:var(--bx-void) !important; color:var(--bx-muted2) !important; border-top:1px solid rgba(255,255,255,.08); }
.footer-brand-name{ color:#fff !important; font-weight:500 !important; }
.footer-brand-name i{ color:var(--bx-blue) !important; }
.footer-col a{ color:var(--bx-muted) !important; }
.footer-col a:hover{ color:#fff !important; }
.footer-col a i{ color:var(--bx-blue) !important; }
.footer-cta-link{ color:var(--bx-green) !important; }
.footer-bottom{ border-top-color:rgba(255,255,255,.08) !important; }
.footer-bottom p, .footer-legal-links a{ color:var(--bx-muted) !important; }
.footer-legal-links a:hover{ color:var(--bx-green) !important; }

/* ---- SCROLL REVEAL UTILITY (opt-in via class="bx-reveal") ---- */
.bx-reveal{ opacity:0; transform:translateY(26px); filter:blur(6px); transition:opacity .9s ease, transform .9s ease, filter .9s ease; }
.bx-reveal.bx-in{ opacity:1; transform:translateY(0); filter:blur(0); }

@media (max-width:900px){
  .floating-logo{ width:120px !important; }
}

/* BerOnyx — hiérarchie typographique plus légère */
body { font-size: 16px; line-height: 1.65; }
.bx-hero h1 { font-size: clamp(2.2rem, 4.4vw, 3.8rem); line-height: 1.08; }
.bx-sec h2, .bx-cta h2 { font-size: clamp(1.65rem, 3vw, 2.4rem); line-height: 1.18; }
.bx-item h3, .bx-work h3 { font-size: 1.2rem; line-height: 1.3; }
.bx-item p, .bx-hero-sub, .bx-app-text p, .bx-faq p { font-size: .98rem; line-height: 1.7; }
.bx-eyebrow, .bx-tags, .bx-pill, .bx-pill-ghost { font-size: .82rem; }
@media (max-width: 700px) { body { font-size: 15px; } .bx-hero h1 { font-size: clamp(2rem, 8vw, 2.65rem); } .bx-sec h2, .bx-cta h2 { font-size: clamp(1.5rem, 6vw, 1.9rem); } }


/* Ajustement typographique global : titres et textes moins imposants */
html { font-size: 16px; }
body { font-size: 15px !important; line-height: 1.65; }
p, li { font-size: 0.96rem; }
h1 { font-size: clamp(2rem, 4.5vw, 3rem) !important; line-height: 1.12; }
h2 { font-size: clamp(1.55rem, 3.3vw, 2.15rem) !important; line-height: 1.2; }
h3 { font-size: clamp(1.15rem, 2.4vw, 1.45rem) !important; line-height: 1.3; }
h4, h5, h6 { font-size: 1.05rem !important; line-height: 1.35; }
nav a, button, .btn, .cta-button { min-height: 44px; }
