:root{
  --bg:#f4f2ea;
  --paper:#fbfaf5;
  --ink:#193126;
  --muted:#6f766f;
  --green:#173428;
  --sage:#a9b69f;
  --line:rgba(25,49,38,.16);
  --accent:#d7c6a0;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:"DM Sans",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--ink);
  background:var(--bg);
  line-height:1.55;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
h1,h2,h3,p{margin-top:0}
h1,h2{
  font-family:"Libre Caslon Display",Georgia,serif;
  font-weight:400;
  letter-spacing:-.02em;
}
h1{font-size:clamp(3.2rem,8vw,7.2rem);line-height:.94;max-width:900px;margin-bottom:2rem}
h1 em{font-weight:400;color:#bdc9b4}
h2{font-size:clamp(2.1rem,5vw,4.5rem);line-height:1.02;margin-bottom:1.2rem}
h3{font-size:1.08rem;margin-bottom:.65rem}
p{color:#566158}
.eyebrow{
  color:var(--ink);
  text-transform:uppercase;
  letter-spacing:.16em;
  font-size:.72rem;
  font-weight:600;
}
.site-header{
  position:sticky;top:0;z-index:20;
  display:flex;justify-content:space-between;align-items:center;
  padding:18px clamp(20px,4vw,64px);
  background:rgba(244,242,234,.9);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.brand{display:flex;align-items:center;gap:12px;font-size:1rem;min-width:0}
.brand-mark{
  width:46px;height:46px;border:1px solid rgba(25,49,38,.18);
  border-radius:50%;display:grid;place-items:center;
  background:rgba(255,255,255,.45);flex:0 0 auto;
}
.bauhinia{width:30px;height:30px;color:var(--green);display:block}
.brand-text{letter-spacing:.01em;white-space:nowrap}
.brand-text strong{font-weight:600}

.nav{display:flex;align-items:center;gap:24px;font-size:.88rem;flex-wrap:wrap}
.nav a:hover{opacity:.62}
.nav-cta{border:1px solid var(--ink);padding:10px 16px;border-radius:999px}
.menu-toggle{display:none;background:none;border:0;font:inherit;color:var(--ink)}

.hero{
  position:relative;min-height:88vh;display:flex;align-items:flex-end;overflow:hidden;
  background:var(--green);color:white;
}
.hero-bg{
  position:absolute;inset:0;
  background-image:
    linear-gradient(120deg, rgba(12, 27, 20, .72) 0%, rgba(18, 40, 29, .54) 36%, rgba(18, 40, 29, .38) 58%, rgba(12, 27, 20, .58) 100%),
    linear-gradient(180deg, rgba(10, 20, 15, .20) 0%, rgba(10, 20, 15, .08) 40%, rgba(10, 20, 15, .48) 100%),
    url('hero-jardin.jpg');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  filter: saturate(.96) contrast(1.02);
}
.hero-bg:after{
  content:"";position:absolute;width:55vw;height:55vw;border:1px solid rgba(255,255,255,.14);
  border-radius:50%;right:-9vw;top:-10vw;
  opacity:.45;
}
.hero-content{position:relative;z-index:1;padding:10vh clamp(24px,6vw,88px) 8vh;max-width:1180px}
.hero .eyebrow,.hero p{color:rgba(255,255,255,.78)}
.hero-copy{max-width:650px;font-size:1.1rem;margin-bottom:2rem}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:2rem}
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:50px;padding:0 22px;border-radius:999px;
  border:1px solid transparent;font-weight:600;cursor:pointer;font-family:inherit;
}
.btn-primary{background:#f4f0e4;color:var(--green)}
.btn-primary:hover{background:white}
.btn-secondary{border-color:rgba(255,255,255,.38);color:white}
.btn-secondary:hover{border-color:white}
.hero-note{display:flex;gap:26px;flex-wrap:wrap;font-size:.82rem;color:rgba(255,255,255,.72)}

.section{padding:110px clamp(24px,6vw,88px)}
.intro{display:grid;grid-template-columns:1fr 1fr;gap:8vw;border-bottom:1px solid var(--line)}
.intro-copy{max-width:660px;font-size:1.12rem}
.intro-copy p{margin-bottom:1.3rem}
.section-heading{max-width:680px}
.section-heading.wide{max-width:840px}
.lead{font-size:1.08rem}

.service-panel{
  display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
  min-height:720px;background:var(--paper);
}
.service-visual{min-height:620px;position:relative;overflow:hidden}
.visual-maintenance{
  background-image:
    linear-gradient(180deg, rgba(11, 22, 16, .18) 0%, rgba(11, 22, 16, .06) 32%, rgba(11, 22, 16, .22) 100%),
    url('entretien-photo.jpg');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
.visual-maintenance:before,
.visual-maintenance:after{
  content:"";position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.52);
}
.visual-maintenance:before{width:380px;height:380px;left:-100px;bottom:40px;opacity:.38}
.visual-maintenance:after{width:520px;height:520px;right:-220px;top:-100px;opacity:.32}
.service-content{padding:90px clamp(28px,6vw,90px)}
.service-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin:44px 0}
.service-grid>div{padding-top:18px;border-top:1px solid var(--line)}
.text-link{font-weight:600;border-bottom:1px solid var(--ink);padding-bottom:4px}

.offer-grid{
  display:grid;gap:14px;margin-top:52px
}
.offer-grid.two-up{grid-template-columns:repeat(2,1fr)}
.offer-grid.three-up{grid-template-columns:repeat(3,1fr)}
.offer-card{
  min-height:310px;padding:28px 24px;border:1px solid var(--line);
  display:flex;flex-direction:column;background:rgba(255,255,255,.25)
}
.offer-card.featured{background:var(--green);color:white}
.offer-card.featured p,.offer-card.featured .offer-number{color:rgba(255,255,255,.7)}
.offer-number{font-size:.72rem;color:var(--muted);margin-bottom:auto}
.offer-card h3{font-family:"Libre Caslon Display",Georgia,serif;font-size:1.8rem;font-weight:400}
.price{margin-top:auto;padding-top:25px;font-weight:600;color:var(--ink)}
.offer-card.featured .price{color:white}

.manifesto{
  padding:90px clamp(24px,6vw,88px);background:#d7d4c6;
  display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap;
}
.manifesto p{
  font-family:"Libre Caslon Display",Georgia,serif;
  color:var(--ink);font-size:clamp(2rem,4vw,4.5rem);margin:0;
}

.projects{background:var(--paper)}
.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:360px;gap:16px;margin-top:48px}
.project-card{
  position:relative;display:flex;align-items:flex-end;overflow:hidden;
  min-height:380px;
}

.project-a{
  background-image:
    linear-gradient(180deg, rgba(9, 16, 12, .12) 0%, rgba(9, 16, 12, .02) 40%, rgba(9, 16, 12, .38) 100%),
    url('projet-medoc.jpg');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
.project-b{
  background-image:
    linear-gradient(180deg, rgba(9, 16, 12, .10) 0%, rgba(9, 16, 12, .02) 42%, rgba(9, 16, 12, .38) 100%),
    url('projet-bordeaux.jpg');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
.project-c{
  background-image:
    linear-gradient(180deg, rgba(9, 16, 12, .10) 0%, rgba(9, 16, 12, .02) 42%, rgba(9, 16, 12, .40) 100%),
    url('creation-terrasse.jpg');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
.project-info{
  margin:20px;background:rgba(247,244,235,.9);backdrop-filter:blur(7px);
  padding:22px;max-width:390px;
}
.project-info span{font-size:.7rem;text-transform:uppercase;letter-spacing:.12em}
.project-info h3{font-family:"Libre Caslon Display",Georgia,serif;font-size:2rem;font-weight:400;margin:.25rem 0}
.project-info p{margin-bottom:0}
.gallery-note{margin-top:18px;font-size:.85rem}

.contact{padding:110px clamp(24px,6vw,88px);display:grid;grid-template-columns:.78fr 1.22fr;gap:8vw}
.contact-intro{max-width:520px}
.contact-form{
  display:grid;grid-template-columns:1fr 1fr;gap:18px;
  padding:34px;background:var(--paper);border:1px solid var(--line)
}
.contact-form label{display:flex;flex-direction:column;gap:8px;font-size:.8rem;font-weight:600}
.contact-form .full{grid-column:1/-1}
input,select,textarea{
  width:100%;border:0;border-bottom:1px solid var(--line);
  background:transparent;padding:13px 0;font:inherit;color:var(--ink);outline:none
}
textarea{resize:vertical}
input:focus,select:focus,textarea:focus{border-color:var(--ink)}
.contact-form .btn{justify-self:start;margin-top:8px;background:var(--green);color:white}
.form-note{grid-column:1/-1;font-size:.72rem;margin:0}

footer{
  padding:32px clamp(24px,6vw,88px);border-top:1px solid var(--line);
  display:grid;grid-template-columns:1fr auto auto;gap:30px;align-items:center;font-size:.8rem
}
footer>div:first-child{display:flex;flex-direction:column}
.footer-links{display:flex;gap:18px}
footer p{margin:0}

@media (max-width: 1100px){
  .nav{gap:16px}
}

@media (max-width: 980px){
  .offer-grid.two-up,.offer-grid.three-up{grid-template-columns:1fr 1fr}
  .service-panel{grid-template-columns:1fr}
  .service-visual{min-height:450px}
  .contact{grid-template-columns:1fr}
  .project-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:340px}
}

@media (max-width: 760px){
  .site-header{padding:14px 20px}
  .menu-toggle{display:block}
  .nav{
    position:absolute;left:0;right:0;top:74px;background:var(--bg);
    border-bottom:1px solid var(--line);
    display:none;flex-direction:column;align-items:stretch;gap:0;padding:10px 20px 20px
  }
  .nav.open{display:flex}
  .nav a{padding:12px 0}
  .nav-cta{border:0;padding:12px 0}
  .brand-text{font-size:.95rem}
  .hero{min-height:82vh}
  .hero-content{padding:14vh 22px 7vh}
  .hero-actions{flex-direction:column}
  .hero-actions .btn{width:100%}
  .intro{grid-template-columns:1fr;gap:32px}
  .section{padding:78px 22px}
  .service-content{padding:70px 22px}
  .service-grid{grid-template-columns:1fr}
  .offer-grid.two-up,.offer-grid.three-up{grid-template-columns:1fr}
  .offer-card{min-height:260px}
  .project-grid{grid-template-columns:1fr;grid-auto-rows:330px;margin-top:32px}
  .contact{padding:78px 22px}
  .contact-form{grid-template-columns:1fr;padding:22px}
  .contact-form .full{grid-column:auto}
  .form-note{grid-column:auto}
  footer{grid-template-columns:1fr;gap:14px;padding:28px 22px}
}

@media (max-width: 420px){
  h1{font-size:2.8rem}
  h2{font-size:2rem}
  .brand-text{font-size:.9rem}
  .brand-mark{width:42px;height:42px}
  .bauhinia{width:27px;height:27px}
}


.accompaniment-section{
  background:#eef0e8;
}
.accompaniment-note{
  margin-top:24px;
  padding:18px 22px;
  border:1px solid var(--line);
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:center;
  background:rgba(255,255,255,.38);
}
.accompaniment-note strong{
  font-family:"Libre Caslon Display",Georgia,serif;
  font-size:1.35rem;
  font-weight:400;
}
.accompaniment-note span{
  color:#566158;
  text-align:right;
}
@media (max-width: 1100px){
  .nav{gap:12px;font-size:.84rem}
}
@media (max-width: 760px){
  .accompaniment-note{flex-direction:column;align-items:flex-start}
  .accompaniment-note span{text-align:left}
}


/* --- Conception 2D/3D packages --- */
.conception-packages{
  background:linear-gradient(180deg, #f8f6ef 0%, #f2efe7 100%);
}
.process-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  margin-top:46px;
}
.process-card{
  border:1px solid rgba(23,52,40,.42);
  padding:22px 22px 26px;
  background:rgba(255,255,255,.32);
  min-height:250px;
}
.process-step{
  display:block;
  font-size:.92rem;
  text-transform:uppercase;
  letter-spacing:.04em;
  font-weight:700;
  color:var(--ink);
  margin-bottom:20px;
}
.process-card h3{
  font-family:"DM Sans",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:1.08rem;
  font-weight:600;
  margin-bottom:16px;
}
.process-card p{
  font-size:1rem;
  line-height:1.5;
}

.package-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  margin-top:34px;
}
.package-card{
  position:relative;
  padding:28px 26px 30px;
  background:rgba(255,255,255,.75);
  border:1px solid rgba(23,52,40,.16);
  box-shadow:0 12px 30px rgba(25,49,38,.05);
  border-radius:26px;
  min-height:520px;
  display:flex;
  flex-direction:column;
}
.package-card:before{
  content:"";
  position:absolute;
  top:-18px;
  left:26px;
  width:54px;
  height:54px;
  border-radius:50%;
  background:#8b9569;
  color:white;
  display:grid;
  place-items:center;
  font-family:"Libre Caslon Display", Georgia, serif;
  font-size:1.5rem;
}
.package-card:nth-child(1):before{content:"1";}
.package-card:nth-child(2):before{content:"2"; background:#a39b74;}
.package-card:nth-child(3):before{content:"3"; background:#d38d63;}
.package-card.featured{
  border-color:#c8bea5;
}
.package-card.accent{
  border-color:#e0c1ad;
}
.package-top{
  padding-top:18px;
  text-align:center;
}
.package-kicker{
  display:block;
  font-size:.78rem;
  text-transform:uppercase;
  letter-spacing:.14em;
  color:#6e7464;
  margin-bottom:8px;
}
.package-card h3{
  font-family:"Libre Caslon Display", Georgia, serif;
  font-size:3.35rem;
  line-height:.98;
  margin:0 0 12px;
  font-weight:400;
  color:var(--ink);
  text-align:center;
}
.package-price{
  font-family:"Libre Caslon Display", Georgia, serif;
  font-size:1.9rem;
  line-height:1.1;
  color:#c9774b;
  margin:0 0 22px;
  text-align:center;
}
.package-list{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:12px;
}
.package-list li{
  position:relative;
  padding-left:24px;
  color:#49574f;
}
.package-list li:before{
  content:"";
  position:absolute;
  left:0;
  top:.55em;
  width:10px;
  height:10px;
  border-radius:50%;
  background:#91a27f;
}
.package-note{
  margin-top:auto;
  text-align:center;
  padding-top:22px;
  color:#667269;
  font-style:italic;
}
@media (max-width: 1180px){
  .process-grid,
  .package-grid{
    grid-template-columns:1fr;
  }
  .package-card{
    min-height:auto;
  }
}


.hero{
  background:#173428;
}
.hero-content{
  text-shadow: 0 2px 12px rgba(0,0,0,.18);
}
.hero-copy{
  max-width:700px;
}
.hero-note{
  gap:14px;
}
.hero-note span{
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  padding: 9px 12px;
  border-radius: 999px;
  backdrop-filter: blur(4px);
}
@media (max-width: 760px){
  .hero-bg{
    background-position: 62% center;
  }
  .hero-note span{
    width:100%;
    border-radius:16px;
  }
}


@media (max-width: 760px){
  .visual-maintenance{
    background-position: 58% center;
  }
}


/* --- Navigation active selon la section visible --- */
.nav a[data-section]{
  padding:10px 14px;
  border-radius:999px;
  transition:background-color .22s ease, color .22s ease, opacity .22s ease;
}
.nav a[data-section].active{
  background:var(--green);
  color:#fff;
  opacity:1;
}
.nav a[data-section].active:hover{
  opacity:1;
}
@media (max-width:760px){
  .nav a[data-section]{
    padding:12px 14px;
    border-radius:12px;
  }
}


/* --- Cartes photo pour la section Création --- */
.creation-card{
  padding:0;
  overflow:hidden;
  min-height:auto;
  background:rgba(255,255,255,.72);
}
.creation-photo{
  aspect-ratio: 4 / 3;
  overflow:hidden;
  background:#ddd;
}
.creation-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.creation-content{
  padding:18px 18px 22px;
}
.creation-card h3{
  font-size:1.45rem;
  line-height:1.12;
  margin:8px 0 0;
}
.creation-card .offer-number{
  display:block;
  margin-bottom:4px;
}
@media (max-width:760px){
  .creation-card h3{
    font-size:1.28rem;
  }
}


.project-a .project-info{
  max-width:460px;
}
@media (max-width:760px){
  .project-a{
    background-position: 54% center;
  }
}


.project-c .project-info{
  max-width:440px;
}
@media (max-width:760px){
  .project-c{
    background-position: center 58%;
  }
}


.project-b .project-info{
  max-width:430px;
}
@media (max-width:760px){
  .project-b{
    background-position: center 42%;
  }
}


.project-placeholder{
  background:
    linear-gradient(145deg, rgba(130,147,126,.95), rgba(55,78,63,.98));
  border:1px dashed rgba(255,255,255,.28);
}
.project-placeholder .project-info{
  background:rgba(247,244,235,.88);
}


.project-allee{
  background-image:
    linear-gradient(180deg, rgba(9, 16, 12, .10) 0%, rgba(9, 16, 12, .02) 42%, rgba(9, 16, 12, .34) 100%),
    url('creation-cheminement.jpg');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
.project-allee .project-info{
  max-width: 430px;
}
@media (max-width:760px){
  .project-allee{
    background-position: center center;
  }
}


/* --- Logo floral officiel --- */
.brand-mark{
  width:48px;
  height:48px;
  border:0;
  background:transparent;
  overflow:hidden;
  display:grid;
  place-items:center;
}
.brand-mark img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}
.footer-brand{
  display:flex !important;
  flex-direction:row !important;
  align-items:center;
  gap:12px;
}
.footer-brand > div{
  display:flex;
  flex-direction:column;
}
.footer-logo{
  width:48px;
  height:48px;
  object-fit:contain;
  flex:0 0 auto;
}
@media (max-width:760px){
  .brand-mark{
    width:44px;
    height:44px;
  }
  .footer-logo{
    width:42px;
    height:42px;
  }
}


.project-link{
  text-decoration:none;
  color:inherit;
  cursor:pointer;
  transition:transform .22s ease, box-shadow .22s ease;
}
.project-link:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 34px rgba(25,49,38,.10);
}
.project-link:focus-visible{
  outline:3px solid rgba(23,52,40,.45);
  outline-offset:3px;
}

.project-detail{
  background:var(--paper);
}
.project-detail-hero{
  min-height:62vh;
  display:flex;
  align-items:flex-end;
  padding:100px clamp(24px,6vw,88px) 60px;
  color:#fff;
  background-size:cover;
  background-position:center;
  position:relative;
}
.project-detail-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(8,18,13,.15), rgba(8,18,13,.62));
}
.project-detail-hero > div{
  position:relative;
  z-index:1;
  max-width:900px;
}
.project-detail-hero .eyebrow,
.project-detail-hero p{color:rgba(255,255,255,.82)}
.project-detail-hero h1{
  font-size:clamp(3rem,7vw,6.4rem);
  margin-bottom:1rem;
}
.project-detail-body{
  padding:90px clamp(24px,6vw,88px);
  display:grid;
  grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  gap:8vw;
}
.project-detail-body h2{
  font-size:clamp(2rem,4vw,3.8rem);
}
.project-meta{
  display:grid;
  gap:18px;
  align-content:start;
}
.project-meta > div{
  border-top:1px solid var(--line);
  padding-top:14px;
}
.project-meta strong{
  display:block;
  font-size:.75rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  margin-bottom:5px;
}
.project-gallery{
  padding:0 clamp(24px,6vw,88px) 100px;
}
.project-gallery-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}
.project-gallery-grid img{
  width:100%;
  height:420px;
  object-fit:cover;
  display:block;
}
.project-gallery-placeholder{
  min-height:320px;
  display:grid;
  place-items:center;
  border:1px dashed var(--line);
  color:var(--muted);
  background:rgba(255,255,255,.35);
  text-align:center;
  padding:30px;
}
.back-projects{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-weight:600;
  margin-top:20px;
}
@media (max-width:900px){
  .project-detail-body{grid-template-columns:1fr;gap:40px}
  .project-gallery-grid{grid-template-columns:1fr}
}
@media (max-width:760px){
  .project-detail-hero{min-height:52vh;padding:90px 22px 38px}
  .project-detail-body{padding:70px 22px}
  .project-gallery{padding:0 22px 70px}
  .project-gallery-grid img{height:300px}
}


