/* ——— LE PETIT PROVENÇAL — Design v2 ——— */

:root {
  --cream:      #F5EDDB;
  --cream-mid:  #EDE0C3;
  --brown:      #1C1108;
  --brown-mid:  #4A2E18;
  --terra:      #C4522A;
  --terra-dk:   #9C3D1A;
  --olive:      #3A4F2C;
  --ochre:      #C9893A;
  --white:      #FBF7EE;
  --black:      #0E0A04;

  --serif:  'Fraunces', Georgia, serif;
  --sans:   'Plus Jakarta Sans', system-ui, sans-serif;

  --pad-v: clamp(5rem, 9vw, 9rem);
  --wrap:  min(1200px, 92vw);
}

/* ——— RESET ——— */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; scroll-padding-top: 72px; }
body { font-family: var(--sans); background: var(--cream); color: var(--brown); overflow-x: hidden; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
a, button { touch-action: manipulation; }

:focus-visible { outline: 2px solid var(--terra); outline-offset: 2px; border-radius: 1px; }

/* ——— CURSOR CUSTOM (desktop only) ——— */
.cursor-dot {
  position: fixed;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--terra);
  pointer-events: none;
  z-index: 9999;
  transform: translate(-50%, -50%);
  transition: transform 0.08s, width 0.25s, height 0.25s, opacity 0.25s;
  mix-blend-mode: multiply;
}

.cursor-ring {
  position: fixed;
  width: 36px; height: 36px;
  border-radius: 50%;
  border: 1px solid rgba(196, 82, 42, 0.5);
  pointer-events: none;
  z-index: 9998;
  transform: translate(-50%, -50%);
  transition: transform 0.18s ease-out, width 0.3s ease, height 0.3s ease, border-color 0.3s;
}

.cursor-dot.expand  { width: 48px; height: 48px; opacity: 0.3; }
.cursor-ring.expand { width: 64px; height: 64px; border-color: var(--terra); }

@media (hover: none) {
  .cursor-dot, .cursor-ring { display: none; }
}

/* ——— GRAIN OVERLAY ——— */
.grain::after {
  content: '';
  position: absolute; inset: 0;
  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.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.4'/%3E%3C/svg%3E");
  opacity: 0.04;
  pointer-events: none;
  z-index: 1;
  animation: grain 0.6s steps(2) infinite;
}
@keyframes grain {
  0%,100% { transform: translate(0,0) }
  25%      { transform: translate(-2%,1%) }
  50%      { transform: translate(1%,-2%) }
  75%      { transform: translate(2%,2%) }
}

/* ——— RIDEAU D'OUVERTURE ——— */
.curtain {
  position: fixed; inset: 0;
  z-index: 200;
  display: flex;
  pointer-events: none;
}
.curtain-left, .curtain-right {
  flex: 1;
  background: var(--black);
  transition: transform 1.1s cubic-bezier(0.77, 0, 0.175, 1);
}
.curtain-left  { transform-origin: left;  }
.curtain-right { transform-origin: right; }

.curtain.open .curtain-left  { transform: translateX(-100%); }
.curtain.open .curtain-right { transform: translateX(100%); }

.curtain-text {
  position: fixed;
  inset: 0;
  z-index: 201;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  transition: opacity 0.4s ease;
}
.curtain-text.hidden { opacity: 0; }
.curtain-logo {
  font-family: var(--serif);
  font-size: clamp(1.6rem, 4vw, 3rem);
  font-weight: 300;
  color: var(--white);
  letter-spacing: 0.08em;
  text-align: center;
  line-height: 1.3;
}

/* ——— HEADER ——— */
.site-header {
  position: fixed; top: 0; left: 0; right: 0;
  z-index: 100;
  padding: 1.1rem clamp(1.5rem, 5vw, 3rem);
  display: flex; align-items: center; justify-content: space-between;
  transition: background 0.4s, box-shadow 0.4s;
}
.site-header.scrolled {
  background: rgba(245, 237, 219, 0.96);
  backdrop-filter: blur(8px);
  box-shadow: 0 1px 0 rgba(28,17,8,0.08);
}
.logo {
  font-family: var(--serif);
  font-size: 1rem; font-weight: 300;
  letter-spacing: 0.05em;
  color: var(--brown);
  transition: color 0.3s;
}
.site-header.on-hero .logo { color: var(--white); }

