/* Bot'Guêpes — feuille de style de la refonte (accueil) */
html{scroll-behavior:smooth}
body{margin:0;background:#FAF8F3}
a{color:#1B1F24}a:hover{color:#5B616A}
.wm{font-family:'Open Sans',system-ui,sans-serif;font-weight:500;letter-spacing:-0.01em;line-height:1}
.wm b{font-weight:500;color:#E0A82E}
.h{font-family:'Archivo',system-ui,sans-serif;font-stretch:80%;letter-spacing:-0.01em}
.ph{background-color:#ECE6D9;background-image:repeating-linear-gradient(135deg,rgba(27,31,36,.04) 0 12px,transparent 12px 24px)}
.navlinks a{color:#3A4048;text-decoration:none;position:relative;padding:6px 0}
.navlinks a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.navlinks a:hover{color:#1B1F24}
.navlinks a:hover::after{transform:scaleX(1)}
.btn{transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s,background-color .25s}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(27,31,36,.14)}
.card{transition:transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .45s,border-color .45s}
.card:hover{transform:translateY(-6px);box-shadow:0 24px 48px rgba(27,31,36,.08);border-color:#D9D1C0}
.ico{background:#F2EDE2;color:#1B1F24;transition:background-color .35s,transform .45s cubic-bezier(.2,.7,.2,1)}
.card:hover .ico{background:var(--accent);transform:rotate(-6deg)}
.guide .ph{transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.guide:hover .ph{transform:scale(1.04)}
.arrow{transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.guide:hover .arrow,.lnk:hover .arrow{transform:translateX(4px)}
.foot a{color:#B9C0C8;text-decoration:none}
.foot a:hover{color:#FFFFFF}
.prog{transform:scaleX(0);transform-origin:left}
.marquee{display:flex;width:max-content}
summary{cursor:pointer;list-style:none}
summary::-webkit-details-marker{display:none}
.pm{transition:transform .35s cubic-bezier(.2,.7,.2,1)}
details[open] .pm{transform:rotate(45deg)}
@media (prefers-reduced-motion: no-preference){
:root{interpolate-size:allow-keywords}
details::details-content{height:0;overflow:clip;transition:height .4s cubic-bezier(.2,.7,.2,1),content-visibility .4s allow-discrete}
details[open]::details-content{height:auto}
.marquee{animation:mq 60s linear infinite}
.marquee:hover{animation-play-state:paused}
@keyframes mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@supports (animation-timeline: view()){
.rv{animation:rv linear both;animation-timeline:view();animation-range:entry 0% cover 28%}
.stg>*{animation:rv linear both;animation-timeline:view();animation-range:entry 0% cover 30%}
.stg>*:nth-child(3n+2){animation-range:entry 6% cover 36%}
.stg>*:nth-child(3n){animation-range:entry 12% cover 42%}
.par{animation:par linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
.hexspin{animation:spin linear both;animation-timeline:scroll(root)}
.prog{animation:grow linear both;animation-timeline:scroll(root)}
.line{transform:scaleX(0);transform-origin:left;animation:grow linear both;animation-timeline:view();animation-range:entry 30% cover 55%}
.pop{animation:pop linear both;animation-timeline:view();animation-range:entry 40% cover 45%}
@keyframes rv{from{opacity:0;transform:translateY(44px)}to{opacity:1;transform:none}}
@keyframes par{from{transform:translateY(-5%)}to{transform:translateY(5%)}}
@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(120deg)}}
@keyframes grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes pop{from{transform:scale(.6);opacity:0}to{transform:scale(1);opacity:1}}
}
}
@media (max-width:900px){.navlinks{display:none !important}.topbar-hide{display:none !important}.float{left:12px !important}}

:root{--accent:#E3A21A}
body{font-family:'Inter',system-ui,sans-serif;color:#1B1F24}
img{max-width:100%}
.burger{display:none;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid #E6E0D3;border-radius:999px;background:#FFFFFF;color:#1B1F24;cursor:pointer}
.menu-mobile{display:flex;flex-direction:column;padding:8px 24px 16px;border-top:1px solid #E6E0D3}
.menu-mobile[hidden]{display:none}
.menu-mobile a{padding:12px 0;text-decoration:none;font-weight:500;border-bottom:1px solid #F2EDE2}
.callbar{display:none}
/* Repli sans scroll-timeline (Firefox) : apparition via IntersectionObserver, voir js/main.js */
@media (prefers-reduced-motion: no-preference){
.io .rv,.io .stg>*{opacity:0;transform:translateY(32px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.io .stg>*:nth-child(3n+2){transition-delay:.08s}
.io .stg>*:nth-child(3n){transition-delay:.16s}
.io .rv.in,.io .stg>*.in{opacity:1;transform:none}
}
@media (max-width:900px){
.burger{display:inline-flex}
header .btn[href^="tel:"]{display:none !important}
.callbar{display:flex;position:fixed;left:12px;right:12px;bottom:12px;z-index:50;justify-content:center;align-items:center;gap:10px;background:#1B1F24;color:#FFFFFF;text-decoration:none;font-weight:600;font-size:16px;min-height:54px;border-radius:999px;box-shadow:0 12px 30px rgba(27,31,36,.25)}
.callbar:hover{color:#FFFFFF}
.callbar svg{color:var(--accent)}
body{padding-bottom:78px}
h1.h{font-size:44px !important}
h2.h{font-size:36px !important}
#contact > div{padding:48px 24px !important}
}

/* Intégration : <picture> transparent pour la mise en page des images */
picture{display:contents}

/* Bandeau des communes : masqué sur ordinateur (la liste complète figure dans « Zone »).
   Sur mobile, si les animations sont désactivées, on n'affiche pas la copie qui sert à la boucle. */
@media (min-width:901px){.bandeau-communes{display:none !important}}
@media (prefers-reduced-motion: reduce){.marquee>span[aria-hidden="true"]{display:none}.marquee{width:auto;overflow-x:auto}}

/* Bulles flottantes Appel + WhatsApp (mobile) — remplacent la barre « Appeler » */
.fabs{display:none}
@media (max-width:900px){
body{padding-bottom:24px}
.fabs{display:flex;flex-direction:column;gap:14px;position:fixed;right:16px;bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:50}
.fab{display:flex;align-items:center;justify-content:center;width:58px;height:58px;border-radius:50%;box-shadow:0 10px 24px rgba(27,31,36,.25);text-decoration:none;transition:transform .25s cubic-bezier(.2,.7,.2,1)}
.fab:hover{transform:scale(1.08)}
.fab-tel{background:var(--accent);color:#1B1F24}
.fab-tel:hover{color:#1B1F24}
.fab-wa{background:#25D366;color:#FFFFFF}
.fab-wa:hover{color:#FFFFFF}
}

/* Bandeau de saison (rempli par js/main.js selon le mois) */
.saison{background:#1B1F24;color:#FFFFFF;font-size:14px;line-height:1.45}
.saison-in{max-width:1240px;margin:0 auto;padding:10px 24px 2px;display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center}
.saison-dot{width:9px;height:9px;border-radius:50%;background:var(--accent);flex:0 0 auto}
.saison-txt{font-weight:600}
.saison-lien{color:var(--accent);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.saison-lien:hover{color:#FFFFFF}
.saison-an{max-width:1240px;margin:0 auto;padding:0 24px 10px 45px;color:#B9C0C8;font-size:13px}
@media (max-width:900px){.saison{font-size:13.5px}.saison-an{padding-left:24px}}

/* Bulles Appel + WhatsApp aussi sur ordinateur */
@media (min-width:901px){
.fabs{display:flex;flex-direction:column;gap:14px;position:fixed;right:28px;bottom:28px;z-index:50}
.fab{display:flex;align-items:center;justify-content:center;width:60px;height:60px;border-radius:50%;box-shadow:0 10px 24px rgba(27,31,36,.25);text-decoration:none;transition:transform .25s cubic-bezier(.2,.7,.2,1)}
.fab:hover{transform:scale(1.08)}
.fab-tel{background:var(--accent);color:#1B1F24}
.fab-tel:hover{color:#1B1F24}
.fab-wa{background:#25D366;color:#FFFFFF}
.fab-wa:hover{color:#FFFFFF}
}