/* ===== Dialogues — styles communs (nav, footer, base) ===== */
:root {
  --emeraude: #0e2b21;
  --emeraude-light: #16402f;
  --marbre: #f2ede2;
  --or: #b99a5b;
  --or-dim: #8a7040;
  --encre: #1a1712;
  --line: rgba(185,154,91,0.28);
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  background: var(--marbre); color: var(--encre);
  font-family: 'Work Sans', sans-serif; font-weight: 300; font-size: 17px; line-height: 1.7;
  overflow-x: hidden;
}
.display { font-family: 'Bodoni Moda', serif; font-weight: 500; }
a { color: inherit; text-decoration: none; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible {
  outline: 2px solid var(--or); outline-offset: 2px;
}
.container { max-width: 1000px; margin: 0 auto; padding: 0 40px; }
.eyebrow {
  display: block; font-size: 13px; letter-spacing: 0.24em; text-transform: uppercase;
  color: var(--or-dim); margin-bottom: 16px; font-weight: 500;
}

/* NAV */
nav { position: sticky; top: 0; z-index: 50; background: rgba(14,43,33,0.96); backdrop-filter: blur(6px); }
nav .container { display: flex; align-items: center; justify-content: space-between; height: 88px; }
.logo { color: var(--marbre); font-size: 24px; letter-spacing: 0.06em; }
.logo-img { height: 46px; display: block; width: auto; }
@media (max-width: 760px) { .logo-img { height: 38px; } }
.nav-links { display: flex; align-items: center; gap: 34px; }
.nav-links a:not(.nav-cta) { color: var(--marbre); opacity: 0.85; font-size: 14px; letter-spacing: 0.05em; transition: 0.25s; }
.nav-links a:not(.nav-cta):hover { opacity: 1; }
.nav-cta { border: 1px solid var(--or); color: var(--or) !important; font-size: 13px; letter-spacing: 0.1em; text-transform: uppercase; padding: 10px 22px; opacity: 1 !important; transition: 0.25s; }
.nav-cta:hover { background: var(--or); color: var(--emeraude) !important; }
@media (max-width: 760px) { .nav-links a:not(.nav-cta):not(.back) { display: none; } }

.nav-toggle { display: none; background: none; border: none; color: var(--marbre); font-size: 28px; line-height: 1; cursor: pointer; padding: 4px 6px; }
@media (max-width: 760px) {
  .nav-toggle { display: block; }
  .nav-links {
    display: none; position: absolute; top: 100%; left: 0; right: 0;
    background: var(--emeraude); flex-direction: column; align-items: stretch;
    padding: 6px 28px 22px; gap: 0; box-shadow: 0 12px 24px rgba(0,0,0,0.25);
  }
  .nav-links.open { display: flex; }
  .nav-links a:not(.nav-cta) {
    display: block !important; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,0.14);
    opacity: 1; font-size: 15px;
  }
  .nav-links a.nav-cta { margin-top: 16px; text-align: center; }
}

[data-reveal] { opacity: 0; transform: translateY(18px); transition: opacity 0.7s ease, transform 0.7s ease; }
[data-reveal].is-visible { opacity: 1; transform: translateY(0); }
@media (prefers-reduced-motion: reduce) {
  [data-reveal] { opacity: 1; transform: none; transition: none; }
  html { scroll-behavior: auto; }
}

footer { background: var(--encre); color: var(--marbre); padding: 44px 0; text-align: center; }
footer .logo-img { margin: 0 auto 16px; height: 56px; }
footer p { opacity: 0.6; font-size: 13px; font-style: italic; }
footer .foot-links { margin-top: 14px; font-size: 12.5px; opacity: 0.75; }
footer .foot-links a { text-decoration: underline; text-underline-offset: 3px; }
footer .foot-links span { margin: 0 8px; opacity: 0.5; }

