:root{
    --concrete-light:#F3F1EA;
    --concrete:#D9D3C2;
    --concrete-dark:#4A453E;
    --charcoal:#0B1B33;
    --charcoal-2:#0F2340;
    --orange:#C9A227;
    --orange-dark:#A8841E;
    --steel:#5C5A52;
    --white:#FAF9F5;
    --line:#1F3358;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--concrete-light);
    color:var(--charcoal);
    font-family:'Inter',sans-serif;
    line-height:1.55;
    overflow-x:hidden;
  }
  h1,h2,h3,.display{
    font-family:'Playfair Display',serif;
    text-transform:none;
    letter-spacing:0;
    font-weight:700;
    color:var(--charcoal);
  }
  .mega{font-family:'Archivo Black',sans-serif; text-transform:uppercase;}
  a{color:inherit; text-decoration:none;}
  img{max-width:100%; display:block;}
  .wrap{max-width:1180px; margin:0 auto; padding:0 28px;}

  .hazard{height:4px; background:linear-gradient(90deg, var(--orange-dark), var(--orange) 50%, var(--orange-dark));}
  .hazard.thin{height:2px; opacity:0.7;}

  header{position:sticky; top:0; z-index:100; background:var(--charcoal); border-bottom:3px solid var(--orange);}
  nav.wrap{display:flex; align-items:center; justify-content:space-between; padding-top:14px; padding-bottom:14px;}
  .logo{display:flex; align-items:center; gap:12px; color:var(--white);}
  .logo img{height:42px; width:auto; filter:brightness(0) invert(1);}
  .logo-text{font-family:'Archivo Black',sans-serif; font-size:19px; letter-spacing:0.03em; line-height:1.1;}
  .logo-text span{color:var(--orange);}
  .logo-sub{font-family:'Oswald',sans-serif; font-size:10px; letter-spacing:0.08em; color:var(--concrete); text-transform:uppercase; margin-top:2px;}
  .nav-links{display:flex; gap:26px; align-items:center;}
  .nav-links a{color:var(--concrete); font-family:'Oswald',sans-serif; font-size:13.5px; text-transform:uppercase; letter-spacing:0.05em; font-weight:500; transition:color .2s;}
  .nav-links a:hover{color:var(--orange);}
  .nav-phone{display:flex; align-items:center; gap:8px; background:var(--orange); color:var(--charcoal); padding:9px 16px; font-family:'Oswald',sans-serif; font-weight:600; font-size:14px; white-space:nowrap;}

  .hero{position:relative; background:var(--charcoal); color:var(--white); padding:80px 0 64px; overflow:hidden;
    background-image:radial-gradient(circle at 15% 20%, rgba(255,90,31,0.09), transparent 40%), radial-gradient(circle at 85% 80%, rgba(255,90,31,0.07), transparent 45%);}
  .hero::before{content:""; position:absolute; inset:0;
    background-image:repeating-linear-gradient(0deg, rgba(255,255,255,0.025) 0px, rgba(255,255,255,0.025) 1px, transparent 1px, transparent 42px),
      repeating-linear-gradient(90deg, rgba(255,255,255,0.025) 0px, rgba(255,255,255,0.025) 1px, transparent 1px, transparent 42px);
    pointer-events:none;}
  .hero-grid{display:grid; grid-template-columns:1.15fr 0.85fr; gap:50px; align-items:center; position:relative; z-index:2;}
  .eyebrow{display:inline-flex; align-items:center; gap:10px; color:var(--orange); font-family:'Oswald',sans-serif; font-size:13px; letter-spacing:0.16em; font-weight:600; margin-bottom:22px;}
  .eyebrow::before{content:""; width:26px; height:2px; background:var(--orange);}
  .hero h1{font-size:50px; line-height:1.06; color:var(--white); margin-bottom:20px;}
  .hero h1 em{font-style:normal; color:var(--orange);}
  .hero p.lede{color:var(--concrete); font-size:16.5px; max-width:520px; margin-bottom:14px;}
  .hero p.tagline{color:var(--orange); font-family:'Oswald',sans-serif; font-size:13px; letter-spacing:0.04em; text-transform:uppercase; margin-bottom:30px;}
  .cta-row{display:flex; gap:16px; flex-wrap:wrap;}
  .btn{display:inline-flex; align-items:center; gap:10px; padding:15px 26px; font-family:'Oswald',sans-serif; font-weight:600; font-size:14px; text-transform:uppercase; letter-spacing:0.05em; border:2px solid transparent; cursor:pointer; transition:transform .15s ease, background .15s ease;}
  .btn:hover{transform:translateY(-2px);}
  .btn-primary{background:var(--orange); color:var(--charcoal);}
  .btn-primary:hover{background:#ff6f3d;}
  .btn-ghost{border-color:var(--concrete); color:var(--white);}
  .btn-ghost:hover{border-color:var(--orange); color:var(--orange);}
  .btn-wa{background:#25D366; color:#0b2412;}

  .hero-panel{position:relative; overflow:hidden; border:1px solid var(--line); height:420px;}
  .hero-panel .slide{position:absolute; inset:0; opacity:0; transition:opacity 1.2s ease;}
  .hero-panel .slide.active{opacity:1;}
  .hero-panel .slide img{width:100%; height:100%; object-fit:cover; display:block;}
  .hero-panel::after{content:""; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg, var(--orange-dark), var(--orange) 50%, var(--orange-dark)); z-index:2;}
  .hero-panel .cap{position:absolute; left:0; right:0; bottom:0; background:linear-gradient(0deg, rgba(0,0,0,0.85), transparent); padding:24px 16px 12px; font-family:'Oswald',sans-serif; font-size:12px; letter-spacing:0.05em; text-transform:uppercase; color:var(--white); z-index:1;}

  section{padding:74px 0;}
  .sec-head{margin-bottom:42px; max-width:660px;}
  .sec-eyebrow{font-family:'Oswald',sans-serif; color:var(--orange-dark); font-size:13px; letter-spacing:0.16em; font-weight:600; margin-bottom:10px; display:block;}
  .sec-head h2{font-size:34px; line-height:1.1;}
  .sec-head p{color:var(--steel); margin-top:14px; font-size:15.5px;}

  /* SERVICES */
  .services{background:var(--white);}
  .service-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:0; border:1px solid var(--concrete);}
  .service-card{padding:32px 26px; border-right:1px solid var(--concrete); transition:background .2s;}
  .service-card:last-child{border-right:none;}
  .service-card:hover{background:var(--concrete-light);}
  .service-tag{font-family:'Archivo Black',sans-serif; font-size:13px; color:var(--concrete); -webkit-text-stroke:1px var(--charcoal); margin-bottom:18px;}
  .service-card h3{font-size:18px; margin-bottom:10px;}
  .service-card p{color:var(--steel); font-size:14px;}
  .service-icon{width:44px; height:44px; margin-bottom:18px; display:flex; align-items:center; justify-content:center; background:var(--charcoal); color:var(--orange); transform:skew(-6deg);}
  .service-icon svg{width:22px; height:22px; transform:skew(6deg);}

  /* SECURITE / EQUIPE */
  .team{background:var(--concrete-light);}
  .team-grid{display:grid; grid-template-columns:1fr 1fr; gap:24px;}
  .team-photo{position:relative; overflow:hidden; border:1px solid var(--concrete); aspect-ratio:4/3.1;}
  .team-photo img{width:100%; height:100%; object-fit:cover;}
  .team-photo .cap{position:absolute; left:0; right:0; bottom:0; background:linear-gradient(0deg, rgba(0,0,0,0.78), transparent); padding:22px 16px 12px; color:var(--white); font-family:'Oswald',sans-serif; font-size:12px; text-transform:uppercase; letter-spacing:0.05em;}
  .team-text{margin-top:22px; color:var(--steel); font-size:15px; max-width:760px;}

  /* MATERIAUX */
  .materiaux{background:var(--concrete-light);}
  .mat-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:22px;}
  .mat-card{background:var(--white); border:1px solid var(--concrete);}
  .mat-photo{aspect-ratio:4/3; overflow:hidden; border-bottom:2px solid var(--orange); position:relative; background:var(--concrete-light);}
  .mat-photo img{width:100%; height:100%; object-fit:cover;}
  .mat-photo.empty{display:flex; align-items:center; justify-content:center; flex-direction:column; gap:8px; color:var(--steel);
    background:repeating-linear-gradient(45deg, var(--concrete) 0, var(--concrete) 1px, transparent 1px, transparent 14px), var(--concrete-light);}
  .mat-photo.empty svg{width:28px; height:28px; opacity:0.5;}
  .mat-photo.empty span{font-family:'Oswald',sans-serif; font-size:11px; text-transform:uppercase; letter-spacing:0.05em;}
  .mat-body{padding:18px 20px 22px;}
  .mat-num{font-family:'Archivo Black',sans-serif; font-size:12px; color:var(--orange); margin-bottom:8px;}
  .mat-body h3{font-size:16px; margin-bottom:6px; text-transform:none; font-family:'Oswald',sans-serif; letter-spacing:0; font-weight:600;}
  .mat-body p{font-size:13.5px; color:var(--steel);}
  .mat-price{margin-top:10px; padding-top:10px; border-top:1px dashed var(--concrete); display:flex; justify-content:space-between; align-items:center; font-family:'Oswald',sans-serif; font-size:12.5px;}
  .mat-price .px{color:var(--orange-dark); font-weight:700;}

  .subsec-label{font-family:'Oswald',sans-serif; font-size:13px; font-weight:600; text-transform:uppercase; letter-spacing:0.08em; color:var(--charcoal); margin:0 0 18px; padding-left:14px; border-left:3px solid var(--orange);}
  .brique-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:20px; margin-bottom:46px;}

  /* GALERIE */
  .galerie{background:var(--charcoal); color:var(--white);}
  .galerie .sec-head h2, .galerie .sec-eyebrow{color:var(--white);}
  .galerie .sec-eyebrow{color:var(--orange);}
  .galerie .sec-head p{color:var(--concrete);}
  .gal-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:14px;}
  .gal-grid.three{grid-template-columns:repeat(3,1fr);}
  .gal-grid.two{grid-template-columns:repeat(2,1fr);}
  .proj-group{margin-bottom:40px;}
  .proj-group:last-child{margin-bottom:0;}
  .proj-label{font-family:'Oswald',sans-serif; font-size:13px; font-weight:600; text-transform:uppercase; letter-spacing:0.08em; color:var(--orange); margin-bottom:16px; padding-left:14px; border-left:3px solid var(--orange);}
  .gal-slot{aspect-ratio:1/1; position:relative; overflow:hidden; border:1px solid var(--line);}
  .gal-slot img{width:100%; height:100%; object-fit:cover; filter:grayscale(15%) contrast(1.05); transition:transform .35s ease, filter .35s ease;}
  .gal-slot:hover img{transform:scale(1.06); filter:grayscale(0%) contrast(1.05);}
  .gal-slot .cap{position:absolute; left:0; right:0; bottom:0; background:linear-gradient(0deg, rgba(0,0,0,0.82), transparent); padding:20px 12px 10px; font-family:'Oswald',sans-serif; font-size:11px; letter-spacing:0.04em; text-transform:uppercase; color:var(--white); text-align:left;}

  /* CONTACT */
  .contact{background:var(--white);}
  .contact-grid{display:grid; grid-template-columns:1fr 1.15fr; gap:0; border:1px solid var(--concrete);}
  .contact-info{background:var(--charcoal); color:var(--white); padding:42px 36px; position:relative;}
  .contact-info h3{color:var(--white); font-size:23px; margin-bottom:16px;}
  .contact-info p{color:var(--concrete); font-size:14.5px; margin-bottom:28px;}
  .info-line{display:flex; gap:14px; align-items:flex-start; padding:13px 0; border-top:1px solid var(--line);}
  .info-line svg{width:19px; height:19px; color:var(--orange); flex-shrink:0; margin-top:2px;}
  .info-line .lbl{font-family:'Oswald',sans-serif; font-size:11px; text-transform:uppercase; letter-spacing:0.05em; color:var(--concrete);}
  .info-line .val{font-size:14.5px; color:var(--white); margin-top:2px;}
  .info-line a:hover{color:var(--orange);}
  .wa-block{margin-top:28px; display:flex; flex-direction:column; gap:10px;}

  .contact-form{padding:42px 36px;}
  .form-row{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px;}
  .field{display:flex; flex-direction:column; gap:6px;}
  .field.full{grid-column:1/-1;}
  label{font-family:'Oswald',sans-serif; font-size:12px; text-transform:uppercase; letter-spacing:0.05em; color:#333;}
  input, select, textarea{border:1.5px solid var(--concrete); background:var(--concrete-light); padding:12px 13px; font-family:'Inter',sans-serif; font-size:14.5px; color:var(--charcoal); outline:none; transition:border-color .15s;}
  input:focus, select:focus, textarea:focus{border-color:var(--orange);}
  textarea{resize:vertical; min-height:96px;}
  .submit-btn{margin-top:6px; background:var(--orange); color:var(--charcoal); border:none; padding:15px 30px; font-family:'Oswald',sans-serif; font-weight:700; font-size:14px; text-transform:uppercase; letter-spacing:0.05em; cursor:pointer; transition:background .15s;}
  .submit-btn:hover{background:var(--orange-dark); color:var(--white);}
  .form-note{font-size:12.5px; color:var(--steel); margin-top:12px;}

  footer{background:var(--charcoal-2); color:var(--concrete); padding:30px 0;}
  .foot-row{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px;}
  .foot-row .logo-text{font-size:16px;}
  footer .small{font-size:12px; color:var(--steel);}
  .foot-legal{text-align:center; font-size:11.5px; color:var(--steel); margin-top:14px; padding-top:14px; border-top:1px solid var(--line);}

  .stats-bar{background:var(--charcoal-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
  .stats-row{display:grid; grid-template-columns:repeat(4,1fr); gap:0;}
  .stats-row .stat{padding:26px 20px; text-align:center; border-right:1px solid var(--line);}
  .stats-row .stat:last-child{border-right:none;}
  .stats-row .num{font-family:'Archivo Black',sans-serif; font-size:32px; color:var(--orange); line-height:1;}
  .stats-row .lbl{font-family:'Oswald',sans-serif; font-size:12px; color:var(--concrete); text-transform:uppercase; letter-spacing:0.05em; margin-top:8px;}
  @media(max-width:880px){
    .stats-row{grid-template-columns:repeat(2,1fr);}
    .stats-row .stat{border-bottom:1px solid var(--line);}
    .hero-grid{grid-template-columns:1fr;}
    .hero h1{font-size:36px;}
    .service-grid{grid-template-columns:1fr;}
    .service-card{border-right:none; border-bottom:1px solid var(--concrete);}
    .team-grid{grid-template-columns:1fr;}
    .gal-grid{grid-template-columns:repeat(2,1fr);}
    .gal-grid.three{grid-template-columns:repeat(2,1fr);}
    .contact-grid{grid-template-columns:1fr;}
    .form-row{grid-template-columns:1fr;}
    .nav-links{display:none;}
  }