/* Glass + motion layer — зелёный премиум-стиль «Дюшес» */

:root,
[data-theme="dark"] {
  --glass-bg: rgb(21 31 51 / 42%);
  --glass-bg-strong: rgb(17 26 46 / 68%);
  --glass-border: rgb(157 224 195 / 24%);
  --glass-highlight: rgb(255 255 255 / 10%);
  --glass-blur: 26px;
  --glass-shadow: 0 16px 48px rgb(0 0 0 / 32%), inset 0 1px 0 rgb(255 255 255 / 6%);
  --glow: rgb(157 224 195 / 38%);
  --radius-xl: 24px;
  --radius-lg: 18px;
  --radius-md: 14px;
  --radius-pill: 999px;
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring: cubic-bezier(0.34, 1.45, 0.64, 1);
}

[data-theme="light"] {
  --glass-bg: rgb(255 255 255 / 45%);
  --glass-bg-strong: rgb(255 255 255 / 72%);
  --glass-border: rgb(42 143 103 / 28%);
  --glass-highlight: rgb(255 255 255 / 95%);
  --glass-blur: 26px;
  --glass-shadow: 0 16px 48px rgb(42 143 103 / 16%), inset 0 1px 0 rgb(255 255 255 / 80%);
  --glow: rgb(42 143 103 / 32%);
}

/* ─── Ambient background ─── */
body {
  position: relative;
  isolation: isolate;
}

body::before,
body::after {
  content: "";
  position: fixed;
  border-radius: 50%;
  pointer-events: none;
  z-index: -1;
  filter: blur(72px);
  opacity: 0.9;
  animation: ambient-drift 22s var(--ease-out) infinite alternate;
}

body::before {
  width: min(56vmax, 720px);
  height: min(56vmax, 720px);
  top: -12%;
  right: -8%;
  background: radial-gradient(circle, rgb(157 224 195 / 26%) 0%, transparent 68%);
}

body::after {
  width: min(44vmax, 560px);
  height: min(44vmax, 560px);
  bottom: 8%;
  left: -10%;
  animation-delay: -8s;
  animation-duration: 26s;
  background: radial-gradient(circle, rgb(107 201 168 / 18%) 0%, transparent 70%);
}

[data-theme="light"] body::before {
  background: radial-gradient(circle, rgb(58 171 126 / 32%) 0%, transparent 68%);
}

[data-theme="light"] body::after {
  background: radial-gradient(circle, rgb(184 236 217 / 45%) 0%, transparent 70%);
}

@keyframes ambient-drift {
  from { transform: translate3d(0, 0, 0) scale(1); }
  to { transform: translate3d(3%, 4%, 0) scale(1.06); }
}

/* ─── Glass utility ─── */
.glass,
.loc-card,
.menu-card,
.feature-box,
.contact-card,
.venue-card,
.inquiry__card,
.hero__meta-item,
.taste__stats > div,
.account-modal__dialog,
.delivery-cart-panel,
.m-venue-card__body,
.menu-page__controls,
.menu-dish-card,
.bento-tile {
  background: var(--glass-bg);
  backdrop-filter: blur(var(--glass-blur));
  -webkit-backdrop-filter: blur(var(--glass-blur));
  border: 1px solid var(--glass-border);
  box-shadow: var(--glass-shadow);
}

/* ─── Section backgrounds (просвечивают ambient) ─── */
.locations,
.social,
.taste {
  background: transparent;
}

[data-theme="light"] .locations,
[data-theme="light"] .social {
  background: linear-gradient(180deg, transparent, rgb(58 171 126 / 6%) 50%, transparent);
}

[data-theme="dark"] .locations,
[data-theme="dark"] .social {
  background: linear-gradient(180deg, transparent, rgb(157 224 195 / 4%) 50%, transparent);
}

/* ─── Header glass ─── */
.header--scrolled,
.header--solid {
  backdrop-filter: blur(var(--glass-blur)) saturate(1.2);
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(1.2);
  border-bottom-color: var(--glass-border) !important;
}

.header__inner {
  transition: transform 0.4s var(--ease-out);
}

/* ─── Nav ─── */
.nav__link {
  position: relative;
  transition: color 0.3s var(--ease-out), transform 0.3s var(--ease-out);
}

.nav__link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -5px;
  width: 100%;
  height: 2px;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--gold), var(--gold-light));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.35s var(--ease-out);
}

.nav__link:hover::after,
.nav__link--active::after {
  transform: scaleX(1);
}

.nav__link:hover {
  transform: translateY(-1px);
}

/* ─── Buttons ─── */
.btn {
  border-radius: var(--radius-pill);
  transition:
    background 0.35s var(--ease-out),
    color 0.35s var(--ease-out),
    border-color 0.35s var(--ease-out),
    transform 0.35s var(--ease-spring),
    box-shadow 0.35s var(--ease-out);
}

.btn--gold {
  background: linear-gradient(135deg, var(--gold) 0%, var(--gold-light) 100%);
  box-shadow: 0 4px 18px var(--glow);
}

.btn--gold:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 28px var(--glow);
}

.btn--gold:active {
  transform: translateY(0) scale(0.98);
}