.site-nav { display: none; gap: 2.2rem; }
@media (min-width: 768px) { .site-nav { display: flex; } }

.nav-link {
  font-size: 0.72rem; font-weight: 400;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--brown); opacity: 0.65;
  transition: opacity 0.2s, color 0.2s;
}
.nav-link:hover { opacity: 1; color: var(--terra); }
.site-header.on-hero .nav-link { color: var(--white); opacity: 0.7; }
.site-header.on-hero .nav-link:hover { opacity: 1; color: var(--ochre); }

.btn-resa {
  font-size: 0.7rem; font-weight: 500;
  letter-spacing: 0.12em; text-transform: uppercase;
  padding: 0.55rem 1.3rem;
  border: 1px solid currentColor;
  color: var(--brown);
  display: inline-flex; align-items: center; min-height: 44px;
  transition: background 0.25s, color 0.25s, border-color 0.25s;
}
.btn-resa:hover { background: var(--terra); border-color: var(--terra); color: var(--white); }
.site-header.on-hero .btn-resa { color: var(--white); border-color: rgba(251,247,238,0.5); }
.site-header.on-hero .btn-resa:hover { background: var(--terra); border-color: var(--terra); }

/* ——— HERO ——— */
.hero {
  position: relative; height: 100svh; min-height: 620px;
  display: flex; align-items: flex-end;
  overflow: hidden;
}
.hero-bg {
  position: absolute; inset: 0;
  background: var(--black) url('images/hero.webp') center 38% / cover no-repeat;
  will-change: transform;
}
.hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(
    160deg,
    rgba(14,10,4,0.68) 0%,
    rgba(14,10,4,0.2) 45%,
    rgba(14,10,4,0.55) 100%
  );
}
.hero-content {
  position: relative; z-index: 2;
  padding: clamp(3rem,6vw,5rem) clamp(1.5rem,6vw,5rem);
  max-width: 820px;
}
.hero-badge {
  display: inline-flex; align-items: center; gap: 0.5rem;
  font-size: 0.65rem; font-weight: 500;
  letter-spacing: 0.28em; text-transform: uppercase;
  color: var(--ochre); margin-bottom: 1.8rem;
}
.hero-badge::before {
  content: '';
  display: block; width: 28px; height: 1px;
  background: var(--ochre); opacity: 0.6;
}
.hero-title {
  font-family: var(--serif);
  font-size: clamp(3.2rem, 9vw, 8rem);
  font-weight: 300; font-optical-sizing: auto;
  line-height: 0.92; color: var(--white);
  margin-bottom: 1.8rem;
  overflow: hidden;
}
.hero-title .line { display: block; }
.hero-title em { font-style: italic; color: var(--ochre); }

.hero-sub {
  font-size: clamp(0.85rem, 1.3vw, 0.97rem);
  color: rgba(251,247,238,0.65); font-weight: 300; line-height: 1.8;
  max-width: 440px; margin-bottom: 2.8rem;
}
.hero-actions { display: flex; flex-wrap: wrap; gap: 1rem; }

.btn-primary {
  display: inline-flex; align-items: center;
  padding: 0.9rem 2.2rem; min-height: 44px;
  background: var(--terra); color: var(--white);
  font-size: 0.74rem; font-weight: 500;
  letter-spacing: 0.12em; text-transform: uppercase;
  transition: background 0.25s, transform 0.2s;
}
.btn-primary:hover { background: var(--terra-dk); transform: translateY(-1px); }

.btn-outline {
  display: inline-flex; align-items: center;
  padding: 0.9rem 2.2rem; min-height: 44px;
  border: 1px solid rgba(251,247,238,0.38); color: var(--white);
  font-size: 0.74rem; font-weight: 300;
  letter-spacing: 0.12em; text-transform: uppercase;
  transition: border-color 0.25s, background 0.25s;
}
.btn-outline:hover { border-color: rgba(251,247,238,0.7); background: rgba(251,247,238,0.06); }

