:root{
  --primary: #C9A227;
  --dark: #2B2B2B;
  --light: #F5F1E8;
  --text: #2B2B2B;
  --radius: 10px;
}

*{box-sizing:border-box;margin:0;padding:0;}

body{
  font-family: 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
  color: var(--text);
  background: #fff;
  line-height: 1.6;
}

img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;}
.container{max-width:1180px;margin:0 auto;padding:0 24px;}

/* ---------- Header ---------- */
.site-header{
  position: sticky; top:0; z-index: 100;
  background: rgba(255,255,255,0.97);
  border-bottom: 1px solid #eee;
  backdrop-filter: blur(6px);
}
.site-header .container{
  display:flex; align-items:center; justify-content:space-between;
  height: 78px;
}
.brand{display:flex; align-items:center; gap:10px;}
.brand img{height: 44px; width:auto;}
.brand-name{font-family: Georgia, 'Times New Roman', serif; font-weight:700; font-size: 1.25rem; color: var(--dark); letter-spacing: .5px;}
.brand-name span{color: var(--primary);}

.main-nav ul{display:flex; gap: 28px;}
.main-nav a{font-size:.95rem; font-weight:600; color:var(--dark); transition:.2s;}
.main-nav a:hover{color:var(--primary);}

.header-cta{
  display:inline-flex; align-items:center; gap:8px;
  background: var(--dark); color:#fff;
  padding: 10px 18px; border-radius: 999px; font-weight:600; font-size:.9rem;
  transition:.2s;
}
.header-cta:hover{background: var(--primary); color: var(--dark);}

.nav-toggle{display:none; flex-direction:column; gap:5px; background:none; border:0; cursor:pointer;}
.nav-toggle span{width:26px;height:2px;background:var(--dark);}

/* ---------- Hero / Carousel ---------- */
.hero{position:relative; height: 78vh; min-height:480px; max-height:720px; overflow:hidden; background:var(--dark);}
.carousel{position:relative; width:100%; height:100%;}
.carousel-slide{
  position:absolute; inset:0; opacity:0; transition: opacity 1s ease;
  background-size: cover; background-position:center;
}
.carousel-slide.active{opacity:1;}
.carousel-slide::after{
  content:''; position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.35) 0%, rgba(0,0,0,.55) 100%);
}
.slide-caption{
  position:absolute; left:0; right:0; bottom:14%; z-index:2;
  text-align:center; color:#fff; padding: 0 20px;
}
.slide-caption h2{font-family: Georgia, serif; font-size: clamp(1.6rem, 4vw, 2.8rem); margin-bottom:10px; text-shadow:0 2px 12px rgba(0,0,0,.4);}
.slide-caption p{max-width:600px; margin:0 auto; font-size:1.05rem; opacity:.95;}

