/* =====================================================================
   V5 — "Salon Rouge"  ·  Art-Déco / 1920s supper-club glamour
   ===================================================================== */
:root{
  --noir:#0c0f0d; --panel:#101714; --emerald:#0f3a30;
  --gold:#c7a24a; --gold-lt:#e6cd87; --gold-dim:rgba(199,162,74,.4);
  --cream:#efe7d3; --cream-soft:rgba(239,231,211,.74); --red:#a32820;
  --f-deco:"Cinzel Decorative",Georgia,serif;
  --f-cap:"Cinzel",Georgia,serif;
  --f-label:"Josefin Sans",sans-serif;
  --f-body:"Cormorant Garamond",Georgia,serif;
}
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }
body{
  background:var(--noir); color:var(--cream); -webkit-font-smoothing:antialiased;
  font-family:var(--f-body); line-height:1.6;
  background-image:
    radial-gradient(120% 80% at 50% -10%, rgba(15,58,48,.4), transparent 55%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60'%3E%3Cg fill='none' stroke='%23c7a24a' stroke-opacity='0.05'%3E%3Cpath d='M30 0L60 30 30 60 0 30z'/%3E%3C/g%3E%3C/svg%3E");
}
img{ display:block; max-width:100%; height:auto; }
a{ color:inherit; }

.back{
  position:fixed; top:.8rem; left:.9rem; z-index:30;
  font-family:var(--f-label); text-transform:uppercase; letter-spacing:.2em; font-size:.7rem;
  color:var(--gold-lt); border:1px solid var(--gold-dim); padding:.45em .9em; text-decoration:none;
  background:rgba(12,15,13,.6); transition:.25s;
}
.back:hover{ background:var(--gold); color:var(--noir); }

/* ---------- deco divider ---------- */
.deco-div{ display:flex; align-items:center; justify-content:center; gap:.9rem; color:var(--gold); font-size:.9rem; margin:1rem 0; }
.deco-div span{ display:block; width:min(90px,18vw); height:1px; background:linear-gradient(90deg,transparent,var(--gold)); }
.deco-div span:last-child{ background:linear-gradient(90deg,var(--gold),transparent); }

/* ---------- HERO ---------- */
.hero{ position:relative; min-height:100svh; display:flex; align-items:center; justify-content:center; padding:clamp(2rem,6vw,5rem) clamp(1rem,5vw,3rem); overflow:hidden; }
.sunburst{
  position:absolute; top:42%; left:50%; width:160vmax; height:160vmax; transform:translate(-50%,-50%);
  background:repeating-conic-gradient(from 0deg, rgba(199,162,74,.14) 0 1.6deg, transparent 1.6deg 9deg);
  -webkit-mask:radial-gradient(circle, #000 0, #000 22%, transparent 62%);
          mask:radial-gradient(circle, #000 0, #000 22%, transparent 62%);
  pointer-events:none;
}
.hero-frame{
  position:relative; text-align:center; max-width:760px; width:100%;
  padding:clamp(2.5rem,6vw,4.5rem) clamp(1.5rem,5vw,4rem);
  border:1px solid var(--gold); outline:1px solid var(--gold); outline-offset:6px;
  background:rgba(12,15,13,.55); backdrop-filter:blur(2px);
}
.hero-frame::before,.hero-frame::after{ content:"◆"; position:absolute; color:var(--gold); font-size:1rem; }
.hero-frame::before{ top:-.7rem; left:50%; transform:translateX(-50%); background:var(--noir); padding:0 .5rem; }
.hero-frame::after{ bottom:-.7rem; left:50%; transform:translateX(-50%); background:var(--noir); padding:0 .5rem; }
.label,.sec-label{ font-family:var(--f-label); font-weight:400; text-transform:uppercase; letter-spacing:.4em; font-size:.74rem; color:var(--gold-lt); }
.hero-title{
  font-family:var(--f-deco); font-weight:900; color:var(--gold);
  font-size:clamp(2.4rem,8vw,5rem); line-height:1.08; letter-spacing:.02em; margin:.3rem 0;
  text-shadow:0 2px 18px rgba(199,162,74,.25);
}
.hero-sub{ font-family:var(--f-cap); text-transform:uppercase; letter-spacing:.22em; font-size:clamp(.8rem,1.8vw,1rem); color:var(--cream); }
.hero-tag{ font-family:var(--f-body); font-style:italic; font-size:clamp(1.2rem,3vw,1.7rem); color:var(--cream-soft); margin-top:1.2rem; }
.btn{
  display:inline-block; margin-top:1.8rem; font-family:var(--f-label); text-transform:uppercase;
  letter-spacing:.3em; font-size:.82rem; color:var(--gold-lt); text-decoration:none;
  border:1px solid var(--gold); padding:.85em 2.2em; transition:.3s;
}
.btn:hover{ background:var(--gold); color:var(--noir); }

/* ---------- sections ---------- */
.sec{ max-width:1040px; margin:0 auto; padding:clamp(3.5rem,8vw,6.5rem) clamp(1.2rem,5vw,2rem) 0; text-align:center; }
.sec-label{ display:block; }
.sec-h{ font-family:var(--f-deco); font-weight:700; color:var(--gold); font-size:clamp(2rem,5vw,3.2rem); line-height:1.1; margin-top:.3rem; }
.prose{ font-family:var(--f-body); font-size:clamp(1.2rem,1rem+.7vw,1.5rem); line-height:1.62; color:var(--cream); max-width:56ch; }
.prose.center{ margin:0 auto; }

.split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(1.6rem,4vw,3rem); align-items:center; text-align:left; margin-top:1.5rem; }
.split-copy{ }
@media (max-width:800px){ .split{ grid-template-columns:1fr; } .split-copy .prose{ margin-inline:auto; } }

/* ---------- gold framed images ---------- */
.framed{ position:relative; padding:8px; border:1px solid var(--gold); background:linear-gradient(135deg, rgba(199,162,74,.12), transparent); }
.framed::before{ content:""; position:absolute; inset:3px; border:1px solid var(--gold-dim); pointer-events:none; }
.framed img{ width:100%; display:block; filter:saturate(1.02) contrast(1.02); }
.framed--wide{ max-width:620px; margin:1.8rem auto 0; }

.gal{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1rem,2.5vw,1.6rem); margin-top:1.8rem; }
@media (max-width:760px){ .gal{ grid-template-columns:1fr 1fr; } }
@media (max-width:460px){ .gal{ grid-template-columns:1fr; } }

/* ---------- menu ---------- */
.sec--menu{ }
.menu-frame{
  max-width:620px; margin:1.8rem auto 0; padding:clamp(2rem,5vw,3rem);
  border:1px solid var(--gold); outline:1px solid var(--gold-dim); outline-offset:5px;
  background:rgba(15,58,48,.18);
}
.carte{ list-style:none; }
.carte li{ display:block; padding:.95rem 0; border-bottom:1px solid var(--gold-dim); }
.carte li:last-child{ border-bottom:none; }
.c-no{ font-family:var(--f-deco); color:var(--gold); font-size:1.1rem; margin-right:.6rem; }
.c-name{ font-family:var(--f-cap); text-transform:uppercase; letter-spacing:.16em; font-size:1.02rem; color:var(--cream); }
.c-desc{ display:block; font-family:var(--f-body); font-style:italic; font-size:1.18rem; color:var(--cream-soft); margin-top:.2rem; }
.carte-foot{ font-family:var(--f-body); font-style:italic; color:var(--gold-lt); margin-top:1.4rem; font-size:1.05rem; }
.carte-foot em{ color:var(--cream-soft); font-size:.95rem; }

/* ---------- footer ---------- */
.foot{ text-align:center; padding:clamp(3.5rem,8vw,6rem) 1.5rem clamp(2.5rem,5vw,4rem); margin-top:2rem; }
.foot-title{ font-family:var(--f-deco); font-weight:700; color:var(--gold); font-size:clamp(1.6rem,4vw,2.4rem); }
.foot-sub{ font-family:var(--f-label); text-transform:uppercase; letter-spacing:.24em; font-size:.74rem; color:var(--cream-soft); margin-top:.7rem; }