.site-hero {
  isolation: isolate;
  overflow: hidden;
  background: #050505;
}

.hero-panoramas { position: absolute; z-index: 0; inset: 0; overflow: hidden; }
.hero-panorama { position: absolute; inset: -4%; opacity: 0; background-position: center; background-size: cover; filter: saturate(.82) contrast(1.1) brightness(.68); transform: scale(1.08); transition: opacity 1.35s cubic-bezier(.24, .74, .28, 1), transform 7s cubic-bezier(.16, .72, .28, 1); }
.hero-panorama--buffet { background-image: url("images/hero-buffet.png"); background-position: 71% center; }
.hero-panorama--grill { background-image: url("images/show-grill.png"); background-position: 63% 44%; }
.hero-panorama--editorial { background-image: url("images/hero-balkanika-editorial.webp"); background-position: center; }
.hero-panorama.is-active { opacity: 1; transform: scale(1); }

.site-hero:before { z-index: 1; background: linear-gradient(90deg, rgba(3, 3, 3, .98) 0%, rgba(3, 3, 3, .94) 28%, rgba(3, 3, 3, .52) 54%, rgba(3, 3, 3, .09) 100%); }
.site-hero:after { z-index: 1; height: 250px; }
.hero-content { z-index: 2; transition: opacity .9s ease, transform .9s cubic-bezier(.2, .8, .25, 1); }
.motion-enabled .site-hero:not(.is-ready) .hero-content { opacity: 0; transform: translateY(20px); }

.hero-panorama-progress { position: absolute; z-index: 3; right: max(22px, calc((100vw - 1240px) / 2)); bottom: 37px; display: flex; gap: 8px; }
.hero-panorama-progress span { width: 28px; height: 2px; overflow: hidden; background: rgba(255, 255, 255, .32); }
.hero-panorama-progress span:after { display: block; width: 100%; height: 100%; content: ""; background: var(--site-gold-light); transform: translateX(-104%); }
.hero-panorama-progress span.is-active:after { animation: panorama-progress 6.5s linear forwards; }

.site-header { border-bottom-color: rgba(229, 202, 129, .14); transition: background .42s ease, backdrop-filter .42s ease, border-color .42s ease, box-shadow .42s ease; }
.site-header:after { position: absolute; right: 0; bottom: -1px; left: 0; height: 1px; content: ""; opacity: .56; background: linear-gradient(90deg, transparent, var(--site-gold-light), transparent); transform: scaleX(.1); transition: transform .55s ease; }
.site-header .site-nav { transition: min-height .38s ease, transform .38s ease; }
.site-header .site-brand img { filter: drop-shadow(0 5px 16px rgba(0, 0, 0, .45)); transition: transform .4s ease; }
.site-header .site-brand:hover img { transform: rotate(-5deg) scale(1.05); }
.nav-links a { position: relative; padding: 7px 0; }
.nav-links a:after { position: absolute; right: 0; bottom: 0; left: 0; height: 1px; content: ""; background: var(--site-gold-light); transform: scaleX(0); transform-origin: right; transition: transform .28s ease; }
.nav-links a:hover:after { transform: scaleX(1); transform-origin: left; }
.site-nav-actions .gold-button { position: relative; overflow: hidden; box-shadow: 0 7px 22px rgba(0, 0, 0, .22); }
.site-nav-actions .gold-button:before { position: absolute; inset: 0; content: ""; background: linear-gradient(105deg, transparent 32%, rgba(255,255,255,.45) 50%, transparent 68%); transform: translateX(-130%); transition: transform .65s ease; }
.site-nav-actions .gold-button:hover:before { transform: translateX(130%); }

