/* ─────────────────────────────────────────
   VELVET LUXE — Full Redesign
   Black · Gold · Lavender
   ───────────────────────────────────────── */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600&family=DM+Sans:wght@300;400;500;600&display=swap');

/* ─── TOKENS ─── */
:root {
  --black:       #07060a;
  --black-soft:  #0f0d14;
  --black-card:  #120f1a;
  --black-border:#1e1a2a;
  --gold:        #c9a84c;
  --gold-light:  #e2c97e;
  --gold-dim:    #7a6228;
  --lavender:    #b48fe0;
  --lavender-light: #d4b8f5;
  --lavender-dim:#6b4a9a;
  --lavender-glow: rgba(180,143,224,0.15);
  --white:       #ffffff;
  --white-80:    rgba(255,255,255,0.8);
  --white-50:    rgba(255,255,255,0.5);
  --white-20:    rgba(255,255,255,0.2);
  --white-08:    rgba(255,255,255,0.08);
  --gold-glow:   rgba(201,168,76,0.18);
  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body:    'DM Sans', system-ui, sans-serif;
  --nav-h: 72px;
  --radius: 12px;
  --radius-lg: 20px;
}

/* ─── RESET ─── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  background: var(--black);
  color: var(--white-80);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.7;
  overflow-x: hidden;
}
img { display: block; max-width: 100%; }
a { text-decoration: none; color: inherit; }
ul { list-style: none; }

/* ─── TYPOGRAPHY ─── */
.h1, .h2, .h3 {
  font-family: var(--font-display);
  font-weight: 500;
  line-height: 1.15;
  color: var(--white);
}
.h1 { font-size: clamp(3rem, 7vw, 5.5rem); }
.h2 { font-size: clamp(2.2rem, 4.5vw, 3.5rem); }
.h3 { font-size: clamp(1.3rem, 2.5vw, 1.8rem); }
.h2 em, .h3 em { font-style: italic; color: var(--gold); }
.eyebrow {
  font-family: var(--font-body);
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--lavender);
  margin-bottom: .6rem;
}

/* ─── LAYOUT ─── */
.container { max-width: 1200px; margin: 0 auto; padding: 0 clamp(1.25rem, 5vw, 3rem); }
.section { padding: clamp(5rem, 10vw, 8rem) 0; }
.section-header { text-align: center; max-width: 640px; margin: 0 auto 3.5rem; }
.section-sub { color: var(--white-50); margin-top: .9rem; font-size: .95rem; }

/* ─── BUTTONS ─── */
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  gap: .5rem;
  padding: .8rem 2rem;
  border-radius: 999px;
  font-family: var(--font-body);
  font-size: .85rem;
  font-weight: 500;
  letter-spacing: .06em;
  text-transform: uppercase;
  cursor: pointer;
  transition: all .25s ease;
  border: 1.5px solid transparent;
  white-space: nowrap;
}
.btn--gold {
  background: linear-gradient(135deg, var(--gold), var(--gold-light));
  color: var(--black);
  border-color: var(--gold);
}
.btn--gold:hover { background: var(--gold-light); box-shadow: 0 0 24px var(--gold-glow); transform: translateY(-1px); }
.btn--outline {
  background: transparent;
  border-color: var(--lavender);
  color: var(--lavender-light);
}
.btn--outline:hover { background: var(--lavender-glow); box-shadow: 0 0 20px var(--lavender-glow); }
.btn--outline-white {
  background: transparent;
  border-color: rgba(255,255,255,0.4);
  color: var(--white);
}
.btn--outline-white:hover { background: var(--white-08); border-color: var(--white); }
.btn--full { width: 100%; }

/* ─── DIVIDER ─── */
.gold-divider {
  width: 60px; height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  margin: 1.2rem auto;
}

/* ══════════════════════════════════════════
   NAV
══════════════════════════════════════════ */
.nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  height: var(--nav-h);
  display: flex; align-items: center;
  background: rgba(7,6,10,0.7);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--black-border);
  transition: background .3s;
}
.nav.scrolled { background: rgba(7,6,10,0.95); }
.nav__inner {
  display: flex; align-items: center; justify-content: space-between;
  width: 100%; max-width: 1200px; margin: 0 auto;
  padding: 0 clamp(1.25rem, 5vw, 3rem);
}
.nav__logo img { height: 44px; width: auto; object-fit: contain; }
.nav__links {
  display: flex; gap: 2.2rem;
  font-size: .8rem; font-weight: 500;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--white-50);
}
.nav__links a:hover { color: var(--gold); }
.nav__cta { padding: .55rem 1.4rem; font-size: .75rem; }
.hamburger {
  display: none; flex-direction: column; gap: 5px;
  background: none; border: none; cursor: pointer; padding: 4px;
}
.hamburger span {
  display: block; width: 22px; height: 1.5px;
  background: var(--white); border-radius: 2px;
  transition: all .3s;
}
.mobile-menu {
  display: none; flex-direction: column; align-items: center;
  gap: 1.5rem; padding: 2rem 1.5rem;
  position: fixed; top: var(--nav-h); left: 0; right: 0;
  background: rgba(7,6,10,0.97);
  border-bottom: 1px solid var(--black-border);
  z-index: 99;
  font-size: .85rem; letter-spacing: .1em; text-transform: uppercase;
}
.mobile-menu.open { display: flex; }

