:root {
  --milk: #faf6f0;
  --cream: #f3ebe3;
  --ink: #1c1412;
  --wine: #6b2430;
  --wine-deep: #3d161c;
  --gold: #c9a46a;
  --gold-soft: #e4d0a8;
  --fg: #2b1c18;
  --muted: #6e5c55;
  --line: #e4d8c8;
  --card: #fff;
  --shadow: 0 24px 60px -32px rgba(40, 18, 16, .35);
  --gradient-gold: linear-gradient(90deg, transparent 0%, var(--gold) 45%, var(--gold-soft) 55%, transparent 100%);
  --font: "Jost", ui-sans-serif, system-ui, sans-serif;
  --display: "Cormorant Garamond", "Times New Roman", serif;
  --ease: cubic-bezier(.22, 1, .36, 1);
}

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
body {
  max-width: 100%;
  overflow-x: hidden;
}

header[data-header] {
  padding-top: calc(1.5rem + env(safe-area-inset-top, 0px));
  padding-bottom: 1.5rem;
  padding-left: env(safe-area-inset-left, 0px);
  padding-right: env(safe-area-inset-right, 0px);
}
header[data-header] > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}
@media (min-width: 64rem) {
  header[data-header] > div {
    grid-template-columns: auto minmax(0, 1fr) auto;
  }
}
header[data-header] nav ul {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  column-gap: 0.85rem;
  white-space: nowrap;
}
@media (min-width: 80rem) {
  header[data-header] nav ul {
    column-gap: 1.5rem;
  }
}
header[data-header].py-3 {
  padding-top: calc(0.75rem + env(safe-area-inset-top, 0px));
  padding-bottom: 0.75rem;
}
/* Над героем: молоко + обводка глифа. Золото на пайетках не читается, плашка спорит с кнопкой. */
header[data-header] [data-wordmark],
header[data-header] [data-header-cta] {
  font-weight: 400;
}
header[data-header][data-over="1"]:not(.glass-bar) [data-header-phone],
header[data-header][data-over="1"]:not(.glass-bar) [data-nav-link] {
  color: #faf6f0;
  font-weight: 400;
  -webkit-text-stroke: 0.4px rgba(16, 8, 10, 0.92);
  paint-order: stroke fill;
  text-shadow:
    0 0 1px #1c1412,
    0 1px 2px #1c1412,
    0 0 10px rgba(16, 8, 10, 0.95);
}
header[data-header][data-over="1"]:not(.glass-bar) [data-header-phone] {
  letter-spacing: 0.06em;
}
header[data-header][data-over="1"]:not(.glass-bar) [data-header-phone]:hover,
header[data-header][data-over="1"]:not(.glass-bar) [data-nav-link]:hover {
  color: #e4d0a8;
}
header[data-header][data-over="1"]:not(.glass-bar) [data-nav-link][aria-current="page"] {
  color: #c9a46a;
}
header[data-header][data-over="1"]:not(.glass-bar) [data-header-phone] svg {
  filter: drop-shadow(0 1px 1px #1c1412) drop-shadow(0 0 4px rgba(16, 8, 10, 0.9));
}
[data-nav] {
  padding-top: calc(1.5rem + env(safe-area-inset-top, 0px));
  padding-bottom: calc(2.5rem + env(safe-area-inset-bottom, 0px));
  padding-left: calc(1.5rem + env(safe-area-inset-left, 0px));
  padding-right: calc(1.5rem + env(safe-area-inset-right, 0px));
}
[data-hero],
[data-hero] > .relative.z-10,
.page-hero-photo-wrap {
  min-height: 100vh;
  min-height: 100svh;
}
[data-hero] > .relative.z-10 {
  padding-top: calc(7.5rem + env(safe-area-inset-top, 0px));
  padding-bottom: calc(5rem + env(safe-area-inset-bottom, 0px));
}
.page-hero-photo-wrap > .relative.z-10 {
  padding-top: calc(9rem + env(safe-area-inset-top, 0px));
  padding-bottom: calc(5.5rem + env(safe-area-inset-bottom, 0px));
}
header.surface-ink {
  padding-top: calc(8rem + env(safe-area-inset-top, 0px));
}
@media (max-width: 430px) {
  [data-wordmark] { letter-spacing: 0.2em; }
  [data-tag] { letter-spacing: 0.16em; }
}
.page-hero img, .section img, .catalog img, .mosaic img, .master img, .works img {
  max-width: 100%;
  display: block;
}

.wrap { width: min(88rem, calc(100% - 48px)); margin: 0 auto; }
.wrap--narrow { width: min(760px, calc(100% - 40px)); }

.btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 56px; padding: 0 40px;
  font-size: .7rem; font-weight: 300;
  letter-spacing: .28em; text-transform: uppercase;
  border: 1px solid transparent;
  transition: background .5s var(--ease), border-color .5s, color .5s, transform .4s var(--ease);
}
.btn--gold { background: var(--gold); color: #2b1c18; }
.btn--gold:hover { background: var(--gold-soft); }
.btn--wine { background: var(--wine); color: var(--cream); }
.btn--ghost { border-color: #c9a46a73; background: transparent; color: inherit; }
.btn--ghost:hover { border-color: var(--gold); background: #c9a46a1a; }
.btn--line { border-color: var(--line); background: transparent; }
.btn:hover { transform: translateY(-1px); }

.kicker {
  font-size: 11px; letter-spacing: .42em; text-transform: uppercase;
  color: var(--gold); margin-bottom: 14px;
}
.page-hero h1, .page-hero h2, .section h2, .display {
  font-family: var(--display);
  font-weight: 300;
  letter-spacing: -.02em;
  line-height: 1.08;
}
.page-hero h1 { font-size: clamp(2.25rem, 2rem + 4vw, 5.25rem); line-height: 1.02; letter-spacing: -.015em; margin: 24px 0 18px; }
.section h2 { font-size: clamp(32px, 4.4vw, 52px); margin-bottom: 16px; }
.section h3, .page-hero h3 { font-family: var(--display); font-weight: 400; font-size: 28px; }
.lead { color: var(--muted); max-width: 46ch; font-size: 18px; line-height: 1.625; }
.actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }

.section { padding: clamp(96px, 10vw, 160px) 0; }
.section--cream { background: var(--cream); }
.section--ink {
  background: var(--ink);
  color: var(--cream);
}
.section--ink .lead { color: #f3ebe3b8; }
.section--ink .checks li::before { background: var(--gold); }
.section--ink .quotes article {
  background: #2a1c1c;
  box-shadow: none;
}
.section__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; margin-bottom: 40px; }

.split { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.split img, .media img { width: 100%; min-width: 0; object-fit: cover; }
.split-media > * { min-width: 0; }
.exclusive-mark {
  display: block;
  margin: 0 0 0.4rem;
  font-family: var(--font);
  font-size: 0.58rem;
  font-weight: 400;
  letter-spacing: 0.14em;
  line-height: 1.35;
  text-transform: uppercase;
  color: #c42a38;
}
.media { min-width: 0; }
.media--tall img { aspect-ratio: 4/5; object-fit: cover; }

.checks li { position: relative; padding-left: 22px; margin: 10px 0; }
.checks li::before { content: ""; position: absolute; left: 0; top: .55em; width: 8px; height: 1px; background: var(--wine); }

.why { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.why article {
  min-width: 0;
  padding: 28px 24px;
  background: var(--card);
  box-shadow: var(--shadow);
}
.why svg { color: var(--wine); margin-bottom: 16px; }
.why h3 { font-size: 24px; margin-bottom: 8px; }

.cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.card { min-width: 0; display: block; background: var(--card); box-shadow: var(--shadow); }
.card img { width: 100%; aspect-ratio: 4/3; object-fit: cover; }
.card__body { padding: 20px 22px 24px; }
.card__n { font-size: 11px; letter-spacing: .28em; color: var(--muted); }
.card h3 { margin: 6px 0 8px; }
.card__meta { display: flex; justify-content: space-between; gap: 12px; color: var(--wine); font-size: 14px; }

.master { display: grid; grid-template-columns: 280px 1fr; gap: 28px; padding: 28px 0; border-top: 1px solid var(--line); min-width: 0; }
.master img { width: 100%; aspect-ratio: 3/4; object-fit: cover; }

.master-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-width: 0;
}
.master-card__photo {
  position: relative;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background: var(--cream);
}
.master-card__photo img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}
.master-card__role {
  position: absolute;
  left: 0;
  top: 1.5rem;
  background: var(--wine);
  color: var(--cream);
  padding: .5rem 1rem;
  font-size: .58rem;
  letter-spacing: .28em;
  text-transform: uppercase;
}
.master-card__body {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-width: 0;
  padding-top: 1.5rem;
}
.master-card__name {
  font-family: var(--display);
  font-size: 1.875rem;
  font-weight: 400;
  line-height: 1.1;
}
.master-card__bio {
  margin: .75rem 0 0;
  min-height: 4.5em;
  color: var(--muted);
  font-size: .875rem;
  line-height: 1.625;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
/* Раскрытое описание: снимаем ограничение строк, карточка растёт по тексту */
.master-card__about.is-open .master-card__bio {
  display: block;
  -webkit-line-clamp: unset;
  line-clamp: unset;
  overflow: visible;
}
.master-card__more {
  display: inline-block;
  margin-top: .75rem;
  padding: 0;
  border: 0;
  border-bottom: 1px solid var(--gold);
  background: none;
  color: var(--wine);
  font: inherit;
  font-size: .62rem;
  letter-spacing: .28em;
  text-transform: uppercase;
  line-height: 1.6;
  cursor: pointer;
  transition: color .5s var(--ease);
}
.master-card__more:hover { color: var(--wine-deep); }
.master-card__more[hidden] { display: none; }
.master-card__chips {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  gap: .5rem;
  margin: 1.25rem 0 0;
  min-height: 4.25rem;
  list-style: none;
  padding: 0;
}
.master-card__chips li {
  border: 1px solid var(--line);
  padding: .25rem .75rem;
  font-size: .6rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--muted);
}
.master-card__skills {
  margin: 1.25rem 0 0;
  min-height: 5.75rem;
  list-style: none;
  padding: 0;
}
.master-card__skills li {
  position: relative;
  padding-left: 1.5rem;
  margin: .35rem 0;
  font-size: .875rem;
  line-height: 1.45;
  color: var(--fg);
}
.master-card__skills li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .7em;
  width: 1rem;
  height: 1px;
  background: var(--gold);
}
.master-card__works {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
  margin: 1.25rem 0 2rem;
}
.master-card__work {
  position: relative;
  display: block;
  aspect-ratio: 1;
  overflow: hidden;
  margin: 0;
  background: var(--cream);
}
a.master-card__work { cursor: zoom-in; }
.master-card__work-more {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  background: rgba(28, 20, 18, .55);
  color: var(--ink-foreground, #f3ebe3);
  font-family: var(--display);
  font-size: 2rem;
  letter-spacing: .08em;
  transition: background .5s var(--ease);
}
a.master-card__work:hover .master-card__work-more { background: rgba(28, 20, 18, .4); }
.master-card__works img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}
.master-card__cta {
  box-sizing: border-box;
  margin-top: auto;
  padding-top: 0;
  min-height: 3rem;
  line-height: 1;
}
/* Карточки мастеров в одном ряду выравниваются построчно: имя, описание,
   направления, навыки, фото работ и кнопка стоят на одной линии у всех,
   даже когда одно описание раскрыто или направления заняли две строки.
   Без subgrid остаётся прежняя раскладка на flex. */
@supports (grid-template-rows: subgrid) {
  .master-card {
    display: grid;
    grid-row: span 7;
    grid-template-rows: subgrid;
    row-gap: 0;
    height: auto;
  }
  .master-card__body { display: contents; }
  .master-card__name { padding-top: 1.5rem; }
  .master-card__about,
  .master-card__chips,
  .master-card__skills { align-self: start; }
  .master-card__chips,
  .master-card__skills { min-height: 0; }
  .master-card__works { align-self: start; }
  .master-card__cta { align-self: end; margin-top: 0; }
}
.chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0; }
.chip { padding: 6px 12px; border: 1px solid var(--line); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; }
.works { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 18px 0; }
.works img { aspect-ratio: 4/3; object-fit: cover; min-width: 0; }

