:root {
  --noir: #151311;
  --papier: #EDE4D3;
  --vert: #1C271E;
  --ambre: #E0952F;
  --profond: #0E0D0B;
  --creme: #F3ECDF;
  --cendre: #B9B0A2;
  --brun-gris: #5A5248;
  --sauge: #B9C4AE;
  --ail: #5E9B45;
  --ail-texte: #3E6B2C;
  --bois: #C69A62;
  --boulet: #7A3E17;
  --gres: #2B3138;

  --pose: cubic-bezier(.34, 1.4, .64, 1);
  --glisse: cubic-bezier(.2, .7, .2, 1);

  --f-titre: "Hoover", "Hoover secours", Arial, sans-serif;
  --f-texte: "Plein", "Plein secours", Arial, sans-serif;

  --entete: 76px;
  --marge: 5vw;
  --section: 128px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--entete) + 24px); }
body {
  margin: 0;
  background: var(--noir);
  color: var(--creme);
  font: 400 17px/1.6 var(--f-texte);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
img, svg { display: block; }
img { max-width: 100%; height: auto; }
a { color: inherit; }
h1, h2, h3, h4, p, ul, ol, dl, dd, figure, blockquote { margin: 0; }
ul, ol { padding: 0; list-style: none; }
.page { overflow-x: clip; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
:focus-visible { outline: 3px solid var(--ambre); outline-offset: 3px; }
.evitement { position: absolute; left: 16px; top: -100px; z-index: 100; background: var(--ambre); color: var(--noir); padding: 12px 16px; border-radius: 6px; font-weight: 700; }
.evitement:focus { top: 12px; }

.s-noir    { --fond: #151311; --encre: var(--creme); --encre-2: var(--cendre);    --contour: var(--creme); --surtitre: var(--ambre);     background: var(--fond); color: var(--encre); }
.s-papier  { --fond: #EDE4D3; --encre: var(--noir);  --encre-2: var(--brun-gris); --contour: var(--noir);  --surtitre: var(--ail-texte); background: var(--fond); color: var(--encre); }
.s-vert    { --fond: #1C271E; --encre: var(--creme); --encre-2: var(--sauge);     --contour: var(--creme); --surtitre: var(--ambre);     background: var(--fond); color: var(--encre); }
.s-ambre   { --fond: #E0952F; --encre: var(--noir);  --encre-2: var(--noir);      --contour: var(--noir);  --surtitre: var(--noir);      background: var(--fond); color: var(--encre); }
.s-profond { --fond: #0E0D0B; --encre: var(--creme); --encre-2: var(--cendre);    --contour: var(--creme); --surtitre: var(--ambre);     background: var(--fond); color: var(--encre); }

.section { position: relative; padding: var(--section) 0; overflow-x: clip; }
.cadre { width: min(1280px, 100% - 2 * var(--marge)); margin-inline: auto; }

.surtitre {
  display: block;
  font: 700 13px/1.2 var(--f-texte);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--surtitre);
  margin-bottom: 16px;
}
.h1 { font: 700 clamp(48px, 5.2vw, 84px)/.98 var(--f-titre); letter-spacing: -.005em; }
.h1--page { font-size: clamp(40px, 4.4vw, 68px); line-height: 1; }
.h2 { font: 700 clamp(34px, 4vw, 60px)/1.02 var(--f-titre); letter-spacing: -.005em; }
.texte { max-width: 62ch; color: var(--encre); }
.texte + .texte { margin-top: 16px; }
.petit { font: 600 14px/1.4 var(--f-texte); color: var(--encre-2); }
.micro { font: 400 12px/1.4 var(--f-texte); color: var(--encre-2); }
.prix-txt { font: 500 22px/1.2 var(--f-titre); font-variant-numeric: tabular-nums; white-space: nowrap; }

.lien {
  position: relative;
  display: inline-block;
  font-weight: 600;
  text-decoration: none;
  padding-bottom: 4px;
}
.lien::before, .lien::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 3px;
  background: currentColor;
  opacity: .35;
}
.lien::after { background: var(--ambre); opacity: 1; transform: scaleX(0); transform-origin: left center; transition: transform 220ms var(--glisse); }
.s-ambre .lien::after { background: var(--noir); }
.lien:hover::after, .lien:focus-visible::after { transform: scaleX(1); }
.lien--fleche::after { right: 0; }

.btn {
  --ombre: var(--contour);
  display: inline-flex;
  align-items: center;
  gap: 10px;
  height: 52px;
  padding: 0 24px;
  border: 3px solid var(--contour);
  border-radius: 6px;
  font: 700 15px/1 var(--f-texte);
  letter-spacing: .06em;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: transform 160ms var(--glisse), box-shadow 160ms var(--glisse), background-color 160ms var(--glisse), color 160ms var(--glisse);
}
.btn svg { flex: none; }
.btn--principal { background: var(--ambre); color: var(--noir); box-shadow: 4px 4px 0 var(--ombre); }
.btn--principal:hover { transform: translate(-2px, -2px); box-shadow: 6px 6px 0 var(--ombre); }
.btn--secondaire { background: transparent; color: var(--encre); border-color: currentColor; --ombre: currentColor; }
.btn--secondaire:hover { transform: translate(-2px, -2px); box-shadow: 6px 6px 0 var(--ombre); }
.btn:active { transform: translate(4px, 4px); box-shadow: 0 0 0 var(--ombre); transition-duration: 90ms; }
.btn__couverts { width: 16px; height: 16px; transition: transform 160ms var(--glisse); }
.btn:hover .btn__couverts { transform: rotate(90deg); }
.btn__glyphe { width: 20px; height: 20px; }
.s-ambre .btn--creme { background: var(--creme); color: var(--noir); border-color: var(--noir); --ombre: var(--noir); box-shadow: 4px 4px 0 var(--noir); }
.actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 20px; }

.social {
  display: inline-grid;
  place-items: center;
  width: 44px; height: 44px;
  border: 3px solid currentColor;
  border-radius: 6px;
  color: var(--encre);
  transition: transform 160ms var(--glisse), box-shadow 160ms var(--glisse), background-color 160ms var(--glisse), color 160ms var(--glisse), border-color 160ms var(--glisse);
}
.social svg { width: 22px; height: 22px; }
.social:hover { background: var(--ambre); color: var(--noir); border-color: var(--noir); transform: translate(-2px, -2px); box-shadow: 4px 4px 0 var(--contour); }
.social:active { transform: translate(2px, 2px); box-shadow: none; }
.socials { display: flex; gap: 12px; }
.promesse { display: inline-flex; align-items: center; gap: 16px; text-decoration: none; }
.promesse .lien { font-weight: 600; }

.entete {
  position: sticky; top: 0; z-index: 60;
  height: var(--entete);
  background: var(--noir);
  color: var(--creme);
  border-bottom: 3px solid var(--ambre);
}
.entete__in { height: 100%; display: flex; align-items: center; gap: 32px; padding: 0 var(--marge); }
.marque { display: flex; align-items: center; gap: 14px; text-decoration: none; color: inherit; margin-right: auto; }
.marque__disque {
  width: 54px; height: 54px; flex: none;
  border-radius: 50%;
  background: #fff;
  border: 4px solid var(--noir);
  box-shadow: 0 0 0 3px var(--creme);
  display: grid; place-items: center;
  transition: transform 220ms var(--pose);
}
.marque__disque img { width: calc(100% / 1.12); height: auto; }
.marque:hover .marque__disque { transform: rotate(-8deg); }
.marque__nom { font: 700 17px/1.02 var(--f-titre); }
.marque__nom span { display: block; }
.nav { display: flex; align-items: center; gap: 28px; }
.nav__lien { font: 600 15px/1 var(--f-texte); }
.nav__lien[aria-current="page"]::before { opacity: 1; background: var(--ambre); }
.nav__tel { display: inline-flex; align-items: center; gap: 8px; }
.nav__tel svg { width: 18px; height: 18px; }
.entete .btn { height: 46px; padding: 0 20px; }
.menu-bouton { display: none; }
.panneau-menu { display: none; }
.barre-mobile { display: none; }

.tampon { --tampon: 120px; position: relative; width: var(--tampon); height: var(--tampon); flex: none; }
.tampon__disque {
  position: absolute; inset: 0;
  border-radius: 50%;
  background: #fff;
  border: 4px solid var(--noir);
  display: grid; place-items: center;
  transform: rotate(-8deg);
}
.tampon__disque img { width: calc(100% / 1.12); height: auto; }

.tampon__disque, .mini-tampon, .marque__disque { overflow: clip; }

.tampon__disque picture, .mini-tampon picture, .marque__disque picture, .plat-rond picture { display: contents; }
.tampon__traits { position: absolute; inset: 0; pointer-events: none; }
.tampon__trait { position: absolute; left: 50%; top: 50%; width: 30%; height: 5px; transform: rotate(var(--a)) translateX(calc(var(--tampon) / 2 + 10px)); transform-origin: 0 50%; }
.tampon__trait i { display: block; width: 100%; height: 5px; background: var(--ambre); transform-origin: left center; }
.mini-tampon { width: 44px; height: 44px; flex: none; border-radius: 50%; background: #fff; border: 3px solid var(--noir); display: grid; place-items: center; transform: rotate(-6deg); }
.mini-tampon img { width: calc(100% / 1.12); height: auto; }

.table { --table: 176px; position: relative; width: var(--table); height: var(--table); flex: none; }
.table--200 { --table: 200px; }
.table--220 { --table: 220px; }
.table--140 { --table: 140px; }
.table--120 { --table: 120px; }
.table__plateau, .piece { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.piece { transform-origin: var(--o, 50% 50%); }
.piece--fourchette { transform: rotate(35deg); }
.piece--cuillere { transform: rotate(-35deg); }
.cran { transform-box: fill-box; transform-origin: center; }
.cran-ambre { fill: var(--ambre); stroke: var(--noir); stroke-width: 3px; vector-effect: non-scaling-stroke; }
.depli { transform-box: fill-box; transform-origin: 0% 50%; }
.sprite { position: absolute; width: 0; height: 0; overflow: hidden; }

.hachures {
  position: absolute;
  left: -64px; right: -64px;
  top: -27px;
  height: 28px;
  background: repeating-linear-gradient(-45deg, var(--fond) 0 6px, transparent 6px 18px);
  pointer-events: none;
  z-index: 1;
}
.hachures--rubrique {
  position: relative; top: 0; left: -48px; right: auto;
  width: calc(100% + 96px);
  height: 22px;
  margin-bottom: 24px;
  background: repeating-linear-gradient(-45deg, var(--encre) 0 5px, transparent 5px 18px);
}

.ligne-prix { display: grid; grid-template-columns: auto 1fr auto; align-items: end; column-gap: 12px; padding: 14px 0; view-timeline: --ligne; }
.ligne-prix__nom { font: 600 17px/1.35 var(--f-texte); transition: color 160ms var(--glisse); }
.ligne-prix__desc { grid-column: 1 / -1; grid-row: 2; font: 400 15px/1.45 var(--f-texte); color: var(--encre-2); max-width: 52ch; margin-top: 2px; }
.pointilles {
  height: 3px; margin-bottom: 7px;
  background: linear-gradient(90deg, var(--encre-2) 3px, transparent 3px) 0 0 / 9px 3px repeat-x;
  transform-origin: left center;
}
.ligne-prix .prix-txt { text-align: right; }
.prix-bloc { display: flex; gap: 18px; align-items: flex-end; }
.prix-ligne { display: block; text-align: right; }
.prix-detail { display: block; font: 600 12px/1.3 var(--f-texte); color: var(--encre-2); text-align: right; letter-spacing: .02em; }
.ligne-prix:hover .ligne-prix__nom { color: var(--ail-texte); }
.s-noir .ligne-prix:hover .ligne-prix__nom { color: var(--ambre); }
.ligne-prix:hover .pointilles { background-image: linear-gradient(90deg, var(--ambre) 3px, transparent 3px); }
.allergenes { display: inline-flex; gap: 4px; margin-left: 8px; vertical-align: 2px; }
.allergenes > span[aria-hidden] { display: inline-flex; gap: 4px; }
.allergenes abbr {
  display: inline-grid; place-items: center;
  min-width: 20px; height: 20px; padding: 0 3px;
  border: 2px solid var(--encre-2); border-radius: 4px;
  font: 700 11px/1 var(--f-texte); color: var(--encre-2);
  text-decoration: none;
}

.avis { margin-top: 48px; padding-top: 48px; view-timeline: --avis; }
.avis__guillemet { display: block; font: 700 96px/.6 var(--f-titre); color: var(--ambre); height: 48px; margin-bottom: 20px; transform-origin: 20% 60%; }
.avis__texte { font: 500 clamp(22px, 2vw, 30px)/1.25 var(--f-titre); max-width: 26ch; }
.avis__source { display: block; margin-top: 14px; font: 600 14px/1.4 var(--f-texte); color: var(--encre-2); }

.plat-rond {
  position: relative;
  aspect-ratio: 1;
  overflow: clip;
  -webkit-mask-image: linear-gradient(to right, transparent, #000 6%, #000 94%, transparent), linear-gradient(to bottom, transparent, #000 6%, #000 94%, transparent);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(to right, transparent, #000 6%, #000 94%, transparent), linear-gradient(to bottom, transparent, #000 6%, #000 94%, transparent);
  mask-composite: intersect;
}
.plat-rond img { width: 100%; height: 100%; object-fit: contain; }
.legende { margin-top: 14px; font: 600 14px/1.4 var(--f-texte); color: var(--encre-2); }
.mention-photo { font: 400 12px/1.4 var(--f-texte); color: var(--cendre); }

.hero {
  position: relative;
  height: calc(min(100svh, 56.25vw) - var(--entete));
  min-height: 560px;
  background: var(--noir);
  color: var(--creme);
  overflow: clip;
}
.hero__media { position: absolute; inset: 0; transform-origin: 100% 50%; }
.hero__media img { width: 100%; height: 100%; object-fit: cover; object-position: 100% 55%; transform-origin: 75% 60%; }
.hero__voile { position: absolute; inset: 0; background: linear-gradient(90deg, #151311 0%, rgba(21, 19, 17, 0) 60%); }
.hero__texte {
  position: relative; z-index: 1;
  height: 100%;
  width: 43vw;
  padding: 28px 0 28px var(--marge);
  display: flex; flex-direction: column; justify-content: center;
}
.hero .tampon { --tampon: 148px; }
.hero__haut { display: flex; align-items: center; gap: 40px; margin-bottom: 22px; }
.hero .table { --table: 176px; }
.hero .h1 { margin-bottom: 18px; }
.hero__appui { max-width: 40ch; color: var(--creme); margin-bottom: 8px; }
.hero__preuve { font: 600 14px/1.4 var(--f-texte); color: var(--cendre); margin-bottom: 24px; }
.hero .actions { gap: 16px 18px; }
.titre-lignes .ligne { display: block; }
.souligne { position: relative; isolation: isolate; white-space: nowrap; }
.souligne::after { content: ""; position: absolute; left: -.04em; right: -.04em; bottom: .04em; height: 10px; background: var(--ambre); z-index: -1; transform-origin: left center; }

.inc { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: 96px; row-gap: 40px; align-items: start; }
.inc__tete { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 48px; }
.inc__tete .h2 { max-width: 15ch; }
.inc .table { --table: 200px; }
.inc__liste { border-top: 3px solid var(--noir); }
.inc__liste li + li { border-top: 2px solid rgba(21, 19, 17, .18); }
.inc__lien { margin-top: 28px; }

.ours { display: grid; grid-template-columns: minmax(0, 11fr) minmax(0, 12fr); column-gap: 88px; align-items: start; }
.ours__media { position: sticky; top: calc(var(--entete) + 36px); }
.ours__intro .texte { color: var(--cendre); margin-top: 20px; }
.heros { margin-top: 56px; timeline-scope: --heros; }
.heros__ligne { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }
.heros__nom { font: 700 clamp(36px, 5vw, 80px)/1 var(--f-titre); view-timeline: --heros; }
.heros__desc { margin-top: 16px; color: var(--creme); max-width: 34ch; }
.pastille {
  width: 128px; height: 128px; flex: none;
  border-radius: 50%;
  background: var(--ambre); color: var(--noir);
  border: 3px solid var(--creme);
  box-shadow: 4px 4px 0 var(--creme);
  display: grid; place-content: center; text-align: center;
  font: 500 15px/1.1 var(--f-titre);
  transform: rotate(-8deg);
}
.pastille strong { display: block; font: 700 40px/1 var(--f-titre); }
.heros__bas { display: flex; align-items: center; gap: 32px; margin-top: 28px; }
.ours-liste { margin-top: 56px; border-top: 3px solid var(--creme); }
.plat-ours { display: grid; grid-template-columns: 44px 1fr; gap: 20px; align-items: center; padding: 18px 0; border-bottom: 2px solid rgba(243, 236, 223, .2); }
.plat-ours__nom { font: 600 17px/1.35 var(--f-texte); }
.plat-ours__desc { font: 400 15px/1.45 var(--f-texte); color: var(--cendre); }
.plat-ours__prix { font: 500 20px/1.2 var(--f-titre); color: var(--ambre); white-space: nowrap; }
.plat-ours__texte { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; }
.ours__citations { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; margin-top: 56px; }
.ours__citations .avis { margin-top: 0; }

.rangee {
  width: max-content;
  font: 700 14vw/.9 var(--f-titre);
  white-space: nowrap;
  color: transparent;
  -webkit-text-stroke: 3px var(--encre);
  letter-spacing: .01em;
  user-select: none;
  pointer-events: none;
}
.rangee--haut { margin: 0 0 72px; }
.rangee--bas { margin: 96px 0 0; transform: translateX(-28%); }
.carte-acc__tete { display: flex; justify-content: space-between; align-items: center; gap: 48px; }
.carte-acc__tete .h2 { max-width: 17ch; }
.carte-acc__tete .texte { margin-top: 20px; color: var(--brun-gris); }
.rubriques { margin-top: 64px; counter-reset: rub; }
.rubrique-acc {
  position: relative;
  display: grid; grid-template-columns: 72px minmax(0, 5fr) minmax(0, 6fr);
  column-gap: 32px; align-items: baseline;
  padding: 28px 0 30px;
  counter-increment: rub;
  view-timeline: --rubrique;
}
.rubrique-acc::before {
  content: "";
  position: absolute; left: 0; right: 0; top: 0;
  height: 3px; background: var(--noir);
  transform-origin: left center;
}
.rubrique-acc__num { font: 700 14px/1 var(--f-texte); letter-spacing: .1em; color: var(--brun-gris); }
.rubrique-acc__num::before { content: counter(rub, decimal-leading-zero); }
.rubrique-acc__nom { font: 700 clamp(28px, 3.6vw, 56px)/1.05 var(--f-titre); }
.rubrique-acc__repere { font: 400 17px/1.5 var(--f-texte); color: var(--noir); }
.rubrique-acc__repere strong { font: 500 20px/1.2 var(--f-titre); white-space: nowrap; }
.rubrique-acc--bar { isolation: isolate; }
.rubrique-acc__bande { position: absolute; inset: 0 -24px; background: var(--ambre); z-index: -1; transform-origin: left center; border-radius: 6px; }
.rubrique-acc__avis { display: block; margin-top: 10px; font: 600 14px/1.4 var(--f-texte); }
.carte-acc__bas { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: 64px; margin-top: 72px; align-items: end; }
.carte-acc__suite { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }

.resa { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); column-gap: 96px; align-items: start; }
.resa__module .texte { margin-top: 20px; color: var(--sauge); }
.module-resa { margin-top: 40px; min-height: 520px; background: var(--vert); }
.resa__cote { display: flex; flex-direction: column; gap: 32px; padding-top: 8px; }
.resa .table { --table: 200px; }
.horaires-titre { font: 700 13px/1.2 var(--f-texte); letter-spacing: .14em; text-transform: uppercase; color: var(--encre-2); margin-bottom: 12px; }
.horaires { view-timeline: --horaires; }
.horaires li { position: relative; isolation: isolate; display: flex; justify-content: space-between; gap: 24px; padding: 9px 12px; border-bottom: 2px solid rgba(243, 236, 223, .2); font: 400 16px/1.4 var(--f-texte); }
.s-papier .horaires li { border-bottom-color: rgba(21, 19, 17, .18); }
.horaires li span:last-child { font-variant-numeric: tabular-nums; }
.horaires li::before { content: ""; position: absolute; inset: 0; background: var(--ambre); border-radius: 6px; z-index: -1; transform: scaleX(0); transform-origin: left center; }
.horaires li.aujourdhui { color: var(--noir); font-weight: 700; }
.horaires li.aujourdhui::before { transform: scaleX(1); }
.resa__preuve { font: 600 14px/1.4 var(--f-texte); color: var(--sauge); }
.appel { font: 400 16px/1.5 var(--f-texte); }
.appel a { white-space: nowrap; }

#es-resa .esw, #es-resa .esw[data-esw-theme="dark"] {
  --esw-accent: #E0952F; --esw-on-accent: #151311; --esw-on-accent-soft: rgba(21, 19, 17, .78); --esw-on-accent-dim: rgba(243, 236, 223, .22);
  --esw-ink: #F3ECDF; --esw-muted: #B9C4AE; --esw-line: rgba(243, 236, 223, .2); --esw-ctrl-line: rgba(243, 236, 223, .6);
  --esw-bg: transparent; --esw-soft: rgba(243, 236, 223, .05); --esw-field: transparent; --esw-field-line: rgba(243, 236, 223, .6);
  --esw-off: rgba(185, 196, 174, .45); --esw-accent-ink: #E0952F; --esw-link: #F3ECDF; --esw-radius: 6px; --esw-shadow: none;
  --esw-demo-a: #151311; --esw-demo-b: #24201B; --esw-demo-ink: #F3ECDF;
  max-width: none; margin: 0; border: 0; border-radius: 0; box-shadow: none; overflow: visible;
  font-family: var(--f-texte); color: var(--creme); background: transparent;
}
#es-resa .esw input, #es-resa .esw select, #es-resa .esw button { font-family: var(--f-texte); }
#es-resa .esw-demo { border-radius: 6px; font-weight: 600; }

#es-resa .esw-head { background: transparent; padding: 24px 0 8px; }
#es-resa .esw-name, #es-resa .esw-kicker { color: var(--ambre); font: 700 12px/1.2 var(--f-texte); letter-spacing: .14em; text-transform: uppercase; }
#es-resa .esw-title { font: 700 30px/1.05 var(--f-titre); color: var(--creme); letter-spacing: -.005em; margin-top: 8px; }
#es-resa .esw-steps span { height: 3px; border-radius: 0; background: rgba(243, 236, 223, .22); }
#es-resa .esw-steps span.on { background: var(--ambre); }
#es-resa .esw-body { padding-inline: 0; }
#es-resa .esw-foot { padding-inline: 0; color: var(--sauge); border-top: 2px solid rgba(243, 236, 223, .2); }

#es-resa .esw-lbl { font: 700 12px/1.2 var(--f-texte); letter-spacing: .12em; text-transform: uppercase; color: var(--sauge); margin-bottom: 8px; }
#es-resa .esw-input, #es-resa .esw-select { min-height: 52px; border: 3px solid rgba(243, 236, 223, .6); border-radius: 6px; background: var(--vert); color: var(--creme); font: 400 17px/1.3 var(--f-texte); transition: border-color 160ms var(--glisse); }
#es-resa .esw-input:hover, #es-resa .esw-select:hover { border-color: var(--creme); }
#es-resa .esw-input:focus, #es-resa .esw-select:focus { border-color: var(--creme); outline: 3px solid var(--ambre); outline-offset: 3px; box-shadow: none; }
#es-resa .esw-step-btn { border: 3px solid var(--creme); background: transparent; color: var(--creme); transition: transform 160ms var(--glisse), box-shadow 160ms var(--glisse), background-color 160ms var(--glisse), color 160ms var(--glisse); }
#es-resa .esw-step-btn:hover { background: var(--ambre); color: var(--noir); transform: translate(-2px, -2px); box-shadow: 3px 3px 0 var(--creme); }
#es-resa .esw-step-btn:active { transform: translate(2px, 2px); box-shadow: none; transition-duration: 90ms; }
#es-resa .esw-count { font: 500 32px/1 var(--f-titre); color: var(--creme); }

#es-resa .esw-cal { border: 3px solid rgba(243, 236, 223, .6); border-radius: 6px; background: transparent; }
#es-resa .esw-cal-title { font: 700 20px/1.1 var(--f-titre); color: var(--creme); }
#es-resa .esw-cal-nav { border: 3px solid var(--creme); border-radius: 6px; background: transparent; color: var(--creme); transition: background-color 160ms var(--glisse), color 160ms var(--glisse); }
#es-resa .esw-cal-nav:hover:not(:disabled) { background: var(--ambre); color: var(--noir); }
#es-resa .esw-cal-dow { color: var(--sauge); font: 700 12px/1 var(--f-texte); letter-spacing: .08em; text-transform: uppercase; }
#es-resa .esw-cal-c { position: relative; isolation: isolate; min-height: 44px; border-radius: 6px; color: var(--creme); font: 500 18px/1 var(--f-titre); font-variant-numeric: tabular-nums; transition: background-color 160ms var(--glisse), color 160ms var(--glisse); }
#es-resa button.esw-cal-c:not(.sel):hover { background: rgba(243, 236, 223, .1); }

#es-resa .esw-cal-grid > .esw-cal-c { aspect-ratio: 1 / 1; width: 48px; min-height: 0; height: 48px; justify-self: center; }
#es-resa .esw-cal-c.sel { background: var(--ambre); color: var(--noir); font-weight: 700; border-radius: 50%; box-shadow: inset 0 0 0 2px var(--vert); }
#es-resa .esw-cal-c.off { color: rgba(185, 196, 174, .45); }
#es-resa .esw-cal-grid > .esw-cal-c.off:nth-child(7n+1)::after, #es-resa .esw-cal-grid > .esw-cal-c.off:nth-child(7n+2)::after { content: ""; position: absolute; left: 30%; right: 30%; top: 50%; height: 2px; background: currentColor; transform: rotate(-30deg); }

#es-resa .esw-pill { min-height: 44px; border: 3px solid rgba(243, 236, 223, .6); border-radius: 6px; background: transparent; color: var(--creme); font: 600 16px/1 var(--f-texte); font-variant-numeric: tabular-nums; transition: transform 160ms var(--glisse), box-shadow 160ms var(--glisse), background-color 160ms var(--glisse), border-color 160ms var(--glisse); }
#es-resa .esw-pill:hover:not(:disabled) { border-color: var(--creme); }
#es-resa .esw-pill.sel { background: var(--ambre); border-color: var(--creme); color: var(--noir); box-shadow: 3px 3px 0 var(--creme); }
#es-resa .esw-pill.sel:active { transform: translate(3px, 3px); box-shadow: 0 0 0 var(--creme); transition-duration: 90ms; }

#es-resa .esw-btn { min-height: 52px; border: 3px solid var(--creme); border-radius: 6px; background: var(--ambre); color: var(--noir); box-shadow: 4px 4px 0 var(--creme); font: 700 15px/1 var(--f-texte); letter-spacing: .06em; text-transform: uppercase; transition: transform 160ms var(--glisse), box-shadow 160ms var(--glisse); }
#es-resa .esw-btn:hover:not(:disabled) { transform: translate(-2px, -2px); box-shadow: 6px 6px 0 var(--creme); }
#es-resa .esw-btn:active:not(:disabled) { transform: translate(4px, 4px); box-shadow: 0 0 0 var(--creme); transition-duration: 90ms; }
#es-resa .esw-back { color: var(--sauge); font: 600 15px/1.2 var(--f-texte); }
#es-resa .esw-back:hover { color: var(--creme); }
#es-resa .esw-note, #es-resa .esw-hint { color: var(--sauge); }
#es-resa .esw a { color: var(--creme); text-decoration-color: var(--ambre); text-decoration-thickness: 3px; text-underline-offset: 4px; }

.plusieurs { display: grid; grid-template-columns: minmax(0, 11fr) minmax(0, 12fr); column-gap: 88px; align-items: center; }
.plusieurs__texte .texte { margin-top: 16px; }
.plusieurs__texte .h2 { margin-bottom: 8px; }
.plusieurs__actions { display: flex; align-items: center; gap: 32px; margin-top: 32px; flex-wrap: wrap; }
.plusieurs__table { display: flex; align-items: center; gap: 24px; margin-top: 32px; }
.avis-rangee { display: grid; grid-template-columns: repeat(3, 1fr); gap: 48px; margin-top: 88px; }
.avis-rangee .avis__texte { font-size: clamp(20px, 1.7vw, 26px); }

.chez-vous { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 96px; align-items: center; }
.chez-vous .texte { margin-top: 20px; }
.chez-vous .actions { margin-top: 32px; }
.chez-vous__lien { margin-top: 24px; }
.s-ambre .surtitre { color: var(--noir); }

.trouver { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 96px; row-gap: 56px; align-items: start; }
.trouver__tete { display: flex; justify-content: space-between; align-items: flex-start; gap: 40px; grid-column: 1 / -1; }
.trouver__tete .h2 { max-width: 20ch; }
.trouver__tete .texte { color: var(--cendre); margin-top: 20px; }
.coordonnees { display: grid; gap: 8px; margin-top: 28px; font: 400 17px/1.5 var(--f-texte); }
.coordonnees a { width: fit-content; }
.rappel { margin-top: 40px; }

.carte-google {
  position: relative;
  aspect-ratio: 4 / 3;
  background: var(--noir);
  border: 3px solid rgba(243, 236, 223, .4);
  border-radius: 6px;
  overflow: clip;
  margin-top: 32px;
}
.carte-google__voile { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 16px; padding: 40px; color: var(--creme); }
.carte-google__adresse { font: 500 26px/1.2 var(--f-titre); }
.carte-google__bouton { --contour: var(--creme); }
.mini-epingle { width: 18px; height: 18px; transition: transform 160ms var(--glisse); }
.carte-google__bouton:hover .mini-epingle { transform: translateY(-4px); }
.carte-google__cadre { position: absolute; inset: 0; pointer-events: none; }
.carte-google.est-ouverte .carte-google__cadre { pointer-events: auto; }
.carte-google__cadre iframe { width: 100%; height: 100%; border: 0; filter: grayscale(1) invert(.9) sepia(.18) contrast(.9) brightness(.85); }
.carte-google.est-ouverte .carte-google__voile { display: none; }
.carte-google.est-ouverte iframe { animation: apparait 400ms var(--glisse) both; }
.carte-google__liens { display: flex; gap: 24px; margin-top: 16px; }

.faq { border-top: 3px solid var(--creme); }
.faq details { border-bottom: 0; }
.faq summary {
  position: relative;
  display: flex; justify-content: space-between; align-items: center; gap: 24px;
  padding: 18px 0;
  font: 500 19px/1.3 var(--f-titre);
  cursor: pointer;
  list-style: none;
  transition: color 160ms var(--glisse);
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: rgba(243, 236, 223, .35); transform-origin: left center; }
.faq summary:hover { color: var(--ambre); }
.croix { position: relative; width: 20px; height: 20px; flex: none; transition: transform 220ms var(--glisse); }
.croix::before, .croix::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 3px; margin-top: -1.5px; background: var(--ambre); }
.croix::after { transform: rotate(90deg); }
.faq details[open] .croix { transform: rotate(45deg); }
.faq__reponse { padding: 4px 0 22px; color: var(--cendre); max-width: 58ch; }

.pied { position: relative; padding: 120px 0 40px; overflow-x: clip; }
.pied__scene { position: relative; display: flex; flex-direction: column; align-items: center; gap: 28px; }
.pied .table { --table: 220px; }
.pied .tampon { --tampon: 96px; }
.pied__nom { margin-top: 40px; text-align: center; font: 700 min(9vw, 148px)/1.08 var(--f-titre); color: var(--creme); overflow-wrap: normal; }
.pied__nom .ligne { display: block; }
.pied__infos { display: grid; grid-template-columns: 1.2fr 1fr 1fr .8fr; gap: 48px; margin-top: 96px; padding-top: 40px; border-top: 3px solid rgba(243, 236, 223, .25); font: 400 15px/1.6 var(--f-texte); color: var(--cendre); }
.pied__titre { font: 700 13px/1.2 var(--f-texte); letter-spacing: .14em; text-transform: uppercase; color: var(--creme); margin-bottom: 14px; }
.pied__infos a { color: var(--creme); }
.pied__liens { display: grid; gap: 8px; }
.pied__bas { display: flex; justify-content: space-between; align-items: center; gap: 24px; margin-top: 56px; padding-top: 24px; border-top: 2px solid rgba(243, 236, 223, .15); font: 400 13px/1.5 var(--f-texte); color: var(--cendre); flex-wrap: wrap; }
.pied__bas a { color: var(--creme); }
.pied__legal { display: flex; gap: 20px; }
.signature a { font-weight: 600; }

.tete-page { padding: 72px 0 96px; }
.tete-page__grille { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; column-gap: 48px; align-items: start; }
.tete-page .tampon { --tampon: 120px; }
.tete-page .texte { margin-top: 20px; }
.tete-page .actions { margin-top: 32px; }
.tete-page .micro { margin-top: 10px; font-size: 13px; }
.etat-jour { margin-top: 18px; font: 600 15px/1.4 var(--f-texte); color: var(--ambre); }

.carte-corps { display: grid; grid-template-columns: 240px minmax(0, 1fr); column-gap: 80px; align-items: start; padding-top: 96px; }
.index { position: sticky; top: calc(var(--entete) + 24px); z-index: 3; display: flex; flex-direction: column; gap: 28px; padding-bottom: 32px; color: var(--noir); transition: color 260ms var(--glisse); }
.index--soir { color: var(--creme); }
.index__titre { font: 700 13px/1.2 var(--f-texte); letter-spacing: .14em; text-transform: uppercase; }
.index__liste { position: relative; }
.index__indicateur {
  position: absolute; left: 0; top: 0;
  width: 100%; height: 34px;
  background: var(--ambre);
  border: 3px solid var(--noir);
  border-radius: 6px;
  transform: translateY(var(--y, 0px));
  transition: transform 260ms var(--glisse);
}
.index__liste li { position: relative; }
.index__liste a { display: flex; align-items: center; height: 34px; padding: 0 12px; font: 600 15px/1 var(--f-texte); text-decoration: none; transition: color 160ms var(--glisse); }
.index__liste a[aria-current="location"] { color: var(--noir); }
.index__liste a:hover { color: var(--ail-texte); }
.index--soir .index__liste a:hover { color: var(--ambre); }
.index--soir .index__liste a[aria-current="location"] { color: var(--noir); }
.index .table { --table: 140px; }
.allergenes-legende { font: 400 13px/1.6 var(--f-texte); color: var(--brun-gris); max-width: 80ch; margin-bottom: 56px; }
.allergenes-legende strong { color: var(--noir); }
.rubrique { padding-bottom: 88px; overflow-x: clip; }
.rubrique__tete { display: flex; align-items: baseline; justify-content: space-between; gap: 24px; }
.rubrique__nom { font: 700 clamp(32px, 4vw, 60px)/1.02 var(--f-titre); }
.rubrique__intro { margin-top: 10px; color: var(--encre-2); }
.rubrique__corps { margin-top: 28px; }
.rubrique__corps--image { display: grid; grid-template-columns: minmax(0, 1fr) 380px; column-gap: 56px; align-items: start; }
.rubrique__figure { position: sticky; top: calc(var(--entete) + 40px); }
.liste-prix li + li { border-top: 2px solid rgba(21, 19, 17, .14); }
.s-noir .liste-prix li + li, .carte-soir .liste-prix li + li { border-top-color: rgba(243, 236, 223, .16); }
.ligne-prix--ours .ligne-prix__nom { display: inline-flex; align-items: center; gap: 10px; }
.ligne-prix--ours .mini-tampon { width: 28px; height: 28px; border-width: 2px; }
.note-carte { font: 400 15px/1.5 var(--f-texte); color: var(--encre-2); padding: 12px 0; }
.liste-courte { font: 400 16px/1.9 var(--f-texte); }
.liste-courte .prix-txt { font-size: 18px; }
.suggestions { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 40px; align-items: center; padding: 56px 0 96px; border-top: 3px solid var(--noir); }
.suggestions .texte { margin-top: 14px; color: var(--brun-gris); }
.carte-soir { --fond: #151311; --encre: var(--creme); --encre-2: var(--cendre); --contour: var(--creme); --surtitre: var(--ambre); background: var(--noir); color: var(--creme); box-shadow: 0 0 0 100vmax var(--noir); clip-path: inset(0 -100vmax); padding: 112px 0 96px; position: relative; overflow-x: clip; }
.carte-soir .rangee { -webkit-text-stroke-color: var(--creme); margin: 40px 0 72px; }
.carte-soir__tete .texte { margin-top: 16px; color: var(--cendre); }
.colonnes-boissons { display: grid; grid-template-columns: 1fr 1fr; column-gap: 64px; }
.colonnes-boissons .rubrique__nom { font-size: clamp(26px, 2.2vw, 34px); }
.colonnes-boissons .rubrique { padding-bottom: 56px; }
.carte-fin { text-align: left; }
.carte-fin__grille { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 64px; align-items: center; }
.carte-fin .actions { margin-top: 32px; }
.carte-fin .micro { margin-top: 24px; font-size: 14px; }

.resa-page__tete { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; column-gap: 40px; align-items: center; }
.resa-page { padding-top: 64px; }
.resa-page__adresse { margin-top: 12px; font: 600 15px/1.4 var(--f-texte); color: var(--sauge); }
.resa-page__corps { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); column-gap: 96px; margin-top: 32px; align-items: start; }
.resa-page__corps .module-resa { margin-top: 0; }
.cas { display: grid; grid-template-columns: repeat(3, 1fr); gap: 48px; margin-top: 56px; }
.cas__item { display: flex; flex-direction: column; gap: 16px; }
.cas__picto { width: 40px; height: 40px; }
.cas__titre { font: 700 24px/1.1 var(--f-titre); }
.cas__item p { color: var(--brun-gris); }
.cas__item .promesse { margin-top: 4px; }
.venir { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 96px; align-items: start; }
.venir__liste { margin-top: 28px; display: grid; gap: 12px; }
.venir__liste li { display: flex; gap: 14px; align-items: baseline; }
.puce { width: 8px; height: 8px; flex: none; border-radius: 50%; background: var(--ambre); box-shadow: 0 0 0 2px var(--encre); transform: translateY(-2px); }

.canaux { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; margin-top: 56px; }
.canal { border: 3px solid var(--creme); border-radius: 6px; padding: 32px; box-shadow: 4px 4px 0 var(--creme); display: flex; flex-direction: column; gap: 16px; align-items: flex-start; }
.canal__titre { font: 700 32px/1.05 var(--f-titre); }
.canal p { color: var(--cendre); }
.infos-retrait { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; margin-top: 56px; }
.choisir { display: grid; grid-template-columns: minmax(0, 11fr) minmax(0, 12fr); column-gap: 88px; align-items: center; }
.choisir .texte { margin-top: 20px; }
.choisir .actions { margin-top: 32px; }
.venir-table { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 96px; align-items: center; }
.venir-table .texte { margin-top: 20px; color: var(--sauge); }
.venir-table .actions { margin-top: 32px; }

.legal { max-width: 72ch; }
.legal h2 { font: 700 32px/1.1 var(--f-titre); margin: 48px 0 16px; }
.legal p + p { margin-top: 12px; }

@keyframes installe       { from { transform: scale(1.06); } to { transform: scale(1); } }
@keyframes tamponne       { from { transform: scale(1.35) rotate(-18deg); opacity: .35; } to { transform: scale(1) rotate(-8deg); opacity: 1; } }
@keyframes trace-impact   { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes monte-ligne    { from { transform: translateY(28px); opacity: .35; } to { transform: translateY(0); opacity: 1; } }
@keyframes trace          { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes croise-f       { from { transform: rotate(0deg); } to { transform: rotate(35deg); } }
@keyframes croise-c       { from { transform: rotate(0deg); } to { transform: rotate(-35deg); } }
@keyframes cran           { from { transform: scale(.4); } to { transform: scale(1); } }
@keyframes tombe          { from { transform: translateY(-90px) rotate(-12deg); opacity: .35; } to { transform: translateY(0) rotate(0deg); opacity: 1; } }
@keyframes tombe-chevalet { from { transform: translateY(-90px) rotate(-18deg); opacity: .35; } to { transform: translateY(0) rotate(0); opacity: 1; } }
@keyframes feuille        { from { transform: rotate(120deg); opacity: .35; } to { transform: rotate(0deg); opacity: 1; } }
@keyframes deplie         { from { transform: scaleX(.45); } to { transform: scaleX(1); } }
@keyframes signe          { from { transform: scale(1.4) rotate(-16deg); opacity: .35; } to { transform: scale(1) rotate(-6deg); opacity: 1; } }
@keyframes glisse-texte   { from { transform: translateX(-24px); opacity: .35; } to { transform: translateX(0); opacity: 1; } }
@keyframes saute-sac {
  0%   { transform: translateY(-60px) rotate(0deg); opacity: .35; }
  45%  { transform: translateY(0) rotate(-8deg); opacity: 1; }
  72%  { transform: translateY(0) rotate(4deg); opacity: 1; }
  100% { transform: translateY(0) rotate(0); opacity: 1; }
}
@keyframes plante-epingle {
  0%   { transform: translateY(-140px) scaleY(1); opacity: .35; }
  60%  { transform: translateY(0) scaleY(.85); opacity: 1; }
  100% { transform: translateY(0) scaleY(1); opacity: 1; }
}
@keyframes pose-verre     { from { transform: translateY(-100px) rotate(12deg); opacity: .35; } to { transform: translateY(0) rotate(0); opacity: 1; } }
@keyframes nom-monte      { from { transform: translateY(40%); opacity: .35; } to { transform: translateY(0); opacity: 1; } }
@keyframes apparait       { from { opacity: .35; } to { opacity: 1; } }
@keyframes disque-jour    { from { transform: scale(.6); } to { transform: scale(1); } }
@keyframes tombe-carte    { from { transform: translateY(-60px) rotate(-12deg); opacity: .35; } to { transform: translateY(0) rotate(0); opacity: 1; } }
@keyframes glisse-dans-sac { from { transform: translateY(-60px); opacity: .35; } to { transform: translateY(18px); opacity: 1; } }
@keyframes icone-pose     { from { transform: rotate(-8deg); } to { transform: rotate(0); } }

@keyframes sort-photo          { from { transform: scale(1); } to { transform: scale(1.05); } }
@keyframes sort-texte          { from { transform: translateY(0); } to { transform: translateY(-40px); } }
@keyframes glisse-hachures     { from { transform: translateX(-64px); } to { transform: translateX(0); } }
@keyframes glisse-hachures-inv { from { transform: translateX(64px); } to { transform: translateX(0); } }
@keyframes glisse-rubrique     { from { transform: translateX(-48px); } to { transform: translateX(0); } }
@keyframes glisse-rubrique-inv { from { transform: translateX(48px); } to { transform: translateX(0); } }
@keyframes pose-trace          { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes pose-prix           { from { transform: translateX(16px); opacity: .35; } to { transform: translateX(0); opacity: 1; } }
@keyframes pose-guillemet      { from { transform: rotate(-14deg) scale(.8); } to { transform: rotate(0) scale(1); } }
@keyframes pose-ouvre-cote     { from { clip-path: circle(40% at 50% 50%); transform: rotate(-24deg); } to { clip-path: circle(75% at 50% 50%); transform: rotate(0); } }
@keyframes pose-ouvre-plat     { from { clip-path: circle(40% at 50% 50%); transform: rotate(-16deg); } to { clip-path: circle(75% at 50% 50%); transform: rotate(0); } }
@keyframes pose-roule          { from { transform: translateX(-40px) rotate(-90deg) scale(.6); } to { transform: translateX(0) rotate(-8deg) scale(1); } }
@keyframes pose-monte          { from { transform: translateY(32px); opacity: .35; } to { transform: translateY(0); opacity: 1; } }
@keyframes pose-monte-24       { from { transform: translateY(24px); opacity: .35; } to { transform: translateY(0); opacity: 1; } }
@keyframes rangee-gauche       { from { transform: translateX(0); } to { transform: translateX(-28%); } }
@keyframes rangee-droite       { from { transform: translateX(-28%); } to { transform: translateX(0); } }
@keyframes rangee-bar          { from { transform: translateX(0); } to { transform: translateX(-24%); } }
@keyframes pose-tourne-planche { from { transform: rotate(-14deg) scale(.92); } to { transform: rotate(0) scale(1); } }
@keyframes pose-tourne-table   { from { transform: rotate(-20deg); } to { transform: rotate(0); } }

@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }

  #es-resa .esw-cal-c.sel { animation: disque-jour 180ms var(--pose) both; }

  .hero__media img { animation: installe 1400ms var(--glisse) both; }

  .tampon--frappe .tampon__disque { animation: tamponne 650ms var(--pose) 300ms both; }
  .js .tampon--pied:not(.est-pose) .tampon__disque { transform: scale(1.35) rotate(-18deg); opacity: .35; }
  .tampon--pied.est-pose .tampon__disque { animation: tamponne 650ms var(--pose) 300ms both; }

  .tampon--frappe .tampon__trait i { animation: trace-impact 220ms var(--glisse) 950ms both; }

  .titre-lignes .ligne { animation: monte-ligne 700ms var(--glisse) both; animation-delay: calc(400ms + var(--i, 0) * 90ms); }
  .titre-lignes .souligne::after { animation: trace 700ms var(--glisse) both; animation-delay: calc(400ms + 90ms); }

  .table--arrivee .piece--fourchette { animation: croise-f 700ms var(--pose) 1100ms both; }
  .table--arrivee .piece--cuillere { animation: croise-c 700ms var(--pose) 1100ms both; }
  .table--arrivee .cran--premier { animation: cran 300ms var(--pose) 1800ms both; }

  .js .table[data-pose]:not(.est-pose) .cran--nouveau { transform: scale(.4); }
  .table.est-pose .cran--nouveau { animation: cran 300ms var(--pose) var(--apres, 700ms) both; }

  .js .table[data-pose]:not(.est-pose) .piece--tombe { transform: translateY(-90px) rotate(-12deg); opacity: .35; }
  .table.est-pose .piece--tombe { animation: tombe 700ms var(--pose) both; }

  .js .table[data-pose]:not(.est-pose) .piece--feuille { transform: rotate(120deg); opacity: .35; }
  .table.est-pose .piece--feuille { animation: feuille 600ms var(--pose) 500ms both; }

  .js .table[data-pose]:not(.est-pose) .piece--carte .depli { transform: scaleX(.45); }
  .table.est-pose .piece--carte .depli { animation: deplie 450ms var(--pose) 650ms both; }

  .js .table[data-pose]:not(.est-pose) .piece--chevalet { transform: translateY(-90px) rotate(-18deg); opacity: .35; }
  .table.est-pose .piece--chevalet { animation: tombe-chevalet 700ms var(--pose) var(--retard, 0ms) both; }

  .js .table[data-pose]:not(.est-pose) .piece--paire { transform: translate(var(--dx), var(--dy)) rotate(45deg); opacity: .35; }
  .table.est-pose .piece--paire { animation: arrive-paire 650ms var(--pose) both; animation-delay: calc(var(--i) * 80ms); }

  .js .table[data-pose]:not(.est-pose) .piece--sac { transform: translateY(-60px); opacity: .35; }
  .table.est-pose .piece--sac { animation: saute-sac 700ms var(--pose) var(--retard, 0ms) both; }

  .js .table[data-pose]:not(.est-pose) .piece--epingle { transform: translateY(-140px); opacity: .35; }
  .table.est-pose .piece--epingle { animation: plante-epingle 600ms var(--pose) both; }

  .js .table[data-pose]:not(.est-pose) .piece--verre { transform: translateY(-100px) rotate(12deg); opacity: .35; }
  .table.est-pose .piece--verre { animation: pose-verre 700ms var(--pose) both; }

  .js .table[data-pose]:not(.est-pose) .piece--dans-sac { transform: translateY(-60px); opacity: .35; }
  .table.est-pose .piece--dans-sac { transform: translateY(18px); animation: glisse-dans-sac 700ms var(--pose) both; }

  .js .table--index .piece--plat:not(.est-pose) { transform: translateY(-60px) rotate(-12deg); opacity: .35; }
  .table--index .piece--plat.est-pose { animation: tombe-carte 500ms var(--pose) both; }
  .js .table--index .cran--plat:not(.est-pose) { transform: scale(.4); }
  .table--index .cran--plat.est-pose { animation: cran 300ms var(--pose) 500ms both; }

  .js .plat-ours:not(.est-pose) .mini-tampon { transform: scale(1.4) rotate(-16deg); opacity: .35; }
  .plat-ours.est-pose .mini-tampon { animation: signe 420ms var(--pose) both; }

  .js .plat-ours:not(.est-pose) .plat-ours__texte { transform: translateX(-24px); opacity: .35; }
  .plat-ours.est-pose .plat-ours__texte { animation: glisse-texte 500ms var(--glisse) both; }

  .js .faq:not(.est-pose) summary::after { transform: scaleX(0); }
  .faq.est-pose summary::after { animation: trace 420ms var(--glisse) both; animation-delay: calc(var(--i) * 60ms); }

  .js .pied__nom:not(.est-pose) .ligne { transform: translateY(40%); opacity: .35; }
  .pied__nom.est-pose .ligne { animation: nom-monte 700ms var(--glisse) both; animation-delay: calc(var(--i) * 120ms); }

  .js .canaux:not(.est-pose) .canal { transform: translateY(32px); opacity: .35; }
  .canaux.est-pose .canal { animation: pose-monte 600ms var(--glisse) both; animation-delay: calc(var(--i) * 120ms); }

  .js .suggestions:not(.est-pose) .social { transform: rotate(-8deg); }
  .suggestions.est-pose .social { animation: icone-pose 500ms var(--pose) both; }
}

@keyframes arrive-paire { from { transform: translate(var(--dx), var(--dy)) rotate(45deg); opacity: .35; } to { transform: translate(0, 0) rotate(0); opacity: 1; } }

@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {

    .hero__media { animation: sort-photo linear both; animation-timeline: view(); animation-range: exit 0% exit 100%; }
    .hero__texte { animation: sort-texte linear both; animation-timeline: view(); animation-range: exit 0% exit 100%; }

    .hachures { animation: glisse-hachures linear both; animation-timeline: view(); animation-range: entry 0% entry 100%; }
    .hachures--inverse { animation-name: glisse-hachures-inv; }

    .hachures--rubrique { animation: glisse-rubrique linear both; animation-timeline: view(); animation-range: entry 0% cover 50%; }
    .rubrique:nth-of-type(even) .hachures--rubrique { animation-name: glisse-rubrique-inv; }

    .ligne-prix .pointilles { animation: pose-trace linear both; animation-timeline: --ligne; animation-range: entry 10% cover 30%; }

    .ligne-prix .prix-bloc { animation: pose-prix linear both; animation-timeline: --ligne; animation-range: cover 25% cover 35%; }

    .avis .avis__guillemet { animation: pose-guillemet linear both; animation-timeline: --avis; animation-range: entry 0% entry 100%; }

    .plat-rond--cote img { animation: pose-ouvre-cote linear both; animation-timeline: view(); animation-range: entry 0% cover 45%; }

    .plat-rond--signature img { animation: pose-ouvre-plat linear both; animation-timeline: view(); animation-range: entry 0% cover 45%; }

    .heros .pastille { animation: pose-roule linear both; animation-timeline: --heros; animation-range: entry 0% entry 100%; }

    .avis--monte { animation: pose-monte linear both; animation-timeline: view(); animation-range: entry 0% entry 100%; }

    .rangee--haut { animation: rangee-gauche linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; }
    .rangee--bas { animation: rangee-droite linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; }

    .rangee--bar { animation: rangee-bar linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; }

    .rubrique-acc { animation: pose-monte linear both; animation-timeline: view(); animation-range: entry 0% entry 100%; }
    .rubrique-acc::before { animation: pose-trace linear both; animation-timeline: --rubrique; animation-range: entry 0% entry 100%; }

    .rubrique-acc__bande { animation: pose-trace linear both; animation-timeline: --rubrique; animation-range: entry 20% cover 40%; }

    .horaires li.aujourdhui::before { animation: pose-trace linear both; animation-timeline: --horaires; animation-range: entry 0% entry 100%; }

    .plat-rond--planche img { animation: pose-tourne-planche linear both; animation-timeline: view(); animation-range: entry 0% cover 60%; }

    .pied .table { animation: pose-tourne-table linear both; animation-timeline: view(); animation-range: entry 0% cover 40%; }

    .cas__item { animation: pose-monte-24 linear both; animation-timeline: view(); animation-range: entry 0% entry 100%; }
  }
}

@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) and (max-width: 1023px) {
    #es-resa .esw-head, #es-resa .esw-body > *, #es-resa .esw-foot,
    .plusieurs__texte > *, .faq details, .pied__infos > div, .pied__bas > *,
    .venir__liste li, .infos-retrait > div, .coordonnees > * {
      animation: pose-monte-24 linear both; animation-timeline: view(); animation-range: entry 0% entry 100%;
    }

    .pied__bas { position: relative; }
    .pied__bas::before { content: ""; position: absolute; left: 0; right: 0; top: -2px; height: 3px; background: var(--ambre); transform-origin: left center; animation: trace-fin linear both; animation-timeline: scroll(root); animation-range: calc(100% - 700px) 100%; }
  }
}
@keyframes trace-fin { from { transform: scaleX(0); } to { transform: scaleX(1); } }

@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) and (min-width: 1024px) {
    #es-resa .esw-body > *, #es-resa .esw-foot {
      animation: pose-monte-24 linear both; animation-timeline: view(); animation-range: entry 0% entry 100%;
    }

    .pied__bas { position: relative; }
    .pied__bas::before { content: ""; position: absolute; left: 0; right: 0; top: -2px; height: 3px; background: var(--ambre); transform-origin: left center; animation: trace-fin linear both; animation-timeline: scroll(root); animation-range: calc(100% - 700px) 100%; }
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition-duration: 1ms !important; scroll-behavior: auto !important; }
}

.hero__livrer, .surtitre__court { display: none; }
@media (max-width: 699px) {
  .surtitre__long { display: none; }
  .surtitre__court { display: inline; }
}
@media (max-width: 1099px), (max-aspect-ratio: 4/3) {
  .hero { height: auto; min-height: 0; display: flex; flex-direction: column; }
  .hero__media { position: relative; inset: auto; transform-origin: 50% 100%; }
  .hero__media picture { display: block; height: 100%; }
  .hero__media img { object-position: 50% 40%; transform-origin: 50% 100%; }
  .hero__voile, .hero__preuve, .hero__carte, .hero__uber-btn { display: none; }
  .hero__livrer { display: inline-flex; }
  .hero__texte { width: auto; height: auto; padding: 0 var(--marge) 40px; }
  .hero .actions { gap: 14px 28px; }
  .s-incontournables .table, .s-ours .table, .resa .table { --table: 104px; }
  .pied .table { --table: 148px; }
  .avis__guillemet { font-size: 64px; }
  .avis { padding-top: 32px; }
}

.hero__livrer { align-items: center; gap: 10px; font: 600 16px/1.3 var(--f-texte); color: var(--creme); text-decoration: underline 3px var(--ambre); text-underline-offset: 6px; min-height: 44px; }
.hero__livrer svg { width: 22px; height: 22px; flex: none; }

@media (max-width: 699px) {
  .hero { height: calc(100svh - var(--entete) + 52px); max-height: calc(125vw + 440px); min-height: min-content; }
  .hero__media { flex: 1 1 0; min-height: 200px; max-height: 125vw; -webkit-mask-image: linear-gradient(to bottom, #000 82%, transparent); mask-image: linear-gradient(to bottom, #000 82%, transparent); }
  .hero__media img { height: 100%; object-position: 50% 38%; }
  .hero__texte { flex: none; position: relative; padding: 12px var(--marge) 16px; }
  .hero__haut { position: absolute; top: -36px; right: var(--marge); margin: 0; display: flex; flex-direction: column; align-items: center; gap: 10px; }
  .hero .tampon { --tampon: 88px; }
  .hero .tampon__traits { transform: scaleX(-1); }
  .hero .table { --table: 104px; }
  .hero .surtitre { font-size: 12px; margin-bottom: 10px; padding-right: 112px; }
  .hero .h1 { font-size: clamp(36px, 9.75vw, 42px); margin-bottom: 12px; padding-right: 0; }
  .hero__appui { font-size: 16px; line-height: 1.5; margin-bottom: 16px; }
  .hero .btn--principal { height: 48px; }
}

@media (min-width: 700px) and (max-aspect-ratio: 1/1) {
  .hero__media { aspect-ratio: 1672 / 940; -webkit-mask-image: linear-gradient(to bottom, #000 78%, transparent); mask-image: linear-gradient(to bottom, #000 78%, transparent); }
  .hero__media img { height: 100%; object-position: 100% 55%; transform-origin: 75% 60%; }
  .hero__texte { position: relative; padding: 4px var(--marge) 56px; }
  .hero__haut { position: absolute; left: var(--marge); bottom: calc(100% + 7vw); margin: 0; gap: 36px; }
  .hero .tampon { --tampon: 120px; }
  .hero .table { --table: 120px; }
  .hero .h1 { font-size: clamp(52px, 7.4vw, 76px); margin-bottom: 16px; }
  .hero__appui { margin-bottom: 24px; }
}

@media (min-width: 700px) and (min-aspect-ratio: 1/1) and (max-width: 1099px), (min-width: 700px) and (min-aspect-ratio: 1/1) and (max-aspect-ratio: 4/3) {
  .hero { display: grid; grid-template-columns: minmax(0, 1fr) auto; height: calc(100svh - var(--entete)); min-height: 480px; }
  .hero__media { grid-column: 2; grid-row: 1; height: 100%; aspect-ratio: 4 / 5; transform-origin: 50% 50%; -webkit-mask-image: linear-gradient(to right, transparent, #000 14%); mask-image: linear-gradient(to right, transparent, #000 14%); }
  .hero__media img { height: 100%; object-position: 50% 40%; transform-origin: 50% 60%; }
  .hero__texte { grid-column: 1; grid-row: 1; justify-content: center; padding: 24px 24px 24px var(--marge); }
  .hero .tampon { --tampon: 104px; }
  .hero .table { --table: 104px; }
  .hero__haut { gap: 28px; margin-bottom: 18px; }
  .hero .h1 { font-size: clamp(40px, 5vw, 60px); }
}

@media (max-width: 1023px) {
  :root { --section: 88px; --entete: 64px; }
  .nav { display: none; }
  .menu-bouton { display: inline-flex; align-items: center; height: 44px; padding: 0 16px; border: 3px solid var(--creme); border-radius: 6px; background: transparent; color: var(--creme); font: 700 14px/1 var(--f-texte); letter-spacing: .06em; text-transform: uppercase; }
  .panneau-menu:not([hidden]) { display: flex; flex-direction: column; gap: 20px; position: fixed; inset: var(--entete) 0 0 0; z-index: 59; background: var(--noir); padding: 40px var(--marge); font: 700 30px/1.1 var(--f-titre); }

  .barre-mobile { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 55; gap: 16px; align-items: center; padding: 10px var(--marge); background: var(--noir); border-top: 3px solid var(--ambre); }
  .cta-suivi:not(.cta-passe) .barre-mobile { transform: translateY(100%); visibility: hidden; }
  .cta-pret .barre-mobile { transition: transform 220ms var(--glisse), visibility 0s linear 0s; }
  .cta-pret:not(.cta-passe) .barre-mobile { transition: transform 220ms var(--glisse), visibility 0s linear 220ms; }
  .cta-suivi:not(.cta-passe) .entete .btn--principal { opacity: 0; visibility: hidden; }

  .actions:has([data-cta-premier]) .btn--secondaire, .canaux .btn--secondaire {
    height: auto; padding: 0 0 4px; border: 0; border-radius: 0; background: none; box-shadow: none; transform: none;
    font: 600 16px/1.3 var(--f-texte); letter-spacing: 0; text-transform: none;
    text-decoration: underline 3px var(--ambre); text-underline-offset: 6px;
  }
  .actions:has([data-cta-premier]) .btn--secondaire .btn__glyphe, .canaux .btn--secondaire .btn__glyphe { width: 18px; height: 18px; }

  .inc, .ours, .resa, .plusieurs, .chez-vous, .trouver, .venir, .choisir, .venir-table, .carte-corps, .canaux, .infos-retrait, .resa-page__corps, .cas, .avis-rangee, .ours__citations, .colonnes-boissons, .carte-acc__bas, .rubrique__corps--image, .carte-fin__grille { grid-template-columns: minmax(0, 1fr); }
  .ours__media, .rubrique__figure { position: static; }
  .rubrique-acc { grid-template-columns: minmax(0, 1fr); }

  .barre-mobile { justify-content: space-between; padding-bottom: calc(10px + env(safe-area-inset-bottom)); }
  .barre-mobile .btn { height: 48px; padding: 0 20px; }
  .barre-mobile .lien { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-size: 15px; color: var(--creme); }
  .barre-mobile .lien svg { width: 20px; height: 20px; flex: none; }
  body:has(.barre-mobile) .pied { padding-bottom: 104px; }
  .panneau-menu a { min-height: 44px; display: flex; align-items: center; text-decoration: none; }
  .panneau-menu .socials { margin-top: 12px; }
  .panneau-menu .social { display: inline-grid; min-height: 0; color: var(--creme); border: 0; background: none; }
  .panneau-menu .socials { gap: 8px; margin-left: -10px; }
  .panneau-menu .social svg { width: 28px; height: 28px; }

  .tete-page__grille, .resa-page__tete { grid-template-columns: auto minmax(0, 1fr); column-gap: 24px; row-gap: 20px; align-items: center; }
  .tete-page__grille > div:not(.tampon):not(.table), .resa-page__tete > div:not(.tampon):not(.table) { grid-column: 1 / -1; grid-row: 2; }
  .tete-page__grille > .table, .resa-page__tete > .table { grid-column: 2; grid-row: 1; justify-self: end; }
  .tete-page { padding: 48px 0 72px; }

  .inc__tete, .carte-acc__tete { align-items: flex-start; gap: 20px; }
  .inc__tete .h2, .carte-acc__tete .h2 { max-width: none; }

  .ours__media { width: min(88%, 560px); margin: 0 auto 40px; }
  .heros__ligne { align-items: center; }

  .resa__cote { margin-top: 48px; display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 32px; row-gap: 24px; align-items: start; }
  .resa__cote > .table { grid-row: 1 / span 3; }
  .resa__cote > :not(.table) { grid-column: 2; }
  .resa-page__corps .resa__cote { grid-template-columns: minmax(0, 1fr); }
  .resa-page__corps .resa__cote > :not(.table) { grid-column: 1; }

  .plusieurs figure { width: min(80%, 520px); margin: 0 auto 32px; }
  .plusieurs .legende { text-align: center; }

  .chez-vous .table { margin-top: 40px; }

  .pied__infos { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; margin-top: 64px; }

  html:has(.index) { scroll-padding-top: calc(var(--entete) + 72px); }
  .carte-corps { padding-top: 0; }
  .index {
    position: sticky; top: var(--entete); z-index: 20;
    flex-direction: row; align-items: center; gap: 12px;
    height: 56px; padding: 0 var(--marge); margin: 0 calc(-1 * var(--marge)) 40px;
    background: var(--papier); border-bottom: 3px solid var(--noir);
    transition: color 260ms var(--glisse), background-color 260ms var(--glisse);
  }
  .index--soir { background: var(--noir); border-bottom-color: var(--ambre); }
  .index__titre { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .index .table { --table: 40px; }
  .index .table { order: -1; overflow: clip; border-radius: 50%; }
  .index__liste { flex: 1; min-width: 0; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; -webkit-mask-image: linear-gradient(to right, #000 88%, transparent); mask-image: linear-gradient(to right, #000 88%, transparent); }
  .index__liste::-webkit-scrollbar { display: none; }
  .index__liste ol { display: flex; gap: 4px; width: max-content; padding-right: 40px; }
  .index__liste a { height: 40px; white-space: nowrap; }
  .index__indicateur { top: 3px; width: var(--w, 0px); height: 40px; transform: translateX(var(--x, 0px)); transition: transform 260ms var(--glisse), width 260ms var(--glisse); }
  .index--soir .index__indicateur { border-color: var(--creme); }
  .allergenes-legende { margin-bottom: 40px; }

  .rubrique__figure { order: -1; width: min(78%, 420px); margin: 0 auto 32px; }
  .rubrique__figure .legende { text-align: center; }
  .rubrique { padding-bottom: 64px; }
  .carte-soir { padding: 88px 0 64px; }

  .resa-page { padding-top: 40px; }
  .resa-page__corps { margin-top: 24px; }
  .canaux { gap: 24px; margin-top: 40px; }
  .canal { padding: 24px; }
  .infos-retrait { gap: 32px; margin-top: 40px; }
  .venir-table .table, .choisir .table { margin-top: 8px; }
}

@media (min-width: 700px) and (max-width: 1023px) {
  .tete-page__grille, .resa-page__tete { grid-template-columns: auto minmax(0, 1fr) auto; }
  .tete-page__grille > div:not(.tampon):not(.table), .resa-page__tete > div:not(.tampon):not(.table) { grid-column: 2; grid-row: 1; }
  .tete-page__grille > .table, .resa-page__tete > .table { grid-column: 3; }
  .tete-page .tampon, .resa-page .tampon { --tampon: 104px; }
  .canaux, .cas, .avis-rangee, .colonnes-boissons, .ours__citations { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 32px; }
  .cas { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
  .avis-rangee .avis:last-child { grid-column: 1 / -1; }
  .avis-rangee { margin-top: 64px; row-gap: 48px; }
  .avis-rangee .avis { margin-top: 0; padding-top: 0; }
  .infos-retrait, .venir { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 40px; }

  .trouver > div:nth-child(2) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 40px; align-items: start; }
  .trouver > div:nth-child(2) > :not(:last-child) { grid-column: 1; }
  .trouver > div:nth-child(2) > :last-child { grid-column: 2; grid-row: 1 / span 3; margin-top: 28px !important; }
  .plusieurs { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); column-gap: 40px; }
  .plusieurs figure { width: 100%; margin: 0; }
  .choisir { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); column-gap: 40px; }
  .chez-vous { grid-template-columns: minmax(0, 1fr) auto; column-gap: 40px; }
  .chez-vous .table { margin-top: 0; }
  .rubrique-acc { grid-template-columns: 56px minmax(0, 1fr); column-gap: 20px; }
  .rubrique-acc__repere { grid-column: 2; }
  .rubrique__corps--image { grid-template-columns: minmax(0, 1fr) 260px; column-gap: 32px; }
  .rubrique__figure { order: 0; width: 100%; margin: 0; position: sticky; top: calc(var(--entete) + 80px); }
}

@media (max-width: 699px) {
  :root { --section: 64px; }
  body { font-size: 16px; }
  .entete__in { gap: 12px; }
  .marque { gap: 10px; }
  .marque__disque { width: 46px; height: 46px; }
  .marque__nom { font-size: 15px; }
  .h1--page { font-size: 34px; }
  .h2 { font-size: 30px; }
  .surtitre { font-size: 12px; }
  .texte { font-size: 16px; }
  .heros__nom { font-size: 32px; }
  .rubrique-acc__nom { font-size: 26px; }
  .rubrique__nom { font-size: 32px; }
  .prix-txt { font-size: 19px; }
  .avis { margin-top: 32px; }
  .avis__texte { font-size: 22px; }
  .avis-rangee { row-gap: 0; margin-top: 16px; }
  .avis-rangee .avis { margin-top: 40px; padding-top: 0; }
  .hachures { height: 22px; top: -21px; background: repeating-linear-gradient(-45deg, var(--fond) 0 5px, transparent 5px 18px); }
  .btn { height: 48px; }
  .panneau-menu:not([hidden]) { font-size: 28px; gap: 12px; }

  .tete-page .tampon, .resa-page .tampon { --tampon: 72px; }
  .tete-page .table, .resa-page .table { --table: 88px; }
  .tete-page { padding: 32px 0 56px; }
  .tete-page__grille, .resa-page__tete { row-gap: 16px; }
  .tete-page .texte { margin-top: 14px; }
  .tete-page .actions { margin-top: 24px; }

  .inc__tete { display: grid; grid-template-columns: minmax(0, 1fr) auto; }
  .inc__tete .table, .carte-acc__tete .table { --table: 96px; }
  .carte-acc__tete { display: grid; grid-template-columns: minmax(0, 1fr) auto; }
  .carte-acc__tete > div { grid-column: 1 / -1; grid-row: 2; }
  .carte-acc__tete > .table { grid-column: 2; grid-row: 1; margin-bottom: -24px; }

  .pastille { width: 96px; height: 96px; font-size: 13px; }
  .pastille strong { font-size: 30px; }
  .heros { margin-top: 40px; }
  .heros__bas { gap: 20px; }
  .heros__bas .table { --table: 96px; }
  .ours-liste { margin-top: 40px; }
  .plat-ours { gap: 16px; }
  .plat-ours__texte { flex-direction: column; gap: 4px; }

  .rangee { font-size: 18vw; }
  .rangee--haut { margin-bottom: 48px; }
  .rangee--bas { margin-top: 64px; }
  .rubriques { margin-top: 40px; }
  .rubrique-acc { padding: 20px 0 22px; row-gap: 4px; }
  .rubrique-acc__bande { inset: 0 -12px; }
  .inc__liste .prix-bloc { flex-direction: row; align-items: baseline; gap: 14px; }
  .carte-acc__bas { gap: 40px; margin-top: 48px; }

  .resa__cote { grid-template-columns: minmax(0, 1fr); margin-top: 40px; }
  .resa__cote > .table { --table: 96px; grid-row: auto; }
  .resa__cote > :not(.table) { grid-column: 1; }

  .carte-google { aspect-ratio: 1 / 1; }
  .carte-google__voile { padding: 28px; }
  .carte-google__adresse { font-size: 22px; }
  .trouver { row-gap: 40px; }
  .trouver__tete { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; }
  .trouver__tete > div:first-child { grid-column: 1 / -1; grid-row: 2; }
  .trouver__tete > .table { grid-column: 2; grid-row: 1; --table: 96px; }
  .faq summary { font-size: 18px; min-height: 56px; }

  .pied { padding-top: 88px; }
  .pied__nom { font-size: 12.4vw; line-height: 1.08; margin-top: 28px; }
  .pied__des { display: block; }
  .pied__infos { grid-template-columns: minmax(0, 1fr); gap: 28px; margin-top: 56px; }
  .pied__bas { flex-direction: column; align-items: flex-start; gap: 16px; }

  .ligne-prix { grid-template-columns: minmax(0, max-content) minmax(16px, 1fr) auto; column-gap: 10px; }
  .prix-bloc { flex-direction: column; align-items: flex-end; gap: 6px; }
  .ligne-prix:has(.prix-ligne + .prix-ligne) { grid-template-columns: minmax(16px, 1fr) auto; row-gap: 6px; }
  .ligne-prix:has(.prix-ligne + .prix-ligne) .ligne-prix__nom { grid-column: 1 / -1; grid-row: 1; }
  .ligne-prix:has(.prix-ligne + .prix-ligne) .pointilles { grid-column: 1; grid-row: 2; }
  .ligne-prix:has(.prix-ligne + .prix-ligne) .prix-bloc { grid-column: 2; grid-row: 2; flex-direction: row; align-items: flex-end; gap: 16px; }
  .ligne-prix:has(.prix-ligne + .prix-ligne) .ligne-prix__desc { grid-row: 3; }
  .ligne-prix__nom { font-size: 16px; }
  .allergenes { margin-left: 6px; }
  .rubrique__corps { margin-top: 20px; }
  .suggestions { grid-template-columns: minmax(0, 1fr); gap: 24px; padding: 40px 0 64px; }
  .carte-soir .rangee { margin: 24px 0 48px; }
  .colonnes-boissons .rubrique__nom { font-size: 26px; }

  .cas { gap: 40px; }
  .canal__titre { font-size: 28px; }
  .infos-retrait { grid-template-columns: minmax(0, 1fr); }
  .venir { row-gap: 40px; }
  .choisir figure { width: min(80%, 520px); margin: 0 auto 32px; }
  .choisir .legende { text-align: center; }

  #es-resa .esw-cal-grid > .esw-cal-c { width: min(48px, 100%); height: auto; }
  #es-resa .esw-title { font-size: 26px; }
  #es-resa .esw-cal { margin-inline: 0; }
}

@media (max-width: 699px) and (max-height: 700px) {
  .tete-page { padding-top: 20px; }
  .canaux { margin-top: 28px; }
  .canal { padding: 20px; }
}

@font-face { font-family: "Plein secours"; src: local("Arial"), local("ArialMT"); font-weight: 100 349; font-style: normal; size-adjust: 94.16%; ascent-override: 109.39%; descent-override: 28.68%; line-gap-override: 10.62%; }
@font-face { font-family: "Plein secours"; src: local("Arial"), local("ArialMT"); font-weight: 350 449; font-style: normal; size-adjust: 96.13%; ascent-override: 107.15%; descent-override: 28.09%; line-gap-override: 10.4%; }
@font-face { font-family: "Plein secours"; src: local("Arial"), local("ArialMT"); font-weight: 450 549; font-style: normal; size-adjust: 98.29%; ascent-override: 104.79%; descent-override: 27.47%; line-gap-override: 10.17%; }
@font-face { font-family: "Plein secours"; src: local("Arial Bold"), local("Arial-BoldMT"); font-weight: 550 649; font-style: normal; size-adjust: 92.79%; ascent-override: 111%; descent-override: 29.1%; line-gap-override: 10.78%; }
@font-face { font-family: "Plein secours"; src: local("Arial Bold"), local("Arial-BoldMT"); font-weight: 650 749; font-style: normal; size-adjust: 93.93%; ascent-override: 109.65%; descent-override: 28.74%; line-gap-override: 10.65%; }
@font-face { font-family: "Plein secours"; src: local("Arial Bold"), local("Arial-BoldMT"); font-weight: 750 1000; font-style: normal; size-adjust: 95.25%; ascent-override: 108.14%; descent-override: 28.35%; line-gap-override: 10.5%; }
@font-face { font-family: "Plein secours"; src: local("Arial Italic"), local("Arial-ItalicMT"); font-weight: 100 549; font-style: italic; size-adjust: 93.26%; ascent-override: 110.45%; descent-override: 28.95%; line-gap-override: 10.72%; }
@font-face { font-family: "Plein secours"; src: local("Arial Bold Italic"), local("Arial-BoldItalicMT"); font-weight: 550 1000; font-style: italic; size-adjust: 91.45%; ascent-override: 112.63%; descent-override: 29.52%; line-gap-override: 10.94%; }
@font-face { font-family: "Hoover secours"; src: local("Arial"), local("ArialMT"); font-weight: 100 349; font-style: normal; size-adjust: 94.72%; ascent-override: 105.57%; descent-override: 30.62%; line-gap-override: 9.5%; }
@font-face { font-family: "Hoover secours"; src: local("Arial"), local("ArialMT"); font-weight: 350 449; font-style: normal; size-adjust: 94.63%; ascent-override: 105.67%; descent-override: 30.65%; line-gap-override: 9.51%; }
@font-face { font-family: "Hoover secours"; src: local("Arial"), local("ArialMT"); font-weight: 450 549; font-style: normal; size-adjust: 94.53%; ascent-override: 105.79%; descent-override: 30.68%; line-gap-override: 9.52%; }
@font-face { font-family: "Hoover secours"; src: local("Arial Bold"), local("Arial-BoldMT"); font-weight: 550 649; font-style: normal; size-adjust: 88.09%; ascent-override: 113.52%; descent-override: 32.92%; line-gap-override: 10.22%; }
@font-face { font-family: "Hoover secours"; src: local("Arial Bold"), local("Arial-BoldMT"); font-weight: 650 749; font-style: normal; size-adjust: 88.04%; ascent-override: 113.59%; descent-override: 32.94%; line-gap-override: 10.22%; }
@font-face { font-family: "Hoover secours"; src: local("Arial Bold"), local("Arial-BoldMT"); font-weight: 750 1000; font-style: normal; size-adjust: 88.04%; ascent-override: 113.59%; descent-override: 32.94%; line-gap-override: 10.22%; }

:root { --demo: 36px; }
.demo { display: flex; justify-content: center; align-items: center; gap: 8px 20px; min-height: var(--demo); padding: 8px var(--marge); background: var(--profond); color: var(--creme); font: 400 13px/1.35 var(--f-texte); text-align: center; }
.demo p { margin: 0; }
.demo a { color: var(--ambre); text-decoration: none; font-weight: 600; white-space: nowrap; }
.demo a:hover { text-decoration: underline; }
.hero { height: calc(min(100svh, 56.25vw) - var(--entete) - var(--demo)); }
.demo-bulle { position: fixed; left: 50%; bottom: 24px; z-index: 80; max-width: min(92vw, 520px); padding: 14px 20px; border-radius: 14px; background: var(--noir); color: var(--creme); border: 2px solid var(--ambre); box-shadow: 0 12px 32px rgba(0,0,0,.35); font: 400 15px/1.45 var(--f-texte); text-align: center; visibility: hidden; opacity: .35; transform: translate(-50%, 12px); transition: opacity .3s ease, transform .3s ease, visibility 0s linear .3s; }
.demo-bulle.est-la { visibility: visible; opacity: 1; transform: translate(-50%, 0); transition: opacity .3s ease, transform .3s ease; }
@media (max-width: 1099px), (max-aspect-ratio: 4/3) { .hero { height: auto; } }
@media (max-width: 699px) {
  .demo { font-size: 12px; }
  .demo p span { display: none; }
  .hero { height: calc(100svh - var(--entete) - var(--demo) + 52px); }
  .demo-bulle { bottom: 84px; }
}
@media (min-width: 700px) and (min-aspect-ratio: 1/1) and (max-width: 1099px), (min-width: 700px) and (min-aspect-ratio: 1/1) and (max-aspect-ratio: 4/3) {
  .hero { height: calc(100svh - var(--entete) - var(--demo)); }
}
@media (prefers-reduced-motion: reduce) { .demo-bulle { transition: none; } }
.resa-page__appel { margin-top: 10px; }