/* --- Prestations disponibles à distance --- */
.remote-service-note{
  margin-top:28px;
  padding:18px 22px;
  display:flex;
  gap:18px;
  align-items:flex-start;
  border:1px solid rgba(23,52,40,.18);
  background:rgba(169,182,159,.18);
}
.remote-service-note strong{
  flex:0 0 auto;
  color:var(--green);
  font-size:.82rem;
  text-transform:uppercase;
  letter-spacing:.1em;
}
.remote-service-note span{
  color:#566158;
}
@media (max-width:760px){
  .remote-service-note{
    flex-direction:column;
    gap:8px;
  }
}


.project-patio{
  background-image:
    linear-gradient(180deg, rgba(9, 16, 12, .06) 0%, rgba(9, 16, 12, .02) 36%, rgba(9, 16, 12, .24) 100%),
    url('projet-patio-mineral.jpg');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
.project-patio .project-info{
  max-width: 470px;
}
@media (max-width:760px){
  .project-patio{
    background-position: center center;
  }
}


.project-brise-vue{
  background-image:
    linear-gradient(180deg, rgba(9, 16, 12, .04) 0%, rgba(9, 16, 12, .01) 38%, rgba(9, 16, 12, .22) 100%),
    url('projet-massif-brise-vue.jpg');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
.project-brise-vue .project-info{
  max-width: 500px;
}
@media (max-width:760px){
  .project-brise-vue{
    background-position: center center;
  }
}


.project-leognan{
  background-image:
    linear-gradient(180deg, rgba(9, 16, 12, .04) 0%, rgba(9, 16, 12, .01) 38%, rgba(9, 16, 12, .22) 100%),
    url('projet-leognan.jpg');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
.project-leognan .project-info{
  max-width: 500px;
}
@media (max-width:760px){
  .project-leognan{
    background-position: center center;
  }
}


.project-cheminement-paves{
  background-image:
    linear-gradient(180deg, rgba(9,16,12,.08) 0%, rgba(9,16,12,.02) 40%, rgba(9,16,12,.34) 100%),
    url('projet-cheminement-paves.jpg');
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
}
.project-terrasse-paves{
  background-image:
    linear-gradient(180deg, rgba(9,16,12,.08) 0%, rgba(9,16,12,.02) 40%, rgba(9,16,12,.34) 100%),
    url('projet-terrasse-paves.jpg');
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
}
.project-cheminement-paves .project-info,
.project-terrasse-paves .project-info{
  max-width:460px;
}
@media (max-width:760px){
  .project-cheminement-paves{background-position:center 55%;}
  .project-terrasse-paves{background-position:center center;}
}


.project-jardiniere-schiste{
  background-image:
    linear-gradient(180deg, rgba(9,16,12,.08) 0%, rgba(9,16,12,.02) 40%, rgba(9,16,12,.34) 100%),
    url('projet-jardiniere-schiste.jpg');
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
}
.project-jardiniere-schiste .project-info{
  max-width:470px;
}
@media (max-width:760px){
  .project-jardiniere-schiste{
    background-position:center center;
  }
}


.contact-direct{
  margin-top:34px;
  padding-top:24px;
  border-top:1px solid var(--line);
}
.contact-direct-label{
  display:block;
  margin-bottom:8px;
  font-size:.76rem;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:var(--ink);
}
.contact-phone{
  display:inline-block;
  font-family:"Libre Caslon Display", Georgia, serif;
  font-size:clamp(2rem,3vw,3.2rem);
  line-height:1;
  color:var(--green);
  margin-bottom:10px;
}
.contact-phone:hover{
  opacity:.72;
}
.contact-direct p{
  margin:0;
  max-width:420px;
}


/* --- Image d'ambiance Conception --- */
.conception-visual{
  margin:28px 0 42px;
  width:100%;
  height:380px;
  overflow:hidden;
  border:1px solid var(--line);
  background:#d7ded2;
}
.conception-visual img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center 48%;
}
@media (max-width:980px){
  .conception-visual{
    height:320px;
  }
}
@media (max-width:760px){
  .conception-visual{
    height:260px;
    margin:22px 0 32px;
  }
  .conception-visual img{
    object-position:center center;
  }
}


/* --- Image d'ambiance sous « Observer avant d'intervenir » --- */
.intro .observer-visual{
  grid-column:1 / -1;
  margin:24px 0 0;
  height:480px;
  overflow:hidden;
  border:1px solid var(--line);
  background:#1f3529;
}
.observer-visual img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center 48%;
  filter:saturate(.96) contrast(1.02);
}
@media (max-width:980px){
  .intro .observer-visual{
    height:400px;
  }
}
@media (max-width:760px){
  .intro .observer-visual{
    height:460px;
    margin-top:10px;
  }
  .observer-visual img{
    object-position:center center;
  }
}


/* --- Refonte de la section « Observer avant d'intervenir » --- */
.intro.intro-with-image{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(360px,.72fr);
  gap:clamp(40px,7vw,110px);
  align-items:center;
}
.intro-with-image .intro-text{
  display:grid;
  gap:28px;
}
.intro-with-image .intro-copy{
  max-width:680px;
}
.intro-with-image .observer-visual{
  grid-column:auto;
  margin:0;
  height:auto;
  aspect-ratio:3 / 4;
  overflow:hidden;
  border:1px solid var(--line);
  background:#1f3529;
}
.intro-with-image .observer-visual img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center bottom;
  filter:saturate(.96) contrast(1.02);
}
@media (max-width:980px){
  .intro.intro-with-image{
    grid-template-columns:1fr;
  }
  .intro-with-image .observer-visual{
    max-width:620px;
    aspect-ratio:4 / 5;
  }
}
@media (max-width:760px){
  .intro-with-image .observer-visual{
    width:100%;
    max-width:none;
    aspect-ratio:3 / 4;
  }
  .intro-with-image .observer-visual img{
    object-position:center bottom;
  }
}


