@font-face{font-family:Gloock;font-style:normal;font-weight:400;font-display:swap;src:url("/fonts/gloock-400.woff2") format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:400;font-display:swap;src:url("/fonts/hanken-400.woff2") format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:500;font-display:swap;src:url("/fonts/hanken-500.woff2") format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:600;font-display:swap;src:url("/fonts/hanken-600.woff2") format("woff2")}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400;font-display:swap;src:url("/fonts/jetbrains-400.woff2") format("woff2")}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:500;font-display:swap;src:url("/fonts/jetbrains-500.woff2") format("woff2")}

:root{--bg:#FBFBF7;--bg-2:#F2F4EE;--card:#FFFFFF;--line:#DFE3D9;--ink:#13231A;--mute:#59675D;--green:#1E5631;--green-soft:#1E56311A;--brass:#8A6A2E;--leaf:#3D7436;--ember:#B0522A;--wa:#1F7A44;
--f-display:"Gloock","Iowan Old Style","Georgia",serif;--f-body:"Hanken Grotesk","Segoe UI",system-ui,-apple-system,sans-serif;--f-mono:"JetBrains Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;--w:1180px;--gut:clamp(16px,4vw,40px);color-scheme:light}
*,::before,::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
img{max-width:100%;display:block}
::selection{background:var(--green);color:#fff}
:focus-visible{outline:2px solid var(--green);outline-offset:3px;border-radius:2px}
.wrap{max-width:var(--w);margin-inline:auto;padding-inline:var(--gut)}
.eyebrow{font-family:var(--f-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--brass);margin:0}
h1,h2,h3{font-family:var(--f-display);font-weight:400;text-wrap:balance;margin:0;letter-spacing:-.01em}
h2{font-size:clamp(30px,4.4vw,50px);line-height:1.06}
h3{font-size:24px;line-height:1.2}
p{margin:0}
.lead{color:var(--mute);max-width:60ch;font-size:clamp(17px,1.4vw,19px)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 22px;border:1px solid var(--green);color:#fff;background:var(--green);font:500 15px/1 var(--f-body);letter-spacing:.02em;text-decoration:none;cursor:pointer;transition:background .25s,color .25s,border-color .25s;white-space:nowrap}
.btn:hover{background:transparent;color:var(--green)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn.ghost:hover{border-color:var(--green);color:var(--green)}
.btn.wa{background:var(--wa);border-color:var(--wa)}
.btn.wa:hover{background:transparent;color:var(--wa)}
.btn svg{width:18px;height:18px;flex-shrink:0}
section{padding-block:clamp(60px,8vw,110px)}
section.alt{background:var(--bg-2);border-block:1px solid var(--line)}

/* En-tête */
.top{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--bg) 90%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:12px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand img{width:44px;height:auto}
.brand b{display:block;font:400 22px/1 var(--f-display)}
.brand span{display:block;margin-top:4px;font:500 10px/1 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--brass)}
.nav{display:flex;align-items:center;gap:26px}
.nav a.l{font-size:14px;color:var(--mute);text-decoration:none}
.nav a.l:hover{color:var(--ink)}
.nav .btn{padding:10px 16px;font-size:14px}
@media (max-width:960px){.nav a.l{display:none}}
@media (max-width:420px){.brand span{display:none}.brand b{font-size:19px}}

/* Fil d'Ariane */
.crumbs{padding-top:22px;font:400 12px/1.4 var(--f-mono);letter-spacing:.06em;color:var(--mute)}
.crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.crumbs li+li::before{content:"/";margin-right:6px;color:var(--line)}
.crumbs a{color:var(--green);text-underline-offset:3px}

/* Hero */
.hero{padding-block:clamp(26px,4vw,50px) clamp(50px,7vw,90px)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(30px,5vw,70px);align-items:center}
.hero h1{font-size:clamp(38px,5.6vw,74px);line-height:1.02;margin-block:18px 22px}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.facts{display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:32px;padding-top:20px;border-top:1px solid var(--line);font-size:14px;color:var(--mute)}
.facts strong{color:var(--ink);font-weight:500}
.stars{color:var(--brass);letter-spacing:2px}
.pic{border-radius:999px 999px 3px 3px;overflow:hidden;aspect-ratio:3/4;max-width:380px;justify-self:center;width:100%;background:var(--bg-2);box-shadow:0 40px 60px -30px #13231A55}
.pic img{width:100%;height:100%;object-fit:cover;object-position:50% 35%;transform:scale(1.06)}
@media (max-width:860px){.hero-grid{grid-template-columns:1fr}.pic{max-width:230px;order:-1}}

/* Blocs de contenu */
.cols{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:24px clamp(30px,6vw,90px);align-items:start}
.cols h2{margin-top:14px}
.prose{color:var(--mute);display:grid;gap:16px;max-width:66ch}
.prose strong{color:var(--ink);font-weight:500}
.prose a{color:var(--green);text-underline-offset:3px}
.ticks{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ticks li{padding-left:22px;position:relative;color:var(--ink);font-size:16px}
.ticks li::before{content:"";position:absolute;left:0;top:.8em;width:10px;height:1px;background:var(--brass)}
.note-box{border-left:3px solid var(--brass);background:#8A6A2E12;padding:14px 18px;color:var(--ink);font-size:15px}
@media (max-width:820px){.cols{grid-template-columns:1fr}}

/* Communes */
.towns{list-style:none;margin:0;padding:0;columns:3;column-gap:24px;font-size:15px;color:var(--mute)}
.towns li{padding-block:5px;break-inside:avoid;border-bottom:1px solid var(--line)}
.towns-group+.towns-group{margin-top:34px}
.towns-group h3{font-size:22px;margin-bottom:12px}
@media (max-width:700px){.towns{columns:2}}

/* Déroulé */
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:44px}
.step{border-left:1px solid var(--line);padding:0 22px;display:grid;gap:10px;align-content:start}
.step .n{font:400 54px/1 var(--f-display);color:var(--green)}
.step h3{font-size:22px}
.step p{color:var(--mute);font-size:15px}
@media (max-width:860px){.steps{grid-template-columns:1fr 1fr;row-gap:40px}}
@media (max-width:480px){.steps{grid-template-columns:1fr}}

/* FAQ */
.faq{border-top:1px solid var(--line);margin-top:40px}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:center;padding-block:22px}
.faq summary::-webkit-details-marker{display:none}
.faq summary h3{font-size:clamp(20px,2.2vw,26px);transition:color .25s}
.faq summary:hover h3{color:var(--green)}
.faq .pm{width:36px;height:36px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;transition:transform .35s}
.faq .pm::before{content:"+";font:300 22px/1 var(--f-body);color:var(--green)}
.faq details[open] .pm{transform:rotate(45deg);border-color:var(--green)}
.faq .body{padding-bottom:26px;color:var(--mute);max-width:72ch}

/* Contact */
.contact-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(30px,5vw,80px);align-items:start}
.phone{font:400 clamp(34px,5vw,54px)/1 var(--f-display);color:var(--green);text-decoration:none;display:inline-block;margin-block:22px 16px;white-space:nowrap}
.hours{width:100%;border-collapse:collapse;font-size:15px}
.hours td{padding:11px 0;border-bottom:1px solid var(--line);color:var(--mute)}
.hours td:last-child{text-align:right;font-family:var(--f-mono);font-size:13px}
@media (max-width:860px){.contact-grid{grid-template-columns:1fr}}

/* Voir aussi */
.see{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.see a{display:inline-block;padding:10px 14px;border:1px solid var(--line);background:var(--card);font-size:15px;text-decoration:none;transition:border-color .2s,color .2s}
.see a:hover{border-color:var(--green);color:var(--green)}

/* Pied de page */
footer{border-top:1px solid var(--line);padding-block:46px 40px;color:var(--mute);font-size:13px;line-height:1.7;background:var(--bg-2)}
.foot{display:grid;grid-template-columns:auto minmax(0,1fr);gap:30px;align-items:center}
.foot img{width:90px}
.foot a{color:var(--green);text-underline-offset:3px}
@media (max-width:700px){.foot{grid-template-columns:1fr}}

.wa-float{position:fixed;right:18px;bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:30;display:flex;align-items:center;gap:10px;background:var(--wa);color:#fff;padding:13px 18px 13px 15px;border-radius:999px;box-shadow:0 12px 28px -8px #1F7A4488;text-decoration:none;font:600 14px/1 var(--f-body)}
.wa-float svg{width:20px;height:20px}
@media (max-width:520px){.wa-float span{display:none}.wa-float{padding:14px}#contact{padding-bottom:96px}}
@media (prefers-reduced-motion:reduce){*,::before,::after{transition:none!important;animation:none!important}html{scroll-behavior:auto}}
