/* PIATSA-03 — Public identity based on the owner's printed black/gold menu. */
:root {
  --gold: #d1b86e;
  --gold-light: #f0dc9b;
  --gold-dim: rgba(218, 190, 110, .12);
  --piatsa-header-height: 76px;
  --piatsa-ink: #10100e;
  --piatsa-stroke: rgba(227, 195, 113, .25);
}
html { scroll-padding-top: calc(var(--piatsa-header-height) + 86px); }
body { background: #10100e; }
.piatsa-skip-link {
  position: fixed; left: 16px; top: -80px; z-index: 110;
  padding: 10px 16px; border-radius: 8px; color: #10100e;
  background: #f0dc9b; font-weight: 600;
}
.piatsa-skip-link:focus { top: 12px; }
.header {
  background: rgba(14,14,13,.96);
  border-bottom: 1px solid var(--piatsa-stroke);
  box-shadow: 0 8px 28px rgba(0,0,0,.15);
}
.header-inner { min-height: 76px; padding-top: .55rem; padding-bottom: .55rem; }
.logo-area { gap: .72rem; }
.logo-img {
  width: 53px; height: 53px; border: 0; border-radius: 50%;
  background: #11100e; object-fit: contain; box-shadow: 0 0 0 1px rgba(236,207,128,.16);
}
.piatsa-brand-text { display: flex; flex-direction: column; min-width: 0; }
.restaurant-name {
  display: block; font: 600 clamp(1.35rem,2.8vw,1.9rem)/.95 'Cormorant Garamond',Georgia,serif;
  color: #f2dda0; letter-spacing: .015em;
}
.restaurant-tagline {
  display: block; margin-top: .26rem; font-size: .68rem; font-weight: 500;
  text-transform: uppercase; letter-spacing: .15em; color: #bead87;
}
.header-controls { gap: .65rem; flex-wrap: nowrap; }
.theme-toggle { background: #1b1a17; border-color: rgba(220,185,100,.3); flex: 0 0 auto; }
.lang-switcher {
  border: 1px solid rgba(216,185,106,.25); background: rgba(218,181,101,.045);
  padding: 3px; border-radius: 100px; flex-shrink: 0; gap: 0;
}
.lang-btn { min-width: 39px; height: 31px; font-weight: 600; letter-spacing: .03em; }
.lang-btn.active { background: #dcc47e; color: #18160f; border-color: #dcc47e; }
.lang-btn:hover { background: rgba(216,185,106,.14); }
.lang-btn.active:hover { background: #e6d297; }

/* The supplied logo is deliberately displayed without inventing food photography. */
.piatsa-hero {
  min-height: 304px; isolation: isolate;
  overflow: hidden; background-color: #191713;
  background-position: center; background-size: cover;
  border-bottom: 1px solid rgba(233,196,109,.18);
}
.piatsa-hero.hero-no-image {
  background-image:
    radial-gradient(ellipse at 72% 25%, rgba(149,111,46,.16) 0%, transparent 44%),
    linear-gradient(145deg, #211d17 0%, #12120f 54%, #18140f 100%) !important;
}
.piatsa-hero::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: repeating-linear-gradient(135deg, rgba(245,204,111,.014) 0 1px, transparent 1px 16px);
}
.piatsa-frame {
  position: absolute; inset: 15px 16px; border: 1px solid rgba(232,202,126,.44);
  border-radius: 22px 4px 22px 4px; pointer-events: none;
}
.piatsa-frame::before, .piatsa-frame::after {
  content: '✧'; position: absolute; font-size: 1.05rem; color: #e5c780;
  line-height: 1; background: #1b1814; padding: 0 9px;
}
.piatsa-frame::before { top: -9px; left: 22px; }
.piatsa-frame::after { bottom: -9px; right: 22px; }
.piatsa-hero-content {
  display: flex; align-items: center; justify-content: space-between; gap: 1.5rem;
  padding-top: 2.8rem; padding-bottom: 2.8rem;
}
.piatsa-hero-copy { max-width: 650px; }
.piatsa-eyebrow { margin: 0 0 .75rem; color: #ead296; font-size: .72rem; font-weight: 600; letter-spacing: .24em; }
.piatsa-star { font-size: .7rem; margin: 0 .22rem; }
.piatsa-hero-title {
  margin: 0; font: 600 clamp(3.8rem,9vw,6.3rem)/.86 'Cormorant Garamond',Georgia,serif;
  letter-spacing: -.018em; color: #f5e9cd; text-wrap: balance;
  text-shadow: 0 8px 25px rgba(0,0,0,.35);
}
.piatsa-hero-descriptor { margin: .6rem 0 0 .25rem; color: #e5cd8d; letter-spacing: .24em; text-transform: uppercase; font-weight: 500; font-size: .82rem; }
.piatsa-hero-rule { display: flex; align-items: center; gap: .85rem; color: #d7bb71; width: 210px; margin: 1rem 0 .6rem; }
.piatsa-hero-rule::before, .piatsa-hero-rule::after { content: ''; height: 1px; flex: 1; background: linear-gradient(90deg,transparent,#c6a965); }
.piatsa-hero-rule::after { transform: rotate(180deg); }
.piatsa-hero-menu-title { color: #ddd2b9; font-size: .9rem; margin: .15rem 0 0; letter-spacing: .035em; }
.piatsa-hero-seal { width: 188px; height: 188px; flex: 0 0 auto; display: grid; place-items: center;
  border-radius: 50%; border: 1px solid rgba(226,189,102,.22); background: rgba(0,0,0,.13);
  box-shadow: 0 0 0 8px rgba(227,190,107,.025);
}
.piatsa-hero-seal img { width: 164px; height: 164px; object-fit: contain; }

.category-nav-wrap {
  position: sticky; z-index: 35; top: var(--piatsa-header-height);
  background: rgba(21,20,18,.97); backdrop-filter: blur(15px);
  box-shadow: 0 9px 22px rgba(0,0,0,.18);
  border-bottom: 1px solid rgba(223,188,108,.22);
}
.piatsa-nav-inner { position: relative; max-width: 1160px; display: flex; align-items: center; margin: 0 auto; gap: 0; }
.category-nav { flex: 1; min-width: 0; max-width: none; padding: .75rem .35rem; gap: .45rem; scroll-behavior: smooth; }
.category-nav a {
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 8px; border: 1px solid rgba(212,178,98,.15);
  background: rgba(255,255,255,.025); padding: .64rem .94rem;
  font-weight: 500; font-size: .83rem; letter-spacing: .01em; color: #bfb29a;
  transition: background .16s ease, color .16s ease, border-color .16s ease;
}
.category-nav a:hover, .category-nav a.is-current, .category-nav a[aria-current=true] {
  color: #1c1911; border-color: #d9be79; background: #e7cd8a;
}
.piatsa-nav-arrow {
  width: 40px; height: 41px; flex: 0 0 auto; padding: 0; border: 0;
  background: transparent; color: #ecd79f; font: 400 2rem/1 Georgia,serif; cursor: pointer;
}
.piatsa-nav-arrow:disabled { opacity: .2; cursor: default; }

.main { max-width: 1120px; padding-top: 2.1rem; padding-bottom: 3.5rem; }
.piatsa-section-intro { display: flex; align-items: center; flex-wrap: wrap; gap: .7rem; margin: .15rem 0 1.9rem; }
.piatsa-section-eyebrow { color: #bda76e; letter-spacing: .2em; font-weight: 600; font-size: .67rem; }
.piatsa-section-rule { color: #d2b874; font-size: .65rem; }
.piatsa-section-current { color: #efe3c1; font-size: .82rem; letter-spacing: .02em; }
.category-section { animation: piatsa-appear .22s ease; }
@keyframes piatsa-appear { from { opacity: .75; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
.category-header { margin-bottom: 1.2rem; gap: 1.3rem; }
.category-title {
  font: 600 clamp(2.3rem,5vw,3.25rem)/.96 'Cormorant Garamond',Georgia,serif;
  color: #efdda5; letter-spacing: -.005em;
}
.category-line { background: linear-gradient(90deg,rgba(219,187,111,.72),transparent); }
.category-description {
  padding: .85rem 1rem; margin: 0 0 1.5rem;
  border-left: 2px solid rgba(224,189,107,.64);
  background: linear-gradient(90deg,rgba(222,185,110,.09),transparent);
  color: #cec2a8; font-size: .92rem; line-height: 1.65;
}
.dish-grid { gap: .75rem; }
.dish-card {
  background: linear-gradient(145deg,#1d1c18,#181815);
  border: 1px solid rgba(229,195,119,.15); border-radius: 12px;
  box-shadow: none; transition: background .18s ease, border-color .18s ease;
}
.dish-card:hover { background: #24221d; border-color: rgba(229,195,119,.34); }
.dish-card.no-media { min-height: 95px; }
.dish-content { padding: 1.15rem 1.2rem; }
.dish-content.is-text-only { min-height: 0; justify-content: center; }
.dish-name { font: 600 clamp(1.35rem,2.5vw,1.62rem)/1.08 'Cormorant Garamond',Georgia,serif; color: #f4edda; }
.dish-top { gap: .8rem; align-items: start; }
.dish-price {
  flex: 0 0 auto; padding: .26rem .48rem; margin-top: -.12rem;
  color: #eed394; background: rgba(225,190,104,.09);
  border: 1px solid rgba(226,191,105,.15); border-radius: 7px;
  font: 600 .94rem/1.3 'Jost',sans-serif; font-variant-numeric: tabular-nums;
}
.dish-description { font-size: .89rem; line-height: 1.56; color: #bcb4a4; margin-top: .64rem; }
.dish-image-wrap { aspect-ratio: 16 / 9; }
.dish-tags-inline { margin-bottom: .45rem; }
.subcategory-header { margin-bottom: 1rem; }
.legend-card { border-radius: 12px; }
.scroll-top-btn { right: 1.2rem; bottom: 1.2rem; width: 48px; height: 48px; background: #1c1a16; }

.piatsa-footer { border-top: 1px solid rgba(227,191,103,.27); background: #141310; padding: 2.7rem 1rem 2.4rem; }
.piatsa-footer-inner { text-align: center; max-width: 750px; margin: 0 auto; }
.piatsa-footer-mark { color: #dec685; font-size: 1.2rem; letter-spacing: .15em; }
.piatsa-footer-mark span { font: 600 2.2rem 'Cormorant Garamond',Georgia,serif; letter-spacing: .02em; margin: 0 .55rem; }
.piatsa-footer-sub { color: #d2c19f; margin-top: .2rem; font-size: .85rem; }
.piatsa-footer p { margin: .8rem 0 0; font-size: .74rem; color: #938c7d; }

/* Keep the optional user-controlled light theme coherent with the Piatsa identity. */
html[data-theme='light'] .header { background: rgba(250,245,234,.97); }
html[data-theme='light'] .restaurant-name { color: #684b20; }
html[data-theme='light'] .restaurant-tagline { color: #86683f; }
html[data-theme='light'] .category-nav-wrap { background: rgba(249,242,228,.98); }
html[data-theme='light'] .category-nav a { background: rgba(251,244,231,.78); color: #624e36; }
html[data-theme='light'] .category-nav a.is-current,
html[data-theme='light'] .category-nav a[aria-current=true] { color: #211b12; background: #e5c778; }
html[data-theme='light'] .piatsa-nav-arrow { color: #775b2e; }
html[data-theme='light'] .piatsa-section-current { color: #6b542e; }
html[data-theme='light'] .category-title { color: #7e5a29; }
html[data-theme='light'] .category-description { color: #655643; background: #f7ebd6; }
html[data-theme='light'] .dish-card { background: rgba(255,252,246,.94); border-color: rgba(140,108,57,.19); }
html[data-theme='light'] .dish-card:hover { background: #fff; }
html[data-theme='light'] .dish-name { color: #453522; }
html[data-theme='light'] .dish-price { color: #7d5a25; background: #f6ecd9; }
html[data-theme='light'] .dish-description { color: #746853; }
html[data-theme='light'] .piatsa-footer { background: #e9dfce; border-color: rgba(140,108,57,.24); }
html[data-theme='light'] .piatsa-footer-mark { color: #805b29; }
html[data-theme='light'] .piatsa-footer-sub { color: #6c5438; }
html[data-theme='light'] .piatsa-footer p { color: #827360; }

:where(a,button):focus-visible { outline: 2px solid #f8d782; outline-offset: 3px; }

@media (max-width: 720px) {
  .header-inner { min-height: 67px; flex-direction: row; align-items: center; padding: .45rem .85rem; gap: .5rem; }
  .header-controls { width: auto; gap: .3rem; justify-content: end; }
  .logo-area { gap: .46rem; }
  .logo-img { width: 44px; height: 44px; }
  .restaurant-name { font-size: 1.35rem; }
  .restaurant-tagline { font-size: .54rem; letter-spacing: .1em; white-space: nowrap; }
  .theme-toggle { min-width: 43px; width: 43px; padding: 0 .25rem; height: 34px; gap: 0; }
  .theme-toggle::after { width: 19px; height: 26px; top: 3px; left: 3px; }
  html[data-theme='dark'] .theme-toggle::after { transform: translateX(17px); }
  .theme-icon { width: 16px; font-size: .7rem; }
  .lang-btn { min-width: 31px; height: 29px; font-size: .67rem; }
  .lang-switcher { padding: 2px; }
  .piatsa-hero { min-height: 237px; }
  .piatsa-frame { inset: 9px 9px; border-radius: 18px 3px; }
  .piatsa-hero-content { padding: 2.4rem 1.5rem; }
  .piatsa-hero-seal { display: none; }
  .piatsa-hero-title { font-size: clamp(3.6rem,13vw,5rem); }
  .piatsa-hero-descriptor { letter-spacing: .16em; }
  .piatsa-eyebrow { font-size: .62rem; letter-spacing: .15em; }
  .category-nav { padding: .62rem .15rem; gap: .4rem; }
  .category-nav a { font-size: .8rem; padding: .61rem .78rem; }
  .piatsa-nav-arrow { width: 28px; height: 36px; }
  .main { padding: 1.35rem .9rem 3rem; }
  .piatsa-section-intro { margin-bottom: 1.3rem; }
  .category-header { margin-bottom: .95rem; }
  .category-title { font-size: 2.5rem; }
  .dish-grid { gap: .65rem; }
  .dish-card.no-media { min-height: 83px; }
  .dish-content { padding: .92rem 1rem; }
  .dish-name { font-size: 1.38rem; }
  .dish-price { font-size: .87rem; }
  .dish-description { font-size: .85rem; }
}
@media (max-width: 360px) {
  .logo-img { width: 39px; height: 39px; }
  .restaurant-name { font-size: 1.2rem; }
  .restaurant-tagline { font-size: .5rem; }
  .header-inner { padding-left: .6rem; padding-right: .6rem; }
  .piatsa-hero-title { font-size: 3.4rem; }
}
@media (prefers-reduced-motion: reduce) {
  .category-section { animation: none; }
  .category-nav { scroll-behavior: auto; }
}
