/*
Theme Name: AMME Restaurant
Theme URI: https://amme-restaurant.fr
Description: Thème custom pour le restaurant AMME — Champagne Augustin. Cuisine des éléments.
Version: 2.0
Author: Studio
Text Domain: amme
*/

/* ═══════════════════════════════════════════
   AMME — Design System
   Charte : Mélody Poirier
   Polices fallback : Cormorant (Google Fonts)
   TODO V2 : remplacer par Tomarik (titres) + Garalda (corps) dès licences disponibles
   ═══════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;1,400;1,500&family=Cormorant+Upright:wght@500;600&family=Cormorant+SC:wght@500&display=swap');

:root {
  /* === ANCIENNE PALETTE — alias rétro-compatibilité === */
  --white: #FFFFFF;
  --cream: #F0E8D4;
  --cream-dark: #E8DFC4;
  --chalk: #D8D0BE;
  --earth: #3D3329;
  --earth-mid: #5C4F42;
  --earth-deep: #2A221A;
  --taupe: #8B7B5A;
  --taupe-dim: #8B7B5A;
  --gold: #B8956B;
  --gold-pale: rgba(184,149,107,0.18);
  --noir: #1F1A12;
  --noir-warm: #1F1A12;

  /* === NOUVELLE PALETTE OFFICIELLE AMME === */
  /* Backgrounds papier */
  --amme-cream: #F0E8D4;
  --amme-paper: #E8DFC4;
  --amme-kraft: #C7B98A;

  /* Accents naturels (couleurs des menus PDF) */
  --amme-olive: #6B6B2E;
  --amme-terracotta: #6B2418;
  --amme-stone: #8B7B5A;

  /* Encre */
  --amme-ink: #1F1A12;
  --amme-ink-soft: #4A3F2E;
  --amme-ink-muted: rgba(31, 26, 18, 0.55);

  /* Or — accent rare */
  --amme-gold: #B8956B;

  /* Bordures */
  --amme-rule: rgba(31, 26, 18, 0.18);

  /* === TYPOGRAPHIE === */
  --font-serif: 'Cormorant Garamond', Georgia, serif;
  --font-sans: 'Cormorant Garamond', Georgia, serif;
  --font-display: 'Cormorant Upright', 'Cormorant Garamond', Georgia, serif;
  --font-body: 'Cormorant Garamond', Georgia, serif;
  --font-meta: 'Cormorant SC', Georgia, serif;

  /* Easings */
  --ease-expo: cubic-bezier(0.77, 0, 0.175, 1);
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; overflow-x:hidden; }
body {
  font-family: var(--font-body);
  font-weight: 400;
  color: var(--amme-ink-soft);
  background: var(--amme-cream);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}
a { text-decoration:none; color:inherit; }
img { display:block; max-width:100%; }
ul, ol { list-style:none; }
button { cursor:pointer; border:none; background:none; font:inherit; }

/* ─── REVEAL SYSTEM ─── */
.rv {
  will-change: transform, clip-path;
  transition-property: transform, clip-path;
  transition-duration: 1.1s;
  transition-timing-function: var(--ease-expo);
  transition-delay: var(--rv-delay, 0s);
}
.rv-up { clip-path: inset(100% 0 0 0); transform: translateY(40px); }
.rv-up.rv-in { clip-path: inset(0); transform: translateY(0); }
.rv-left { clip-path: inset(0 100% 0 0); transform: translateX(-30px); }
.rv-left.rv-in { clip-path: inset(0); transform: translateX(0); }
.rv-right { clip-path: inset(0 0 0 100%); transform: translateX(30px); }
.rv-right.rv-in { clip-path: inset(0); transform: translateX(0); }
.rv-scale { clip-path: inset(8%); transform: scale(0.94); }
.rv-scale.rv-in { clip-path: inset(0); transform: scale(1); }
.rv-line { transform: scaleX(0); transform-origin: left; }
.rv-line.rv-in { transform: scaleX(1); }