/* ══════════════════════════════════════════
   HERO
══════════════════════════════════════════ */
.hero {
  position: relative; min-height: 100vh;
  display: flex; align-items: center; justify-content: center;
  overflow: hidden; padding-top: var(--nav-h);
}
.hero__mosaic {
  position: absolute; inset: 0; z-index: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(3, 1fr);
}
.hero__mosaic-item {
  overflow: hidden;
}
.hero__mosaic-item img {
  width: 100%; height: 100%;
  object-fit: cover;
  filter: brightness(0.2) saturate(0.6);
  transition: filter 8s ease;
}
.hero::after {
  content: '';
  position: absolute; inset: 0; z-index: 1;
  background:
    radial-gradient(ellipse 70% 60% at 50% 40%, rgba(100,50,180,0.25) 0%, transparent 70%),
    radial-gradient(ellipse 100% 50% at 50% 100%, var(--black) 0%, transparent 60%),
    linear-gradient(to bottom, rgba(7,6,10,0.5) 0%, rgba(7,6,10,0.2) 40%, rgba(7,6,10,0.85) 100%);
}
.hero__content {
  position: relative; z-index: 2;
  text-align: center;
  padding: 2rem 1.5rem;
  display: flex; flex-direction: column; align-items: center; gap: 1rem;
}
.hero__logo { width: clamp(200px, 38vw, 340px); filter: drop-shadow(0 0 40px rgba(180,143,224,0.4)); }
.hero__loc {
  font-size: .75rem; letter-spacing: .2em; text-transform: uppercase;
  color: var(--lavender-light); opacity: .85;
}
.hero__tagline {
  font-family: var(--font-display);
  font-style: italic;
  font-size: clamp(1.1rem, 2.5vw, 1.6rem);
  color: var(--gold-light);
  max-width: 520px;
}
.hero__btns { display: flex; gap: 1rem; flex-wrap: wrap; justify-content: center; margin-top: .5rem; }
.hero__scroll {
  position: absolute; bottom: 2rem; left: 50%; transform: translateX(-50%);
  z-index: 2; color: var(--white-20);
  animation: bounce 2.5s ease-in-out infinite;
}
@keyframes bounce { 0%,100%{transform:translateX(-50%) translateY(0)} 50%{transform:translateX(-50%) translateY(8px)} }

/* ══════════════════════════════════════════
   MARQUEE
══════════════════════════════════════════ */
.marquee {
  overflow: hidden;
  border-top: 1px solid var(--black-border);
  border-bottom: 1px solid var(--black-border);
  background: var(--black-soft);
  padding: 1rem 0;
}
.marquee__track {
  display: flex; gap: 2rem;
  animation: marquee 28s linear infinite;
  width: max-content;
}
.marquee__track span {
  font-family: var(--font-display);
  font-style: italic;
  font-size: 1.1rem;
  color: var(--gold);
  white-space: nowrap;
  padding: 0 1.5rem;
}
.marquee__track span::after {
  content: '✦';
  margin-left: 2rem;
  color: var(--lavender);
  font-style: normal;
  font-size: .7rem;
}
@keyframes marquee { from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* ══════════════════════════════════════════
   ABOUT
══════════════════════════════════════════ */
.about__wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(2rem, 6vw, 5rem);
  align-items: center;
}
.about__photos {
  display: grid;
  grid-template-columns: 1fr;
  gap: .75rem;
  position: relative;
}
.about__photo {
  border-radius: var(--radius);
  aspect-ratio: 3/4;
  object-fit: cover;
  object-position: top center;
  border: 1px solid var(--black-border);
  width: 100%;
}
.about__photo--portrait {
  aspect-ratio: 3/4;
  object-position: top center;
  border: 2px solid rgba(201,168,76,0.4);
  box-shadow: 0 0 40px rgba(201,168,76,0.12), 0 20px 60px rgba(0,0,0,0.5);
  border-radius: 12px;
}
.about__text { display: flex; flex-direction: column; gap: 1.2rem; }
.about__intro { font-size: 1.05rem; color: var(--white-80); }
.about__intro em { font-style: italic; color: var(--gold); font-family: var(--font-display); font-size: 1.2em; }
.about__body { color: var(--white-50); font-size: .95rem; }
.about__stats { display: flex; gap: 2rem; margin-top: .5rem; }
.stat { display: flex; flex-direction: column; }
.stat__n { font-family: var(--font-display); font-size: 2.2rem; color: var(--gold); font-weight: 500; line-height: 1; }
.stat__l { font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; color: var(--white-50); margin-top: .25rem; }