/* --- Compteurs / chiffres clés --- */
.stats-section{
  padding:72px clamp(24px,6vw,88px);
  background:var(--green);
  color:#fff;
  border-top:1px solid rgba(255,255,255,.08);
}
.stats-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}
.stat-item{
  min-height:190px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
  border:1px solid rgba(255,255,255,.18);
  padding:28px 20px;
}
.stat-number{
  display:block;
  font-family:"Libre Caslon Display", Georgia, serif;
  font-size:clamp(3.8rem,7vw,7rem);
  line-height:.9;
  color:#f4f0e4;
  margin-bottom:14px;
}
.stat-label{
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:.78rem;
  font-weight:600;
  color:rgba(255,255,255,.74);
}
@media (max-width:760px){
  .stats-section{
    padding:56px 22px;
  }
  .stats-grid{
    grid-template-columns:1fr;
  }
  .stat-item{
    min-height:150px;
  }
}


/* --- Page Médoc : documents de conception présentés sobrement --- */
.medoc-gallery{
  grid-template-columns:1.2fr .8fr;
  align-items:start;
}
.medoc-gallery .medoc-main-visual{
  grid-row:span 2;
  height:100%;
  min-height:520px;
}
.medoc-document{
  margin:0;
  border:1px solid var(--line);
  background:rgba(255,255,255,.45);
}
.medoc-document img{
  width:100%;
  height:230px;
  object-fit:contain;
  background:#fff;
  display:block;
}
.medoc-document figcaption{
  padding:10px 12px 12px;
  font-size:.75rem;
  color:var(--muted);
  border-top:1px solid var(--line);
}
@media (max-width:900px){
  .medoc-gallery{
    grid-template-columns:1fr;
  }
  .medoc-gallery .medoc-main-visual{
    grid-row:auto;
    min-height:0;
    height:360px;
  }
  .medoc-document img{
    height:auto;
    max-height:360px;
  }
}


