/*
Theme Name: Akan
Theme URI: https://www.instagram.com/akanstagram/
Author: Akan — Gaël & Kurumi
Description: Thème bloc sur mesure d'Akan, cuisine japonaise sur les marchés de Bourgogne. Converti depuis la maquette validée : tout le contenu est en blocs natifs, éditable dans Gutenberg.
Version: 1.8.4
Requires at least: 6.6
Requires PHP: 8.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: akan
Tags: block-theme, full-site-editing, one-column
*/

/* =========================================================
   Registre relevé sur la référence : serif classique + script
   pinceau + calligraphie japonaise, fonds charbon / parchemin,
   seul accent : le rouge du sceau.
   Les classes de la maquette sont posées sur les blocs via
   className ; les couches décoratives sont des pseudo-éléments.
   ========================================================= */

:root {
  --charbon: #110d0a;
  --laque: #1d1611;
  --ambre: #c98b3e;
  --parchemin: #e6dbc6;
  --encre: #1c1814;
  --sceau: #b0352a;
  --creme: #efe6d6;
  --creme-doux: rgba(239, 230, 214, .74);
  --encre-douce: rgba(28, 24, 20, .78);

  --serif: "EB Garamond", Garamond, "Times New Roman", serif;
  --pinceau: "Kaushan Script", "Brush Script MT", cursive;
  --kanji: "Yuji Boku", "Yu Mincho", serif;

  --large: 1320px;
  --gouttiere: clamp(20px, 4vw, 56px);
  --marge-large: max(var(--gouttiere), calc((100vw - var(--large)) / 2 + var(--gouttiere)));

  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --grain-leger: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .35  0 0 0 0 .25  0 0 0 0 .15  0 0 0 .16 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --parchemin-fond: var(--grain-leger), radial-gradient(ellipse at 20% 30%, #efe5d2, var(--parchemin) 60%, #d9cbb0);
  --forme-pinceau: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 44' preserveAspectRatio='none'%3E%3Cpath d='M7 9 C4 4 13 2 30 3 L198 2 C213 1 221 4 227 9 L239 19 L227 22 L237 29 C223 40 206 41 190 41 L20 42 C8 43 2 38 3 30 L1 19 C1 14 3 11 7 9 Z'/%3E%3C/svg%3E");

  /* Bords déchirés du parchemin */
  --bord-haut: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 24' preserveAspectRatio='none'%3E%3Cpath d='M0 24 L0 14 L38 11 L71 15 L120 9 L164 13 L211 8 L262 12 L301 7 L355 11 L398 6 L452 10 L497 5 L548 9 L590 4 L641 9 L688 6 L741 11 L786 7 L838 12 L881 8 L934 13 L978 9 L1030 14 L1075 10 L1126 15 L1171 11 L1222 16 L1268 12 L1318 17 L1362 13 L1405 16 L1440 12 L1440 24 Z'/%3E%3C/svg%3E");
  --bord-bas: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 24' preserveAspectRatio='none'%3E%3Cpath d='M0 0 L0 9 L44 13 L92 8 L139 12 L188 7 L236 11 L281 6 L333 10 L379 5 L427 10 L476 6 L524 11 L571 7 L622 12 L668 8 L719 13 L763 9 L814 14 L860 10 L909 15 L957 11 L1004 16 L1052 12 L1101 17 L1147 12 L1196 16 L1243 11 L1291 15 L1338 10 L1390 14 L1440 9 L1440 0 Z'/%3E%3C/svg%3E");
  --bord-v: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 1000' preserveAspectRatio='none'%3E%3Cpath d='M0 0 H12 L16 38 L9 81 L14 126 L8 170 L15 214 L10 259 L17 301 L11 347 L16 390 L9 436 L14 480 L8 523 L15 569 L10 612 L16 657 L9 702 L14 745 L8 790 L15 834 L11 879 L16 921 L10 963 L13 1000 H0 Z'/%3E%3C/svg%3E");

  /* Icônes (substitution n° 1 : masques CSS au lieu de SVG inline) */
  --ico-marche: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40' fill='none' stroke='%23000' stroke-width='1.6'%3E%3Cpath d='M6 15 L9 7 H31 L34 15'/%3E%3Cpath d='M6 15 Q8.5 19 11 15 Q13.5 19 16 15 Q18.5 19 21 15 Q23.5 19 26 15 Q28.5 19 31 15 Q33.5 19 34 15'/%3E%3Cpath d='M8 18 V33 H32 V18 M5 33 H35 M14 33 V25 H26 V33'/%3E%3C/svg%3E");
  --ico-sac: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40' fill='none' stroke='%23000' stroke-width='1.6'%3E%3Cpath d='M9 13 H31 L33 35 H7 Z'/%3E%3Cpath d='M14 16 V10 A6 6 0 0 1 26 10 V16'/%3E%3Cpath d='M16 22 H24 V29 H16 Z' stroke-width='1.3'/%3E%3C/svg%3E");
  --ico-epingle: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40' fill='none' stroke='%23000' stroke-width='1.6'%3E%3Cpath d='M20 36 C 12 26, 8 20, 8 14 A12 12 0 0 1 32 14 C 32 20, 28 26, 20 36 Z'/%3E%3Ccircle cx='20' cy='14' r='4.5'/%3E%3C/svg%3E");
  --ico-compte: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5'%3E%3Ccircle cx='12' cy='8.2' r='4.2'/%3E%3Cpath d='M3.8 21 C4.6 16.2 8 13.8 12 13.8 C16 13.8 19.4 16.2 20.2 21'/%3E%3C/svg%3E");
  --ico-insta: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4.2'/%3E%3Ccircle cx='17.4' cy='6.6' r='1.1' fill='%23000' stroke='none'/%3E%3C/svg%3E");
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; overflow-x: clip; }
body {
  margin: 0;
  background: var(--charbon);
  color: var(--creme);
  font: 400 16px/1.55 var(--serif);
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}
img { display: block; max-width: 100%; height: auto; } /* height:auto obligatoire : sinon l'attribut height des blocs image l'emporte sur aspect-ratio */
a { color: inherit; text-decoration: none; }
h1, h2, h3 { font-weight: 400; margin: 0; hyphens: none; text-wrap: balance; }
p { margin: 0; }

/* Gutenberg : neutralisation à spécificité nulle (le blockGap est déjà à 0 dans theme.json).
   Jamais .wp-block-group > * : ça écraserait toutes les marges des composants. */
:where(.wp-block-group) > :where(*), :where(.wp-block-buttons) { margin-block: 0; }
figure.wp-block-image { margin: 0; }
.wp-block-quote { margin: 0; padding: 0; border: 0; }

/* Texte réservé aux lecteurs d'écran */
.pin-bouton, .nav .nav-insta .wp-block-navigation-item__label, .nav .nav-compte .wp-block-navigation-item__label {
  font-size: 0 !important; color: transparent;
}

/* ---------- éléments partagés ---------- */

.sceau {
  display: inline-grid;
  place-items: center;
  width: 30px; height: 30px;
  background: var(--sceau);
  color: var(--parchemin);
  font: 400 19px/1 var(--kanji);
  border-radius: 3px;
  box-shadow: inset 0 0 0 2px rgba(239,230,214,.25);
}
.sceau.sceau--petit { width: 22px; height: 22px; font-size: 14px; }

/* Boutons : la classe atterrit sur le conteneur div.wp-block-button, on le neutralise
   et on style le lien. */
.wp-block-button.bouton-pinceau,
.wp-block-button.bouton-trait { display: inline-block; background: none; border: 0; padding: 0; border-radius: 0; }

.bouton-pinceau .wp-block-button__link {
  position: relative;
  display: inline-flex; align-items: center; gap: 12px;
  padding: 15px 44px 15px 26px;
  color: var(--encre);
  background: none;
  border-radius: 0;
  font: 500 13px/1 var(--serif);
  letter-spacing: .2em;
  text-transform: uppercase;
  isolation: isolate;
  transition: transform .25s ease;
}
.bouton-pinceau .wp-block-button__link::before {
  content: "";
  position: absolute; inset: 0;
  z-index: -1;
  background: var(--creme);
  -webkit-mask: var(--forme-pinceau) center / 100% 100% no-repeat;
          mask: var(--forme-pinceau) center / 100% 100% no-repeat;
}
.bouton-pinceau .wp-block-button__link::after,
.bouton-trait .wp-block-button__link::after { content: "→"; letter-spacing: 0; }
.bouton-pinceau .wp-block-button__link:hover { transform: translateX(4px); }
.bouton-pinceau.bouton-pinceau--encre .wp-block-button__link { color: var(--creme); }
.bouton-pinceau.bouton-pinceau--encre .wp-block-button__link::before { background: var(--encre); }

.bouton-trait .wp-block-button__link {
  display: inline-flex; align-items: center; gap: 12px;
  padding: 13px 22px;
  background: none;
  color: inherit;
  border: 1px solid rgba(239,230,214,.7);
  border-radius: 0;
  font: 500 13px/1 var(--serif);
  letter-spacing: .2em;
  text-transform: uppercase;
  transition: background .25s, color .25s;
}
.bouton-trait .wp-block-button__link:hover { background: var(--creme); color: var(--encre); }

/* Bords déchirés (pseudo-éléments, substitution n° 5) */
.dechire { position: relative; }
.dechire::before, .dechire::after {
  content: ""; position: absolute; left: 0; z-index: 2;
  width: 100%; height: 22px;
  background: var(--parchemin);
  -webkit-mask: var(--bord-haut) 0 0 / 100% 100% no-repeat;
          mask: var(--bord-haut) 0 0 / 100% 100% no-repeat;
}
.dechire::before { top: -21px; }
.dechire::after { bottom: -21px; -webkit-mask-image: var(--bord-bas); mask-image: var(--bord-bas); }

.bord-v::before {
  content: ""; position: absolute; z-index: 2; left: -1px; top: 0;
  width: 18px; height: 100%;
  background: var(--parchemin);
  -webkit-mask: var(--bord-v) 0 0 / 100% 100% no-repeat;
          mask: var(--bord-v) 0 0 / 100% 100% no-repeat;
}

/* ---------- logo ---------- */

.wp-block-site-logo.logo { width: 168px; }
.wp-block-site-logo.logo img { width: 100%; height: auto; filter: drop-shadow(0 2px 14px rgba(0,0,0,.45)); }
.wp-block-site-logo.logo.logo--petit { width: 84px; }

/* ---------- en-tête ---------- */

.entete {
  position: absolute; inset: 0 0 auto 0;
  z-index: 20;
  display: flex; align-items: flex-start; justify-content: space-between;
  max-width: var(--large); margin: 0 auto;
  padding: 26px var(--gouttiere) 0;
}
.wp-block-navigation.nav { padding-top: 22px; }
.wp-block-navigation.nav .wp-block-navigation__container { gap: clamp(18px, 2.2vw, 34px); align-items: center; }
.wp-block-navigation.nav .wp-block-navigation-item__content {
  position: relative;
  font: 500 12px/1 var(--serif);
  letter-spacing: .18em;
  text-transform: uppercase;
  padding: 0 0 10px;
  color: var(--creme);
}
.wp-block-navigation.nav .wp-block-navigation-item__content::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px;
  background: currentColor; transform: scaleX(0); transition: transform .3s;
}
.wp-block-navigation.nav .wp-block-navigation-item__content:hover::after,
.wp-block-navigation.nav .wp-block-navigation-item__content[aria-current="page"]::after,
.wp-block-navigation.nav .current-menu-item > .wp-block-navigation-item__content::after { transform: scaleX(1); }
/* « Menu de la semaine » ressort dans le menu : ambre + losange rouge */
.wp-block-navigation.nav .nav-semaine .wp-block-navigation-item__content { color: #f0c27a; }
.wp-block-navigation.nav .nav-semaine .wp-block-navigation-item__content::before {
  content: ""; display: inline-block; width: 6px; height: 6px; margin-right: 9px; vertical-align: 2px;
  background: var(--sceau); transform: rotate(45deg);
}
.wp-block-navigation.nav :is(.nav-insta, .nav-compte) .wp-block-navigation-item__content { padding-bottom: 6px; }
.wp-block-navigation.nav :is(.nav-insta, .nav-compte) .wp-block-navigation-item__content::after { display: none; }
.wp-block-navigation.nav :is(.nav-insta, .nav-compte) .wp-block-navigation-item__content::before {
  content: ""; display: block; width: 21px; height: 21px; background: currentColor;
  -webkit-mask: var(--ico-insta) center / contain no-repeat;
          mask: var(--ico-insta) center / contain no-repeat;
}
/* Espace membre : pictogramme dans l'en-tête (libellé « Connexion » / « Mon compte » lu par les lecteurs d'écran) */
.wp-block-navigation.nav .nav-compte .wp-block-navigation-item__content::before { -webkit-mask-image: var(--ico-compte); mask-image: var(--ico-compte); }
.wp-block-navigation.nav .nav-compte .wp-block-navigation-item__content:hover { color: #f0c27a; }
.wp-block-navigation.nav .wp-block-navigation__responsive-container-open,
.wp-block-navigation.nav .wp-block-navigation__responsive-container-close { color: var(--creme); }
.wp-block-navigation.nav .wp-block-navigation__responsive-container-open svg { width: 30px; height: 30px; }
/* Le panneau mobile s'ouvre blanc sur blanc sans ceci (le CSS du bloc est imprimé après cette feuille) */
.wp-block-navigation.nav .wp-block-navigation__responsive-container.is-menu-open {
  background-color: rgba(17, 13, 10, .97) !important;
  color: var(--creme) !important;
  padding: 90px 32px 40px;
}
.wp-block-navigation.nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap: 30px; }
.wp-block-navigation.nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-size: 15px; }

