/* =========================
   HOME PAGE — HERO MOSAIC
   ========================= */
.hero-mosaic{
  background:
    radial-gradient(800px 400px at 85% 20%, rgba(255,184,77,.08), transparent 70%),
    radial-gradient(700px 320px at 20% 20%, rgba(207,103,70,.12), transparent 65%);
}
.hero-mosaic__grid{
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  align-items: center;
  gap: clamp(20px, 5vw, 48px);
}
.hero-mosaic__title{
  font-family: "Playfair Display", serif;
  font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.2rem);
  line-height: 1.25;
  margin: 0 0 14px;
  color: var(--clr-text);
  text-wrap: balance;
}
.hero-mosaic__lead{
  margin: 0 0 12px;
  color: #efece6;
}
.hero-mosaic__note{
  color: var(--clr-muted);
  margin: 0;
}

/* Мозаика полароидов (3 фото) */
.hero-mosaic__photos{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  align-content: start;
}
.polaroid{
  background: #1b1b1b;
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-soft);
  padding: 10px 10px 12px;
  border: 1px solid rgba(255,255,255,.06);
  transform: translateY(0);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.polaroid:hover,
.polaroid:focus-within{
  transform: translateY(-4px);
  border-color: rgba(255,184,77,.35);
  box-shadow: 0 16px 28px rgba(0,0,0,.28), 0 4px 10px rgba(0,0,0,.18);
}

.polaroid--tilt-left{ rotate: -2.2deg; }
.polaroid--tilt-right{ rotate: 2.2deg; }

.polaroid__img{
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  border-radius: calc(var(--radius-xl) - 6px);
  border: 1px solid rgba(255,255,255,.06);
  filter: saturate(1.02) contrast(1.02);
  transition: filter .25s ease;
}
.polaroid:hover .polaroid__img{ filter: saturate(1.05) contrast(1.05); }

.polaroid__caption{
  margin: 8px 6px 2px;
  color: var(--clr-muted);
  font-size: .92rem;
  letter-spacing: .2px;
}

/* Компоновка картинок: 2 сверху, одна широкая внизу */
.hero-mosaic__photos .polaroid:nth-child(3){
  grid-column: 1 / -1;
}