/* --- Page Bordeaux : galerie sobre --- */
.bordeaux-gallery{
  grid-template-columns:1.15fr .85fr;
  align-items:start;
}
.bordeaux-gallery .bordeaux-main-visual{
  grid-row:span 2;
  height:100%;
  min-height:520px;
}
.bordeaux-document{
  margin:0;
  border:1px solid var(--line);
  background:rgba(255,255,255,.45);
}
.bordeaux-document img{
  width:100%;
  height:280px;
  object-fit:cover;
  display:block;
}
.bordeaux-document figcaption{
  padding:10px 12px 12px;
  font-size:.75rem;
  color:var(--muted);
  border-top:1px solid var(--line);
}
@media (max-width:900px){
  .bordeaux-gallery{
    grid-template-columns:1fr;
  }
  .bordeaux-gallery .bordeaux-main-visual{
    grid-row:auto;
    min-height:0;
    height:360px;
  }
  .bordeaux-document img{
    height:auto;
    max-height:420px;
  }
}


/* --- Page Jardin privé : avant / chantier / terrasse finie --- */
.jardin-prive-gallery{
  grid-template-columns:1.15fr .85fr;
  align-items:start;
}
.jardin-prive-gallery figure{
  margin:0;
  border:1px solid var(--line);
  background:rgba(255,255,255,.45);
}
.jardin-prive-gallery img{
  width:100%;
  height:300px;
  object-fit:cover;
  display:block;
}
.jardin-prive-gallery .jardin-prive-main{
  grid-row:span 3;
}
.jardin-prive-gallery .jardin-prive-main img{
  height:100%;
  min-height:720px;
}
.jardin-prive-gallery figcaption{
  padding:10px 12px 12px;
  font-size:.75rem;
  color:var(--muted);
  border-top:1px solid var(--line);
}
@media (max-width:900px){
  .jardin-prive-gallery{
    grid-template-columns:1fr;
  }
  .jardin-prive-gallery .jardin-prive-main{
    grid-row:auto;
  }
  .jardin-prive-gallery .jardin-prive-main img{
    min-height:0;
    height:420px;
  }
  .jardin-prive-gallery img{
    height:auto;
    max-height:460px;
  }
}


/* --- Galeries à une seule image --- */
.project-gallery-grid:has(> img:only-child){
  grid-template-columns:1fr;
  max-width:1100px;
}
.project-gallery-grid:has(> img:only-child) img{
  height:auto;
  max-height:720px;
  object-fit:cover;
}


/* --- Terrasse pavée : avant / après --- */
.terrasse-pavee-before-after{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}
.terrasse-pavee-before-after figure{
  margin:0;
  border:1px solid var(--line);
  background:rgba(255,255,255,.45);
}
.terrasse-pavee-before-after img{
  width:100%;
  height:420px;
  object-fit:cover;
  display:block;
}
.terrasse-pavee-before-after figcaption{
  padding:10px 12px 12px;
  font-size:.75rem;
  color:var(--muted);
  border-top:1px solid var(--line);
}
@media (max-width:760px){
  .terrasse-pavee-before-after{
    grid-template-columns:1fr;
  }
  .terrasse-pavee-before-after img{
    height:auto;
    max-height:520px;
  }
}


