:root{--rouge:#e21b1b;--noir:#0a0a0a;--gris:#161616;--gris2:#222;--texte:#e9e9e9;--pale:#a9a9a9}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--noir);color:var(--texte);font-family:"Segoe UI",Roboto,Helvetica,Arial,sans-serif;line-height:1.6;font-size:17px}
a{color:#fff}
img{max-width:100%;display:block}
.wrap{max-width:1140px;margin:0 auto;padding:0 20px}
header{position:sticky;top:0;z-index:20;background:rgba(10,10,10,.94);border-bottom:2px solid var(--rouge);backdrop-filter:blur(4px)}
header .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;height:68px}
.marque{font-weight:800;letter-spacing:.5px;font-size:20px;text-decoration:none;color:#fff}
.marque span{color:var(--rouge)}
nav a{color:#ddd;text-decoration:none;margin-left:22px;font-size:15px;text-transform:uppercase;letter-spacing:1px}
nav a:hover{color:var(--rouge)}
.hero{background:#fff;padding:0}
.hero img{width:100%;max-height:520px;object-fit:contain;margin:0 auto}
.slogan{background:var(--rouge);color:#fff;text-align:center;padding:18px 20px;font-size:20px;font-weight:600;letter-spacing:.5px}
section{padding:72px 0}
h2{font-size:32px;margin:0 0 8px;text-transform:uppercase;letter-spacing:1px}
h2::after{content:"";display:block;width:60px;height:4px;background:var(--rouge);margin-top:10px}
.intro{color:var(--pale);margin:0 0 32px}
.apropos{display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:start}
.apropos p{margin:0 0 16px}
.services{background:var(--gris);border-left:4px solid var(--rouge);padding:24px 28px}
.services h3{margin:0 0 12px;font-size:19px;text-transform:uppercase;letter-spacing:1px}
.services ul{margin:0;padding:0;list-style:none}
.services li{padding:8px 0;border-bottom:1px solid #2a2a2a}
.services li:last-child{border-bottom:none}
.services li::before{content:"■";color:var(--rouge);margin-right:10px;font-size:12px}
#realisations{background:var(--gris)}
.galerie{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.galerie figure{margin:0;background:#000;cursor:zoom-in;overflow:hidden;position:relative}
.galerie img{width:100%;aspect-ratio:1/1;object-fit:cover;transition:transform .35s}
.galerie figure:hover img{transform:scale(1.05)}
.galerie figcaption{position:absolute;left:0;right:0;bottom:0;padding:10px 12px;background:linear-gradient(transparent,rgba(0,0,0,.85));font-size:15px}
.cta{text-align:center;margin-top:36px;font-size:19px}
.btn{display:inline-block;background:var(--rouge);color:#fff;text-decoration:none;padding:12px 26px;font-weight:700;text-transform:uppercase;letter-spacing:1px;margin-top:12px}
.btn:hover{background:#b81414}
.contact{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.carte{background:var(--gris);padding:28px;border-top:4px solid var(--rouge)}
.carte h3{margin:0 0 10px;font-size:18px;text-transform:uppercase;letter-spacing:1px}
.carte p{margin:4px 0;color:#ccc}
.carte a{color:#fff;font-weight:600}
footer{border-top:1px solid #222;padding:24px 0;color:#888;font-size:14px;text-align:center}
#lb{position:fixed;inset:0;background:rgba(0,0,0,.92);display:none;align-items:center;justify-content:center;z-index:50;padding:20px;cursor:zoom-out}
#lb.ouvert{display:flex}
#lb img{max-height:88vh;max-width:94vw;object-fit:contain}
#lb p{position:absolute;bottom:18px;left:0;right:0;text-align:center;margin:0}
@media (max-width:800px){
 nav{display:none}
 .apropos,.contact{grid-template-columns:1fr}
 section{padding:52px 0}
 h2{font-size:26px}
 .slogan{font-size:17px}
}