/* ══════════════════════════════════════════
   GALLERY
══════════════════════════════════════════ */
.gallery { background: var(--black-soft); }
.gallery__grid {
  columns: 3;
  column-gap: .75rem;
}
.gallery__item {
  break-inside: avoid;
  margin-bottom: .75rem;
  border-radius: var(--radius);
  overflow: hidden;
  cursor: pointer;
  position: relative;
}
.gallery__item img {
  width: 100%; display: block;
  transition: transform .5s ease, filter .3s ease;
  filter: brightness(0.92) saturate(0.9);
}
.gallery__item:hover img { transform: scale(1.04); filter: brightness(1) saturate(1.1); }
.gallery__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(7,6,10,0.7) 0%, transparent 50%);
  opacity: 0; transition: opacity .3s;
  display: flex; align-items: flex-end; padding: 1rem;
}
.gallery__item:hover .gallery__overlay { opacity: 1; }
.gallery__overlay span { font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; color: var(--gold); }

/* ─── LIGHTBOX ─── */
.lightbox {
  display: none; position: fixed; inset: 0; z-index: 200;
  background: rgba(7,6,10,0.95);
  align-items: center; justify-content: center;
}
.lightbox.open { display: flex; }
.lightbox__img { max-width: 88vw; max-height: 88vh; border-radius: var(--radius); object-fit: contain; }
.lightbox__close, .lightbox__prev, .lightbox__next {
  position: absolute; background: var(--white-08); border: 1px solid var(--white-20);
  color: var(--white); border-radius: 999px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; font-size: 1.2rem;
  transition: background .2s;
}
.lightbox__close:hover, .lightbox__prev:hover, .lightbox__next:hover { background: var(--gold-glow); border-color: var(--gold); }
.lightbox__close { top: 1.5rem; right: 1.5rem; }
.lightbox__prev { left: 1.5rem; top: 50%; transform: translateY(-50%); }
.lightbox__next { right: 1.5rem; top: 50%; transform: translateY(-50%); }

/* ══════════════════════════════════════════
   SERVICES
══════════════════════════════════════════ */
.services__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 1.25rem;
}
.service-card {
  background: var(--black-card);
  border: 1px solid var(--black-border);
  border-radius: var(--radius-lg);
  padding: 2rem;
  position: relative;
  overflow: hidden;
  transition: border-color .3s, transform .3s, box-shadow .3s;
}
.service-card::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, transparent, var(--gold-dim), transparent);
  transition: background .3s;
}
.service-card:hover {
  border-color: rgba(201,168,76,0.3);
  transform: translateY(-4px);
  box-shadow: 0 16px 48px rgba(0,0,0,0.5), 0 0 30px var(--gold-glow);
}
.service-card:hover::before {
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
}
.service-card--signature {
  border-color: rgba(180,143,224,0.3);
}
.service-card--signature::before {
  background: linear-gradient(90deg, transparent, var(--lavender-dim), transparent);
}
.service-card--signature:hover {
  border-color: rgba(180,143,224,0.5);
  box-shadow: 0 16px 48px rgba(0,0,0,0.5), 0 0 30px var(--lavender-glow);
}
.service-card--signature:hover::before {
  background: linear-gradient(90deg, transparent, var(--lavender), transparent);
}
.service__badge {
  display: inline-block;
  font-size: .65rem; font-weight: 600; letter-spacing: .15em; text-transform: uppercase;
  padding: .25rem .75rem; border-radius: 999px;
  background: var(--lavender-glow); color: var(--lavender-light);
  border: 1px solid rgba(180,143,224,0.3);
  margin-bottom: .75rem;
}
.service__icon {
  font-size: 1.6rem; margin-bottom: .75rem; display: block;
}
.service__name {
  font-family: var(--font-display);
  font-size: 1.4rem; font-weight: 500;
  color: var(--white); margin-bottom: .5rem;
}
.service__desc { font-size: .875rem; color: var(--white-50); margin-bottom: 1.25rem; }
.service__prices { display: flex; flex-direction: column; gap: .4rem; }
.service__price-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: .45rem 0;
  border-bottom: 1px solid var(--black-border);
  font-size: .875rem;
}
.service__price-row:last-child { border-bottom: none; }
.service__price-label { color: var(--white-50); }
.service__price-amount { color: var(--gold); font-weight: 500; font-family: var(--font-display); font-size: 1rem; }
.services__deposit {
  text-align: center; margin-top: 2.5rem;
  font-size: .85rem; color: var(--white-50);
  padding: 1.25rem 2rem;
  border: 1px solid var(--black-border);
  border-radius: var(--radius);
  background: var(--black-card);
  max-width: 520px; margin-left: auto; margin-right: auto;
}
.services__deposit strong { color: var(--gold); }