/* --- Jardinière maçonnée / brise-vue en schiste : image unique --- */
.schiste-single-gallery{
  grid-template-columns:1fr;
  max-width:1200px;
}
.schiste-single-gallery img{
  width:100%;
  height:auto;
  max-height:820px;
  object-fit:cover;
  display:block;
}


/* --- Aménagement Léognan : galerie de plans et documents --- */
.leognan-gallery{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}
.leognan-gallery figure{
  margin:0;
  background:rgba(255,255,255,.72);
  border:1px solid var(--line);
  padding:14px;
}
.leognan-gallery img{
  width:100%;
  height:auto;
  max-height:540px;
  object-fit:contain;
  display:block;
  background:#fff;
}
.leognan-gallery figcaption{
  margin-top:10px;
  color:var(--muted);
  font-size:.92rem;
}
@media (max-width:900px){
  .leognan-gallery{
    grid-template-columns:1fr;
  }
}


/* --- Massif brise-vue Sud Gironde --- */
.massif-brise-vue-gallery{
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}
.massif-brise-vue-gallery figure{
  margin: 0;
  background: rgba(255,255,255,.72);
  border: 1px solid var(--line);
  padding: 14px;
}
.massif-brise-vue-gallery figure:first-child{
  grid-column: 1 / -1;
}
.massif-brise-vue-gallery img{
  width: 100%;
  height: auto;
  display: block;
  background: #fff;
}
.massif-brise-vue-gallery figcaption{
  margin-top: 10px;
  color: var(--muted);
  font-size: .92rem;
}
@media (max-width: 900px){
  .massif-brise-vue-gallery{
    grid-template-columns: 1fr;
  }
  .massif-brise-vue-gallery figure:first-child{
    grid-column: auto;
  }
}


.leognan-gallery .leognan-wide-visual{
  grid-column:1 / -1;
}
.leognan-gallery .leognan-wide-visual img{
  max-height:none;
  width:100%;
  height:auto;
}
@media (max-width:900px){
  .leognan-gallery .leognan-wide-visual{
    grid-column:auto;
  }
}


/* --- Patio minéral : mise en valeur du croquis --- */
.patio-project-gallery{
  display:block;
}
.patio-croquis-feature{
  position:relative;
  background:#fff;
  border:1px solid var(--line);
  padding:16px;
  margin-bottom:28px;
}
.patio-croquis-feature img{
  width:100%;
  height:auto;
  max-height:none;
  object-fit:contain;
  display:block;
  background:#fff;
}
.patio-croquis-caption{
  display:flex;
  justify-content:space-between;
  gap:24px;
  align-items:flex-start;
  padding:16px 2px 2px;
}
.patio-croquis-caption strong{
  font-family:"Libre Caslon Display",Georgia,serif;
  font-size:1.55rem;
  font-weight:400;
  color:var(--ink);
}
.patio-croquis-caption span{
  max-width:650px;
  color:var(--muted);
}
.patio-secondary-visual{
  max-width:1100px;
}
.patio-secondary-visual figure{
  margin:0;
  background:rgba(255,255,255,.72);
  border:1px solid var(--line);
  padding:14px;
}
.patio-secondary-visual img{
  width:100%;
  height:auto;
  display:block;
  background:#fff;
}
.patio-secondary-visual figcaption{
  margin-top:10px;
  color:var(--muted);
  font-size:.92rem;
}
@media (max-width:760px){
  .patio-croquis-caption{
    flex-direction:column;
    gap:8px;
  }
}


/* =========================================================
   Pages institutionnelles / juridiques
   ========================================================= */
.legal-page{
  background:var(--paper);
}
.legal-page .site-header{
  background:rgba(251,250,245,.94);
}
.legal-nav{
  gap:18px;
}
.legal-hero{
  min-height:46vh;
  display:flex;
  align-items:flex-end;
  padding:120px clamp(24px,6vw,88px) 64px;
  background:
    linear-gradient(135deg, rgba(23,52,40,.98), rgba(29,65,48,.91));
  color:#fff;
}
.legal-hero > div{
  max-width:980px;
}
.legal-hero .eyebrow,
.legal-hero p{
  color:rgba(255,255,255,.78);
}
.legal-hero h1{
  max-width:980px;
  font-size:clamp(3.2rem,7vw,6.4rem);
  margin-bottom:1.2rem;
}
.legal-hero p:last-child{
  max-width:760px;
  font-size:1.08rem;
}
.legal-content{
  padding:90px clamp(24px,6vw,88px) 110px;
}
.about-layout{
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(280px,.55fr);
  gap:8vw;
  align-items:start;
}
.legal-single{
  max-width:1260px;
}
.legal-main{
  max-width:900px;
}
.legal-section{
  padding:0 0 48px;
  margin-bottom:48px;
  border-bottom:1px solid var(--line);
}
.legal-section:last-of-type{
  margin-bottom:24px;
}
.legal-section h2{
  font-size:clamp(2rem,4vw,3.4rem);
  max-width:780px;
}
.legal-section p,
.legal-section li,
.legal-definition dd{
  font-size:1.02rem;
  color:#566158;
}
.legal-section strong{
  color:var(--ink);
}
.legal-aside{
  position:sticky;
  top:110px;
  background:rgba(244,242,234,.72);
  border:1px solid var(--line);
  padding:28px;
}
.legal-fact{
  padding:0 0 18px;
  margin-bottom:18px;
  border-bottom:1px solid var(--line);
}
.legal-fact span{
  display:block;
  font-size:.7rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--muted);
  margin-bottom:5px;
}
.legal-fact strong{
  font-size:1rem;
  font-weight:600;
}
.legal-contact-btn{
  width:100%;
  margin-top:6px;
}
.btn-dark{
  background:var(--green);
  color:#fff;
}
.btn-dark:hover{
  opacity:.9;
}
.legal-definition{
  margin:28px 0 20px;
}
.legal-definition > div{
  display:grid;
  grid-template-columns:230px minmax(0,1fr);
  gap:26px;
  padding:14px 0;
  border-top:1px solid var(--line);
}
.legal-definition dt{
  font-size:.76rem;
  text-transform:uppercase;
  letter-spacing:.09em;
  font-weight:600;
  color:var(--ink);
}
.legal-definition dd{
  margin:0;
}
.legal-alert{
  border-left:3px solid var(--accent);
  background:rgba(215,198,160,.16);
  padding:20px 22px;
}
.legal-alert strong{
  display:block;
  margin-bottom:6px;
}
.legal-alert p{
  margin-bottom:0;
}
.legal-list{
  padding-left:20px;
}
.legal-list li{
  margin-bottom:6px;
}
.inline-link{
  border-bottom:1px solid currentColor;
}
.legal-updated{
  font-size:.82rem;
  color:var(--muted);
}
.footer-links-legal{
  flex-wrap:wrap;
}
.privacy-note a{
  text-decoration:underline;
  text-underline-offset:3px;
}
@media (max-width:1040px){
  .legal-nav a:not(.nav-cta){
    display:none;
  }
}
@media (max-width:900px){
  .about-layout{
    grid-template-columns:1fr;
  }
  .legal-aside{
    position:static;
  }
}
@media (max-width:720px){
  .legal-hero{
    min-height:40vh;
    padding:100px 22px 42px;
  }
  .legal-content{
    padding:64px 22px 76px;
  }
  .legal-definition > div{
    grid-template-columns:1fr;
    gap:4px;
  }
}


/* =========================================================
   Contact / conversion — landing page
   ========================================================= */