.mosaic { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.mosaic a, .mosaic button { min-width: 0; padding: 0; border: 0; background: none; cursor: pointer; }
.mosaic img { width: 100%; aspect-ratio: 1; object-fit: cover; }

.quotes { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.quotes article { min-width: 0; padding: 28px; background: var(--card); box-shadow: var(--shadow); }
.quotes p { font-family: var(--display); font-size: 24px; line-height: 1.35; margin-bottom: 18px; }
.quotes cite { font-style: normal; display: block; }

.page-hero { padding: 140px 0 48px; }
.has-hero .page-hero { padding-top: 48px; }
.page-hero--img {
  min-height: 420px;
  display: flex; align-items: flex-end;
  color: var(--cream);
  background: #1a1212 center/cover no-repeat;
  position: relative;
}
.page-hero--img::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(28,20,18,.82), transparent 70%);
}
.page-hero--img .wrap { position: relative; z-index: 1; padding-bottom: 48px; }
.page-hero-photo {
  object-position: 26% 36%;
}
@media (min-width: 1024px) {
  .page-hero-photo { object-position: 28% 42%; }
}

.crumbs { padding: 20px 0 0; font-size: 13px; color: var(--muted); }
.crumbs ol { display: flex; gap: 10px; flex-wrap: wrap; }
.crumbs li:not(:last-child)::after { content: "/"; margin-left: 10px; opacity: .5; }