/* ══════════════════════════════════════════
   FAQ
══════════════════════════════════════════ */
.faq { background: var(--black-soft); }
.faq__list { max-width: 760px; margin: 0 auto; display: flex; flex-direction: column; gap: .75rem; }
.faq__item {
  background: var(--black-card);
  border: 1px solid var(--black-border);
  border-radius: var(--radius);
  overflow: hidden;
  transition: border-color .3s;
}
.faq__item.open { border-color: rgba(180,143,224,0.3); }
.faq__q {
  display: flex; justify-content: space-between; align-items: center;
  padding: 1.2rem 1.5rem;
  cursor: pointer;
  font-weight: 500; color: var(--white);
  font-size: .95rem;
  gap: 1rem;
}
.faq__icon {
  width: 22px; height: 22px; border-radius: 50%;
  border: 1px solid var(--black-border);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  transition: all .3s;
  color: var(--lavender);
}
.faq__item.open .faq__icon { background: var(--lavender-glow); border-color: var(--lavender); transform: rotate(45deg); }
.faq__a {
  max-height: 0; overflow: hidden;
  transition: max-height .35s ease, padding .35s ease;
  color: var(--white-50); font-size: .9rem; line-height: 1.7;
}
.faq__a-inner { padding: 0 1.5rem 1.25rem; }
.faq__item.open .faq__a { max-height: 300px; }

/* ══════════════════════════════════════════
   CONTACT / BOOKING
══════════════════════════════════════════ */
.contact { background: var(--black); }
.square-booking-wrap {
  margin: 2.5rem auto 2rem;
  max-width: 900px;
  background: rgba(255,255,255,0.03);
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(201,168,76,0.2);
  box-shadow: 0 8px 40px rgba(0,0,0,0.4);
}
.square-booking-wrap iframe { display: block; min-height: 750px; }
.contact__socials {
  display: flex; gap: 1rem; flex-wrap: wrap; margin-top: 1.5rem;
}
.contact__socials--centered { justify-content: center; margin-top: 2rem; }
.social-btn {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .55rem 1.2rem;
  border: 1px solid var(--black-border);
  border-radius: 999px;
  font-size: .8rem; color: var(--white-50);
  transition: all .25s;
  background: var(--black-card);
}
.social-btn:hover { border-color: var(--lavender); color: var(--lavender-light); background: var(--lavender-glow); }

/* ─── PAYMENT BADGES ─── */
.payment-badges {
  display: flex; flex-wrap: wrap; justify-content: center;
  gap: .75rem; margin-top: 1.25rem;
}
.payment-badge {
  display: inline-flex; align-items: center; gap: .45rem;
  padding: .4rem .9rem;
  border: 1px solid rgba(201,168,76,0.3);
  border-radius: 999px;
  background: rgba(201,168,76,0.07);
  color: var(--white-80);
  font-size: .75rem; letter-spacing: .04em;
}

/* ══════════════════════════════════════════
   FOOTER
══════════════════════════════════════════ */
.footer {
  background: var(--black-soft);
  border-top: 1px solid var(--black-border);
  padding: 3rem 0 2rem;
}
.footer__inner {
  display: flex; flex-direction: column; align-items: center;
  gap: 1rem; text-align: center;
}
.footer__logo img { height: 56px; width: auto; margin-bottom: .5rem; }
.footer__copy {
  font-size: .8rem; color: var(--white-50);
  border-top: 1px solid var(--black-border);
  padding-top: 1.5rem; margin-top: 1rem;
  text-align: center;
}
.footer__copy a:hover { color: var(--gold); }
.footer__tagline {
  font-family: var(--font-display);
  font-style: italic;
  color: var(--gold);
  font-size: 1.05rem;
}