.hero-phone-link{
  display:inline-flex;
  align-items:center;
  min-height:48px;
  padding:0 4px;
  font-weight:600;
  letter-spacing:.02em;
  color:#fff;
  border-bottom:1px solid rgba(255,255,255,.55);
}
.hero-phone-link:hover{
  border-color:#fff;
}
.section-contact-actions{
  display:flex;
  flex-wrap:wrap;
  gap:16px 22px;
  align-items:center;
  margin-top:32px;
}
.centered-contact-actions{
  justify-content:center;
  margin-top:38px;
}
.section-phone{
  font-weight:600;
  color:var(--green);
  border-bottom:1px solid rgba(23,52,40,.32);
}
.section-phone:hover{
  border-color:var(--green);
}
.package-card,
.offer-card{
  display:flex;
  flex-direction:column;
}
.package-contact,
.offer-contact{
  display:inline-flex;
  align-items:center;
  margin-top:auto;
  padding-top:18px;
  font-weight:600;
  color:var(--green);
  border-top:1px solid var(--line);
}
.package-contact:hover,
.offer-contact:hover{
  opacity:.72;
}
.package-card .package-note{
  margin-bottom:18px;
}
.offer-card .price{
  margin-bottom:20px;
}
.contact{
  scroll-margin-top:86px;
}
.contact-form{
  position:relative;
}
.contact-form::before{
  content:"Demande de devis / rendez-vous";
  display:block;
  grid-column:1 / -1;
  margin-bottom:2px;
  font-size:.72rem;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:var(--green);
}
.quick-contact{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:80;
  display:flex;
  align-items:stretch;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 15px 42px rgba(13,32,23,.22);
  background:var(--green);
}
.quick-contact-phone{
  display:flex;
  align-items:center;
  gap:10px;
  padding:11px 16px;
  color:#fff;
}
.quick-contact-icon{
  font-size:1.15rem;
}
.quick-contact-copy{
  display:flex;
  flex-direction:column;
  line-height:1.1;
}
.quick-contact-copy small{
  font-size:.65rem;
  text-transform:uppercase;
  letter-spacing:.1em;
  color:rgba(255,255,255,.64);
}
.quick-contact-copy strong{
  margin-top:3px;
  font-size:.92rem;
}
.quick-contact-form{
  display:flex;
  align-items:center;
  padding:0 17px;
  background:#f1ede3;
  color:var(--green);
  font-weight:600;
  white-space:nowrap;
}
.quick-contact a:hover{
  opacity:.91;
}
.contact-choice:focus-visible,
.quick-contact a:focus-visible{
  outline:3px solid rgba(220,198,148,.8);
  outline-offset:-3px;
}
@media (max-width:760px){
  .section-contact-actions{
    align-items:stretch;
    flex-direction:column;
  }
  .section-contact-actions .btn{
    width:100%;
    text-align:center;
    justify-content:center;
  }
  .section-phone{
    align-self:center;
    text-align:center;
  }
  .quick-contact{
    right:12px;
    left:12px;
    bottom:12px;
    width:auto;
  }
  .quick-contact-phone{
    flex:1;
    justify-content:center;
    padding:10px 8px;
  }
  .quick-contact-copy strong{
    font-size:.82rem;
  }
  .quick-contact-form{
    flex:1;
    justify-content:center;
    padding:0 10px;
    font-size:.85rem;
  }
}
@media (max-width:410px){
  .quick-contact-copy small,
  .quick-contact-icon{
    display:none;
  }
}

.contact-field-highlight{
  outline:2px solid rgba(23,52,40,.35);
  outline-offset:4px;
  transition:outline-color .5s ease;
}


/* =========================================================
   Qui sommes-nous — version centrée sur la marque
   ========================================================= */
.brand-about-hero{
  min-height:52vh;
}
.about-brand-page{
  padding:96px clamp(24px,6vw,88px) 110px;
  background:var(--paper);
}
.about-brand-intro{
  display:grid;
  grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  gap:8vw;
  padding-bottom:78px;
  border-bottom:1px solid var(--line);
}
.about-brand-intro h2,
.about-brand-services h2,
.about-brand-territory h2,
.about-brand-cta h2{
  max-width:760px;
}
.about-brand-copy{
  max-width:680px;
  font-size:1.08rem;
}
.about-brand-copy p:last-child{
  margin-bottom:0;
}
.about-pillars{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
  padding:72px 0;
  border-bottom:1px solid var(--line);
}
.about-pillars article{
  padding:28px;
  min-height:260px;
  background:rgba(244,242,234,.62);
  border:1px solid var(--line);
}
.about-pillars span{
  display:block;
  margin-bottom:32px;
  font-family:"Libre Caslon Display",Georgia,serif;
  font-size:2.2rem;
  color:var(--sage);
}
.about-pillars h3{
  font-family:"Libre Caslon Display",Georgia,serif;
  font-size:2rem;
  font-weight:400;
}
.about-brand-services{
  display:grid;
  grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
  gap:8vw;
  padding:78px 0;
  border-bottom:1px solid var(--line);
}
.about-service-list{
  display:grid;
  gap:0;
}
.about-service-list > div{
  display:grid;
  grid-template-columns:190px minmax(0,1fr);
  gap:26px;
  padding:20px 0;
  border-top:1px solid var(--line);
}
.about-service-list strong{
  color:var(--ink);
}
.about-service-list span{
  color:var(--muted);
}
.about-brand-territory{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr);
  gap:8vw;
  padding:78px 0;
  border-bottom:1px solid var(--line);
}
.about-territory-copy{
  max-width:720px;
}
.about-brand-facts{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.about-brand-facts > div{
  padding:20px;
  border:1px solid var(--line);
  background:rgba(244,242,234,.56);
}
.about-brand-facts span{
  display:block;
  margin-bottom:6px;
  font-size:.68rem;
  letter-spacing:.11em;
  text-transform:uppercase;
  color:var(--muted);
}
.about-brand-facts strong{
  font-size:.98rem;
}
.about-brand-cta{
  display:flex;
  justify-content:space-between;
  gap:50px;
  align-items:flex-end;
  padding-top:78px;
}
.about-brand-actions{
  display:flex;
  flex-direction:column;
  gap:14px;
  align-items:flex-start;
  flex:0 0 auto;
}
.about-phone-link{
  font-weight:600;
  border-bottom:1px solid var(--green);
  color:var(--green);
}
.about-legal-note{
  margin:72px 0 0;
  max-width:760px;
  font-size:.82rem;
  color:var(--muted);
}
.about-legal-note a{
  text-decoration:underline;
  text-underline-offset:3px;
}
@media (max-width:900px){
  .about-brand-intro,
  .about-brand-services,
  .about-brand-territory{
    grid-template-columns:1fr;
    gap:38px;
  }
  .about-pillars{
    grid-template-columns:1fr;
  }
  .about-pillars article{
    min-height:0;
  }
  .about-brand-cta{
    flex-direction:column;
    align-items:flex-start;
  }
}
@media (max-width:620px){
  .about-brand-page{
    padding:68px 22px 78px;
  }
  .about-service-list > div{
    grid-template-columns:1fr;
    gap:5px;
  }
  .about-brand-facts{
    grid-template-columns:1fr;
  }
}


/* --- Grand onglet sous Ébauche / Essentiel / Abouti --- */
.conception-big-cta{
  display:flex;
  justify-content:center;
  margin-top:44px;
}
.conception-big-cta-link{
  display:flex;
  align-items:center;
  justify-content:center;
  width:min(820px,100%);
  min-height:88px;
  padding:18px 42px;
  border-radius:999px;
  background:#173428;
  color:#fff;
  font-family:"Libre Caslon Display",Georgia,serif;
  font-size:clamp(2rem,4vw,3.35rem);
  line-height:1;
  text-align:center;
  letter-spacing:.01em;
  box-shadow:0 14px 32px rgba(23,52,40,.12);
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.conception-big-cta-link:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 38px rgba(23,52,40,.18);
  background:#204936;
}
@media (max-width:760px){
  .conception-big-cta{
    margin-top:32px;
  }
  .conception-big-cta-link{
    min-height:70px;
    padding:14px 24px;
    font-size:clamp(1.7rem,8vw,2.5rem);
  }
}


/* --- Bandeau avis Google au-dessus du contact --- */
.google-reviews-band{
  position:relative;
  padding:72px clamp(20px,4vw,64px);
  color:#fff;
  background:
    linear-gradient(180deg, rgba(8,20,15,.54) 0%, rgba(8,20,15,.46) 34%, rgba(8,20,15,.58) 100%),
    url('avis-google-bg.jpg') center center / cover no-repeat;
  overflow:hidden;
}
.google-reviews-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(16,34,27,.14) 0%, rgba(16,34,27,.28) 100%);
  pointer-events:none;
}
.google-reviews-content{
  position:relative;
  z-index:1;
  max-width:1280px;
  margin:0 auto;
}
.google-reviews-head{
  max-width:760px;
  margin-bottom:28px;
}
.google-reviews-band .eyebrow,
.google-reviews-band h2,
.google-reviews-band p,
.google-reviews-band span{
  color:#fff;
}
.google-reviews-head h2{
  margin-bottom:12px;
}
.google-reviews-meta{
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
  font-size:.98rem;
  opacity:.96;
}
.google-stars{
  letter-spacing:.14em;
  color:#f2df90;
  font-size:1.05rem;
}
.google-reviews-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
  margin-bottom:26px;
}
.google-review-card{
  padding:22px 22px 20px;
  border-radius:24px;
  background:rgba(16,29,24,.46);
  border:1px solid rgba(255,255,255,.18);
  backdrop-filter:blur(8px);
  box-shadow:0 14px 30px rgba(5,13,10,.10);
}
.google-review-card p{
  margin:0;
  color:#fff;
  font-size:1rem;
  line-height:1.7;
}
.google-reviews-actions{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
}
.google-reviews-actions .btn-secondary{
  color:#fff;
  border-color:rgba(255,255,255,.55);
  background:rgba(255,255,255,.08);
}
.google-reviews-actions .btn-secondary:hover{
  background:rgba(255,255,255,.16);
}
@media (max-width:980px){
  .google-reviews-grid{
    grid-template-columns:1fr;
  }
  .google-reviews-band{
    padding:58px 20px;
  }
}