.btn--outline,
.btn--outline-white {
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.btn--outline:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px var(--glow);
}

.theme-toggle {
  border-radius: var(--radius-pill);
  background: var(--glass-bg);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid var(--glass-border);
  transition: transform 0.35s var(--ease-spring), box-shadow 0.35s var(--ease-out), background 0.35s;
}

.theme-toggle:hover {
  transform: scale(1.06);
  box-shadow: 0 6px 20px var(--glow);
}

/* ─── Cards ─── */
.loc-card,
.menu-card,
.feature-box,
.contact-card,
.venue-card,
.bento-tile {
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition:
    transform 0.45s var(--ease-out),
    border-color 0.35s,
    box-shadow 0.45s var(--ease-out);
}

.loc-card:hover,
.menu-card:hover,
.feature-box:hover,
.contact-card:hover,
.venue-card:hover,
.bento-tile:hover {
  transform: translateY(-6px);
  border-color: var(--gold);
  box-shadow: 0 20px 48px var(--glow);
}

.loc-card__image img,
.menu-card:hover,
.social__item img,
.promo-banner__bg img {
  transition: transform 0.65s var(--ease-out);
}

.loc-card:hover .loc-card__image img {
  transform: scale(1.06);
}

/* ─── Hero ─── */
.hero__meta-item {
  border-radius: var(--radius-md);
  padding: 14px 18px;
  transition: transform 0.4s var(--ease-out), box-shadow 0.4s var(--ease-out);
}

.hero__meta-item:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 32px var(--glow);
}

body.is-loaded .hero__content > * {
  animation: motion-rise 0.9s var(--ease-out) backwards;
}

body.is-loaded .hero__content > *:nth-child(1) { animation-delay: 0.06s; }
body.is-loaded .hero__content > *:nth-child(2) { animation-delay: 0.14s; }
body.is-loaded .hero__content > *:nth-child(3) { animation-delay: 0.22s; }
body.is-loaded .hero__content > *:nth-child(4) { animation-delay: 0.30s; }
body.is-loaded .hero__content > *:nth-child(5) { animation-delay: 0.38s; }
body.is-loaded .hero__content > *:nth-child(6) { animation-delay: 0.46s; }

@keyframes motion-rise {
  from {
    opacity: 0;
    transform: translateY(28px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

/* ─── Sections ─── */
.section-head {
  animation: motion-fade 0.8s var(--ease-out) backwards;
}

.section:nth-of-type(2) .section-head { animation-delay: 0.05s; }
.section:nth-of-type(3) .section-head { animation-delay: 0.08s; }

@keyframes motion-fade {
  from { opacity: 0; transform: translateY(16px); }
  to { opacity: 1; transform: none; }
}

.eyebrow {
  animation: eyebrow-glow 3s ease-in-out infinite alternate;
}

@keyframes eyebrow-glow {
  from { opacity: 0.88; }
  to { opacity: 1; text-shadow: 0 0 20px var(--glow); }
}

.taste__stats > div {
  border-radius: var(--radius-md);
  padding: 20px 24px;
  transition: transform 0.4s var(--ease-out);
}

.taste__stats > div:hover {
  transform: translateY(-4px) scale(1.02);
}

/* ─── Promo banners ─── */
.promo-banner {
  border-radius: var(--radius-xl);
  border: 1px solid var(--glass-border);
  overflow: hidden;
  transition: transform 0.5s var(--ease-out), box-shadow 0.5s var(--ease-out);
}

.promo-banner:hover {
  transform: translateY(-4px);
  box-shadow: 0 24px 56px var(--glow);
}

.promo-banner__content {
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

/* ─── Newsletter ─── */
.newsletter {
  position: relative;
  overflow: hidden;
}

.newsletter::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, var(--gold-soft), transparent 55%);
  pointer-events: none;
}

.newsletter__form input {
  border-radius: var(--radius-pill);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  transition: border-color 0.3s, box-shadow 0.3s, transform 0.3s var(--ease-out);
}

.newsletter__form input:focus {
  transform: translateY(-1px);
  box-shadow: 0 8px 24px var(--glow);
}

.newsletter__form button {
  border-radius: var(--radius-pill);
  transition: transform 0.35s var(--ease-spring), box-shadow 0.35s;
}

.newsletter__form button:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px var(--glow);
}

/* ─── Links ─── */
.link-arrow {
  transition: transform 0.35s var(--ease-out), opacity 0.35s, color 0.35s;
}

.link-arrow:hover {
  transform: translateX(4px);
}

.logo {
  transition: transform 0.4s var(--ease-out), text-shadow 0.4s;
}

.logo:hover {
  transform: scale(1.03);
  text-shadow: 0 0 24px var(--glow);
}

/* ─── Reveal (scroll) ─── */
.reveal {
  opacity: 0;
  transform: translateY(24px) scale(0.98);
  transition:
    opacity 0.7s var(--ease-out),
    transform 0.7s var(--ease-out);
  transition-delay: var(--reveal-delay, 0ms);
}

.reveal.is-visible {
  opacity: 1;
  transform: none;
}

/* ─── Social grid ─── */
.social__item {
  border-radius: var(--radius-md);
  border: 1px solid var(--glass-border);
  transition: transform 0.4s var(--ease-out), box-shadow 0.4s;
}

.social__item:hover {
  transform: translateY(-4px) scale(1.02);
  box-shadow: 0 12px 32px var(--glow);
}

/* ─── Footer ─── */
.footer {
  backdrop-filter: blur(var(--glass-blur));
  -webkit-backdrop-filter: blur(var(--glass-blur));
}

.footer__col a {
  transition: color 0.25s, transform 0.25s var(--ease-out);
  display: inline-block;
}

.footer__col a:hover {
  transform: translateX(4px);
  color: var(--gold);
}

/* ─── Toast ─── */
.toast {
  border-radius: var(--radius-md);
  backdrop-filter: blur(var(--glass-blur));
  -webkit-backdrop-filter: blur(var(--glass-blur));
}

/* ─── Mobile nav glass ─── */
@media (max-width: 768px) {
  body.nav-open .nav {
    background: var(--glass-bg-strong);
    backdrop-filter: blur(var(--glass-blur)) saturate(1.15);
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(1.15);
    border-left: 1px solid var(--glass-border);
  }

  .nav__link {
    border-radius: var(--radius-md);
    transition: background 0.3s, transform 0.3s var(--ease-out);
  }

  .nav__link:hover,
  .nav__link--active {
    background: var(--gold-soft);
    transform: translateX(4px);
  }

  .nav__link::after { display: none; }
}

/* ─── Shimmer + float accents ─── */
.glass-shimmer {
  position: relative;
  overflow: hidden;
}

.glass-shimmer::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    105deg,
    transparent 40%,
    rgb(255 255 255 / 12%) 50%,
    transparent 60%
  );
  transform: translateX(-120%);
  animation: glass-shimmer 4.5s ease-in-out infinite;
  pointer-events: none;
}