.hero-scroll-line {
  position: absolute; bottom: 2.5rem; right: clamp(1.5rem,5vw,3rem);
  z-index: 2;
  display: flex; flex-direction: column; align-items: center; gap: 0.7rem;
  color: rgba(251,247,238,0.4);
  font-size: 0.58rem; letter-spacing: 0.28em; text-transform: uppercase;
}
.hero-scroll-line span {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
}
.hero-scroll-line::after {
  content: '';
  width: 1px; height: 60px;
  background: rgba(251,247,238,0.25);
  animation: scrollpulse 2s ease-in-out infinite;
}
@keyframes scrollpulse {
  0%,100% { transform: scaleY(0.3); opacity: 0.4; }
  50%      { transform: scaleY(1);   opacity: 1; }
}

/* ——— FACADE BAND ——— */
.facade-band {
  position: relative;
  height: clamp(140px, 22vw, 260px);
  overflow: hidden;
  background: var(--black);
}
.facade-band img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center 30%;
  opacity: 0.85;
  filter: sepia(0.2) contrast(1.08);
}
.facade-band-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to right, rgba(14,10,4,0.55) 0%, transparent 40%, rgba(14,10,4,0.4) 100%);
}
.facade-band-caption {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--serif);
  font-size: clamp(0.75rem, 1.5vw, 1rem);
  font-weight: 300; letter-spacing: 0.35em;
  text-transform: uppercase; color: rgba(251,247,238,0.65);
  z-index: 2;
}

/* ——— SECTION COMMONS ——— */
.section { padding: var(--pad-v) 0; }
.container { width: var(--wrap); margin: 0 auto; }

.eyebrow {
  font-size: 0.66rem; font-weight: 500;
  letter-spacing: 0.3em; text-transform: uppercase;
  color: var(--terra); display: block; margin-bottom: 1.4rem;
}

/* ——— LIEU ——— */
.lieu { background: var(--cream); }
.lieu-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem; align-items: start;
}
@media (min-width: 768px) {
  .lieu-grid { grid-template-columns: 1fr 1fr; gap: clamp(3rem,7vw,8rem); align-items: center; }
}

.lieu-title {
  font-family: var(--serif);
  font-size: clamp(2.2rem, 4.5vw, 4rem);
  font-weight: 300; line-height: 1.05;
  margin-bottom: 1.6rem;
}
.lieu-body {
  font-size: 0.95rem; font-weight: 300;
  line-height: 1.85; color: var(--brown-mid);
  margin-bottom: 1.1rem;
}
.lieu-label {
  display: inline-flex; align-items: center; gap: 0.55rem;
  margin-top: 2rem;
  padding: 0.65rem 1.1rem;
  border: 1px solid var(--terra);
  color: var(--terra); font-size: 0.76rem;
  font-weight: 500; letter-spacing: 0.04em;
}

/* Photos lieu : empilement décalé */
.lieu-photos { position: relative; }
.lieu-photo-main {
  width: 100%; aspect-ratio: 4/3;
  overflow: hidden;
  background: var(--cream-mid);
}
.lieu-photo-main img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform 0.8s cubic-bezier(0.25,1,0.5,1);
}
.lieu-photo-main:hover img { transform: scale(1.04); }

.lieu-photo-inset {
  position: absolute; bottom: -2rem; right: -1.5rem;
  width: 50%; aspect-ratio: 3/4;
  overflow: hidden;
  background: var(--brown-mid);
  border: 4px solid var(--cream);
  display: none;
}
@media (min-width: 768px) { .lieu-photo-inset { display: block; } }
.lieu-photo-inset img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform 0.8s cubic-bezier(0.25,1,0.5,1);
}
.lieu-photo-inset:hover img { transform: scale(1.06); }

/* ——— GALERIE ——— */
.galerie { background: var(--black); padding: var(--pad-v) 0; }
.galerie .eyebrow { color: var(--ochre); }
.galerie-title {
  font-family: var(--serif);
  font-size: clamp(2rem,4vw,3.2rem);
  font-weight: 300; line-height: 1.1;
  color: var(--white); margin-bottom: clamp(2rem,4vw,3.5rem);
}

.galerie-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto;
  gap: 0.5rem;
}
@media (min-width: 640px) {
  .galerie-grid {
    grid-template-columns: 2fr 1fr 1fr;
    grid-template-rows: 280px 200px;
    gap: 0.6rem;
  }
  .galerie-item:first-child { grid-row: 1 / 3; }
}
@media (min-width: 1024px) {
  .galerie-grid { grid-template-rows: 360px 260px; }
}

@media (max-width: 639px) {
  .galerie-item:first-child { grid-column: span 2; aspect-ratio: 16/9; }
}