.site-header.is-scrolled { position: fixed; background: rgba(5, 5, 5, .8); border-color: rgba(208, 169, 73, .34); box-shadow: 0 9px 30px rgba(0, 0, 0, .25); backdrop-filter: blur(17px) saturate(1.14); }
.site-header.is-scrolled:after { transform: scaleX(1); }
.site-header.is-scrolled .site-nav { min-height: 68px; }
.site-header.is-scrolled .site-brand img { width: 43px; height: 43px; }
.site-header.is-scrolled .site-brand span { font-size: 21px; }

.scroll-reveal { opacity: 1; transform: none; }
.motion-enabled .scroll-reveal { opacity: 0; transform: translateY(30px) scale(.985); transition: opacity .78s cubic-bezier(.2, .75, .25, 1) var(--reveal-delay, 0ms), transform .78s cubic-bezier(.2, .75, .25, 1) var(--reveal-delay, 0ms); }
.motion-enabled .scroll-reveal.is-visible { opacity: 1; transform: translateY(0) scale(1); }

@keyframes panorama-progress { from { transform: translateX(-104%); } to { transform: translateX(0); } }

.section-heading .eyebrow:after { display: inline-block; width: 34px; height: 1px; margin-left: 11px; content: ""; vertical-align: middle; background: currentColor; transform-origin: left; animation: eyebrow-line 1.1s cubic-bezier(.2, .75, .25, 1) both; }
.service-card, .menu-card, .journal-card, .reference-card { transition: transform .45s cubic-bezier(.2, .8, .25, 1), box-shadow .45s ease, border-color .35s ease; }
.menu-card:before { transition: transform .8s cubic-bezier(.2, .75, .25, 1), filter .45s ease; }
.feature-image { transition: transform 1s cubic-bezier(.2, .75, .25, 1), filter .5s ease; }

@media (hover: hover) {
  .service-card:hover, .menu-card:hover, .journal-card:hover, .reference-card:hover { border-color: rgba(222, 183, 88, .85); box-shadow: 0 18px 42px rgba(0, 0, 0, .18); transform: translateY(-7px); }
  .menu-card:hover:before { filter: saturate(1.1) contrast(1.03); transform: scale(1.045); }
  .feature:hover .feature-image { filter: saturate(1.08) contrast(1.04); transform: scale(1.02); }
  .motion-enabled .service-card.scroll-reveal.is-visible:hover, .motion-enabled .menu-card.scroll-reveal.is-visible:hover, .motion-enabled .journal-card.scroll-reveal.is-visible:hover, .motion-enabled .reference-card.scroll-reveal.is-visible:hover { transform: translateY(-7px) scale(1); }
}

@keyframes eyebrow-line { from { transform: scaleX(0); } to { transform: scaleX(1); } }

.reference-section {
  position: relative;
  overflow: hidden;
  background: radial-gradient(circle at 80% 15%, rgba(193, 143, 47, .18), transparent 34%), #090909;
}

.reference-section:before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image: linear-gradient(rgba(214, 169, 75, .035) 1px, transparent 1px), linear-gradient(90deg, rgba(214, 169, 75, .025) 1px, transparent 1px);
  background-size: 64px 64px;
}

.reference-section .site-container { position: relative; }

.reference-grid {
  display: grid;
  grid-template-columns: 1.28fr .72fr .72fr;
  grid-auto-rows: 230px;
  gap: 15px;
}

.reference-card {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(211, 173, 83, .42);
  background: #10100f;
}

.reference-card-large { grid-row: span 2; }
.reference-card:last-child { grid-column: span 2; }

.reference-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.82) contrast(1.08) brightness(.82);
  transition: transform .8s cubic-bezier(.2, .75, .25, 1), filter .45s ease;
}

.reference-card:nth-child(2) img { object-position: 50% 72%; }
.reference-card:nth-child(3) img { object-position: center 45%; }
.reference-card:nth-child(4) img { object-position: 50% 57%; }

.reference-card:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 25%, rgba(0, 0, 0, .84) 100%);
}

.reference-card div {
  position: absolute;
  z-index: 1;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 24px;
}