@keyframes glass-shimmer {
  0%, 70%, 100% { transform: translateX(-120%); }
  85% { transform: translateX(120%); }
}

.hero__bg img,
.hero__image img {
  animation: hero-ken-burns 28s var(--ease-out) infinite alternate;
}

@keyframes hero-ken-burns {
  from { transform: scale(1) translate3d(0, 0, 0); }
  to { transform: scale(1.08) translate3d(-1.5%, -1%, 0); }
}

.promo-banner__bg img {
  animation: hero-ken-burns 22s var(--ease-out) infinite alternate;
}

/* ─── Extra glass surfaces ─── */
.cta,
.inquiry,
.delivery-hero,
.events-hero,
.restaurants-hero,
.menu-hero {
  position: relative;
}

.cta__inner,
.inquiry__wrap,
.delivery-hero__card,
.events-hero__panel {
  background: var(--glass-bg-strong);
  backdrop-filter: blur(var(--glass-blur)) saturate(1.15);
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(1.15);
  border: 1px solid var(--glass-border);
  box-shadow: var(--glass-shadow), inset 0 1px 0 var(--glass-highlight);
  border-radius: var(--radius-xl);
}

.section-title {
  transition: letter-spacing 0.5s var(--ease-out), text-shadow 0.5s;
}

.section-head:hover .section-title {
  letter-spacing: 0.02em;
  text-shadow: 0 0 32px var(--glow);
}

/* ─── Staggered card float ─── */
.loc-card:nth-child(odd),
.menu-dish-card:nth-child(odd) {
  animation: card-float 6s ease-in-out infinite;
}

.loc-card:nth-child(even),
.menu-dish-card:nth-child(even) {
  animation: card-float 6s ease-in-out infinite reverse;
  animation-delay: -3s;
}

@keyframes card-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-4px); }
}

.loc-card:hover,
.menu-dish-card:hover {
  animation: none;
}

/* ─── Logo pulse ─── */
.logo {
  transition: transform 0.4s var(--ease-spring), filter 0.4s;
}

.logo:hover {
  transform: scale(1.03);
  filter: drop-shadow(0 0 12px var(--glow));
}

/* ─── Page load wave ─── */
body.is-loaded .header {
  animation: header-slide 0.7s var(--ease-out) backwards;
}

@keyframes header-slide {
  from { opacity: 0; transform: translateY(-12px); }
  to { opacity: 1; transform: none; }
}

/* ─── Profile page ambient boost ─── */
body[data-page="profile"]::before {
  opacity: 1;
  filter: blur(88px);
}

body[data-page="profile"]::after {
  opacity: 0.95;
  animation-duration: 18s;
}

@media (prefers-reduced-motion: reduce) {
  body::before,
  body::after,
  .eyebrow,
  .section-head,
  body.is-loaded .hero__content > * {
    animation: none !important;
  }

  .reveal,
  .reveal.is-visible {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  .btn:hover,
  .loc-card:hover,
  .menu-card:hover,
  .logo:hover {
    transform: none !important;
  }

  .hero__bg img,
  .hero__image img,
  .promo-banner__bg img,
  .loc-card,
  .menu-dish-card {
    animation: none !important;
  }

  .glass-shimmer::after {
    display: none;
  }
}