.galerie-item {
  overflow: hidden; position: relative;
  aspect-ratio: 1;
  background: #1a130a;
  cursor: pointer;
}
@media (min-width: 640px) { .galerie-item { aspect-ratio: unset; } }

.galerie-item img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform 0.75s cubic-bezier(0.25,1,0.5,1), filter 0.4s;
  filter: brightness(0.88) saturate(0.9);
}
.galerie-item:hover img { transform: scale(1.06); filter: brightness(1) saturate(1); }

.galerie-item-cap {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 1.4rem 1rem 1rem;
  background: linear-gradient(transparent, rgba(14,10,4,0.82));
  font-size: 0.72rem; font-weight: 400;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: rgba(251,247,238,0.65);
  opacity: 0.42;
  transition: opacity 0.3s;
}
.galerie-item:hover .galerie-item-cap { opacity: 1; }

/* ——— CARTE ——— */
.carte { background: var(--brown); color: var(--cream); }
.carte .eyebrow { color: var(--ochre); }

.carte-top {
  display: flex; flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
  gap: 1.5rem;
  margin-bottom: clamp(2.5rem,5vw,5rem);
}
.carte-title {
  font-family: var(--serif);
  font-size: clamp(2rem,4vw,3.5rem);
  font-weight: 300; line-height: 1.05;
  color: var(--white); flex: 1; min-width: 260px;
}
.carte-note {
  font-size: 0.82rem; font-weight: 300;
  color: rgba(245,237,219,0.6); max-width: 300px;
  line-height: 1.7;
}

.carte-cols {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.5rem 8%;
}
@media (min-width: 680px) { .carte-cols { grid-template-columns: 1fr 1fr; } }

.carte-cat-title {
  font-size: 0.64rem; font-weight: 500;
  letter-spacing: 0.28em; text-transform: uppercase;
  color: var(--ochre); margin-bottom: 1.6rem;
  padding-bottom: 0.8rem;
  border-bottom: 1px solid rgba(245,237,219,0.1);
}