.hero-overlay-title{
  position:absolute; z-index:3; top:0; left:0; right:0; height:100%;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; color:#fff; pointer-events:none;
}
.hero-overlay-title .eyebrow{
  letter-spacing:4px; font-size:.8rem; font-weight:700; color: var(--primary);
  margin-bottom: 14px; text-transform:uppercase;
}
.hero-overlay-title h1{
  font-family: Georgia, serif; font-size: clamp(2rem, 5vw, 3.4rem);
  max-width: 820px; text-shadow: 0 2px 14px rgba(0,0,0,.5);
}
.hero-overlay-title .btns{margin-top:28px; pointer-events:all; display:flex; gap:14px; flex-wrap:wrap; justify-content:center;}
.btn{
  display:inline-block; padding: 13px 26px; border-radius: 999px;
  font-weight:700; font-size:.95rem; transition:.2s; border:2px solid transparent;
}
.btn-primary{background: var(--primary); color: var(--dark);}
.btn-primary:hover{filter:brightness(1.08); transform:translateY(-2px);}
.btn-outline{border-color:#fff; color:#fff;}
.btn-outline:hover{background:#fff; color:var(--dark);}

.carousel-dots{position:absolute; z-index:3; bottom: 22px; left:0; right:0; display:flex; justify-content:center; gap:9px;}
.carousel-dots button{
  width:10px; height:10px; border-radius:50%; border:2px solid #fff; background:transparent; cursor:pointer; padding:0;
  transition:.2s;
}
.carousel-dots button.active{background:#fff;}
.carousel-arrow{
  position:absolute; z-index:3; top:50%; transform:translateY(-50%);
  background: rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.5);
  color:#fff; width:46px; height:46px; border-radius:50%; cursor:pointer; font-size:1.3rem;
  display:flex; align-items:center; justify-content:center; transition:.2s;
}
.carousel-arrow:hover{background:#fff; color:var(--dark);}
.carousel-arrow.prev{left:22px;}
.carousel-arrow.next{right:22px;}

/* ---------- Sections ---------- */
.section{padding: 80px 0;}
.section-alt{background: var(--light);}
.section-head{text-align:center; max-width:680px; margin:0 auto 50px;}
.section-head .eyebrow{color:var(--primary); font-weight:700; letter-spacing:3px; font-size:.8rem; text-transform:uppercase;}
.section-head h2{font-family:Georgia, serif; font-size: clamp(1.6rem,3vw,2.3rem); margin-top:10px; color:var(--dark);}
.section-head p{margin-top:14px; color:#555;}

/* Services */
.grid-services{display:grid; grid-template-columns:repeat(auto-fit,minmax(270px,1fr)); gap:26px;}
.service-card{
  background:#fff; border:1px solid #eee; border-radius: var(--radius);
  padding: 30px 26px; transition:.25s; box-shadow: 0 4px 16px rgba(0,0,0,.03);
}
.service-card:hover{transform:translateY(-6px); box-shadow: 0 14px 30px rgba(0,0,0,.08); border-color: transparent;}
.service-icon{
  width:52px;height:52px;border-radius:14px;
  background: color-mix(in srgb, var(--primary) 18%, white);
  display:flex; align-items:center; justify-content:center; font-size:1.4rem; margin-bottom:18px;
}
.service-card h3{font-size:1.1rem; margin-bottom:10px; color:var(--dark);}
.service-card p{color:#666; font-size:.95rem;}

/* Engagement */
.grid-engagement{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:24px;}
.engagement-card{text-align:center; padding: 20px;}
.engagement-check{
  width:46px;height:46px;border-radius:50%; background:var(--primary); color:var(--dark);
  display:flex; align-items:center; justify-content:center; font-weight:800; margin:0 auto 14px; font-size:1.2rem;
}
.engagement-card h3{font-size:1.02rem; margin-bottom:8px; color:var(--dark);}
.engagement-card p{color:#666; font-size:.9rem;}

/* Réalisations */
.grid-realisations{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:18px;}
.real-item{
  background:#fff; border:1px solid #eee; border-radius: var(--radius);
  padding: 20px 22px; display:flex; align-items:center; gap:14px; font-weight:600; color:var(--dark);
  transition:.2s;
}
.real-item:hover{border-color:var(--primary); background: color-mix(in srgb, var(--primary) 8%, white);}
.real-item .dot{width:9px;height:9px;border-radius:50%;background:var(--primary); flex-shrink:0;}

/* Pourquoi */
.why-block{
  background: var(--dark); color:#fff; border-radius: 18px; padding: 60px 40px; text-align:center;
}
.why-block h2{font-family:Georgia, serif; font-size: clamp(1.5rem,3vw,2.1rem); margin-bottom:18px;}
.why-block p{max-width:720px; margin:0 auto; color:#ddd; font-size:1.05rem;}
.why-block .btn{margin-top:28px;}

/* Contact */
.contact-wrap{
  display:grid; grid-template-columns: 1.1fr .9fr; gap:40px; align-items:center;
}
.contact-info h2{font-family:Georgia, serif; font-size:1.9rem; color:var(--dark); margin-bottom:16px;}
.contact-info p{color:#555; margin-bottom:24px;}
.contact-methods{display:flex; flex-direction:column; gap:14px;}
.contact-method{
  display:flex; align-items:center; gap:14px; background:#fff; border:1px solid #eee;
  padding:16px 18px; border-radius: var(--radius);
}
.contact-method .ic{
  width:42px;height:42px;border-radius:50%; background:var(--primary); color:var(--dark);
  display:flex; align-items:center; justify-content:center; font-size:1.1rem; flex-shrink:0;
}
.contact-card{
  background: var(--light); border-radius: 18px; padding: 40px; text-align:center;
}
.contact-card h3{font-family:Georgia, serif; color:var(--dark); margin-bottom:10px;}
.contact-card p{color:#666; margin-bottom:24px; font-size:.95rem;}

/* Footer */
.site-footer{background: var(--dark); color:#ccc; padding: 46px 0 24px;}
.footer-top{display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:24px; margin-bottom: 30px;}
.footer-brand{display:flex; align-items:center; gap:10px;}
.footer-brand img{height:38px;}
.footer-brand span{font-family:Georgia, serif; font-weight:700; color:#fff; font-size:1.1rem;}
.footer-tagline{max-width:360px; color:#999; font-size:.9rem; margin-top:10px;}
.footer-links{display:flex; gap:40px; flex-wrap:wrap;}
.footer-col h4{color:#fff; font-size:.85rem; letter-spacing:2px; text-transform:uppercase; margin-bottom:14px;}
.footer-col a, .footer-col p{color:#999; font-size:.9rem; display:block; margin-bottom:8px;}
.footer-bottom{border-top:1px solid #444; padding-top:20px; text-align:center; color:#777; font-size:.82rem;}

.whatsapp-float{
  position:fixed; bottom:24px; right:24px; z-index:999;
  width:58px; height:58px; border-radius:50%; background:#25D366; color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:1.7rem;
  box-shadow: 0 8px 22px rgba(0,0,0,.25); transition:.2s;
}
.whatsapp-float:hover{transform:scale(1.08);}

@media (max-width: 900px){
  .contact-wrap{grid-template-columns:1fr;}
}
@media (max-width: 760px){
  .main-nav{
    position:fixed; top:78px; left:0; right:0; background:#fff; flex-direction:column;
    padding: 20px 24px; border-bottom:1px solid #eee; transform:translateY(-140%); transition:.25s; opacity:0;
  }
  .main-nav.open{transform:translateY(0); opacity:1;}
  .main-nav ul{flex-direction:column; gap:16px;}
  .nav-toggle{display:flex;}
  .header-cta{display:none;}
  .footer-top{flex-direction:column;}
}