.reference-card span, .journal-card > span, .journal-copy > span {
  color: var(--site-gold-light);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.reference-card h3, .journal-card h3, .journal-copy h3 {
  margin: 7px 0 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 28px;
  font-weight: 400;
  line-height: .98;
}

.reference-card p { margin: 7px 0 0; color: #ddd6ca; font-size: 12px; }
.reference-card:hover img { filter: saturate(1.05) contrast(1.04) brightness(.98); transform: scale(1.055); }

.journal-section { padding-top: 100px; }
.journal-grid { display: grid; grid-template-columns: 1.4fr .8fr .8fr; gap: 16px; }

.journal-feature, .journal-card {
  border: 1px solid #dbd1c1;
  background: #fbf8f1;
}

.journal-feature { display: grid; grid-template-columns: 1.08fr .92fr; min-height: 375px; }
.journal-feature img { width: 100%; height: 100%; object-fit: cover; filter: brightness(.86) saturate(.82); }
.journal-copy { display: flex; flex-direction: column; justify-content: center; padding: 34px; }
.journal-copy h3 { font-size: clamp(29px, 3vw, 42px); color: #201c15; }
.journal-copy p { color: #6c655a; line-height: 1.6; font-size: 13px; }
.journal-copy .text-link { margin-top: 10px; }

.journal-card { display: flex; min-height: 375px; padding: 30px; flex-direction: column; justify-content: end; background: linear-gradient(145deg, #1c1811, #0a0907); color: #f8f3e9; }
.journal-card:nth-child(3) { background: linear-gradient(145deg, #9a7429, #2c2111 72%, #0e0b08); }
.journal-card h3 { font-size: 32px; }
.journal-card p { color: #d4c9b8; font-size: 13px; line-height: 1.6; }
.journal-card a { margin-top: 15px; color: var(--site-gold-light); font-size: 11px; font-weight: 800; letter-spacing: .08em; text-decoration: none; text-transform: uppercase; }

.journal-card-image { padding: 0; justify-content: stretch; background: #14110d; overflow: hidden; }
.journal-card-image img { width: 100%; height: 170px; object-fit: cover; filter: brightness(.78) saturate(.88); }
.journal-card-image > div { display: flex; height: 100%; padding: 24px 28px 28px; flex-direction: column; justify-content: end; }

.partner-card > img { width: 100%; height: 180px; margin: -1px -1px 18px; object-fit: cover; filter: brightness(.84) saturate(.86); }
.cart-item small { display: block; margin-top: 3px; color: #b69c65; font-size: 10px; line-height: 1.35; }

.article-page { min-height: 100vh; background: radial-gradient(circle at 75% 0%, rgba(188, 138, 42, .22), transparent 35%), #090909; color: #f8f3e9; }
.article-shell { width: min(900px, calc(100% - 40px)); margin: 0 auto; padding: 52px 0 90px; }
.article-back { color: var(--site-gold-light); font-size: 12px; font-weight: 800; letter-spacing: .1em; text-decoration: none; text-transform: uppercase; }
.journal-article { margin-top: 42px; }
.journal-article h1 { max-width: 760px; margin: 12px 0; font-family: Georgia, "Times New Roman", serif; font-size: clamp(42px, 7vw, 76px); font-weight: 400; line-height: .96; }
.article-summary { max-width: 650px; color: #ddd3c2; font-size: 20px; line-height: 1.5; }
.article-date { color: var(--site-gold-light); font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.journal-article > img { display: block; width: 100%; max-height: 520px; margin: 34px 0; object-fit: cover; }
.article-body { max-width: 720px; color: #e6dfd3; font-size: 17px; line-height: 1.8; }
.article-link { display: inline-block; margin-top: 28px; padding: 13px 18px; border: 1px solid var(--site-gold); color: var(--site-gold-light); font-size: 12px; font-weight: 800; letter-spacing: .08em; text-decoration: none; text-transform: uppercase; }

.menu-card h3 a, .service-card h3 a, .feature-copy h2 a, .journal-card h3 a {
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
  text-decoration: none;
  text-transform: none;
}

.menu-card h3 a:hover, .service-card h3 a:hover, .feature-copy h2 a:hover, .journal-card h3 a:hover { color: var(--site-gold-light); }
.menu-card .actions { display: flex; align-items: center; gap: 13px; margin-top: 14px; }
.menu-card .actions .add-product { flex: 1; width: auto; margin-top: 0; }
.menu-card .actions .text-link { white-space: nowrap; }
.journal-source { opacity: .76; }

.detail-shell { width: min(940px, calc(100% - 40px)); margin: 0 auto; padding: 52px 0 90px; }
.public-detail-card { position: relative; margin-top: 40px; padding: clamp(28px, 6vw, 68px); overflow: hidden; border: 1px solid rgba(210, 170, 75, .48); background: radial-gradient(circle at 88% 5%, rgba(191, 138, 39, .23), transparent 28%), linear-gradient(145deg, rgba(32, 27, 19, .98), rgba(8, 8, 7, .98)); }
.public-detail-card:before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .32; background-image: linear-gradient(rgba(215, 172, 79, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(215, 172, 79, .035) 1px, transparent 1px); background-size: 68px 68px; }
.public-detail-card > * { position: relative; }
.public-detail-card h1 { max-width: 780px; margin: 14px 0; font-family: Georgia, "Times New Roman", serif; font-size: clamp(44px, 7vw, 78px); font-weight: 400; line-height: .96; }
.public-detail-content { max-width: 720px; margin-top: 34px; color: #e6dfd3; font-size: 16px; line-height: 1.75; }
.public-detail-content h2 { margin: 32px 0 14px; color: #f6efe2; font-family: Georgia, "Times New Roman", serif; font-size: 28px; font-weight: 400; }
.public-detail-list { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.public-detail-list li { padding: 12px 14px; border-left: 2px solid var(--site-gold); background: rgba(255, 255, 255, .04); }
.public-detail-list span { color: #cfc3b1; }
.detail-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 40px; }

@media (max-width: 600px) {
  .hero-panorama--buffet { background-position: 61% center; }
  .hero-panorama--grill { background-position: 59% center; }
  .hero-panorama-progress { right: 15px; bottom: 25px; }
  .hero-panorama-progress span { width: 20px; }
  .site-header.is-scrolled .site-brand img { width: 38px; height: 38px; }
  .menu-card .actions { align-items: stretch; flex-direction: column; }
  .menu-card .actions .text-link { text-align: center; }
  .detail-shell { width: calc(100% - 30px); padding-top: 36px; }
  .public-detail-card { margin-top: 26px; }
}

@media (max-width: 900px) {
  .reference-grid { grid-template-columns: 1fr 1fr; grid-auto-rows: 250px; }
  .reference-card-large { grid-row: span 1; grid-column: span 2; }
  .reference-card:last-child { grid-column: span 1; }
  .journal-grid { grid-template-columns: 1fr 1fr; }
  .journal-feature { grid-column: span 2; }
}

@media (max-width: 600px) {
  .reference-grid { grid-template-columns: 1fr; grid-auto-rows: 280px; }
  .reference-card-large, .reference-card:last-child { grid-column: auto; }
  .reference-card div { padding: 20px; }
  .reference-card h3 { font-size: 25px; }
  .journal-section { padding-top: 68px; }
  .journal-grid { grid-template-columns: 1fr; }
  .journal-feature { grid-column: auto; grid-template-columns: 1fr; }
  .journal-feature img { min-height: 225px; }
  .journal-card { min-height: 270px; }
  .journal-card-image { min-height: 0; }
}

@media (prefers-reduced-motion: reduce) {
  *, *:before, *:after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .scroll-reveal { opacity: 1; transform: none; }
  .hero-panorama { transition: none; }
}