/* Secondaire (jamais aussi fort que le CTA principal doré "Réserver") */
.btn-secondary {
  display: inline-block; background: transparent; color: var(--emeraude); font-size: 14px;
  letter-spacing: 0.08em; text-transform: uppercase; padding: 15px 32px; border: 1px solid var(--emeraude);
  transition: 0.25s; cursor: pointer;
}
.btn-secondary:hover { background: var(--emeraude); color: var(--marbre); }
.btn-secondary.on-dark { color: var(--marbre); border-color: var(--or); }
.btn-secondary.on-dark:hover { background: var(--or); color: var(--emeraude); }

/* ===== Bannière cookies ===== */
#cookie-banner {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 200;
  background: var(--encre); color: var(--marbre);
  padding: 18px 20px; display: none;
  box-shadow: 0 -8px 24px rgba(0,0,0,0.25);
}
#cookie-banner.show { display: block; }
#cookie-banner .cb-wrap {
  max-width: 1000px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between;
  gap: 24px; flex-wrap: wrap;
}
#cookie-banner p { font-size: 14px; opacity: 0.85; margin: 0; max-width: 620px; }
#cookie-banner a { text-decoration: underline; }
#cookie-banner .cb-actions { display: flex; gap: 10px; flex-wrap: wrap; }
#cookie-banner button {
  font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase; padding: 10px 20px;
  border-radius: 2px; cursor: pointer; font-family: 'Work Sans', sans-serif;
}
#cookie-banner .cb-accept { background: var(--or); border: 1px solid var(--or); color: var(--emeraude); }
#cookie-banner .cb-refuse { background: transparent; border: 1px solid rgba(242,237,226,0.4); color: var(--marbre); }
@media (max-width: 640px) { #cookie-banner .cb-wrap { flex-direction: column; align-items: flex-start; } }

/* ===== Erreurs de champ (validation formulaire) ===== */
.field.has-error input, .field.has-error select { border-color: #c0554a; }
.field-error { display: none; color: #e08c80; font-size: 12px; margin-top: 6px; }
.field.has-error .field-error { display: block; }

/* ===== Liens réseaux / distinctions (pied de page) ===== */
footer .foot-social { margin-top: 18px; font-size: 12.5px; letter-spacing: 0.1em; text-transform: uppercase; }
footer .foot-social a { color: var(--or); opacity: 0.95; }
footer .foot-social a:hover { text-decoration: underline; text-underline-offset: 3px; }
footer .foot-social span { margin: 0 10px; opacity: 0.5; }

/* ===== Boutons de réservation TheFork ===== */
.btn-book {
  display: block; text-align: center; background: var(--or); color: var(--emeraude);
  padding: 14px 18px; font-size: 13.5px; letter-spacing: 0.1em; text-transform: uppercase;
  transition: 0.25s; margin-bottom: 10px; font-weight: 500;
}
.btn-book:hover { background: var(--marbre); }

/* ===== Logo : capitales espacées, filet doré (nav + pied de page) ===== */
.logo-text { font-family: 'Bodoni Moda', 'Didot', Georgia, serif; font-weight: 400; text-transform: uppercase;
  color: var(--marbre); font-size: 19px; letter-spacing: 0.3em; line-height: 1; display: inline-block; white-space: nowrap; }
.logo-text u, .logo-text i { display: none; }
@media (max-width: 760px) { .logo-text { font-size: 16px; letter-spacing: 0.26em; } }
footer .logo-text { display: block; text-align: center; font-size: 30px; letter-spacing: 0.34em; padding-left: 0.34em; margin: 0 auto 4px; }
footer .logo-text u { display: block; width: 46px; height: 1px; background: var(--or); margin: 16px auto 0; text-decoration: none; }
footer .logo-text i { display: block; font-family: 'Work Sans', sans-serif; font-style: normal; font-size: 11px; letter-spacing: 0.5em; padding-left: 0.5em; color: var(--or); margin-top: 14px; }
@media (max-width: 760px) { footer .logo-text { font-size: 24px; } }