/* Cursor preview sur les plats */
#dish-preview {
  position: fixed;
  width: 200px; height: 145px;
  pointer-events: none; z-index: 500;
  background-size: cover; background-position: center;
  background-color: var(--brown-mid);
  opacity: 0; transform: scale(0.88) rotate(-3deg);
  transition: opacity 0.25s ease, transform 0.25s ease;
  border: 2px solid rgba(245,237,219,0.12);
  display: none;
}
#dish-preview.show { opacity: 1; transform: scale(1) rotate(0deg); }
@media (hover: hover) { #dish-preview { display: block; } }

.dish-row {
  display: flex; align-items: baseline;
  justify-content: space-between; gap: 0.8rem;
  padding: 0.85rem 0;
  border-bottom: 1px solid rgba(245,237,219,0.06);
  cursor: default;
  transition: color 0.2s;
}
.dish-row[data-img] { cursor: pointer; }
.dish-row:last-child { border-bottom: none; }
.dish-row:hover { color: var(--ochre); }
.dish-row:hover .dish-desc { color: rgba(201,137,58,0.62); }

.dish-name {
  font-family: var(--serif);
  font-size: 1rem; font-weight: 300; font-style: italic;
  line-height: 1.2; flex: 1;
}
.dish-desc {
  font-size: 0.72rem; color: rgba(245,237,219,0.54);
  font-weight: 300; margin-top: 0.2rem; font-style: normal;
  transition: color 0.2s;
}
.dish-price {
  font-size: 0.82rem; font-weight: 400;
  color: var(--ochre); white-space: nowrap; flex-shrink: 0;
}

.carte-formule {
  margin-top: 3.5rem;
  display: flex; flex-wrap: wrap;
  justify-content: space-between; align-items: center;
  gap: 2rem;
  padding: 2rem 2.5rem;
  border: 1px solid rgba(201,137,58,0.25);
  background: rgba(201,137,58,0.04);
}
.carte-formule-label {
  font-family: var(--serif);
  font-size: 1.4rem; font-weight: 300; color: var(--white);
  margin-bottom: 0.3rem;
}
.carte-formule-detail {
  font-size: 0.82rem; color: rgba(245,237,219,0.54);
  font-weight: 300; line-height: 1.7;
}
.carte-formule-price {
  font-family: var(--serif);
  font-size: clamp(1.9rem, 3.5vw, 2.6rem); font-weight: 300; color: var(--ochre); line-height: 1;
}
.carte-formule-unit {
  font-size: 0.7rem; letter-spacing: 0.08em;
  color: rgba(245,237,219,0.48); text-align: right; margin-top: 0.2rem;
}

/* ——— AVIS ——— */
.avis { background: var(--cream-mid); }
.avis .eyebrow { color: var(--terra); }

.avis-scores {
  display: flex; flex-wrap: wrap; gap: 2.5rem;
  margin-bottom: clamp(3rem,6vw,5.5rem);
  padding-bottom: 2rem;
  border-bottom: 1px solid rgba(28,17,8,0.1);
}
.avis-score-num {
  font-family: var(--serif);
  font-size: 2.6rem; font-weight: 300;
  color: var(--terra); line-height: 1;
}
.avis-score-label {
  font-size: 0.78rem; color: var(--brown-mid);
  font-weight: 300; line-height: 1.5; margin-top: 0.2rem;
}
.avis-score-label strong {
  display: block; font-weight: 500; color: var(--brown);
}

/* Citations en grand */
.avis-featured {
  margin-bottom: 3rem;
  padding: 3rem clamp(1.5rem,5vw,4rem);
  background: var(--white);
  position: relative;
}
.avis-featured::before {
  content: '\201C';
  position: absolute; top: 0.5rem; left: clamp(1rem,4vw,2.5rem);
  font-family: var(--serif);
  font-size: clamp(6rem,12vw,10rem); line-height: 1;
  color: var(--terra); opacity: 0.09;
  pointer-events: none; user-select: none;
}
.avis-featured blockquote {
  font-family: var(--serif);
  font-size: clamp(1.15rem, 2.2vw, 1.55rem);
  font-weight: 300; font-style: italic;
  line-height: 1.6; color: var(--brown);
  max-width: 860px; position: relative; z-index: 1;
  margin-bottom: 1.5rem;
}
.avis-featured-meta {
  font-size: 0.78rem; font-weight: 400;
  color: var(--brown-mid); letter-spacing: 0.04em;
}
.avis-featured-meta strong { color: var(--terra); font-weight: 500; }

.avis-stars { color: var(--ochre); font-size: 0.7rem; letter-spacing: 0.14em; margin-bottom: 0.8rem; }

.avis-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}
@media (min-width: 600px) { .avis-grid { grid-template-columns: 1fr 1fr; } }

.avis-card {
  background: var(--white); padding: 1.8rem 1.6rem;
  position: relative;
}
.avis-card::before {
  content: '\201C';
  position: absolute; top: 0.6rem; left: 1.2rem;
  font-family: var(--serif); font-size: 4rem; line-height: 1;
  color: var(--terra); opacity: 0.08; user-select: none;
}
.avis-card blockquote {
  font-size: 0.92rem; font-weight: 300;
  font-style: italic; line-height: 1.75;
  color: var(--brown); position: relative; z-index: 1;
  margin-bottom: 1.2rem;
}
.avis-card-meta {
  font-size: 0.72rem; color: var(--brown-mid); opacity: 0.6;
}
.avis-card-meta strong {
  display: block; font-weight: 500;
  color: var(--brown); opacity: 1; margin-bottom: 0.1rem;
}

.avis-gm {
  margin-top: 2.5rem;
  padding: 1.6rem 2rem;
  display: flex; align-items: center; gap: 2rem; flex-wrap: wrap;
  background: rgba(58,79,44,0.07);
  border-left: 3px solid var(--olive);
}
.avis-gm-badge {
  font-family: var(--serif); font-size: 1.2rem;
  font-weight: 400; color: var(--olive); white-space: nowrap;
}
.avis-gm-text { font-size: 0.85rem; color: var(--brown-mid); font-weight: 300; line-height: 1.65; }
.avis-gm-text strong { display: block; font-weight: 500; color: var(--olive); margin-bottom: 0.2rem; }

/* ——— INFOS ——— */
.infos { background: var(--cream); }
.infos-title {
  font-family: var(--serif);
  font-size: clamp(2rem,4vw,3rem);
  font-weight: 300; line-height: 1.1;
  margin-bottom: clamp(2.5rem,5vw,4rem);
}
.infos-grid {
  display: grid; grid-template-columns: 1fr;
  gap: 3.5rem;
}
@media (min-width: 768px) { .infos-grid { grid-template-columns: 1fr 1fr; gap: 5rem; } }

