/* resto.oteote.fr · CSS propre à la page. Palette et polices : fnb-ds.css (11 tokens, aucune autre couleur).
   Mobile d'abord (375 px), puis 768 px et 1100 px et plus.
   Contrastes vérifiés (WCAG AA) : sur crème, les petits textes restent en --poivre ou --vert-deep ;
   --clay et --vert ne servent qu'aux grands titres (>= 24 px ou gras >= 19 px). */

html{ background:var(--cream); scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } *{ transition:none !important; animation:none !important; } }
body{ font-size:1.0625rem; line-height:1.6; }
img{ max-width:100%; height:auto; }
a{ color:var(--vert-deep); text-underline-offset:.18em; }
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{ outline:3px solid var(--amber); outline-offset:3px; }
strong,b{ color:var(--vert-deep); }
.eyebrow{ color:var(--poivre); font-weight:400; }
.eyebrow-clair{ color:var(--cream); }

.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.skip{ position:absolute; left:-999px; top:0; background:var(--vert-deep); color:var(--cream); padding:10px 16px; z-index:10; }
.skip:focus{ left:16px; top:8px; }

.texte{ max-width:65ch; margin:0 auto; }
.large{ max-width:1100px; margin:0 auto; }
.section{ padding:56px 16px; scroll-margin-top:12px; }
.section-douce{ background:var(--cream-soft); }
.section-sombre{ background:var(--vert-deep); color:var(--cream); }
.section-sombre h2,.section-sombre h3{ color:var(--cream); }
.section-sombre em{ color:var(--amber); }
.section-sombre a{ color:var(--cream); }
h2{ font-size:clamp(1.75rem, 5vw, 2.5rem); }
.note{ font-size:.9rem; color:var(--poivre); margin-top:1.4em; }

/* Bandeau et en-tête */
.bandeau{ background:var(--nuit); color:var(--cream); text-align:center; font-size:.8125rem; letter-spacing:.08em; padding:7px 16px; }
.entete{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 16px; background:var(--vert-deep); border-bottom:1px solid var(--poivre); }
.wordmark{ font-family:'Overlock',Georgia,serif; font-weight:900; font-size:1.5rem; color:var(--cream); text-decoration:none; letter-spacing:-.01em; }
.entete-cta{ color:var(--cream); font-size:.875rem; text-decoration:underline; text-align:right; }

/* Boutons */
.btn{ display:inline-block; font:inherit; font-weight:700; font-size:1rem; border:0; border-radius:4px; padding:14px 22px; cursor:pointer; text-decoration:none; min-height:48px; }
.btn-clair{ background:var(--amber); color:var(--vert-deep); }
.btn-clair:hover{ background:var(--cream); }
.btn[disabled]{ opacity:.75; cursor:progress; }

/* Hero */
.hero{ background:var(--vert-deep); color:var(--cream); min-height:calc(100svh - 110px); display:flex; align-items:center; padding:40px 16px 48px; }
.hero-inner{ max-width:1100px; margin:0 auto; width:100%; }
.kicker{ text-transform:uppercase; letter-spacing:.15em; font-size:.8125rem; color:var(--cream); margin:0 0 18px; }
.hero h1{ color:var(--cream); font-size:clamp(2.1rem, 8.5vw, 4.4rem); max-width:17ch; margin-bottom:.45em; }
.hero h1 em{ color:var(--amber); }
.hero-sous{ font-size:1.125rem; max-width:52ch; margin:0 0 32px; }
.compteur-titre{ font-family:'Overlock',Georgia,serif; font-weight:900; font-size:1.5rem; color:var(--amber); margin:0 0 16px; }
.compteur{ display:grid; grid-template-columns:repeat(4, 1fr); gap:8px; max-width:520px; margin:0 0 24px; }
.compteur[hidden]{ display:none; }
.bloc-temps{ border:1px solid var(--lichen); border-radius:4px; padding:12px 4px; text-align:center; }
.bloc-temps .val{ display:block; font-family:'Overlock',Georgia,serif; font-weight:900; font-size:clamp(1.75rem, 8vw, 3rem); line-height:1; font-variant-numeric:tabular-nums; color:var(--cream); }
.bloc-temps .lab{ display:block; font-size:.75rem; letter-spacing:.1em; text-transform:uppercase; margin-top:6px; color:var(--cream); }

/* Histoire */
.citation{ margin:1.6em 0; padding:0; border:0; }
.citation p{ font-family:'Overlock',Georgia,serif; font-style:italic; font-weight:400; font-size:1.625rem; line-height:1.3; color:var(--clay); margin:0; }
.histoire-complete summary{ cursor:pointer; font-weight:700; color:var(--vert-deep); text-decoration:underline; text-underline-offset:.18em; padding:8px 0; }
.histoire-longue{ border-left:1px solid var(--grey-light); padding-left:16px; margin-top:12px; }

