/* =========================================================
   Сайт шоу мыльных пузырей: стили
   Радиусы: карточки 28px, медиа внутри 20px, поля 16px, кнопки — пилюли.
   Один акцент: фиолетовый --accent.
   ========================================================= */

:root {
  color-scheme: light;
  --bg: #f4effa;
  --bg-2: #efe7f8;
  --surface: #ffffff;
  --surface-soft: rgba(255, 255, 255, .62);
  --ink: #2a2140;
  --ink-2: #4f4566;
  --muted: #6c6383;
  --line: rgba(76, 58, 120, .12);
  --accent: #6a52b8;
  --accent-ink: #ffffff;
  --accent-deep: #4f3a99;
  --accent-soft: #e6ddf7;
  --pink: #f6e3ef;
  --mint: #e2f3ee;
  --shadow: 0 1px 2px rgba(64, 40, 120, .05), 0 18px 40px -18px rgba(76, 52, 140, .28);
  --shadow-lg: 0 30px 80px -30px rgba(70, 44, 140, .45);
  --r-card: 28px;
  --r-media: 20px;
  --r-field: 16px;
  --ease: cubic-bezier(.22, .8, .24, 1);
  --ease-spring: cubic-bezier(.32, .72, 0, 1);
  --font-display: "Unbounded", "Onest", system-ui, sans-serif;
  --font-body: "Onest", system-ui, -apple-system, "Segoe UI", sans-serif;
  --gutter: clamp(16px, 4vw, 48px);
  --maxw: 1240px;
  --nav-h: 72px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 88px; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background:
    radial-gradient(1200px 700px at 100% 20%, rgba(246, 214, 236, .55), transparent 60%),
    radial-gradient(900px 800px at 0% 55%, rgba(214, 226, 252, .6), transparent 60%),
    radial-gradient(900px 700px at 100% 90%, rgba(226, 214, 250, .7), transparent 60%),
    var(--bg);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img, video { display: block; max-width: 100%; }
a { color: inherit; }
button { font: inherit; color: inherit; cursor: pointer; }
ul { list-style: none; margin: 0; padding: 0; }
h1, h2, h3, p, figure, blockquote { margin: 0; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 8px; }

.skip { position: absolute; left: 16px; top: -60px; z-index: 100; background: var(--ink); color: #fff; padding: 10px 16px; border-radius: 999px; text-decoration: none; }
.skip:focus { top: 12px; }

.i { width: 1.25em; height: 1.25em; flex: none; fill: currentColor; }

.wrap { width: 100%; max-width: calc(var(--maxw) + var(--gutter) * 2); margin: 0 auto; padding: 0 var(--gutter); }
html, body { overflow-x: clip; }
.section { overflow-x: clip; }
.section { position: relative; padding: clamp(72px, 10vw, 128px) 0; }

/* ---------- типографика ---------- */
.h2 {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(30px, 4.2vw, 52px);
  line-height: 1.08;
  letter-spacing: -.02em;
  text-wrap: balance;
}
.h3 {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(24px, 2.6vw, 34px);
  line-height: 1.12;
  letter-spacing: -.015em;
}
.lead { color: var(--ink-2); font-size: clamp(16px, 1.3vw, 18px); max-width: 52ch; margin-top: 16px; text-wrap: pretty; }

/* ---------- кнопки ---------- */
.btn {
  --h: 56px;
  display: inline-flex; align-items: center; justify-content: center; gap: 12px;
  height: var(--h); padding: 0 26px; border-radius: 999px; border: 0;
  font-weight: 500; font-size: 16px; text-decoration: none; white-space: nowrap;
  transition: transform .5s var(--ease-spring), background-color .3s var(--ease), box-shadow .4s var(--ease), color .3s;
}
.btn:active { transform: scale(.97); }
.btn--sm { --h: 44px; padding: 0 18px; font-size: 15px; }
.btn--block { width: 100%; }
.btn--primary { background: var(--accent); color: var(--accent-ink); box-shadow: 0 10px 24px -10px rgba(90, 64, 180, .7), inset 0 1px 0 rgba(255,255,255,.18); }
.btn--primary:hover { background: var(--accent-deep); }
.btn--primary:has(.btn__ico) { padding-right: 8px; }
.btn--ghost { background: var(--surface); color: var(--ink); box-shadow: inset 0 0 0 1px var(--line); }
.btn--ghost:hover { box-shadow: inset 0 0 0 1px rgba(106, 82, 184, .45); color: var(--accent-deep); }
.btn--glass { background: rgba(255,255,255,.14); color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.4); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
.btn--glass:hover { background: rgba(255,255,255,.24); }
.btn__ico {
  width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center;
  background: rgba(255,255,255,.18);
  transition: transform .5s var(--ease-spring);
}
.btn--sm .btn__ico { width: 32px; height: 32px; }
.btn:hover .btn__ico { transform: translateX(3px) rotate(-8deg); }

.round {
  width: 52px; height: 52px; border-radius: 50%; border: 0; display: grid; place-items: center;
  background: var(--surface); box-shadow: inset 0 0 0 1px var(--line), var(--shadow);
  transition: transform .4s var(--ease-spring), background-color .3s, color .3s;
}
.round:hover { background: var(--accent); color: #fff; }
.round:active { transform: scale(.94); }
.round:disabled { opacity: .4; pointer-events: none; }

/* ---------- логотип ---------- */
.logo { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; }
.logo__mark { position: relative; width: 38px; height: 34px; }
.logo__mark i {
  position: absolute; border-radius: 50%;
  border: 1.5px solid currentColor;
  background: radial-gradient(circle at 32% 30%, rgba(255,255,255,.9) 0 10%, transparent 24%);
}
.logo__mark i:first-child { width: 30px; height: 30px; left: 0; top: 0; }
.logo__mark i:last-child { width: 16px; height: 16px; right: 0; bottom: 0; background: none; }
.logo__text { font-family: var(--font-display); font-size: 14px; line-height: 1.05; letter-spacing: -.01em; }

/* ---------- навигация ---------- */
.nav {
  position: fixed; inset: 12px 0 auto; z-index: 40;
  padding: 0 var(--gutter);
  pointer-events: none;
}
.nav__bar {
  pointer-events: auto;
  max-width: var(--maxw); margin: 0 auto; height: 64px;
  display: flex; align-items: center; gap: 24px;
  padding: 0 10px 0 20px; border-radius: 999px;
  color: #fff;
  transition: background-color .4s var(--ease), color .4s var(--ease), box-shadow .4s var(--ease);
}
.nav.is-solid .nav__bar {
  background: rgba(250, 247, 253, .78);
  color: var(--ink);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.7), 0 12px 32px -16px rgba(70, 44, 140, .35);
  backdrop-filter: blur(18px) saturate(1.4); -webkit-backdrop-filter: blur(18px) saturate(1.4);
}
.nav__links { display: flex; gap: 4px; margin-left: auto; }
.nav__links a { padding: 10px 16px; border-radius: 999px; text-decoration: none; font-size: 15px; opacity: .92; transition: background-color .3s; }
.nav__links a:hover { background: rgba(255,255,255,.16); opacity: 1; }
.nav.is-solid .nav__links a:hover { background: var(--accent-soft); }
.nav__cta { margin-left: 8px; }
.burger { display: none; }

/* мобильное меню */
.menu {
  position: fixed; inset: 0; z-index: 39;
  background: rgba(244, 239, 250, .94);
  backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px);
  display: flex; flex-direction: column; justify-content: space-between;
  padding: 112px var(--gutter) calc(32px + env(safe-area-inset-bottom));
  opacity: 0; transition: opacity .4s var(--ease);
}
.menu[hidden] { display: none; }
.menu.is-open { opacity: 1; }
.menu__links { display: flex; flex-direction: column; gap: 6px; }
.menu__links a {
  font-family: var(--font-display); font-size: 30px; line-height: 1.25; text-decoration: none; padding: 6px 0;
  opacity: 0; transform: translateY(24px);
  transition: opacity .5s var(--ease), transform .6s var(--ease-spring);
}
.menu.is-open .menu__links a { opacity: 1; transform: none; }
.menu.is-open .menu__links a:nth-child(2) { transition-delay: .05s; }
.menu.is-open .menu__links a:nth-child(3) { transition-delay: .1s; }
.menu.is-open .menu__links a:nth-child(4) { transition-delay: .15s; }
.menu__foot { display: flex; flex-direction: column; gap: 20px; }

/* ---------- HERO ---------- */
.hero { padding: 12px 12px 0; }
.hero__frame {
  position: relative; overflow: hidden;
  min-height: min(100svh - 12px, 900px);
  border-radius: 36px;
  background: #160f22;
  display: flex; flex-direction: column; justify-content: flex-end;
  isolation: isolate;
}
.hero__media, .hero__video { position: absolute; inset: 0; z-index: -2; }
.hero__media img, .hero__video { width: 100%; height: 100%; object-fit: cover; object-position: 70% 40%; }
.hero__media img { animation: heroZoom 18s var(--ease) both; }
.hero__video { display: none; }
.hero__shade {
  position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(90deg, rgba(20, 12, 34, .88) 0%, rgba(20, 12, 34, .55) 38%, rgba(20, 12, 34, 0) 68%),
    linear-gradient(0deg, rgba(20, 12, 34, .7) 0%, rgba(20, 12, 34, 0) 45%);
}
.hero__content {
  position: relative;
  padding: 0 clamp(24px, 5vw, 72px) clamp(40px, 7vw, 88px);
  max-width: 1000px;
  color: #fff;
}
.hero__title {
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(40px, 4.6vw, 70px);
  line-height: 1.02;
  letter-spacing: -.035em;
  text-wrap: balance;
}
.hero__lead { margin-top: 22px; font-size: clamp(16px, 1.4vw, 19px); color: rgba(255,255,255,.84); max-width: 44ch; }
.hero__actions { margin-top: 32px; display: flex; flex-wrap: wrap; gap: 12px; }

@keyframes heroZoom { from { transform: scale(1.08); } to { transform: scale(1); } }

/* ---------- декоративные пузыри ---------- */
.bubble {
  position: absolute; z-index: 0; pointer-events: none;
  width: var(--s, 160px); aspect-ratio: 1; border-radius: 50%;
  background:
    radial-gradient(circle at 30% 26%, rgba(255,255,255,.95) 0 5%, rgba(255,255,255,0) 13%),
    radial-gradient(circle at 70% 78%, rgba(255,255,255,.5) 0 3%, rgba(255,255,255,0) 9%),
    radial-gradient(circle, rgba(255,255,255,0) 58%, rgba(255,255,255,.55) 70%, rgba(255,255,255,0) 71%),
    conic-gradient(from 200deg, rgba(255,160,214,.42), rgba(160,190,255,.42), rgba(170,240,220,.36), rgba(255,232,160,.36), rgba(214,170,255,.42), rgba(255,160,214,.42));
  -webkit-mask: radial-gradient(circle, rgba(0,0,0,.18) 52%, #000 70.5%, transparent 71%);
          mask: radial-gradient(circle, rgba(0,0,0,.18) 52%, #000 70.5%, transparent 71%);
  animation: float 14s ease-in-out infinite alternate;
  opacity: .9;
}
.bubble--a { --s: 220px; right: -60px; top: 40px; }
.bubble--b { --s: 90px; left: 46%; bottom: 60px; animation-duration: 11s; }
.bubble--c { --s: 260px; left: -110px; top: 120px; animation-duration: 17s; }
.bubble--d { --s: 180px; right: 6%; top: -50px; }
.bubble--e { --s: 300px; left: -120px; bottom: -40px; animation-duration: 19s; }
@keyframes float {
  from { transform: translate3d(0, 0, 0) rotate(0deg); }
  to   { transform: translate3d(14px, -26px, 0) rotate(30deg); }
}

/* ---------- WHY ---------- */
.why__grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, .85fr); gap: clamp(32px, 6vw, 96px); align-items: center; }
.perks { display: grid; grid-template-columns: 1fr 1fr; gap: 28px 32px; margin: 44px 0 40px; }
.perk { display: flex; gap: 16px; align-items: flex-start; }
.perk__ico {
  flex: none; width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center;
  color: var(--accent); background: var(--surface);
  box-shadow: inset 0 0 0 1px var(--line), 0 8px 20px -12px rgba(90, 64, 180, .5);
}
.perk h3 { font-size: 17px; font-weight: 600; line-height: 1.3; }
.perk p { color: var(--muted); font-size: 15px; margin-top: 4px; line-height: 1.45; }

/* вертикальное видео-превью */
.reel {
  position: relative; display: block; overflow: hidden; border: 0; padding: 0;
  border-radius: var(--r-card); background: #1b1428;
  aspect-ratio: 9 / 14; width: 100%;
  box-shadow: var(--shadow-lg);
  text-align: left;
}
.reel img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease); }
.reel:hover img { transform: scale(1.04); }
.reel::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(20,12,34,.7), rgba(20,12,34,0) 50%); }
.reel__play {
  position: absolute; z-index: 1; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 76px; height: 76px; border-radius: 50%; display: grid; place-items: center;
  color: #fff; background: rgba(255,255,255,.18);
  box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.75);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  transition: transform .5s var(--ease-spring), background-color .3s;
}
.reel__play .i { width: 28px; height: 28px; margin-left: 3px; }
.reel:hover .reel__play { transform: translate(-50%, -50%) scale(1.08); background: rgba(255,255,255,.3); }
.reel__caption { position: absolute; z-index: 1; left: 22px; right: 22px; bottom: 20px; color: #fff; font-weight: 500; font-size: 16px; line-height: 1.3; }
.why__reel { max-width: 420px; justify-self: end; transform: rotate(2deg); }
.why__reel:hover { transform: rotate(0deg); }
.why__reel { transition: transform .8s var(--ease-spring); }

/* ---------- PROGRAMS ---------- */
.sec-head { position: relative; z-index: 1; margin-bottom: 36px; }
.sec-head--row { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap; }

.tabs {
  position: relative; z-index: 1;
  display: inline-flex; gap: 0; padding: 6px; border-radius: 999px;
  background: var(--surface-soft);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.8), var(--shadow);
  margin-bottom: 32px;
  max-width: 100%;
}
.tab {
  position: relative; z-index: 1;
  border: 0; background: none; height: 48px; padding: 0 24px; border-radius: 999px;
  font-weight: 500; font-size: 15px; color: var(--ink-2); white-space: nowrap;
  transition: color .35s var(--ease);
}
.tab.is-active { color: #fff; }
.tabs__pill {
  position: absolute; z-index: 0; top: 6px; bottom: 6px; left: 0; width: 0;
  border-radius: 999px; background: var(--ink);
  transition: transform .55s var(--ease-spring), width .55s var(--ease-spring);
}

.panel { position: relative; z-index: 1; }
.panel.is-active { animation: panelIn .6s var(--ease) both; }
@keyframes panelIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.panel__intro { color: var(--ink-2); max-width: 62ch; margin-bottom: 28px; }

.included {
  display: flex; align-items: center; gap: 12px 28px; flex-wrap: wrap;
  padding: 18px 24px; margin-bottom: 24px; border-radius: 22px;
  background: linear-gradient(100deg, rgba(255,255,255,.75), rgba(255,255,255,.4));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.9);
}
.included__title { font-weight: 600; font-size: 15px; }
.included__list { display: flex; flex-wrap: wrap; gap: 8px 22px; }
.included__list li { display: inline-flex; align-items: center; gap: 8px; font-size: 15px; color: var(--ink-2); }
.included__list .i { color: var(--accent); }

