/* Danubius Events & Bistro — meniu QR */

:root{
  --ink:#15100C;      /* fundal principal, negru cald */
  --ink2:#1E1712;     /* suprafețe ridicate */
  --line:#3A2F25;     /* linii/borders */
  --cream:#ECE1CD;    /* text principal */
  --muted:#9D8B72;    /* ingrediente, text secundar */
  --dim:#957F63;      /* text foarte discret (min. 4.5:1 pe --ink și --ink2, WCAG AA) */
  --gold:#C79A52;     /* prețuri, volume, accente */
  --gold-b:#E7C378;   /* titluri secțiuni */
  --terra:#C86A3C;    /* accent secundar */
  --sage:#7C9A7E;     /* tag-uri alergeni */
  --nav-h:56px;
}

*,*::before,*::after{ box-sizing:border-box; }

html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation:none !important; transition:none !important; }
}

body{
  margin:0;
  background:var(--ink);
  color:var(--cream);
  font-family:"Figtree",system-ui,sans-serif;
  font-size:16px;
  line-height:1.45;
  -webkit-font-smoothing:antialiased;
}

img{ max-width:100%; display:block; }

a{ color:var(--gold-b); }

:focus-visible{
  outline:2px solid var(--gold-b);
  outline-offset:3px;
  border-radius:4px;
}

.skip{
  position:absolute; left:-9999px; top:0;
  background:var(--gold); color:var(--ink);
  padding:10px 16px; font-weight:600; z-index:99;
}
.skip:focus-visible{ left:12px; top:12px; }

/* ── Copertă ─────────────────────────────── */

.cover{ text-align:center; padding:44px 20px 0; }

.eyebrow{
  margin:0 0 14px;
  font-size:11px; font-weight:600;
  letter-spacing:.32em; text-transform:uppercase;
  color:var(--gold);
}

.wordmark{
  margin:0;
  font-family:"Fraunces",serif;
  font-weight:400; font-size:clamp(52px,16vw,64px);
  line-height:1.02; letter-spacing:.01em;
  color:var(--cream);
}

.river{ width:66px; height:10px; margin:10px auto 8px; }
/* var() nu funcționează în atribute SVG de prezentare — stroke-ul trebuie dat din CSS */
.river path{ stroke:var(--gold); }

.subwordmark{
  margin:0 0 10px;
  font-size:13px; font-weight:600;
  letter-spacing:.42em; text-transform:uppercase;
  color:var(--cream);
}

.tagline{ margin:0; font-size:14px; color:var(--muted); }
.tagline em{ font-style:normal; color:var(--terra); font-weight:500; }

.hero{ margin-top:26px; position:relative; }
.hero img{
  width:100%; height:min(40vh,320px);
  object-fit:cover; object-position:center 38%;
}
.hero::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, var(--ink) 0%, transparent 18%, transparent 55%, var(--ink) 100%);
  pointer-events:none;
}

/* ── Nav sticky ──────────────────────────── */