/* =========================================================
   Optimisation mobile globale — V59
   ========================================================= */

/* Cibles tactiles et scroll */
html{
  scroll-padding-top:76px;
}
section[id]{
  scroll-margin-top:76px;
}
button,
.btn,
.nav a,
.quick-contact a,
.package-contact,
.offer-contact{
  -webkit-tap-highlight-color:transparent;
}
input,
select,
textarea{
  font-size:16px; /* évite le zoom automatique iOS */
}

/* Tablettes et petits écrans */
@media (max-width: 900px){
  body{
    padding-bottom:72px;
  }

  h1{
    font-size:clamp(3rem,10vw,5.1rem);
    line-height:.96;
  }
  h2{
    font-size:clamp(2.1rem,7vw,3.4rem);
  }

  .site-header{
    padding:12px 18px;
    min-height:70px;
  }
  .brand-mark{
    width:42px;
    height:42px;
  }
  .brand-text{
    font-size:.94rem;
  }
  .menu-toggle{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:64px;
    min-height:42px;
    padding:9px 13px;
    border:1px solid rgba(25,49,38,.22);
    border-radius:999px;
    background:rgba(255,255,255,.46);
    font-weight:600;
    cursor:pointer;
  }

  .nav{
    position:fixed;
    top:70px;
    left:12px;
    right:12px;
    z-index:90;
    max-height:calc(100dvh - 86px);
    overflow:auto;
    display:none;
    flex-direction:column;
    align-items:stretch;
    gap:4px;
    padding:12px;
    border:1px solid var(--line);
    border-radius:20px;
    background:rgba(251,250,245,.98);
    box-shadow:0 22px 50px rgba(15,34,25,.16);
    backdrop-filter:blur(18px);
  }
  .nav.open{
    display:flex;
  }
  .nav a{
    min-height:48px;
    display:flex;
    align-items:center;
    padding:11px 14px;
    border-radius:12px;
  }
  .nav a.active{
    background:var(--green);
    color:#fff;
  }
  .nav-cta{
    margin-top:4px;
    justify-content:center;
    border:0;
    background:var(--green);
    color:#fff;
  }

  .hero{
    min-height:calc(100svh - 70px);
    min-height:calc(100dvh - 70px);
  }
  .hero-content{
    width:100%;
    padding:clamp(72px,14vh,120px) 20px 42px;
  }
  .hero-copy{
    max-width:560px;
    font-size:1rem;
    line-height:1.58;
  }
  .hero-actions{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
    margin-bottom:22px;
  }
  .hero-actions .btn{
    width:100%;
    min-height:52px;
  }
  .hero-phone-link{
    width:100%;
    justify-content:center;
    min-height:46px;
    border:1px solid rgba(255,255,255,.34);
    border-radius:999px;
  }
  .hero-note{
    gap:8px 14px;
    line-height:1.45;
  }

  .section{
    padding:64px 20px;
  }
  .section-heading,
  .section-heading.wide{
    max-width:none;
  }

  .intro.intro-with-image{
    gap:30px;
  }
  .intro-with-image .intro-text{
    gap:18px;
  }
  .intro-with-image .observer-visual{
    aspect-ratio:4 / 5;
  }

  .service-panel{
    min-height:0;
  }
  .service-visual{
    min-height:0;
    height:52vw;
    max-height:420px;
  }
  .service-content{
    padding:58px 20px 64px;
  }
  .service-grid{
    gap:14px;
    margin:30px 0;
  }

  .process-grid,
  .package-grid,
  .offer-grid.two-up,
  .offer-grid.three-up{
    grid-template-columns:1fr;
  }
  .process-grid{
    gap:12px;
    margin-top:30px;
  }
  .process-card{
    min-height:0;
    padding:20px;
  }
  .process-step{
    margin-bottom:10px;
  }
  .package-grid{
    gap:18px;
  }
  .package-card{
    min-height:0;
    padding:30px 22px 24px;
  }
  .package-card:before{
    width:46px;
    height:46px;
    left:22px;
    top:-15px;
  }

  .creation-card .creation-photo{
    aspect-ratio:16 / 10;
  }

  .project-grid{
    grid-template-columns:1fr;
    grid-auto-rows:auto;
    gap:14px;
    margin-top:28px;
  }
  .project-card{
    min-height:310px;
    aspect-ratio:4 / 3;
  }
  .project-info{
    margin:12px;
    padding:16px;
    max-width:calc(100% - 24px);
  }
  .project-info h3{
    font-size:1.65rem;
  }
  .project-info p{
    font-size:.92rem;
    line-height:1.45;
  }

  .stats-section{
    padding:48px 16px;
  }
  .stats-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
  }
  .stat-item{
    min-height:112px;
    padding:16px 8px;
  }
  .stat-number{
    font-size:clamp(2.35rem,10vw,4rem);
    margin-bottom:9px;
  }
  .stat-label{
    font-size:.62rem;
    line-height:1.35;
    letter-spacing:.08em;
  }

  .accompaniment-note{
    align-items:flex-start;
    flex-direction:column;
  }
  .accompaniment-note span{
    text-align:left;
  }

  .conception-big-cta{
    margin-top:28px;
  }
  .conception-big-cta-link{
    min-height:66px;
    padding:15px 20px;
    font-size:clamp(1.75rem,7.8vw,2.6rem);
  }

  .google-reviews-band{
    padding:52px 20px;
    background-position:center 38%;
  }
  .google-reviews-grid{
    grid-template-columns:1fr;
    gap:12px;
  }
  .google-review-card{
    padding:18px;
    border-radius:18px;
  }
  .google-review-card p{
    font-size:.95rem;
    line-height:1.58;
  }
  .google-reviews-actions{
    display:grid;
    grid-template-columns:1fr;
  }
  .google-reviews-actions .btn{
    width:100%;
  }

  .contact{
    padding:64px 20px 92px;
    grid-template-columns:1fr;
    gap:34px;
  }
  .contact-intro{
    max-width:none;
  }
  .contact-direct{
    margin-top:22px;
  }
  .contact-form{
    grid-template-columns:1fr;
    gap:14px;
    padding:20px;
  }
  .contact-form .full,
  .contact-form .form-note{
    grid-column:auto;
  }
  .contact-form .btn{
    width:100%;
    min-height:52px;
    justify-self:stretch;
  }
  textarea{
    min-height:120px;
  }

  footer{
    grid-template-columns:1fr;
    gap:18px;
    padding:30px 20px 94px;
  }
  .footer-links{
    display:flex;
    flex-wrap:wrap;
    gap:10px 16px;
  }

  .quick-contact{
    left:10px;
    right:10px;
    bottom:max(10px, env(safe-area-inset-bottom));
    border-radius:18px;
  }
  .quick-contact-phone,
  .quick-contact-form{
    min-height:52px;
  }

  /* Pages projet */
  .project-detail-hero{
    min-height:46svh;
    padding:92px 20px 34px;
  }
  .project-detail-hero h1{
    font-size:clamp(2.8rem,12vw,4.4rem);
  }
  .project-detail-body{
    padding:56px 20px;
    grid-template-columns:1fr;
    gap:30px;
  }
  .project-gallery{
    padding:0 20px 74px;
  }
  .project-gallery-grid,
  .medoc-gallery,
  .bordeaux-gallery,
  .jardin-prive-gallery,
  .leognan-gallery,
  .massif-brise-vue-gallery{
    grid-template-columns:1fr;
  }
  .project-gallery-grid img{
    height:auto;
    max-height:none;
  }
  .project-gallery figure{
    margin:0;
  }

  /* Pages juridiques / Qui sommes-nous */
  .legal-hero{
    min-height:36svh;
    padding:96px 20px 38px;
  }
  .legal-hero h1{
    font-size:clamp(2.8rem,11vw,4.4rem);
  }
  .legal-content,
  .about-brand-page{
    padding:58px 20px 78px;
  }
  .about-brand-intro,
  .about-brand-services,
  .about-brand-territory{
    grid-template-columns:1fr;
    gap:28px;
    padding-bottom:48px;
  }
  .about-pillars{
    grid-template-columns:1fr;
    padding:48px 0;
  }
  .about-pillars article{
    min-height:0;
    padding:22px;
  }
  .about-brand-services,
  .about-brand-territory{
    padding:48px 0;
  }
  .about-brand-facts{
    grid-template-columns:1fr 1fr;
  }
  .about-brand-cta{
    padding-top:48px;
    flex-direction:column;
    align-items:flex-start;
    gap:24px;
  }
}

