/* Racines de Ré - direction éditoriale botanique
   Issue du template retenu (ex templates/template-1-editorial.html, voir git)
   Typo : Fraunces (display serif) + Outfit (texte), chargées dans chaque page */

:root{
  --papier:#f6f1e6; --encre:#22271f; --vert:#3c5638; --terre:#a85b32;
  --ligne:#d8cfba; --gris:#6d6a5e; --fond-doux:#fffdf7;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{font-family:'Outfit',sans-serif;background:var(--papier);color:var(--encre);line-height:1.65;font-size:16px}
h1,h2,h3,.serif{font-family:'Fraunces',serif;font-weight:400;line-height:1.08}
a{color:inherit;text-decoration:none}
img{max-width:100%}
.wrap{max-width:1240px;margin:0 auto;padding:0 32px}
.btn{display:inline-block;background:var(--encre);color:var(--papier);padding:16px 34px;font-weight:500;letter-spacing:.5px;transition:background .2s;cursor:pointer;border:none;font-size:1rem}
.btn:hover{background:var(--terre)}
.btn:active{transform:translateY(1px)}
.btn:focus-visible,a:focus-visible{outline:2px solid var(--terre);outline-offset:3px}
.btn-ligne{background:transparent;color:var(--encre);border:1px solid var(--encre)}
.btn-ligne:hover{background:var(--encre);color:var(--papier)}

/* --- Bandeau crédit d'impôt --- */
.annonce{display:block;background:var(--vert);color:#f0ead8;text-align:center;font-size:.88rem;padding:10px 16px;letter-spacing:.4px}
.annonce b{font-family:'Fraunces',serif;font-style:italic;font-weight:400;font-size:1rem}
.annonce:hover b{color:#fff}

/* --- Header --- */
header{border-bottom:1px solid var(--ligne);position:sticky;top:0;background:rgba(246,241,230,.92);backdrop-filter:blur(8px);z-index:30}
.nav{display:flex;align-items:baseline;justify-content:space-between;padding:20px 32px;max-width:1240px;margin:0 auto;gap:20px;flex-wrap:wrap}
.marque{font-family:'Fraunces',serif;font-size:1.35rem;letter-spacing:.5px}
.marque em{color:var(--terre);font-style:italic}
.marque small{display:block;font-family:'Outfit',sans-serif;font-size:.66rem;letter-spacing:2.5px;text-transform:uppercase;color:var(--gris)}
nav ul{display:flex;gap:34px;list-style:none;flex-wrap:wrap;align-items:baseline}
nav a{font-size:.92rem;letter-spacing:.6px;text-transform:uppercase;padding-bottom:3px;border-bottom:1px solid transparent}
nav a:hover,nav a.active{border-bottom-color:var(--terre);color:var(--terre)}
nav a.nav-tel{font-family:'Fraunces',serif;text-transform:none;font-size:1rem;letter-spacing:.3px;color:var(--vert)}

/* --- Héro accueil : photos en fond, fondu toutes les 3 s --- */
.hero{padding:92px 0 104px;position:relative;overflow:hidden;background:#1b241a}
.hero-fond{position:absolute;inset:0}
.hero-fond .diapo{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;animation:diapo 12s linear infinite}
.hero-fond .d1{background-image:url(../images/jardinier-ile-de-re.jpg);animation-delay:0s}
.hero-fond .d2{background-image:url(../images/tonte-pelouse-ile-de-re.jpg);animation-delay:3s}
.hero-fond .d3{background-image:url(../images/elagage-arbre-ile-de-re.jpg);animation-delay:6s}
.hero-fond .d4{background-image:url(../images/creation-jardin-sec-ile-de-re.jpg);animation-delay:9s}
@keyframes diapo{0%{opacity:0}7%{opacity:1}25%{opacity:1}33%{opacity:0}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.hero-fond .diapo{animation:none}.hero-fond .d1{opacity:1}}
.hero-voile{position:absolute;inset:0;background:linear-gradient(100deg,rgba(23,30,21,.92) 0%,rgba(23,30,21,.78) 45%,rgba(23,30,21,.5) 100%)}
.hero .wrap{display:grid;grid-template-columns:2fr 1fr;gap:64px;align-items:end;position:relative;z-index:1}
.sur-titre{text-transform:uppercase;letter-spacing:4px;font-size:.78rem;color:var(--terre);margin-bottom:22px;display:flex;align-items:center;gap:14px}
.sur-titre::before{content:"";width:44px;height:1px;background:var(--terre)}
.hero .sur-titre{color:#d9a273}
.hero .sur-titre::before{background:#d9a273}
.hero h1{font-size:clamp(2.6rem,6vw,4.6rem);letter-spacing:-1px;margin-bottom:28px;color:#f6f1e6}
.hero h1 em{font-style:italic;color:#d9a273}
.hero p.chapo{font-size:1.12rem;color:#ddd6c6;max-width:52ch;margin-bottom:34px}
.hero-cta{display:flex;gap:16px;flex-wrap:wrap}
.hero .btn{background:var(--terre)}
.hero .btn:hover{background:#c26f42}
.hero .btn-ligne{background:transparent;border-color:#f6f1e6;color:#f6f1e6}
.hero .btn-ligne:hover{background:rgba(246,241,230,.14)}
.hero .reassurance{margin-top:26px;font-size:.85rem;color:#c2bba9;letter-spacing:.4px}
.hero-aside{border-left:1px solid rgba(246,241,230,.28);padding-left:36px;display:flex;flex-direction:column;gap:26px}
.hero .hero-aside{border-color:rgba(246,241,230,.28)}
.hero-aside .chiffre b{display:block;font-family:'Fraunces',serif;font-size:2.4rem;color:#d9a273;line-height:1;font-weight:400}
.hero-aside .chiffre span{font-size:.85rem;color:#c2bba9;letter-spacing:.4px}
.hero-aside .chiffre-sap{display:flex;align-items:center;gap:14px;flex-wrap:nowrap}
.hero-aside .chiffre-sap>div{flex:1;min-width:0}
.hero-aside .sap-mini{width:96px;height:auto;flex:none;background:#f6f1e6;border-radius:8px;padding:7px 9px}
.filigrane{position:absolute;right:-4%;top:-12%;font-family:'Fraunces',serif;font-size:32vw;color:rgba(60,86,56,.05);pointer-events:none;user-select:none;line-height:1}
@media(max-width:860px){.hero .wrap{grid-template-columns:1fr}.hero-aside{border-left:none;border-top:1px solid rgba(246,241,230,.28);padding:26px 0 0;flex-direction:row;flex-wrap:wrap;gap:34px}}

/* --- Photos --- */
.ci .photo-ci{width:100%;max-width:420px;height:auto;display:block;margin-top:30px;border:1px solid var(--ligne)}
.communes-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:56px;align-items:center}
.communes .carte img{width:100%;height:auto;display:block;border:1px solid var(--ligne)}

/* --- Carte interactive --- */
.carte-svg{width:100%;height:auto;display:block;border:1px solid var(--ligne)}
.carte-svg .fil{stroke:#a85b32;stroke-width:1.2;fill:none;opacity:.75}
.carte-svg .communes-svg{font-family:'Outfit',Helvetica,Arial,sans-serif;font-size:13px}
.carte-svg .communes-svg circle{fill:#a85b32;stroke:#2b4030;stroke-width:1.2;transition:transform .2s;transform-box:fill-box;transform-origin:center}
.carte-svg .communes-svg text{fill:#efe9da;transition:fill .15s}
.carte-svg .communes-svg a{cursor:pointer;outline:none}
.carte-svg .communes-svg a:hover circle,.carte-svg .communes-svg a:focus-visible circle{transform:scale(1.7)}
.carte-svg .communes-svg a:hover text,.carte-svg .communes-svg a:focus-visible text{fill:#e8c46a}
.carte-svg .mention{font-family:'Outfit',Helvetica,Arial,sans-serif;font-size:11.5px;font-style:italic;fill:#c2bba9}
.carte-svg .titre-carte{font-family:'Fraunces',Georgia,serif;font-size:34px;font-style:italic;fill:#f6f1e6}
.carte-svg .sous-titre-carte{font-family:'Outfit',Helvetica,Arial,sans-serif;font-size:12.5px;letter-spacing:2px;fill:#c2bba9}
@media(prefers-reduced-motion:reduce){.carte-svg .communes-svg circle{transition:none}}
.groupe .corps{display:grid;grid-template-columns:1.8fr 1fr;gap:48px;align-items:start;margin-top:6px}
.groupe:nth-of-type(even) .corps{grid-template-columns:1fr 1.8fr}
.groupe:nth-of-type(even) .corps .photo{order:-1}
.groupe .photo{margin:0}
.groupe .photo img{width:100%;height:100%;max-height:400px;object-fit:cover;display:block;border:1px solid var(--ligne)}
@media(max-width:860px){
  .communes-grid{grid-template-columns:1fr;gap:28px}
  .groupe .corps,.groupe:nth-of-type(even) .corps{grid-template-columns:1fr;gap:22px}
  .groupe .corps .photo{order:-1}
  .groupe .photo img{height:210px}
}

/* --- En-tête de page intérieure --- */
.page-head{padding:64px 0 56px;border-bottom:1px solid var(--ligne);position:relative;overflow:hidden}
.page-head h1{font-size:clamp(2.2rem,4.6vw,3.4rem);letter-spacing:-1px;margin-bottom:14px}
.page-head h1 em{font-style:italic;color:var(--vert)}
.page-head p{color:var(--gris);font-size:1.08rem;max-width:60ch}

/* --- Crédit d'impôt --- */
.ci{border-top:1px solid var(--ligne);border-bottom:1px solid var(--ligne);padding:76px 0}
.ci .wrap{display:grid;grid-template-columns:1fr 1.2fr;gap:64px;align-items:center}
.ci .geant{font-family:'Fraunces',serif;font-size:clamp(5rem,13vw,10rem);line-height:.9;color:var(--terre);letter-spacing:-4px}
.ci .geant small{display:block;font-size:1.05rem;letter-spacing:2px;text-transform:uppercase;color:var(--encre);font-family:'Outfit',sans-serif;margin-top:14px}
.ci .sap{margin-top:36px;width:200px;height:auto;display:block}
.ci h2{font-size:2rem;margin-bottom:16px}
.ci p{color:var(--gris);margin-bottom:14px;max-width:56ch}
.ci .calc{margin-top:22px;border:1px solid var(--ligne);background:var(--fond-doux)}
.ci .calc div{display:flex;justify-content:space-between;gap:14px;padding:13px 20px;border-bottom:1px solid var(--ligne);font-size:.95rem}
.ci .calc div:last-child{border-bottom:none;background:var(--vert);color:#f0ead8;font-weight:600}
.ci .calc div span:last-child{font-family:'Fraunces',serif;font-size:1.05rem}
.ci .sources{margin-top:22px;font-size:.84rem;color:var(--gris);max-width:60ch}
.ci .sources a{color:var(--terre);text-decoration:underline}
.ci .sources a:hover{color:var(--encre)}
@media(max-width:860px){.ci .wrap{grid-template-columns:1fr}}

/* --- Liste éditoriale de prestations (accueil) --- */
.prestations{padding:84px 0}
.prestations h2{font-size:clamp(2rem,4vw,3rem);margin-bottom:8px}
.prestations .note{color:var(--gris);margin-bottom:44px;max-width:64ch}
.p-item{display:grid;grid-template-columns:80px 1fr 1fr auto;gap:28px;align-items:baseline;padding:30px 0;border-top:1px solid var(--ligne);transition:background .2s;cursor:pointer}
.p-item:last-of-type{border-bottom:1px solid var(--ligne)}
.p-item:hover{background:var(--fond-doux)}
.p-item .num{font-family:'Fraunces',serif;font-style:italic;color:var(--terre);font-size:1.15rem}
.p-item h3{font-size:1.5rem;font-weight:400}
.p-item p{color:var(--gris);font-size:.95rem;max-width:44ch}
.badge{font-size:.72rem;letter-spacing:1.5px;text-transform:uppercase;border:1px solid var(--vert);color:var(--vert);padding:6px 14px;white-space:nowrap;font-family:'Outfit',sans-serif;font-weight:500}
.badge.sp{border-color:var(--terre);color:var(--terre)}
@media(max-width:860px){.p-item{grid-template-columns:48px 1fr;gap:10px}.p-item p{grid-column:2}.p-item .badge{grid-column:2;justify-self:start}}

/* --- Groupes détaillés (page prestations) --- */
.presta-detail{padding:70px 0}
.groupe{margin-bottom:64px}
.groupe:last-of-type{margin-bottom:0}
.groupe .entete{display:flex;align-items:baseline;gap:22px;border-bottom:1px solid var(--encre);padding-bottom:14px;margin-bottom:6px;flex-wrap:wrap}
.groupe .entete .num{font-family:'Fraunces',serif;font-style:italic;color:var(--terre);font-size:1.3rem}
.groupe .entete h2{font-size:clamp(1.7rem,3.2vw,2.4rem)}
.groupe .entete .badge{margin-left:auto}
.groupe .desc{color:var(--gris);font-size:.98rem;margin:16px 0 8px;max-width:64ch}
.groupe .items{display:grid;grid-template-columns:1fr 1fr;column-gap:56px}
.groupe .item{padding:20px 0;border-bottom:1px solid var(--ligne)}
.groupe .item h3{font-size:1.18rem;margin-bottom:4px}
.groupe .item p{color:var(--gris);font-size:.92rem}
.groupe .voir-fiche{margin-top:18px}
.groupe .voir-fiche a{font-family:'Fraunces',serif;font-style:italic;font-size:1.08rem;color:var(--terre);border-bottom:1px solid transparent}
.groupe .voir-fiche a:hover{border-bottom-color:var(--terre)}
.groupe .zones{color:var(--gris);font-size:.9rem;margin-top:26px;padding-top:16px;border-top:1px dashed var(--ligne);max-width:none}
.groupe .zones::before{content:"Communes";display:inline-block;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--terre);font-weight:600;margin-right:14px}
.groupe .zones a{color:var(--vert);border-bottom:1px solid var(--ligne)}
.groupe .zones a:hover{color:var(--terre);border-bottom-color:var(--terre)}
@media(max-width:760px){.groupe .items{grid-template-columns:1fr}.groupe .entete .badge{margin-left:0}}

/* --- Communes --- */
.communes{padding:0 0 84px}
.communes .intro{display:flex;align-items:baseline;gap:24px;margin-bottom:26px;flex-wrap:wrap}
.communes .intro h2{font-size:1.6rem}
.communes .intro span{color:var(--gris);font-size:.9rem}
.ruban{font-family:'Fraunces',serif;font-style:italic;font-size:clamp(1.4rem,3vw,2.2rem);line-height:1.7;color:var(--vert)}
.ruban-petit{font-size:clamp(1rem,1.5vw,1.2rem);line-height:1.9;text-align:center;max-width:900px;margin:0 auto}
.carte-large{max-width:760px;margin:30px auto 24px}
.ruban i{font-style:normal;color:var(--ligne);padding:0 10px}
.ruban a{border-bottom:1px solid transparent}
.ruban a:hover{color:var(--terre);border-bottom-color:var(--terre)}

/* --- Pages commune --- */
.local{padding:70px 0;border-bottom:1px solid var(--ligne)}
.local .wrap{display:grid;grid-template-columns:1.4fr 1fr;gap:64px;align-items:start}
.local h2{font-size:clamp(1.6rem,3vw,2.2rem);margin-bottom:16px}
.local p{color:var(--gris);margin-bottom:14px;max-width:60ch}
.local > .wrap > div p a{color:var(--vert);border-bottom:1px solid var(--ligne)}
.local > .wrap > div p a:hover{color:var(--terre);border-bottom-color:var(--terre)}
.local .photo{margin:28px 0 0}
.local .photo img{width:100%;max-height:400px;object-fit:cover;display:block;border:1px solid var(--ligne)}
.local .encart{border:1px solid var(--ligne);background:var(--fond-doux);padding:28px}
.local .encart h3{font-size:1.15rem;margin-bottom:10px}
.local .encart ul{list-style:none}
.local .encart li{padding:9px 0;border-bottom:1px solid var(--ligne);font-size:.95rem}
.local .encart li:last-child{border-bottom:none}
.local .encart a:hover{color:var(--terre)}
.local .encart .badge{font-size:.62rem;padding:3px 8px}
@media(max-width:860px){.local .wrap{grid-template-columns:1fr}}
.ci-strip{border-bottom:1px solid var(--ligne);padding:36px 0}
.ci-strip .wrap{display:flex;align-items:center;gap:32px;flex-wrap:wrap}
.ci-strip img{width:150px;height:auto;flex:none}
.ci-strip p{color:var(--gris);max-width:64ch;flex:1;min-width:260px}
.ci-strip a{color:var(--terre);text-decoration:underline}
.autres{padding:64px 0}
.autres h2{font-size:clamp(1.5rem,2.6vw,2rem);margin-bottom:26px}
.autres ul{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));border-top:1px solid var(--ligne);border-left:1px solid var(--ligne)}
.autres li{border-right:1px solid var(--ligne);border-bottom:1px solid var(--ligne)}
.autres a{display:flex;align-items:center;justify-content:space-between;gap:10px;height:100%;background:var(--fond-doux);padding:15px 18px;font-size:.95rem;color:var(--encre);transition:background .15s,color .15s}
.autres a::after{content:"→";font-family:'Fraunces',serif;color:var(--terre);opacity:0;transform:translateX(-6px);transition:opacity .15s,transform .15s}
.autres a:hover{background:#fff;color:var(--terre)}
.autres a:hover::after{opacity:1;transform:translateX(0)}

/* --- Formulaire de contact --- */
.contact-bloc{padding:70px 0}
.contact-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:72px}
@media(max-width:860px){.contact-grid{grid-template-columns:1fr}}
.form label{display:block;font-size:.78rem;letter-spacing:1.5px;text-transform:uppercase;font-weight:500;margin:22px 0 8px;color:var(--encre)}
.form input,.form select,.form textarea{width:100%;padding:13px 16px;border:1px solid var(--ligne);background:var(--fond-doux);font-size:1rem;font-family:inherit;color:var(--encre)}
.form input:focus,.form select:focus,.form textarea:focus{outline:2px solid var(--terre);outline-offset:1px}
.form textarea{min-height:130px;resize:vertical}
.form .hint{font-size:.82rem;color:var(--gris);margin-top:12px}
.form .btn{margin-top:24px}
.coordonnees{border-left:1px solid var(--ligne);padding-left:44px}
.coordonnees .ligne{padding:18px 0;border-bottom:1px solid var(--ligne)}
.coordonnees .ligne:first-child{padding-top:0}
.coordonnees b{display:block;font-size:.75rem;letter-spacing:1.8px;text-transform:uppercase;color:var(--terre);font-weight:500;margin-bottom:4px}
.coordonnees span,.coordonnees a{font-family:'Fraunces',serif;font-size:1.15rem}
.coordonnees a:hover{color:var(--terre)}
@media(max-width:860px){.coordonnees{border-left:none;padding-left:0;border-top:1px solid var(--ligne);padding-top:26px}}

/* --- CTA final --- */
.fin{background:var(--encre);color:var(--papier);padding:90px 0}
.fin .wrap{display:grid;grid-template-columns:1.4fr 1fr;gap:48px;align-items:center}
.fin h2{font-size:clamp(2rem,4.4vw,3.4rem);color:var(--papier)}
.fin h2 em{font-style:italic;color:#d9a273}
.fin p{color:#b9b4a4;margin-top:14px;max-width:46ch}
.fin .btn{background:var(--terre);justify-self:start}
.fin .btn:hover{background:#c26f42}
@media(max-width:860px){.fin .wrap{grid-template-columns:1fr}}

/* --- Pages légales --- */
.legal{padding:60px 0}
.legal h2{font-size:1.35rem;margin:32px 0 10px}
.legal p{color:var(--gris);margin-bottom:10px;max-width:70ch}
.legal .avert{background:var(--fond-doux);border:1px solid var(--ligne);color:var(--gris);padding:12px 16px;font-size:.9rem}

/* --- Footer --- */
footer{border-top:1px solid var(--ligne);padding:52px 0 30px}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.2fr;gap:40px;max-width:1240px;margin:0 auto;padding:0 32px 36px}
footer .marque{font-size:1.2rem}
footer p{color:var(--gris);font-size:.9rem;max-width:34ch;margin-top:10px}
footer h4{font-size:.78rem;letter-spacing:1.8px;text-transform:uppercase;color:var(--terre);font-weight:500;margin-bottom:14px;font-family:'Outfit',sans-serif}
footer ul{list-style:none}
footer li{padding:4px 0;font-size:.92rem;color:var(--gris)}
footer li a:hover{color:var(--terre)}
.foot-bottom{border-top:1px solid var(--ligne);max-width:1240px;margin:0 auto;padding:20px 32px 0;font-size:.8rem;color:var(--gris);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.foot-bottom a{text-decoration:underline}
@media(max-width:760px){.foot-grid{grid-template-columns:1fr;gap:28px}.foot-communes{columns:2;column-gap:24px}}

/* --- Mobile (< 760px) : header compact, héro resserré --- */
@media(max-width:760px){
  .wrap{padding:0 20px}
  .annonce{font-size:.76rem;padding:7px 14px}
  .annonce b{font-size:.86rem}
  header .nav{padding:10px 20px;gap:4px 14px;justify-content:flex-start}
  .marque{font-size:1.05rem}
  .marque small{font-size:.56rem;letter-spacing:1.8px}
  nav ul{gap:8px 18px}
  nav a{font-size:.76rem;letter-spacing:.4px}
  .nav-tel{display:none}
  .hero{padding:36px 0 44px}
  .hero h1{font-size:clamp(1.9rem,8.4vw,2.5rem);letter-spacing:-.5px;margin-bottom:18px}
  .hero p.chapo{font-size:1rem;margin-bottom:24px}
  .hero-cta{flex-direction:column;align-items:stretch}
  .hero-cta .btn{text-align:center}
  .hero .reassurance{font-size:.78rem;margin-top:18px}
  .hero-aside{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding-top:22px}
  .hero-aside .chiffre b{font-size:1.7rem}
  .hero-aside .chiffre span{font-size:.74rem}
  .hero-aside .chiffre-sap{grid-column:1/-1;justify-content:space-between}
  .hero-aside .sap-mini{width:86px}
  .page-head{padding:38px 0 34px}
  .page-head h1{font-size:clamp(1.8rem,7.6vw,2.4rem)}
  .sur-titre{margin-bottom:16px;letter-spacing:3px}
  .ci{padding:50px 0}
  .ci .geant{font-size:clamp(3.4rem,17vw,4.6rem);letter-spacing:-2px}
  .ci .sap{width:160px;margin-top:22px}
  .ci h2{font-size:1.6rem}
  .prestations{padding:54px 0}
  .p-item{padding:22px 0}
  .p-item h3{font-size:1.3rem}
  .communes{padding:0 0 54px}
  .ruban{font-size:1.3rem}
  .fin{padding:54px 0}
  .fin .btn{width:100%;text-align:center}
  .local{padding:46px 0}
  .ci-strip{padding:26px 0}
  .autres{padding:42px 0}
  .contact-bloc{padding:42px 0}
  footer{padding:38px 0 22px}
}