/* ─── NAVIGATION ─── */
.nav {
  position: fixed; top:0; left:0; right:0; z-index:1000;
  display: flex; align-items:center; justify-content:space-between;
  padding: 28px 56px;
  transition: all 0.6s var(--ease-out-expo);
  mix-blend-mode: difference;
}
.nav.scrolled {
  mix-blend-mode: normal;
  padding: 14px 56px;
  background: rgba(31,26,18,0.94);
  -webkit-backdrop-filter: blur(24px);
  backdrop-filter: blur(24px);
}
.nav-logo {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 1.15rem;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: var(--white);
}
.nav-items { display: flex; align-items:center; gap:2.8rem; }
.nav-items a {
  font-family: var(--font-meta);
  font-weight: 500;
  font-size: 0.72rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--white);
  position: relative;
}
.nav-items a::after {
  content:''; position:absolute; bottom:-4px; left:0; width:100%;
  height:1px; background:var(--amme-gold);
  transform:scaleX(0); transform-origin:right;
  transition: transform 0.5s var(--ease-expo);
}
.nav-items a:hover::after { transform:scaleX(1); transform-origin:left; }
.nav-cta {
  padding: 0.55rem 1.8rem !important;
  border: 1px solid rgba(254,252,248,0.3) !important;
  transition: background 0.4s ease, border-color 0.4s ease !important;
}
.nav-cta:hover { background: rgba(254,252,248,0.08); border-color: rgba(254,252,248,0.5); }
.nav-cta::after { display:none !important; }

.burger {
  display: none; flex-direction: column; gap:5px; padding:6px; z-index:1001;
}
.burger span {
  display:block; width:24px; height:1px;
  background:var(--white); transition:all 0.4s ease;
}
.burger.open span:nth-child(1) { transform:rotate(45deg) translate(3px,3px); }
.burger.open span:nth-child(2) { opacity:0; }
.burger.open span:nth-child(3) { transform:rotate(-45deg) translate(3px,-3px); }

.mob-nav {
  display:none; position:fixed; inset:0; z-index:999;
  background:rgba(31,26,18,0.97);
  flex-direction:column; align-items:center; justify-content:center; gap:2.5rem;
}
.mob-nav.open { display:flex; }
.mob-nav a {
  font-family:var(--font-display); font-weight:500;
  font-size:2rem; letter-spacing:0.12em; color:var(--white);
}
.mob-nav a:hover { color:var(--amme-gold); }

@media(max-width:900px) {
  .nav { padding:18px 24px; }
  .nav.scrolled { padding:12px 24px; }
  .nav-items { display:none; }
  .burger { display:flex; }
}

/* ─── SHARED COMPONENTS ─── */
.lbl {
  font-family:var(--font-meta); font-weight:500;
  font-size:0.68rem; letter-spacing:0.35em;
  text-transform:uppercase; margin-bottom:1.5rem;
}
.lbl-light { color:var(--amme-stone); }
.lbl-dark { color:var(--amme-stone); }
.gold-line { width:48px; height:1px; background:var(--amme-rule); margin-bottom:2.2rem; }
.s-pad { padding:8rem 3.5rem; max-width:1400px; margin:0 auto; }

.s-title {
  font-family:var(--font-display); font-weight:500;
  font-size:clamp(1.8rem,4vw,3rem); letter-spacing:0.05em;
  line-height:1.2; margin-bottom:1.8rem;
  color:var(--amme-ink);
}
.s-body {
  font-family:var(--font-body); font-weight:400;
  font-size:0.95rem; line-height:1.85; max-width:520px;
  color:var(--amme-ink-soft);
}
.s-link {
  display:inline-flex; align-items:center; gap:0.7rem;
  font-family:var(--font-meta); font-weight:500;
  font-size:0.72rem; letter-spacing:0.18em;
  text-transform:uppercase; color:var(--amme-stone); margin-top:2.5rem;
  transition: gap 0.5s var(--ease-expo);
}
.s-link:hover { gap:1.2rem; }
.s-link svg { width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:1.5; }

.btn-main {
  display:inline-block; padding:1.1rem 3.2rem;
  font-family:var(--font-meta); font-weight:500;
  font-size:0.72rem; letter-spacing:0.28em; text-transform:uppercase;
  color:var(--amme-cream); background:var(--amme-ink); border:none;
  transition: background 0.4s ease;
}
.btn-main:hover { background:var(--amme-terracotta); }

.grain {
  position:absolute; inset:0; pointer-events:none; opacity:0.03;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:128px;
}

/* ─── PAGE HERO ─── */
.page-hero {
  position:relative; height:55vh; min-height:420px;
  display:flex; align-items:flex-end; overflow:hidden;
}
.page-hero-bg { position:absolute; inset:0; background-size:cover; background-position:center 55%; }
.page-hero-grad {
  position:absolute; inset:0;
  background:linear-gradient(0deg, rgba(31,26,18,0.92) 0%, rgba(31,26,18,0.35) 50%, rgba(31,26,18,0.55) 100%);
}
.page-hero-content { position:relative; z-index:2; padding:4rem 3.5rem; max-width:800px; }
.page-hero-label {
  font-family:var(--font-meta); font-weight:500;
  font-size:0.68rem; letter-spacing:0.35em; text-transform:uppercase;
  color:var(--amme-stone); margin-bottom:1.2rem;
}
.page-hero-title {
  font-family:var(--font-display); font-weight:500;
  font-size:clamp(2.5rem,6vw,4.5rem); letter-spacing:0.08em;
  line-height:1.1; color:var(--white);
}

