/* Layout: full-width material bands (brun chaud des photos / kraft / ketchup), left-aligned column, the client's own photography and copy throughout. Single committed look: a food-truck service at dusk, warmed up. */ /* Polices hébergées sur le site (plus de chargement depuis Google Fonts) */ @font-face{font-family:'DM Serif Display';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/dm-serif-display-latin-ext-400-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF} @font-face{font-family:'DM Serif Display';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/dm-serif-display-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD} @font-face{font-family:'Rubik';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/rubik-latin-ext-400-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF} @font-face{font-family:'Rubik';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/rubik-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD} @font-face{font-family:'Rubik';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/rubik-latin-ext-500-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF} @font-face{font-family:'Rubik';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/rubik-latin-500-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD} @font-face{font-family:'Rubik';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/rubik-latin-ext-700-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF} @font-face{font-family:'Rubik';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/rubik-latin-700-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD} :root{ --brun:#3A2619; --brun-2:#4A3224; --brun-3:#5C4133; --brun-line:#6B4E3D; --rgb-brun:58,38,25; --rgb-brun2:74,50,36; --rgb-encre:42,26,16; --photo-bg:#2E1407; --kraft:#EFDCBC; --kraft-2:#DCC49C; --encre:#2A1A10; --encre-2:#6A4D3A; --ketchup:#E86010; --ketchup-2:#C24F0A; --orange-text:#A8440A; --cheddar:#F3AD3F; --mesclun:#7BA656; --creme:#FCF3E3; --creme-2:#EAD8BC; --bun:#E2A054; --bun-2:#C97B33; --display:'DM Serif Display','Playfair Display',Georgia,'Times New Roman',serif; --body:'Rubik','Segoe UI',Arial,sans-serif; color-scheme:dark; } *{box-sizing:border-box} [hidden]{display:none!important} html{scroll-behavior:smooth} body{margin:0;background:var(--brun);color:var(--creme);font-family:var(--body);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden} /* zones sûres (encoche, barre du bas) : prises en compte uniquement en mode appli installée. Dans un navigateur, ces valeurs changent quand la barre d'outils se replie (Chrome iOS surtout) et faisaient sauter la page et les fenêtres pendant la saisie. */ :root{--sat:0px;--sab:0px} @media (display-mode:standalone){:root{--sat:env(safe-area-inset-top,0px);--sab:env(safe-area-inset-bottom,0px)}} /* appli installée (plein écran) : la barre d'état est couverte par un bandeau fixe, et la page commence dessous */ body{padding-top:var(--sat)} body::before{content:"";position:fixed;inset:0 0 auto;height:var(--sat);z-index:60;background:var(--brun)} h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.08;margin:0;text-wrap:balance;letter-spacing:-.012em} h2{font-size:clamp(1.9rem,4.2vw,3.1rem)} h3{font-size:1.35rem} p{margin:0} a{color:inherit} img{max-width:100%;display:block} :focus-visible{outline:3px solid var(--cheddar);outline-offset:3px;border-radius:4px} .wrap{max-width:1140px;margin-inline:auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))} .band{padding-block:clamp(56px,9vw,112px)} .band--kraft{background:var(--kraft);color:var(--encre);background-image:radial-gradient(rgba(255,255,255,.22) 1px,transparent 1.5px),radial-gradient(rgba(60,30,10,.07) 1px,transparent 1.5px);background-size:7px 7px,11px 11px;background-position:0 0,4px 6px} .band--ketchup{background:var(--ketchup);color:var(--creme)} .lede{font-size:clamp(1.05rem,1.6vw,1.22rem);max-width:62ch;color:var(--creme-2)} .band--kraft .lede{color:var(--encre-2)} .stack{display:grid;gap:16px} .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font:500 1rem var(--body);padding:14px 22px;border-radius:999px;border:2px solid transparent;text-decoration:none;cursor:pointer;transition:transform .18s ease,background-color .18s ease,color .18s ease,border-color .18s ease} .btn:active{transform:translateY(1px)} .btn--primary{background:var(--ketchup);color:#2A1A10;border-color:var(--ketchup)} .btn--primary:hover{background:var(--ketchup-2);border-color:var(--ketchup-2)} .btn--ghost{background:transparent;color:var(--creme);border-color:var(--creme-2)} .btn--ghost:hover{background:var(--creme);color:var(--brun)} .btn--creme{background:var(--creme);color:var(--orange-text);border-color:var(--creme)} .btn--creme:hover{background:var(--creme-2);border-color:var(--creme-2)} /* ---------- nav ---------- */ .nav{position:sticky;top:var(--sat);z-index:50;background:rgba(var(--rgb-brun),.9);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--brun-line)} .nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:66px} .brand{font-family:var(--display);font-size:1.15rem;text-decoration:none;color:var(--creme);display:flex;align-items:center;gap:10px;white-space:nowrap} .brand__bun{width:22px;height:14px;border-radius:50% 50% 25% 25%/90% 90% 25% 25%;background:linear-gradient(var(--bun),var(--bun-2));position:relative;flex:none} .brand__bun::after{content:"";position:absolute;inset:4px 6px auto 6px;height:3px;background:var(--cheddar);border-radius:2px} .nav__links{display:flex;gap:24px;list-style:none;margin:0;padding:0} .nav__links a{text-decoration:none;color:var(--creme-2);font-weight:500;font-size:.95rem;white-space:nowrap} .nav__links a:hover{color:var(--creme)} .nav__right{display:flex;align-items:center;gap:14px} .pill{display:inline-flex;align-items:center;gap:8px;font-size:.88rem;color:var(--creme-2);text-decoration:none;padding:7px 12px;border:1px solid var(--brun-line);border-radius:999px;white-space:nowrap} .pill:hover{border-color:var(--cheddar);color:var(--creme)} .pill i{width:8px;height:8px;border-radius:50%;background:var(--mesclun);flex:none} .pill.is-off i{background:var(--cheddar)} .nav .btn{padding:10px 18px;font-size:.95rem} @media (max-width:1180px){.pill{display:none}} @media (max-width:760px){.nav__links{display:none}} /* ---------- hero ---------- */ .hero{position:relative;overflow:hidden;background: radial-gradient(60% 55% at 78% 30%,rgba(243,173,63,.18),transparent 70%), radial-gradient(45% 45% at 8% 95%,rgba(214,64,47,.12),transparent 70%), linear-gradient(180deg,var(--brun-2),var(--brun))} .lights{position:absolute;left:0;right:0;top:0;height:70px;pointer-events:none} .lights svg{position:absolute;inset:0;width:100%;height:70px} .bulb{position:absolute;width:13px;height:19px;margin-left:-6px;border-radius:50% 50% 50% 50%/42% 42% 58% 58%;background:radial-gradient(circle at 40% 35%,#FFE6B0,var(--cheddar) 60%,#D9862A);box-shadow:0 0 14px 3px rgba(243,173,63,.55),0 0 30px 8px rgba(243,173,63,.2);animation:glow 2.8s ease-in-out infinite alternate;animation-delay:calc(var(--d) * -.43s)} .bulb::before{content:"";position:absolute;left:3px;right:3px;top:-5px;height:6px;background:#6B4E3D;border-radius:2px 2px 0 0} @keyframes glow{from{opacity:.72;filter:brightness(.9)}to{opacity:1;filter:brightness(1.18)}} @media (max-width:640px){.bulb:nth-child(2n){display:none}} .hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,5vw,64px);align-items:center;padding-top:clamp(76px,10vw,112px);padding-bottom:clamp(48px,7vw,80px)} @media (max-width:900px){.hero .wrap{grid-template-columns:1fr;padding-top:90px}} .hero__kicker{color:var(--cheddar);font-weight:500;font-size:1rem;letter-spacing:.02em} .hero h1{font-size:clamp(2.9rem,7.2vw,5.4rem);line-height:.98;margin-top:10px;margin-bottom:18px} .hero h1 .h1-sub{display:block;font-family:var(--body);font-weight:500;font-size:clamp(1.05rem,1.8vw,1.3rem);line-height:1.35;color:var(--creme-2);margin-top:16px;letter-spacing:0;max-width:34ch} .claims{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px;list-style:none;padding:0} .claims li{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border:1px solid var(--brun-line);border-radius:999px;background:rgba(var(--rgb-brun2),.6);font-weight:500;font-size:.95rem} .claims li::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--cheddar)} .hero__cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px} .tonight{margin-top:30px;display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:center;padding:16px 18px;border:1px solid var(--brun-line);border-radius:14px;background:rgba(var(--rgb-brun2),.78);max-width:560px} .tonight__dot{width:14px;height:14px;border-radius:50%;background:var(--mesclun);animation:pulse 2s ease-out infinite} .tonight__dot.is-off{background:var(--cheddar);animation:none} @keyframes pulse{0%{box-shadow:0 0 0 0 rgba(123,166,86,.55)}100%{box-shadow:0 0 0 14px rgba(123,166,86,0)}} .tonight__title{font-weight:700;font-size:1.05rem} .tonight__text{color:var(--creme-2);font-size:.98rem} .tonight__text a{color:var(--cheddar)} /* ---------- photo showcase ---------- */ .show{position:relative;aspect-ratio:1/1;max-width:100%;border-radius:22px;overflow:hidden;background:var(--photo-bg);box-shadow:0 30px 70px -30px rgba(0,0,0,.75),0 0 0 1px var(--brun-line)} .show figure{position:absolute;inset:0;margin:0;opacity:0;transition:opacity 1.1s ease} .show figure img{width:100%;height:100%;object-fit:cover;transform:scale(1.08);transition:transform 6s ease-out} .show figure.is-on{opacity:1;z-index:1} .show figure.is-on img{transform:scale(1)} .show figcaption{position:absolute;left:16px;bottom:16px;right:16px;z-index:2;display:flex;justify-content:space-between;align-items:end;gap:12px;pointer-events:none} .show .chip{background:rgba(var(--rgb-encre),.86);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid var(--brun-line);border-radius:12px;padding:10px 14px;color:var(--creme);font-family:var(--display);font-size:1.15rem;line-height:1.1} .show .chip small{display:block;font-family:var(--body);font-size:.82rem;color:var(--creme-2);margin-top:3px;font-weight:500} .show .chip.price{font-size:1rem;color:var(--cheddar);padding:10px 12px;white-space:nowrap} .show__dots{position:absolute;top:14px;right:14px;z-index:3;display:flex;gap:6px} .show__dots button{width:10px;height:10px;border-radius:50%;border:0;padding:0;background:rgba(252,243,227,.4);cursor:pointer;transition:background .2s ease,transform .2s ease} .show__dots button.is-on{background:var(--cheddar);transform:scale(1.25)} .show__nav{position:absolute;top:50%;z-index:3;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;border:1px solid var(--brun-line);background:rgba(var(--rgb-encre),.7);color:var(--creme);cursor:pointer;font-size:1.1rem;display:grid;place-items:center;opacity:0;transition:opacity .25s ease} .show:hover .show__nav,.show:focus-within .show__nav{opacity:1} .show__nav.prev{left:12px}.show__nav.next{right:12px} @media (hover:none){.show__nav{opacity:1}} /* ---------- ticker ---------- */ .ticker{border-top:1px solid var(--brun-line);border-bottom:1px solid var(--brun-line);background:var(--brun-2);overflow:hidden;white-space:nowrap;padding-block:12px} .ticker__track{display:inline-flex;animation:scroll 28s linear infinite;will-change:transform} .ticker:hover .ticker__track{animation-play-state:paused} .ticker__item{display:inline-flex;align-items:center;gap:22px;padding-right:22px;font-family:var(--display);font-size:1.05rem;color:var(--creme-2)} .ticker__item i{display:inline-block;width:9px;height:6px;border-radius:50%;background:var(--cheddar);transform:rotate(-25deg)} @keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}} /* ---------- menu ---------- */ .section-head{display:grid;gap:12px;margin-bottom:clamp(28px,4vw,48px);max-width:72ch} .menu{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px} @media (max-width:980px){.menu{grid-template-columns:repeat(2,minmax(0,1fr))}} @media (max-width:600px){.menu{grid-template-columns:1fr}} .dish{position:relative;background:rgba(255,255,255,.34);border:1.5px solid var(--kraft-2);border-radius:18px;overflow:hidden;display:grid;grid-template-rows:auto 1fr;min-width:0} .dish--featured{grid-column:span 2} .dish--wide{grid-column:span 2} @media (max-width:980px){.dish--wide{grid-column:auto}} @media (max-width:600px){.dish--featured{grid-column:auto}} .dish__img{position:relative;aspect-ratio:1/1;overflow:hidden;background:var(--photo-bg)} .dish--featured .dish__img{aspect-ratio:16/10} @media (min-width:981px){.dish--wide .dish__img{aspect-ratio:16/10}} @media (max-width:600px){.dish--featured .dish__img{aspect-ratio:1/1}} .dish__img img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease} .dish:hover .dish__img img{transform:scale(1.04)} .dish__price{position:absolute;top:14px;left:14px;background:var(--ketchup);color:#2A1A10;font-family:var(--display);font-size:1rem;padding:6px 12px;border-radius:999px;box-shadow:0 6px 16px -6px rgba(0,0,0,.5)} .dish__body{padding:18px 20px 22px;display:grid;gap:8px;align-content:start} .dish h3{font-size:clamp(1.45rem,2.2vw,1.8rem);color:var(--encre)} .dish--featured h3{font-size:clamp(1.7rem,2.8vw,2.3rem)} .dish .tag{color:var(--orange-text);font-size:.98rem;font-weight:500} .dish .ing{color:var(--encre);font-size:.98rem;line-height:1.5} .dish .vg{justify-self:start;font-size:.82rem;font-weight:500;padding:3px 10px;border:1.5px solid var(--encre-2);border-radius:999px;color:var(--encre-2);margin-top:4px} .menu-note{margin-top:28px;color:var(--encre-2);max-width:72ch} /* ---------- ardoise (tarifs) ---------- */ .ardoise{margin-top:clamp(40px,6vw,72px);background:var(--brun-2);color:var(--creme);border-radius:18px;padding:clamp(24px,4vw,44px);box-shadow:0 20px 50px -20px rgba(var(--rgb-encre),.5),inset 0 0 0 1px var(--brun-line);background-image:radial-gradient(rgba(255,255,255,.04) 1px,transparent 1.4px);background-size:9px 9px} .ardoise__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:34px;margin-top:28px} @media (max-width:860px){.ardoise__grid{grid-template-columns:1fr}} .ardoise h3{color:var(--cheddar);font-size:1.3rem;margin-bottom:14px} .price-list{list-style:none;margin:0;padding:0;display:grid;gap:10px} .price-list li{display:flex;align-items:baseline;gap:10px;font-size:1rem} .price-list .lead{flex:1;border-bottom:2px dotted var(--brun-line);transform:translateY(-5px);min-width:14px} .price-list .p{font-family:var(--display);font-size:1.15rem;color:var(--creme);font-variant-numeric:tabular-nums;white-space:nowrap} .price-list .big .p{font-size:1.5rem;color:var(--cheddar)} .price-list small{display:block;color:var(--creme-2);font-size:.88rem;margin-top:2px} .nouveau{display:inline-block;background:var(--cheddar);color:#2A1A10;font-size:.72rem;font-weight:700;padding:2px 7px;border-radius:4px;margin-right:8px;letter-spacing:.04em;vertical-align:middle} .ardoise__foot{margin-top:28px;padding-top:20px;border-top:1px solid var(--brun-line);color:var(--creme-2);max-width:72ch} .ardoise__foot b{color:var(--creme)} /* ---------- emplacements ---------- */ .week{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px} @media (max-width:960px){.week{grid-template-columns:repeat(2,minmax(0,1fr))}} @media (max-width:520px){.week{grid-template-columns:1fr}} .ticket{position:relative;background:var(--brun-2);border:1px solid var(--brun-line);border-radius:14px;padding:22px 20px 20px;display:grid;gap:8px;align-content:start;transition:border-color .25s ease,transform .25s ease} .ticket__day{font-family:var(--display);font-size:1.7rem;color:var(--cheddar)} .ticket__hours{color:var(--creme-2);font-size:.95rem;margin-top:-4px} .ticket h3{font-family:var(--body);font-weight:700;font-size:1.15rem;margin-top:8px;line-height:1.3} .ticket__place{color:var(--creme-2);font-size:.95rem;line-height:1.45} .ticket__place a{color:var(--cheddar);font-weight:500;text-decoration:none} .ticket__place a:hover{text-decoration:underline} .ticket__flag{display:none;position:absolute;top:-12px;right:14px;background:var(--mesclun);color:var(--brun);font-weight:700;font-size:.78rem;padding:4px 10px;border-radius:999px} .ticket.is-today{border-color:var(--mesclun);box-shadow:0 0 0 1px var(--mesclun),0 18px 40px -22px rgba(123,166,86,.6);transform:translateY(-4px)} .ticket.is-next{border-color:var(--cheddar)} .ticket.is-today .ticket__flag,.ticket.is-next .ticket__flag{display:block} .ticket.is-next .ticket__flag{background:var(--cheddar)} .week-note{margin-top:28px;color:var(--creme-2);max-width:72ch} .week-note a{color:var(--cheddar)} /* ---------- privatisation ---------- */ .priv .wrap{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(28px,5vw,72px);align-items:start} @media (max-width:860px){.priv .wrap{grid-template-columns:1fr}} .priv h2{font-size:clamp(2rem,4.6vw,3.4rem)} .priv p{color:var(--creme);max-width:62ch} .priv .hero__cta{margin-top:26px} .priv .btn--ghost{border-color:rgba(252,243,227,.6)} .priv .btn--ghost:hover{background:var(--creme);color:var(--ketchup-2)} .pillars{display:grid;gap:22px;border-left:3px solid rgba(252,243,227,.45);padding-left:22px} .pillars h3{font-size:1.3rem} .pillars p{font-size:.98rem;margin-top:6px;color:var(--creme-2)} .more{margin-top:34px;display:flex;flex-wrap:wrap;gap:10px 22px;font-size:.95rem} .more a{color:var(--creme);text-decoration:underline;text-underline-offset:3px} /* ---------- à propos ---------- */ .about{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:clamp(28px,5vw,72px);align-items:start} @media (max-width:860px){.about{grid-template-columns:1fr}} .about .prose{display:grid;gap:16px;max-width:62ch} .about .prose a{color:var(--orange-text)} .towns{display:flex;flex-wrap:wrap;gap:10px;list-style:none;margin:0;padding:0} .towns a{display:inline-block;padding:8px 14px;border:1.5px solid var(--encre-2);border-radius:999px;text-decoration:none;font-weight:500;color:var(--encre)} .towns a:hover{background:var(--encre);color:var(--kraft)} .guarantees{display:grid;gap:14px;position:sticky;top:90px} .guarantees>p{color:var(--encre-2);font-size:.98rem} .g{background:rgba(255,255,255,.3);border:1.5px solid var(--kraft-2);border-radius:14px;padding:18px 20px;display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center} .g__ico{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--encre);position:relative} .g__ico.bun::after{content:"";width:24px;height:14px;border-radius:50% 50% 25% 25%/90% 90% 25% 25%;background:linear-gradient(var(--bun),var(--bun-2))} .g__ico.fr::after{content:"";width:24px;height:16px;background:linear-gradient(90deg,#1F4B9E 33%,var(--creme) 33% 66%,var(--ketchup) 66%);border-radius:2px} .g__ico.fries::after{content:"";width:22px;height:18px;background:repeating-linear-gradient(90deg,var(--cheddar) 0 4px,transparent 4px 7px);border-bottom:6px solid var(--ketchup)} .g h3{font-size:1.1rem;font-family:var(--body);font-weight:700} .g p{font-size:.92rem;color:var(--encre-2);margin-top:2px} .closing{margin-top:clamp(40px,6vw,72px);font-family:var(--display);font-size:clamp(1.7rem,4vw,2.8rem);line-height:1.15;max-width:22ch} .closing span{color:var(--orange-text)} /* ---------- footer ---------- */ .foot{border-top:1px solid var(--brun-line);padding-block:48px calc(36px + var(--sab));color:var(--creme-2);font-size:.94rem} .foot__grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:32px} @media (max-width:820px){.foot__grid{grid-template-columns:1fr}} .foot h3{font-size:1.1rem;color:var(--creme);margin-bottom:12px} .foot ul{list-style:none;margin:0;padding:0;display:grid;gap:8px} .foot a{color:var(--creme-2);text-decoration:none} .foot a:hover{color:var(--cheddar)} .foot .brand{margin-bottom:12px} .partners{display:flex;flex-wrap:wrap;gap:8px 20px;list-style:none;margin:10px 0 0;padding:0} .partners a{border-bottom:1px solid var(--brun-line)} .partners a:hover{border-color:var(--cheddar)} .foot__row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:36px;padding-top:18px;border-top:1px solid var(--brun-line)} /* ---------- dialog / form ---------- */ dialog{border:0;padding:0;background:transparent;max-width:min(600px,calc(100% - 32px));width:100%;margin:auto} dialog::backdrop{background:rgba(20,12,8,.72);backdrop-filter:blur(3px)} dialog[open]{animation:pop .3s cubic-bezier(.2,.9,.3,1.1)} @keyframes pop{from{transform:translateY(16px) scale(.98);opacity:0}to{transform:none;opacity:1}} .sheet{background:var(--brun-2);color:var(--creme);border:1px solid var(--brun-line);border-radius:18px;padding:clamp(22px,4vw,34px);max-height:calc(100dvh - 48px);overflow:auto} .sheet__head{display:flex;justify-content:space-between;align-items:start;gap:16px;margin-bottom:6px} .sheet h2{font-size:1.7rem} .sheet .lede{font-size:.98rem;margin-bottom:20px} .x{background:transparent;border:1px solid var(--brun-line);color:var(--creme);width:38px;height:38px;border-radius:50%;cursor:pointer;font-size:1.2rem;line-height:1;flex:none} .x:hover{background:var(--brun-3)} .form{display:grid;gap:14px} .form h3{font-size:1.05rem;color:var(--cheddar);margin-top:6px} .form .row{display:grid;grid-template-columns:1fr 1fr;gap:14px} @media (max-width:520px){.form .row{grid-template-columns:1fr}} .field{display:grid;gap:6px;min-width:0} .field span{font-size:.9rem;color:var(--creme-2);font-weight:500} .field input,.field select,.field textarea{width:100%;font:inherit;font-size:1rem;color:var(--creme);background:var(--brun);border:1px solid var(--brun-line);border-radius:10px;padding:12px 14px;min-width:0} .field textarea{min-height:110px;resize:vertical} .field input:focus,.field select:focus,.field textarea:focus{border-color:var(--cheddar);outline:none;box-shadow:0 0 0 3px rgba(243,173,63,.25)} .form__foot{display:grid;gap:12px;margin-top:6px} .form__foot .btn{text-transform:uppercase;letter-spacing:.04em} .form__note{font-size:.9rem;color:var(--creme-2)} .status{display:none;background:rgba(123,166,86,.16);border:1px solid var(--mesclun);color:var(--creme);padding:12px 14px;border-radius:10px;font-size:.95rem} .status.is-on{display:block} @media (prefers-reduced-motion:reduce){ *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important} .show figure img{transform:none!important} } /* ---------- ajouts site complet ---------- */ .bandeau{background:var(--cheddar);color:var(--encre);font-weight:500;text-align:center;padding:10px max(16px,env(safe-area-inset-left,0px));font-size:.98rem} .dish[data-rupture] .dish__img::after{content:"Épuisé ce soir";position:absolute;inset:auto 14px 14px auto;background:var(--encre);color:var(--kraft);font:500 .85rem var(--body);padding:6px 12px;border-radius:999px} .dish[data-rupture] .dish__img img{filter:saturate(.6) brightness(.85)} .ticket[data-annule]{opacity:.85} .ticket[data-annule] .ticket__flag{display:block;background:var(--ketchup);color:#2A1A10} .ticket__exception{color:var(--cheddar);font-size:.92rem;font-weight:500} /* pages intérieures */ .page-hero{padding-top:clamp(56px,8vw,96px);padding-bottom:clamp(40px,6vw,64px);background:radial-gradient(60% 55% at 78% 30%,rgba(243,173,63,.18),transparent 70%),linear-gradient(180deg,#3F2A1B,var(--brun))} .page-hero h1{font-size:clamp(2rem,4.8vw,3.6rem);max-width:22ch} .page-hero .lede{margin-top:18px} .prose{max-width:68ch;display:grid;gap:16px} .prose h2{font-size:clamp(1.6rem,3.2vw,2.3rem);margin-top:28px} .prose h3{font-size:1.25rem;margin-top:10px} .prose ul{margin:0;padding-left:22px;display:grid;gap:8px} .prose a{color:var(--orange-text)} .faq{display:grid;gap:10px;max-width:72ch} .faq details{border:1.5px solid var(--kraft-2);border-radius:12px;background:rgba(255,255,255,.3);padding:0 18px} .faq summary{cursor:pointer;font-weight:700;padding:16px 0;list-style:none;display:flex;justify-content:space-between;gap:12px;align-items:center} .faq summary::-webkit-details-marker{display:none} .faq summary::after{content:"+";font-family:var(--display);font-size:1.3rem;color:var(--orange-text);flex:none} .faq details[open] summary::after{content:"–"} .faq details p{padding-bottom:16px;color:var(--encre);line-height:1.55} .tel{color:var(--cheddar);font-weight:500;text-decoration:none;white-space:nowrap} .cta-band{text-align:left} .cta-band .hero__cta{margin-top:22px} .todo{background:#FFF3C4;color:#5C4500;border:2px dashed #C9A227;border-radius:12px;padding:14px 18px;font-weight:500} .show__figures{position:absolute;inset:0} .dish--full{grid-column:1 / -1} @media (min-width:981px){.dish--full .dish__img{aspect-ratio:21/9}} @media (max-width:980px){.dish--full{grid-column:span 2}.dish--full .dish__img{aspect-ratio:16/10}} @media (max-width:600px){.dish--full{grid-column:auto}.dish--full .dish__img{aspect-ratio:1/1}} /* pages privatisation */ .page-hero--split .wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(28px,5vw,64px);align-items:center} @media (max-width:900px){.page-hero--split .wrap{grid-template-columns:1fr}} .page-hero__photo{margin:0;aspect-ratio:1/1;max-width:100%;border-radius:22px;overflow:hidden;box-shadow:0 30px 70px -30px rgba(0,0,0,.75),0 0 0 1px var(--brun-line)} .page-hero__photo img{width:100%;height:100%;object-fit:cover} .lede--strong{color:var(--creme);font-weight:500} .intro{margin-top:18px;max-width:62ch;color:var(--creme-2)} .intro p{line-height:1.6} .page-hero .hero__cta{margin-top:26px} .prose--page h2:first-child{margin-top:0} .prose--page ul{display:grid;gap:10px} .prose--page li b{color:var(--orange-text)} .btn--ghost-ink{color:var(--encre);border-color:var(--encre-2)} .btn--ghost-ink:hover{background:var(--encre);color:var(--kraft)} .strip{display:grid;grid-template-columns:repeat(3,1fr);background:var(--brun)} .strip img{width:100%;height:100%;aspect-ratio:1/1;object-fit:cover;display:block} @media (max-width:600px){.strip{grid-template-columns:repeat(3,1fr)}} .faq details div{padding-bottom:16px;color:var(--encre);line-height:1.55;display:grid;gap:10px} .faq details div ul{margin:0;padding-left:22px;display:grid;gap:6px} .faq details div p{margin:0} /* ===================================================================== Affinage : titres centrés, police plus classe, mobile ===================================================================== */ h2{font-size:clamp(2rem,4.4vw,3.2rem)} .section-head{text-align:center;margin-inline:auto;max-width:76ch;justify-items:center} .section-head .lede{margin-inline:auto} .section-head h2::after,.ardoise>h2::after,.cta-band h2::after{content:"";display:block;width:56px;height:3px;border-radius:2px;background:var(--cheddar);margin:18px auto 0} .band--kraft .section-head h2::after{background:var(--ketchup)} .cta-band h2::after{background:var(--creme)} .ardoise>h2{text-align:center} .ardoise__grid{margin-top:34px} .week-note{text-align:center;margin-inline:auto} .menu-note{text-align:center;margin-inline:auto} /* Privatisation et À propos : titre centré au-dessus, colonnes en dessous */ .priv .wrap{display:block} .priv__grid{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(28px,5vw,72px);align-items:start;margin-top:clamp(28px,4vw,48px)} @media (max-width:860px){.priv__grid{grid-template-columns:1fr}} .priv .section-head .lede{color:rgba(252,243,227,.85)} .about{margin-top:clamp(28px,4vw,48px)} .closing{text-align:center;margin-inline:auto;max-width:26ch} .cta-band{text-align:center} .cta-band p{margin-inline:auto} .cta-band .hero__cta{justify-content:center} .pillars{border-left:0;padding-left:0;gap:16px} .pillars>div{background:rgba(var(--rgb-encre),.18);border:1px solid rgba(252,243,227,.25);border-radius:14px;padding:18px 20px} /* Hero */ .hero h1{font-size:clamp(3rem,7.4vw,5.6rem);letter-spacing:-.02em} .hero h1 .h1-sub{font-size:clamp(1.05rem,1.7vw,1.25rem)} .hero__kicker{letter-spacing:.06em;text-transform:uppercase;font-size:.82rem} .page-hero .hero__kicker{letter-spacing:.06em;text-transform:uppercase;font-size:.82rem} .page-hero h1{font-size:clamp(2.1rem,4.6vw,3.5rem)} .lede--strong{font-size:1.12rem} /* Boutons un peu plus doux */ .btn{font-weight:500;letter-spacing:.01em} /* Navigation mobile */ .nav__burger{display:none;width:42px;height:42px;border-radius:50%;border:1px solid var(--brun-line);background:transparent;color:var(--creme);cursor:pointer;padding:0;align-items:center;justify-content:center;flex:none} .nav__burger span{display:block;width:18px;height:2px;background:currentColor;border-radius:2px;position:relative;transition:transform .2s ease,background .2s ease} .nav__burger span::before,.nav__burger span::after{content:"";position:absolute;left:0;width:18px;height:2px;background:currentColor;border-radius:2px;transition:transform .2s ease,top .2s ease} .nav__burger span::before{top:-6px}.nav__burger span::after{top:6px} .nav.is-open .nav__burger span{background:transparent} .nav.is-open .nav__burger span::before{top:0;transform:rotate(45deg)} .nav.is-open .nav__burger span::after{top:0;transform:rotate(-45deg)} .nav__panel{display:none} @media (max-width:760px){ .nav__burger{display:inline-flex} .nav .btn--primary{display:none} .nav__panel{display:none;border-top:1px solid var(--brun-line);background:var(--brun);padding-block:14px 18px} .nav.is-open .nav__panel{display:block} .nav__panel .wrap{display:grid;gap:6px;min-height:0} .nav__panel a.lnk{display:block;padding:12px 4px;font-weight:500;text-decoration:none;color:var(--creme);border-bottom:1px solid var(--brun-line);font-size:1.05rem} .nav__panel .pill{display:inline-flex;margin-top:10px;white-space:normal} .nav__panel .btn{margin-top:12px;width:100%} } /* Mobile : centrage et respiration */ @media (max-width:900px){ .hero .wrap>div:first-child{text-align:center} .hero .claims,.hero .hero__cta{justify-content:center} .hero h1 .h1-sub{margin-inline:auto} .hero .tonight{margin-inline:auto;text-align:left} .page-hero--split .wrap>div{text-align:center} .page-hero--split .intro,.page-hero--split .lede{margin-inline:auto} .page-hero--split .hero__cta{justify-content:center} .page-hero__photo{max-width:420px;margin-inline:auto} .priv .hero__cta,.band--kraft .hero__cta{justify-content:center} .more{justify-content:center} } @media (max-width:600px){ body{font-size:16px} .band{padding-block:48px} .hero .wrap{padding-top:72px;padding-bottom:36px} .hero h1{font-size:clamp(2.6rem,13vw,3.4rem)} .tonight{grid-template-columns:auto 1fr;padding:14px 16px} .ticker__item{font-size:.95rem} .ardoise{padding:22px 18px;border-radius:14px} .ardoise__grid{gap:26px} .price-list .big .p{font-size:1.3rem} .dish__body{padding:16px 16px 20px} .foot{text-align:center} .foot .brand{justify-content:center} .foot .partners,.foot__row{justify-content:center} .foot__row{flex-direction:column;align-items:center;gap:8px} .guarantees{position:static} .closing{font-size:1.7rem} .faq summary{padding:14px 0;font-size:.98rem} .sheet{padding:20px 16px;border-radius:14px} } /* Écran de confirmation du formulaire */ .sent{display:grid;gap:12px;justify-items:center;text-align:center;padding:12px 4px 4px} .sent__check{width:56px;height:56px;border-radius:50%;background:var(--mesclun);color:var(--brun);font-size:1.6rem;font-weight:700;display:grid;place-items:center} .sent h3{font-size:1.6rem} .sent p{color:var(--creme-2);max-width:40ch} .sent__urgent{color:var(--creme)!important;background:rgba(243,173,63,.14);border:1px solid rgba(243,173,63,.5);border-radius:12px;padding:12px 16px} .sent__urgent .tel{font-size:1.15rem;white-space:nowrap} .sent .btn{margin-top:6px} .form .lede{margin-bottom:8px} /* ===================================================================== Version vivante : photos en fond, logo, animations, survols ===================================================================== */ /* Logo dans la navigation et le pied de page */ .brand__logo{width:46px;height:46px;object-fit:contain;flex:none;filter:drop-shadow(0 2px 4px rgba(0,0,0,.45))} .foot .brand__logo{width:64px;height:64px} .nav{transition:box-shadow .3s ease,background-color .3s ease} .nav.is-scrolled{box-shadow:0 10px 30px -18px rgba(0,0,0,.8);background:rgba(var(--rgb-brun),.96)} /* Bandes photo (remplacent le bloc rouge) */ .band--photo{position:relative;color:var(--creme);background-color:var(--brun);background-size:cover;background-position:center;isolation:isolate} .band--photo::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(var(--rgb-encre),.82),rgba(var(--rgb-encre),.66) 40%,rgba(var(--rgb-encre),.9))} .band--photo .lede{color:rgba(252,243,227,.88)} .band--photo .section-head h2::after{background:var(--cheddar)} .priv.bg-in{background-image:url("/img/truck-mariage.webp")} /* photo de fond chargée à l'approche de la section (site.js) */ .priv p{color:var(--creme)} .priv .btn--creme{background:var(--cheddar);border-color:var(--cheddar);color:#2A1A10} .priv .btn--creme:hover{background:#F7BD5F;border-color:#F7BD5F} .priv .btn--ghost{border-color:rgba(252,243,227,.6)} .priv .btn--ghost:hover{background:var(--creme);color:var(--brun)} .priv .more a{color:var(--creme)} .pillars>div{background:rgba(var(--rgb-encre),.55);border:1px solid rgba(252,243,227,.18);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:transform .3s ease,border-color .3s ease} .pillars>div:hover{transform:translateY(-3px);border-color:rgba(243,173,63,.6)} .pillars h3{color:var(--cheddar)} .cta-band{background-image:url("/img/service.webp")} .cta-band .btn--creme{background:var(--cheddar);border-color:var(--cheddar);color:#2A1A10} .cta-band .btn--creme:hover{background:#F7BD5F;border-color:#F7BD5F} .cta-band h2::after{background:var(--cheddar)} /* Photo de service dans la section À propos */ .about__photo{margin:0 0 16px;border-radius:16px;overflow:hidden;aspect-ratio:4/3;box-shadow:0 20px 50px -24px rgba(var(--rgb-encre),.6)} .about__photo img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s ease} .about__photo:hover img{transform:scale(1.04)} /* Survols : cartes qui se soulèvent, boutons réactifs */ .dish{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s ease} .dish:hover{transform:translateY(-6px);box-shadow:0 24px 50px -24px rgba(var(--rgb-encre),.55)} .ticket{transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease} .ticket:hover{transform:translateY(-4px);border-color:var(--cheddar)} .g{transition:transform .3s ease} .g:hover{transform:translateX(4px)} .btn{transition:transform .18s ease,background-color .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease} .btn:hover{transform:translateY(-1px);box-shadow:0 10px 24px -14px rgba(0,0,0,.6)} .btn:active{transform:translateY(1px);box-shadow:none} .claims li{transition:border-color .2s ease,transform .2s ease} .claims li:hover{border-color:var(--cheddar);transform:translateY(-1px)} .towns a{transition:background .2s ease,color .2s ease,transform .2s ease} .towns a:hover{transform:translateY(-1px)} /* Apparition au défilement (désactivée sans JavaScript et si l'utilisateur préfère moins d'animation) */ html.js .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .8s cubic-bezier(.2,.7,.2,1)} html.js .reveal.in{opacity:1;transform:none} html.js .reveal-stagger>*{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .7s cubic-bezier(.2,.7,.2,1)} html.js .reveal-stagger.in>*{opacity:1;transform:none} html.js .reveal-stagger.in>*:nth-child(1){transition-delay:.05s} html.js .reveal-stagger.in>*:nth-child(2){transition-delay:.12s} html.js .reveal-stagger.in>*:nth-child(3){transition-delay:.19s} html.js .reveal-stagger.in>*:nth-child(4){transition-delay:.26s} html.js .reveal-stagger.in>*:nth-child(5){transition-delay:.33s} html.js .reveal-stagger.in>*:nth-child(6){transition-delay:.40s} html.js .reveal-stagger.in>*:nth-child(7){transition-delay:.47s} html.js .reveal-stagger.in>*:nth-child(n+8){transition-delay:.54s} /* le hero apparaît en douceur au chargement */ html.js .hero .wrap>div:first-child>*{animation:rise .8s cubic-bezier(.2,.7,.2,1) both} html.js .hero .wrap>div:first-child>*:nth-child(2){animation-delay:.08s} html.js .hero .wrap>div:first-child>*:nth-child(3){animation-delay:.16s} html.js .hero .wrap>div:first-child>*:nth-child(4){animation-delay:.24s} html.js .hero .wrap>div:first-child>*:nth-child(5){animation-delay:.32s} html.js .hero .show{animation:rise 1s .2s cubic-bezier(.2,.7,.2,1) both} @keyframes rise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}} @media (prefers-reduced-motion:reduce){ html.js .reveal,html.js .reveal-stagger>*{opacity:1!important;transform:none!important;transition:none!important} html.js .hero .wrap>div:first-child>*,html.js .hero .show{animation:none!important} } .page-hero__photo--wide{aspect-ratio:3/2} @media (max-width:900px){.page-hero__photo--wide{max-width:100%}} .section-head.reveal+.faq{margin-top:22px} /* lisibilité du texte sur la photo : panneau légèrement teinté */ .priv__grid>div:first-child{background:rgba(var(--rgb-encre),.5);border:1px solid rgba(252,243,227,.14);border-radius:18px;padding:clamp(18px,3vw,28px);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)} .priv .more{margin-top:26px} /* ===================================================================== Corrections : bandeau continu, guirlande, épuisé, typographie, formulaire ===================================================================== */ /* Bandeau défilant : deux groupes identiques, défilement d'exactement un groupe */ .ticker__track{display:flex;width:max-content;animation:scroll 40s linear infinite;will-change:transform} .ticker__group{display:flex;flex:none} @keyframes scroll{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}} /* Guirlande : ampoules qui scintillent chacune à leur rythme */ .lights{height:96px} .lights svg{position:absolute;inset:0;width:100%;height:96px;display:block} .lights .b .h{opacity:.55} .lights .b{animation:twinkle 3.2s ease-in-out infinite alternate;animation-delay:calc(var(--d) * -.37s);transform-origin:center} @keyframes twinkle{from{opacity:.7}to{opacity:1}} .lights .b:nth-child(3n) .h{animation:halo 2.6s ease-in-out infinite alternate;animation-delay:calc(var(--d) * -.5s)} @keyframes halo{from{opacity:.3}to{opacity:.8}} .hero .wrap{padding-top:clamp(96px,11vw,128px)} /* Épuisé : ruban en travers de la photo */ .dish[data-rupture] .dish__img::after{content:"Épuisé ce soir";position:absolute;inset:50% auto auto -25%;width:150%;height:auto;margin:0;transform:translateY(-50%) rotate(-10deg);background:var(--cheddar);color:#2A1A10;font:500 1rem/1 var(--body);letter-spacing:.14em;text-transform:uppercase;text-align:center;padding:13px 0;border-radius:0;box-shadow:0 10px 30px -10px rgba(0,0,0,.6);border-top:2px solid rgba(255,255,255,.45);border-bottom:2px solid rgba(0,0,0,.15)} .dish[data-rupture] .dish__img img{filter:saturate(.45) brightness(.7)} .show figure[data-rupture]::after{content:"Épuisé ce soir";position:absolute;left:-25%;width:150%;top:50%;transform:translateY(-50%) rotate(-10deg);background:var(--cheddar);color:#2A1A10;font:500 1.05rem/1 var(--body);letter-spacing:.14em;text-transform:uppercase;text-align:center;padding:12px 0;z-index:2;box-shadow:0 10px 30px -10px rgba(0,0,0,.6)} .show figure[data-rupture] img{filter:saturate(.45) brightness(.7)} /* Sauts de ligne élégants : pas de ponctuation orpheline, pas de mot seul */ p,li,.tag,.lede,.ing,h1,h2,h3,summary{text-wrap:pretty} h1,h2,h3{text-wrap:balance} /* Formulaire : code postal + ville */ .form .row--cp{grid-template-columns:140px 1fr} @media (max-width:520px){.form .row--cp{grid-template-columns:120px 1fr}} .field input:invalid:not(:placeholder-shown),.field select:invalid{border-color:var(--brun-line)} .form.was-validated :invalid{border-color:var(--ketchup)} /* ---------- hero : le camion de nuit en fond ---------- */ .hero{isolation:isolate} .hero::before{content:"";position:absolute;inset:0;z-index:-2;background:#2A1A10 url(/img/truck-nuit.jpg) center 42%/cover no-repeat; background-image:-webkit-image-set(url(/img/truck-nuit.webp) 1x); background-image:image-set(url(/img/truck-nuit.webp) type("image/webp"),url(/img/truck-nuit.jpg) type("image/jpeg"))} /* voile : brun soutenu derrière le texte (gauche), camion dégagé à droite, fondu vers le fond du site en bas */ .hero::after{content:"";position:absolute;inset:0;z-index:-1;background: linear-gradient(90deg,rgba(var(--rgb-encre),.9) 0,rgba(var(--rgb-encre),.72) 38%,rgba(var(--rgb-encre),.22) 62%,rgba(var(--rgb-encre),.3) 100%), linear-gradient(180deg,rgba(var(--rgb-encre),.62) 0,rgba(var(--rgb-encre),.1) 28%,rgba(var(--rgb-encre),.12) 58%,var(--brun) 100%)} .hero .lights{z-index:1} .hero>.wrap{position:relative;z-index:1} .hero h1{text-shadow:0 2px 24px rgba(0,0,0,.45)} .hero .claims li{background:rgba(var(--rgb-encre),.72);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)} .hero .tonight{background:rgba(var(--rgb-encre),.8);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)} @media (min-width:901px){ .hero .wrap{min-height:min(840px,94vh);align-items:center} .hero .wrap>div:last-child{align-self:end;justify-self:end;width:min(100%,340px)} } /* Mobile / tablette : le camion entier en bandeau sous la guirlande, le texte vient dessous sur fond uni */ @media (max-width:900px){ .hero::before,.hero::after{inset:0 0 auto 0;height:340px} .hero::before{background-position:62% 50%} .hero::after{background:linear-gradient(180deg,rgba(var(--rgb-encre),.5) 0,rgba(var(--rgb-encre),.08) 24%,rgba(var(--rgb-encre),.06) 62%,rgba(var(--rgb-encre),.75) 86%,var(--brun) 100%)} .hero .wrap{padding-top:318px} .hero h1{text-shadow:none} } @media (max-width:600px){ .hero::before,.hero::after{height:290px} .hero::before{background-size:auto 335px;background-position:60% 36%} .hero .wrap{padding-top:266px} } @media (max-width:700px){ .hero::before{background-image:-webkit-image-set(url(/img/truck-nuit-900.webp) 1x);background-image:image-set(url(/img/truck-nuit-900.webp) type("image/webp"),url(/img/truck-nuit-900.jpg) type("image/jpeg"))} } /* ---------- fenêtre de contact : stable sur mobile ---------- */ .sheet{overscroll-behavior:contain;-webkit-overflow-scrolling:touch} html.dlg-open,html.dlg-open body{overflow:hidden;overscroll-behavior:none} html.dlg-open body{position:fixed;left:0;right:0;width:100%} @media (max-width:640px){ /* plein écran, calé en haut : plus de recentrage à chaque apparition du clavier */ /* la fenêtre remplit l'écran ; la feuille (.sheet) est le seul élément qui défile, sans hauteur en pourcentage (Safari ne la résolvait pas et laissait la page bouger sous le clavier) */ dialog{max-width:none;width:100%;height:100vh;height:100dvh;max-height:none;margin:0;inset:0;overflow:hidden;border-radius:0} dialog[open]{display:flex;flex-direction:column;animation:sheetUp .28s ease-out} .sheet{flex:1 1 auto;min-height:0;height:auto;max-height:none;border-radius:0;border:0;padding:calc(16px + var(--sat)) 16px calc(28px + var(--sab))} .sheet__head{position:sticky;top:calc(-16px - var(--sat));z-index:2;margin:calc(-16px - var(--sat)) -16px 8px;padding:calc(14px + var(--sat)) 16px 10px;background:var(--brun-2);border-bottom:1px solid var(--brun-line)} .sheet h2{font-size:1.4rem} } @keyframes sheetUp{from{transform:translateY(24px);opacity:0}to{transform:none;opacity:1}} /* ---------- thèmes saisonniers (choisis dans l'admin : data-theme sur ) ---------- */ .fx-canvas{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:60} /* Noël : rouge et or, guirlande multicolore, flocons */ html[data-theme=noel]{--ketchup:#C62828;--ketchup-2:#A51F1F;--cheddar:#F2C14E;--theme-kicker:"🎄 Joyeuses fêtes ·"} /* Halloween : orange vif et violet, citrouilles et chauves-souris */ html[data-theme=halloween]{--ketchup:#FF7A1A;--ketchup-2:#D95F08;--cheddar:#FFA726;--theme-kicker:"🎃 Halloween ·"} /* 14 juillet : bleu, blanc, rouge et confettis */ html[data-theme=fete-nationale]{--ketchup:#C8102E;--ketchup-2:#9E0C24;--cheddar:#F5F0E6;--theme-kicker:"🇫🇷 Fête nationale ·"} /* Saint-Valentin : rose et rouge, cœurs */ html[data-theme=saint-valentin]{--ketchup:#D81B60;--ketchup-2:#AD1457;--cheddar:#F8A5C2;--theme-kicker:"💝 Saint-Valentin ·"} /* Pâques : pastels, poussins et œufs */ html[data-theme=paques]{--ketchup:#E08E1B;--ketchup-2:#B8730F;--cheddar:#A5D6A7;--theme-kicker:"🐣 Joyeuses Pâques ·"} @media (prefers-reduced-motion:reduce){.fx-canvas{display:none}} /* ---------- décorations de thème (ajoutées par site.js) ---------- */ .page-hero{position:relative;overflow:hidden;isolation:isolate} .page-hero>.wrap{position:relative;z-index:1} .deco-bunting-svg{position:absolute;left:0;top:6px;height:175px;width:auto;pointer-events:none;z-index:1;filter:drop-shadow(0 8px 10px rgba(0,0,0,.4))} .page-hero .deco-bunting-svg{top:-4px} .deco-scenery{position:absolute;left:0;right:0;bottom:52px;height:140px;background-repeat:repeat-x;background-size:600px 140px;background-position:center bottom;pointer-events:none;z-index:0} .page-hero .deco-bunting{top:0} .deco-snowcap{position:absolute;left:0;right:0;top:0;height:18px;pointer-events:none;z-index:2;background:#F7F9FC;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 18' preserveAspectRatio='none'%3E%3Cpath d='M0 0h120v6c-8 0-10 9-20 9s-10-8-20-8-10 10-20 10-9-7-19-7-11 8-21 8-11-8-20-8z'/%3E%3C/svg%3E") repeat-x;-webkit-mask-size:120px 18px;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 18' preserveAspectRatio='none'%3E%3Cpath d='M0 0h120v6c-8 0-10 9-20 9s-10-8-20-8-10 10-20 10-9-7-19-7-11 8-21 8-11-8-20-8z'/%3E%3C/svg%3E") repeat-x;mask-size:120px 18px;opacity:.95} .deco-webs{position:absolute;inset:0;pointer-events:none;z-index:1} .deco-web{position:absolute;top:0;left:0;width:min(150px,32vw);height:auto} .deco-web+.deco-web{left:auto;right:0;transform:scaleX(-1)} .deco-spider{position:absolute;top:0;right:14%;width:34px;pointer-events:none;z-index:2;transform-origin:50% 0;animation:spiderSwing 5.5s ease-in-out infinite} .deco-spider::before{content:"";position:absolute;left:50%;top:0;width:1px;height:150px;background:rgba(237,231,246,.6)} .deco-spider svg{position:absolute;top:150px;left:0;width:34px;height:34px;filter:drop-shadow(0 2px 3px rgba(0,0,0,.5))} @keyframes spiderSwing{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}} .deco-grass{position:absolute;left:0;right:0;bottom:52px;height:46px;background-repeat:repeat-x;background-size:260px 46px;background-position:center bottom;pointer-events:none;z-index:0;opacity:.95} .deco-ribbon{position:relative;display:inline-block;margin:0 0 16px;padding:8px 22px;background:var(--ketchup);color:#fff;font-family:var(--display);font-size:1.08rem;letter-spacing:.02em;line-height:1.2;box-shadow:0 8px 20px -10px rgba(0,0,0,.7);z-index:1} .deco-ribbon::before,.deco-ribbon::after{content:"";position:absolute;top:7px;width:24px;height:100%;background:var(--ketchup-2);z-index:-1} .deco-ribbon::before{left:-16px;clip-path:polygon(0 0,100% 0,100% 100%,0 100%,38% 50%)} .deco-ribbon::after{right:-16px;clip-path:polygon(0 0,100% 0,62% 50%,100% 100%,0 100%)} html[data-theme=fete-nationale] .deco-ribbon{background:#C8102E;color:#fff;border-top:3px solid #2457C5;border-bottom:3px solid #F5F0E6} html[data-theme=fete-nationale] .deco-ribbon::before,html[data-theme=fete-nationale] .deco-ribbon::after{background:#1a3f93} html[data-theme=paques] .deco-ribbon{color:#2A1A10} .tonight.has-deco{position:relative;overflow:visible} .deco-corner{position:absolute;top:-22px;left:-12px;width:74px;height:auto;pointer-events:none;filter:drop-shadow(0 3px 4px rgba(0,0,0,.4))} .deco-corner svg{display:block;width:100%;height:auto} .deco-corner .deco-cocarde{width:50px;margin-left:auto} html[data-theme=fete-nationale] .deco-corner{left:auto;right:-8px;top:-26px;width:50px} .deco-logowrap{position:relative;display:inline-flex;flex:none} .deco-hat{position:absolute;top:-13px;left:-8px;width:36px;height:auto;transform:rotate(-18deg);filter:drop-shadow(0 1px 2px rgba(0,0,0,.4))} .deco-ears{position:absolute;top:-24px;left:4px;width:32px;height:auto} html[data-theme=fete-nationale] .ticker{border-top:3px solid;border-image:linear-gradient(90deg,#2457C5 0 33.3%,#F5F0E6 33.3% 66.6%,#E53935 66.6%) 1} html[data-theme=noel] .ticker{border-top:3px solid;border-image:repeating-linear-gradient(135deg,#E53935 0 14px,#F5F0E6 14px 28px) 1} @media (max-width:900px){.deco-bunting-svg{top:0;height:126px}.deco-scenery{bottom:auto;top:230px;height:100px;background-size:430px 100px}.deco-spider{right:10%}.deco-spider::before{height:110px}.deco-spider svg{top:110px}} @media (max-width:600px){.deco-ribbon{font-size:.98rem;padding:7px 18px}.deco-corner{width:62px;top:-18px;left:-8px}} @media (prefers-reduced-motion:reduce){.deco-spider{animation:none}} /* thème actif : la banderole remplace la guirlande d'ampoules (plus de chevauchement) */ html[data-theme] .hero .lights{display:none} /* scènes animées */ .deco-runner{position:absolute;left:0;pointer-events:none;z-index:0;animation:runLtr 30s linear infinite;will-change:transform} .deco-runner.rtl{left:auto;right:0;animation-name:runRtl} .deco-runner svg{display:block;width:100%;height:auto;overflow:visible} @keyframes runLtr{0%{transform:translateX(-110%)}72%{transform:translateX(calc(100vw + 12%))}100%{transform:translateX(calc(100vw + 12%))}} @keyframes runRtl{0%{transform:translateX(110%)}72%{transform:translateX(calc(-100vw - 12%))}100%{transform:translateX(calc(-100vw - 12%))}} @keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}} @keyframes spin{to{transform:rotate(360deg)}} @keyframes hop{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}} @keyframes puff{0%{opacity:.8;transform:translate(0,0) scale(.45)}100%{opacity:0;transform:translate(22px,-36px) scale(1.6)}} .deco-runner.train{bottom:62px;width:400px;filter:drop-shadow(0 4px 6px rgba(0,0,0,.45))} .deco-runner.train .wheel{animation:spin 1.1s linear infinite reverse} .deco-runner.train .smoke circle{fill:rgba(255,255,255,.8);transform-box:fill-box;transform-origin:center;animation:puff 2.2s ease-out infinite} .deco-runner.train .smoke circle:nth-child(2){animation-delay:.7s}.deco-runner.train .smoke circle:nth-child(3){animation-delay:1.4s} .deco-ground{position:absolute;left:0;right:0;bottom:52px;height:14px;background:#F7F9FC;z-index:0;opacity:.96;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 14' preserveAspectRatio='none'%3E%3Cpath d='M0 14V8c8 0 10-7 20-7s10 6 20 6 10-8 20-8 9 5 19 5 11-6 21-6 11 6 20 6v10z'/%3E%3C/svg%3E") repeat-x;-webkit-mask-size:120px 14px;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 14' preserveAspectRatio='none'%3E%3Cpath d='M0 14V8c8 0 10-7 20-7s10 6 20 6 10-8 20-8 9 5 19 5 11-6 21-6 11 6 20 6v10z'/%3E%3C/svg%3E") repeat-x;mask-size:120px 14px} .deco-runner.witch{top:104px;width:210px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.5))} .deco-runner.witch svg{animation:bob 3.2s ease-in-out infinite} .deco-moon{position:absolute;top:120px;right:9%;width:90px;height:90px;border-radius:50%;z-index:0;opacity:.95;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.35),transparent 40%),radial-gradient(circle at 62% 58%,rgba(0,0,0,.08) 0 10%,transparent 11%),radial-gradient(circle at 36% 66%,rgba(0,0,0,.07) 0 7%,transparent 8%),radial-gradient(circle at 70% 30%,rgba(0,0,0,.06) 0 6%,transparent 7%),radial-gradient(circle at 40% 40%,#FFF8DC,#F1E2A2 65%,#D8C070);box-shadow:0 0 50px 14px rgba(255,240,190,.22)} .deco-runner.jets{top:22%;width:min(520px,72vw)} .deco-runner.balloon{top:14%;width:112px;filter:drop-shadow(0 6px 10px rgba(0,0,0,.4))} .deco-runner.balloon svg{animation:bob 5s ease-in-out infinite} .deco-runner.bunny{bottom:64px;width:170px} .deco-runner.bunny .hop{transform-box:fill-box;transform-origin:50% 100%;animation:hop .75s ease-in-out infinite} .deco-runner.bunny .chick{transform-box:fill-box;transform-origin:50% 100%;animation:hop .5s ease-in-out infinite .2s} /* mobile : les scènes au sol se jouent sur le bitume de la photo (bandeau de 340 px, puis 290 px) */ @media (max-width:900px){ .deco-runner.train{width:240px;bottom:auto;top:244px}.deco-ground{height:10px;bottom:auto;top:330px} .deco-runner.witch{top:56px;width:120px}.deco-moon{top:84px;right:7%;width:58px;height:58px} .deco-runner.jets{top:54px;width:72vw}.deco-runner.balloon{top:40px;width:70px} .deco-runner.bunny{width:120px;bottom:auto;top:266px}.deco-grass{bottom:auto;top:296px;height:42px;background-size:240px 42px} } @media (max-width:600px){ .deco-runner.train{top:192px;width:220px}.deco-ground{top:280px}.deco-scenery{top:192px;height:88px;background-size:378px 88px} .deco-runner.bunny{top:222px;width:110px}.deco-grass{top:248px} .deco-moon{top:70px;width:50px;height:50px}.deco-runner.witch{top:48px;width:90px}.deco-runner.jets{top:46px}.deco-runner.balloon{top:36px;width:62px} } @media (prefers-reduced-motion:reduce){.deco-runner{display:none}} /* ---------- palettes de fond par thème : les bandes, cartes, nav et pied de page suivent ---------- */ html[data-theme=noel]{--brun:#17321F;--brun-2:#1F4229;--brun-3:#2A553A;--brun-line:#3B6B4B;--rgb-brun:23,50,31;--rgb-brun2:31,66,41;--rgb-encre:12,30,18;--photo-bg:#12281A;--kraft:#F4EFE4;--kraft-2:#E1D7C2;--orange-text:#9E1B1B} html[data-theme=halloween]{--brun:#1C1226;--brun-2:#281A36;--brun-3:#352547;--brun-line:#4B355F;--rgb-brun:28,18,38;--rgb-brun2:40,26,54;--rgb-encre:18,10,26;--photo-bg:#140C1C;--kraft:#F6E7CE;--kraft-2:#E6D0AE;--orange-text:#B4480B} html[data-theme=fete-nationale]{--brun:#122A4F;--brun-2:#1A3866;--brun-3:#23477E;--brun-line:#34599A;--rgb-brun:18,42,79;--rgb-brun2:26,56,102;--rgb-encre:10,26,52;--photo-bg:#0E2140;--kraft:#F4F2ED;--kraft-2:#DEDAD0;--orange-text:#A0102A} html[data-theme=saint-valentin]{--brun:#3A1322;--brun-2:#4C1B2E;--brun-3:#60263C;--brun-line:#78394F;--rgb-brun:58,19,34;--rgb-brun2:76,27,46;--rgb-encre:40,10,22;--photo-bg:#2E0E1A;--kraft:#F8E6E8;--kraft-2:#E9CBD1;--orange-text:#A8134B} html[data-theme=paques]{--brun:#2B4A3B;--brun-2:#37604B;--brun-3:#44755C;--brun-line:#5A8C70;--rgb-brun:43,74,59;--rgb-brun2:55,96,75;--rgb-encre:28,50,40;--photo-bg:#233D31;--kraft:#FBF4DE;--kraft-2:#EBDFBE;--orange-text:#9A6007} /* ---------- habillage des encarts par thème ---------- */ /* petite banderole drapée en haut des photos de burgers, des tickets d'emplacement et de l'ardoise (même dessin que la grande) */ html[data-theme] .dish::before,html[data-theme] .ardoise::after{content:"";position:absolute;left:0;right:0;top:-3px;height:88px;background:var(--mini-bunting) repeat-x center top/160px 88px;pointer-events:none;z-index:3;filter:drop-shadow(0 3px 3px rgba(0,0,0,.35))} html[data-theme] .ardoise{position:relative;overflow:hidden} html[data-theme] .ticket{overflow:visible} html[data-theme] .ticket::before{content:"";position:absolute;left:10px;right:10px;top:-1px;height:5px;border-radius:0 0 4px 4px;background:var(--stripe);pointer-events:none;z-index:3} html[data-theme] .ticket__flag{z-index:5} /* ornement : au pied des photos (coin gauche), au coin des tickets, en haut du carrousel */ html[data-theme] .dish__img::before,html[data-theme] .ticket::after,html[data-theme] .show::before{content:"";position:absolute;width:78px;height:78px;background:var(--orn) no-repeat center/contain;z-index:3;pointer-events:none;filter:drop-shadow(0 3px 4px rgba(0,0,0,.4))} html[data-theme] .dish__img::before{left:10px;bottom:8px} html[data-theme] .ticket::after{width:44px;height:44px;right:10px;bottom:10px} html[data-theme] .show::before{left:12px;top:12px;width:84px;height:84px} /* Noël : neige sur les cartes en plus de la guirlande de sapin */ html[data-theme=noel] .dish::after,html[data-theme=noel] .ardoise::before,html[data-theme=noel] .show::after{content:"";position:absolute;left:0;right:0;top:0;height:16px;background:#F7F9FC;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 120 18%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M0 0h120v6c-8 0-10 9-20 9s-10-8-20-8-10 10-20 10-9-7-19-7-11 8-21 8-11-8-20-8z%22/%3E%3C/svg%3E") repeat-x;-webkit-mask-size:120px 16px;mask:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 120 18%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M0 0h120v6c-8 0-10 9-20 9s-10-8-20-8-10 10-20 10-9-7-19-7-11 8-21 8-11-8-20-8z%22/%3E%3C/svg%3E") repeat-x;mask-size:120px 16px;z-index:2;pointer-events:none} html[data-theme=noel]{--orn:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 130 110%22%3E%3Cdefs%3E%3ClinearGradient id=%22l%22 x1=%220%22 y1=%220%22 x2=%220%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%234CAF50%22/%3E%3Cstop offset=%221%22 stop-color=%22%231B5E20%22/%3E%3C/linearGradient%3E%3ClinearGradient id=%22r%22 x1=%220%22 y1=%220%22 x2=%220%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%23EF5350%22/%3E%3Cstop offset=%221%22 stop-color=%22%239E1B1B%22/%3E%3C/linearGradient%3E%3CradialGradient id=%22b%22 cx=%22.35%22 cy=%22.3%22 r=%22.7%22%3E%3Cstop offset=%220%22 stop-color=%22%23FF8A80%22/%3E%3Cstop offset=%22.6%22 stop-color=%22%23D32F2F%22/%3E%3Cstop offset=%221%22 stop-color=%22%238E1414%22/%3E%3C/radialGradient%3E%3C/defs%3E%0A%3Cpath d=%22M18 62 C10 40 28 18 50 22 C46 34 50 46 60 52 C46 60 30 70 18 62Z%22 fill=%22url(%23l)%22/%3E%3Cpath d=%22M18 62 C30 50 44 40 50 22%22 fill=%22none%22 stroke=%22%23A5D6A7%22 stroke-opacity=%22.7%22 stroke-width=%221.6%22/%3E%0A%3Cpath d=%22M112 62 C120 40 102 18 80 22 C84 34 80 46 70 52 C84 60 100 70 112 62Z%22 fill=%22url(%23l)%22/%3E%3Cpath d=%22M112 62 C100 50 86 40 80 22%22 fill=%22none%22 stroke=%22%23A5D6A7%22 stroke-opacity=%22.7%22 stroke-width=%221.6%22/%3E%0A%3Cpath d=%22M65 92 C44 92 36 72 48 60 C56 66 74 66 82 60 C94 72 86 92 65 92Z%22 fill=%22url(%23l)%22/%3E%3Cpath d=%22M65 92 C62 80 60 70 65 60%22 fill=%22none%22 stroke=%22%23A5D6A7%22 stroke-opacity=%22.7%22 stroke-width=%221.6%22/%3E%0A%3Cpath d=%22M30 46 C14 38 10 20 26 14 C38 10 50 22 48 34 C40 30 32 36 30 46Z%22 fill=%22url(%23r)%22/%3E%3Cpath d=%22M100 46 C116 38 120 20 104 14 C92 10 80 22 82 34 C90 30 98 36 100 46Z%22 fill=%22url(%23r)%22/%3E%0A%3Cpath d=%22M56 44 L40 86 L52 82 L58 92 Z%22 fill=%22url(%23r)%22/%3E%3Cpath d=%22M74 44 L90 86 L78 82 L72 92 Z%22 fill=%22url(%23r)%22/%3E%0A%3Cpath d=%22M36 22 C40 18 46 20 46 26%22 fill=%22none%22 stroke=%22%23FFCDD2%22 stroke-opacity=%22.8%22 stroke-width=%222.5%22 stroke-linecap=%22round%22/%3E%3Cpath d=%22M94 22 C90 18 84 20 84 26%22 fill=%22none%22 stroke=%22%23FFCDD2%22 stroke-opacity=%22.8%22 stroke-width=%222.5%22 stroke-linecap=%22round%22/%3E%0A%3Crect x=%2254%22 y=%2230%22 width=%2222%22 height=%2218%22 rx=%225%22 fill=%22url(%23r)%22/%3E%3Cpath d=%22M58 34 h8%22 stroke=%22%23FFCDD2%22 stroke-opacity=%22.8%22 stroke-width=%222%22 stroke-linecap=%22round%22/%3E%0A%3Ccircle cx=%2256%22 cy=%2258%22 r=%228%22 fill=%22url(%23b)%22/%3E%3Ccircle cx=%2274%22 cy=%2260%22 r=%228%22 fill=%22url(%23b)%22/%3E%3Ccircle cx=%2265%22 cy=%2270%22 r=%228%22 fill=%22url(%23b)%22/%3E%3Ccircle cx=%2253%22 cy=%2255%22 r=%222.2%22 fill=%22%23fff%22 fill-opacity=%22.8%22/%3E%3Ccircle cx=%2271%22 cy=%2257%22 r=%222.2%22 fill=%22%23fff%22 fill-opacity=%22.8%22/%3E%3Ccircle cx=%2262%22 cy=%2267%22 r=%222.2%22 fill=%22%23fff%22 fill-opacity=%22.8%22/%3E%3C/svg%3E")} html[data-theme=noel] .dish{border-color:rgba(198,40,40,.35)} html[data-theme=halloween]{--orn:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 120 120%22%3E%3Cg fill=%22none%22 stroke=%22%23F3EEFF%22 stroke-opacity=%22.8%22 stroke-width=%221.1%22%3E%3Cline x1=%22120%22 y1=%220%22 x2=%22120.0%22 y2=%22125.0%22/%3E%3Cline x1=%22120%22 y1=%220%22 x2=%2287.6%22 y2=%22120.7%22/%3E%3Cline x1=%22120%22 y1=%220%22 x2=%2257.5%22 y2=%22108.3%22/%3E%3Cline x1=%22120%22 y1=%220%22 x2=%2231.6%22 y2=%2288.4%22/%3E%3Cline x1=%22120%22 y1=%220%22 x2=%2211.7%22 y2=%2262.5%22/%3E%3Cline x1=%22120%22 y1=%220%22 x2=%22-0.7%22 y2=%2232.4%22/%3E%3Cline x1=%22120%22 y1=%220%22 x2=%22-5.0%22 y2=%220.0%22/%3E%3Cpath d=%22M120.0 18.0 Q118.0 15.3 115.3 17.4%22/%3E%3Cpath d=%22M115.3 17.4 Q114.1 14.3 111.0 15.6%22/%3E%3Cpath d=%22M111.0 15.6 Q110.6 12.3 107.3 12.7%22/%3E%3Cpath d=%22M107.3 12.7 Q107.7 9.4 104.4 9.0%22/%3E%3Cpath d=%22M104.4 9.0 Q105.7 5.9 102.6 4.7%22/%3E%3Cpath d=%22M102.6 4.7 Q104.7 2.0 102.0 0.0%22/%3E%3Cpath d=%22M120.0 36.0 Q116.0 30.7 110.7 34.8%22/%3E%3Cpath d=%22M110.7 34.8 Q108.2 28.6 102.0 31.2%22/%3E%3Cpath d=%22M102.0 31.2 Q101.2 24.6 94.5 25.5%22/%3E%3Cpath d=%22M94.5 25.5 Q95.4 18.8 88.8 18.0%22/%3E%3Cpath d=%22M88.8 18.0 Q91.4 11.8 85.2 9.3%22/%3E%3Cpath d=%22M85.2 9.3 Q89.3 4.0 84.0 0.0%22/%3E%3Cpath d=%22M120.0 54.0 Q113.9 46.0 106.0 52.2%22/%3E%3Cpath d=%22M106.0 52.2 Q102.2 42.9 93.0 46.8%22/%3E%3Cpath d=%22M93.0 46.8 Q91.7 36.8 81.8 38.2%22/%3E%3Cpath d=%22M81.8 38.2 Q83.2 28.3 73.2 27.0%22/%3E%3Cpath d=%22M73.2 27.0 Q77.1 17.8 67.8 14.0%22/%3E%3Cpath d=%22M67.8 14.0 Q74.0 6.1 66.0 0.0%22/%3E%3Cpath d=%22M120.0 72.0 Q111.9 61.4 101.4 69.5%22/%3E%3Cpath d=%22M101.4 69.5 Q96.3 57.2 84.0 62.4%22/%3E%3Cpath d=%22M84.0 62.4 Q82.3 49.1 69.1 50.9%22/%3E%3Cpath d=%22M69.1 50.9 Q70.9 37.7 57.6 36.0%22/%3E%3Cpath d=%22M57.6 36.0 Q62.8 23.7 50.5 18.6%22/%3E%3Cpath d=%22M50.5 18.6 Q58.6 8.1 48.0 0.0%22/%3E%3Cpath d=%22M120.0 90.0 Q109.9 76.7 96.7 86.9%22/%3E%3Cpath d=%22M96.7 86.9 Q90.4 71.5 75.0 77.9%22/%3E%3Cpath d=%22M75.0 77.9 Q72.9 61.4 56.4 63.6%22/%3E%3Cpath d=%22M56.4 63.6 Q58.6 47.1 42.1 45.0%22/%3E%3Cpath d=%22M42.1 45.0 Q48.5 29.6 33.1 23.3%22/%3E%3Cpath d=%22M33.1 23.3 Q43.3 10.1 30.0 0.0%22/%3E%3Cpath d=%22M120.0 108.0 Q107.9 92.1 92.0 104.3%22/%3E%3Cpath d=%22M92.0 104.3 Q84.5 85.8 66.0 93.5%22/%3E%3Cpath d=%22M66.0 93.5 Q63.5 73.7 43.6 76.4%22/%3E%3Cpath d=%22M43.6 76.4 Q46.3 56.5 26.5 54.0%22/%3E%3Cpath d=%22M26.5 54.0 Q34.2 35.5 15.7 28.0%22/%3E%3Cpath d=%22M15.7 28.0 Q27.9 12.1 12.0 0.0%22/%3E%3C/g%3E%3Cline x1=%2278%22 y1=%2240%22 x2=%2278%22 y2=%2284%22 stroke=%22%23EDE7F6%22 stroke-opacity=%22.7%22 stroke-width=%221%22/%3E%3Cg transform=%22translate(78 92)%22%3E%3Cpath d=%22M-7 -4 C-14 -10 -18 -8 -22 -2 M-8 0 C-16 -2 -20 2 -22 8 M-7 4 C-14 6 -16 12 -14 18 M7 -4 C14 -10 18 -8 22 -2 M8 0 C16 -2 20 2 22 8 M7 4 C14 6 16 12 14 18%22 fill=%22none%22 stroke=%22%23111%22 stroke-width=%222%22 stroke-linecap=%22round%22/%3E%3Cellipse rx=%227%22 ry=%229%22 fill=%22%231A1A1A%22/%3E%3Cellipse cx=%22-2%22 cy=%22-3%22 rx=%222.5%22 ry=%223.5%22 fill=%22%233A3A3A%22/%3E%3Ccircle cy=%22-11%22 r=%224.5%22 fill=%22%231A1A1A%22/%3E%3Ccircle cx=%22-1.8%22 cy=%22-12%22 r=%221.1%22 fill=%22%23FF7A1A%22/%3E%3Ccircle cx=%221.8%22 cy=%22-12%22 r=%221.1%22 fill=%22%23FF7A1A%22/%3E%3Cpath d=%22M-1 4 L0 8 L1 4Z%22 fill=%22%23E53935%22/%3E%3C/g%3E%3C/svg%3E")} html[data-theme=halloween] .dish__img::before{left:auto;bottom:auto;right:0;top:0;width:104px;height:104px;filter:none} html[data-theme=halloween] .ticket::after{right:0;bottom:auto;top:0;width:76px;height:76px;filter:none} html[data-theme=halloween] .show::before{left:auto;top:0;right:0;width:130px;height:130px;filter:none} html[data-theme=halloween] .dish{border-color:rgba(156,77,204,.45)} html[data-theme=fete-nationale]{--orn:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 90 120%22%3E%3Cdefs%3E%3ClinearGradient id=%22bl%22 x1=%220%22 y1=%220%22 x2=%220%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%233D73E0%22/%3E%3Cstop offset=%221%22 stop-color=%22%23173C8F%22/%3E%3C/linearGradient%3E%3ClinearGradient id=%22rd%22 x1=%220%22 y1=%220%22 x2=%220%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%23F0625A%22/%3E%3Cstop offset=%221%22 stop-color=%22%23A3161A%22/%3E%3C/linearGradient%3E%3CradialGradient id=%22gd%22 cx=%22.4%22 cy=%22.35%22 r=%22.7%22%3E%3Cstop offset=%220%22 stop-color=%22%23FFE59A%22/%3E%3Cstop offset=%221%22 stop-color=%22%23B8860B%22/%3E%3C/radialGradient%3E%3C/defs%3E%0A%3Cpath d=%22M30 70 L16 114 L30 104 L38 112 Z%22 fill=%22url(%23bl)%22/%3E%3Cpath d=%22M60 70 L74 114 L60 104 L52 112 Z%22 fill=%22url(%23rd)%22/%3E%3Cpath d=%22M32 78 L22 108%22 stroke=%22%23fff%22 stroke-opacity=%22.35%22 stroke-width=%222%22/%3E%3Cpath d=%22M58 78 L68 108%22 stroke=%22%23fff%22 stroke-opacity=%22.35%22 stroke-width=%222%22/%3E%0A%3Ccircle cx=%2245%22 cy=%2245%22 r=%2242%22 fill=%22%231C3F8F%22/%3E%3Ccircle cx=%2245%22 cy=%2245%22 r=%2242%22 fill=%22none%22 stroke=%22%235B8BE8%22 stroke-width=%227%22 stroke-dasharray=%223 2.6%22 stroke-opacity=%22.9%22/%3E%3Ccircle cx=%2245%22 cy=%2245%22 r=%2236%22 fill=%22url(%23bl)%22/%3E%0A%3Ccircle cx=%2245%22 cy=%2245%22 r=%2229%22 fill=%22%23E8E8E8%22/%3E%3Ccircle cx=%2245%22 cy=%2245%22 r=%2229%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%226%22 stroke-dasharray=%223 2.4%22/%3E%3Ccircle cx=%2245%22 cy=%2245%22 r=%2224%22 fill=%22%23fff%22/%3E%0A%3Ccircle cx=%2245%22 cy=%2245%22 r=%2217%22 fill=%22%23B71C1C%22/%3E%3Ccircle cx=%2245%22 cy=%2245%22 r=%2217%22 fill=%22none%22 stroke=%22%23F0625A%22 stroke-width=%225%22 stroke-dasharray=%223 2.2%22/%3E%3Ccircle cx=%2245%22 cy=%2245%22 r=%2212%22 fill=%22url(%23rd)%22/%3E%0A%3Ccircle cx=%2245%22 cy=%2245%22 r=%224%22 fill=%22url(%23gd)%22/%3E%3Cpath d=%22M26 28 C30 20 38 16 44 16%22 fill=%22none%22 stroke=%22%23fff%22 stroke-opacity=%22.5%22 stroke-width=%223%22 stroke-linecap=%22round%22/%3E%3C/svg%3E")} html[data-theme=fete-nationale] .dish__img::before{width:58px;height:78px} html[data-theme=fete-nationale] .ticket::after{width:34px;height:46px} html[data-theme=fete-nationale] .show::before{width:66px;height:88px} html[data-theme=saint-valentin]{--orn:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 110 100%22%3E%3Cdefs%3E%3ClinearGradient id=%22h1%22 x1=%220%22 y1=%220%22 x2=%22.3%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%23FF8A80%22/%3E%3Cstop offset=%22.5%22 stop-color=%22%23E53935%22/%3E%3Cstop offset=%221%22 stop-color=%22%238E1414%22/%3E%3C/linearGradient%3E%3ClinearGradient id=%22h2%22 x1=%220%22 y1=%220%22 x2=%22.3%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%23FFC1E3%22/%3E%3Cstop offset=%22.5%22 stop-color=%22%23F06292%22/%3E%3Cstop offset=%221%22 stop-color=%22%23AD1457%22/%3E%3C/linearGradient%3E%3ClinearGradient id=%22h3%22 x1=%220%22 y1=%220%22 x2=%22.3%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%23FFE0E6%22/%3E%3Cstop offset=%22.5%22 stop-color=%22%23F8A5C2%22/%3E%3Cstop offset=%221%22 stop-color=%22%23C2185B%22/%3E%3C/linearGradient%3E%3C/defs%3E%0A%3Cpath d=%22M40 90 C4 64 8 26 28 24 C36 24 40 30 40 36 C40 30 44 24 52 24 C72 26 76 64 40 90Z%22 fill=%22rgba(0,0,0,.25)%22 transform=%22translate(3 4)%22/%3E%3Cpath d=%22M40 90 C4 64 8 26 28 24 C36 24 40 30 40 36 C40 30 44 24 52 24 C72 26 76 64 40 90Z%22 fill=%22url(%23h1)%22/%3E%3Cpath d=%22M20 36 C16 42 16 50 20 58%22 fill=%22none%22 stroke=%22%23fff%22 stroke-opacity=%22.75%22 stroke-width=%225%22 stroke-linecap=%22round%22/%3E%3Ccircle cx=%2226%22 cy=%2232%22 r=%223%22 fill=%22%23fff%22 fill-opacity=%22.85%22/%3E%0A%3Cpath d=%22M80 64 C58 48 60 24 72 24 C77 24 79 28 80 31 C81 28 83 24 88 24 C100 24 102 48 80 64Z%22 fill=%22url(%23h2)%22/%3E%3Cpath d=%22M68 32 C66 36 66 40 68 44%22 fill=%22none%22 stroke=%22%23fff%22 stroke-opacity=%22.75%22 stroke-width=%223.5%22 stroke-linecap=%22round%22/%3E%0A%3Cpath d=%22M90 92 C76 82 78 68 85 68 C88 68 89 70 90 72 C91 70 92 68 95 68 C102 68 104 82 90 92Z%22 fill=%22url(%23h3)%22/%3E%0A%3Cpath d=%22M14 14 L16 20 L22 22 L16 24 L14 30 L12 24 L6 22 L12 20Z%22 fill=%22%23fff%22 fill-opacity=%22.9%22/%3E%3Cpath d=%22M98 6 L99.5 10.5 L104 12 L99.5 13.5 L98 18 L96.5 13.5 L92 12 L96.5 10.5Z%22 fill=%22%23fff%22 fill-opacity=%22.85%22/%3E%3Ccircle cx=%2260%22 cy=%2212%22 r=%222%22 fill=%22%23fff%22 fill-opacity=%22.8%22/%3E%3C/svg%3E")} html[data-theme=saint-valentin] .dish{border-color:rgba(216,27,96,.4)} html[data-theme=paques]{--orn:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 120 100%22%3E%3Cdefs%3E%3ClinearGradient id=%22e1%22 x1=%220%22 y1=%220%22 x2=%22.3%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%23FFD1E3%22/%3E%3Cstop offset=%22.5%22 stop-color=%22%23F48FB1%22/%3E%3Cstop offset=%221%22 stop-color=%22%23C2185B%22/%3E%3C/linearGradient%3E%3ClinearGradient id=%22e2%22 x1=%220%22 y1=%220%22 x2=%22.3%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%23CFE8FF%22/%3E%3Cstop offset=%22.5%22 stop-color=%22%2390CAF9%22/%3E%3Cstop offset=%221%22 stop-color=%22%231E6BB8%22/%3E%3C/linearGradient%3E%3ClinearGradient id=%22e3%22 x1=%220%22 y1=%220%22 x2=%22.3%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%23FFFBD1%22/%3E%3Cstop offset=%22.5%22 stop-color=%22%23FFF176%22/%3E%3Cstop offset=%221%22 stop-color=%22%23D4A800%22/%3E%3C/linearGradient%3E%3C/defs%3E%0A%3Cpath d=%22M4 92 Q10 70 14 92 M14 92 Q22 66 28 92 M28 92 Q34 74 40 92 M80 92 Q86 70 90 92 M90 92 Q98 66 104 92 M104 92 Q110 74 116 92%22 fill=%22none%22 stroke=%22%2343A047%22 stroke-width=%223.5%22 stroke-linecap=%22round%22/%3E%3Cpath d=%22M8 92 Q14 78 18 92 M34 92 Q38 80 42 92 M84 92 Q90 78 94 92 M108 92 Q112 80 114 92%22 fill=%22none%22 stroke=%22%2381C784%22 stroke-width=%222.5%22 stroke-linecap=%22round%22/%3E%0A%3Cpath d=%22M36 90 C16 90 10 60 16 44 C22 26 50 26 56 44 C62 60 56 90 36 90Z%22 fill=%22rgba(0,0,0,.22)%22 transform=%22translate(3 3)%22/%3E%3Cpath d=%22M36 90 C16 90 10 60 16 44 C22 26 50 26 56 44 C62 60 56 90 36 90Z%22 fill=%22url(%23e1)%22/%3E%3Cpath d=%22M14 56 L20 50 L26 56 L32 50 L38 56 L44 50 L50 56 L56 50%22 fill=%22none%22 stroke=%22%23fff%22 stroke-opacity=%22.9%22 stroke-width=%223%22 stroke-linejoin=%22round%22/%3E%3Cpath d=%22M15 70 Q36 78 57 70%22 fill=%22none%22 stroke=%22%23fff%22 stroke-opacity=%22.8%22 stroke-width=%222.6%22/%3E%3Cpath d=%22M24 38 C20 42 19 48 20 54%22 fill=%22none%22 stroke=%22%23fff%22 stroke-opacity=%22.7%22 stroke-width=%223.5%22 stroke-linecap=%22round%22/%3E%0A%3Cpath d=%22M82 92 C66 92 62 68 66 56 C70 42 94 42 98 56 C102 68 98 92 82 92Z%22 fill=%22rgba(0,0,0,.22)%22 transform=%22translate(3 3)%22/%3E%3Cpath d=%22M82 92 C66 92 62 68 66 56 C70 42 94 42 98 56 C102 68 98 92 82 92Z%22 fill=%22url(%23e2)%22/%3E%3Ccircle cx=%2276%22 cy=%2260%22 r=%223%22 fill=%22%23fff%22 fill-opacity=%22.9%22/%3E%3Ccircle cx=%2288%22 cy=%2266%22 r=%223%22 fill=%22%23fff%22 fill-opacity=%22.9%22/%3E%3Ccircle cx=%2280%22 cy=%2276%22 r=%223%22 fill=%22%23fff%22 fill-opacity=%22.9%22/%3E%3Ccircle cx=%2292%22 cy=%2280%22 r=%222.4%22 fill=%22%23fff%22 fill-opacity=%22.9%22/%3E%3Ccircle cx=%2284%22 cy=%2252%22 r=%222.2%22 fill=%22%23fff%22 fill-opacity=%22.9%22/%3E%3Cpath d=%22M72 50 C69 54 68 58 69 62%22 fill=%22none%22 stroke=%22%23fff%22 stroke-opacity=%22.7%22 stroke-width=%223%22 stroke-linecap=%22round%22/%3E%0A%3Cpath d=%22M60 88 C48 88 46 70 49 62 C52 52 68 52 71 62 C74 70 72 88 60 88Z%22 fill=%22rgba(0,0,0,.22)%22 transform=%22translate(2 3)%22/%3E%3Cpath d=%22M60 88 C48 88 46 70 49 62 C52 52 68 52 71 62 C74 70 72 88 60 88Z%22 fill=%22url(%23e3)%22/%3E%3Cpath d=%22M48 68 Q60 62 72 68 M48 76 Q60 82 72 76%22 fill=%22none%22 stroke=%22%23fff%22 stroke-opacity=%22.9%22 stroke-width=%222.2%22/%3E%0A%3Cpath d=%22M104 60 L104 40%22 stroke=%22%2343A047%22 stroke-width=%223%22 stroke-linecap=%22round%22/%3E%3Cpath d=%22M96 42 L96 26 Q104 32 112 26 L112 42 Q104 50 96 42Z%22 fill=%22%23F48FB1%22/%3E%3Cpath d=%22M100 30 L100 40%22 stroke=%22%23fff%22 stroke-opacity=%22.6%22 stroke-width=%222%22/%3E%3C/svg%3E")} html[data-theme=paques] .dish__img::before{width:96px;height:80px;left:6px;bottom:0;filter:none} html[data-theme=paques] .ticket::after{width:52px;height:44px;right:6px;bottom:0;filter:none} html[data-theme=paques] .dish{border-color:rgba(165,214,167,.7)} @media (max-width:600px){html[data-theme] .dish__img::before{width:64px;height:64px}html[data-theme=paques] .dish__img::before{width:80px;height:66px}html[data-theme] .dish::before,html[data-theme] .ardoise::after{height:72px;background-size:130px 72px}} /* thème actif : l'étiquette de prix descend sous la petite banderole */ html[data-theme] .dish__price{top:auto;bottom:14px;right:14px;left:auto;z-index:4} html[data-theme] .dish[data-rupture] .dish__img::after{bottom:52px} /* ruban de circonstance : plus grand, double filet, plis marqués */ .deco-ribbon{padding:10px 30px;font-size:1.3rem;letter-spacing:.03em;border-top:1px solid rgba(255,255,255,.35);box-shadow:inset 0 0 0 2px rgba(255,255,255,.16),inset 0 0 0 4px rgba(0,0,0,.1),0 12px 26px -10px rgba(0,0,0,.75);text-shadow:0 1px 0 rgba(0,0,0,.25)} .deco-ribbon::before,.deco-ribbon::after{width:34px;top:10px} .deco-ribbon::before{left:-22px}.deco-ribbon::after{right:-22px} .deco-ribbon span{position:relative} .deco-ribbon span::before,.deco-ribbon span::after{content:"";position:absolute;top:calc(100% + 6px);width:10px;height:10px;background:rgba(0,0,0,.35);clip-path:polygon(0 0,100% 0,100% 100%)} .deco-ribbon span::before{left:-30px;transform:scaleX(-1)}.deco-ribbon span::after{right:-30px} @media (max-width:600px){.deco-ribbon{font-size:1.1rem;padding:8px 22px}.deco-ribbon::before,.deco-ribbon::after{width:28px}} /* ---------- décorations alternées sur les encarts et liserés de thème ---------- */ html[data-theme] .dish:nth-child(3n+2) .dish__img::before{background-image:var(--orn-b)} html[data-theme] .dish:nth-child(3n) .dish__img::before{background-image:var(--orn-c)} html[data-theme] .dish:nth-child(2n)::before{background-position:96px top} html[data-theme] .ticket:nth-child(2n)::after{background-image:var(--orn-b)} html[data-theme=noel]{--orn-b:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 120 120%22%3E%3Cdefs%3E%3ClinearGradient id=%22r%22 x1=%220%22 y1=%220%22 x2=%221%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%23EF5350%22/%3E%3Cstop offset=%221%22 stop-color=%22%239E1B1B%22/%3E%3C/linearGradient%3E%3C/defs%3E%0A%3Cg transform=%22rotate(-30 60 70)%22%3E%3Cpath d=%22M48 112 V46 A14 14 0 0 1 76 46 V58%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%2213%22 stroke-linecap=%22round%22/%3E%3Cpath d=%22M48 112 V46 A14 14 0 0 1 76 46 V58%22 fill=%22none%22 stroke=%22%23E53935%22 stroke-width=%2213%22 stroke-linecap=%22round%22 stroke-dasharray=%227 9%22/%3E%3Cpath d=%22M48 112 V46 A14 14 0 0 1 76 46 V58%22 fill=%22none%22 stroke=%22rgba(0,0,0,.18)%22 stroke-width=%2213%22 stroke-linecap=%22round%22 stroke-dasharray=%221 15%22 stroke-dashoffset=%224%22/%3E%3C/g%3E%0A%3Cg transform=%22rotate(30 60 70)%22%3E%3Cpath d=%22M72 112 V46 A14 14 0 0 0 44 46 V58%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%2213%22 stroke-linecap=%22round%22/%3E%3Cpath d=%22M72 112 V46 A14 14 0 0 0 44 46 V58%22 fill=%22none%22 stroke=%22%232E7D32%22 stroke-width=%2213%22 stroke-linecap=%22round%22 stroke-dasharray=%227 9%22 stroke-dashoffset=%223%22/%3E%3C/g%3E%0A%3Cpath d=%22M36 60 C20 50 20 30 36 32 C40 32 44 36 46 40 C40 48 36 54 36 60Z M84 60 C100 50 100 30 84 32 C80 32 76 36 74 40 C80 48 84 54 84 60Z%22 fill=%22url(%23r)%22/%3E%3Crect x=%2250%22 y=%2252%22 width=%2220%22 height=%2216%22 rx=%225%22 fill=%22url(%23r)%22/%3E%3Cpath d=%22M50 66 L40 92 L50 88 L56 96Z M70 66 L80 92 L70 88 L64 96Z%22 fill=%22url(%23r)%22/%3E%3Cpath d=%22M40 38 C36 40 36 44 38 48%22 stroke=%22%23FFCDD2%22 stroke-width=%222.5%22 fill=%22none%22 stroke-linecap=%22round%22/%3E%3Ccircle cx=%2290%22 cy=%2296%22 r=%227%22 fill=%22%23F2C14E%22/%3E%3Ccircle cx=%2288%22 cy=%2294%22 r=%222%22 fill=%22%23fff%22 fill-opacity=%22.8%22/%3E%3Ccircle cx=%22104%22 cy=%22104%22 r=%224%22 fill=%22%23F2C14E%22/%3E%3C/svg%3E");--orn-c:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 120 120%22%3E%3Cdefs%3E%3ClinearGradient id=%22g%22 x1=%220%22 y1=%220%22 x2=%220%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%23EF5350%22/%3E%3Cstop offset=%221%22 stop-color=%22%239E1B1B%22/%3E%3C/linearGradient%3E%3ClinearGradient id=%22y%22 x1=%220%22 y1=%220%22 x2=%220%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%23FFE59A%22/%3E%3Cstop offset=%221%22 stop-color=%22%23C9A227%22/%3E%3C/linearGradient%3E%3CradialGradient id=%22b%22 cx=%22.35%22 cy=%22.3%22 r=%22.7%22%3E%3Cstop offset=%220%22 stop-color=%22%23BBDEFB%22/%3E%3Cstop offset=%22.6%22 stop-color=%22%231E88E5%22/%3E%3Cstop offset=%221%22 stop-color=%22%230D47A1%22/%3E%3C/radialGradient%3E%3C/defs%3E%0A%3Crect x=%2222%22 y=%2256%22 width=%2262%22 height=%2252%22 rx=%224%22 fill=%22url(%23g)%22/%3E%3Crect x=%2218%22 y=%2246%22 width=%2270%22 height=%2216%22 rx=%223%22 fill=%22%23C62828%22/%3E%3Crect x=%2218%22 y=%2246%22 width=%2270%22 height=%225%22 rx=%222%22 fill=%22%23fff%22 fill-opacity=%22.25%22/%3E%3Crect x=%2246%22 y=%2246%22 width=%2214%22 height=%2262%22 fill=%22url(%23y)%22/%3E%3Crect x=%2222%22 y=%2278%22 width=%2262%22 height=%2210%22 fill=%22url(%23y)%22/%3E%0A%3Cpath d=%22M53 46 C40 28 26 32 34 44 C40 48 48 48 53 46Z M53 46 C66 28 80 32 72 44 C66 48 58 48 53 46Z%22 fill=%22url(%23y)%22/%3E%3Ccircle cx=%2253%22 cy=%2246%22 r=%225%22 fill=%22%23F2C14E%22/%3E%3Cpath d=%22M53 46 L44 60 M53 46 L62 60%22 stroke=%22url(%23y)%22 stroke-width=%225%22 stroke-linecap=%22round%22/%3E%0A%3Ccircle cx=%2298%22 cy=%2290%22 r=%2214%22 fill=%22url(%23b)%22/%3E%3Crect x=%2294%22 y=%2272%22 width=%228%22 height=%226%22 rx=%221%22 fill=%22%23F2C14E%22/%3E%3Ccircle cx=%2293%22 cy=%2285%22 r=%223%22 fill=%22%23fff%22 fill-opacity=%22.8%22/%3E%3Cpath d=%22M86 90 Q98 86 110 90%22 stroke=%22%23fff%22 stroke-opacity=%22.6%22 stroke-width=%222%22 fill=%22none%22/%3E%0A%3Cpath d=%22M22 30 L24 36 L30 38 L24 40 L22 46 L20 40 L14 38 L20 36Z%22 fill=%22%23FFF3C4%22/%3E%3Cpath d=%22M100 22 L101.5 26.5 L106 28 L101.5 29.5 L100 34 L98.5 29.5 L94 28 L98.5 26.5Z%22 fill=%22%23FFF3C4%22/%3E%3C/svg%3E");--stripe:repeating-linear-gradient(135deg,#E53935 0 10px,#F7F9FC 10px 20px)} html[data-theme=halloween]{--orn-b:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 120 110%22%3E%3Cdefs%3E%3CradialGradient id=%22p%22 cx=%22.4%22 cy=%22.3%22 r=%22.8%22%3E%3Cstop offset=%220%22 stop-color=%22%23FFB74D%22/%3E%3Cstop offset=%22.6%22 stop-color=%22%23FF7A1A%22/%3E%3Cstop offset=%221%22 stop-color=%22%23BF4A00%22/%3E%3C/radialGradient%3E%3C/defs%3E%0A%3Cpath d=%22M30 20 C24 12 20 8 28 6 C34 10 38 14 40 18Z M60 26 C58 20 50 18 44 22 C48 24 48 28 46 32 C50 30 54 30 58 34 L60 32 L62 34 C66 30 70 30 74 32 C72 28 72 24 76 22 C70 18 62 20 60 26Z%22 fill=%22%23111%22/%3E%0A%3Crect x=%2256%22 y=%2234%22 width=%2210%22 height=%2216%22 rx=%223%22 fill=%22%234E6B2A%22/%3E%3Cpath d=%22M60 36 C66 30 72 32 70 40%22 fill=%22none%22 stroke=%22%234E6B2A%22 stroke-width=%223%22 stroke-linecap=%22round%22/%3E%0A%3Cellipse cx=%2234%22 cy=%2274%22 rx=%2220%22 ry=%2228%22 fill=%22%23D65A00%22/%3E%3Cellipse cx=%2286%22 cy=%2274%22 rx=%2220%22 ry=%2228%22 fill=%22%23D65A00%22/%3E%3Cellipse cx=%2246%22 cy=%2274%22 rx=%2220%22 ry=%2230%22 fill=%22%23E86A0C%22/%3E%3Cellipse cx=%2274%22 cy=%2274%22 rx=%2220%22 ry=%2230%22 fill=%22%23E86A0C%22/%3E%3Cellipse cx=%2260%22 cy=%2274%22 rx=%2222%22 ry=%2231%22 fill=%22url(%23p)%22/%3E%0A%3Cpath d=%22M44 62 L52 72 L38 72Z M76 62 L68 72 L82 72Z%22 fill=%22%23FFE082%22/%3E%3Cpath d=%22M38 84 L44 90 L50 84 L56 90 L62 84 L68 90 L74 84 L80 90%22 fill=%22none%22 stroke=%22%23FFE082%22 stroke-width=%223%22 stroke-linejoin=%22round%22/%3E%3Cellipse cx=%2250%22 cy=%2256%22 rx=%225%22 ry=%229%22 fill=%22%23fff%22 fill-opacity=%22.18%22/%3E%3C/svg%3E");--orn-c:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 110 120%22%3E%3Cdefs%3E%3ClinearGradient id=%22w%22 x1=%220%22 y1=%220%22 x2=%220%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%23FFFFFF%22/%3E%3Cstop offset=%221%22 stop-color=%22%23D9D2E9%22/%3E%3C/linearGradient%3E%3C/defs%3E%0A%3Cpath d=%22M22 112 V52 A33 33 0 0 1 88 52 V112 L76 100 L66 112 L55 100 L44 112 L33 100Z%22 fill=%22rgba(0,0,0,.25)%22 transform=%22translate(4 5)%22/%3E%3Cpath d=%22M22 112 V52 A33 33 0 0 1 88 52 V112 L76 100 L66 112 L55 100 L44 112 L33 100Z%22 fill=%22url(%23w)%22/%3E%0A%3Cellipse cx=%2243%22 cy=%2254%22 rx=%225%22 ry=%227%22 fill=%22%231A1A1A%22/%3E%3Cellipse cx=%2265%22 cy=%2254%22 rx=%225%22 ry=%227%22 fill=%22%231A1A1A%22/%3E%3Ccircle cx=%2245%22 cy=%2251%22 r=%221.6%22 fill=%22%23fff%22/%3E%3Ccircle cx=%2267%22 cy=%2251%22 r=%221.6%22 fill=%22%23fff%22/%3E%3Cellipse cx=%2254%22 cy=%2272%22 rx=%226%22 ry=%228%22 fill=%22%231A1A1A%22/%3E%3Cellipse cx=%2254%22 cy=%2270%22 rx=%223%22 ry=%223%22 fill=%22%23E53935%22 fill-opacity=%22.6%22/%3E%3Ccircle cx=%2234%22 cy=%2266%22 r=%224%22 fill=%22%23F8BBD0%22 fill-opacity=%22.7%22/%3E%3Ccircle cx=%2274%22 cy=%2266%22 r=%224%22 fill=%22%23F8BBD0%22 fill-opacity=%22.7%22/%3E%0A%3Cg transform=%22translate(86 86) rotate(20)%22%3E%3Crect x=%22-10%22 y=%22-6%22 width=%2220%22 height=%2212%22 rx=%223%22 fill=%22%23FF7A1A%22/%3E%3Cpath d=%22M-10 -6 L-16 -10 L-14 0 L-16 10 L-10 6Z M10 -6 L16 -10 L14 0 L16 10 L10 6Z%22 fill=%22%23FF7A1A%22/%3E%3Cpath d=%22M-6 -2 H6 M-6 2 H6%22 stroke=%22%23FFE082%22 stroke-width=%221.5%22/%3E%3C/g%3E%0A%3Cpath d=%22M14 24 L16 30 L22 32 L16 34 L14 40 L12 34 L6 32 L12 30Z%22 fill=%22%239C4DCC%22/%3E%3Cpath d=%22M96 18 L97 21 L100 22 L97 23 L96 26 L95 23 L92 22 L95 21Z%22 fill=%22%239C4DCC%22/%3E%3C/svg%3E");--stripe:repeating-linear-gradient(90deg,#FF7A1A 0 14px,#1A1A1A 14px 28px,#9C4DCC 28px 42px,#1A1A1A 42px 56px)} html[data-theme=halloween] .dish:nth-child(3n+2) .dish__img::before,html[data-theme=halloween] .dish:nth-child(3n) .dish__img::before{left:10px;bottom:8px;right:auto;top:auto;width:84px;height:84px;filter:drop-shadow(0 3px 4px rgba(0,0,0,.4))} html[data-theme=halloween] .ticket:nth-child(2n)::after{right:8px;bottom:8px;top:auto;width:48px;height:48px;filter:drop-shadow(0 3px 4px rgba(0,0,0,.4))} html[data-theme=fete-nationale]{--orn-b:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 120 120%22%3E%3Cg transform=%22rotate(-25 60 70)%22%3E%3Crect x=%2258%22 y=%2220%22 width=%224%22 height=%2296%22 rx=%222%22 fill=%22%235D4037%22/%3E%3Ccircle cx=%2260%22 cy=%2218%22 r=%225%22 fill=%22%23F2C14E%22/%3E%3Cpath d=%22M62 24 C78 20 90 30 108 24 L108 60 C90 66 78 56 62 60Z%22 fill=%22%232457C5%22/%3E%3Cpath d=%22M77 22 C84 24 90 28 93 26 L93 62 C90 64 84 60 77 58Z%22 fill=%22%23F5F5F5%22/%3E%3Cpath d=%22M93 26 C98 26 103 24 108 24 L108 60 C103 60 98 62 93 62Z%22 fill=%22%23E53935%22/%3E%3C/g%3E%3Cg transform=%22rotate(25 60 70)%22%3E%3Crect x=%2258%22 y=%2220%22 width=%224%22 height=%2296%22 rx=%222%22 fill=%22%235D4037%22/%3E%3Ccircle cx=%2260%22 cy=%2218%22 r=%225%22 fill=%22%23F2C14E%22/%3E%3Cpath d=%22M58 24 C42 20 30 30 12 24 L12 60 C30 66 42 56 58 60Z%22 fill=%22%23E53935%22/%3E%3Cpath d=%22M43 22 C36 24 30 28 27 26 L27 62 C30 64 36 60 43 58Z%22 fill=%22%23F5F5F5%22/%3E%3Cpath d=%22M27 26 C22 26 17 24 12 24 L12 60 C17 60 22 62 27 62Z%22 fill=%22%232457C5%22/%3E%3C/g%3E%3Ccircle cx=%2260%22 cy=%2292%22 r=%227%22 fill=%22%23F2C14E%22/%3E%3Ccircle cx=%2260%22 cy=%2292%22 r=%223.5%22 fill=%22%23E53935%22/%3E%3C/svg%3E");--orn-c:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 120 120%22%3E%3Cg stroke-linecap=%22round%22%3E%3Cg stroke=%22%232457C5%22 stroke-width=%223%22%3E%3Cpath d=%22M60 60 L60 14 M60 60 L28 28 M60 60 L92 28%22/%3E%3C/g%3E%3Cg stroke=%22%23F5F5F5%22 stroke-width=%223%22%3E%3Cpath d=%22M60 60 L14 60 M60 60 L106 60 M60 60 L28 92 M60 60 L92 92%22/%3E%3C/g%3E%3Cg stroke=%22%23E53935%22 stroke-width=%223%22%3E%3Cpath d=%22M60 60 L60 106 M60 60 L40 20 M60 60 L80 20 M60 60 L20 80 M60 60 L100 80%22/%3E%3C/g%3E%3C/g%3E%3Cg fill=%22%23F2C14E%22%3E%3Ccircle cx=%2260%22 cy=%2212%22 r=%224%22/%3E%3Ccircle cx=%2226%22 cy=%2226%22 r=%224%22/%3E%3Ccircle cx=%2294%22 cy=%2226%22 r=%224%22/%3E%3Ccircle cx=%2212%22 cy=%2260%22 r=%224%22/%3E%3Ccircle cx=%22108%22 cy=%2260%22 r=%224%22/%3E%3Ccircle cx=%2226%22 cy=%2294%22 r=%224%22/%3E%3Ccircle cx=%2294%22 cy=%2294%22 r=%224%22/%3E%3Ccircle cx=%2260%22 cy=%22108%22 r=%224%22/%3E%3C/g%3E%3Ccircle cx=%2260%22 cy=%2260%22 r=%2210%22 fill=%22%23FFF3C4%22/%3E%3Ccircle cx=%2260%22 cy=%2260%22 r=%2216%22 fill=%22%23F2C14E%22 fill-opacity=%22.35%22/%3E%3Cpath d=%22M24 48 L25.5 52.5 L30 54 L25.5 55.5 L24 60 L22.5 55.5 L18 54 L22.5 52.5Z M96 44 L97 47 L100 48 L97 49 L96 52 L95 49 L92 48 L95 47Z%22 fill=%22%23fff%22/%3E%3C/svg%3E");--stripe:linear-gradient(90deg,#2457C5 0 33.3%,#F5F0E6 33.3% 66.6%,#E53935 66.6%)} html[data-theme=fete-nationale] .dish:nth-child(3n+2) .dish__img::before,html[data-theme=fete-nationale] .dish:nth-child(3n) .dish__img::before{width:84px;height:84px} html[data-theme=fete-nationale] .ticket:nth-child(2n)::after{width:48px;height:48px} html[data-theme=saint-valentin]{--orn-b:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 120 100%22%3E%3Cdefs%3E%3ClinearGradient id=%22e%22 x1=%220%22 y1=%220%22 x2=%220%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%23FFF8F0%22/%3E%3Cstop offset=%221%22 stop-color=%22%23EBD9CF%22/%3E%3C/linearGradient%3E%3CradialGradient id=%22s%22 cx=%22.4%22 cy=%22.35%22 r=%22.7%22%3E%3Cstop offset=%220%22 stop-color=%22%23FF8A80%22/%3E%3Cstop offset=%22.6%22 stop-color=%22%23D32F2F%22/%3E%3Cstop offset=%221%22 stop-color=%22%238E1414%22/%3E%3C/radialGradient%3E%3C/defs%3E%0A%3Cg transform=%22rotate(-8 60 60)%22%3E%3Crect x=%2218%22 y=%2234%22 width=%2284%22 height=%2258%22 rx=%225%22 fill=%22rgba(0,0,0,.22)%22 transform=%22translate(3 4)%22/%3E%3Crect x=%2218%22 y=%2234%22 width=%2284%22 height=%2258%22 rx=%225%22 fill=%22url(%23e)%22/%3E%3Cpath d=%22M18 40 L60 70 L102 40%22 fill=%22none%22 stroke=%22%23D7BFB3%22 stroke-width=%222%22/%3E%3Cpath d=%22M18 92 L50 62 M102 92 L70 62%22 stroke=%22%23D7BFB3%22 stroke-width=%221.6%22/%3E%3Cpath d=%22M18 36 L60 66 L102 36 L102 40 L60 72 L18 40Z%22 fill=%22%23F3E2D8%22/%3E%0A%3Ccircle cx=%2260%22 cy=%2266%22 r=%2211%22 fill=%22url(%23s)%22/%3E%3Cpath d=%22M60 71 C53 66 54 59 58 59 C59 59 60 61 60 62 C60 61 61 59 62 59 C66 59 67 66 60 71Z%22 fill=%22%23FFCDD2%22 fill-opacity=%22.9%22/%3E%3C/g%3E%0A%3Cpath d=%22M98 20 C92 14 94 6 100 7 C102 7 103 9 104 10 C105 9 106 7 108 7 C114 6 116 14 104 24Z%22 fill=%22%23F48FB1%22/%3E%3Cpath d=%22M14 22 C10 18 12 12 16 13 C17 13 18 14 18 15 C19 14 20 13 21 13 C25 12 26 18 18 26Z%22 fill=%22%23E53935%22/%3E%3C/svg%3E");--orn-c:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 110 120%22%3E%3Cdefs%3E%3CradialGradient id=%22r%22 cx=%22.45%22 cy=%22.4%22 r=%22.7%22%3E%3Cstop offset=%220%22 stop-color=%22%23FF6F6F%22/%3E%3Cstop offset=%22.6%22 stop-color=%22%23D81B40%22/%3E%3Cstop offset=%221%22 stop-color=%22%238E0E2E%22/%3E%3C/radialGradient%3E%3C/defs%3E%0A%3Cpath d=%22M54 56 C50 80 48 96 50 114%22 stroke=%22%232E7D32%22 stroke-width=%224%22 stroke-linecap=%22round%22 fill=%22none%22/%3E%3Cpath d=%22M52 84 C36 78 30 86 32 96 C44 96 50 90 52 84Z%22 fill=%22%2343A047%22/%3E%3Cpath d=%22M51 96 C66 90 74 98 72 108 C60 108 54 102 51 96Z%22 fill=%22%23388E3C%22/%3E%3Cpath d=%22M32 96 Q42 90 52 84 M72 108 Q62 102 51 96%22 stroke=%22%23A5D6A7%22 stroke-width=%221%22 fill=%22none%22/%3E%0A%3Cpath d=%22M54 58 C30 58 22 36 36 24 C40 16 52 12 60 18 C70 10 86 18 84 34 C92 44 80 60 54 58Z%22 fill=%22url(%23r)%22/%3E%3Cpath d=%22M40 44 C44 30 56 26 66 30 C58 34 50 40 48 50Z%22 fill=%22%23FF8A80%22 fill-opacity=%22.55%22/%3E%3Cpath d=%22M58 50 C56 40 60 32 70 30 C68 40 64 46 58 50Z%22 fill=%22%23B3102E%22 fill-opacity=%22.6%22/%3E%3Cpath d=%22M50 36 C48 42 50 48 56 50%22 stroke=%22%23FFCDD2%22 stroke-opacity=%22.7%22 stroke-width=%222%22 fill=%22none%22 stroke-linecap=%22round%22/%3E%0A%3Cpath d=%22M22 70 C18 66 20 60 24 61 C25 61 26 62 26 63 C27 62 28 61 29 61 C33 60 34 66 26 74Z%22 fill=%22%23F48FB1%22/%3E%3Cpath d=%22M92 80 C88 76 90 70 94 71 C95 71 96 72 96 73 C97 72 98 71 99 71 C103 70 104 76 96 84Z%22 fill=%22%23F48FB1%22/%3E%3C/svg%3E");--stripe:repeating-linear-gradient(90deg,#E53935 0 16px,#F48FB1 16px 32px)} html[data-theme=paques]{--orn-b:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 120 110%22%3E%3Cdefs%3E%3CradialGradient id=%22f%22 cx=%22.4%22 cy=%22.35%22 r=%22.8%22%3E%3Cstop offset=%220%22 stop-color=%22%23FFF9F0%22/%3E%3Cstop offset=%22.7%22 stop-color=%22%23F3E3CE%22/%3E%3Cstop offset=%221%22 stop-color=%22%23D9C4A6%22/%3E%3C/radialGradient%3E%3ClinearGradient id=%22k%22 x1=%220%22 y1=%220%22 x2=%220%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%23D9B57A%22/%3E%3Cstop offset=%221%22 stop-color=%22%23A67C3D%22/%3E%3C/linearGradient%3E%3C/defs%3E%0A%3Cpath d=%22M44 44 C34 18 38 2 50 4 C58 6 60 30 58 46Z%22 fill=%22%23F3E3CE%22/%3E%3Cpath d=%22M46 40 C40 20 43 10 49 10 C53 12 54 30 54 40Z%22 fill=%22%23F8BBD0%22/%3E%3Cpath d=%22M76 44 C78 16 90 2 98 8 C102 14 92 34 84 46Z%22 fill=%22%23F3E3CE%22/%3E%3Cpath d=%22M78 40 C81 20 89 12 93 14 C95 18 88 32 82 42Z%22 fill=%22%23F8BBD0%22/%3E%0A%3Ccircle cx=%2262%22 cy=%2262%22 r=%2224%22 fill=%22url(%23f)%22/%3E%3Ccircle cx=%2252%22 cy=%2258%22 r=%223%22 fill=%22%233E2723%22/%3E%3Ccircle cx=%2272%22 cy=%2258%22 r=%223%22 fill=%22%233E2723%22/%3E%3Ccircle cx=%2253%22 cy=%2257%22 r=%221%22 fill=%22%23fff%22/%3E%3Ccircle cx=%2273%22 cy=%2257%22 r=%221%22 fill=%22%23fff%22/%3E%3Cpath d=%22M58 68 C60 66 64 66 66 68 C66 71 62 73 62 72 C62 73 58 71 58 68Z%22 fill=%22%23F06292%22/%3E%3Cpath d=%22M62 72 V76 M62 76 Q58 79 55 76 M62 76 Q66 79 69 76%22 stroke=%22%233E2723%22 stroke-width=%221.2%22 fill=%22none%22 stroke-linecap=%22round%22/%3E%3Cpath d=%22M50 70 L38 68 M50 72 L38 74 M74 70 L86 68 M74 72 L86 74%22 stroke=%22%238D6E63%22 stroke-width=%221%22 stroke-linecap=%22round%22/%3E%3Ccircle cx=%2244%22 cy=%2266%22 r=%224%22 fill=%22%23F8BBD0%22 fill-opacity=%22.6%22/%3E%3Ccircle cx=%2280%22 cy=%2266%22 r=%224%22 fill=%22%23F8BBD0%22 fill-opacity=%22.6%22/%3E%0A%3Cpath d=%22M20 82 L104 82 L96 108 L28 108Z%22 fill=%22url(%23k)%22/%3E%3Cpath d=%22M24 90 H100 M27 98 H97 M40 82 L36 108 M62 82 L62 108 M84 82 L88 108%22 stroke=%22%238D6E63%22 stroke-width=%221.4%22/%3E%3Cellipse cx=%2248%22 cy=%2280%22 rx=%224%22 ry=%225%22 fill=%22%23F3E3CE%22/%3E%3Cellipse cx=%2276%22 cy=%2280%22 rx=%224%22 ry=%225%22 fill=%22%23F3E3CE%22/%3E%3Cpath d=%22M34 84 C30 78 36 72 40 76 M90 84 C94 78 88 72 84 76%22 stroke=%22%23F3E3CE%22 stroke-width=%223%22 fill=%22none%22 stroke-linecap=%22round%22/%3E%0A%3Cellipse cx=%2232%22 cy=%2280%22 rx=%227%22 ry=%229%22 fill=%22%2390CAF9%22/%3E%3Cellipse cx=%2292%22 cy=%2280%22 rx=%227%22 ry=%229%22 fill=%22%23FFF176%22/%3E%3Cpath d=%22M27 78 Q32 75 37 78%22 stroke=%22%23fff%22 stroke-width=%221.5%22 fill=%22none%22/%3E%3Ccircle cx=%2290%22 cy=%2278%22 r=%221.5%22 fill=%22%23fff%22/%3E%3Ccircle cx=%2294%22 cy=%2283%22 r=%221.5%22 fill=%22%23fff%22/%3E%3C/svg%3E");--orn-c:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 120 110%22%3E%3Cdefs%3E%3CradialGradient id=%22y%22 cx=%22.4%22 cy=%22.35%22 r=%22.8%22%3E%3Cstop offset=%220%22 stop-color=%22%23FFF59D%22/%3E%3Cstop offset=%22.7%22 stop-color=%22%23FFEE58%22/%3E%3Cstop offset=%221%22 stop-color=%22%23F9A825%22/%3E%3C/radialGradient%3E%3ClinearGradient id=%22s%22 x1=%220%22 y1=%220%22 x2=%220%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%23FFFFFF%22/%3E%3Cstop offset=%221%22 stop-color=%22%23E0DAD0%22/%3E%3C/linearGradient%3E%3C/defs%3E%0A%3Cpath d=%22M34 104 C14 104 12 76 20 64 L92 64 C100 76 98 104 78 104Z%22 fill=%22url(%23s)%22/%3E%3Cpath d=%22M20 64 L28 72 L36 62 L44 72 L52 62 L60 72 L68 62 L76 72 L84 62 L92 64%22 fill=%22none%22 stroke=%22%23E0DAD0%22 stroke-width=%222%22/%3E%0A%3Cellipse cx=%2256%22 cy=%2266%22 rx=%2222%22 ry=%2218%22 fill=%22url(%23y)%22/%3E%3Ccircle cx=%2262%22 cy=%2244%22 r=%2216%22 fill=%22url(%23y)%22/%3E%3Cpath d=%22M74 44 L90 40 L76 50Z%22 fill=%22%23FB8C00%22/%3E%3Ccircle cx=%2266%22 cy=%2240%22 r=%222.6%22 fill=%22%234E342E%22/%3E%3Ccircle cx=%2267%22 cy=%2239%22 r=%22.9%22 fill=%22%23fff%22/%3E%3Cpath d=%22M54 30 Q58 22 62 30 M60 29 Q64 21 68 29%22 stroke=%22%23FDD835%22 stroke-width=%222.5%22 fill=%22none%22 stroke-linecap=%22round%22/%3E%3Cpath d=%22M38 66 C30 60 30 72 38 74%22 fill=%22%23FDD835%22/%3E%3Ccircle cx=%2256%22 cy=%2248%22 r=%223%22 fill=%22%23F8BBD0%22 fill-opacity=%22.6%22/%3E%0A%3Cg transform=%22translate(14 0)%22%3E%3Cpath d=%22M90 104 V84%22 stroke=%22%2343A047%22 stroke-width=%223%22 stroke-linecap=%22round%22/%3E%3Cpath d=%22M83 86 L83 70 Q90 76 97 70 L97 86 Q90 92 83 86Z%22 fill=%22%23F48FB1%22/%3E%3C/g%3E%3Cg transform=%22translate(-6 0)%22%3E%3Cpath d=%22M14 104 V88%22 stroke=%22%2343A047%22 stroke-width=%223%22 stroke-linecap=%22round%22/%3E%3Cpath d=%22M8 90 L8 76 Q14 82 20 76 L20 90 Q14 96 8 90Z%22 fill=%22%23FFF176%22/%3E%3C/g%3E%0A%3Cpath d=%22M20 36 L21.5 40.5 L26 42 L21.5 43.5 L20 48 L18.5 43.5 L14 42 L18.5 40.5Z%22 fill=%22%23fff%22 fill-opacity=%22.8%22/%3E%3C/svg%3E");--stripe:linear-gradient(90deg,#F48FB1 0 25%,#FFF176 25% 50%,#A5D6A7 50% 75%,#90CAF9 75%)} html[data-theme=paques] .dish:nth-child(3n+2) .dish__img::before,html[data-theme=paques] .dish:nth-child(3n) .dish__img::before{width:84px;height:80px} /* ---------- transitions entre sections ---------- */ html[data-theme] .band:not(.band--photo){position:relative} html[data-theme] .foot{position:relative} /* Noël : stalactites sous la barre de navigation, congères au sommet des bandes sombres */ html[data-theme=noel] .nav::after{content:"";position:absolute;left:0;right:0;top:100%;height:28px;background:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 120 28%22%3E%3Cdefs%3E%3ClinearGradient id=%22i%22 x1=%220%22 y1=%220%22 x2=%220%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%23FFFFFF%22/%3E%3Cstop offset=%221%22 stop-color=%22%23DCEBF5%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d=%22M0 0 H120 V4 C116 6 114 14 112 22 C110 14 108 8 104 6 C100 8 98 20 96 26 C94 16 92 8 88 6 C84 8 82 12 80 16 C78 12 76 8 72 6 C68 8 66 18 64 24 C62 14 60 8 56 6 C52 8 50 12 48 18 C46 12 44 8 40 6 C36 8 34 16 32 22 C30 14 28 8 24 6 C20 8 18 12 16 14 C14 10 12 6 8 5 C5 5 3 6 0 4Z%22 fill=%22url(%23i)%22/%3E%3C/svg%3E") repeat-x center top/120px 28px;pointer-events:none;filter:drop-shadow(0 2px 2px rgba(0,0,0,.25))} html[data-theme=noel] .band:not(.band--kraft):not(.band--photo)::before,html[data-theme=noel] .foot::before{content:"";position:absolute;left:0;right:0;top:-1px;height:22px;background:#F7F9FC;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 160 22%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M0 0h160v8c-10 0-14 12-28 12s-14-10-28-10-14 12-28 12-12-9-24-9-16 10-30 10-14-10-22-10z%22/%3E%3C/svg%3E") repeat-x;-webkit-mask-size:160px 22px;mask:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 160 22%22 preserveAspectRatio=%22none%22%3E%3Cpath d=%22M0 0h160v8c-10 0-14 12-28 12s-14-10-28-10-14 12-28 12-12-9-24-9-16 10-30 10-14-10-22-10z%22/%3E%3C/svg%3E") repeat-x;mask-size:160px 22px;pointer-events:none;z-index:1} /* Halloween : toiles aux coins des bandes claires */ html[data-theme=halloween] .band--kraft::before,html[data-theme=halloween] .band--kraft::after{content:"";position:absolute;top:0;width:min(170px,30vw);height:min(170px,30vw);background:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 140 140%22%3E%3Cg fill=%22none%22 stroke=%22%232A1A3F%22 stroke-opacity=%22.55%22 stroke-width=%221.2%22%3E%3Cline x1=%22140%22 y1=%220%22 x2=%22140.0%22 y2=%22145.0%22/%3E%3Cline x1=%22140%22 y1=%220%22 x2=%22102.5%22 y2=%22140.1%22/%3E%3Cline x1=%22140%22 y1=%220%22 x2=%2267.5%22 y2=%22125.6%22/%3E%3Cline x1=%22140%22 y1=%220%22 x2=%2237.5%22 y2=%22102.5%22/%3E%3Cline x1=%22140%22 y1=%220%22 x2=%2214.4%22 y2=%2272.5%22/%3E%3Cline x1=%22140%22 y1=%220%22 x2=%22-0.1%22 y2=%2237.5%22/%3E%3Cline x1=%22140%22 y1=%220%22 x2=%22-5.0%22 y2=%220.0%22/%3E%3Cpath d=%22M140.0 22.0 Q137.5 19.0 134.3 21.3%22/%3E%3Cpath d=%22M134.3 21.3 Q132.7 17.7 129.0 19.1%22/%3E%3Cpath d=%22M129.0 19.1 Q128.3 15.2 124.4 15.6%22/%3E%3Cpath d=%22M124.4 15.6 Q124.8 11.7 120.9 11.0%22/%3E%3Cpath d=%22M120.9 11.0 Q122.3 7.3 118.7 5.7%22/%3E%3Cpath d=%22M118.7 5.7 Q121.0 2.5 118.0 0.0%22/%3E%3Cpath d=%22M140.0 44.0 Q135.0 38.0 128.6 42.5%22/%3E%3Cpath d=%22M128.6 42.5 Q125.4 35.4 118.0 38.1%22/%3E%3Cpath d=%22M118.0 38.1 Q116.7 30.4 108.9 31.1%22/%3E%3Cpath d=%22M108.9 31.1 Q109.6 23.3 101.9 22.0%22/%3E%3Cpath d=%22M101.9 22.0 Q104.6 14.6 97.5 11.4%22/%3E%3Cpath d=%22M97.5 11.4 Q102.0 5.0 96.0 0.0%22/%3E%3Cpath d=%22M140.0 66.0 Q132.5 56.9 122.9 63.8%22/%3E%3Cpath d=%22M122.9 63.8 Q118.0 53.0 107.0 57.2%22/%3E%3Cpath d=%22M107.0 57.2 Q105.0 45.6 93.3 46.7%22/%3E%3Cpath d=%22M93.3 46.7 Q94.4 35.0 82.8 33.0%22/%3E%3Cpath d=%22M82.8 33.0 Q87.0 22.0 76.2 17.1%22/%3E%3Cpath d=%22M76.2 17.1 Q83.1 7.5 74.0 0.0%22/%3E%3Cpath d=%22M140.0 88.0 Q130.0 75.9 117.2 85.0%22/%3E%3Cpath d=%22M117.2 85.0 Q110.7 70.7 96.0 76.2%22/%3E%3Cpath d=%22M96.0 76.2 Q93.4 60.7 77.8 62.2%22/%3E%3Cpath d=%22M77.8 62.2 Q79.3 46.6 63.8 44.0%22/%3E%3Cpath d=%22M63.8 44.0 Q69.3 29.3 55.0 22.8%22/%3E%3Cpath d=%22M55.0 22.8 Q64.1 10.0 52.0 0.0%22/%3E%3Cpath d=%22M140.0 110.0 Q127.5 94.9 111.5 106.3%22/%3E%3Cpath d=%22M111.5 106.3 Q103.4 88.4 85.0 95.3%22/%3E%3Cpath d=%22M85.0 95.3 Q81.7 75.9 62.2 77.8%22/%3E%3Cpath d=%22M62.2 77.8 Q64.1 58.3 44.7 55.0%22/%3E%3Cpath d=%22M44.7 55.0 Q51.6 36.6 33.7 28.5%22/%3E%3Cpath d=%22M33.7 28.5 Q45.1 12.5 30.0 0.0%22/%3E%3Cpath d=%22M140.0 132.0 Q125.0 113.9 105.8 127.5%22/%3E%3Cpath d=%22M105.8 127.5 Q96.1 106.1 74.0 114.3%22/%3E%3Cpath d=%22M74.0 114.3 Q70.1 91.1 46.7 93.3%22/%3E%3Cpath d=%22M46.7 93.3 Q48.9 69.9 25.7 66.0%22/%3E%3Cpath d=%22M25.7 66.0 Q33.9 43.9 12.5 34.2%22/%3E%3Cpath d=%22M12.5 34.2 Q26.1 15.0 8.0 0.0%22/%3E%3C/g%3E%3C/svg%3E") no-repeat right top/contain;pointer-events:none;z-index:1} html[data-theme=halloween] .band--kraft::before{left:0;transform:scaleX(-1)}html[data-theme=halloween] .band--kraft::after{right:0} /* 14 juillet : filet tricolore au sommet des bandes sombres */ html[data-theme=fete-nationale] .band:not(.band--kraft):not(.band--photo)::before,html[data-theme=fete-nationale] .foot::before{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:linear-gradient(90deg,#2457C5 0 33.3%,#F5F0E6 33.3% 66.6%,#E53935 66.6%);pointer-events:none;z-index:1} /* Saint-Valentin : guirlande de cœurs au sommet des bandes sombres */ html[data-theme=saint-valentin] .band:not(.band--kraft):not(.band--photo)::before{content:"";position:absolute;left:0;right:0;top:-4px;height:96px;background:var(--mini-bunting) repeat-x center top/176px 96px;pointer-events:none;z-index:1;filter:drop-shadow(0 4px 4px rgba(0,0,0,.35))} /* Pâques : herbe fleurie au pied des bandes sombres */ html[data-theme=paques] .band:not(.band--kraft):not(.band--photo)::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:30px;background:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 120 30%22%3E%3Cpath d=%22M4 30 Q8 18 10 30 M14 30 Q16 10 22 30 M26 30 Q32 16 34 30 M40 30 Q42 8 48 30 M52 30 Q56 18 60 30 M64 30 Q68 6 74 30 M78 30 Q84 16 86 30 M90 30 Q92 10 98 30 M102 30 Q108 18 110 30 M114 30 Q116 12 120 30%22 fill=%22none%22 stroke=%22%233C8A58%22 stroke-width=%223%22 stroke-linecap=%22round%22/%3E%3Cpath d=%22M8 30 Q12 20 14 30 M30 30 Q34 14 38 30 M70 30 Q74 14 78 30 M96 30 Q100 20 104 30%22 fill=%22none%22 stroke=%22%2366BB6A%22 stroke-width=%222%22 stroke-linecap=%22round%22/%3E%3Ccircle cx=%2222%22 cy=%2214%22 r=%223%22 fill=%22%23F48FB1%22/%3E%3Ccircle cx=%2266%22 cy=%2212%22 r=%223%22 fill=%22%23FFF176%22/%3E%3Ccircle cx=%22100%22 cy=%2216%22 r=%223%22 fill=%22%23CE93D8%22/%3E%3C/svg%3E") repeat-x center bottom/120px 30px;pointer-events:none;z-index:1} @media (max-width:600px){html[data-theme=saint-valentin] .band:not(.band--kraft):not(.band--photo)::before{height:56px;background-size:104px 56px}html[data-theme=noel] .nav::after{height:20px;background-size:86px 20px}} /* mention du supplément sur les cartes (le prix affiché est celui du burger, supplément compris) */ /* ---------- page /contact : le formulaire en pleine page (téléphone surtout) ---------- */ .contact-page .page-hero{padding-bottom:clamp(20px,3vw,32px)} .contact-page .page-hero h1{font-size:clamp(2rem,6vw,3.2rem)} .contact-page .page-hero .lede{max-width:60ch;margin-top:12px} .contact-page__band{padding-top:8px} .contact-page__wrap{max-width:680px} dialog.contact-page__dlg,dialog.contact-page__dlg[open]{position:static;display:block;width:100%;max-width:none;height:auto;max-height:none;inset:auto;margin:0;padding:0;overflow:visible;background:transparent;animation:none;border-radius:0} .contact-page__dlg .sheet{max-height:none;height:auto;overflow:visible;border-radius:18px;border:1px solid var(--brun-line);padding:clamp(20px,4vw,34px)} .contact-page__dlg .sheet__head{position:static;margin:0 0 6px;padding:0;border:0;background:transparent} .contact-page__dlg .x{display:grid;place-items:center;text-decoration:none} /* ---------- alertes sur téléphone : boutons d'accès et panneau ---------- */ .bell{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border:1.5px solid var(--brun-line);border-radius:999px;background:rgba(var(--rgb-encre),.25);color:var(--creme);font:600 .9rem var(--body);cursor:pointer;white-space:nowrap;text-decoration:none;transition:border-color .15s,background .15s} .bell:hover{border-color:var(--cheddar)} .bell svg{flex:none;color:var(--cheddar)} .bell--icon{width:42px;height:42px;padding:0;justify-content:center;border-radius:50%} .bell--icon span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)} html.al-on .bell::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--mesclun);box-shadow:0 0 0 3px rgba(123,166,86,.25)} html.al-on .bell--icon::after{position:absolute;top:4px;right:4px} .bell--icon{position:relative} .nav__right .bell{margin-right:-4px} /* en-tête : le bouton de contact ne passe jamais sur plusieurs lignes ; c'est la pastille « prochaine escale » qui se raccourcit */ .nav .btn{white-space:nowrap;flex:none;padding:11px 18px;font-size:.95rem} .nav .pill{min-width:0} .nav .pill span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:28ch} @media (max-width:1320px){.nav .pill span{max-width:18ch}} @media (max-width:760px){.nav__right .bell span{display:none}.nav__right .bell{width:42px;height:42px;padding:0;justify-content:center;border-radius:50%;position:relative}html.al-on .nav__right .bell::after{position:absolute;top:4px;right:4px}} .tonight__bell{grid-column:1/-1;justify-self:start;margin-top:4px} .al-cta{margin-top:26px;display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;padding:16px 18px;border:1px dashed var(--brun-line);border-radius:14px;background:rgba(var(--rgb-encre),.25)} .al-cta p{margin:0;color:var(--creme-2);font-size:.98rem;flex:1 1 260px} .al-cta b{color:var(--creme)} .alertes .sheet{background:var(--kraft);color:var(--encre);border-color:var(--kraft-2);background-image:radial-gradient(rgba(255,255,255,.22) 1px,transparent 1.5px),radial-gradient(rgba(60,30,10,.07) 1px,transparent 1.5px);background-size:7px 7px,11px 11px;background-position:0 0,4px 6px} .alertes .sheet__head{align-items:center} .alertes .x{color:var(--encre);border-color:var(--kraft-2);background:rgba(255,255,255,.5)} .alertes .kicker{display:block;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--orange-text);font-weight:700;margin-bottom:4px} .alertes h2{color:var(--encre)} .alertes .hsub{margin:4px 0 0;color:var(--encre-2);line-height:1.45;font-size:.95rem} .al-intro{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:7px;font-size:.93rem;line-height:1.35;color:var(--encre)} .al-intro li{display:grid;grid-template-columns:26px 1fr;gap:8px;align-items:start} .al-intro span{font-size:1.05rem;line-height:1.2;text-align:center} .al-intro__key{font-weight:600;padding:8px 10px 8px 6px;border-radius:12px;background:rgba(232,96,16,.1);border:1px solid rgba(232,96,16,.25)} .al-intro__note{color:var(--encre-2);font-size:.86rem} .al-h{font:700 .74rem var(--body);letter-spacing:.1em;text-transform:uppercase;margin:16px 0 8px;color:var(--encre-2)} .al-chips{display:flex;flex-wrap:wrap;gap:8px} .al-chip{appearance:none;-webkit-appearance:none;border:1.5px solid var(--kraft-2);background:rgba(255,255,255,.55);color:var(--encre);border-radius:999px;padding:8px 14px 8px 9px;font:500 .92rem var(--body);cursor:pointer;display:inline-flex;align-items:center;gap:9px;text-align:left;line-height:1.2;transition:background .15s,border-color .15s} .al-chip::before,.al-card::after{content:"";width:20px;height:20px;border-radius:50%;border:1.5px solid var(--kraft-2);background:#fff center/12px no-repeat;flex:none;transition:background-color .15s,border-color .15s} .al-chip[aria-pressed=true]{background:rgba(232,96,16,.1);border-color:var(--ketchup)} .al-chip[aria-pressed=true]::before,.al-card[aria-pressed=true]::after{background-color:var(--ketchup);border-color:var(--ketchup);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.5l2.5 2.5 4.5-5' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")} .al-cards{display:grid;grid-template-columns:1fr 1fr;gap:8px} @media (max-width:460px){.al-cards{grid-template-columns:1fr}} .al-card{appearance:none;-webkit-appearance:none;position:relative;display:grid;grid-template-columns:36px 1fr;gap:10px;align-items:center;padding:9px 38px 9px 9px;border:1.5px solid var(--kraft-2);border-radius:16px;background:rgba(255,255,255,.55);color:var(--encre);text-align:left;cursor:pointer;font-family:var(--body);transition:background .15s,border-color .15s} .al-card::after{position:absolute;top:50%;right:10px;margin-top:-10px} .al-card i{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:var(--brun-2);color:var(--cheddar)} .al-card i svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round} .al-card b{display:block;font-size:.94rem;line-height:1.2;font-weight:600} .al-card small{display:block;color:var(--encre-2);font-size:.76rem;line-height:1.3;margin-top:2px} .al-card[aria-pressed=true]{background:rgba(232,96,16,.08);border-color:var(--ketchup)} .al-card[aria-pressed=true] i{background:var(--ketchup);color:#fff} .al-card[aria-pressed=false]{opacity:.78} .al-actions{margin-top:18px;display:grid;gap:8px} .al-actions .btn{justify-content:center;width:100%} .al-go{padding:15px 20px;font-size:1.05rem;gap:10px} .al-actions--row{grid-auto-flow:column;justify-content:start;margin-top:16px} .al-actions--row .btn{width:auto} .alertes .btn--ghost{color:var(--encre);border-color:var(--encre-2)} .alertes .btn--ghost:hover{background:var(--encre);color:var(--creme)} .al-note{color:var(--encre-2);font-size:.88rem;margin:0;line-height:1.45;text-align:center} .al-box{background:rgba(255,255,255,.55);border:1.5px solid var(--kraft-2);border-radius:16px;padding:18px 16px;margin-top:18px;line-height:1.5} .al-box p{margin:0 0 12px} .al-box p:last-child{margin-bottom:0} .al-box .al-note{text-align:left} .al-steps{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:12px;counter-reset:s} .al-steps li{display:grid;grid-template-columns:30px 1fr;gap:12px;align-items:start} .al-steps li>span{line-height:1.5;padding-top:3px} .al-steps li::before{counter-increment:s;content:counter(s);width:30px;height:30px;border-radius:50%;background:var(--ketchup);color:#fff;font-weight:700;display:grid;place-items:center;font-size:.9rem} .ios-share{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:6px;background:#1C77FF;color:#fff;vertical-align:middle;margin:0 2px} .al-bell-inline{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--brun);border:1.5px solid var(--brun-line);color:var(--cheddar);vertical-align:middle;margin:0 2px} .al-switch{position:relative;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 16px;border:1.5px solid var(--kraft-2);border-radius:16px;background:rgba(255,255,255,.6);margin-top:14px;cursor:pointer} .al-switch b{display:block;font-size:1.05rem;font-weight:700} .al-switch small{display:block;color:var(--encre-2);font-size:.86rem;margin-top:2px;line-height:1.4} .al-switch input{position:absolute;opacity:0;width:0;height:0} .al-switch i{position:relative;flex:none;width:54px;height:32px;border-radius:999px;background:var(--kraft-2);transition:background .2s} .al-switch i::after{content:"";position:absolute;top:3px;left:3px;width:26px;height:26px;border-radius:50%;background:#fff;transition:transform .2s;box-shadow:0 2px 6px rgba(0,0,0,.25)} .al-switch input:checked+i{background:var(--mesclun)} .al-switch input:checked+i::after{transform:translateX(22px)} .al-switch input:focus-visible+i{outline:2px solid var(--ketchup);outline-offset:2px} @media (max-width:640px){ .alertes .sheet__head{background:var(--kraft);border-bottom-color:var(--kraft-2)} /* le bouton d'activation reste collé en bas de l'écran, le reste défile au-dessus */ .al-view[data-view=form] .al-actions{position:sticky;bottom:calc(-28px - var(--sab));z-index:2;margin:14px -16px calc(-28px - var(--sab));padding:10px 16px calc(12px + var(--sab));background:var(--kraft);border-top:1px solid var(--kraft-2);box-shadow:0 -14px 24px -16px rgba(42,26,16,.35)} .al-view[data-view=form] .al-note{font-size:.82rem} }