/* ══════════════════════════════════════════
   SCROLL REVEAL
══════════════════════════════════════════ */
.reveal {
  opacity: 0; transform: translateY(28px);
  transition: opacity .7s ease, transform .7s ease;
}
.reveal.visible { opacity: 1; transform: translateY(0); }

/* ══════════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════════ */
@media (max-width: 900px) {
  .about__wrap { grid-template-columns: 1fr; }
  .about__photos { max-width: 420px; margin: 0 auto; }
  .gallery__grid { columns: 2; }
  .nav__links { display: none; }
  .hamburger { display: flex; }
}
@media (max-width: 600px) {
  .gallery__grid { columns: 2; }
  .hero__mosaic { grid-template-columns: repeat(2,1fr); grid-template-rows: repeat(4,1fr); }
  .about__stats { flex-wrap: wrap; gap: 1.5rem; }
  .services__grid { grid-template-columns: 1fr; }
  .lightbox__prev { left: .5rem; }
  .lightbox__next { right: .5rem; }
  .hero__btns { flex-direction: column; align-items: center; }
}

/* ─── BOOKING CTA ─── */
.booking-cta {
  max-width: 600px;
  margin: 2rem auto;
  text-align: center;
  padding: 3rem 2rem;
  background: var(--black-card);
  border: 1px solid rgba(201,168,76,0.25);
  border-radius: var(--radius-lg);
  box-shadow: 0 8px 40px rgba(0,0,0,0.4), 0 0 60px var(--lavender-glow);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.25rem;
}
.booking-cta__note {
  font-size: .9rem;
  color: var(--white-50);
}
.booking-cta__btn {
  font-size: 1rem;
  padding: 1rem 2.5rem;
  letter-spacing: .08em;
}
.booking-cta__sub {
  font-size: .75rem;
  color: var(--white-20);
  letter-spacing: .05em;
}

/* Booking two-step options */
.booking-options {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
  width: 100%;
}
.booking-option {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .75rem;
  width: 100%;
}
.booking-option--primary .btn {
  font-size: 1.05rem;
  padding: 1.1rem 2.8rem;
}
.booking-option__label {
  font-size: .7rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--gold);
  font-weight: 600;
}
.booking-option__divider {
  font-family: var(--font-display);
  font-style: italic;
  font-size: 1.1rem;
  color: var(--white-50);
  padding: .25rem 0;
}

/* Deposit toast */
.deposit-toast {
  max-width: 500px;
  margin: 0 auto 1rem;
  padding: 1rem 1.5rem;
  border-radius: var(--radius);
  text-align: center;
  font-size: .9rem;
  font-weight: 500;
}
.deposit-toast--success {
  background: rgba(180, 143, 224, 0.15);
  border: 1px solid var(--lavender);
  color: var(--lavender);
}
.deposit-toast--cancel {
  background: rgba(201,168,76,0.08);
  border: 1px solid rgba(201,168,76,0.3);
  color: var(--gold-light);
}

/* ══════════════════════════════════════════
   BOOKING FORM
══════════════════════════════════════════ */
.booking-form-wrap {
  max-width: 640px;
  margin: 2rem auto 0;
}
.booking-form {
  background: var(--black-card);
  border: 1px solid rgba(201,168,76,0.25);
  border-radius: var(--radius-lg);
  padding: 2.5rem 2rem;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  box-shadow: 0 8px 40px rgba(0,0,0,0.4), 0 0 60px var(--lavender-glow);
}
.bform__row--2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
.bform__field {
  display: flex;
  flex-direction: column;
  gap: .4rem;
}
.bform__label {
  font-size: .72rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--gold);
  font-weight: 600;
}
.bform__input {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 8px;
  padding: .75rem 1rem;
  color: #fff;
  font-family: var(--font-body);
  font-size: .92rem;
  transition: border-color .2s ease;
  width: 100%;
}
.bform__input:focus {
  outline: none;
  border-color: rgba(201,168,76,0.6);
  background: rgba(255,255,255,0.06);
}
.bform__input::placeholder { color: rgba(255,255,255,0.25); }
.bform__select { cursor: pointer; }
.bform__select option { background: #1a1a1a; color: #fff; }
.bform__select optgroup { color: var(--gold); font-weight: 600; }
.bform__textarea { resize: vertical; min-height: 80px; }
.bform__deposit-note {
  display: flex;
  align-items: flex-start;
  gap: .6rem;
  background: rgba(201,168,76,0.06);
  border: 1px solid rgba(201,168,76,0.2);
  border-radius: 8px;
  padding: .85rem 1rem;
  font-size: .82rem;
  color: var(--white-80);
  line-height: 1.5;
}
.bform__deposit-note svg { flex-shrink: 0; margin-top: 2px; color: var(--gold); }
.bform__submit {
  width: 100%;
  padding: 1rem;
  font-size: .95rem;
  margin-top: .25rem;
  justify-content: center;
}
.bform__sub {
  font-size: .72rem;
  color: var(--white-20);
  text-align: center;
  letter-spacing: .06em;
}
/* Input date color fix */
input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(1) opacity(0.4);
}