.jump { display: flex; flex-wrap: wrap; gap: 10px; margin: 28px 0 8px; }
.jump a { padding: 8px 14px; border: 1px solid var(--line); font-size: 13px; }
.catalog { display: grid; gap: 64px; }
.catalog article { display: grid; grid-template-columns: 1fr; gap: 24px; align-items: start; }
.catalog article:nth-child(even) { direction: rtl; }
.catalog article:nth-child(even) > * { direction: ltr; }
.catalog img { width: 100%; aspect-ratio: 4/5; object-fit: cover; min-width: 0; }
.tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0; }
.tags li { padding: 6px 12px; background: var(--cream); font-size: 13px; }

.filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 28px; }
.filters button {
  padding: 8px 14px; border: 1px solid var(--line); background: transparent; cursor: pointer;
}
.filters button.is-on { background: var(--wine); color: var(--cream); border-color: var(--wine); }

.price-block { margin-bottom: 40px; }
.price-row {
  display: grid;
  grid-template-columns: 1fr auto auto auto;
  gap: 16px;
  align-items: center;
  padding: 18px 0;
  border-top: 1px solid var(--line);
  min-width: 0;
}
.price-row strong { display: block; font-weight: 400; }
.price-row p { color: var(--muted); font-size: 14px; }
.price-row .sum { color: var(--wine); white-space: nowrap; }

.form-lovable { position: relative; }
.form-lovable input:not([type=checkbox]), .form-lovable select, .form-lovable textarea {
  width: 100%;
  min-height: 3.5rem;
  padding: 0;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: transparent;
  border-radius: 0;
  box-shadow: none;
  font-size: 1rem;
  letter-spacing: 0;
  text-transform: none;
  color: var(--fg);
}
.form-lovable textarea { min-height: 8rem; padding: 12px 0; }
.form-spin {
  display: inline-block;
  width: 1rem;
  height: 1rem;
  border: 1.5px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: form-spin .7s linear infinite;
}
@keyframes form-spin { to { transform: rotate(360deg); } }
.form-lovable input:focus, .form-lovable select:focus, .form-lovable textarea:focus {
  outline: none;
  border-bottom-color: var(--gold);
}
.form-lovable .booking-consent {
  width: 1.25rem;
  height: 1.25rem;
  margin-top: 0.15rem;
  flex-shrink: 0;
  accent-color: var(--wine);
  cursor: pointer;
}
.form-lovable [data-error]:not([hidden]) {
  display: block;
  margin-top: 0.5rem;
  font-size: 0.85rem;
  letter-spacing: 0.02em;
  text-transform: none;
  color: #c42a38;
}
button[data-submit]:disabled {
  opacity: 0.75;
  cursor: wait;
}

.gold-mark {
  display: block;
  width: 2.5rem;
  height: 3px;
  background: var(--gold);
}
.gold-mark--center { margin-left: auto; margin-right: auto; }
.section-heading .gold-mark { margin-top: 1rem; }

.price-item { grid-template-columns: minmax(0, 1fr) auto; }
.price-items { list-style: none; margin: 0; padding: 0; }
.price-items > li + li {
  position: relative;
}
.price-items > li + li::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 2.25rem;
  height: 2px;
  background: var(--gold);
}
.price-acc-head .gold-mark { margin-top: 0.5rem; }
.price-list .price-acc + .price-acc > summary {
  position: relative;
}
.price-list .price-acc + .price-acc > summary::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 3.5rem;
  height: 3px;
  background: var(--gold);
}
.price-list .price-acc[hidden] + .price-acc > summary::before {
  content: none;
}
.price-list .price-acc + .price-acc summary {
  padding-top: 0.7rem;
}
.price-acc summary { display: flex; list-style: none; }
.price-acc summary::-webkit-details-marker { display: none; }
.price-acc-chevron { transition: transform .2s ease; }
.price-acc[open] .price-acc-chevron { transform: rotate(180deg); }

@media (min-width: 640px) {
  .price-item { grid-template-columns: minmax(0, 1fr) 10rem 9rem auto; }
}

@media (min-width: 48rem) {
  .split-media { grid-template-columns: 1fr 1fr; }
  .split-media.split-media--founder { grid-template-columns: minmax(0, 0.92fr) 1.08fr; }
  .split-media.split-media--women { grid-template-columns: 1fr 1.05fr; }
  .catalog article { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 36px; }
  .split-booking { grid-template-columns: 1.15fr 0.85fr; gap: 4rem; }
  .split-contacts { grid-template-columns: 1fr 1.1fr; gap: 4rem; }
}

@media (min-width: 64rem) {
  .split-booking { gap: 6rem; }
  .split-contacts { gap: 6rem; }
  .text-svc-title { font-size: 3.4rem; }
}

.contact-list { display: grid; gap: 14px; }
.contact-list a, .contact-list div { display: block; padding: 16px 0; border-bottom: 1px solid var(--line); }
.map { width: 100%; min-height: 360px; border: 0; margin-top: 28px; }