/* ---------- héros ---------- */

.heros {
  position: relative;
  min-height: clamp(640px, 92vh, 860px);
  display: flex; align-items: center;
  overflow: visible;
}
.heros::before {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background:
    linear-gradient(90deg, rgba(17,13,10,.9) 0%, rgba(17,13,10,.55) 42%, rgba(17,13,10,.05) 75%),
    linear-gradient(0deg, rgba(17,13,10,1) 0%, rgba(17,13,10,0) 30%),
    linear-gradient(180deg, rgba(17,13,10,.7) 0%, rgba(17,13,10,0) 25%);
}
.wp-block-image.heros-fond { position: absolute; inset: 0; z-index: 0; }
.wp-block-image.heros-fond img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: 50% 40%;
  filter: sepia(.45) saturate(1.25) brightness(.8) contrast(1.05);
}
.heros-texte {
  position: relative; z-index: 3;
  width: 100%; max-width: var(--large); margin: 0 auto;
  padding: 150px var(--gouttiere) 60px;
}
.heros h1 {
  max-width: 15.5em;
  font: italic 400 clamp(30px, 3.3vw, 46px)/1.22 var(--serif);
  text-shadow: 0 2px 24px rgba(0,0,0,.5);
}
.heros h1::after, .bandeau h1::after { content: ""; display: block; width: 42px; height: 1px; margin: 26px 0 22px; background: var(--creme-doux); text-shadow: none; }
.heros-mots { font-size: 18px; color: var(--creme); margin-bottom: 36px; }

/* Annonce « Cette semaine au marché » : l'affiche du menu de la semaine, dès l'arrivée sur le site */
.annonce-semaine {
  display: grid; grid-template-columns: 150px 1fr; align-items: center; column-gap: 20px;
  max-width: 560px;
  padding: 18px 30px 22px 14px;
  background: var(--parchemin-fond);
  color: var(--encre);
  border-left: 4px solid var(--sceau);
  box-shadow: 0 26px 60px rgba(0,0,0,.55);
}
.wp-block-image.annonce-illustration img {
  width: 100%; mix-blend-mode: multiply;
  -webkit-mask: radial-gradient(closest-side, #000 72%, transparent 100%);
          mask: radial-gradient(closest-side, #000 72%, transparent 100%);
}
/* Variante photo (plat de la semaine photographié plutôt qu'illustré) */
.wp-block-image.annonce-photo img {
  width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 50%;
  box-shadow: 0 10px 24px rgba(28,24,20,.35);
}
.annonce-surtitre { font: 500 11.5px/1 var(--serif); letter-spacing: .22em; text-transform: uppercase; color: var(--sceau); }
.annonce-plat { margin: 8px 0 4px; font: 400 48px/1 var(--pinceau); }
.annonce-prix { margin-bottom: 16px; font: italic 16.5px/1.35 var(--serif); color: var(--encre-douce); }
.annonce-aussi { margin: -8px 0 16px; font: 500 11.5px/1.5 var(--serif); letter-spacing: .14em; text-transform: uppercase; color: var(--encre-douce); }
.annonce-semaine .bouton-pinceau .wp-block-button__link { padding: 13px 40px 13px 22px; font-size: 12px; }
.heros-mots em { font-style: normal; padding: 0 .6em; opacity: .7; }

/* Le plat n'est pas découpé : il est fondu dans l'ombre du héros, même étalonnage que le fond. */
.wp-block-image.heros-bol {
  position: absolute; z-index: 2;
  right: 0; top: 0; bottom: -150px;
  width: 56vw;
  pointer-events: none;
}
.wp-block-image.heros-bol img {
  width: 100%; height: 100%; object-fit: cover; object-position: 50% 60%;
  filter: sepia(.3) saturate(1.15) brightness(.8) contrast(1.08);
  -webkit-mask: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.55) 22%, #000 45%), linear-gradient(180deg, transparent 0%, #000 18%, #000 72%, transparent 100%);
  -webkit-mask-composite: source-in;
          mask: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.55) 22%, #000 45%), linear-gradient(180deg, transparent 0%, #000 18%, #000 72%, transparent 100%);
          mask-composite: intersect;
}

/* ---------- menus de la semaine ---------- */

.menus {
  position: relative;
  display: grid;
  grid-template-columns: 90px minmax(260px, 1fr) minmax(0, 1.65fr);
  gap: clamp(24px, 4vw, 64px);
  align-items: center;
  max-width: var(--large); margin: 0 auto;
  padding: 150px var(--gouttiere) 110px;
}
.menus-kanji { display: flex; flex-direction: column; align-items: center; gap: 22px; align-self: stretch; justify-content: center; }
.menus-kanji-texte {
  writing-mode: vertical-rl;
  font: 400 44px/1.05 var(--kanji);
  color: rgba(239,230,214,.55);
  letter-spacing: .04em;
}
.menus-intro h2 { font-size: clamp(32px, 3vw, 42px); line-height: 1.1; margin-bottom: 22px; }
.menus-intro p { color: var(--creme-doux); font-size: 17px; max-width: 22em; margin-bottom: 26px; }
.wp-block-list.carte-plats {
  list-style: none; margin: 0 0 10px; padding: 18px 0 0;
  border-top: 1px solid rgba(239,230,214,.18);
  display: flex; flex-wrap: wrap; gap: 6px 0;
  max-width: 24em;
}
.carte-plats li { font: 500 12px/1.6 var(--serif); letter-spacing: .16em; text-transform: uppercase; color: var(--creme); }
.carte-plats li:not(:last-child)::after { content: "·"; padding: 0 .7em; opacity: .5; }
.menus-intro .carte-plats-note { font: italic 15px var(--serif); margin-bottom: 34px; }