.cards { display: grid; gap: 20px; }
.cards--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cards--3 .card:nth-child(2) { transform: translateY(28px); }

.card, .story, .outdoor {
  display: flex; flex-direction: column;
  background: var(--surface);
  border-radius: var(--r-card);
  padding: 8px;
  box-shadow: inset 0 0 0 1px rgba(76, 58, 120, .06), var(--shadow);
  transition: box-shadow .5s var(--ease), transform .6s var(--ease-spring);
}
.card:hover, .story:hover { box-shadow: inset 0 0 0 1px rgba(106, 82, 184, .18), var(--shadow-lg); }
.card__media, .story__media { position: relative; overflow: hidden; border-radius: var(--r-media); aspect-ratio: 4 / 3; background: var(--bg-2); }
.card__media img, .story__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.card:hover .card__media img, .story:hover .story__media img { transform: scale(1.05); }
.card__play {
  position: absolute; right: 14px; bottom: 14px;
  width: 52px; height: 52px; border-radius: 50%; border: 0; display: grid; place-items: center;
  color: #fff; background: rgba(30, 20, 50, .35);
  box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.7);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  transition: transform .5s var(--ease-spring), background-color .3s;
}
.card__play .i { margin-left: 2px; }
.card__play:hover { transform: scale(1.1); background: var(--accent); }
.card__body, .story__body { display: flex; flex-direction: column; flex: 1; padding: 20px 16px 12px; }
.card__title { font-family: var(--font-display); font-weight: 400; font-size: 21px; line-height: 1.18; letter-spacing: -.01em; }
.card__meta { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: 14px; margin-top: 8px; }
.card__meta .i { width: 1.1em; height: 1.1em; }