/* АДАПТИВ */
@media (max-width: 980px){
  .hero-mosaic__grid{
    grid-template-columns: 1fr;
  }
  .hero-mosaic__photos{
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 640px){
  .hero-mosaic__photos{
    grid-template-columns: 1fr;
  }
  .polaroid--tilt-left,
  .polaroid--tilt-right{ rotate: 0deg; }
}
/* =========================
   SECTION 2 — CITRUS RITUAL
   ========================= */
.citrus-ritual{
  background:
    radial-gradient(700px 320px at 10% 20%, rgba(255,184,77,.08), transparent 65%),
    radial-gradient(600px 300px at 90% 10%, rgba(207,103,70,.10), transparent 60%);
}
.citrus-ritual__wrap{ display: grid; gap: 16px; }
.section-title{
  font-family: "Playfair Display", serif;
  font-size: clamp(1.35rem, 1rem + 1.1vw, 1.9rem);
  margin: 0 0 4px;
}
.section-intro{ color: #efece6; margin: 0 0 8px; }

.steps{
  list-style: none; margin: 0; padding: 0;
  position: relative;
}
.steps::before{
  content: ""; position: absolute; left: 10px; top: 0; bottom: 0;
  width: 2px; background: linear-gradient(var(--clr-accent), transparent);
  opacity: .4;
}
.step{
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: clamp(16px, 4vw, 28px);
  padding: 18px 0 22px 0;
  position: relative;
}
.step + .step{ border-top: 1px dashed rgba(255,255,255,.08); }
.step::before{
  content: ""; position: absolute; left: 0; top: 22px;
  width: 22px; height: 22px; border-radius: 50%;
  background: radial-gradient(circle at 40% 40%, var(--clr-accent), var(--clr-accent-2));
  box-shadow: 0 0 0 4px rgba(255,184,77,.15);
}

.step:nth-child(even) .step__media{ order: 2; }
.step__media{
  background: #1a1a1a;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: var(--radius-2xl);
  box-shadow: var(--shadow-soft);
  padding: 10px;
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.step__media:hover{ transform: translateY(-3px); border-color: rgba(255,184,77,.35); }
.step__media img{
  width: 100%; aspect-ratio: 4/3; object-fit: cover;
  border-radius: calc(var(--radius-2xl) - 8px);
  border: 1px solid rgba(255,255,255,.06);
}
.step__media figcaption{
  color: var(--clr-muted); font-size: .9rem; margin-top: 6px;
}
.step__text .step__title{ margin: 0 0 6px; font-weight: 700; }
.step__text p{ margin: 0; }

@media (max-width: 900px){
  .step{ grid-template-columns: 1fr; }
  .step:nth-child(even) .step__media{ order: 0; }
  .steps::before{ left: 6px; }
}

/* =========================
   SECTION 3 — SEASONAL SHOWCASE
   ========================= */
.seasonal-showcase{
  background:
    radial-gradient(700px 340px at 50% 0%, rgba(255,184,77,.06), transparent 70%);
}
.showcase__scroller{
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(220px, 320px);
  gap: 14px;
  overflow-x: auto;
  padding: 12px clamp(12px, 4vw, 24px) 4px;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
}
.showcase__scroller::-webkit-scrollbar{ height: 8px; }
.showcase__scroller::-webkit-scrollbar-thumb{
  background: rgba(255,255,255,.12); border-radius: 999px;
}
.showcase__card{
  scroll-snap-align: start;
  background: #1a1a1a;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: var(--radius-2xl);
  box-shadow: var(--shadow-soft);
  padding: 10px;
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.showcase__card:hover{
  transform: translateY(-4px);
  border-color: rgba(255,184,77,.35);
  box-shadow: 0 16px 28px rgba(0,0,0,.28), 0 4px 10px rgba(0,0,0,.18);
}
.showcase__card img{
  width: 100%; aspect-ratio: 4/3; object-fit: cover;
  border-radius: calc(var(--radius-2xl) - 8px);
  border: 1px solid rgba(255,255,255,.06);
}
.showcase__card figcaption{
  margin-top: 8px; color: var(--clr-muted); font-size: .92rem;
}
.showcase__note{
  color: var(--clr-muted);
  margin-top: 10px;
}

/* =========================
   SECTION 4 — CLAY PLATE DUO (PARALLAX TILT)
   ========================= */
.clay-plate-duo__grid{
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: clamp(18px, 5vw, 36px);
}
.clay-plate-duo__text .quote{
  margin: 10px 0; padding: 10px 14px;
  border-left: 3px solid rgba(255,184,77,.45);
  color: #efece6; font-style: italic;
  background: rgba(255,255,255,.03);
  border-radius: 10px;
}

.clay-plate-duo__gallery{
  display: grid; gap: 12px;
}
.tilt-card{
  perspective: 800px; /* контейнер для 3D-ощущения */
  background: #1a1a1a;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: var(--radius-2xl);
  padding: 10px;
  box-shadow: var(--shadow-soft);
  transition: border-color .25s ease, box-shadow .25s ease;
  will-change: transform;
}
.tilt-card:hover{ border-color: rgba(255,184,77,.35); }
.tilt-card img{
  display: block;
  width: 100%; aspect-ratio: 4/3; object-fit: cover;
  border-radius: calc(var(--radius-2xl) - 8px);
  border: 1px solid rgba(255,255,255,.06);
  transform: translateZ(0); /* сглаживание */
}
.tilt-card figcaption{
  margin-top: 8px; color: var(--clr-muted); font-size: .92rem;
}

/* Адаптив */
@media (max-width: 980px){
  .clay-plate-duo__grid{ grid-template-columns: 1fr; }
}
/* =========================
   SECTION 5 — CHEF STORY
   ========================= */
.chef-story__grid{
  display: grid;
  grid-template-columns: .95fr 1.05fr;
  gap: clamp(18px, 5vw, 36px);
}
.chef-story__aside{
  position: sticky;
  top: calc(var(--header-h) + 12px);
  align-self: start;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: var(--radius-xl);
  padding: 16px 14px;
}
.chef-story .muted{ color: var(--clr-muted); }

.chef-film{
  display: grid;
  gap: 12px;
}
.film__frame{
  background: #1a1a1a;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: var(--radius-2xl);
  padding: 10px;
  box-shadow: var(--shadow-soft);
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.film__frame:hover{
  transform: translateY(-4px);
  border-color: rgba(255,184,77,.35);
  box-shadow: 0 16px 28px rgba(0,0,0,.28), 0 4px 10px rgba(0,0,0,.18);
}
.film__frame img{
  width: 100%; aspect-ratio: 4/3; object-fit: cover;
  border-radius: calc(var(--radius-2xl) - 8px);
  border: 1px solid rgba(255,255,255,.06);
}
.film__frame figcaption{
  margin-top: 8px; color: var(--clr-muted); font-size: .92rem;
}

@media (max-width: 980px){
  .chef-story__grid{ grid-template-columns: 1fr; }
  .chef-story__aside{ position: static; }
}

/* =========================
   SECTION 6 — TASTING FLIGHTS (ORBITS)
   ========================= */
.tasting-flights{
  background:
    radial-gradient(700px 320px at 85% 0%, rgba(255,184,77,.08), transparent 70%);
}
.tasting-flights__wrap{ display: grid; gap: 12px; }

.orbit{
  --size: 320px;
  width: var(--size); height: var(--size);
  margin: 6px auto 2px;
  position: relative;
  border-radius: 50%;
  border: 1px dashed rgba(255,255,255,.12);
  animation: orbit-spin 26s linear infinite;
}
@keyframes orbit-spin{
  from{ transform: rotate(0); } to{ transform: rotate(360deg); }
}
.orbit:hover{ animation-play-state: paused; }

.orbit__item{
  position: absolute;
  width: 140px;
  left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  background: #1a1a1a;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: var(--radius-2xl);
  padding: 8px;
  box-shadow: var(--shadow-soft);
  text-align: center;
}
.orbit__item img{
  width: 100%; aspect-ratio: 4/3; object-fit: cover;
  border-radius: calc(var(--radius-2xl) - 8px);
  border: 1px solid rgba(255,255,255,.06);
}
.orbit__item figcaption{
  margin-top: 6px; font-size: .9rem; color: var(--clr-muted);
}

/* Расставляем по орбите */
.orbit__item--a{ transform: translate(-50%, -50%) rotate(0deg) translateX(calc(var(--size)/2.4)) rotate(0deg); }
.orbit__item--b{ transform: translate(-50%, -50%) rotate(90deg) translateX(calc(var(--size)/2.4)) rotate(-90deg); }
.orbit__item--c{ transform: translate(-50%, -50%) rotate(180deg) translateX(calc(var(--size)/2.4)) rotate(-180deg); }
.orbit__item--d{ transform: translate(-50%, -50%) rotate(270deg) translateX(calc(var(--size)/2.4)) rotate(-270deg); }

.tasting-note{ color: var(--clr-muted); margin: 8px 0 0; text-align: center; }

/* Мобильная деградация: превращаемся в сетку */
@media (max-width: 640px){
  .orbit{ width: 100%; height: auto; border: 0; animation: none; }
  .orbit{ display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .orbit__item{
    position: static; width: auto; transform: none;
  }
}

/* =========================
   SECTION 7 — NIGHT LIGHTS (REVEALS)
   ========================= */
.night-lights{
  background:
    radial-gradient(900px 380px at 50% 0%, rgba(207,103,70,.10), transparent 60%);
}
.reveal-row{
  width: min(1200px, 92vw);
  margin: 8px auto 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  padding: 0 12px;
}
.reveal{
  background: #1a1a1a;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: var(--radius-2xl);
  padding: 10px;
  box-shadow: var(--shadow-soft);
  overflow: hidden;
}
.reveal img{
  width: 100%; aspect-ratio: 4/3; object-fit: cover;
  border-radius: calc(var(--radius-2xl) - 8px);
  border: 1px solid rgba(255,255,255,.06);
  /* Эффект «шторки» */
  --mask-y: 100%;
  clip-path: inset(0 0 var(--mask-y) 0);
  transition: clip-path .8s ease, filter .25s ease;
}
.reveal.is-visible img{ --mask-y: 0%; }
.reveal:hover img{ filter: saturate(1.06) contrast(1.05); }

.reveal figcaption{
  margin-top: 8px; color: var(--clr-muted); font-size: .92rem;
}

@media (max-width: 900px){
  .reveal-row{ grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce){
  .orbit{ animation: none !important; }
  .reveal img{ transition: none !important; clip-path: none !important; }
}
/* =========================
   SECTION 8 — CLAY STUDIO (DIPTYCH)
   ========================= */
.clay-studio__grid{
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: clamp(18px, 5vw, 36px);
}
.clay-panels{
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
}
.clay-panel{
  background: #1a1a1a;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: var(--radius-2xl);
  padding: 10px;
  box-shadow: var(--shadow-soft);
  transition: border-color .25s ease, transform .25s ease, box-shadow .25s ease;
}
.clay-panel:hover{
  transform: translateY(-4px);
  border-color: rgba(255,184,77,.35);
  box-shadow: 0 16px 28px rgba(0,0,0,.28), 0 4px 10px rgba(0,0,0,.18);
}
.clay-panel img{
  width: 100%; aspect-ratio: 4/3; object-fit: cover;
  border-radius: calc(var(--radius-2xl) - 8px);
  border: 1px solid rgba(255,255,255,.06);
}
.clay-panel figcaption{
  margin-top: 8px; color: var(--clr-muted); font-size: .92rem;
}
@media (max-width: 980px){
  .clay-studio__grid{ grid-template-columns: 1fr; }
  .clay-panels{ grid-template-columns: 1fr; }
}

/* =========================
   SECTION 9 — SUPPLIERS MAP
   ========================= */
.suppliers-map{
  background:
    radial-gradient(720px 360px at 12% 18%, rgba(255,184,77,.08), transparent 65%);
}
.suppliers-map__wrap{ display: grid; gap: 12px; }
.suppliers-layout{
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: clamp(16px, 5vw, 32px);
}
.suppliers-legend{
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: var(--radius-xl);
  padding: 14px;
  align-self: start;
}
.legend{
  list-style: none; margin: 0 0 8px; padding: 0;
  display: grid; gap: 6px;
}
.legend__item{
  position: relative; padding-left: 28px;
}
.legend__item::before{
  content: ""; position: absolute; left: 0; top: .45em;
  width: 16px; height: 16px; border-radius: 50%;
  background: var(--clr-accent);
  box-shadow: 0 0 0 3px rgba(255,184,77,.18);
}
.legend__item--south::before{ background: #ffb84d; }
.legend__item--center::before{ background: #cf6746; }
.legend__item--west::before{ background: #b3a07e; }
.legend__item--east::before{ background: #ff8a5b; }

.legend__note{ color: var(--clr-muted); margin: 0; }

.suppliers-media{
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
}
.card{
  background: #1a1a1a;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: var(--radius-2xl);
  padding: 10px;
  box-shadow: var(--shadow-soft);
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.card:hover{
  transform: translateY(-4px);
  border-color: rgba(255,184,77,.35);
  box-shadow: 0 16px 28px rgba(0,0,0,.28), 0 4px 10px rgba(0,0,0,.18);
}
.card img{
  width: 100%; aspect-ratio: 4/3; object-fit: cover;
  border-radius: calc(var(--radius-2xl) - 8px);
  border: 1px solid rgba(255,255,255,.06);
}
.card figcaption{
  margin-top: 8px; color: var(--clr-muted); font-size: .92rem;
}

@media (max-width: 980px){
  .suppliers-layout{ grid-template-columns: 1fr; }
  .suppliers-media{ grid-template-columns: 1fr; }
}

/* =========================
   SECTION 10 — OPEN KITCHEN + PROGRESS
   ========================= */
.open-kitchen__head{ display: grid; gap: 10px; }
.progressbar{
  position: relative; height: 6px;
  background: rgba(255,255,255,.08);
  border-radius: 999px; overflow: hidden;
  border: 1px solid rgba(255,255,255,.10);
}
.progressbar__fill{
  position: absolute; left: 0; top: 0; bottom: 0;
  width: 0%;
  background: linear-gradient(90deg, var(--clr-accent), var(--clr-accent-2));
  border-radius: inherit;
  transition: width .15s linear;
}

.open-kitchen__grid{
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: clamp(18px, 5vw, 36px);
}
.open-kitchen__text p{ margin: 0 0 8px; }

.open-kitchen__media{
  display: grid; gap: 12px;
}
.ok-card{
  background: #1a1a1a;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: var(--radius-2xl);
  padding: 10px;
  box-shadow: var(--shadow-soft);
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.ok-card:hover{
  transform: translateY(-4px);
  border-color: rgba(255,184,77,.35);
  box-shadow: 0 16px 28px rgba(0,0,0,.28), 0 4px 10px rgba(0,0,0,.18);
}
.ok-card img{
  width: 100%; aspect-ratio: 4/3; object-fit: cover;
  border-radius: calc(var(--radius-2xl) - 8px);
  border: 1px solid rgba(255,255,255,.06);
}
.ok-card figcaption{
  margin-top: 8px; color: var(--clr-muted); font-size: .92rem;
}

@media (max-width: 980px){
  .open-kitchen__grid{ grid-template-columns: 1fr; }
}
/* =========================
   SECTION 6 (NEW) — TASTING FLIGHTS GRID
   ========================= */
.tasting-flights--grid{
  background:
    radial-gradient(700px 320px at 85% 0%, rgba(255,184,77,.08), transparent 70%),
    radial-gradient(600px 260px at 15% 100%, rgba(207,103,70,.08), transparent 65%);
}
.flights-grid{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-top: 8px;
}
.flight-card{
  position: relative;
  background: #1a1a1a;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: var(--radius-2xl);
  padding: 10px;
  box-shadow: var(--shadow-soft);
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.flight-card:hover,
.flight-card:focus-within{
  transform: translateY(-3px);
  border-color: rgba(255,184,77,.35);
  box-shadow: 0 16px 28px rgba(0,0,0,.28), 0 4px 10px rgba(0,0,0,.18);
}
.flight-card img{
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  border-radius: calc(var(--radius-2xl) - 8px);
  border: 1px solid rgba(255,255,255,.06);
}
.flight-card figcaption{
  margin-top: 8px;
  color: var(--clr-muted);
  font-size: .92rem;
}

/* Маленькие бейджи-вкусы */
.badge{
  position: absolute;
  inset: 12px auto auto 12px;
  padding: 4px 8px;
  font-size: .78rem;
  letter-spacing: .2px;
  color: #101010;
  background: var(--clr-accent);
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.15);
  box-shadow: 0 2px 6px rgba(0,0,0,.25);
}
.badge--acid{ background: #ffb84d; }
.badge--smoke{ background: #cf6746; color: #1a1a1a; }
.badge--sweet{ background: #ffd27a; }
.badge--fresh{ background: #ffc36a; }

/* Адаптив: плотнее на ноутбуках/мобилках */
@media (max-width: 1100px){
  .flights-grid{ grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 780px){
  .flights-grid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px){
  .flights-grid{ grid-template-columns: 1fr; }
  .badge{ inset: 10px auto auto 10px; }
}
/* =========================
   SECTION 11 — MIXOLOGY LAB
   ========================= */
.mixology-lab{
  background:
    radial-gradient(700px 320px at 12% 0%, rgba(255,184,77,.07), transparent 70%);
}
.mixology-lab__grid{
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: clamp(18px, 5vw, 36px);
}
.mixology-lab__photos{
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
}
.lab-card{
  background: #1a1a1a;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: var(--radius-2xl);
  padding: 10px;
  box-shadow: var(--shadow-soft);
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.lab-card:hover{ transform: translateY(-3px); border-color: rgba(255,184,77,.35); }
.lab-card img{
  width: 100%; aspect-ratio: 4/3; object-fit: cover;
  border-radius: calc(var(--radius-2xl) - 8px);
  border: 1px solid rgba(255,255,255,.06);
}
.lab-card figcaption{ margin-top: 8px; color: var(--clr-muted); font-size: .92rem; }

/* Чипсы-вкусы */
.chips{
  display: flex; flex-wrap: wrap; gap: 8px;
  margin: 8px 0 10px; padding: 0; list-style: none;
}
.chip{
  padding: 6px 10px; border-radius: 999px;
  background: rgba(255,184,77,.12);
  border: 1px solid rgba(255,184,77,.25);
  font-size: .85rem; color: #f5f2ec;
  transition: transform .15s ease;
}
.chip:hover{ transform: translateY(-2px); }

@media (max-width: 980px){
  .mixology-lab__grid{ grid-template-columns: 1fr; }
  .mixology-lab__photos{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px){
  .mixology-lab__photos{ grid-template-columns: 1fr; }
}

/* =========================
   SECTION 12 — WINDOW TABLE (DAY/NIGHT TOGGLE)
   ========================= */
.window-table__wrap{ display: grid; gap: 12px; }
.window-table__head{
  display: grid; gap: 10px; align-items: center;
}
.mode-toggle{
  justify-self: start;
  position: relative;
  width: 84px; height: 36px;
  border-radius: 999px;
  background: #1a1a1a;
  border: 1px solid rgba(255,255,255,.10);
  cursor: pointer;
  display: inline-flex; align-items: center; padding: 0 8px 0 6px;
  transition: background-color .2s ease, border-color .2s ease, transform .2s ease;
}
.mode-toggle:hover{ transform: translateY(-1px); border-color: rgba(255,255,255,.18); }
.mode-toggle__dot{
  width: 24px; height: 24px; border-radius: 50%;
  background: var(--clr-accent);
  transition: transform .25s ease;
}
.mode-toggle__label{
  margin-left: 8px; font-size: .9rem; color: var(--clr-muted);
}
.window-view{
  position: relative; overflow: hidden;
  background: #1a1a1a;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: var(--radius-2xl);
  padding: 10px;
  box-shadow: var(--shadow-soft);
}
.window-view__img{
  width: 100%; aspect-ratio: 4/3; object-fit: cover;
  border-radius: calc(var(--radius-2xl) - 8px);
  border: 1px solid rgba(255,255,255,.06);
  position: absolute; inset: 10px;
  transition: opacity .5s ease, filter .35s ease;
}
.window-view__img--day{ opacity: 1; }
.window-view__img--night{ opacity: 0; filter: saturate(.95) brightness(.9); }
.window-view__caption{ margin-top: 8px; color: var(--clr-muted); font-size: .92rem; position: relative; z-index: 1; }

/* Активируем ночь */
.window-table.is-night .mode-toggle__dot{ transform: translateX(44px); }
.window-table.is-night .mode-toggle__label{ color: #e8e5df; }
.window-table.is-night .window-view__img--day{ opacity: 0; }
.window-table.is-night .window-view__img--night{ opacity: 1; filter: none; }

/* =========================
   SECTION 13 — ZERO WASTE
   ========================= */
.zero-waste__grid{
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: clamp(18px, 5vw, 36px);
}
.zero-waste__media{
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
}
.zw-card{
  background: #1a1a1a;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: var(--radius-2xl);
  padding: 10px;
  box-shadow: var(--shadow-soft);
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.zw-card:hover{ transform: translateY(-3px); border-color: rgba(255,184,77,.35); }
.zw-card img{
  width: 100%; aspect-ratio: 4/3; object-fit: cover;
  border-radius: calc(var(--radius-2xl) - 8px);
  border: 1px solid rgba(255,255,255,.06);
}
.zw-card figcaption{ margin-top: 8px; color: var(--clr-muted); font-size: .92rem; }

.benefits{
  margin: 8px 0 0; padding-left: 18px;
}
.benefits li + li{ margin-top: 4px; }

@media (max-width: 980px){
  .zero-waste__grid{ grid-template-columns: 1fr; }
  .zero-waste__media{ grid-template-columns: 1fr; }
}
/* =========================
   SECTION 14 — KILN BATCH (COMPOSITIONS)
   ========================= */
.kiln-batch__grid{
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: clamp(18px, 5vw, 36px);
}
.kiln-batch__gallery{
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
}
.stack-card{
  background: #1a1a1a;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: var(--radius-2xl);
  padding: 10px;
  box-shadow: var(--shadow-soft);
  position: relative;
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.stack-card::before,
.stack-card::after{
  content:""; position: absolute; inset: 6px 8px auto auto; height: 8px; width: 40%;
  border-radius: 6px; background: rgba(255,255,255,.05); filter: blur(4px);
}
.stack-card:hover{
  transform: translateY(-3px);
  border-color: rgba(255,184,77,.35);
  box-shadow: 0 16px 28px rgba(0,0,0,.28), 0 4px 10px rgba(0,0,0,.18);
}
.stack-card img{
  width: 100%; aspect-ratio: 4/3; object-fit: cover;
  border-radius: calc(var(--radius-2xl) - 8px);
  border: 1px solid rgba(255,255,255,.06);
}
.stack-card figcaption{ margin-top: 8px; color: var(--clr-muted); font-size: .92rem; }
.stack-card--offset{ transform: translateY(6px); }
@media (max-width: 980px){
  .kiln-batch__grid{ grid-template-columns: 1fr; }
  .kiln-batch__gallery{ grid-template-columns: 1fr; }
}

/* =========================
   SECTION 15 — VISIT US (CTA + MAP)
   ========================= */
.visit-us__grid{
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: clamp(18px, 5vw, 36px);
}
.visit-details{
  list-style: none; margin: 10px 0 12px; padding: 0;
  display: grid; gap: 4px; color: #efece6;
}
.visit-details span{ color: var(--clr-muted); margin-right: 6px; }
.visit-details a{ color: var(--clr-accent); text-decoration: none; }
.visit-details a:hover{ text-decoration: underline; }

.cta-row{ display: flex; flex-wrap: wrap; gap: 10px; }
.cta-btn{
  display: inline-flex; align-items: center; justify-content: center;
  padding: 10px 16px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--clr-accent), var(--clr-accent-2));
  color: #111; text-decoration: none; font-weight: 700;
  border: 1px solid rgba(0,0,0,.15);
  box-shadow: 0 8px 18px rgba(0,0,0,.25);
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
  will-change: transform;
}
.cta-btn:hover{ transform: translateY(-2px); filter: brightness(1.03); }
.cta-btn--ghost{
  background: transparent; color: var(--clr-text);
  border: 1px solid rgba(255,255,255,.18);
  box-shadow: none;
}
.cta-btn--ghost:hover{ background: rgba(255,255,255,.06); }

.visit-us__media{
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
}
.visit-card{
  background: #1a1a1a;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: var(--radius-2xl);
  padding: 10px;
  box-shadow: var(--shadow-soft);
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.visit-card:hover{
  transform: translateY(-3px);
  border-color: rgba(255,184,77,.35);
  box-shadow: 0 16px 28px rgba(0,0,0,.28), 0 4px 10px rgba(0,0,0,.18);
}
.visit-card img{
  width: 100%; aspect-ratio: 4/3; object-fit: cover;
  border-radius: calc(var(--radius-2xl) - 8px);
  border: 1px solid rgba(255,255,255,.06);
}
.visit-card figcaption{ margin-top: 8px; color: var(--clr-muted); font-size: .92rem; }

@media (max-width: 980px){
  .visit-us__grid{ grid-template-columns: 1fr; }
  .visit-us__media{ grid-template-columns: 1fr; }
}
/* =========================
   TEXT-ONLY SECTION A — LONGREAD MANIFEST
   ========================= */
.longread__wrap{ display: grid; gap: 12px; }
.longread__grid{
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: clamp(18px, 5vw, 36px);
}
.dropcap::first-letter{
  font-family: "Playfair Display", serif;
  float: left; font-size: 3.2rem; line-height: .9; padding: 2px 10px 2px 0;
  color: #ffd28a;
}
.pullquote{
  margin: 10px 0; padding: 10px 12px;
  border-left: 3px solid rgba(255,184,77,.6);
  background: rgba(255,255,255,.03);
  color: #efece6; font-style: italic; border-radius: var(--radius-xl);
}
.principles{
  list-style: none; margin: 8px 0 10px; padding: 0; display: grid; gap: 6px;
}
.principles li{
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--radius-xl);
  padding: 8px 10px;
}
@media (max-width: 980px){
  .longread__grid{ grid-template-columns: 1fr; }
}

/* =========================
   TEXT-ONLY SECTION B — CLAY GUIDE
   ========================= */
.guide__wrap{ display: grid; gap: 12px; }
.guide-steps{
  counter-reset: step; list-style: none; margin: 8px 0 10px; padding: 0; display: grid; gap: 10px;
}
.guide-step{
  position: relative;
  background: #1a1a1a;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: var(--radius-xl);
  padding: 12px 12px 12px 48px;
  box-shadow: var(--shadow-soft);
}
.guide-step::before{
  counter-increment: step; content: counter(step);
  position: absolute; left: 10px; top: 12px;
  width: 26px; height: 26px; border-radius: 50%;
  display: grid; place-items: center;
  background: linear-gradient(180deg, var(--clr-accent), var(--clr-accent-2));
  color: #111; font-weight: 700; box-shadow: 0 0 0 3px rgba(255,184,77,.18);
}
.guide-step__title{ margin: 0 0 4px; font-weight: 700; }
.guide-step__text{ margin: 0; color: var(--clr-muted); }

.guide-faq{
  margin: 6px 0 0;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--radius-xl);
  padding: 10px 12px;
}
.guide-faq > summary{
  cursor: pointer; font-weight: 700; list-style: none;
}
.guide-faq > summary::-webkit-details-marker{ display: none; }
.guide-faq[open]{ border-color: rgba(255,184,77,.35); }