.article-cover { width: 100%; aspect-ratio: 16/9; object-fit: cover; margin: 28px 0; }
.prose p { margin: 0 0 16px; font-size: 18px; max-width: 62ch; }

[data-lightbox][hidden] { display: none !important; }
[data-nav] {
  opacity: 0;
  pointer-events: none;
  transition: opacity .4s;
}
[data-nav].is-open {
  opacity: 1;
  pointer-events: auto;
}
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

[data-reveal] {
  transition: opacity .9s cubic-bezier(.22, 1, .36, 1), transform .9s cubic-bezier(.22, 1, .36, 1);
}
html.has-js [data-reveal]:not(.is-in),
html.has-js [data-hero-enter]:not(.is-in) {
  opacity: 0;
  transform: translate3d(0, var(--reveal-y, 28px), 0);
}
html.has-js [data-header]:not(.is-in) {
  opacity: 0;
  transform: translate3d(0, -40px, 0);
}
html.has-js [data-hero-rule]:not(.is-in) {
  transform: scaleX(0);
}
[data-reveal].is-in,
[data-hero-enter].is-in {
  opacity: 1;
  transform: none;
}
[data-hero-enter].is-in {
  transition: opacity var(--hero-dur, 1s) cubic-bezier(.22, 1, .36, 1), transform var(--hero-dur, 1s) cubic-bezier(.22, 1, .36, 1);
}
[data-hero-rule].is-in {
  transform: scaleX(1);
  transition: transform 1.6s cubic-bezier(.22, 1, .36, 1);
}
html.has-js [data-header].is-in {
  animation: header-in .8s cubic-bezier(.22, 1, .36, 1) both;
}
@keyframes header-in {
  from { opacity: 0; transform: translate3d(0, -40px, 0); }
  to { opacity: 1; transform: none; }
}
html.has-js [data-lightbox]:not([hidden]) {
  animation: lightbox-overlay .4s cubic-bezier(.22, 1, .36, 1);
}
html.has-js [data-lightbox]:not([hidden]) img {
  animation: lightbox-in .5s cubic-bezier(.22, 1, .36, 1);
}
@keyframes lightbox-overlay {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes lightbox-in {
  from { transform: scale(.97); opacity: 0; }
  to { transform: none; opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  html.has-js [data-reveal]:not(.is-in),
  html.has-js [data-hero-enter]:not(.is-in),
  html.has-js [data-header]:not(.is-in),
  html.has-js [data-hero-rule]:not(.is-in),
  [data-reveal],
  [data-hero-enter],
  [data-header] {
    opacity: 1;
    transform: none;
    transition: none;
  }
  .media-zoom img,
  .media-zoom:hover img {
    transform: none !important;
    filter: none !important;
    transition: none !important;
  }
}

@media (max-width: 767px) {
  .split, .master, .catalog article, .catalog article:nth-child(even),
  .why, .cards, .quotes, .price-row { grid-template-columns: 1fr; direction: ltr; }
  .mosaic { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page-hero { padding-top: 120px; }
}

@media (max-width: 640px) {
  .wrap { width: calc(100% - 40px); }
  .cards, .mosaic { grid-template-columns: 1fr; }
  .btn { width: calc(100% - 64px); }
  .actions .btn { width: auto; min-width: 0; }
  .actions { padding-right: 64px; }
}

/* Онлайн-запись: шаги выбора (услуга → мастер → дата → время). */
.booking-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 28px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.booking-steps li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 0.62rem;
  text-transform: uppercase;
  letter-spacing: 0.24em;
  color: var(--muted);
}
.booking-steps b {
  display: grid;
  place-items: center;
  width: 1.9rem;
  height: 1.9rem;
  flex: none;
  border: 1px solid var(--line);
  font-family: var(--display);
  font-size: 0.95rem;
  font-weight: 400;
  letter-spacing: 0;
  color: var(--muted);
}
.booking-steps a { color: inherit; }
.booking-steps a:hover { color: var(--wine); }
.booking-steps .is-done { color: var(--fg); }
.booking-steps .is-done b { border-color: var(--gold); color: var(--wine); }
.booking-steps .is-current { color: var(--fg); }
.booking-steps .is-current b {
  border-color: var(--wine);
  background: var(--wine);
  color: #f3ebe3;
}

.booking-notice {
  margin-top: 28px;
  border-left: 2px solid var(--gold);
  padding: 4px 0 4px 18px;
  font-size: 0.95rem;
  line-height: 1.7;
  color: var(--muted);
}
.booking-empty {
  border: 1px solid var(--line);
  background: var(--cream);
  padding: 22px 24px;
  font-size: 0.95rem;
  line-height: 1.7;
  color: var(--muted);
}

.booking-list { list-style: none; margin: 0; padding: 0; }
.booking-option {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px 24px;
  padding: 20px 0;
  border-bottom: 1px solid var(--line);
  color: var(--fg);
  transition: border-color .5s var(--ease), color .5s var(--ease);
}
a.booking-option:hover { border-bottom-color: var(--gold); color: var(--wine); }
.booking-option__name {
  display: block;
  font-family: var(--display);
  font-size: 1.4rem;
  line-height: 1.25;
}
.booking-option__desc {
  display: block;
  margin-top: 4px;
  font-size: 0.85rem;
  color: var(--muted);
}
.booking-option__meta {
  font-size: 0.62rem;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: var(--muted);
  text-align: right;
  white-space: nowrap;
}
.booking-option__face {
  display: flex;
  align-items: center;
  gap: 18px;
  min-width: 0;
}
.booking-option__face img {
  width: 56px;
  height: 56px;
  flex: none;
  border-radius: 9999px;
  object-fit: cover;
}
.booking-option__any {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  flex: none;
  border: 1px solid var(--line);
  border-radius: 9999px;
  color: var(--gold);
}

.booking-window {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid var(--line);
  padding-bottom: 14px;
}
.booking-window__range {
  font-size: 0.62rem;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  color: var(--muted);
}
.booking-window__nav { display: flex; gap: 10px; }
.booking-arrow {
  display: grid;
  place-items: center;
  width: 2.5rem;
  height: 2.5rem;
  border: 1px solid var(--line);
  color: var(--fg);
  transition: border-color .5s var(--ease), color .5s var(--ease);
}
a.booking-arrow:hover { border-color: var(--gold); color: var(--wine); }
.booking-arrow.is-off { opacity: .35; }

.booking-days {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(7rem, 1fr));
  gap: 12px;
}
.booking-day {
  display: block;
  border: 1px solid var(--line);
  background: var(--card);
  padding: 14px 10px;
  text-align: center;
  color: var(--fg);
  transition: border-color .5s var(--ease), color .5s var(--ease);
}
a.booking-day:hover { border-color: var(--gold); color: var(--wine); }
.booking-day.is-off { background: transparent; color: var(--muted); opacity: .6; }
.booking-day__wd {
  display: block;
  font-size: 0.55rem;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  color: var(--muted);
}
.booking-day__date {
  display: block;
  margin-top: 8px;
  font-family: var(--display);
  font-size: 1.3rem;
  line-height: 1.1;
}
.booking-day__free {
  display: block;
  margin-top: 8px;
  font-size: 0.55rem;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: var(--muted);
}

.booking-slots {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(5.5rem, 1fr));
  gap: 10px;
}
.booking-slot {
  display: grid;
  place-items: center;
  height: 3.25rem;
  border: 1px solid var(--line);
  background: var(--card);
  font-size: 0.95rem;
  letter-spacing: 0.04em;
  color: var(--fg);
  transition: border-color .5s var(--ease), color .5s var(--ease);
}
a.booking-slot:hover { border-color: var(--wine); color: var(--wine); }
/* Перенос записи без JS: окно времени — обычная кнопка отправки формы. */
button.booking-slot {
  width: 100%;
  font-family: inherit;
  text-transform: none;
  cursor: pointer;
}
button.booking-slot:hover { border-color: var(--wine); color: var(--wine); }
.booking-slot.is-busy {
  background: transparent;
  color: var(--muted);
  opacity: .5;
  text-decoration: line-through;
}

