/* Restaurant — warm fine-dining theme */
:root {
  --bg:        #14100C;
  --bg-2:      #1B1611;
  --surface:   #211A14;
  --surface-2: #2A211A;
  --steel:     #3A2E23;
  --steel-2:   #4D3C2D;
  --text:      #F6EEE3;
  --muted:     #B7A793;
  --accent:    #D9A441;
  --accent-2:  #C08A2C;
  --forge:     #E2683B;
  --gradient-brand: linear-gradient(135deg, #E0B153, #C08A2C);
  --gradient-steel: linear-gradient(160deg, #241C15, #16110C 70%);
  --font-en: "Plus Jakarta Sans", serif;
}
.btn-accent { color: #2a1c08; }
.badge { background: rgba(217,164,65,.14); color: var(--accent); border-color: rgba(217,164,65,.3); }

.r-hero { position: relative; min-height: 70vh; display: grid; align-items: center; border-radius: var(--radius-lg); overflow: hidden; margin-top: 22px; }
.r-hero .bg { position: absolute; inset: 0; background: radial-gradient(70% 90% at 80% 10%, rgba(217,164,65,.22), transparent 60%), linear-gradient(160deg,#241C15,#120D08); }
.r-hero .bg::after { content: "🍽️"; position: absolute; inset-block-end: -30px; inset-inline-start: 10px; font-size: 14rem; opacity: .07; }
.r-hero .inner { padding: clamp(34px,6vw,72px); position: relative; max-width: 640px; }
.r-hero .script { font-family: Georgia, serif; font-style: italic; color: var(--accent); font-size: 1.3rem; }
.r-hero h1 { font-size: clamp(2.2rem,6vw,4rem); margin: 8px 0 16px; }
.r-hero p { color: var(--muted); font-size: 1.1rem; max-width: 48ch; }
.r-hero .cta { display: flex; gap: 12px; margin-top: 26px; flex-wrap: wrap; }

.menu-search { max-width: 420px; margin: 26px auto 4px; }
.menu-tabs { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; margin: 18px 0 30px; }
.menu-empty { text-align: center; padding: 36px 0; grid-column: 1 / -1; }
.menu-list { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 44px; max-width: 1000px; margin-inline: auto; }
.dish { display: flex; gap: 14px; padding: 14px 0; border-bottom: 1px dashed var(--steel); }
.dish .em { font-size: 2rem; flex: none; }
.dish .info { flex: 1; }
.dish .row1 { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.dish h4 { font-size: 1.05rem; }
.dish .dot { flex: 1; border-bottom: 1px dotted var(--steel-2); margin: 0 6px 4px; min-width: 16px; }
.dish .pr { color: var(--accent); font-weight: 800; white-space: nowrap; }
.dish .desc { color: var(--muted); font-size: .88rem; margin-top: 3px; }
.dish .tags { margin-top: 5px; }

.gallery { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.gallery .tile { aspect-ratio: 1; border-radius: var(--radius); overflow: hidden; position: relative; background: var(--g,#2A211A); display: grid; place-items: center; }
.gallery .tile .em { font-size: 3rem; }
.gallery .tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.gallery .tile { cursor: pointer; transition: transform .2s var(--ease); }
.gallery .tile:hover { transform: scale(1.04); }

/* Allergen badges */
.dish .tags { display: flex; gap: 6px; flex-wrap: wrap; }
.badge.allergen { background: rgba(226,104,59,.12); color: var(--forge); border-color: rgba(226,104,59,.32); }

/* Gallery lightbox */
.modal.lightbox { width: min(900px, 100%); position: relative; padding: 14px; }
.lb-close { position: absolute; inset-block-start: 18px; inset-inline-end: 18px; z-index: 4; }
.lb-media { position: relative; aspect-ratio: 3/2; border-radius: var(--radius); overflow: hidden; background: var(--surface-2); display: grid; place-items: center; }
.lb-media .em { font-size: 5rem; }
.lb-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.lb-media .cnav { position: absolute; top: 50%; transform: translateY(-50%); width: 42px; height: 42px; border-radius: 50%; border: 0; background: rgba(0,0,0,.5); color: #fff; font-size: 1.6rem; cursor: pointer; display: grid; place-items: center; z-index: 3; transition: background .15s; }
.lb-media .cnav:hover { background: rgba(0,0,0,.75); }
.lb-media .cnav.prev { inset-inline-start: 12px; }
.lb-media .cnav.next { inset-inline-end: 12px; }

.reserve { display: grid; grid-template-columns: 1fr 1fr; gap: 34px; align-items: center; }
.reserve-card { background: var(--surface); border: 1px solid var(--steel); border-radius: var(--radius-lg); padding: clamp(24px,4vw,38px); }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.hours-list li { display: flex; justify-content: space-between; padding: 11px 0; border-bottom: 1px solid var(--steel); }
.hours-list li:last-child { border: none; }

@media (max-width: 820px) {
  .menu-list { grid-template-columns: 1fr; gap: 0 0; }
  .reserve { grid-template-columns: 1fr; }
  .gallery { grid-template-columns: repeat(2,1fr); }
  .form-grid { grid-template-columns: 1fr; }
}