.infos-block-label {
  font-size: 0.64rem; font-weight: 500;
  letter-spacing: 0.26em; text-transform: uppercase;
  color: var(--terra); margin-bottom: 1.4rem;
}
.horaires { list-style: none; }
.horaires li {
  display: flex; justify-content: space-between; gap: 1rem;
  padding: 0.65rem 0;
  border-bottom: 1px solid rgba(28,17,8,0.08);
  font-size: 0.88rem; color: var(--brown-mid); font-weight: 300;
}
.horaires li:last-child { border-bottom: none; }
.horaires li .day { font-weight: 400; color: var(--brown); min-width: 95px; flex-shrink: 0; }
.horaires li.closed .time { color: var(--terra); font-style: italic; }

.contacts { list-style: none; margin-top: 2rem; }
.contacts li {
  display: flex; gap: 1rem; align-items: flex-start; margin-bottom: 1.4rem;
}
.contact-icon {
  width: 32px; height: 32px;
  border: 1px solid rgba(28,17,8,0.12);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; color: var(--terra); font-size: 0.85rem;
}
.contact-text { font-size: 0.87rem; color: var(--brown-mid); font-weight: 300; line-height: 1.6; }
.contact-text strong {
  display: block; font-weight: 500; color: var(--brown); margin-bottom: 0.1rem;
  font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.07em;
}
.contact-text a { color: var(--terra); transition: opacity 0.2s; }
.contact-text a:hover { opacity: 0.7; }
.contact-sub { font-size: 0.73rem; opacity: 0.45; margin-top: 0.1rem; }

.chips { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 2rem; }
.chip {
  font-size: 0.72rem; padding: 0.32rem 0.75rem;
  background: rgba(28,17,8,0.05); color: var(--brown-mid);
}

.map-placeholder {
  aspect-ratio: 4/3;
  background: rgba(28,17,8,0.04);
  border: 1px solid rgba(28,17,8,0.08);
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  text-align: center; gap: 1.2rem; padding: 2.5rem;
}
.map-place { font-family: var(--serif); font-size: 1.1rem; font-weight: 300; line-height: 1.3; }
.map-desc { font-size: 0.83rem; color: var(--brown-mid); font-weight: 300; line-height: 1.65; }
.map-link {
  display: inline-flex; align-items: center;
  padding: 0.7rem 1.6rem; min-height: 44px;
  background: var(--terra); color: var(--white);
  font-size: 0.72rem; font-weight: 500;
  letter-spacing: 0.1em; text-transform: uppercase;
  transition: background 0.25s;
}
.map-link:hover { background: var(--terra-dk); }

/* ——— FOOTER ——— */
.site-footer { background: var(--black); color: rgba(245,237,219,0.5); padding: 3.5rem 0 2rem; }
.footer-grid { display: grid; grid-template-columns: 1fr; gap: 2.5rem; }
@media (min-width: 640px) { .footer-grid { grid-template-columns: 2fr 1fr 1fr; } }

.footer-logo { font-family: var(--serif); font-size: 1.1rem; font-weight: 300; color: var(--white); margin-bottom: 0.65rem; }
.footer-desc { font-size: 0.8rem; line-height: 1.75; font-weight: 300; }
.footer-col-title {
  font-size: 0.62rem; font-weight: 500;
  letter-spacing: 0.25em; text-transform: uppercase;
  color: var(--ochre); margin-bottom: 1rem;
}
.footer-col ul { list-style: none; }
.footer-col ul li { margin-bottom: 0.5rem; font-size: 0.81rem; font-weight: 300; }
.footer-col ul li a { color: rgba(245,237,219,0.5); transition: color 0.2s; }
.footer-col ul li a:hover { color: var(--ochre); }

.footer-bottom {
  margin-top: 2.5rem; padding-top: 1.5rem;
  border-top: 1px solid rgba(245,237,219,0.06);
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.5rem;
  font-size: 0.7rem; color: rgba(245,237,219,0.2);
}