.plats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.plat {
  position: relative;
  background: #0b0907;
  padding-bottom: 26px;
  text-align: center;
  overflow: hidden;
}
.plat .wp-block-image img {
  width: 100%; aspect-ratio: 4 / 4.2; object-fit: cover;
  -webkit-mask: linear-gradient(180deg, #000 62%, transparent 100%);
          mask: linear-gradient(180deg, #000 62%, transparent 100%);
  transition: transform .6s ease;
}
.plat:hover .wp-block-image img { transform: scale(1.04); }
.plat h3 { margin-top: -34px; position: relative; font: 400 clamp(25px, 2.2vw, 31px)/1.1 var(--pinceau); }
.plat p { margin-top: 10px; font-size: 15px; line-height: 1.3; color: var(--creme-doux); }

/* ---------- où nous trouver ---------- */

.trouver {
  position: relative;
  display: grid;
  grid-template-columns: minmax(300px, 1fr) minmax(0, 1.2fr);
  background: var(--parchemin-fond);
  color: var(--encre);
}
.trouver-texte { padding: 70px clamp(24px, 3.5vw, 56px) 70px var(--marge-large); }
.trouver h2 { font-size: clamp(32px, 3vw, 42px); line-height: 1.1; margin-bottom: 18px; }
.chapo { font-size: 17px; color: var(--encre-douce); max-width: 23em; margin-bottom: 34px; }
.infos { margin: 0 0 38px; display: grid; gap: 22px; }
.info { display: grid; grid-template-columns: 40px 1fr; column-gap: 16px; align-items: start; }
.info::before {
  content: ""; grid-row: 1 / 3; width: 38px; height: 38px; background: var(--encre);
  -webkit-mask: var(--ico-marche) center / contain no-repeat;
          mask: var(--ico-marche) center / contain no-repeat;
}
.info--sac::before { -webkit-mask-image: var(--ico-sac); mask-image: var(--ico-sac); }
.info--epingle::before { -webkit-mask-image: var(--ico-epingle); mask-image: var(--ico-epingle); }
.info-titre { font-weight: 500; font-size: 18px; line-height: 1.2; }
.info-texte { font-size: 15px; color: var(--encre-douce); line-height: 1.35; margin-top: 2px; }

.carte {
  position: relative;
  display: grid;
  grid-template-columns: minmax(190px, 1fr) minmax(150px, auto);
  align-items: center;
  column-gap: clamp(28px, 4vw, 56px);
  padding: 60px var(--marge-large) 60px clamp(36px, 4vw, 64px);
  background: var(--grain), #15110d;
  background-blend-mode: soft-light;
  color: var(--creme);
}

/* La carte : fond SVG (assets/img/carte-fond.svg, dessiné par akan/scripts/carte-site.ps1 à partir
   des coordonnées réelles), épingles en groupes positionnés par classe, nom de la ville à côté. */
/* Les noms et les épingles suivent la largeur de la carte (unités cqi), et le téléphone ne doit pas
   grossir le texte de lui-même (text-size-adjust) : sinon les noms se chevauchent. */
.carte-plan {
  position: relative; width: 100%; max-width: 480px; aspect-ratio: 400 / 560; justify-self: center;
  background: url("assets/img/carte-fond.svg") center / 100% 100% no-repeat;
  container-type: inline-size; -webkit-text-size-adjust: 100%; text-size-adjust: 100%;
  --t: clamp(13px, 5cqi, 24px);
}
.pin { position: absolute; left: var(--x); top: var(--y); z-index: 2; }
/* Positions : sortie de carte-site.ps1 */
.pin--chassagne  { --x: 38.8%; --y: 16.7%; }
.pin--chaudenay  { --x: 49.5%; --y: 20.8%; }
.pin--givry      { --x: 41.1%; --y: 45.1%; }
.pin--chalon     { --x: 60%;   --y: 45.3%; }
.pin--moroges    { --x: 29.2%; --y: 50.4%; }
.pin--buxy       { --x: 33.1%; --y: 57.2%; }
.pin--stgengoux  { --x: 27.6%; --y: 75.1%; }
.pin--tournus    { --x: 69.3%; --y: 84.3%; }
.pin.ouvert { z-index: 5; }

/* Nom de la ville : à droite de l'épingle, à gauche (pin--nom-gauche), au-dessus (pin--nom-dessus)
   ou dessous (labo), sur une étiquette sombre pour rester lisible par-dessus le relief */
.pin-nom {
  position: absolute; left: calc(var(--t) * .62); top: calc(var(--t) * -.66); transform: translateY(-50%);
  width: max-content; padding: .18em .42em .24em; border-radius: 3px;
  background: rgba(21, 17, 13, .85); box-shadow: 0 0 0 1px rgba(201, 139, 62, .18);
  font: 500 clamp(9px, 3.4cqi, 16px)/1.1 var(--serif); letter-spacing: .02em; color: var(--creme);
  pointer-events: none; transition: color .2s, box-shadow .2s;
}
.pin--nom-gauche .pin-nom { left: auto; right: calc(var(--t) * .62); text-align: right; }
.pin--nom-dessus .pin-nom { left: 0; top: calc(var(--t) * -1.12); transform: translate(-50%, -100%); }
.pin--labo .pin-nom { left: 0; top: calc(var(--t) * .4); transform: translateX(-50%); text-align: center; color: #e0a85e; font-size: clamp(8.5px, 3.1cqi, 15px); letter-spacing: .06em; }
.pin:hover .pin-nom, .pin.ouvert .pin-nom { box-shadow: 0 0 0 1px rgba(239, 230, 214, .5); }

/* Marché du jour (classes jour-0…jour-6 posées sur l'épingle, lues par app.js) */
.pin.aujourdhui { z-index: 4; }
.pin.aujourdhui .pin-bouton::before { background: var(--sceau); }
.pin.aujourdhui .pin-bouton::after { background: var(--creme); }
.pin.aujourdhui .pin-nom { color: #f5a08f; box-shadow: 0 0 0 1px rgba(176, 53, 42, .8); }
.pin.aujourdhui::before {
  content: ""; position: absolute; left: -11px; top: -11px; width: 22px; height: 22px; border-radius: 50%;
  border: 1.5px solid var(--sceau); animation: onde-pin 2.4s ease-out infinite; pointer-events: none;
}
@keyframes onde-pin { from { transform: scale(.4); opacity: .9; } to { transform: scale(2.2); opacity: 0; } }

/* Les épingles tombent quand la carte arrive à l'écran (classes posées par app.js) */
.carte-plan.anime .pin-bouton { opacity: 0; transform: translate(-50%, -260%); }
.carte-plan.anime .pin-nom { opacity: 0; }
.carte-plan.anime.vue .pin-bouton {
  opacity: 1; transform: translate(-50%, -100%);
  transition: transform .5s cubic-bezier(.3, 1.5, .5, 1) var(--delai, 0s), opacity .2s var(--delai, 0s);
}
.carte-plan.anime.vue .pin-nom { opacity: 1; transition: opacity .6s calc(var(--delai, 0s) + .3s), color .2s; }
.pin:nth-child(2) { --delai: .08s; } .pin:nth-child(3) { --delai: .16s; } .pin:nth-child(4) { --delai: .24s; }
.pin:nth-child(5) { --delai: .32s; } .pin:nth-child(6) { --delai: .4s; }  .pin:nth-child(7) { --delai: .48s; }
.pin:nth-child(8) { --delai: .56s; }
@media (prefers-reduced-motion: reduce) { .pin.aujourdhui::before { animation: none; display: none; } }
/* Accueil : sous 1300 px, la carte passe au-dessus de « Notre semaine » (les noms ont besoin de place) */
@media (max-width: 1300px) {
  .carte { grid-template-columns: 1fr; }
  .carte .carte-plan { max-width: 480px; margin-bottom: 40px; }
}
.pin-bouton {
  position: absolute; left: 0; top: 0;
  width: var(--t); height: var(--t);
  transform: translate(-50%, -100%);
  cursor: pointer;
}
.pin-bouton::before {
  content: ""; position: absolute; inset: 1px 2px 3px;
  background: var(--creme-doux);
  border-radius: 50% 50% 50% 0;
  transform: rotate(-45deg);
  box-shadow: 0 3px 8px rgba(0,0,0,.5);
  transition: background .2s, transform .2s;
}
.pin-bouton::after { content: ""; position: absolute; left: 50%; top: 33%; width: 25%; height: 25%; margin-left: -12.5%; border-radius: 50%; background: #15110d; }
.pin-bouton:hover::before, .pin.ouvert .pin-bouton::before { background: var(--creme); transform: rotate(-45deg) scale(1.2); }
.pin--labo .pin-bouton { width: calc(var(--t) * 1.25); height: calc(var(--t) * 1.25); }
/* Le labo en ambre : le rouge est réservé au marché du jour */
.pin--labo .pin-bouton::before { background: var(--ambre); }
.pin--labo .pin-bouton::after { background: #15110d; }
.pin--labo .pin-bouton:hover::before, .pin--labo.ouvert .pin-bouton::before { background: #e0a85e; }

.bulle {
  position: absolute; left: 0; bottom: 30px;
  transform: translate(-50%, 6px);
  width: max-content; max-width: 210px;
  padding: 12px 16px 13px;
  background: var(--parchemin);
  color: var(--encre);
  box-shadow: 0 14px 30px rgba(0,0,0,.55);
  opacity: 0; visibility: hidden; transition: opacity .2s, transform .2s, visibility .2s;
}
.bulle::after { content: ""; position: absolute; left: 50%; bottom: -6px; margin-left: -6px; border: 6px solid transparent; border-bottom: 0; border-top-color: var(--parchemin); }
.pin--gauche .bulle { transform: translate(-22px, 6px); }
.pin--gauche .bulle::after { left: 22px; }
.pin--droite .bulle { transform: translate(calc(-100% + 22px), 6px); }
.pin--droite .bulle::after { left: auto; right: 16px; }
.pin.ouvert .bulle { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.pin--gauche.ouvert .bulle { transform: translate(-22px, 0); }
.pin--droite.ouvert .bulle { transform: translate(calc(-100% + 22px), 0); }
.bulle-ville { font: 500 16px/1.2 var(--serif); margin-bottom: 4px; }
.bulle-jours { font: 500 11.5px/1.6 var(--serif); letter-spacing: .16em; text-transform: uppercase; color: var(--sceau); }

.semaine-titre { font: 400 22px/1 var(--pinceau); margin-bottom: 16px; }
.sj-jour { font: 500 11px/1 var(--serif); letter-spacing: .2em; text-transform: uppercase; color: var(--ambre); margin-top: 12px; }
.semaine-titre + .sj-jour { margin-top: 0; }
.sj-marche { margin-top: 4px; font-size: 14.5px; line-height: 1.25; color: var(--creme); cursor: pointer; }
.sj-marche:hover, .sj-marche.actif { color: #fff; text-decoration: underline; text-decoration-color: var(--sceau); text-underline-offset: 3px; }
.sj-marche em { font-size: 12.5px; color: var(--creme-doux); }
.villes-note { font-size: 13px; line-height: 1.5; color: var(--creme-doux); }
.villes-note::before { content: ""; display: block; width: 30px; height: 1px; background: var(--creme-doux); margin: 18px 0 12px; }

/* ---------- qui sommes-nous ---------- */

.nous {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.25fr) minmax(0, .85fr);
  align-items: center;
  background: var(--grain), var(--laque);
  background-blend-mode: soft-light;
  min-height: 440px;
}
.wp-block-image.nous-photo { align-self: stretch; }
.wp-block-image.nous-photo img { width: 100%; height: 100%; object-fit: cover; filter: sepia(.3) brightness(.85); }
.nous-texte { padding: 80px clamp(28px, 4vw, 64px); }
.nous h2 { font-size: clamp(32px, 3vw, 42px); line-height: 1.1; margin-bottom: 22px; }
.nous-texte p { font-size: 17px; color: var(--creme-doux); max-width: 30em; margin-bottom: 36px; }
.nous-deco { position: relative; align-self: stretch; overflow: hidden; }
.wp-block-image.nous-deco-img { position: absolute; inset: 0; }
.wp-block-image.nous-deco-img img {
  width: 100%; height: 100%; object-fit: cover; object-position: 30% 50%;
  mix-blend-mode: lighten; opacity: .55;
  -webkit-mask: linear-gradient(90deg, transparent, #000 45%);
          mask: linear-gradient(90deg, transparent, #000 45%);
}
.nous-kanji {
  position: absolute; right: var(--marge-large); top: 50%;
  transform: translateY(-50%);
  display: flex; flex-direction: row-reverse; gap: 10px;
  font: 400 38px/1.1 var(--kanji);
  color: rgba(239,230,214,.7);
}
.nous-kanji p { writing-mode: vertical-rl; }
.nous-kanji p:last-child { padding-top: 1.6em; }
.nous-deco .sceau { position: absolute; right: calc(var(--marge-large) + 100px); bottom: 64px; }

/* ---------- pied de page ---------- */

.pied {
  display: flex; align-items: center; gap: clamp(20px, 4vw, 60px);
  max-width: var(--large); margin: 0 auto;
  padding: 34px var(--gouttiere);
  border-top: 1px solid rgba(239,230,214,.12);
}
.wp-block-navigation.pied-nav { margin-left: auto; }
.wp-block-navigation.pied-nav .wp-block-navigation__container { gap: clamp(16px, 2.6vw, 34px); }
.wp-block-navigation.pied-nav .wp-block-navigation-item__content { font: 500 11.5px/1 var(--serif); letter-spacing: .18em; text-transform: uppercase; color: var(--creme-doux); }
.wp-block-navigation.pied-nav .wp-block-navigation-item__content:hover { color: var(--creme); }
.pied-insta { font-size: 14px; color: var(--creme-doux); padding-right: clamp(20px, 3vw, 44px); border-right: 1px solid rgba(239,230,214,.2); }
.pied-insta a { display: flex; align-items: center; gap: 10px; }
.pied-insta a::before, .contact-insta a::before {
  content: ""; flex: none; width: 22px; height: 22px; background: var(--creme);
  -webkit-mask: var(--ico-insta) center / contain no-repeat;
          mask: var(--ico-insta) center / contain no-repeat;
}
.pied-salut { display: flex; align-items: center; gap: 14px; }
.pied-salut-texte { font: 400 24px/1 var(--pinceau); }

/* =========================================================
   Pages intérieures — mêmes composants que l'accueil
   ========================================================= */

/* ---------- bandeau ---------- */

.bandeau {
  position: relative;
  min-height: 640px;
  display: flex; align-items: flex-end;
  overflow: hidden;
}
.bandeau.bandeau--court { min-height: 580px; }
.bandeau::before {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background:
    linear-gradient(90deg, rgba(17,13,10,.9) 0%, rgba(17,13,10,.55) 42%, rgba(17,13,10,.05) 75%),
    linear-gradient(0deg, rgba(17,13,10,1) 0%, rgba(17,13,10,0) 30%),
    linear-gradient(180deg, rgba(17,13,10,.7) 0%, rgba(17,13,10,0) 25%);
}
.wp-block-image.bandeau-fond { position: absolute; inset: 0; z-index: 0; }
.wp-block-image.bandeau-fond img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: 50% 45%;
  filter: sepia(.45) saturate(1.2) brightness(.7) contrast(1.05);
}
.bandeau-texte {
  position: relative; z-index: 2;
  width: 100%; max-width: var(--large); margin: 0 auto;
  padding: 230px var(--gouttiere) 90px;
}
.surtitre { font: 500 12.5px/1 var(--serif); letter-spacing: .24em; text-transform: uppercase; color: var(--ambre); margin-bottom: 20px; }
.bandeau h1 { font: 400 clamp(44px, 5.4vw, 74px)/1.02 var(--serif); text-shadow: 0 2px 24px rgba(0,0,0,.5); }
.bandeau h1::after { margin: 28px 0 20px; }
.bandeau-chapo { max-width: 30em; font: italic 400 clamp(19px, 1.7vw, 23px)/1.4 var(--serif); color: var(--creme); }
.bandeau-kanji {
  position: absolute; z-index: 2;
  right: var(--marge-large); bottom: 70px;
  writing-mode: vertical-rl;
  font: 400 clamp(56px, 6vw, 92px)/1 var(--kanji);
  color: rgba(239,230,214,.82);
  text-shadow: 0 4px 30px rgba(0,0,0,.6);
}

/* ---------- où & quand : la semaine ---------- */

.calendrier {
  position: relative;
  background: var(--parchemin-fond);
  color: var(--encre);
  padding: 90px var(--gouttiere) 80px;
}
.calendrier > * { max-width: var(--large); margin-left: auto; margin-right: auto; }
.calendrier-tete { display: grid; grid-template-columns: auto 1fr; gap: 20px 60px; align-items: end; margin-bottom: 54px; }
.calendrier h2 { font-size: clamp(34px, 3.4vw, 48px); line-height: 1.05; }
.calendrier .chapo { margin: 0; max-width: 30em; }
.jours { display: grid; grid-template-columns: repeat(7, 1fr); border-left: 1px solid rgba(28,24,20,.2); }
.jour { padding: 6px 18px 26px; border-right: 1px solid rgba(28,24,20,.2); min-height: 230px; }
.jour-kanji { font: 400 46px/1 var(--kanji); color: var(--encre); margin-bottom: 18px; }
.jour h3 { font: 500 12px/1 var(--serif); letter-spacing: .22em; text-transform: uppercase; color: var(--encre-douce); margin-bottom: 18px; padding-bottom: 14px; border-bottom: 1px solid rgba(28,24,20,.2); }
.marche { margin-bottom: 16px; font: italic 15px/1.4 var(--serif); color: var(--encre-douce); }
.marche strong { display: block; font: normal 500 17px/1.2 var(--serif); color: var(--encre); hyphens: auto; }
.jour--repos { opacity: .5; }
.jour-vide { font: italic 15px var(--serif); color: var(--encre-douce); }
.jour.jour--labo { background: var(--encre); color: var(--creme); border-color: var(--encre); }
.jour--labo .jour-kanji { color: var(--sceau); }
.jour--labo h3 { color: var(--creme-doux); border-color: rgba(239,230,214,.25); }
.jour--labo .marche { color: var(--creme-doux); }
.jour--labo .marche strong { color: var(--creme); }
.calendrier-mois { display: flex; align-items: center; gap: 14px; margin-top: 34px; font-size: 17px; color: var(--encre-douce); }
.calendrier-mois strong { font-weight: 500; color: var(--encre); }

/* ---------- où & quand : la carte ---------- */

.plan-marches {
  display: grid; grid-template-columns: 1fr 1fr; gap: 40px clamp(40px, 6vw, 110px); align-items: center;
  max-width: var(--large); margin: 0 auto;
  padding: 110px var(--gouttiere) 100px;
}
.plan-marches-carte { display: grid; place-items: center; }
.plan-marches-carte .carte-plan { max-width: 540px; }
.plan-marches h2 { font-size: clamp(32px, 3vw, 42px); line-height: 1.1; margin-bottom: 10px; }
.plan-aide { font: italic 16px var(--serif); color: var(--creme-doux); margin-bottom: 44px; }

/* ---------- où & quand : questions fréquentes (blocs Détails, lus aussi par Google) ---------- */
.faq { max-width: 860px; margin: 0 auto; padding: 20px var(--gouttiere) 110px; }
.faq h2 { font-size: clamp(30px, 2.8vw, 40px); line-height: 1.1; margin-bottom: 28px; }
.faq-item { border-top: 1px solid rgba(239,230,214,.15); }
.faq-item:last-child { border-bottom: 1px solid rgba(239,230,214,.15); }
.faq-item summary {
  display: flex; justify-content: space-between; align-items: baseline; gap: 20px;
  padding: 20px 0; cursor: pointer; list-style: none;
  font: 500 19px/1.3 var(--serif); color: var(--creme);
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: "+"; flex: none; font: 400 26px/1 var(--serif); color: var(--sceau); transition: transform .2s; }
.faq-item[open] summary::after { transform: rotate(45deg); }
.faq-item summary:hover { color: #fff; }
.faq-item > :not(summary) { padding: 0 40px 22px 0; color: var(--creme-doux); font-size: 16.5px; line-height: 1.6; }
.faq-item a { color: var(--creme); text-decoration: underline; text-decoration-color: var(--sceau); text-underline-offset: 3px; }
.bloc-labo { display: grid; grid-template-columns: auto 1fr; gap: 18px; align-items: start; padding: 26px 0; border-top: 1px solid rgba(239,230,214,.15); }
.bloc-labo .sceau { width: 38px; height: 38px; font-size: 24px; }
.bloc-labo h3, .bloc-info h3 { font: 400 26px/1.1 var(--pinceau); margin-bottom: 8px; }
.bloc-labo p:not(.sceau), .bloc-info p { color: var(--creme-doux); font-size: 17px; max-width: 28em; }
.bloc-info { padding: 26px 0 0; border-top: 1px solid rgba(239,230,214,.15); }
.bloc-info p { margin-bottom: 26px; }

/* ---------- notre histoire ---------- */

.recit {
  display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.4fr); gap: clamp(40px, 7vw, 120px);
  max-width: var(--large); margin: 0 auto;
  padding: 120px var(--gouttiere) 130px;
}
.wp-block-quote.recit-citation { margin: 0; align-self: start; position: sticky; top: 60px; }
.recit-citation p { font: italic 400 clamp(28px, 2.8vw, 40px)/1.25 var(--serif); }
.recit-citation::before { content: "「"; display: block; font: 400 64px/1 var(--kanji); color: var(--sceau); margin-bottom: 8px; }
.chapitres { display: grid; gap: 64px; }
.chapitre { display: grid; grid-template-columns: 70px 1fr; column-gap: 26px; }
.chapitre-num { grid-row: 1 / 3; font: 400 52px/1 var(--kanji); color: rgba(239,230,214,.55); text-align: center; padding-top: 4px; }
.chapitre h2 { font-size: clamp(28px, 2.4vw, 34px); line-height: 1.15; margin-bottom: 14px; }
.chapitre p:not(.chapitre-num) { font-size: 18px; color: var(--creme-doux); max-width: 34em; }

.principes {
  position: relative;
  background: var(--parchemin-fond);
  color: var(--encre);
  padding: 100px var(--gouttiere) 110px;
}
.principes > h2 { max-width: var(--large); margin: 0 auto 56px; font-size: clamp(34px, 3.4vw, 48px); }
.principes-grille { max-width: var(--large); margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); border-left: 1px solid rgba(28,24,20,.2); }
.principe { padding: 0 clamp(20px, 3vw, 44px) 10px; border-right: 1px solid rgba(28,24,20,.2); }
.principe-kanji { font: 400 84px/1 var(--kanji); margin-bottom: 26px; }
.principe h3 { font-size: 23px; font-weight: 500; margin-bottom: 10px; }
.principe p:not(.principe-kanji) { font-size: 17px; color: var(--encre-douce); }

.carte-complete { max-width: var(--large); margin: 0 auto; padding: 120px var(--gouttiere) 110px; }
.carte-complete-tete { display: grid; grid-template-columns: 90px 1fr; gap: clamp(24px, 4vw, 64px); align-items: center; margin-bottom: 56px; }
.carte-complete h2 { font-size: clamp(32px, 3vw, 42px); line-height: 1.1; margin-bottom: 14px; }
.carte-complete-tete p:not(.sceau):not(.menus-kanji-texte) { color: var(--creme-doux); font-size: 17px; max-width: 30em; }
.plats.plats--neuf { gap: 18px; }
.plats--neuf .plat .wp-block-image img { aspect-ratio: 5 / 4; }
.plats--neuf .plat p:not(.plat-jp) { padding: 0 22px; }
.plat .plat-jp { position: relative; margin-top: -42px; font: 400 15px/1 var(--kanji); color: var(--ambre); letter-spacing: .1em; }
.plats--neuf .plat h3 { margin-top: 8px; }

.rdv {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 24px 46px;
  padding: 90px var(--gouttiere);
  border-top: 1px solid rgba(239,230,214,.12);
}
.rdv-pinceau { font: 400 clamp(32px, 3.4vw, 46px)/1.1 var(--pinceau); }
.rdv.rdv--court { padding: 70px var(--gouttiere); border-top: 0; }
/* Boutons côte à côte (ex. « Voir où & quand » / « Ce que nous faisons ») : un peu d'air entre eux. */
.wp-block-buttons.is-layout-flex { gap: 16px 24px; }

/* ---------- contact ---------- */

.contact {
  position: relative;
  display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
  background: var(--parchemin-fond);
  color: var(--encre);
}
.formulaire {
  padding: 90px clamp(28px, 5vw, 90px) 90px var(--marge-large);
}
.formulaire h2 { font-size: clamp(32px, 3vw, 42px); line-height: 1.1; margin-bottom: 30px; }
/* Contact Form 7 : les champs passent en block, sinon l'enrobage garde l'espace sous la ligne de base */
.formulaire .wpcf7-form { display: grid; gap: 22px; }
.formulaire .wpcf7-form > p { margin: 0; }
.formulaire label { display: grid; gap: 8px; font: 500 12px/1 var(--serif); letter-spacing: .2em; text-transform: uppercase; color: var(--encre-douce); }
.formulaire .wpcf7-form-control-wrap { display: block; }
.formulaire input:not([type="submit"]), .formulaire textarea {
  display: block; width: 100%;
  font: 400 18px/1.4 var(--serif); color: var(--encre); letter-spacing: 0; text-transform: none;
  background: rgba(255,255,255,.35);
  border: 0; border-bottom: 1px solid rgba(28,24,20,.45);
  padding: 12px 14px; border-radius: 0; resize: vertical;
}
.formulaire input:focus, .formulaire textarea:focus { outline: none; background: rgba(255,255,255,.6); border-bottom-color: var(--encre); }
.formulaire input[type="submit"] {
  justify-self: start; margin-top: 8px; cursor: pointer;
  padding: 15px 44px 15px 26px;
  border: 0; border-radius: 0;
  background: var(--encre); color: var(--creme);
  font: 500 13px/1 var(--serif); letter-spacing: .2em; text-transform: uppercase;
  -webkit-mask: var(--forme-pinceau) center / 100% 100% no-repeat;
          mask: var(--forme-pinceau) center / 100% 100% no-repeat;
}
.formulaire .wpcf7-spinner { display: none; }
.formulaire .wpcf7-not-valid-tip { margin-top: 6px; font: italic 14px var(--serif); color: var(--sceau); letter-spacing: 0; text-transform: none; }
.formulaire .wpcf7 form .wpcf7-response-output { margin: 8px 0 0; padding: 12px 16px; border: 1px solid var(--encre); font-size: 16px; }
.formulaire .wpcf7 form.invalid .wpcf7-response-output { border-color: var(--sceau); color: var(--sceau); }

.contact-cote {
  position: relative;
  padding: 90px var(--marge-large) 90px clamp(36px, 5vw, 80px);
  background: var(--grain), #15110d; background-blend-mode: soft-light;
  color: var(--creme);
}
.contact-pinceau { font: 400 28px/1 var(--pinceau); margin-bottom: 18px; }
.contact-insta { font: 400 clamp(28px, 2.8vw, 38px)/1 var(--serif); margin-bottom: 18px; }
.contact-insta a { display: inline-flex; align-items: center; gap: 16px; }
.contact-insta a::before { width: 44px; height: 44px; }
.contact-insta a:hover { text-decoration: underline; text-decoration-color: var(--sceau); text-underline-offset: 6px; text-decoration-thickness: 1px; }
.contact-note { color: var(--creme-doux); font-size: 17px; max-width: 26em; margin-bottom: 22px; }
.contact-cote h3 { font: 400 26px/1.1 var(--pinceau); margin-bottom: 10px; }
.contact-cote h3::before { content: ""; display: block; width: 30px; height: 1px; background: var(--creme-doux); margin: 4px 0 22px; }

/* ---------- menu de la semaine : les formules ---------- */

.formules {
  position: relative;
  background: var(--parchemin-fond);
  color: var(--encre);
  padding: 90px var(--gouttiere) 110px;
}
.formules > * { max-width: var(--large); margin-left: auto; margin-right: auto; }
.formules-tete { display: grid; grid-template-columns: minmax(180px, 300px) 1fr; gap: 20px 56px; align-items: center; margin-bottom: 64px; }
.wp-block-image.formules-marmite img {
  width: 100%; mix-blend-mode: multiply;
  -webkit-mask: radial-gradient(closest-side, #000 72%, transparent 100%);
          mask: radial-gradient(closest-side, #000 72%, transparent 100%);
}
.formules h2 { font-size: clamp(34px, 3.4vw, 48px); line-height: 1.05; margin-bottom: 14px; }
.formules .chapo { margin: 0; }
.formules-grille { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; align-items: start; }
/* Plusieurs plats : rubriques « Les plats » / « Pour accompagner » */
.formules-rubrique { margin: 0 auto 44px; font: 400 32px/1 var(--pinceau); color: var(--sceau); }
.formules-grille + .formules-rubrique { margin-top: 76px; }
.formules-grille.formules-grille--trois { grid-template-columns: repeat(3, 1fr); }
.formules-grille--trois .formule h3 { font-size: clamp(26px, 2.3vw, 32px); }
.formules-grille--trois .formule-accroche { font-size: 16.5px; }
/* Photo du plat en tête de carte, bord à bord, sous l'étiquette de prix */
.formule { --formule-marge: clamp(28px, 4vw, 56px); }
.wp-block-image.formule-photo { margin: -64px calc(-1 * var(--formule-marge)) 28px; overflow: hidden; }
.wp-block-image.formule-photo img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; filter: saturate(1.05) contrast(1.03); transition: transform .6s ease; }
.formule:hover .wp-block-image.formule-photo img { transform: scale(1.04); }
.formule-prix { z-index: 2; }
.formule-jp { margin-bottom: 6px; font: 400 15px/1 var(--kanji); letter-spacing: .12em; color: var(--ambre); }
.formule-conseil { margin-top: 22px; padding: 12px 14px; border-left: 3px solid var(--sceau); background: rgba(239,230,214,.06); font: italic 15.5px/1.4 var(--serif); color: var(--creme); }
/* Une seule formule : la carte reste à taille humaine, alignée sous le titre */
.formules-grille.formules-grille--seul { grid-template-columns: minmax(0, 620px); }
.wp-block-image.formules-photo img {
  width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 50%;
  border: 6px solid #fdf7f0; box-shadow: 0 18px 40px rgba(28,24,20,.3);
}

.formule { position: relative; background: var(--encre); color: var(--creme); padding: 64px clamp(28px, 4vw, 56px) 46px; }
.formule.formule--complet { background: #15110d; outline: 1px solid rgba(201,139,62,.55); outline-offset: -10px; }
/* Étiquette de prix, clin d'œil aux cartes du stand */
.formule-prix {
  position: absolute; top: -24px; right: 32px;
  padding: 14px 24px 12px 36px;
  background: var(--sceau); color: var(--creme);
  font: 400 32px/1 var(--pinceau);
  clip-path: polygon(20px 0, 100% 0, 100% 100%, 20px 100%, 0 50%);
}
.formule-prix::before { content: ""; position: absolute; left: 13px; top: 50%; width: 8px; height: 8px; margin-top: -4px; border-radius: 50%; background: var(--creme); }
.formule h3 { font: 400 clamp(30px, 2.8vw, 40px)/1.1 var(--pinceau); margin-bottom: 10px; }
.formule-accroche { font: italic 18px/1.4 var(--serif); color: var(--creme-doux); margin-bottom: 26px; padding-bottom: 22px; border-bottom: 1px solid rgba(239,230,214,.18); }
.wp-block-list.formule-liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.formule-liste li { display: flex; align-items: center; gap: 14px; font: 500 13px/1.3 var(--serif); letter-spacing: .18em; text-transform: uppercase; }
.formule-liste li::before { content: ""; flex: none; width: 7px; height: 7px; background: var(--sceau); transform: rotate(45deg); }
.wp-block-list.formule-liste.formule-liste--choix { grid-template-columns: 1fr 1fr; }
.formule-choix { margin: 24px 0 14px; font: 400 26px/1 var(--pinceau); color: var(--ambre); }

/* ---------- menu de la semaine : à la carte ---------- */

.carte-ingredients { max-width: var(--large); margin: 0 auto; padding: 120px var(--gouttiere) 100px; }
.carte-ingredients .carte-complete-tete p:not(.sceau):not(.menus-kanji-texte) { color: var(--creme-doux); font-size: 17px; max-width: 30em; }
.carte-ingredients h2 { font-size: clamp(32px, 3vw, 42px); line-height: 1.1; margin-bottom: 14px; }
.ingredients { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
/* Fond crème identique aux cartes du stand : les illustrations s'y fondent sans détourage */
.ingredient { display: flex; flex-direction: column; align-items: center; padding: 18px 18px 24px; background: #fdf7f0; color: var(--encre); text-align: center; }
.ingredient .wp-block-image { width: 100%; }
.ingredient .wp-block-image img { width: 100%; aspect-ratio: 5 / 4; object-fit: contain; transition: transform .4s ease; }
.ingredient:hover .wp-block-image img { transform: scale(1.05) rotate(-2deg); }
.ingredient h3 { margin-top: 12px; font: 400 25px/1.1 var(--pinceau); }
.ingredient-prix { margin: 8px 0 12px; padding: 5px 12px 4px; border: 1px solid var(--sceau); color: var(--sceau); font: 500 14px/1 var(--serif); letter-spacing: .08em; }
.ingredient p:not(.ingredient-prix) { font-size: 14.5px; line-height: 1.4; color: var(--encre-douce); }

/* Pastille « Cette semaine » sur une fiche plat */
.plat-badge {
  position: absolute; top: 14px; left: 14px; z-index: 2;
  padding: 8px 12px 7px;
  background: var(--sceau); color: var(--creme);
  font: 500 11px/1 var(--serif); letter-spacing: .2em; text-transform: uppercase;
}

/* ---------- blog : la liste des articles ---------- */

.blog-liste {
  position: relative;
  background: var(--parchemin-fond);
  color: var(--encre);
  padding: 100px var(--gouttiere) 110px;
}
.blog-liste > * { max-width: var(--large); margin-left: auto; margin-right: auto; }
.blog-liste .wp-block-post-template.blog-grille {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 44px 32px;
}
.blog-grille > li { margin: 0; }
.billet { display: flex; flex-direction: column; height: 100%; background: #fdf7f0; box-shadow: 0 14px 34px rgba(28,24,20,.12); }
.billet .wp-block-post-featured-image { margin: 0; overflow: hidden; }
.billet .wp-block-post-featured-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.billet:hover .wp-block-post-featured-image img { transform: scale(1.04); }
/* Article sans image : un trait rouge en tête de carte */
.billet:not(:has(.wp-block-post-featured-image)) { border-top: 4px solid var(--sceau); }
.billet-texte { flex: 1; display: flex; flex-direction: column; gap: 12px; padding: 26px 28px 30px; }
.billet-rubrique { font: 500 11.5px/1.3 var(--serif); letter-spacing: .22em; text-transform: uppercase; color: var(--sceau); }
.billet-rubrique a:hover { text-decoration: underline; text-underline-offset: 3px; }
.billet-titre { font: 400 clamp(24px, 2vw, 30px)/1.15 var(--serif); }
.billet-titre a { transition: color .2s; }
.billet-titre a:hover { color: var(--sceau); }
.billet-extrait p { font-size: 16.5px; line-height: 1.5; color: var(--encre-douce); }
.billet-extrait .wp-block-post-excerpt__more-text { margin-top: 14px; }
.billet-extrait .wp-block-post-excerpt__more-link {
  display: inline-block; padding-bottom: 4px; border-bottom: 1px solid var(--sceau);
  font: 500 12px/1 var(--serif); letter-spacing: .2em; text-transform: uppercase; color: var(--encre);
}
.billet-extrait .wp-block-post-excerpt__more-link::after { content: " →"; letter-spacing: 0; }
.billet-date { margin-top: auto; padding-top: 6px; font: italic 15px/1 var(--serif); color: var(--encre-douce); }
.blog-vide { max-width: 32em; margin: 0 auto; text-align: center; font: italic 22px/1.45 var(--serif); }
.blog-vide a, .article-texte a, .must-log-in a, .logged-in-as a { text-decoration: underline; text-decoration-color: var(--sceau); text-underline-offset: 3px; }
.wp-block-query-pagination.blog-pages { margin-top: 64px; gap: 22px; font: 500 13px/1 var(--serif); letter-spacing: .18em; text-transform: uppercase; }
.blog-pages .page-numbers { padding: 6px 4px; }
.blog-pages .page-numbers.current { color: var(--sceau); border-bottom: 1px solid var(--sceau); }

/* ---------- blog : l'article ---------- */

.bandeau.bandeau--article { min-height: 600px; }
.wp-block-post-featured-image.bandeau-fond { position: absolute; inset: 0; z-index: 0; margin: 0; }
.wp-block-post-featured-image.bandeau-fond img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: 50% 45%;
  filter: sepia(.45) saturate(1.2) brightness(.7) contrast(1.05);
}
.bandeau .wp-block-post-title { max-width: 15em; font: 400 clamp(40px, 5vw, 68px)/1.05 var(--serif); text-shadow: 0 2px 24px rgba(0,0,0,.5); }
.bandeau .wp-block-post-title::after, .bandeau .wp-block-query-title::after { content: ""; display: block; width: 42px; height: 1px; margin: 28px 0 20px; background: var(--creme-doux); }
.bandeau .wp-block-query-title { font: 400 clamp(44px, 5.4vw, 74px)/1.02 var(--serif); text-shadow: 0 2px 24px rgba(0,0,0,.5); }
.surtitre a:hover { color: var(--creme); }
.article-date { font: italic 19px/1.3 var(--serif); color: var(--creme-doux); }

.article-corps {
  position: relative;
  background: var(--parchemin-fond);
  color: var(--encre);
  padding: 100px var(--gouttiere) 110px;
}
.article-texte, .article-etiquettes { max-width: 720px; margin-left: auto; margin-right: auto; }
.article-texte { font-size: 19.5px; line-height: 1.7; }
.article-texte > * + * { margin-top: 1.1em; }
.article-texte > :first-child { margin-top: 0; }
.article-texte > p:first-child { font-size: 22px; line-height: 1.55; }
.article-texte h2 { margin-top: 1.9em; font-size: clamp(28px, 2.6vw, 36px); line-height: 1.15; }
.article-texte h3 { margin-top: 1.7em; font: 400 28px/1.15 var(--pinceau); color: var(--sceau); }
.article-texte :is(ul, ol) { padding-left: 1.3em; }
.article-texte li + li { margin-top: .4em; }
.article-texte .wp-block-quote { padding: 4px 0 4px 26px; border-left: 3px solid var(--sceau); }
.article-texte .wp-block-quote p { font: italic 23px/1.45 var(--serif); }
.article-texte .wp-block-quote cite { display: block; margin-top: 10px; font: 500 12px/1 var(--serif); letter-spacing: .2em; text-transform: uppercase; font-style: normal; color: var(--encre-douce); }
.article-texte .wp-block-image img { width: 100%; }
.article-texte figcaption { margin-top: 10px; text-align: center; font: italic 15px/1.4 var(--serif); color: var(--encre-douce); }
.article-texte > .alignwide { width: min(1040px, calc(100vw - 2 * var(--gouttiere))); max-width: none; margin-left: 50%; transform: translateX(-50%); }
.article-texte > .alignfull { width: 100vw; max-width: none; margin-left: 50%; transform: translateX(-50%); }
.article-texte .wp-block-separator { width: 80px; margin: 2.4em auto; border: 0; border-top: 1px solid rgba(28,24,20,.3); }
.article-texte .wp-block-table table { width: 100%; border-collapse: collapse; font-size: 17px; }
.article-texte .wp-block-table :is(td, th) { padding: 10px 12px; border-bottom: 1px solid rgba(28,24,20,.2); text-align: left; }
.article-etiquettes { margin-top: 48px; font: 500 12px/1.6 var(--serif); letter-spacing: .18em; text-transform: uppercase; color: var(--encre-douce); }

.article-suite {
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px 40px;
  max-width: 1000px; margin: 0 auto;
  padding: 80px var(--gouttiere) 20px;
}
.article-suite .wp-block-post-navigation-link { font: italic 18px/1.35 var(--serif); color: var(--creme-doux); }
.article-suite .wp-block-post-navigation-link a:hover { color: var(--creme); }
.article-suite .wp-block-post-navigation-link .post-navigation-link__label { display: block; margin-bottom: 6px; font: normal 500 11.5px/1 var(--serif); letter-spacing: .2em; text-transform: uppercase; color: var(--ambre); }
.article-suite .article-suivant { text-align: right; }

/* ---------- blog : les commentaires (réservés aux membres) ---------- */

.wp-block-comments.commentaires { max-width: 860px; margin: 0 auto; padding: 60px var(--gouttiere) 110px; }
.commentaires .wp-block-comments-title { margin-bottom: 26px; font-size: clamp(28px, 2.6vw, 36px); line-height: 1.15; }
.commentaires .wp-block-comment-template { list-style: none; margin: 0; padding: 0; }
.commentaires .wp-block-comment-template ol { list-style: none; margin: 0; padding-left: clamp(20px, 5vw, 72px); }
.commentaire { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 0 18px; padding: 24px 0; border-top: 1px solid rgba(239,230,214,.15); }
.commentaire .wp-block-avatar img { width: 56px; height: 56px; object-fit: cover; border-radius: 3px; }
.commentaire-tete { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; margin-bottom: 8px; }
.commentaire .wp-block-comment-author-name { font: 500 18px/1.2 var(--serif); color: var(--creme); }
.commentaire .wp-block-comment-date { font: italic 14.5px/1.2 var(--serif); color: var(--creme-doux); }
.commentaire .wp-block-comment-content { font-size: 17px; line-height: 1.6; color: var(--creme-doux); }
.commentaire .wp-block-comment-content p + p { margin-top: .8em; }
.commentaire .comment-awaiting-moderation { display: block; margin-bottom: 8px; font: italic 15px var(--serif); color: var(--ambre); }
.commentaire .wp-block-comment-reply-link { margin-top: 10px; }
.commentaire .wp-block-comment-reply-link a { font: 500 11.5px/1 var(--serif); letter-spacing: .2em; text-transform: uppercase; color: var(--ambre); }
.commentaires .wp-block-comments-pagination { margin-top: 24px; font: italic 16px var(--serif); }

.commentaires .wp-block-post-comments-form { margin-top: 30px; padding-top: 34px; border-top: 1px solid rgba(239,230,214,.15); }
.commentaires .comment-reply-title { margin: 0 0 16px; font: 400 clamp(26px, 2.4vw, 32px)/1.15 var(--serif); }
.commentaires .comment-reply-title small { margin-left: 12px; font: 500 11.5px/1 var(--serif); letter-spacing: .2em; text-transform: uppercase; }
.commentaires :is(.must-log-in, .logged-in-as, .comment-notes) { margin: 0 0 20px; font-size: 17px; color: var(--creme-doux); }
.commentaires .must-log-in { padding: 22px 24px; border-left: 3px solid var(--sceau); background: rgba(239,230,214,.05); font-size: 18px; color: var(--creme); }
.commentaires .comment-form { display: grid; gap: 18px; }
.commentaires .comment-form p { margin: 0; }
.commentaires .comment-form label { display: block; margin-bottom: 8px; font: 500 12px/1 var(--serif); letter-spacing: .2em; text-transform: uppercase; color: var(--creme-doux); }
.commentaires .comment-form textarea {
  display: block; width: 100%; min-height: 150px; resize: vertical;
  padding: 14px 16px; border: 0; border-bottom: 1px solid rgba(239,230,214,.4); border-radius: 0;
  background: rgba(239,230,214,.06); color: var(--creme); font: 400 18px/1.5 var(--serif);
}
.commentaires .comment-form textarea:focus { outline: none; background: rgba(239,230,214,.1); border-bottom-color: var(--creme); }
.wp-block-post-comments-form .form-submit input[type="submit"] {
  cursor: pointer;
  padding: 15px 44px 15px 26px;
  border: 0; border-radius: 0;
  background: var(--creme); color: var(--encre);
  font: 500 13px/1 var(--serif); letter-spacing: .2em; text-transform: uppercase;
  -webkit-mask: var(--forme-pinceau) center / 100% 100% no-repeat;
          mask: var(--forme-pinceau) center / 100% 100% no-repeat;
}

/* ---------- espace membre : connexion, inscription, mon compte ---------- */

.bandeau.bandeau--membre { min-height: 460px; }
.bandeau--membre .bandeau-texte { padding-bottom: 70px; }

.compte {
  position: relative;
  background: var(--parchemin-fond);
  color: var(--encre);
  padding: 90px var(--gouttiere) 110px;
}

/* Connexion / Inscription : présentation et carte de membre à gauche, formulaire à droite */
.compte.compte--duo {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 560px);
  gap: clamp(40px, 6vw, 110px); align-items: start;
  padding-left: var(--marge-large); padding-right: var(--marge-large);
}
.compte-presentation { position: sticky; top: 40px; padding-top: 24px; }
.compte-presentation h2 { margin: 56px 0 22px; font-size: clamp(30px, 2.8vw, 40px); line-height: 1.1; }
.wp-block-list.compte-avantages { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; }
.compte-avantages li { position: relative; padding-left: 32px; font-size: 18px; line-height: 1.45; }
.compte-avantages li::before { content: ""; position: absolute; left: 4px; top: .5em; width: 8px; height: 8px; background: var(--sceau); transform: rotate(45deg); }
.compte-note { margin-top: 34px; padding-top: 22px; border-top: 1px solid rgba(28,24,20,.2); font: italic 15.5px/1.5 var(--serif); color: var(--encre-douce); scroll-margin-top: 40px; }

/* Carte de membre (le nom suit la saisie du prénom à l'inscription, voir membres.js) */
.carte-membre {
  position: relative; overflow: hidden;
  display: flex; flex-direction: column;
  width: min(100%, 400px); aspect-ratio: 1.586;
  padding: 24px 26px 20px;
  background: var(--grain), radial-gradient(ellipse at 12% 0%, #3d2c1d, #1d1611 55%, #110d0a);
  background-blend-mode: soft-light, normal;
  color: var(--creme);
  border-radius: 14px;
  box-shadow: 0 26px 54px rgba(28,24,20,.38), inset 0 0 0 1px rgba(201,139,62,.4);
  transform: rotate(-2.5deg);
}
.carte-membre::after { content: ""; position: absolute; inset: 9px; border: 1px solid rgba(201,139,62,.28); border-radius: 9px; pointer-events: none; }
.carte-membre-tete { display: flex; justify-content: space-between; align-items: center; }
.carte-membre-marque { font: 400 32px/1 var(--pinceau); }
.carte-membre-sceau {
  display: inline-grid; place-items: center; width: 34px; height: 34px;
  background: var(--sceau); color: var(--parchemin); font: 400 21px/1 var(--kanji);
  border-radius: 3px; box-shadow: inset 0 0 0 2px rgba(239,230,214,.25);
}
.carte-membre-titre { margin-top: 8px; font: 500 10.5px/1 var(--serif); letter-spacing: .3em; text-transform: uppercase; color: var(--ambre); }
.carte-membre-corps { position: relative; z-index: 1; display: flex; align-items: center; gap: 14px; margin-top: auto; }
.carte-membre-photo { flex: none; width: 52px; height: 52px; object-fit: cover; border-radius: 50%; border: 2px solid rgba(239,230,214,.6); }
.carte-membre-nom { font: 400 clamp(24px, 2.3vw, 30px)/1.1 var(--serif); overflow-wrap: anywhere; }
.carte-membre-pied {
  position: relative; z-index: 1;
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px;
  margin-top: 12px; padding-top: 10px; border-top: 1px solid rgba(239,230,214,.18); font-size: 14px;
}
.carte-membre-pied span { font: 500 10.5px/1 var(--serif); letter-spacing: .22em; text-transform: uppercase; color: var(--creme-doux); }
.carte-membre-pied strong { font-weight: 500; }
.carte-membre-pied em { margin-left: auto; color: var(--ambre); }
.carte-membre-kanji { position: absolute; right: 20px; top: 58px; writing-mode: vertical-rl; font: 400 56px/1 var(--kanji); color: rgba(239,230,214,.08); }

/* Panneau du formulaire, avec onglets Se connecter / Créer un compte */
.membre-panneau { background: #fdf7f0; border-radius: 6px; box-shadow: 0 26px 60px rgba(28,24,20,.16); overflow: hidden; }
.membre-onglets { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; border-bottom: 1px solid rgba(28,24,20,.12); }
.membre-onglets a {
  padding: 21px 12px 18px; text-align: center;
  font: 500 12.5px/1 var(--serif); letter-spacing: .2em; text-transform: uppercase;
  color: var(--encre-douce); background: rgba(28,24,20,.045);
  border-bottom: 2px solid transparent; transition: color .2s, background .2s;
}
.membre-onglets a:hover { color: var(--encre); }
.membre-onglets a.actif { background: transparent; color: var(--encre); border-bottom-color: var(--sceau); }
.membre-panneau-corps { padding: clamp(28px, 4vw, 48px); }
.membre-panneau-corps h2 { margin-bottom: 8px; font-size: clamp(28px, 2.6vw, 36px); line-height: 1.1; }
.membre-intro { margin-bottom: 24px; font: italic 17px/1.45 var(--serif); color: var(--encre-douce); }
.membre-panneau-corps h2 + :is(.membre-message, .membre-google, form) { margin-top: 24px; }

/* Champs */
.membre-grille { display: grid; gap: 20px; }
.champ { display: grid; gap: 7px; min-width: 0; }
.champ-tete { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.champ-tete label, .champ-titre { font: 500 14.5px/1.2 var(--serif); letter-spacing: .04em; color: var(--encre); }
.champ-facultatif { margin-left: 4px; font: italic 400 14px/1 var(--serif); letter-spacing: 0; color: var(--encre-douce); }
.champ-lien { font: italic 15px/1 var(--serif); color: var(--encre-douce); text-decoration: underline; text-decoration-color: rgba(176,53,42,.5); text-underline-offset: 3px; }
.champ-lien:hover { color: var(--encre); }
.compte :is(input[type="text"], input[type="email"], input[type="password"], textarea, select) {
  display: block; width: 100%; min-height: 50px;
  padding: 12px 14px; border: 1px solid rgba(28,24,20,.28); border-radius: 4px;
  background: #fff; color: var(--encre);
  font: 400 17.5px/1.35 var(--serif);
  transition: border-color .2s, box-shadow .2s;
}
.compte textarea { min-height: 110px; resize: vertical; }
.compte select {
  appearance: none; -webkit-appearance: none; cursor: pointer; padding-right: 40px;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%231c1814' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right 14px center / 12px;
}
.compte :is(input, textarea, select):focus { outline: none; border-color: var(--encre); box-shadow: 0 0 0 3px rgba(201,139,62,.3); }
.champ--erreur :is(input, textarea, select) { border-color: var(--sceau); }
.champ-aide { font: italic 15px/1.4 var(--serif); color: var(--encre-douce); }
.champ-erreur { font: 15px/1.4 var(--serif); color: #8f2a21; }
.champ-erreur::before { content: "! "; font-weight: 600; }
.champ-saisie { position: relative; }
.champ-saisie input { padding-right: 54px; }
.champ-oeil {
  --ico-oeil: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6'%3E%3Cpath d='M2 12s3.6-7 10-7 10 7 10 7-3.6 7-10 7S2 12 2 12z'/%3E%3Ccircle cx='12' cy='12' r='3.2'/%3E%3C/svg%3E");
  --ico-oeil-barre: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6'%3E%3Cpath d='M2 12s3.6-7 10-7 10 7 10 7-3.6 7-10 7S2 12 2 12z'/%3E%3Ccircle cx='12' cy='12' r='3.2'/%3E%3Cpath d='M4 4l16 16'/%3E%3C/svg%3E");
  position: absolute; right: 4px; top: 50%;
  width: 44px; height: 44px; margin-top: -22px;
  border: 0; border-radius: 4px; background: none; cursor: pointer; color: var(--encre-douce);
}
.champ-oeil::before { content: ""; display: block; width: 22px; height: 22px; margin: auto; background: currentColor; -webkit-mask: var(--ico-oeil) center / contain no-repeat; mask: var(--ico-oeil) center / contain no-repeat; }
.champ-oeil[aria-pressed="true"]::before { -webkit-mask-image: var(--ico-oeil-barre); mask-image: var(--ico-oeil-barre); }
.champ-oeil:hover { color: var(--encre); }
.champ-duo { display: grid; grid-template-columns: 1fr 1.6fr; gap: 10px; }

/* Solidité du mot de passe */
.mdp-jauge { margin-top: -10px; }
.mdp-jauge-barres { display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; }
.mdp-jauge-barres span { height: 4px; border-radius: 2px; background: rgba(28,24,20,.12); transition: background .25s; }
.mdp-jauge[data-niveau="1"] span:nth-child(-n+1) { background: var(--sceau); }
.mdp-jauge[data-niveau="2"] span:nth-child(-n+2) { background: var(--ambre); }
.mdp-jauge[data-niveau="3"] span:nth-child(-n+3),
.mdp-jauge[data-niveau="4"] span { background: var(--encre); }
.mdp-jauge-texte { margin-top: 7px; font: italic 14.5px/1.3 var(--serif); color: var(--encre-douce); }

/* Cases à cocher */
.case { display: flex; align-items: flex-start; gap: 12px; cursor: pointer; font: 400 16.5px/1.4 var(--serif); color: var(--encre); }
.case input { flex: none; width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--encre); cursor: pointer; }
.case small { display: block; margin-top: 2px; font: italic 14.5px/1.4 var(--serif); color: var(--encre-douce); }
.case a { text-decoration: underline; text-decoration-color: var(--sceau); text-underline-offset: 3px; }
.case.case--petite { font-size: 15px; }
.membre-plus { display: grid; gap: 18px; min-width: 0; margin: 4px 0 0; padding: 24px 0 0; border: 0; border-top: 1px solid rgba(28,24,20,.14); }
.membre-plus legend { float: left; width: 100%; margin-bottom: 2px; font: 400 23px/1 var(--pinceau); color: var(--sceau); }

/* Boutons et liens */
.membre-bouton {
  display: inline-flex; align-items: center; justify-content: center; gap: 12px;
  justify-self: start; cursor: pointer; margin-top: 4px;
  padding: 15px 44px 15px 26px;
  border: 0; border-radius: 0;
  background: var(--encre); color: var(--creme);
  font: 500 13px/1 var(--serif); letter-spacing: .2em; text-transform: uppercase;
  -webkit-mask: var(--forme-pinceau) center / 100% 100% no-repeat;
          mask: var(--forme-pinceau) center / 100% 100% no-repeat;
  transition: transform .25s ease, background .2s;
}
.membre-bouton::after { content: "→"; letter-spacing: 0; }
.membre-bouton:hover { transform: translateX(4px); }
.membre-bouton.membre-bouton--sceau { background: var(--sceau); }
.membre-bouton.membre-bouton--large {
  justify-self: stretch; width: 100%; padding: 18px 26px;
  border-radius: 4px; -webkit-mask: none; mask: none; font-size: 13.5px;
}
.membre-bouton.membre-bouton--large:hover { transform: none; background: #000; }
.membre-bouton.membre-bouton--trait {
  margin: 0; padding: 11px 18px; border: 1px solid rgba(28,24,20,.5); border-radius: 4px;
  background: #fff; color: var(--encre); -webkit-mask: none; mask: none; font-size: 12px;
}
.membre-bouton.membre-bouton--trait::after { content: none; }
.membre-bouton.membre-bouton--trait:hover { transform: none; border-color: var(--encre); }
.membre-lien-bouton {
  padding: 0; border: 0; background: none; cursor: pointer;
  font: 500 12px/1 var(--serif); letter-spacing: .2em; text-transform: uppercase; color: var(--encre);
  text-decoration: underline; text-decoration-color: var(--sceau); text-underline-offset: 5px;
}
.membre-aide-bas { margin-top: -6px; text-align: center; font: italic 14.5px/1.4 var(--serif); color: var(--encre-douce); }
.membre-bas { margin-top: 26px; text-align: center; font-size: 16.5px; color: var(--encre-douce); }
.membre-lien { color: var(--encre); text-decoration: underline; text-decoration-color: var(--sceau); text-underline-offset: 3px; }
.membre-message { margin-bottom: 22px; padding: 14px 18px; border-left: 3px solid var(--encre); background: rgba(28,24,20,.04); font-size: 16.5px; line-height: 1.45; }
.membre-message.membre-message--erreur { border-left-color: var(--sceau); background: rgba(176,53,42,.06); color: #8f2a21; }
.membre-message strong { font-weight: 600; }
/* Champ piège de l'anti-spam (jamais vu des visiteurs ; page non indexée) */
.membre-piege { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* « Continuer avec Google » : présentation imposée par Google (fond blanc, bord gris, logo G en couleurs) */
.membre-google { margin-bottom: 24px; }
.membre-google-bouton {
  display: flex; align-items: center; justify-content: center; gap: 12px;
  width: 100%; min-height: 50px; padding: 10px 16px;
  background: #fff; color: #1f1f1f;
  border: 1px solid #747775; border-radius: 4px;
  font: 500 15px/1.2 Roboto, Arial, sans-serif; letter-spacing: .01em;
  transition: background .2s, box-shadow .2s;
}
.membre-google-bouton:hover { background: #f8f8f8; box-shadow: 0 2px 8px rgba(28,24,20,.15); }
.membre-google-bouton svg { flex: none; }
.membre-google-note { margin-top: 10px; text-align: center; font: italic 14px/1.4 var(--serif); color: var(--encre-douce); }
.membre-google-note a { text-decoration: underline; text-underline-offset: 3px; }
.membre-ou { display: flex; align-items: center; gap: 16px; margin-top: 24px; font: italic 15.5px/1 var(--serif); color: var(--encre-douce); }
.membre-ou::before, .membre-ou::after { content: ""; flex: 1; height: 1px; background: rgba(28,24,20,.2); }

/* Mon compte : carte et navigation à gauche, panneaux à droite (un seul visible à la fois avec membres.js) */
.compte.compte--espace { padding-left: var(--marge-large); padding-right: var(--marge-large); }
.espace { display: grid; grid-template-columns: minmax(0, 380px) minmax(0, 1fr); gap: clamp(36px, 5vw, 80px); align-items: start; }
.espace-cote { position: sticky; top: 40px; display: grid; gap: 34px; }
.espace-cote .carte-membre { width: 100%; transform: none; }
.espace-nav { display: grid; border-top: 1px solid rgba(28,24,20,.15); }
.espace-nav a {
  display: flex; justify-content: space-between; align-items: center;
  padding: 16px 6px; border-bottom: 1px solid rgba(28,24,20,.15);
  font: 500 12.5px/1 var(--serif); letter-spacing: .18em; text-transform: uppercase; color: var(--encre-douce);
  transition: color .2s, padding .2s, box-shadow .2s;
}
.espace-nav a::after { content: "→"; letter-spacing: 0; opacity: .45; }
.espace-nav a:hover, .espace-nav a.actif { color: var(--encre); }
.espace-nav a.actif { padding-left: 16px; box-shadow: inset 3px 0 0 var(--sceau); }
.espace-nav a.espace-nav-sortie::after { content: none; }
.espace-corps { min-width: 0; }
.espace-panneau { padding: clamp(26px, 4vw, 48px); background: #fdf7f0; border-radius: 6px; box-shadow: 0 20px 48px rgba(28,24,20,.12); scroll-margin-top: 40px; }
.espace-panneau + .espace-panneau { margin-top: 30px; }
.espace-panneau h2 { font-size: clamp(28px, 2.6vw, 36px); line-height: 1.1; }
.espace-chapo { margin: 8px 0 28px; font: italic 17px/1.45 var(--serif); color: var(--encre-douce); }
.espace-alerte {
  display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px 24px;
  margin-bottom: 26px; padding: 18px 22px;
  background: #fdf7f0; border-left: 4px solid var(--sceau); box-shadow: 0 10px 30px rgba(28,24,20,.08);
  font-size: 17px; line-height: 1.45;
}
.espace-alerte p { flex: 1 1 20em; }
.photo-zone { display: flex; flex-wrap: wrap; align-items: center; gap: 24px; }
.photo-apercu { width: 112px; height: 112px; object-fit: cover; border-radius: 50%; border: 4px solid #fff; box-shadow: 0 10px 26px rgba(28,24,20,.2); }
.photo-actions { position: relative; display: grid; gap: 10px; justify-items: start; }
.photo-fichier { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.photo-actions:focus-within .membre-bouton--trait { outline: 2px solid var(--ambre); outline-offset: 3px; }
.espace-google { margin-top: 22px; font: italic 15.5px/1.45 var(--serif); color: var(--encre-douce); }
.espace-supprimer { margin-top: 40px; padding-top: 24px; border-top: 1px solid rgba(28,24,20,.15); }
.espace-supprimer summary { cursor: pointer; list-style: none; font: 500 12px/1 var(--serif); letter-spacing: .2em; text-transform: uppercase; color: var(--encre-douce); }
.espace-supprimer summary::-webkit-details-marker { display: none; }
.espace-supprimer summary::before { content: "+ "; color: var(--sceau); }
.espace-supprimer[open] summary { margin-bottom: 20px; }

@media (max-width: 1000px) {
  .compte.compte--duo, .espace { grid-template-columns: 1fr; }
  .compte-presentation, .espace-cote { position: static; }
  .compte-formulaire { order: -1; }
  .compte-presentation { padding-top: 10px; }
  .espace-cote .carte-membre { max-width: 400px; }
}
@media (max-width: 760px) {
  .compte.compte--duo, .compte.compte--espace { padding: 70px var(--gouttiere) 80px; }
  .bandeau.bandeau--membre { min-height: 380px; }
  .membre-panneau-corps { padding: 26px 20px 30px; }
  .carte-membre { padding: 18px 20px 16px; }
  .carte-membre-kanji { font-size: 44px; top: 50px; }
}

/* ---------- 404 ---------- */

.page-404 { max-width: var(--large); margin: 0 auto; padding: 220px var(--gouttiere) 140px; }
.page-404 h1 { font: italic 400 clamp(34px, 4vw, 56px)/1.15 var(--serif); margin-bottom: 18px; }
.page-404 p { color: var(--creme-doux); font-size: 18px; margin-bottom: 40px; }

:where(a, [role="button"], input, textarea):focus-visible { outline: 2px solid var(--ambre); outline-offset: 3px; }

@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } }

/* =========================================================
   Responsive
   ========================================================= */

/* core/navigation bascule en panneau à 600 px ; avec sept entrées, on le fait dès 1240 px. */
@media (min-width: 600px) and (max-width: 1240px) {
  .wp-block-navigation.nav .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
  .wp-block-navigation.nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
}

@media (max-width: 1100px) {
  .menus { grid-template-columns: 70px 1fr; }
  .plats { grid-column: 1 / -1; }
  .nous { grid-template-columns: .8fr 1.2fr; }
  .nous-deco { display: none; }

  .ingredients { grid-template-columns: repeat(3, 1fr); }
  .formules-grille.formules-grille--trois { grid-template-columns: repeat(2, 1fr); }
  .pied { flex-wrap: wrap; }
  .wp-block-navigation.pied-nav { order: 3; width: 100%; margin-left: 0; }
  .jours { grid-template-columns: repeat(4, 1fr); border-top: 1px solid rgba(28,24,20,.2); }
  .jour { border-bottom: 1px solid rgba(28,24,20,.2); padding-top: 18px; }
  .plan-marches { grid-template-columns: 1fr; }
  .plats.plats--neuf { grid-template-columns: repeat(2, 1fr); }
  .blog-liste .wp-block-post-template.blog-grille { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Panneau mobile du menu : l'espace membre y garde son libellé à côté du pictogramme */
.wp-block-navigation.nav .is-menu-open .nav-compte .wp-block-navigation-item__content { display: flex; align-items: center; gap: 12px; }
.wp-block-navigation.nav .is-menu-open .nav-compte .wp-block-navigation-item__label { font-size: 15px !important; color: inherit; }

@media (max-width: 900px) {
  .entete { padding-top: 14px; }
  .wp-block-site-logo.logo { width: 112px; }
  .wp-block-navigation.nav { padding-top: 18px; }
}

@media (max-width: 760px) {
  .heros { min-height: 760px; align-items: flex-start; }
  .heros-texte { padding-top: 170px; }
  .heros-mots { font-size: 16px; margin-bottom: 26px; }
  .annonce-semaine { grid-template-columns: 84px 1fr; column-gap: 12px; padding: 14px 16px 18px 8px; }
  .annonce-plat { font-size: 38px; }
  .annonce-prix { font-size: 15px; }
  .wp-block-image.heros-bol { top: auto; width: 100vw; height: 460px; bottom: -110px; }
  .wp-block-image.heros-bol img { -webkit-mask: linear-gradient(180deg, transparent 0%, #000 35%, #000 70%, transparent 100%); mask: linear-gradient(180deg, transparent 0%, #000 35%, #000 70%, transparent 100%); }

  .menus { grid-template-columns: 1fr; padding-top: 130px; }
  .menus .menus-kanji { display: none; }
  .plats { gap: 10px; }
  .plat h3 { font-size: 22px; }
  .plat p { font-size: 13.5px; }

  .trouver { grid-template-columns: 1fr; }
  .trouver-texte { padding-right: var(--gouttiere); }
  .bord-v::before { display: none; }
  .carte { grid-template-columns: 1fr; padding: 50px var(--gouttiere); }
  .carte-plan { max-width: 440px; margin-bottom: 34px; }

  .nous { grid-template-columns: 1fr; }
  .wp-block-image.nous-photo img { height: 260px; }
  .nous-texte { padding: 56px var(--gouttiere); }

  .pied { flex-direction: column; align-items: flex-start; gap: 22px; }
  .wp-block-navigation.pied-nav { margin-left: 0; }
  .wp-block-navigation.pied-nav .wp-block-navigation__container { flex-wrap: wrap; }
  .pied-insta { border: 0; padding: 0; }

  .bandeau { min-height: 520px; }
  .bandeau-texte { padding: 160px var(--gouttiere) 64px; }
  .bandeau-kanji { bottom: auto; top: 150px; font-size: 48px; opacity: .6; }

  .calendrier { padding: 64px var(--gouttiere) 60px; }
  .calendrier-tete { grid-template-columns: 1fr; margin-bottom: 34px; }
  .jours { grid-template-columns: 1fr; border-left: 0; }
  .jour { display: grid; grid-template-columns: 54px 1fr; column-gap: 16px; min-height: 0; padding: 18px 4px; border-right: 0; }
  .jour-kanji { grid-row: 1 / 9; font-size: 38px; margin: 0; }
  .jour h3 { border: 0; padding: 0; margin-bottom: 8px; }
  .jour.jour--labo { padding-left: 12px; padding-right: 12px; }

  .plan-marches { padding: 70px var(--gouttiere); }
  .plan-marches-carte .carte-plan { max-width: 440px; }

  .recit { grid-template-columns: 1fr; padding: 80px var(--gouttiere); }
  .wp-block-quote.recit-citation { position: static; }
  .chapitre { grid-template-columns: 48px 1fr; column-gap: 16px; }
  .chapitre-num { font-size: 38px; }

  .principes { padding: 70px var(--gouttiere); }
  .principes-grille { grid-template-columns: 1fr; border-left: 0; gap: 40px; }
  .principe { border-right: 0; padding: 0; display: grid; grid-template-columns: 70px 1fr; column-gap: 18px; }
  .principe-kanji { grid-row: 1 / 3; font-size: 56px; margin: 0; }

  .carte-complete { padding: 80px var(--gouttiere); }
  .carte-complete-tete { grid-template-columns: 1fr; }
  .carte-complete-tete .menus-kanji { display: none; }

  .formules { padding: 70px var(--gouttiere) 80px; }
  .formules-tete { grid-template-columns: 1fr; margin-bottom: 54px; }
  .wp-block-image.formules-marmite { max-width: 220px; }
  .formules-grille, .formules-grille.formules-grille--trois { grid-template-columns: 1fr; gap: 48px; }
  .formules-rubrique { margin-bottom: 36px; }
  .carte-ingredients { padding: 80px var(--gouttiere); }
  .carte-ingredients .carte-complete-tete .menus-kanji { display: none; }
  .ingredients { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .ingredient { padding: 12px 12px 18px; }
  .ingredient h3 { font-size: 21px; }
  .ingredient p:not(.ingredient-prix) { font-size: 13.5px; }

  .blog-liste, .article-corps, .compte { padding: 70px var(--gouttiere) 80px; }
  .blog-liste .wp-block-post-template.blog-grille { grid-template-columns: 1fr; gap: 32px; }
  .article-texte { font-size: 18px; }
  .article-texte > p:first-child { font-size: 20px; }
  .article-suite { grid-template-columns: 1fr; padding-top: 56px; }
  .article-suite .article-suivant { text-align: left; }

  .contact { grid-template-columns: 1fr; }
  .formulaire { padding: 70px var(--gouttiere); }
  .contact-cote { padding: 60px var(--gouttiere); }
}

@media (max-width: 560px) {
  .plats, .plats.plats--neuf { grid-template-columns: 1fr; gap: 16px; }
  .plat .wp-block-image img { aspect-ratio: 16 / 10; }
  .plat h3 { font-size: 27px; }
}