.booking-summary {
  border: 1px solid var(--line);
  background: var(--cream);
  padding: 28px;
}
.booking-summary dl { margin: 0; }
.booking-summary dt {
  font-size: 0.55rem;
  text-transform: uppercase;
  letter-spacing: 0.24em;
  color: var(--muted);
}
.booking-summary dd {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 6px 16px;
  margin: 6px 0 20px;
  font-size: 1rem;
  line-height: 1.5;
}
.booking-summary dd:last-child { margin-bottom: 0; }
.booking-summary__edit {
  font-size: 0.55rem;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: var(--wine);
}
.booking-summary__total {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin-top: 24px;
  border-top: 1px solid var(--line);
  padding-top: 18px;
  font-size: 0.62rem;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: var(--muted);
}
.booking-summary__total strong {
  font-family: var(--display);
  font-size: 1.5rem;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  color: var(--wine);
}

/* Ошибка шага контактов: не прошла проверка, форма осталась заполненной. */
.booking-error {
  margin-bottom: 28px;
  border-left: 2px solid var(--wine);
  padding: 4px 0 4px 18px;
  font-size: 0.95rem;
  line-height: 1.7;
  color: var(--wine);
}

/* Экран после сохранения записи. */
.booking-done {
  border: 1px solid var(--line);
  background: var(--cream);
  padding: 28px;
}
.booking-done dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px 32px;
  margin: 0;
}
.booking-done dt {
  font-size: 0.55rem;
  text-transform: uppercase;
  letter-spacing: 0.24em;
  color: var(--muted);
}
.booking-done dd {
  margin: 8px 0 0;
  font-family: var(--display);
  font-size: 1.35rem;
  line-height: 1.3;
}
.booking-done__total {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin-top: 28px;
  border-top: 1px solid var(--line);
  padding-top: 18px;
  font-size: 0.62rem;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: var(--muted);
}
.booking-done__total strong {
  font-family: var(--display);
  font-size: 1.5rem;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  color: var(--wine);
}

/* Управление записью по ссылке: /booking/manage/ */
.booking-manage__done {
  margin-bottom: 28px;
  border-left: 2px solid var(--wine);
  padding: 4px 0 4px 18px;
  font-size: 1rem;
  line-height: 1.7;
  color: var(--fg);
}
.booking-manage__status {
  margin-top: 18px;
  font-size: 0.62rem;
  text-transform: uppercase;
  letter-spacing: 0.24em;
  color: var(--muted);
}
.booking-manage__cancel {
  margin-top: 48px;
  border-top: 1px solid var(--line);
  padding-top: 36px;
}

/* Акции: /promo/ */
.promo-card {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--line);
  background: var(--card);
  transition: border-color .7s var(--ease), box-shadow .7s var(--ease);
}
.promo-card:hover {
  border-color: color-mix(in oklab, var(--gold) 60%, transparent);
  box-shadow: var(--shadow-lift);
}
.promo-card__media {
  position: relative;
  aspect-ratio: 16 / 10;
}
.promo-card__badge {
  position: absolute;
  top: 20px;
  left: 20px;
  border: 1px solid color-mix(in oklab, var(--gold) 45%, transparent);
  background: color-mix(in oklab, var(--ink) 72%, transparent);
  padding: 7px 14px;
  font-size: 0.55rem;
  text-transform: uppercase;
  letter-spacing: 0.24em;
  color: var(--gold);
}
.promo-card__body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  padding: 32px;
}
.promo-card__foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: auto;
  padding-top: 28px;
}
.promo-card__term {
  font-size: 0.6rem;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: var(--muted);
}

/* Сертификаты: выбор номинала на /certificates/ */
.cert-amounts {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr));
  gap: 10px;
}
.cert-amount { display: block; cursor: pointer; }
/* Селектор с `.form-lovable`: иначе общее правило полей формы растянет радио. */
.cert-amount input[type=radio],
.form-lovable .cert-amount input[type=radio] {
  position: absolute;
  width: 1px;
  min-height: 0;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}
.cert-amount span {
  display: grid;
  place-items: center;
  height: 3.5rem;
  border: 1px solid var(--line);
  background: var(--card);
  padding: 0 12px;
  text-align: center;
  font-size: 0.95rem;
  color: var(--fg);
  transition: border-color .5s var(--ease), color .5s var(--ease);
}
.cert-amount:hover span { border-color: var(--gold); color: var(--wine); }
.cert-amount input:checked + span {
  border-color: var(--wine);
  background: var(--wine);
  color: #f3ebe3;
}
.cert-amount input:focus-visible + span { outline: 2px solid var(--gold); outline-offset: 2px; }

