/* =============================================================================
   Master IA — sector.css · feuille de styles partagée des pages sectorielles
   (/site-garage, /site-kine, /site-toiture, /site-restaurant, /site-coiffeur)
   Dérivée du canon /audit V21. © 2026 Master IA · BCE 1035.776.391
============================================================================= */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
:root {
  --void:#080A0E; --deep:#080B12; --surface:#0D1119; --surface2:#121820;
  --border:rgba(255,255,255,0.06); --border-hi:rgba(200,240,74,0.25);
  --white:#F2F0EC; --muted:#A8AFBE; --muted2:#BCC2CE;
  --acid:#C8F04A; --acid2:#4AF0C8; --acid-dim:#7DB82A;
  --f-display:'Syne',sans-serif; --f-mono:'DM Mono',monospace; --f-body:'Manrope',sans-serif;
  --grad:linear-gradient(135deg,#C8F04A,#4AF0C8); --ease:cubic-bezier(0.22,1,0.36,1);
}
body { background:var(--void); color:var(--white); font-family:var(--f-body); line-height:1.6; overflow-x:hidden; -webkit-font-smoothing:antialiased; }
::selection { background:var(--acid); color:var(--void); }
a { color:inherit; }
.grad-text { background:var(--grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; }
.skip-link { position:absolute; left:-999px; top:0; z-index:999; background:var(--acid); color:var(--void); padding:10px 18px; font-family:var(--f-mono); font-size:0.8rem; font-weight:600; }
.skip-link:focus { left:12px; top:12px; }

/* NAV */
nav { position:fixed; top:0; left:0; right:0; z-index:500; display:flex; align-items:center; justify-content:space-between; padding:16px 32px; background:rgba(8,10,14,0.72); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); border-bottom:1px solid var(--border); }
.nav-logo { display:inline-flex; align-items:center; gap:9px; font-family:var(--f-display); font-weight:800; font-size:1.05rem; letter-spacing:-0.01em; color:var(--white); text-decoration:none; }
.nav-logo span { color:var(--acid); }
.nav-cta { display:inline-flex; align-items:center; gap:8px; font-family:var(--f-display); font-weight:700; font-size:0.85rem; background:var(--grad); color:var(--void); padding:10px 20px; border-radius:999px; text-decoration:none; box-shadow:0 6px 18px rgba(200,240,74,0.2); transition:transform .22s var(--ease); }
.nav-cta:hover { transform:translateY(-2px); }
@media (max-width:560px){ nav{padding:14px 18px;} .nav-cta{font-size:0.78rem; padding:9px 15px;} }

/* HERO */
.hero { position:relative; min-height:88vh; display:flex; flex-direction:column; justify-content:center; padding:120px 32px 64px; max-width:1100px; margin:0 auto; }
.hero::before { content:""; position:absolute; inset:0; z-index:-1; background:radial-gradient(900px 420px at 15% 0%,rgba(200,240,74,0.10),transparent 60%),radial-gradient(800px 400px at 90% 30%,rgba(74,240,200,0.07),transparent 55%); pointer-events:none; }
.hero-eyebrow { display:inline-flex; align-items:center; gap:10px; font-family:var(--f-mono); font-size:0.72rem; letter-spacing:0.16em; text-transform:uppercase; color:var(--acid); border:1px solid var(--border-hi); border-radius:999px; padding:7px 16px; margin-bottom:28px; width:fit-content; }
.hero-eyebrow .dot { width:7px; height:7px; border-radius:50%; background:var(--acid); box-shadow:0 0 10px var(--acid); }
.hero h1 { font-family:var(--f-display); font-weight:800; font-size:clamp(2rem,5.5vw,3.6rem); line-height:1.06; letter-spacing:-0.025em; max-width:20ch; margin-bottom:22px; }
.hero-sub { font-size:clamp(1rem,2.2vw,1.18rem); color:var(--muted2); max-width:58ch; margin-bottom:36px; }
.cta-row { display:flex; flex-wrap:wrap; gap:14px; align-items:center; }
.btn-primary { display:inline-flex; align-items:center; gap:10px; font-family:var(--f-display); font-weight:700; font-size:1rem; background:var(--grad); color:var(--void); padding:16px 30px; border-radius:999px; text-decoration:none; border:none; cursor:pointer; box-shadow:0 8px 26px rgba(200,240,74,0.22); transition:transform .22s var(--ease),box-shadow .22s var(--ease); }
.btn-primary:hover { transform:translateY(-2px); box-shadow:0 12px 34px rgba(200,240,74,0.4); }
.btn-ghost { display:inline-flex; align-items:center; gap:9px; font-family:var(--f-mono); font-size:0.82rem; letter-spacing:0.04em; color:var(--white); text-decoration:none; padding:15px 24px; border-radius:999px; border:1px solid var(--border-hi); transition:background .22s var(--ease),border-color .22s var(--ease); }
.btn-ghost:hover { background:rgba(200,240,74,0.08); border-color:var(--acid); }
.hero-trust { margin-top:42px; display:flex; align-items:center; gap:14px; flex-wrap:wrap; font-family:var(--f-mono); font-size:0.74rem; color:var(--muted); letter-spacing:0.03em; }
.hero-trust strong { color:var(--muted2); font-weight:500; }

/* SECTIONS */
.section { max-width:1100px; margin:0 auto; padding:80px 32px; }
.section-label { font-family:var(--f-mono); font-size:0.72rem; letter-spacing:0.16em; text-transform:uppercase; color:var(--acid); margin-bottom:14px; }
.section-title { font-family:var(--f-display); font-weight:800; font-size:clamp(1.6rem,4vw,2.4rem); line-height:1.12; letter-spacing:-0.02em; max-width:24ch; margin-bottom:16px; }
.section-intro { color:var(--muted2); max-width:58ch; font-size:1.02rem; }

/* CARDS */
.cards-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:44px; }
.cards-2 { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; margin-top:44px; }
.card { background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:30px 26px; transition:border-color .25s var(--ease),transform .25s var(--ease); }
.card:hover { border-color:var(--border-hi); transform:translateY(-4px); }
.card-icon { width:46px; height:46px; border-radius:11px; display:flex; align-items:center; justify-content:center; background:rgba(200,240,74,0.08); border:1px solid var(--border-hi); margin-bottom:20px; }
.card-icon svg { width:22px; height:22px; stroke:var(--acid2); fill:none; stroke-width:1.8; }
.card h3 { font-family:var(--f-display); font-weight:700; font-size:1.12rem; margin-bottom:10px; line-height:1.25; }
.card p { color:var(--muted); font-size:0.92rem; line-height:1.65; }