.nav{
  position:sticky; top:0; z-index:10;
  background:color-mix(in srgb, var(--ink) 88%, transparent);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
@supports not (background: color-mix(in srgb, red 50%, blue)){
  .nav{ background:rgba(21,16,12,.94); }
}

.nav-track{
  display:flex; gap:8px;
  overflow-x:auto;
  padding:10px 16px;
  scrollbar-width:none;
}
.nav-track::-webkit-scrollbar{ display:none; }

.pill{
  flex:0 0 auto;
  appearance:none; cursor:pointer;
  font:inherit; font-size:13px; font-weight:500;
  color:var(--muted);
  background:transparent;
  border:1px solid var(--line);
  border-radius:999px;
  padding:7px 14px;
  white-space:nowrap;
  transition:color .18s, border-color .18s, background-color .18s;
}
.pill:hover{ color:var(--cream); }
.pill.is-active{
  color:var(--gold-b);
  border-color:var(--gold);
  background:var(--ink2);
}

/* ── Secțiuni ────────────────────────────── */

main{ max-width:680px; margin:0 auto; padding:8px 20px 48px; }

.sec{ padding-top:34px; scroll-margin-top:calc(var(--nav-h) + 10px); }

/* pozele sunt deja crop-uite patrat pe pahar; se afiseaza intregi */
.sec-img{
  width:100%; aspect-ratio:1/1; height:auto;
  object-fit:cover;
  border-radius:14px;
  border:1px solid var(--line);
  margin-bottom:20px;
}

.sec-title{
  display:flex; align-items:center; gap:14px;
  margin:0 0 18px;
  font-family:"Fraunces",serif;
  font-weight:600; font-size:26px; line-height:1.15;
  color:var(--gold-b);
}
.sec-title::after{
  content:""; flex:1; height:1px;
  background:var(--line);
}

/* ── Produs ──────────────────────────────── */

.item{ padding:10px 0; }
.item + .item{ border-top:1px solid color-mix(in srgb, var(--line) 45%, transparent); }
@supports not (background: color-mix(in srgb, red 50%, blue)){
  .item + .item{ border-top:1px solid rgba(58,47,37,.45); }
}

.item-row{ display:flex; align-items:baseline; gap:10px; }

.item-name{
  font-family:"Fraunces",serif;
  font-weight:400; font-size:17px; line-height:1.25;
  color:var(--cream);
}

.leader{
  flex:1; min-width:24px;
  border-bottom:2px dotted var(--line);
  transform:translateY(-4px);
}

.price{
  font-weight:600; font-size:20px; line-height:1;
  color:var(--gold);
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
.price sup{ font-size:12px; font-weight:600; vertical-align:super; letter-spacing:.02em; }
.price .lei{ font-size:11px; font-weight:500; color:var(--dim); margin-left:3px; }

.item-meta{ margin-top:3px; font-size:12.5px; color:var(--muted); }
.item-meta .vol{ font-size:12px; font-weight:500; color:var(--gold); opacity:.85; }
.item-meta .sep{ color:var(--dim); margin:0 4px; }

.tags{ margin-top:6px; display:flex; flex-wrap:wrap; gap:6px; }
.tag{
  font-size:10.5px; font-weight:500; letter-spacing:.04em;
  color:var(--sage);
  border:1px solid color-mix(in srgb, var(--sage) 45%, transparent);
  border-radius:999px;
  padding:2px 9px;
}
@supports not (background: color-mix(in srgb, red 50%, blue)){
  .tag{ border-color:rgba(124,154,126,.45); }
}

/* ── Footer ──────────────────────────────── */

.footer{
  text-align:center;
  border-top:1px solid var(--line);
  padding:36px 20px 44px;
  background:var(--ink2);
}
.footer .river{ margin-bottom:16px; }

.footer-note{ margin:0 0 8px; font-size:13px; color:var(--muted); }
.footer-note.dimmed{ font-size:12px; color:var(--dim); }

.footer-allergens{
  margin:0 0 8px; font-size:12px; color:var(--sage);
  letter-spacing:.02em;
}

.footer-cta{ margin:20px 0 0; }
.footer-cta a{
  display:inline-block;
  background:var(--terra); color:var(--ink);
  text-decoration:none;
  font-weight:600; font-size:14px;
  border-radius:999px;
  padding:11px 22px;
}
.footer-cta a:hover{ filter:brightness(1.08); }

.footer-brand{
  margin:24px 0 0;
  font-family:"Fraunces",serif; font-style:italic;
  font-size:14px; color:var(--dim);
}

.footer-legal{
  margin:16px auto 0; max-width:420px;
  font-size:11.5px; line-height:1.7; color:var(--dim);
}
.footer-legal a{ color:var(--dim); text-decoration:underline; }

/* mobil mic */
@media (max-width:380px){
  .item-name{ font-size:16px; }
  .price{ font-size:18px; }
  .sec-title{ font-size:23px; }
}