/* ─── FOOTER ─── */
.ft { background:var(--amme-ink); padding:5rem 3.5rem 2.5rem; text-align:center; }
.ft-logo {
  font-family:var(--font-display); font-weight:500;
  font-size:1.6rem; letter-spacing:0.38em; text-transform:uppercase;
  text-indent:0.38em; color:var(--amme-cream); margin-bottom:0.4rem;
}
.ft-sub {
  font-family:var(--font-meta); font-weight:500;
  font-size:0.62rem; letter-spacing:0.3em; text-transform:uppercase;
  color:var(--amme-stone); margin-bottom:3rem;
}
.ft-addr {
  font-family:var(--font-body); font-weight:400;
  font-size:0.7rem; letter-spacing:0.1em;
  color:var(--amme-stone); opacity:0.6; margin-bottom:2rem; line-height:1.8;
}
.ft-links { display:flex; justify-content:center; gap:2.8rem; flex-wrap:wrap; margin-bottom:3rem; }
.ft-links a {
  font-family:var(--font-meta); font-weight:500;
  font-size:0.68rem; letter-spacing:0.2em; text-transform:uppercase;
  color:var(--amme-stone); transition:color 0.3s ease;
}
.ft-links a:hover { color:var(--amme-cream); }
.ft-rule { width:50px; height:1px; background:rgba(139,123,90,0.25); margin:0 auto 2rem; }
.ft-certs { display:flex; justify-content:center; gap:2rem; flex-wrap:wrap; margin-bottom:2rem; }
.ft-certs span {
  font-family:var(--font-meta); font-weight:500;
  font-size:0.6rem; letter-spacing:0.2em; text-transform:uppercase;
  color:var(--amme-stone); opacity:0.5;
}
.ft-copy {
  font-family:var(--font-body); font-weight:400;
  font-size:0.6rem; letter-spacing:0.1em;
  color:var(--amme-stone); opacity:0.35;
}

@media(max-width:900px) {
  .s-pad { padding:5rem 1.5rem; }
  .page-hero { height:45vh; min-height:340px; }
  .page-hero-content { padding:2.5rem 1.5rem; }
  .ft { padding:3rem 1.5rem 2rem; }
  .ft-links { gap:1.5rem; }
}

/* ═══════════════════════════════════════════
   CHARTE AMME — Mélody Poirier (Phase 2)
   ═══════════════════════════════════════════ */

/* Hiérarchie typo refondue */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  font-weight: 500;
  letter-spacing: 0.02em;
  /* color hérite du parent — pas forcé globalement */
}

/* Sections claires — titres en encre */
body { color: var(--amme-ink-soft); }
body h1, body h2, body h3, body h4, body h5, body h6 { color: var(--amme-ink); }

/* Sections sombres — titres et texte en crème */
.s-dark, .q-band, .pillars, .ft, .page-hero-content, .mob-nav,
.amme-domaine-section,
.amme-section--dark {
  color: var(--amme-cream);
}
.s-dark h1, .s-dark h2, .s-dark h3, .s-dark h4,
.q-band h1, .q-band h2, .q-band h3,
.pillars h1, .pillars h2, .pillars h3,
.ft h1, .ft h2, .ft h3,
.page-hero-content h1, .page-hero-content h2,
.amme-domaine-section h1, .amme-domaine-section h2,

.amme-section--dark h1, .amme-section--dark h2, .amme-section--dark h3 {
  color: var(--amme-cream);
}

/* Étiquettes / small caps universelles */
.amme-eyebrow,
.amme-label {
  font-family: var(--font-meta);
  font-size: 0.75rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--amme-stone);
  font-weight: 500;
}

/* Boutons unifiés */
.amme-btn-primary {
  background: var(--amme-ink);
  color: var(--amme-cream);
  font-family: var(--font-meta);
  font-size: 0.75rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  padding: 16px 40px;
  border: none;
  display: inline-block;
  text-decoration: none;
  transition: all 400ms ease;
  cursor: pointer;
}
.amme-btn-primary:hover {
  background: var(--amme-terracotta);
}

.amme-btn-outline {
  background: transparent;
  color: var(--amme-ink);
  border: 1px solid var(--amme-ink);
  font-family: var(--font-meta);
  font-size: 0.75rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  padding: 15px 39px;
  display: inline-block;
  text-decoration: none;
  transition: all 400ms ease;
  cursor: pointer;
}
.amme-btn-outline:hover {
  background: var(--amme-ink);
  color: var(--amme-cream);
}