/* PROOF */
.proof { background:var(--deep); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.proof-inner { max-width:1100px; margin:0 auto; padding:80px 32px; display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center; }
.proof-shot { width:100%; border-radius:14px; border:1px solid var(--border-hi); box-shadow:0 20px 60px rgba(0,0,0,0.45); display:block; }
.proof-txt h2 { font-family:var(--f-display); font-weight:800; font-size:clamp(1.5rem,3.5vw,2.1rem); line-height:1.14; letter-spacing:-0.02em; margin-bottom:14px; }
.proof-txt p { color:var(--muted2); font-size:1rem; margin-bottom:10px; }
.proof-sector { font-family:var(--f-mono); font-size:0.7rem; letter-spacing:0.12em; text-transform:uppercase; color:var(--acid-dim); margin-bottom:12px; }

/* FAQ */
.faq { max-width:820px; margin:0 auto; padding:80px 32px; }
.faq-item { border-bottom:1px solid var(--border); padding:22px 0; }
.faq-item h3 { font-family:var(--f-display); font-weight:700; font-size:1.08rem; margin-bottom:10px; color:var(--white); }
.faq-item p { color:var(--muted); font-size:0.95rem; line-height:1.7; }

/* CTA BAND */
.cta-band { position:relative; text-align:center; max-width:760px; margin:0 auto; padding:90px 32px; }
.cta-band::before { content:""; position:absolute; inset:0; z-index:-1; background:radial-gradient(700px 360px at 50% 0%,rgba(200,240,74,0.08),transparent 60%); }
.cta-band h2 { font-family:var(--f-display); font-weight:800; font-size:clamp(1.7rem,4.5vw,2.6rem); line-height:1.1; letter-spacing:-0.02em; margin-bottom:14px; }
.cta-band p { color:var(--muted2); max-width:50ch; margin:0 auto 32px; }

/* FOOTER */
footer { border-top:1px solid var(--border); padding:44px 32px; display:flex; flex-direction:column; align-items:center; gap:16px; text-align:center; }
.footer-logo { display:inline-flex; align-items:center; gap:9px; font-family:var(--f-display); font-weight:800; font-size:1.05rem; color:var(--white); text-decoration:none; }
.footer-logo span { color:var(--acid); }
.footer-center { font-size:0.84rem; color:var(--muted); line-height:1.7; }
.footer-center a { color:var(--muted); text-decoration:none; }
.footer-nav { display:flex; gap:16px; flex-wrap:wrap; justify-content:center; }
.footer-nav a { font-family:var(--f-mono); font-size:0.72rem; color:var(--muted); text-decoration:none; }
.footer-nav a:hover { color:var(--acid); }
.footer-legal { font-family:var(--f-mono); font-size:0.72rem; color:var(--muted); text-decoration:none; cursor:pointer; }
.footer-legal:hover { color:var(--acid); }

/* COOKIE */
#cookie-banner { position:fixed; left:0; right:0; bottom:0; z-index:9990; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:20px 32px; background:rgba(13,17,25,0.97); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border-top:1px solid var(--border-hi); transform:translateY(110%); transition:transform .4s var(--ease); }
#cookie-banner.visible { transform:translateY(0); }
.cookie-text { font-size:0.82rem; color:var(--muted2); max-width:70ch; }
.cookie-text a { color:var(--acid); text-decoration:none; }
.cookie-actions { display:flex; gap:10px; flex-shrink:0; }
.cookie-actions button { font-family:var(--f-mono); font-size:0.76rem; cursor:pointer; padding:10px 18px; border-radius:999px; border:1px solid var(--border-hi); background:transparent; color:var(--white); transition:all .2s; }
.cookie-btn-accept { background:var(--acid); color:var(--void); border-color:var(--acid); font-weight:600; }
.cookie-actions button:hover { transform:translateY(-1px); }

/* LEGAL MODAL */
#legal-modal { position:fixed; inset:0; z-index:9995; display:none; align-items:center; justify-content:center; padding:24px; background:rgba(4,6,10,0.82); backdrop-filter:blur(6px); }
#legal-modal.open { display:flex; }
.legal-modal-box { background:var(--surface); border:1px solid var(--border-hi); border-radius:16px; max-width:720px; width:100%; max-height:84vh; display:flex; flex-direction:column; }
.legal-modal-header { display:flex; align-items:center; justify-content:space-between; padding:22px 26px; border-bottom:1px solid var(--border); }
.legal-modal-title { font-family:var(--f-display); font-weight:700; font-size:1.1rem; }
.legal-modal-close { background:none; border:none; color:var(--muted); font-size:1.1rem; cursor:pointer; }
.legal-modal-body { padding:26px; overflow-y:auto; font-size:0.88rem; color:var(--muted2); }
.legal-modal-body h3 { font-family:var(--f-display); color:var(--white); font-size:0.98rem; margin:18px 0 8px; }
.legal-modal-body h3:first-child { margin-top:0; }
.legal-modal-body p { margin-bottom:10px; line-height:1.65; }
.legal-modal-body a { color:var(--acid); }

/* RESPONSIVE */
@media (max-width:860px){ .cards-3,.cards-2,.proof-inner{ grid-template-columns:1fr; } }
@media (max-width:560px){ .hero{padding:104px 18px 56px;} .section,.faq,.cta-band{padding:60px 18px;} .proof-inner{padding:60px 18px;} #cookie-banner{flex-direction:column; padding:16px; gap:12px; align-items:flex-start;} .cookie-actions{width:100%;} .cookie-actions button{flex:1;} }
@media (prefers-reduced-motion:reduce){ *{ animation:none!important; transition:none!important; scroll-behavior:auto!important; } }