.ticks { display: grid; gap: 8px; margin: 18px 0 20px; }
.ticks li { position: relative; padding-left: 26px; font-size: 15px; color: var(--ink-2); line-height: 1.45; }
.ticks li::before {
  content: ""; position: absolute; left: 0; top: .32em; width: 14px; height: 14px; border-radius: 50%;
  background: radial-gradient(circle at 34% 30%, #fff 0 18%, transparent 36%), conic-gradient(from 200deg, #f3b3dc, #b9c8ff, #b6efdc, #ffe8a8, #d7b5ff, #f3b3dc);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.6);
}
.ticks--2col { grid-template-columns: 1fr 1fr; gap: 12px 28px; }

.note {
  display: flex; align-items: center; gap: 8px;
  font-size: 14px; color: var(--accent-deep);
  background: var(--accent-soft); padding: 10px 14px; border-radius: 14px; margin: -4px 0 18px;
}
.card__foot { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding-top: 16px; border-top: 1px solid var(--line); }
.card__foot .card__meta { margin-top: 2px; }
.card__btns { display: flex; gap: 8px; }
.price { font-family: var(--font-display); font-size: 24px; font-weight: 500; letter-spacing: -.02em; white-space: nowrap; }
.price--ask { font-size: 18px; }

/* тематические */
.cards--story { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.story__media { aspect-ratio: 4 / 4.4; }
.story__hero {
  display: inline-flex; align-self: flex-start; margin-bottom: 10px;
  font-size: 13px; font-weight: 500; color: var(--accent-deep);
  padding: 5px 12px; border-radius: 999px; background: var(--accent-soft);
}
.story__text { margin-top: 12px; font-size: 15px; color: var(--ink-2); line-height: 1.5; }
.story__final, .story__gift { display: flex; gap: 10px; align-items: flex-start; margin-top: 14px; font-size: 15px; line-height: 1.4; }
.story__final .i, .story__gift .i { color: var(--accent); margin-top: 1px; }
.story__gift { margin: 10px 0 20px; }
.story .note { margin-top: -6px; }

/* улица */
.outdoor { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(20px, 3vw, 40px); padding: 8px; }
.outdoor__gallery { display: grid; grid-template-columns: 1.4fr 1fr; grid-template-rows: 1fr 1fr; gap: 8px; height: clamp(420px, 40vw, 540px); }
.outdoor__gallery > * { min-height: 0; }
.outdoor__reel img { position: absolute; inset: 0; }
.outdoor__gallery img { width: 100%; height: 100%; object-fit: cover; border-radius: var(--r-media); }
.outdoor__big { grid-row: 1 / 3; }
.outdoor__reel { aspect-ratio: auto; border-radius: var(--r-media); box-shadow: none; }
.outdoor__reel .reel__play { width: 56px; height: 56px; }
.outdoor__body { padding: clamp(16px, 2.5vw, 32px) clamp(12px, 2vw, 24px) 16px 0; display: flex; flex-direction: column; }
.outdoor__body .ticks { margin: 24px 0 28px; }

/* дополнения */
.addons {
  position: relative; z-index: 1;
  display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(28px, 5vw, 72px); align-items: center;
  margin-top: clamp(72px, 9vw, 112px);
  padding: clamp(24px, 4vw, 48px);
  border-radius: 36px;
  background:
    radial-gradient(600px 300px at 0% 0%, rgba(246, 214, 236, .9), transparent 70%),
    radial-gradient(500px 300px at 100% 100%, rgba(208, 222, 255, .8), transparent 70%),
    rgba(255,255,255,.55);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.9);
}
.addons__text .btn { margin-top: 28px; }
.addons__reels { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.reel--sm { aspect-ratio: 9 / 15; border-radius: 22px; box-shadow: var(--shadow); }
.reel--sm .reel__play { width: 56px; height: 56px; }
.reel--sm .reel__play .i { width: 22px; height: 22px; }
.reel--sm .reel__caption { font-size: 14px; left: 16px; right: 16px; bottom: 16px; }
.addons__reels .reel:nth-child(2) { transform: translateY(-18px); }

/* ---------- LOOKS ---------- */
.looks { overflow: hidden; }
.looks__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; margin-bottom: 40px; }
.looks__nav { display: flex; gap: 10px; }
.carousel {
  overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory;
  scrollbar-width: none; cursor: grab;
  padding: 8px 0 24px;
  scroll-padding-inline: max(var(--gutter), calc((100vw - var(--maxw)) / 2));
}
.carousel::-webkit-scrollbar { display: none; }
.carousel.is-drag { cursor: grabbing; scroll-snap-type: none; }
.carousel.is-drag * { pointer-events: none; }
.carousel__track {
  display: flex; gap: 16px; width: max-content;
  padding-inline: max(var(--gutter), calc((100vw - var(--maxw)) / 2));
}
.look {
  position: relative; flex: none; width: clamp(220px, 22vw, 300px); aspect-ratio: 3 / 4;
  border-radius: var(--r-card); overflow: hidden; scroll-snap-align: start;
  background: var(--bg-2);
  box-shadow: var(--shadow);
  transition: transform .7s var(--ease-spring);
}
.look:nth-child(even) { transform: translateY(24px); }
.look img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; user-select: none; -webkit-user-drag: none; transition: transform 1.2s var(--ease); }
.look:hover img { transform: scale(1.05); }
.look::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(24,14,40,.66), rgba(24,14,40,0) 42%); }
.look > span { position: absolute; z-index: 1; left: 20px; right: 20px; bottom: 18px; color: #fff; font-family: var(--font-display); font-size: 17px; line-height: 1.2; }
.looks__foot { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 32px; }
.progress { flex: 1; max-width: 320px; height: 3px; border-radius: 3px; background: rgba(76, 58, 120, .12); overflow: hidden; }
.progress span { display: block; height: 100%; width: 20%; background: var(--accent); border-radius: inherit; transform-origin: left; transition: transform .2s linear; }

/* ---------- REVIEWS ---------- */
.chats { position: relative; z-index: 1; columns: 3; column-gap: 20px; }
.chat {
  break-inside: avoid; margin-bottom: 20px;
  padding: 20px; border-radius: var(--r-card);
  background: linear-gradient(180deg, rgba(255,255,255,.85), rgba(255,255,255,.62));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.95), var(--shadow);
  display: flex; flex-direction: column; gap: 10px;
}
.chat__who { display: flex; align-items: center; gap: 12px; margin-bottom: 4px; }
.chat__who b { display: block; font-weight: 600; font-size: 15px; line-height: 1.2; }
.chat__who small { display: block; color: var(--muted); font-size: 13px; }
.ava {
  width: 40px; height: 40px; border-radius: 50%; flex: none; display: grid; place-items: center;
  font-weight: 600; color: #fff;
  background: linear-gradient(135deg, hsl(var(--h) 55% 70%), hsl(calc(var(--h) + 40) 50% 58%));
}
.chat__msg {
  position: relative; align-self: flex-start; max-width: 92%;
  padding: 12px 16px 22px; border-radius: 20px 20px 20px 6px;
  background: var(--surface); box-shadow: 0 1px 2px rgba(64, 40, 120, .08);
  font-size: 15px; line-height: 1.45;
}
.chat__msg--me { align-self: flex-end; border-radius: 20px 20px 6px 20px; background: var(--accent-soft); color: var(--ink); }
.chat__msg time { position: absolute; right: 12px; bottom: 5px; font-size: 11px; color: var(--muted); }