/* Séparateurs */
.amme-rule {
  width: 60px;
  height: 1px;
  background: var(--amme-rule);
  margin: 32px auto;
  border: none;
}

/* Logos officiels */
.amme-logo-seal {
  width: 64px;
  height: auto;
  display: block;
  margin: 0 auto;
}
.amme-logo-seal--small { width: 48px; }
.amme-logo-seal--large { width: 96px; }

.amme-logo-lockup {
  width: 240px;
  height: auto;
  display: block;
  margin: 0 auto;
}
.amme-logo-lockup--hero { width: 320px; }

/* Liens corps de texte */
p a {
  color: var(--amme-terracotta);
  text-decoration: none;
  border-bottom: 1px solid currentColor;
  transition: color 200ms ease;
}
p a:hover {
  color: var(--amme-ink);
}

/* Texture papier subtile globale */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  opacity: 0.035;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
body > * {
  position: relative;
  z-index: 2;
}

/* Responsive typo */
@media (max-width: 768px) {
  h1 { font-size: clamp(2rem, 8vw, 3rem); }
}

.amme-footer-seal {
  text-align: center; margin: 0 auto 24px;
  padding: 0; line-height: 0;
}
.amme-logo-seal--footer {
  width: 56px; height: auto; display: inline-block;
  filter: brightness(0) invert(1) opacity(0.6);
  transition: opacity 200ms ease;
}
.amme-logo-seal--footer:hover { opacity: 0.85; }
@media (max-width: 768px) {
  .amme-logo-seal--footer { width: 48px; }
}

/* ─── P1-B: MASQUER PHOTOS STOCK UNSPLASH ─── */
/* TODO réactiver après shoot photo Amme post-vendange */
.concept-img-accent,
.engage-img-accent {
  display: none !important;
}

/* ─── P1-C: CTA MENUS TOUJOURS VISIBLE EN MOBILE ─── */
@media (max-width: 768px) {
  .amme-card-cta {
    opacity: 1 !important;
    transform: translateY(0) !important;
  }
}

/* ─── FIX 2: HEADER SCEAU SEUL (remplace lockup) ─── */
.amme-logo-seal--header {
  width: 56px;
  height: auto;
  display: block;
  transition: opacity 200ms ease;
}
.amme-logo-seal--header:hover { opacity: 0.75; }
.nav.scrolled .amme-logo-seal--header {
  filter: brightness(0) invert(1) opacity(0.9);
}
@media (max-width: 768px) {
  .amme-logo-seal--header { width: 44px; }
}

/* ─── FIX 5: STICKY CTA RÉSERVATION ─── */
.amme-sticky-cta {
  position: fixed;
  bottom: 32px;
  right: 32px;
  z-index: 100;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 600ms cubic-bezier(0.65, 0, 0.35, 1),
              transform 600ms cubic-bezier(0.65, 0, 0.35, 1);
  pointer-events: none;
}
.amme-sticky-cta.is-visible {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.amme-sticky-cta__link {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 18px 32px;
  background: var(--amme-ink);
  color: var(--amme-cream);
  font-family: var(--font-meta);
  font-size: 0.75rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  text-decoration: none;
  border: 1px solid var(--amme-ink);
  transition: all 400ms cubic-bezier(0.65, 0, 0.35, 1);
  box-shadow: 0 12px 40px -8px rgba(31, 26, 18, 0.4);
}
.amme-sticky-cta__link:hover {
  background: var(--amme-terracotta);
  border-color: var(--amme-terracotta);
  transform: translateY(-2px);
  box-shadow: 0 16px 48px -8px rgba(107, 36, 24, 0.5);
}
.amme-sticky-cta__icon {
  display: inline-flex;
  align-items: center;
  transition: transform 400ms cubic-bezier(0.65, 0, 0.35, 1);
}
.amme-sticky-cta__link:hover .amme-sticky-cta__icon {
  transform: translateX(4px);
}
@media (max-width: 768px) {
  .amme-sticky-cta {
    bottom: 24px;
    right: 24px;
    left: 24px;
  }
  .amme-sticky-cta__link {
    width: 100%;
    justify-content: center;
    padding: 16px 24px;
    font-size: 0.7rem;
  }
}
/* Hide sticky CTA on contact page */
.page-template-page-contact .amme-sticky-cta,
.page-id-54 .amme-sticky-cta {
  display: none;
}
/* Hide sticky CTA on teasing page */
.page-template-page-teasing .amme-sticky-cta,
.page-id-56 .amme-sticky-cta {
  display: none;
}

/* ─── FALLBACK: show content if JS is disabled or fails ─── */
@media (prefers-reduced-motion: reduce) {
  .rv { clip-path: none !important; transform: none !important; opacity: 1 !important; }
}