@media (max-width: 600px) {
  .bform__row--2 { grid-template-columns: 1fr; }
  .booking-form { padding: 1.75rem 1.25rem; }
}

/* ══════════════════════════════════════════
   BOOKING APP (MULTI-STEP)
══════════════════════════════════════════ */
/* Progress */
.bk-progress { display:flex; align-items:center; justify-content:center; gap:0; margin-bottom:2rem; flex-wrap:nowrap; overflow-x:auto; padding:.5rem 0; }
.bk-step { display:flex; flex-direction:column; align-items:center; gap:.3rem; min-width:60px; }
.bk-step__num { width:28px; height:28px; border-radius:50%; border:2px solid rgba(255,255,255,0.15); display:flex; align-items:center; justify-content:center; font-size:.75rem; font-weight:600; color:rgba(255,255,255,0.3); transition:all .3s; }
.bk-step.active .bk-step__num { border-color:var(--gold); color:var(--gold); background:rgba(201,168,76,0.1); }
.bk-step.done .bk-step__num { border-color:var(--gold); background:var(--gold); color:#000; }
.bk-step__label { font-size:.65rem; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,0.3); }
.bk-step.active .bk-step__label { color:var(--gold); }
.bk-step.done .bk-step__label { color:rgba(255,255,255,0.5); }
.bk-line { flex:1; height:2px; background:rgba(255,255,255,0.08); min-width:20px; max-width:60px; }
.bk-line.done { background:var(--gold); }