/* ---------- CONTACT ---------- */
.contact { overflow: hidden; }
.contact__grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
.contact__info { position: sticky; top: 120px; }
.messengers { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 36px; }
.msg {
  display: inline-flex; align-items: center; gap: 10px; height: 56px; padding: 0 22px 0 16px;
  border-radius: 999px; text-decoration: none; font-weight: 500;
  background: var(--surface); box-shadow: inset 0 0 0 1px var(--line), var(--shadow);
  transition: transform .5s var(--ease-spring), box-shadow .3s;
}
.msg:hover { transform: translateY(-2px); box-shadow: inset 0 0 0 1px rgba(106,82,184,.3), var(--shadow-lg); }
.msg .i { width: 26px; height: 26px; }
.msg--tg .i { color: #2a9fd8; }
.msg--wa .i { color: #25a35a; }
.msg__max {
  display: grid; place-items: center; width: 26px; height: 26px; border-radius: 8px;
  font-size: 8px; font-weight: 700; letter-spacing: .02em; color: #fff;
  background: linear-gradient(135deg, #3b6cff, #8a3bff);
}
.messengers--compact .msg { width: 56px; padding: 0; justify-content: center; }
.contact__list { display: grid; gap: 14px; margin-top: 32px; }
.contact__list li { display: flex; align-items: center; gap: 12px; color: var(--ink-2); }
.contact__list .i { color: var(--accent); }
.contact__list a { text-decoration: none; font-weight: 500; color: var(--ink); }

.form {
  position: relative;
  background: var(--surface); border-radius: 32px; padding: clamp(24px, 3.5vw, 40px);
  box-shadow: inset 0 0 0 1px rgba(76, 58, 120, .06), var(--shadow-lg);
  display: grid; gap: 18px;
}
.form__title { font-family: var(--font-display); font-weight: 400; font-size: 24px; margin-bottom: 4px; }
.form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.field { display: grid; gap: 8px; }
.field label { font-size: 14px; font-weight: 500; color: var(--ink-2); }
.opt { font-weight: 400; color: var(--muted); }
.field input, .field select, .field textarea {
  width: 100%; font: inherit; font-size: 16px; color: var(--ink);
  background: #faf8fd; border: 1px solid rgba(76, 58, 120, .18); border-radius: var(--r-field);
  padding: 14px 16px; min-height: 52px;
  transition: border-color .25s, box-shadow .25s, background-color .25s;
  appearance: none; -webkit-appearance: none;
}
.field textarea { resize: vertical; min-height: 96px; }
.field input::placeholder, .field textarea::placeholder { color: #8a819e; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--accent); background: #fff; box-shadow: 0 0 0 4px rgba(106, 82, 184, .14); }
.field.is-invalid input { border-color: #c2416b; }
.field__err { color: #b23462; font-size: 13px; min-height: 0; }
.field__err:empty { display: none; }
.select { position: relative; }
.select .i { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); pointer-events: none; color: var(--muted); }
.select select { padding-right: 44px; cursor: pointer; }

.check { display: flex; gap: 12px; align-items: flex-start; font-size: 14px; color: var(--ink-2); line-height: 1.45; cursor: pointer; }
.check input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.check__box {
  flex: none; width: 22px; height: 22px; border-radius: 7px; margin-top: 1px;
  border: 1.5px solid rgba(76, 58, 120, .35); display: grid; place-items: center; color: transparent;
  transition: background-color .2s, border-color .2s, color .2s;
}
.check__box .i { width: 14px; height: 14px; }
.check input:checked + .check__box { background: var(--accent); border-color: var(--accent); color: #fff; }
.check input:focus-visible + .check__box { outline: 2px solid var(--accent); outline-offset: 2px; }
.check a { color: var(--accent-deep); }

.form__done {
  position: absolute; inset: 0; border-radius: inherit; background: var(--surface);
  display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 12px; padding: 32px;
  animation: panelIn .6s var(--ease) both;
}
.form__done[hidden] { display: none; }
.form__done h3 { font-family: var(--font-display); font-weight: 400; font-size: 26px; }
.form__done p { color: var(--ink-2); max-width: 32ch; }
.form__done-ico { width: 72px; height: 72px; border-radius: 50%; display: grid; place-items: center; color: #fff; background: var(--accent); margin-bottom: 8px; }
.form__done-ico .i { width: 32px; height: 32px; }
.form.is-sending button[type="submit"] { opacity: .7; pointer-events: none; }

/* ---------- FOOTER ---------- */
.footer { padding: 56px 0 calc(32px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); background: rgba(255,255,255,.35); }
.footer__grid { display: grid; grid-template-columns: 1.4fr 1fr 1.2fr; gap: 32px; }
.footer__brand p { color: var(--muted); font-size: 15px; margin-top: 16px; max-width: 34ch; }
.footer__nav, .footer__docs { display: flex; flex-direction: column; gap: 10px; font-size: 15px; }
.footer__nav a, .footer__docs a { text-decoration: none; color: var(--ink-2); width: fit-content; }
.footer__nav a:hover, .footer__docs a:hover { color: var(--accent-deep); text-decoration: underline; text-underline-offset: 3px; }
.footer__legal { margin-top: 40px; padding-top: 24px; border-top: 1px solid var(--line); display: flex; justify-content: space-between; gap: 8px 24px; flex-wrap: wrap; font-size: 13px; color: var(--muted); }

/* ---------- FAB (мобильные) ---------- */
.fab { display: none; }

/* ---------- MODAL ---------- */
.modal { position: fixed; inset: 0; z-index: 60; display: grid; place-items: center; padding: 20px; }
.modal[hidden] { display: none; }
.modal__backdrop { position: absolute; inset: 0; background: rgba(28, 18, 46, .55); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); animation: fade .35s var(--ease) both; }
.modal__dialog {
  position: relative; width: min(980px, 100%); max-height: calc(100dvh - 40px); overflow: auto;
  background: var(--surface); border-radius: 32px; box-shadow: var(--shadow-lg);
  animation: pop .55s var(--ease-spring) both;
}
.modal--video .modal__dialog { width: auto; background: #120c1e; overflow: hidden; }
.modal__close { position: absolute; right: 14px; top: 14px; z-index: 2; }
.modal--video .modal__close { background: rgba(255,255,255,.14); color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.3); }
@keyframes fade { from { opacity: 0; } }
@keyframes pop { from { opacity: 0; transform: translateY(24px) scale(.97); } }

.vplayer { display: block; max-height: calc(100dvh - 40px); max-width: min(92vw, 1100px); width: auto; height: auto; background: #120c1e; }
.vplayer--v { height: min(82dvh, 860px); aspect-ratio: 9 / 16; }

.details { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); }
.details__media { background: #120c1e; min-height: 100%; }
.details__media video { width: 100%; height: 100%; max-height: calc(100dvh - 40px); object-fit: cover; }
.details__body { padding: 48px 40px 36px; display: flex; flex-direction: column; }
.details__body .h3 { padding-right: 48px; }
.details__desc { color: var(--ink-2); margin-top: 14px; }
.details__label { font-weight: 600; margin-top: 22px; font-size: 15px; }
.details__body .ticks { margin: 12px 0 0; }
.details__body .note { margin: 20px 0 0; }
.details__foot { margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--line); display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }

body.is-locked { overflow: hidden; }

/* ---------- появление при скролле ---------- */
.reveal { opacity: 0; transform: translateY(28px); filter: blur(6px); transition: opacity .9s var(--ease) var(--d, 0s), transform 1s var(--ease) var(--d, 0s), filter .9s var(--ease) var(--d, 0s); }
.reveal.is-in { opacity: 1; transform: none; filter: none; }
.why__reel.reveal.is-in { transform: rotate(2deg); }
.addons__reels .reel.reveal.is-in:nth-child(2) { transform: translateY(-18px); }
.no-js .reveal { opacity: 1; transform: none; filter: none; }

/* =========================================================
   АДАПТИВ
   ========================================================= */
@media (max-width: 1080px) {
  .nav__links { display: none; }
  .nav__cta { margin-left: auto; }
  .burger {
    display: grid; place-content: center; gap: 6px; width: 48px; height: 48px; border-radius: 50%; border: 0;
    background: rgba(255,255,255,.16); box-shadow: inset 0 0 0 1px rgba(255,255,255,.35);
  }
  .nav.is-solid .burger, .nav.is-menu .burger { background: var(--surface); box-shadow: inset 0 0 0 1px var(--line); }
  .burger span { display: block; width: 18px; height: 1.5px; background: currentColor; border-radius: 2px; transition: transform .45s var(--ease-spring); }
  .nav.is-menu .nav__bar { color: var(--ink); }
  .nav.is-menu .burger span:first-child { transform: translateY(3.75px) rotate(45deg); }
  .nav.is-menu .burger span:last-child { transform: translateY(-3.75px) rotate(-45deg); }

  .cards--3, .cards--story { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cards--3 .card:nth-child(2) { transform: none; }
  .outdoor { grid-template-columns: 1fr; }
  .outdoor__body { padding: 8px 16px 16px; }
  .addons { grid-template-columns: 1fr; }
  .chats { columns: 2; }
}

@media (max-width: 767px) {
  body { font-size: 16px; }
  html { scroll-padding-top: 76px; }
  .nav { inset: 8px 0 auto; padding: 0 8px; }
  .nav__bar { height: 58px; padding: 0 6px 0 16px; gap: 10px; }
  .nav__cta { display: none; }
  .burger { margin-left: auto; }

  .hero { padding: 8px 8px 0; }
  .hero__frame { min-height: calc(100svh - 8px); border-radius: 28px; }
  .hero__media { display: none; }
  .hero__video { display: block; }
  .hero__video:not([src]) { background: #160f22 url("../video/hero-mobile.jpg") center / cover; }
  .hero__shade { background: linear-gradient(0deg, rgba(20,12,34,.92) 0%, rgba(20,12,34,.6) 42%, rgba(20,12,34,.05) 72%), linear-gradient(180deg, rgba(20,12,34,.45), rgba(20,12,34,0) 22%); }
  .hero__content { padding: 0 20px 28px; }
  .hero__title { font-size: clamp(34px, 10.4vw, 46px); }
  .hero__lead { margin-top: 14px; font-size: 16px; }
  .hero__actions { margin-top: 24px; flex-direction: column; }
  .hero__actions .btn { width: 100%; }

  .why__grid { grid-template-columns: 1fr; }
  .perks { grid-template-columns: 1fr; gap: 20px; margin: 32px 0; }
  .why__reel { justify-self: stretch; max-width: none; aspect-ratio: 4 / 5; transform: none; }
  .why__reel.reveal.is-in { transform: none; }
  .why .btn { width: 100%; }

  .tabs { display: flex; width: 100%; }
  .tab { flex: 1; padding: 0 8px; font-size: 14px; height: 44px; }

  .included { padding: 16px 18px; }
  .included__list { display: grid; gap: 8px; }

  /* горизонтальные листалки на мобильных */
  .snap {
    display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory;
    margin: 0 calc(var(--gutter) * -1); padding: 4px var(--gutter) 20px;
    scroll-padding-inline: var(--gutter); scrollbar-width: none;
  }
  .snap::-webkit-scrollbar { display: none; }
  .snap > * { flex: none; width: 84%; scroll-snap-align: start; }
  .cards--3 .card:nth-child(2) { transform: none; }
  .card__btns { width: 100%; }
  .card__btns .btn { flex: 1; }
  .card__foot { padding-top: 14px; }

  .outdoor__gallery { height: auto; grid-template-columns: 1fr 1fr; grid-template-rows: auto auto; }
  .outdoor__big { grid-row: auto; grid-column: 1 / 3; aspect-ratio: 4 / 3; }
  .outdoor__small, .outdoor__reel { aspect-ratio: 1; }
  .ticks--2col { grid-template-columns: 1fr; }
  .outdoor__body .card__foot .btn { width: 100%; }

  .addons { padding: 24px 0 8px; border-radius: 28px; margin-top: 56px; }
  .addons__text { padding: 0 20px; }
  .addons__text .btn { width: 100%; }
  .addons__reels.snap { margin: 0; padding: 4px 20px 16px; scroll-padding-inline: 20px; }
  .addons__reels.snap > * { width: 58%; }
  .addons__reels .reel:nth-child(2), .addons__reels .reel.reveal.is-in:nth-child(2) { transform: none; }

  .looks__head { margin-bottom: 24px; }
  .looks__nav { display: none; }
  .look { width: 68vw; }
  .look:nth-child(even) { transform: none; }
  .looks__foot { flex-direction: column; align-items: stretch; }
  .progress { max-width: none; }
  .looks__foot .btn { width: 100%; }

  .sec-head--row .btn { display: none; }
  .chats.snap { columns: auto; align-items: flex-start; }
  .chats.snap .chat { margin: 0; }
  .reviews .wrap::after { content: none; }

  .contact__grid { grid-template-columns: 1fr; }
  .contact__info { position: static; }
  .messengers { display: grid; grid-template-columns: 1fr 1fr 1fr; }
  .messengers .msg { flex-direction: column; justify-content: center; height: 84px; padding: 0; gap: 6px; border-radius: 22px; font-size: 13px; }
  .messengers--compact { display: flex; }
  .messengers--compact .msg { height: 56px; width: 56px; border-radius: 50%; }
  .form { border-radius: 28px; }
  .form__row { grid-template-columns: 1fr; }

  .footer__grid { grid-template-columns: 1fr; gap: 28px; }

  .fab {
    position: fixed; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom)); z-index: 30;
    display: inline-flex; align-items: center; gap: 8px; height: 52px; padding: 0 20px 0 16px;
    border-radius: 999px; background: var(--accent); color: #fff; text-decoration: none; font-weight: 500;
    box-shadow: 0 14px 30px -10px rgba(80, 50, 170, .7);
    transform: translateY(120px); transition: transform .6s var(--ease-spring);
  }
  .fab.is-visible { transform: none; }

  .modal { padding: 0; align-items: end; }
  .modal__dialog { border-radius: 28px 28px 0 0; max-height: 92dvh; }
  .modal--video { align-items: center; padding: 12px; }
  .modal--video .modal__dialog { border-radius: 24px; }
  .vplayer, .vplayer--v { max-width: 100%; height: auto; max-height: 86dvh; width: 100%; }
  .details { grid-template-columns: 1fr; }
  .details__media video { max-height: 46dvh; }
  .details__body { padding: 28px 22px calc(24px + env(safe-area-inset-bottom)); }
  .details__foot .btn { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .reveal { opacity: 1; transform: none; filter: none; }
}
@media (prefers-reduced-transparency: reduce) {
  .nav.is-solid .nav__bar, .menu { background: var(--bg); backdrop-filter: none; }
}

/* построчный лид без точек в блоке преимуществ */
.lead--lines span { display: block; }
.lead--lines span + span { margin-top: 4px; }

/* карточка программы кликабельна целиком */
[data-program] { cursor: pointer; }

/* миниатюры фото и видео в окне программы */
.details__media img { width: 100%; height: 100%; max-height: calc(100dvh - 40px); object-fit: cover; }
.thumbs { display: flex; gap: 8px; margin-top: 18px; overflow-x: auto; scrollbar-width: none; }
.thumbs::-webkit-scrollbar { display: none; }
.thumb { position: relative; flex: none; width: 64px; height: 64px; padding: 0; border: 0; border-radius: 14px; overflow: hidden; background: var(--bg-2); opacity: .6; box-shadow: inset 0 0 0 2px transparent; transition: opacity .25s, box-shadow .25s; }
.thumb img { width: 100%; height: 100%; object-fit: cover; }
.thumb:hover { opacity: .9; }
.thumb.is-active { opacity: 1; box-shadow: 0 0 0 2px var(--accent); }
.thumb__play { position: absolute; inset: 0; display: grid; place-items: center; color: #fff; background: rgba(20,12,34,.35); }
@media (max-width: 767px) { .details__media img { max-height: 46dvh; } }

/* значок ВКонтакте */
.msg__badge {
  display: grid; place-items: center; width: 26px; height: 26px; border-radius: 8px;
  font-size: 10px; font-weight: 700; letter-spacing: .02em; color: #fff; background: #0077ff;
}

/* последняя карточка листалки: костюм под запрос */
.look--any { background: none; box-shadow: none; }
.look--any::after { content: none; }
.look__any {
  position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; gap: 14px;
  padding: 24px 22px; border-radius: inherit; text-decoration: none; color: #fff; overflow: hidden;
  background:
    radial-gradient(circle at 30% 22%, rgba(255,255,255,.55) 0 4%, transparent 12%),
    radial-gradient(120% 90% at 20% 10%, #b9a3f0 0%, transparent 60%),
    radial-gradient(120% 90% at 90% 90%, #f0a9d4 0%, transparent 60%),
    linear-gradient(160deg, #7a5fd0, #4f3a99);
  box-shadow: var(--shadow);
}
.look__q {
  position: absolute; left: 50%; top: 40%; transform: translate(-50%, -50%);
  width: 58%; aspect-ratio: 1; border-radius: 50%; display: grid; place-items: center;
  font-family: var(--font-display); font-weight: 300; font-size: clamp(72px, 9vw, 120px); line-height: 1;
  background: radial-gradient(circle at 30% 26%, rgba(255,255,255,.7) 0 6%, transparent 16%), rgba(255,255,255,.08);
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.55), inset 0 -18px 40px rgba(255,180,230,.25);
  transition: transform .8s var(--ease-spring);
}
.look__any:hover .look__q { transform: translate(-50%, -54%) scale(1.04); }
.look__any-text { position: relative; font-family: var(--font-display); font-size: 17px; line-height: 1.25; }
.look__any-cta { position: relative; display: inline-flex; align-items: center; gap: 8px; font-weight: 500; font-size: 15px; opacity: .9; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ===== выезд за МКАД ===== */
.travel { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; font-size: 13px; color: var(--muted); }
.travel .i { width: 1.1em; height: 1.1em; color: var(--accent); }
.details__body .travel { margin: 18px 0 0; }

/* ===== НОВОГОДНИЕ ШОУ ===== */
.bubble--f { --s: 240px; right: -80px; top: 60px; animation-duration: 16s; }
.period { position: relative; z-index: 1; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 28px; }
.period__label { font-weight: 600; font-size: 15px; }
.tabs--period { margin-bottom: 0; }
.xmas-grid { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.xmas {
  display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 4px;
  background: var(--surface); border-radius: var(--r-card); padding: 8px;
  box-shadow: inset 0 0 0 1px rgba(76, 58, 120, .06), var(--shadow);
  transition: box-shadow .5s var(--ease);
}
.xmas:hover { box-shadow: inset 0 0 0 1px rgba(106, 82, 184, .18), var(--shadow-lg); }
.xmas__media { position: relative; overflow: hidden; border-radius: var(--r-media); min-height: 100%; background: var(--bg-2); }
.xmas__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 25%; transition: transform 1.2s var(--ease); }
.xmas:hover .xmas__media img { transform: scale(1.05); }
.xmas__body { display: flex; flex-direction: column; padding: 18px 16px 12px; }
.xmas .ticks { margin: 14px 0 16px; }
.xmas .note { margin: -4px 0 14px; }
.xmas .card__btns { margin-top: auto; }
.xprice { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0 0 12px; padding-top: 14px; border-top: 1px solid var(--line); }
.xprice div { display: flex; flex-direction: column; gap: 2px; }
.xprice dt { font-size: 13px; color: var(--muted); }
.xprice dd { margin: 0; font-family: var(--font-display); font-size: 19px; font-weight: 500; letter-spacing: -.02em; white-space: nowrap; }
.xprice.is-ask dd { font-family: var(--font-body); font-size: 15px; font-weight: 500; color: var(--ink-2); }

/* таблица цен в окне программы */
.ptable { width: 100%; border-collapse: collapse; margin-top: 10px; font-size: 14px; }
.ptable th, .ptable td { padding: 9px 8px; text-align: left; border-bottom: 1px solid var(--line); }
.ptable thead th { font-weight: 500; color: var(--muted); font-size: 13px; }
.ptable tbody th { font-weight: 500; white-space: nowrap; }
.ptable td { font-weight: 600; white-space: nowrap; }
.ptable tr:last-child th, .ptable tr:last-child td { border-bottom: 0; }
.ptable td[colspan] { font-weight: 500; color: var(--ink-2); }

/* ===== отзывы: скриншоты ===== */
.shot {
  break-inside: avoid; margin: 0 0 20px; padding: 8px; border-radius: var(--r-card);
  background: var(--surface); box-shadow: inset 0 0 0 1px rgba(76, 58, 120, .06), var(--shadow);
}
.shot img { width: 100%; height: auto; border-radius: var(--r-media); }

/* логотип без названия */
.logo__mark { width: 44px; height: 40px; }
.logo__mark i:first-child { width: 34px; height: 34px; }
.logo__mark i:last-child { width: 18px; height: 18px; }

@media (max-width: 1080px) {
  .xmas-grid { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .period { gap: 10px; }
  .tabs--period .tab { font-size: 13px; padding: 0 6px; }
  .xmas-grid.snap > * { width: 86%; }
  .xmas { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
  .xmas__media { aspect-ratio: 4 / 3.4; min-height: 0; }
  .xmas .card__btns .btn { flex: 1; }
  .chats.snap .shot { margin: 0; width: 84%; }
  .ptable { font-size: 13px; }
  .ptable th, .ptable td { padding: 8px 4px; }
}

/* ===== вкладка «Непузыри» ===== */
.tab--special { display: inline-flex; align-items: center; gap: 6px; color: var(--accent-deep); font-weight: 600; }
.tab--special::before {
  content: ""; position: absolute; inset: 4px; z-index: -1; border-radius: 999px;
  background: linear-gradient(100deg, #f6d6ec, #e3dcff 50%, #d6ecff);
  box-shadow: inset 0 0 0 1px rgba(106, 82, 184, .25);
  transition: opacity .35s var(--ease);
}
.tab--special.is-active { color: #fff; }
.tab--special.is-active::before { opacity: 0; }
.tab--special .i { width: 1em; height: 1em; }
.price__from { font-family: var(--font-body); font-size: 15px; font-weight: 500; color: var(--muted); margin-right: 2px; }
.ptable--simple td { text-align: right; }
@media (max-width: 767px) {
  .tabs { overflow-x: auto; scrollbar-width: none; }
  .tabs::-webkit-scrollbar { display: none; }
  .tab { flex: none; padding: 0 12px; }
  .tab--special { padding: 0 14px; }
}