/* Вход в кабинет: выбор, куда прислать код (SMS / Telegram / почта). Тот же вид, что у номиналов сертификата. */
.login-ways {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr));
  gap: 10px;
}
.login-way { display: block; cursor: pointer; }
.login-way input[type=radio],
.form-lovable .login-way input[type=radio] {
  position: absolute;
  width: 1px;
  min-height: 0;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}
.login-way span {
  display: grid;
  place-items: center;
  height: 3.5rem;
  border: 1px solid var(--line);
  background: var(--card);
  padding: 0 12px;
  text-align: center;
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  color: var(--fg);
  transition: border-color .5s var(--ease), color .5s var(--ease), background-color .5s var(--ease);
}
.login-way:hover span { border-color: var(--gold); color: var(--wine); }
.login-way input:checked + span {
  border-color: var(--wine);
  background: var(--wine);
  color: #f3ebe3;
}
.login-way input:focus-visible + span { outline: 2px solid var(--gold); outline-offset: 2px; }
.form-lovable fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.form-lovable legend { padding: 0; margin-bottom: 12px; }
/* Ожидание «Старт» в боте: кнопка в Telegram над полем кода. */
.cabinet-tg { margin: 0 0 40px; padding: 28px; border: 1px solid var(--line); background: var(--card); }

/* Личный кабинет клиентки: /cabinet/ — вход по коду и обзор. */
.cabinet-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 20px 32px;
  border: 1px solid var(--line);
  background: var(--cream);
  padding: 24px 28px;
}
.cabinet-bar__who { display: grid; gap: 6px; min-width: 0; }
.cabinet-bar__hello {
  font-size: 0.55rem;
  text-transform: uppercase;
  letter-spacing: 0.24em;
  color: var(--muted);
}
.cabinet-bar__name {
  font-family: var(--display);
  font-size: 1.6rem;
  line-height: 1.2;
  color: var(--wine);
}
.cabinet-bar__phone {
  font-size: 0.62rem;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: var(--muted);
}
.cabinet-bar__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.cabinet-bar__actions form { margin: 0; }

.cabinet-card {
  border: 1px solid var(--line);
  background: var(--card);
  padding: 28px;
}
.cabinet-card dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px 32px;
  margin: 0;
}
.cabinet-card dt {
  font-size: 0.55rem;
  text-transform: uppercase;
  letter-spacing: 0.24em;
  color: var(--muted);
}
.cabinet-card dd {
  margin: 8px 0 0;
  font-family: var(--display);
  font-size: 1.35rem;
  line-height: 1.3;
}

/* Поле кода: цифры разрежены, чтобы их было легко сверять с сообщением. */
.form-lovable input.cabinet-code {
  font-family: var(--display);
  font-size: 1.75rem;
  letter-spacing: 0.42em;
}
.cabinet-again {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 28px;
  margin-top: 28px;
  font-size: 0.9rem;
  color: var(--muted);
}
.cabinet-again form { margin: 0; }
.cabinet-again__link {
  border: 0;
  background: none;
  padding: 0;
  font: inherit;
  color: var(--wine);
  cursor: pointer;
}
/* Разделы кабинета: обзор, визиты, данные. */
.cabinet-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 28px;
  margin-top: 28px;
  border-bottom: 1px solid var(--line);
  padding-bottom: 14px;
}
.cabinet-nav__item {
  font-size: 0.62rem;
  text-transform: uppercase;
  letter-spacing: 0.24em;
  color: var(--muted);
  transition: color .5s var(--ease);
}
a.cabinet-nav__item:hover { color: var(--wine); }
.cabinet-nav__item.is-on { color: var(--wine); border-bottom: 1px solid var(--gold); padding-bottom: 13px; margin-bottom: -14px; }

.cabinet-section { margin-top: 48px; }
.cabinet-section__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px 24px;
  margin-bottom: 20px;
}

.cabinet-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  border: 1px solid var(--line);
  background: var(--line);
}
.cabinet-stats > div {
  display: grid;
  gap: 10px;
  background: var(--cream);
  padding: 22px 24px;
}
.cabinet-stats__label {
  font-size: 0.55rem;
  text-transform: uppercase;
  letter-spacing: 0.24em;
  color: var(--muted);
}
.cabinet-stats__value {
  font-family: var(--display);
  font-size: 1.5rem;
  line-height: 1.2;
  color: var(--wine);
}

.cabinet-visits { display: grid; gap: 12px; }
.cabinet-visit {
  display: grid;
  grid-template-columns: minmax(9rem, 12rem) minmax(0, 1fr) minmax(8rem, auto);
  align-items: start;
  gap: 16px 32px;
  border: 1px solid var(--line);
  background: var(--card);
  padding: 24px 28px;
  transition: border-color .7s var(--ease);
}
.cabinet-visit:hover { border-color: color-mix(in oklab, var(--gold) 55%, transparent); }
.cabinet-visit.is-off { background: transparent; }
.cabinet-visit.is-off .cabinet-visit__date,
.cabinet-visit.is-off .cabinet-visit__service { color: var(--muted); }
.cabinet-visit__when { display: grid; gap: 8px; }
.cabinet-visit__date {
  font-family: var(--display);
  font-size: 1.35rem;
  line-height: 1.2;
}
.cabinet-visit__time {
  font-size: 0.6rem;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  color: var(--muted);
}
.cabinet-visit__service {
  font-family: var(--display);
  font-size: 1.2rem;
  font-weight: 400;
  line-height: 1.3;
}
.cabinet-visit__meta {
  margin-top: 8px;
  font-size: 0.85rem;
  line-height: 1.6;
  color: var(--muted);
}
.cabinet-visit__note {
  margin-top: 12px;
  border-left: 1px solid var(--line);
  padding-left: 14px;
  font-size: 0.85rem;
  line-height: 1.7;
  color: var(--muted);
}
.cabinet-visit__side {
  display: grid;
  justify-items: end;
  gap: 10px;
  text-align: right;
}
.cabinet-visit__status {
  font-size: 0.55rem;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  color: var(--muted);
}
.cabinet-visit__price {
  font-family: var(--display);
  font-size: 1.3rem;
  color: var(--wine);
}