/* Panel */
.bk-panel { background:var(--black-card); border:1px solid rgba(201,168,76,0.2); border-radius:var(--radius-lg); padding:2rem 1.75rem; }
.bk-title { font-family:var(--font-display); font-size:1.6rem; color:var(--gold); margin-bottom:.25rem; }
.bk-subtitle { font-size:.85rem; color:rgba(255,255,255,0.5); margin-bottom:1.25rem; }
.bk-subtitle strong { color:#fff; }

/* Service cards */
.bk-category { margin-bottom:1.5rem; }
.bk-cat-label { font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; color:var(--lavender); font-weight:600; margin-bottom:.6rem; }
.bk-service-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(150px,1fr)); gap:.5rem; }
.bk-service-card { background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.08); border-radius:10px; padding:.75rem; text-align:left; cursor:pointer; transition:all .2s; display:flex; flex-direction:column; gap:.2rem; }
.bk-service-card:hover { border-color:rgba(201,168,76,0.4); background:rgba(201,168,76,0.04); }
.bk-service-card.selected { border-color:var(--gold); background:rgba(201,168,76,0.08); }
.bk-svc-name { font-size:.82rem; font-weight:500; color:#fff; line-height:1.3; }
.bk-svc-price { font-size:.9rem; color:var(--gold); font-weight:600; }
.bk-svc-dur { font-size:.7rem; color:rgba(255,255,255,0.35); }

/* Calendar */
.bk-cal { margin-bottom:1.5rem; }
.bk-cal__header { display:flex; align-items:center; justify-content:space-between; margin-bottom:.75rem; }
.bk-cal__month { font-family:var(--font-display); font-size:1.15rem; color:var(--gold); }
.bk-cal__nav { background:transparent; border:1px solid rgba(255,255,255,0.1); color:#fff; border-radius:6px; width:30px; height:30px; cursor:pointer; font-size:1.1rem; display:flex; align-items:center; justify-content:center; }
.bk-cal__days { display:grid; grid-template-columns:repeat(7,1fr); text-align:center; margin-bottom:.4rem; }
.bk-cal__days span { font-size:.68rem; color:rgba(255,255,255,0.3); padding:.2rem 0; }
.bk-cal__grid { display:grid; grid-template-columns:repeat(7,1fr); gap:3px; }
.bk-cal__cell { aspect-ratio:1; border-radius:6px; display:flex; align-items:center; justify-content:center; font-size:.8rem; border:1px solid transparent; cursor:pointer; transition:all .15s; background:transparent; color:rgba(255,255,255,0.6); }
.bk-cal__cell.empty { cursor:default; }
.bk-cal__cell.unavailable { color:rgba(255,255,255,0.15); cursor:not-allowed; }
.bk-cal__cell.available:hover { background:rgba(201,168,76,0.1); border-color:rgba(201,168,76,0.3); color:#fff; }
.bk-cal__cell.selected { background:var(--gold); color:#000; font-weight:700; }

/* Time slots */
.bk-times { margin-bottom:1.5rem; }
.bk-times__label { font-size:.75rem; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,0.4); margin-bottom:.6rem; }
.bk-times__grid { display:flex; flex-wrap:wrap; gap:.4rem; }
.bk-time-btn { background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.1); border-radius:8px; color:#fff; padding:.45rem .9rem; font-size:.82rem; cursor:pointer; transition:all .2s; }
.bk-time-btn:hover { border-color:rgba(201,168,76,0.4); background:rgba(201,168,76,0.06); }
.bk-time-btn.selected { background:rgba(201,168,76,0.15); border-color:var(--gold); color:var(--gold); font-weight:600; }
.bk-no-slots { font-size:.82rem; color:rgba(255,255,255,0.35); font-style:italic; }

/* Summary chip */
.bk-summary-chip { display:inline-flex; align-items:center; gap:.5rem; background:rgba(201,168,76,0.08); border:1px solid rgba(201,168,76,0.2); border-radius:999px; padding:.35rem 1rem; font-size:.78rem; color:rgba(255,255,255,0.7); margin-bottom:1.25rem; flex-wrap:wrap; }
.bk-summary-chip span:not(.chip-dot) { color:#fff; }
.chip-dot { color:rgba(255,255,255,0.25); }

/* Confirm card */
.bk-confirm-card { background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.08); border-radius:12px; padding:1.25rem; margin:1rem 0; }
.bk-confirm-row { display:flex; justify-content:space-between; align-items:flex-start; padding:.5rem 0; border-bottom:1px solid rgba(255,255,255,0.05); font-size:.85rem; }
.bk-confirm-row:last-child { border-bottom:none; }
.bk-confirm-row span { color:rgba(255,255,255,0.45); }
.bk-confirm-row strong { text-align:right; max-width:60%; }
.bk-confirm-deposit { padding-top:.75rem; margin-top:.25rem; }
.bk-confirm-deposit span { font-weight:600; color:rgba(255,255,255,0.7); }
.bk-confirm-deposit .gold { color:var(--gold); font-size:1.1rem; }
.bk-confirm-note { font-size:.78rem; color:rgba(255,255,255,0.35); margin-bottom:.75rem; }
.bk-deposit-policy { background:rgba(201,168,76,0.08); border:1px solid rgba(201,168,76,0.2); border-radius:8px; padding:1rem 1.1rem; margin-bottom:1.25rem; }
.bk-deposit-policy strong { display:block; color:var(--gold); font-size:.78rem; letter-spacing:.06em; text-transform:uppercase; margin-bottom:.4rem; }
.bk-deposit-policy p { font-size:.78rem; color:rgba(255,255,255,0.55); margin:0; line-height:1.55; }

/* Nav buttons */
.bk-nav { display:flex; gap:.75rem; align-items:center; margin-top:1.25rem; }
.bk-nav .bk-back { font-size:.82rem; }
.bk-nav .bk-next { flex:1; justify-content:center; }
.bk-next:disabled { opacity:.4; cursor:not-allowed; }

@media (max-width:500px) {
  .bk-panel { padding:1.5rem 1rem; }
  .bk-service-grid { grid-template-columns:1fr 1fr; }
  .bk-nav { flex-direction:column-reverse; }
  .bk-nav .bk-next, .bk-nav .bk-back { width:100%; justify-content:center; }
}

/* ── Multi-service cart ── */
.bk-svc-check { font-size:.75rem; color:var(--gold); font-weight:700; margin-top:.15rem; }
.bk-service-card.selected .bk-svc-check { display:inline; }

/* Cart summary bar (below service grid) */
.bk-cart-bar { background:rgba(201,168,76,0.08); border:1px solid rgba(201,168,76,0.25); border-radius:10px; padding:.75rem 1rem; margin-top:1rem; display:none; flex-direction:column; gap:.5rem; }
.bk-cart-bar.visible { display:flex; }
.bk-cart-items { display:flex; flex-wrap:wrap; gap:.4rem; }
.bk-cart-chip { background:rgba(201,168,76,0.12); border:1px solid rgba(201,168,76,0.3); border-radius:20px; padding:.2rem .65rem; font-size:.78rem; color:rgba(255,255,255,0.85); }
.bk-cart-chip em { color:var(--gold); font-style:normal; margin-left:.3rem; }
.bk-cart-totals { display:flex; justify-content:flex-end; gap:1rem; font-size:.85rem; font-weight:600; }
.bk-cart-dur { color:rgba(255,255,255,0.5); }
.bk-cart-price { color:var(--gold); }

/* Step 2 duration label */
.bk-dur-total { color:var(--gold); font-weight:600; }

/* Confirm card — multi-service additions */
.bk-confirm-section-label { font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,0.35); margin-bottom:.25rem; padding:.5rem 0 0; }
.bk-confirm-divider { border:none; border-top:1px solid rgba(255,255,255,0.06); margin:.35rem 0; }
.bk-confirm-svc-row { background:rgba(255,255,255,0.02); }
.bk-confirm-subtotal { border-top:1px solid rgba(255,255,255,0.1); }
.bk-confirm-subtotal span { font-weight:600; color:rgba(255,255,255,0.7); }
.bk-confirm-balance { font-size:.82rem; }
.bk-confirm-balance span { color:rgba(255,255,255,0.4); }
.bk-confirm-balance strong { color:rgba(255,255,255,0.55); }

/* ── Braids — feed-in picker & weekday note ── */
.bk-cat-note { font-size:.72rem; color:var(--gold); letter-spacing:.06em; margin-bottom:.5rem; opacity:.85; }
.bk-feedin-picker { background:rgba(201,168,76,0.06); border:1px solid rgba(201,168,76,0.2); border-radius:10px; padding:.75rem 1rem; margin:.35rem 0 .5rem; width:100%; }
.bk-feedin-label { font-size:.75rem; color:rgba(255,255,255,0.55); margin-bottom:.5rem; }
.bk-feedin-controls { display:flex; align-items:center; gap:.75rem; }
.bk-qty-btn { width:34px; height:34px; border-radius:50%; background:rgba(201,168,76,0.15); border:1px solid rgba(201,168,76,0.35); color:var(--gold); font-size:1.1rem; font-weight:700; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .15s; }
.bk-qty-btn:hover { background:rgba(201,168,76,0.3); }
.bk-qty-val { font-size:1.25rem; font-weight:700; color:#fff; min-width:2ch; text-align:center; }
.bk-feedin-calc { margin-top:.5rem; font-size:.8rem; color:rgba(255,255,255,0.6); }
.bk-feedin-calc strong { color:var(--gold); }
.bk-feedin-note { color:#f0a020; }

.bk-svc-hair-note { font-size:.65rem; color:rgba(255,255,255,0.4); font-style:italic; margin-top:.1rem; }

/* ── Step 4: ID & Selfie Upload ── */
.bk-id-notice { display:flex; align-items:flex-start; gap:.6rem; background:rgba(201,168,76,0.07); border:1px solid rgba(201,168,76,0.2); border-radius:10px; padding:.75rem 1rem; font-size:.82rem; color:rgba(255,255,255,0.55); margin:.75rem 0 1.25rem; }
.bk-id-notice svg { flex-shrink:0; color:var(--gold); margin-top:.1rem; }
.bk-id-uploads { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
@media(max-width:480px) { .bk-id-uploads { grid-template-columns:1fr; } }
.bk-id-box { border:2px dashed rgba(201,168,76,0.3); border-radius:14px; padding:1.5rem 1rem; cursor:pointer; transition:border-color .2s, background .2s; text-align:center; position:relative; overflow:hidden; }
.bk-id-box:hover { border-color:rgba(201,168,76,0.6); background:rgba(201,168,76,0.05); }
.bk-id-box.uploaded { border-style:solid; border-color:rgba(201,168,76,0.5); background:rgba(201,168,76,0.06); }
.bk-id-label { display:flex; flex-direction:column; align-items:center; gap:.5rem; cursor:pointer; pointer-events:none; }
.bk-id-label svg { color:rgba(201,168,76,0.6); }
.bk-id-label span:first-of-type { font-size:.85rem; font-weight:600; color:rgba(255,255,255,0.8); }
.bk-id-hint { font-size:.72rem; color:rgba(255,255,255,0.4); }
.bk-id-preview { width:100%; height:100px; object-fit:cover; border-radius:8px; margin-top:.75rem; display:block; }

/* Gallery video item */
.gallery__item--video { position: relative; overflow: hidden; }
.gallery__video {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}
.gallery__overlay--video {
  background: linear-gradient(to top, rgba(0,0,0,0.6) 0%, transparent 60%);
}
