:root{--esp:#1E1310;--bx:#53151D;--cr:#F4E8D3;--sable:#EDDFC6;--pap:#FBF6EC;--doux:#CDB89A;--encre:#4A3229;--g:clamp(16px,4vw,64px);color-scheme:light}
*{box-sizing:border-box}body{margin:0;background:var(--cr);color:var(--esp);font:300 17px/1.65 'Funnel Sans',Arial,sans-serif;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}a{color:inherit}h1,h2,h3,p,dl,dd{margin:0}ul{list-style:none;margin:0;padding:0}
:focus-visible{outline:3px solid var(--bx);outline-offset:3px}
.barre{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px var(--g);background:var(--esp);color:var(--cr)}
.logo img{height:40px;width:auto;filter:invert(1) sepia(.2)}.barre nav{display:flex;gap:20px;font:500 14px/1 'IBM Plex Mono',monospace}.barre nav a{text-decoration:none}.barre nav a:hover{text-decoration:underline}
.fil{max-width:1300px;margin:auto;padding:16px var(--g);font:400 13px/1.4 'IBM Plex Mono',monospace;color:var(--encre)}
.hero{position:relative;max-width:1300px;margin:0 auto;padding:0 var(--g);display:grid}
.hero img{width:100%;height:clamp(320px,52vh,560px);object-fit:cover}
.hero__txt{position:relative;margin:-90px 0 0 clamp(0px,3vw,40px);max-width:760px;padding:clamp(22px,3vw,40px);background:var(--bx);color:var(--cr);box-shadow:0 26px 60px rgba(30,19,16,.3)}
.pastille{display:inline-block;padding:7px 14px;border-radius:999px;background:var(--cr);color:var(--bx);font:500 13px/1 'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.06em;transform:rotate(-3deg)}
h1{display:grid;gap:6px;margin-top:16px}.h1-nom{font:400 clamp(24px,min(7.2vw,6vw + 8px),76px)/.95 'Climate Crisis',Impact,sans-serif;text-transform:uppercase;overflow-wrap:anywhere}.h1-sous{font:400 clamp(30px,2.6vw,44px)/1.1 'Mrs Saint Delafield',cursive;color:var(--doux)}
.actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.btn{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 18px;border:1.5px solid var(--cr);border-radius:999px;text-decoration:none;font:500 13px/1 'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.06em}
.btn svg{width:15px;height:15px}.btn--plein{background:var(--cr);color:var(--bx)}.btn:hover{transform:translateY(-2px)}
.corps{max-width:1300px;margin:auto;padding:clamp(48px,6vw,90px) var(--g);display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(32px,5vw,80px);align-items:start}
.texte{display:grid;gap:18px;max-width:38em}.texte h2,.infos h2{font:800 clamp(26px,2.4vw,40px)/1 'Funnel Sans',sans-serif;text-transform:uppercase;letter-spacing:-.03em;color:var(--bx)}
.lead{font-size:clamp(19px,.6vw + 16px,23px);line-height:1.45}
.infos{padding:clamp(22px,2.6vw,36px);background:var(--pap);box-shadow:0 16px 34px rgba(30,19,16,.1);display:grid;gap:16px}
.infos h3{font:500 13px/1 'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.1em;color:var(--bx);padding-top:10px;border-top:1px dashed rgba(30,19,16,.2)}
.liste,.horaires{display:grid;gap:10px}.liste div,.horaires div{display:grid;grid-template-columns:8.5em minmax(0,1fr);gap:12px}
dt{font:500 13px/1.6 'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.04em;color:var(--encre)}dd{font-weight:400}
.a-completer{display:inline-block;padding:2px 8px;border:1.5px dashed var(--bx);color:var(--bx);font:500 13px/1.4 'IBM Plex Mono',monospace}
.lien{font:500 13px/1 'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.06em;color:var(--bx)}
.autres{background:var(--esp);color:var(--cr);padding:clamp(48px,6vw,90px) var(--g)}.autres h2{max-width:1300px;margin:0 auto 24px;font:400 clamp(28px,3.4vw,56px)/1 'Climate Crisis',Impact,sans-serif;text-transform:uppercase}
.autres h2 em{font:400 .55em/1 'Mrs Saint Delafield',cursive;text-transform:none;color:var(--doux);margin-left:.3em}
.autres ul{max-width:1300px;margin:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.autres a{display:flex;align-items:center;gap:14px;padding:12px;border:1px solid rgba(244,232,211,.2);text-decoration:none;transition:background-color .2s}.autres a:hover{background:var(--bx)}
.autres img{width:52px;height:52px;border-radius:50%;object-fit:cover}.autres b{display:block;font:800 18px/1 'Funnel Sans',sans-serif;text-transform:uppercase}.autres small{font:400 13px/1.4 'IBM Plex Mono',monospace;color:var(--doux)}
.pied{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;padding:22px var(--g);background:var(--bx);color:var(--cr);font:400 13px/1.4 'IBM Plex Mono',monospace}
@media (max-width:860px){.corps{grid-template-columns:minmax(0,1fr)}.hero__txt{margin:-60px 12px 0}}
@media (max-width:480px){.liste div,.horaires div{grid-template-columns:minmax(0,1fr);gap:2px}.barre nav{display:none}}
.hero__adr{margin-top:10px;font:400 14px/1.4 'IBM Plex Mono',monospace;color:var(--doux)}
.atouts{display:flex;flex-wrap:wrap;gap:8px}.atouts li{padding:7px 14px;border-radius:999px;border:1.5px solid var(--bx);color:var(--bx);font:500 13px/1.2 'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.04em}
.atouts li:nth-child(odd){background:var(--bx);color:var(--cr)}
.note{font:400 13px/1.45 'IBM Plex Mono',monospace;color:var(--encre)}
.barre{position:relative;min-height:72px}.barre nav{display:none}
.burger-menu summary{list-style:none;width:48px;height:48px;display:grid;place-items:center;border:1px solid var(--cr);border-radius:50%;cursor:pointer}
.burger-menu summary::-webkit-details-marker{display:none}
.burger{position:relative;display:block;width:20px;height:14px}.burger i{position:absolute;left:0;width:100%;height:2px;border-radius:2px;background:var(--cr);transition:transform .3s,opacity .2s,top .3s}
.burger i:nth-child(1){top:0}.burger i:nth-child(2){top:6px;width:70%}.burger i:nth-child(3){top:12px}
.burger-menu[open] summary{background:var(--cr)}.burger-menu[open] .burger i{background:var(--bx)}
.burger-menu[open] .burger i:nth-child(1){top:6px;transform:rotate(45deg)}.burger-menu[open] .burger i:nth-child(2){opacity:0}.burger-menu[open] .burger i:nth-child(3){top:6px;transform:rotate(-45deg)}
.burger-menu[open] nav{display:grid;position:absolute;right:var(--g);top:calc(100% + 8px);z-index:20;min-width:240px;padding:10px;background:var(--bx);box-shadow:0 20px 50px rgba(0,0,0,.4)}
.burger-menu nav a{padding:10px 12px;text-decoration:none;font:800 20px/1 'Funnel Sans',sans-serif;text-transform:uppercase;letter-spacing:-.02em;color:var(--cr)}
.burger-menu nav a:hover{background:rgba(244,232,211,.12)}
.barre{display:grid;grid-template-columns:1fr auto 1fr}.barre .logo{grid-column:2;justify-self:center}.barre .burger-menu{grid-column:3;justify-self:end}
.corps{padding-block:clamp(36px,4vw,64px)}.autres{padding-block:clamp(36px,4vw,64px)}
.commander{background:var(--bx);color:var(--cr);padding:clamp(40px,5vw,72px) var(--g)}
.commander h2{max-width:1300px;margin:0 auto 24px;font:400 clamp(26px,3vw,48px)/1.05 'Climate Crisis',Impact,sans-serif;text-transform:uppercase}
.commander h2 em{font:400 .7em/1 'Mrs Saint Delafield',cursive;text-transform:none;color:var(--doux);margin-left:.2em}
.cmd-grille{max-width:1300px;margin:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.cmd{display:grid;gap:10px;align-content:start;padding:22px;border:1.5px solid rgba(244,232,211,.35);border-radius:18px}
.cmd b{font:800 22px/1 'Funnel Sans',sans-serif;text-transform:uppercase}.cmd p{font-size:15px;color:var(--doux)}.cmd .btn{justify-self:start}
.photos{padding:clamp(40px,5vw,72px) var(--g) clamp(48px,6vw,90px);overflow:hidden}
.photos ul{max-width:1300px;margin:auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,2vw,28px)}
.photos figure{margin:0;padding:10px 10px 0;background:var(--pap);box-shadow:0 16px 34px rgba(30,19,16,.18);transform:rotate(var(--r,-2deg));transition:transform .4s cubic-bezier(.34,1.56,.64,1)}
.photos li:nth-child(2) figure{--r:2deg}.photos li:nth-child(3) figure{--r:-1deg}.photos li:nth-child(4) figure{--r:3deg}.photos figure:hover{transform:rotate(0) scale(1.03)}
.photos img{width:100%;aspect-ratio:1;object-fit:cover}.photos figcaption{text-align:center;padding:.3em 0 .45em;font:400 28px/1 'Mrs Saint Delafield',cursive}
@media (max-width:860px){.cmd-grille{grid-template-columns:minmax(0,1fr)}.photos ul{grid-template-columns:repeat(2,minmax(0,1fr))}}
.btn{white-space:nowrap}
/* haut de page : la photo de la boîte à sa vraie taille, en polaroïd, à côté du texte */
.hero{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,64px);align-items:center;padding-block:clamp(8px,2vw,24px) clamp(24px,3vw,48px)}
.hero > img{width:100%;max-width:500px;height:auto;aspect-ratio:1;object-fit:cover;padding:12px 12px 52px;background:var(--pap);box-shadow:0 26px 60px rgba(30,19,16,.25);transform:rotate(-3deg);justify-self:center}
.hero__txt{margin:0;max-width:none}
@media (max-width:860px){.hero{grid-template-columns:minmax(0,1fr)}.hero > img{max-width:min(360px,82%)}.hero__txt{margin:0}}
.photos img{aspect-ratio:4/5}
.avis-live{background:var(--sable);padding:clamp(40px,5vw,72px) var(--g)}
.avis-live__tete{max-width:1300px;margin:0 auto 22px;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:16px}
.avis-live h2{font:400 clamp(26px,3vw,48px)/1.05 'Climate Crisis',Impact,sans-serif;text-transform:uppercase;color:var(--bx)}
.avis-live__note{display:flex;align-items:center;gap:14px;padding:12px 20px;border:2px solid var(--esp);border-radius:999px;text-decoration:none}
.avis-live__note b{font:400 36px/1 'Climate Crisis',Impact,sans-serif;color:var(--bx)}.avis-live__note span{font:500 12px/1.4 'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.06em}
.avis-live__liste{max-width:1300px;margin:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.avis-live__liste li{display:grid;gap:12px;padding:22px;background:var(--pap);box-shadow:0 10px 26px rgba(30,19,16,.08)}
.avis-live__liste .etoiles{color:var(--bx);letter-spacing:3px}.avis-live__liste blockquote{margin:0;font-style:italic}
.avis-live__liste footer{display:flex;justify-content:space-between;gap:10px;font:400 13px/1.3 'IBM Plex Mono',monospace;color:var(--encre)}.avis-live__liste footer b{font:400 30px/1 'Mrs Saint Delafield',cursive;color:var(--esp)}
@media (max-width:860px){.avis-live__liste{grid-template-columns:minmax(0,1fr)}}
@view-transition{navigation:auto}
::view-transition-group(*){animation-duration:.45s;animation-timing-function:cubic-bezier(.2,.8,.2,1)}
.photos ul:has(> li:nth-child(5)){grid-template-columns:repeat(5,minmax(0,1fr))}.photos li:nth-child(5) figure{--r:-3deg}
@media (max-width:860px){.photos ul:has(> li:nth-child(5)){grid-template-columns:repeat(2,minmax(0,1fr))}.photos ul:has(> li:nth-child(5)) li:nth-child(5){grid-column:1/-1;justify-self:center;width:calc(50% - 7px)}}
.photos figure{padding-bottom:10px}
/* infos pratiques en ticket de caisse */
.infos{--dent:9px;padding:calc(var(--dent) + 22px) clamp(20px,2.4vw,32px);background:var(--pap);box-shadow:none;filter:drop-shadow(0 16px 24px rgba(30,19,16,.18));transform:rotate(-1deg);gap:14px;
-webkit-mask:conic-gradient(from 135deg at top,#0000,#000 1deg 89deg,#0000 90deg) top/calc(2*var(--dent)) 51% repeat-x,conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/calc(2*var(--dent)) 51% repeat-x;
mask:conic-gradient(from 135deg at top,#0000,#000 1deg 89deg,#0000 90deg) top/calc(2*var(--dent)) 51% repeat-x,conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/calc(2*var(--dent)) 51% repeat-x}
.infos h2{font-size:clamp(22px,1.8vw,28px);padding-bottom:12px;border-bottom:1.5px dashed rgba(30,19,16,.3)}
.infos h3{border-top:1.5px dashed rgba(30,19,16,.3);padding-top:14px}
.infos .liste div,.infos .horaires div{grid-template-columns:auto minmax(12px,1fr) auto;align-items:baseline;gap:8px;font:400 14px/1.45 'IBM Plex Mono',monospace}
.infos .liste div::after,.infos .horaires div::after{content:'';grid-column:2;grid-row:1;border-bottom:1.5px dotted currentColor;opacity:.35;transform:translateY(-4px)}
.infos dt{grid-column:1;font-size:13px}.infos dd{grid-column:3;text-align:right;font:400 14px/1.45 'IBM Plex Mono',monospace}
.infos .note{padding-top:12px;border-top:1.5px dashed rgba(30,19,16,.3)}
.infos .lien{justify-self:start;border-bottom:1px solid currentColor;text-decoration:none;padding-bottom:2px}
@media (max-width:480px){.infos .liste div,.infos .horaires div{grid-template-columns:auto minmax(12px,1fr) auto;gap:6px}}
.note-google{display:inline-flex;align-items:center;gap:10px;margin-top:14px;padding:8px 16px;border:1.5px solid var(--cr);border-radius:999px;text-decoration:none;font:500 13px/1 'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.05em}
.note-google[hidden]{display:none}.note-google__et{color:var(--doux);letter-spacing:2px}.note-google b{font:400 20px/1 'Climate Crisis',Impact,sans-serif}
.note-google:hover{background:var(--cr);color:var(--bx)}
html,body{overflow-x:clip}
/* bon à savoir */
.faq{max-width:1300px;margin:auto;padding:clamp(40px,5vw,72px) var(--g);display:grid;gap:0}
.faq h2{margin-bottom:18px;font:400 clamp(26px,3vw,48px)/1.05 'Climate Crisis',Impact,sans-serif;text-transform:uppercase;color:var(--bx)}
.faq details{border-top:1.5px dashed rgba(30,19,16,.3)}.faq details:last-child{border-bottom:1.5px dashed rgba(30,19,16,.3)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:16px;align-items:center;min-height:56px;padding:12px 0;font:800 clamp(17px,1.2vw + 10px,22px)/1.25 'Funnel Sans',sans-serif}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';flex:none;width:32px;height:32px;display:grid;place-items:center;border:1.5px solid var(--bx);border-radius:50%;color:var(--bx);font:400 20px/1 'IBM Plex Mono',monospace;transition:transform .3s}
.faq details[open] summary::after{transform:rotate(45deg);background:var(--bx);color:var(--cr)}
.faq details p{max-width:44em;padding:0 0 18px;color:var(--encre)}
