/* Velocity Cutz storefront — isolated premium presentation layer. */
.storefront-body {
  --vc-ink: #10110f;
  --vc-ink-soft: #20221f;
  --vc-paper: #f7f3eb;
  --vc-paper-deep: #eee8dc;
  --vc-white: #fffdf8;
  --vc-brass: #c99b45;
  --vc-brass-light: #e8c87b;
  --vc-muted: #716d65;
  --vc-line: rgba(16, 17, 15, 0.12);
  --vc-serif: Georgia, "Times New Roman", serif;
  --vc-sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: var(--vc-paper);
  color: var(--vc-ink);
  font-family: var(--vc-sans);
  -webkit-font-smoothing: antialiased;
}

.storefront-body h1,
.storefront-body h2,
.storefront-body h3,
.storefront-body p { text-wrap: pretty; }

.vc-container { width: min(calc(100% - 64px), 1280px); }

.vc-topbar {
  background: #0b0c0b;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.vc-topbar-inner {
  min-height: 36px;
  justify-content: flex-end;
  gap: 1.7rem;
}

.vc-topbar-item {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  color: rgba(255, 255, 255, 0.72) !important;
  font-size: 0.7rem;
  letter-spacing: 0.04em;
}

.vc-topbar-item:first-child { margin-right: auto; }
.vc-topbar-item svg,
.vc-line-icon svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.65;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.storefront-header { top: 36px; background: linear-gradient(180deg, rgba(8, 9, 8, 0.86), transparent); }
.storefront-header-inner {
  width: min(calc(100% - 64px), 1280px);
  min-height: 96px;
  grid-template-columns: 180px 1fr 78px;
}

.storefront-brand img { width: 136px; height: 62px; }
.storefront-nav { gap: clamp(1rem, 2.2vw, 2.25rem); }
.storefront-nav a {
  padding-block: 0.6rem;
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.12em;
}
.storefront-nav a::after { height: 1px; }

.vc-staff-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-height: 34px;
  padding: 0.65rem 0.7rem;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
  color: rgba(255, 255, 255, 0.86);
  font-size: 0.64rem;
  letter-spacing: 0.1em;
  line-height: 1;
  text-align: center;
  backdrop-filter: blur(8px);
}
.vc-staff-button:hover { border-color: var(--vc-brass-light); color: var(--vc-brass-light); }