/* Téléphones étroits */
@media (max-width: 520px){
  h1{
    font-size:clamp(2.65rem,13.5vw,3.7rem);
  }
  h2{
    font-size:clamp(2rem,10vw,2.7rem);
  }
  p{
    line-height:1.58;
  }

  .site-header{
    padding:10px 14px;
  }
  .brand-mark{
    width:38px;
    height:38px;
  }
  .brand-text{
    font-size:.88rem;
  }
  .menu-toggle{
    min-width:58px;
    min-height:40px;
    padding:8px 11px;
    font-size:.82rem;
  }
  .nav{
    top:62px;
    left:8px;
    right:8px;
    max-height:calc(100dvh - 74px);
  }

  .hero{
    min-height:calc(100svh - 62px);
    min-height:calc(100dvh - 62px);
  }
  .hero-content{
    padding:72px 16px 32px;
  }
  .hero .eyebrow{
    font-size:.66rem;
  }
  .hero-copy{
    font-size:.96rem;
    margin-bottom:18px;
  }
  .hero-note{
    font-size:.74rem;
  }

  .section,
  .service-content{
    padding-left:16px;
    padding-right:16px;
  }
  .service-visual{
    height:66vw;
    max-height:330px;
  }

  .intro-with-image .observer-visual{
    aspect-ratio:1 / 1.18;
  }

  .offer-card,
  .package-card,
  .process-card{
    border-radius:18px;
  }
  .offer-card{
    min-height:0;
    padding:22px 18px;
  }
  .offer-card h3{
    font-size:1.55rem;
  }

  .project-card{
    min-height:280px;
    aspect-ratio:1 / 1;
  }
  .project-info{
    padding:14px;
  }
  .project-info h3{
    font-size:1.5rem;
  }

  .stats-section{
    padding:40px 12px;
  }
  .stat-item{
    min-height:96px;
    padding:12px 5px;
  }
  .stat-number{
    font-size:clamp(2rem,10.5vw,3rem);
  }
  .stat-label{
    font-size:.56rem;
  }

  .google-reviews-band{
    padding:46px 16px;
  }
  .google-reviews-head{
    margin-bottom:20px;
  }
  .google-reviews-meta{
    gap:8px;
    font-size:.84rem;
  }
  .google-review-card{
    background:rgba(16,29,24,.55);
  }

  .contact{
    padding:56px 16px 94px;
  }
  .contact-phone{
    font-size:clamp(1.8rem,9vw,2.5rem);
  }
  .contact-form{
    padding:17px;
  }

  .quick-contact{
    left:8px;
    right:8px;
  }
  .quick-contact-phone{
    padding:8px 10px;
  }
  .quick-contact-form{
    padding:0 12px;
    font-size:.82rem;
  }
  .quick-contact-copy small{
    display:none;
  }
  .quick-contact-copy strong{
    font-size:.78rem;
  }

  footer{
    padding-left:16px;
    padding-right:16px;
  }

  .about-brand-facts{
    grid-template-columns:1fr;
  }
  .legal-definition > div{
    grid-template-columns:1fr;
    gap:5px;
  }
}

/* Très petits téléphones */
@media (max-width: 360px){
  .brand-text{
    display:none;
  }
  .hero h1{
    font-size:2.55rem;
  }
  .quick-contact-phone{
    flex:.9;
  }
  .quick-contact-form{
    flex:1.1;
    font-size:.78rem;
  }
  .quick-contact-icon{
    display:none;
  }
}

@media (max-width:900px){
  body.menu-is-open{
    overflow:hidden;
  }
}


/* --- Photo discrète sur la page Qui sommes-nous --- */
.about-person-visual{
  width:min(980px, 88%);
  margin:58px auto 18px;
}
.about-person-image{
  position:relative;
  height:390px;
  overflow:hidden;
  background:var(--paper);
  -webkit-mask-image:linear-gradient(to bottom, transparent 0%, #000 10%, #000 88%, transparent 100%);
  mask-image:linear-gradient(to bottom, transparent 0%, #000 10%, #000 88%, transparent 100%);
}
.about-person-image::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg, var(--paper) 0%, transparent 10%, transparent 90%, var(--paper) 100%),
    linear-gradient(180deg, rgba(251,250,245,.12) 0%, transparent 30%, transparent 72%, rgba(251,250,245,.16) 100%);
}
.about-person-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 45%;
  display:block;
  filter:saturate(.9) contrast(.96);
}
.about-person-visual figcaption{
  margin-top:8px;
  text-align:center;
  font-size:.72rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--muted);
}
@media (max-width:900px){
  .about-person-visual{
    width:100%;
    margin:38px auto 8px;
  }
  .about-person-image{
    height:300px;
  }
}
@media (max-width:520px){
  .about-person-visual{
    margin-top:28px;
  }
  .about-person-image{
    height:235px;
    -webkit-mask-image:linear-gradient(to bottom, transparent 0%, #000 7%, #000 92%, transparent 100%);
    mask-image:linear-gradient(to bottom, transparent 0%, #000 7%, #000 92%, transparent 100%);
  }
  .about-person-image::after{
    background:
      linear-gradient(90deg, var(--paper) 0%, transparent 5%, transparent 95%, var(--paper) 100%);
  }
  .about-person-visual figcaption{
    font-size:.65rem;
  }
}