.cabinet-section__lead {
  margin: -8px 0 20px;
  max-width: 46rem;
  font-size: 0.9rem;
  line-height: 1.8;
  color: var(--muted);
}

/* Повтор прошлой услуги: карточка с предзаполненной записью. */
.cabinet-repeat {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
  gap: 12px;
}
.cabinet-repeat__item {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--line);
  background: var(--card);
  padding: 24px 26px;
  transition: border-color .7s var(--ease);
}
.cabinet-repeat__item:hover { border-color: color-mix(in oklab, var(--gold) 55%, transparent); }
.cabinet-repeat__name {
  font-family: var(--display);
  font-size: 1.2rem;
  font-weight: 400;
  line-height: 1.3;
}
.cabinet-repeat__meta {
  margin-top: 10px;
  font-size: 0.85rem;
  line-height: 1.6;
  color: var(--muted);
}
.cabinet-repeat__when {
  margin: 8px 0 22px;
  font-size: 0.55rem;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  color: var(--muted);
}
/* Кнопку прижимаем книзу: в ряду карточки разной высоты. */
.cabinet-repeat__btn { margin-top: auto; align-self: flex-start; }

/* Сертификаты клиентки. */
.cabinet-certs { display: grid; gap: 12px; }
.cabinet-cert {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(8rem, auto);
  align-items: start;
  gap: 16px 32px;
  border: 1px solid var(--line);
  background: var(--card);
  padding: 24px 28px;
  transition: border-color .7s var(--ease);
}
.cabinet-cert:hover { border-color: color-mix(in oklab, var(--gold) 55%, transparent); }
.cabinet-cert.is-off { background: transparent; }
.cabinet-cert.is-off .cabinet-cert__amount { color: var(--muted); }
.cabinet-cert__code {
  display: block;
  font-size: 0.6rem;
  text-transform: uppercase;
  letter-spacing: 0.28em;
  color: var(--muted);
}
.cabinet-cert__amount {
  display: block;
  margin-top: 10px;
  font-family: var(--display);
  font-size: 1.6rem;
  line-height: 1.2;
  color: var(--wine);
}
.cabinet-cert__meta {
  margin-top: 10px;
  font-size: 0.85rem;
  line-height: 1.6;
  color: var(--muted);
}
.cabinet-cert__note {
  margin-top: 12px;
  border-left: 1px solid var(--line);
  padding-left: 14px;
  font-size: 0.85rem;
  line-height: 1.7;
  color: var(--muted);
}
.cabinet-cert__side {
  display: grid;
  justify-items: end;
  gap: 10px;
  text-align: right;
}
.cabinet-cert__status,
.cabinet-cert__left {
  font-size: 0.55rem;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  color: var(--muted);
}
.cabinet-cert__left { color: var(--wine); }

/* Акции в кабинете: коротко, подробности — на странице акций. */
.cabinet-promos {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
  gap: 12px;
}
.cabinet-promo {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--line);
  background: var(--cream);
  padding: 24px 26px;
}
.cabinet-promo__badge {
  font-size: 0.55rem;
  text-transform: uppercase;
  letter-spacing: 0.24em;
  color: var(--wine);
}
.cabinet-promo__title {
  margin-top: 10px;
  font-family: var(--display);
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 1.3;
}
.cabinet-promo__text {
  margin-top: 10px;
  font-size: 0.85rem;
  line-height: 1.7;
  color: var(--muted);
}
.cabinet-promo__term {
  margin-top: 14px;
  font-size: 0.55rem;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  color: var(--muted);
}
.cabinet-promo__link { margin-top: 16px; align-self: flex-start; }

/* Телефон в форме данных: показываем, но не даём править. */
.cabinet-locked {
  border: 1px solid var(--line);
  background: var(--cream);
  padding: 22px 24px;
}
.cabinet-locked__label {
  display: block;
  font-size: 0.55rem;
  text-transform: uppercase;
  letter-spacing: 0.24em;
  color: var(--muted);
}
.cabinet-locked__value {
  display: block;
  margin-top: 8px;
  font-family: var(--display);
  font-size: 1.35rem;
}
.cabinet-locked__note {
  margin-top: 12px;
  font-size: 0.85rem;
  line-height: 1.7;
  color: var(--muted);
}
@media (max-width: 900px) {
  .cabinet-visit { grid-template-columns: minmax(8rem, 10rem) minmax(0, 1fr); }
  .cabinet-visit__side { grid-column: 1 / -1; justify-items: start; text-align: left; }
  .cabinet-cert { grid-template-columns: 1fr; }
  .cabinet-cert__side { justify-items: start; text-align: left; }
}

@media (max-width: 640px) {
  .cabinet-nav { gap: 10px 20px; }
  .cabinet-stats { grid-template-columns: 1fr; }
  .cabinet-visit { grid-template-columns: 1fr; padding: 22px; }
  .cabinet-visit__when {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px 14px;
  }
  .cabinet-locked { padding: 20px; }
  .cabinet-repeat,
  .cabinet-promos { grid-template-columns: 1fr; }
  .cabinet-repeat__item,
  .cabinet-promo { padding: 22px; }
  .cabinet-repeat__btn { width: 100%; }
  .cabinet-cert { padding: 22px; }
  .promo-card__body { padding: 24px; }
  .cert-amounts { grid-template-columns: repeat(auto-fill, minmax(7.5rem, 1fr)); }
  .booking-steps { gap: 10px 18px; }
  .booking-done { padding: 22px; }
  .booking-done dl { grid-template-columns: 1fr; gap: 18px; }
  .booking-option { grid-template-columns: 1fr; gap: 10px; }
  .booking-option__meta { text-align: left; }
  .booking-days { grid-template-columns: repeat(auto-fill, minmax(6rem, 1fr)); }
  .booking-slots { grid-template-columns: repeat(auto-fill, minmax(4.75rem, 1fr)); }
  .booking-summary { padding: 22px; }
  .cabinet-bar { padding: 22px; }
  .cabinet-bar__actions { width: 100%; }
  .cabinet-bar__actions > * { flex: 1 1 100%; }
  .cabinet-bar__actions form button { width: 100%; }
  .cabinet-card { padding: 22px; }
  .cabinet-card dl { grid-template-columns: 1fr; gap: 18px; }
  .form-lovable input.cabinet-code { font-size: 1.4rem; letter-spacing: 0.3em; }
}