.vc-menu-toggle {
  width: 42px;
  height: 42px;
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 50%;
}
.vc-menu-toggle span { display: block; width: 100%; height: 1px; margin: 4px 0; background: #fff; }

.vc-hero,
.vc-hero-inner { min-height: min(860px, calc(100dvh - 36px)); }
.vc-hero-background { filter: saturate(0.84) contrast(1.04); }
.vc-hero::after {
  background:
    linear-gradient(90deg, rgba(7, 8, 7, 0.94) 0%, rgba(7, 8, 7, 0.76) 42%, rgba(7, 8, 7, 0.12) 74%),
    linear-gradient(0deg, rgba(7, 8, 7, 0.42), transparent 34%);
}
.vc-hero-inner { padding-top: 110px; }
.storefront-hero-copy { max-width: 690px; gap: 1.55rem; }
.storefront-hero .storefront-eyebrow {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  color: var(--vc-brass-light);
  font-size: 0.7rem;
  letter-spacing: 0.18em;
}
.storefront-hero .storefront-eyebrow > span { width: 36px; height: 1px; background: var(--vc-brass); }
.storefront-hero h1 {
  max-width: 10.8ch;
  font-family: var(--vc-serif);
  font-size: clamp(4rem, 6.4vw, 6.75rem);
  font-weight: 400;
  line-height: 0.91;
  letter-spacing: -0.055em;
}
.storefront-hero h1 em { display: block; margin-top: 0.12em; color: var(--vc-brass-light); }
.storefront-hero-intro {
  max-width: 47ch;
  color: rgba(255, 255, 255, 0.72);
  font-size: 1.02rem;
  line-height: 1.7;
}
.storefront-hero-actions { gap: 0.8rem; margin-top: 0.25rem; }
.storefront-button {
  min-height: 52px;
  padding: 0.95rem 1.35rem;
  border: 1px solid transparent;
  border-radius: 3px;
  background: var(--vc-brass-light);
  font-size: 0.7rem;
  letter-spacing: 0.12em;
  box-shadow: none;
}
.storefront-button:hover { background: #f2d99b; transform: translateY(-2px); }
.storefront-button--whatsapp { border-color: rgba(255,255,255,.32); background: rgba(255,255,255,.04); }
.storefront-button--whatsapp:hover { border-color: #fff; background: rgba(255,255,255,.1); color: #fff; }
.vc-rating { gap: 0.65rem; padding-top: 0.7rem; border-top: 1px solid rgba(255,255,255,.14); width: fit-content; }
.vc-rating-mark { display: grid; place-items: center; width: 25px; height: 25px; border: 1px solid var(--vc-brass); border-radius: 50%; color: var(--vc-brass-light); font-size: .7rem; }
.vc-rating strong { font-size: .76rem; letter-spacing: .04em; }
.vc-rating small { padding-left: .65rem; border-left: 1px solid rgba(255,255,255,.18); }

.vc-quick-info { position: relative; z-index: 2; background: var(--vc-white); }
.vc-quick-info > .vc-container { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.vc-quick-info div,
.vc-quick-info a { min-height: 88px; padding: 1rem 1.4rem; border-color: var(--vc-line); }
.vc-quick-info a { transition: background .2s ease; }
.vc-quick-info a:hover { background: #f4eee3; }
.vc-line-icon { display: grid; flex: 0 0 42px; place-items: center; width: 42px; height: 42px; border: 1px solid #dbc99f; border-radius: 50%; color: #a87826 !important; }
.vc-line-icon svg { width: 19px; height: 19px; }
.vc-quick-info small { color: #8b8172; letter-spacing: .13em; }
.vc-quick-info strong { font-size: .78rem; }

.vc-benefits { background: var(--vc-ink); }
.vc-benefits article { min-height: 96px; padding: 1.2rem 1.6rem; }
.vc-benefits article > span { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid rgba(232,200,123,.42); border-radius: 50%; font-family: var(--vc-serif); font-size: 1rem; }
.vc-benefits strong { font-size: .68rem; letter-spacing: .1em; }
.vc-benefits small { font-size: .72rem; }

.storefront-section { padding-top: clamp(5rem, 8vw, 8rem); padding-bottom: clamp(5rem, 8vw, 8rem); }
.storefront-section-heading { align-items: end; margin-bottom: 3rem; }
.storefront-section-heading h2,
.vc-about-copy h2,
.storefront-booking-intro h2,
.storefront-visit h2 {
  font-family: var(--vc-serif);
  font-weight: 400;
  letter-spacing: -.035em;
}
.storefront-section-heading h2 { max-width: 15ch; font-size: clamp(2.7rem, 4.8vw, 4.7rem); line-height: .98; }
.storefront-section-heading > a { color: #8c651e; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; }
.storefront-eyebrow { color: #9a6d18; letter-spacing: .16em; }

.storefront-service-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.4rem; }
.storefront-service-card { border: 0; border-radius: 4px; background: var(--vc-white); box-shadow: 0 18px 48px rgba(35,28,17,.08); }
.storefront-service-image,
.storefront-service-image > img { height: 310px; min-height: 310px; }
.storefront-service-image::after { content: ""; position: absolute; inset: auto 0 0; height: 45%; background: linear-gradient(transparent, rgba(0,0,0,.45)); pointer-events: none; }
.storefront-service-image > img { transition: transform .7s cubic-bezier(.2,.75,.25,1); }
.storefront-service-card:hover .storefront-service-image > img { transform: scale(1.035); }
.storefront-service-content { padding: 1.35rem 1.4rem 1.5rem; gap: 1rem; }
.storefront-service-content h3 { font-family: var(--vc-serif); font-size: 1.55rem; font-weight: 400; }
.storefront-service-content p { color: var(--vc-muted); line-height: 1.6; }
.storefront-service-meta { border-block: 1px solid var(--vc-line); }
.storefront-service-meta div { padding: .7rem 0; }
.storefront-service-meta dt { color: #8c8478; font-size: .6rem; letter-spacing: .12em; text-transform: uppercase; }
.storefront-service-meta dd { color: #8d641b; font-size: .82rem; }
.storefront-card-link { padding-top: .25rem; color: var(--vc-ink); font-size: .68rem; letter-spacing: .09em; text-transform: uppercase; }
.vc-service-category { z-index: 2; border: 1px solid rgba(255,255,255,.24); border-radius: 2px; backdrop-filter: blur(8px); }
.vc-swipe-cue { display: none; }

.vc-about { padding: clamp(5rem, 8vw, 8rem) 0; background: #111310; }
.vc-about-grid { gap: 2.5rem; }
.vc-about-copy h2 { font-size: clamp(2.4rem, 3.7vw, 4rem); line-height: .98; }
.vc-about-image { height: 400px; border-radius: 3px; filter: saturate(.82); }
.vc-about-stats strong { color: var(--vc-brass-light); font-size: 2.8rem; }
.vc-book-card { border: 1px solid rgba(255,255,255,.2); border-radius: 3px; background: var(--vc-brass); }

.storefront-team-card,
.storefront-review-card,
.storefront-package-card,
.storefront-promotion-card { border-radius: 4px; }
.storefront-team-photo img { filter: saturate(.86); }
.storefront-review-card { box-shadow: 0 18px 50px rgba(35,28,17,.07); }

.storefront-booking-section { padding-top: clamp(5rem, 8vw, 8rem); padding-bottom: clamp(5rem, 8vw, 8rem); background: var(--vc-paper-deep); }
.storefront-booking-intro h2 { font-size: clamp(2.8rem, 4vw, 4.5rem); line-height: .98; }
.storefront-booking-card { overflow: hidden; border: 1px solid rgba(80,65,39,.13); border-radius: 5px; box-shadow: 0 24px 70px rgba(48,37,20,.1); }
.storefront-booking-card-header { background: var(--vc-ink); }
.storefront-booking-form input,
.storefront-booking-form select,
.storefront-booking-form textarea { border-radius: 3px; background: #fbf9f4; }

.storefront-visit { background: #10120f; }
.storefront-location-card,
.storefront-hours-card,
.vc-map-panel { border-radius: 4px; background: #191b18; }
.storefront-footer { background: #090a09; }
.storefront-floating-whatsapp { border: 1px solid rgba(255,255,255,.25); box-shadow: 0 16px 45px rgba(14,100,56,.28); }

@media (max-width: 1100px) {
  .storefront-service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .storefront-header-inner { grid-template-columns: 145px 1fr 68px; }
  .storefront-nav { gap: .85rem; }
}

@media (max-width: 820px) {
  .vc-container,
  .storefront-header-inner { width: min(calc(100% - 40px), 1280px); }
  .vc-topbar-inner .vc-topbar-item:nth-child(2) { display: none; }
  .storefront-header { top: 36px; }
  .storefront-header-inner { min-height: 78px; }
  .storefront-nav { top: 72px; border-radius: 4px; background: rgba(12,13,12,.98); }
  .storefront-nav a { font-size: .74rem; }
  .vc-hero,
  .vc-hero-inner { min-height: 760px; }
  .vc-hero-inner { align-items: flex-end; padding-top: 130px; padding-bottom: 3.5rem; }
  .vc-hero::after { background: linear-gradient(180deg, rgba(7,8,7,.15), rgba(7,8,7,.84) 62%, #070807); }
  .storefront-hero-copy { padding: 0; background: transparent; backdrop-filter: none; }
  .storefront-hero h1 { font-size: clamp(3.6rem, 10vw, 5rem); }
  .vc-quick-info > .vc-container { grid-template-columns: 1fr 1fr; }
  .vc-quick-info div:nth-child(2), .vc-quick-info a:nth-child(2) { border-right: 0; }
}

@media (max-width: 560px) {
  .vc-container,
  .storefront-header-inner { width: min(calc(100% - 28px), 1280px); }
  .vc-topbar-inner { min-height: 38px; }
  .vc-topbar-inner .vc-topbar-item:first-child { display: inline-flex; max-width: none; font-size: .64rem; }
  .vc-topbar-inner .vc-topbar-item:first-child::after { content: none; }
  .vc-topbar-inner .vc-topbar-item:last-child { display: none; }
  .storefront-header { top: 38px; }
  .storefront-header-inner { min-height: 70px; }
  .storefront-brand img { width: 104px; height: 48px; }
  .vc-staff-button { height: 34px; padding: 0 .6rem; font-size: .56rem; line-height: 1; }
  .vc-menu-toggle { flex-basis: 38px; width: 38px; height: 38px; }
  .vc-hero,
  .vc-hero-inner { min-height: min(640px, calc(100svh - 38px)); }
  .vc-hero-inner { box-sizing: border-box; padding-top: 108px; padding-bottom: 1.5rem; }
  .vc-hero-background { object-position: 66% center; }
  .storefront-hero h1 { max-width: 11ch; font-size: clamp(2.8rem, 13vw, 3.8rem); }
  .storefront-hero-intro { max-width: 36ch; font-size: .88rem; line-height: 1.55; }
  .storefront-hero-actions { width: 100%; }
  .storefront-hero-actions .storefront-button { width: 100%; }
  .vc-rating { width: 100%; }
  .vc-rating small { flex-basis: auto; font-size: .65rem; }
  .vc-quick-info > .vc-container { width: 100%; }
  .vc-quick-info div,
  .vc-quick-info a { min-height: 82px; padding: .75rem; gap: .6rem; }
  .vc-line-icon { flex-basis: 34px; width: 34px; height: 34px; }
  .vc-line-icon svg { width: 16px; height: 16px; }
  .vc-benefits article { min-height: 112px; }
  .storefront-section { padding-inline: 14px; }
  .storefront-section-heading { align-items: start; margin-bottom: 2rem; }
  .storefront-section-heading h2 { font-size: 2.65rem; }
  .vc-swipe-cue {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .55rem;
    margin: -1rem 0 1rem;
    color: #8c651e;
    font-size: .65rem;
    font-weight: 750;
    letter-spacing: .1em;
    text-transform: uppercase;
  }
  .vc-swipe-cue svg { width: 38px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
  .storefront-service-grid { display: flex; gap: 1rem; }
  .storefront-service-card { min-width: 86vw; }
  .storefront-service-image,
  .storefront-service-image > img { height: 270px; min-height: 270px; }
  .vc-about { padding-inline: 14px; }
  .vc-about-image { height: 300px; }
}

@media (max-width: 360px) {
  .vc-quick-info > .vc-container { grid-template-columns: 1fr; }
  .vc-quick-info div,
  .vc-quick-info a { min-height: 70px; border-right: 0; border-bottom: 1px solid var(--vc-line); }
  .vc-quick-info a:last-child { border-bottom: 0; }
  .storefront-hero h1 { font-size: clamp(2.55rem, 13vw, 3.15rem); }
  .storefront-hero-copy { gap: 1.15rem; }
}

@media (prefers-reduced-motion: reduce) {
  .storefront-service-image > img,
  .storefront-button { transition: none; }
  .storefront-service-card:hover .storefront-service-image > img,
  .storefront-button:hover { transform: none; }
}