/* Carte */
.carte-grille{ list-style:none; margin:24px 0 0; padding:0; display:grid; grid-template-columns:1fr; border-top:1px solid var(--grey-light); }
.plat{ padding:20px 0; border-bottom:1px solid var(--grey-light); }
.plat-tete{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.plat h3{ font-size:1.3rem; margin:0; }
.prix{ font-family:'Overlock',Georgia,serif; font-weight:900; font-size:1.3rem; color:var(--vert-deep); white-space:nowrap; font-variant-numeric:tabular-nums; }
.plat-tag{ font-size:.75rem; letter-spacing:.12em; text-transform:uppercase; color:var(--poivre); margin:4px 0 6px; }
.plat p:last-child{ margin:0; }

/* Informations pratiques */
.infos-grille{ display:grid; grid-template-columns:1fr; gap:0; margin:24px 0 0; border-top:1px solid var(--grey-light); }
.infos-grille div{ padding:14px 0; border-bottom:1px solid var(--grey-light); }
.infos-grille dt{ font-weight:700; color:var(--vert-deep); }
.infos-grille dd{ margin:2px 0 0; }
.lien-fort{ font-weight:700; }

/* Formulaire */
.formulaire{ margin-top:28px; }
.champ{ margin-bottom:22px; }
.champ label{ display:block; font-weight:700; margin-bottom:6px; }
.facultatif{ font-weight:400; }
.champ input[type=email],.champ input[type=tel]{ width:100%; font:inherit; font-size:1.0625rem; padding:12px 14px; min-height:48px; border:2px solid var(--cream); border-radius:4px; background:var(--cream); color:var(--nuit); }
.champ input[aria-invalid=true]{ border-color:var(--amber); box-shadow:0 0 0 2px var(--amber); }
.champ-case{ display:grid; grid-template-columns:28px 1fr; column-gap:10px; align-items:start; }
.champ-case input{ width:24px; height:24px; margin:2px 0 0; accent-color:var(--amber); }
.champ-case label{ font-weight:700; margin:0; }
.champ-case .aide,.champ-case .erreur{ grid-column:2; }
.aide{ font-size:.875rem; margin:6px 0 0; color:var(--cream); }
.aide-bas{ margin-top:20px; }
.erreur{ font-size:.9375rem; font-weight:700; color:var(--cream); margin:8px 0 0; padding:6px 10px; border-left:4px solid var(--amber); background:var(--poivre); }
.erreur-globale{ margin-top:16px; }
.pot{ position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
.turnstile{ margin:4px 0 20px; min-height:65px; }
.merci{ margin-top:28px; padding:24px; border:1px solid var(--lichen); border-radius:4px; }
.merci h3{ font-size:1.5rem; }
.merci p{ margin:0; }

/* Pied de page */
.pied{ background:var(--nuit); color:var(--cream); padding:40px 16px; font-size:.9375rem; }
.pied a{ color:var(--cream); }
.pied p{ margin:0 0 8px; }
.pied-grille{ display:grid; grid-template-columns:1fr; gap:24px; }
.wordmark-pied{ font-family:'Overlock',Georgia,serif; font-weight:900; font-size:1.5rem; }

/* Pages légales */
.page-legale{ padding:40px 16px 64px; }
.page-legale h1{ font-size:clamp(2rem, 6vw, 2.75rem); }
.page-legale h2{ font-size:1.375rem; margin-top:1.6em; }
.a-completer{ background:var(--amber); color:var(--nuit); font-weight:700; padding:0 4px; border-radius:2px; }
.brouillon{ background:var(--cream-soft); border-left:4px solid var(--clay); padding:14px 18px; margin:0 0 24px; }

@media (min-width:768px){
  .section{ padding:88px 32px; }
  .entete{ padding:16px 32px; }
  .entete-cta{ font-size:1rem; }
  .hero{ padding:64px 32px; }
  .carte-grille{ grid-template-columns:1fr 1fr; column-gap:40px; }
  .infos-grille{ grid-template-columns:1fr 1fr; column-gap:40px; }
  .pied{ padding:48px 32px; }
  .pied-grille{ grid-template-columns:2fr 1fr 1fr; }
  .citation p{ font-size:2rem; }
}
@media (min-width:1100px){
  .carte-grille{ grid-template-columns:1fr 1fr 1fr; }
  .compteur{ gap:14px; }
}
@media print{
  .bandeau,.entete-cta,.formulaire,.turnstile{ display:none; }
}