/* Подсказка «установить на главный экран» (PWA). Прямые углы, палитра витрины. */
.pwa-install {
  position: fixed;
  z-index: 70;
  right: calc(1.5rem + env(safe-area-inset-right, 0px));
  bottom: calc(1.5rem + env(safe-area-inset-bottom, 0px));
  left: auto;
  width: min(32rem, calc(100vw - 3rem));
  border: 1px solid var(--line);
  border-top: 1px solid var(--gold);
  background: var(--card);
  box-shadow: var(--shadow);
  opacity: 0;
  transform: translateY(16px);
  transition: opacity .6s var(--ease), transform .6s var(--ease);
}
.pwa-install[hidden] { display: none; }
.pwa-install.is-in {
  opacity: 1;
  transform: none;
}
.pwa-install__inner {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 18px 20px;
  padding: 24px 26px;
}
.pwa-install__logo {
  width: 52px;
  height: 52px;
  object-fit: contain;
}
.pwa-install__eyebrow {
  margin: 0;
  font-size: 0.55rem;
  text-transform: uppercase;
  letter-spacing: 0.28em;
  color: var(--wine);
}
.pwa-install__note {
  margin: 10px 0 0;
  font-size: 0.85rem;
  line-height: 1.7;
  color: var(--muted);
}
.pwa-install__note[hidden] { display: none; }
.pwa-install__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  grid-column: 2;
}
.pwa-install__actions button[hidden] { display: none; }

@media (max-width: 640px) {
  .pwa-install {
    right: 0;
    left: 0;
    bottom: 0;
    width: auto;
    border-left: 0;
    border-right: 0;
    border-bottom: 0;
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }
  .pwa-install__inner {
    grid-template-columns: 1fr;
    gap: 16px;
    padding: 22px;
  }
  .pwa-install__logo { width: 44px; height: 44px; }
  .pwa-install__actions {
    grid-column: 1;
    gap: 10px;
  }
  .pwa-install__actions button { flex: 1 1 100%; }
}

/* Вход через бота: три шага над формой номера. */
.cabinet-howto { margin: 0 0 8px; padding: 28px; border: 1px solid var(--line); background: var(--cream); }
.cabinet-howto ol { margin: 18px 0 0; padding: 0; list-style: none; counter-reset: howto; display: grid; gap: 14px; }
.cabinet-howto li { counter-increment: howto; display: grid; grid-template-columns: 2rem 1fr; gap: 12px; font-size: 0.95rem; line-height: 1.55; }
.cabinet-howto li::before { content: counter(howto); font-family: var(--display); font-size: 1.6rem; line-height: 1; color: var(--wine); }

/* Приглашение в личный кабинет после записи — заметный тёмный блок. */
.booking-cabinet { padding: 36px; background: var(--ink); color: #f3ebe3; }
.booking-cabinet p { color: rgba(243, 235, 227, 0.78); }
@media (max-width: 640px) {
  .cabinet-howto, .booking-cabinet { padding: 22px; }
}

/* Плашка служебной копии (config mirror_of): на рабочем сайте её нет */
.mirror-note {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 60;
  padding: .55rem 1.5rem;
  background: var(--wine);
  color: var(--cream);
  font-size: .72rem;
  letter-spacing: .08em;
  text-align: center;
}
.mirror-note a { color: var(--gold-soft); text-decoration: underline; text-underline-offset: 3px; }

/* Листание в просмотре фото: стрелки видны, только когда в группе больше одного снимка. */
.lightbox-nav {
  position: absolute;
  top: 50%;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  margin-top: -1.5rem;
  border: 1px solid rgba(201, 164, 106, .4);
  background: rgba(28, 20, 18, .35);
  color: var(--ink-foreground, #f3ebe3);
  font-size: 2rem;
  line-height: 1;
  cursor: pointer;
  transition: border-color .5s var(--ease);
}
.lightbox-nav:hover { border-color: var(--gold); }
.lightbox-nav[hidden] { display: none; }
.lightbox-nav--prev { left: 1rem; }
.lightbox-nav--next { right: 1rem; }
@media (min-width: 768px) {
  .lightbox-nav--prev { left: 2rem; }
  .lightbox-nav--next { right: 2rem; }
}

/* Страница «Приложение»: макет телефона слева, установка и инструкции справа. */
[data-pwa-link][hidden],
.app-page [hidden] { display: none; }
.app-page {
  display: grid;
  gap: 4rem;
  align-items: start;
}
.app-page__phone {
  justify-self: center;
  width: min(100%, 18rem);
  padding: .6rem;
  border: 1px solid var(--line);
  border-radius: 2.4rem;
  background: var(--ink);
  box-shadow: var(--shadow);
}
.app-page__phone img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 1.9rem;
}
.app-page__install { margin-top: 2.5rem; }
.app-page__state {
  margin: 0 0 1.25rem;
  max-width: 34rem;
  font-size: .95rem;
  line-height: 1.6;
  color: var(--muted);
}
.app-page__ways {
  display: grid;
  gap: 1.5rem;
  margin-top: 3rem;
}
.app-page__way {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 2rem;
  border: 1px solid var(--line);
  background: var(--card);
}
.app-page__way.is-mine { border-color: var(--gold); box-shadow: var(--shadow); }
.app-page__way-icon { color: var(--gold); margin-bottom: 1.25rem; }
.app-page__steps {
  margin: 1.25rem 0 0;
  padding: 0;
  list-style: none;
  counter-reset: step;
}
.app-page__steps li {
  position: relative;
  padding-left: 2.25rem;
  margin: .9rem 0 0;
  font-size: .9rem;
  line-height: 1.6;
  color: var(--fg);
  counter-increment: step;
}
.app-page__steps li::before {
  content: "0" counter(step);
  position: absolute;
  left: 0;
  top: .1rem;
  font-size: .65rem;
  letter-spacing: .2em;
  color: var(--gold);
}
.app-page__inline-icon {
  display: inline-block;
  width: 1rem;
  height: 1rem;
  vertical-align: -.15rem;
  color: var(--wine);
}
@media (min-width: 768px) {
  .app-page__ways { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1024px) {
  .app-page { grid-template-columns: minmax(0, 20rem) minmax(0, 1fr); gap: 6rem; }
  .app-page__phone { width: 100%; position: sticky; top: 7rem; }
}