/* ——— SCROLL PROGRESS ——— */
.scroll-progress {
  position: fixed; top: 0; left: 0;
  height: 2px; width: 0%;
  background: var(--terra);
  z-index: 202; pointer-events: none;
  transform-origin: left;
}
@media (prefers-reduced-motion: reduce) { .scroll-progress { display: none; } }

/* ——— HERO TITLE REVEAL (ligne par ligne) ——— */
.hero-title .line { display: block; overflow: hidden; }
html.js .hero-title .line-inner {
  display: block;
  transform: translateY(110%);
  transition: transform 0.95s cubic-bezier(0.16, 1, 0.3, 1);
}
html.js .hero-title.revealed .line-inner { transform: translateY(0); }
html.js .hero-title .line:nth-child(2) .line-inner { transition-delay: 0.18s; }

/* ——— AVIS STARS REVEAL ——— */
html.js .avis-stars {
  clip-path: inset(0 100% 0 0);
  transition: clip-path 0.7s cubic-bezier(0.25, 1, 0.5, 1);
}
html.js .avis-stars.in { clip-path: inset(0 0% 0 0); }

/* ——— AVIS SCORE COUNTING PULSE ——— */
.avis-score-num {
  display: inline-block;
  transition: transform 0.15s ease;
}
.avis-score-num.pulse { transform: scale(1.08); }

/* ——— MOBILE MENU ——— */
.mobile-menu-btn {
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 5px;
  width: 44px; height: 44px;
  background: transparent; border: none;
  cursor: pointer;
  color: var(--brown);
  transition: color 0.2s;
  flex-shrink: 0;
}
.site-header.on-hero .mobile-menu-btn { color: var(--white); }
@media (min-width: 768px) { .mobile-menu-btn { display: none; } }

.burger-line {
  display: block; width: 20px; height: 1.5px;
  background: currentColor;
  transition: transform 0.3s ease, opacity 0.2s ease;
}
.mobile-menu-btn.open .burger-line:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.mobile-menu-btn.open .burger-line:nth-child(2) { opacity: 0; }
.mobile-menu-btn.open .burger-line:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

.mobile-nav {
  position: fixed; top: 0; left: 0; right: 0;
  z-index: 85;
  padding-top: 62px;
  background: var(--cream);
  box-shadow: 0 8px 32px rgba(28,17,8,0.1);
  visibility: hidden;
  pointer-events: none;
  transform: translateY(-100%);
  transition: transform 0.38s cubic-bezier(0.32,0,0.67,0), visibility 0.38s;
}
.mobile-nav.open {
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
  transition: transform 0.38s cubic-bezier(0.33,1,0.68,1), visibility 0s;
}
.mobile-nav-link {
  display: flex; align-items: center;
  padding: 0 1.5rem; min-height: 54px;
  font-size: 0.72rem; font-weight: 500;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--brown-mid);
  border-bottom: 1px solid rgba(28,17,8,0.06);
  transition: color 0.2s, padding-left 0.2s;
}
.mobile-nav-link:hover,
.mobile-nav-link:focus-visible { color: var(--terra); padding-left: 2rem; }
.mobile-nav-resa {
  display: flex; align-items: center;
  padding: 0 1.5rem; min-height: 54px;
  font-size: 0.83rem; font-weight: 400;
  color: var(--terra); letter-spacing: 0.02em;
}
@media (min-width: 768px) { .mobile-nav { display: none; } }

/* ——— ANIMATIONS SCROLL ——— */
.reveal-img {
  transition: opacity 1s ease, transform 1.2s cubic-bezier(0.16,1,0.3,1);
}
html.js .reveal-img { opacity: 0; transform: scale(1.04); }
html.js .reveal-img.in { opacity: 1; transform: scale(1); }

.fade-up { transition: opacity 0.7s ease, transform 0.7s ease; }
html.js .fade-up { opacity: 0; transform: translateY(28px); }
html.js .fade-up.in { opacity: 1; transform: translateY(0); }

.d1 { transition-delay: 0.1s; }
.d2 { transition-delay: 0.22s; }
.d3 { transition-delay: 0.36s; }

@media (prefers-reduced-motion: reduce) {
  .reveal-img, .fade-up, .curtain-left, .curtain-right {
    transition: none !important;
    clip-path: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
  .hero-scroll-line::after { animation: none; }
  .grain::after { animation: none; }
  .mobile-nav { transition: none !important; }
  .burger-line { transition: none !important; }
}
