:root {
  --c1: #e8098d;
  --c2: #1a9a91;
  --c3: #ffffff;
  --seed-ink: #e8098d;
  --seed-paper: #ffffff;
  --ink: #243047;
  --paper: var(--seed-paper);
  --accent: var(--c2);
  --on-accent: #ffffff;
  --brand-pink: var(--c1);
  --brand-teal: var(--c2);
  --display: "Fraunces", "Segoe UI", sans-serif;
  --text: "Figtree", "Segoe UI", sans-serif;
  --muted: color-mix(in srgb, var(--ink) 68%, transparent);
  --page-max: 1120px;
  --page-pad: max(1rem, calc((100vw - min(var(--page-max), 100vw - 2rem)) / 2));
}

.look-maker,
.look-workshop,
.look-barber,
.look-showcase,
.look-fitness {
  --ink: var(--seed-paper);
  --paper: var(--seed-ink);
  --muted: color-mix(in srgb, var(--ink) 74%, transparent);
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  scroll-behavior: smooth;
  overflow-x: clip;
}

@media (min-width: 800px) {
  html {
    scroll-padding-top: 14.5rem;
  }
}

html.photo-zoom-open,
html.photo-zoom-restoring {
  scroll-behavior: auto;
}

body {
  font-family: var(--text);
  color: var(--ink);
  background: var(--paper);
  line-height: 1.5;
  overflow-wrap: anywhere;
}

img,
svg,
video {
  max-width: 100%;
  height: auto;
  display: block;
}

a {
  color: inherit;
  text-decoration: none;
}

.top-scroll-spacer {
  display: none;
  width: 100%;
  pointer-events: none;
}

.top {
  position: sticky;
  top: 0;
  z-index: 10;
  display: grid;
  grid-template-columns: auto 1fr min(28rem, 64vw);
  grid-template-rows: auto auto;
  column-gap: 1rem;
  row-gap: 0.22rem;
  align-items: start;
  padding: 0.5rem var(--page-pad) 0.55rem;
  background: color-mix(in srgb, var(--paper) 88%, transparent);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid color-mix(in srgb, var(--ink) 12%, transparent);
}

.top-center {
  grid-column: 2;
  grid-row: 1 / 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 0.55rem;
  align-self: stretch;
  min-width: 0;
  padding-top: 0.05rem;
}

.top-tagline {
  margin: 0.45rem 0 0;
  padding: 0 0.35rem;
  text-align: center;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  line-height: 1.15;
  color: var(--brand-pink);
}

.top-social {
  display: flex;
  flex: 1;
  flex-wrap: wrap;
  align-items: center;
  align-content: center;
  justify-content: center;
  gap: 0.7rem;
  width: 100%;
  margin: 0;
  padding: 0 0.25rem 0.35rem;
}

.top-social a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  min-height: 44px;
  min-width: 44px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  color: #fff;
  background: linear-gradient(145deg, var(--brand-pink), color-mix(in srgb, var(--brand-pink) 78%, #000));
  box-shadow:
    0 1px 2px rgb(36 48 71 / 10%),
    0 0 0 1px color-mix(in srgb, var(--brand-pink) 35%, transparent);
  transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease;
}

.top-social svg {
  display: block;
  width: 1.28rem;
  height: 1.28rem;
  fill: currentColor;
}

.top-social a:hover,
.top-social a:focus-visible {
  transform: translateY(-1px);
  filter: brightness(1.05);
  box-shadow:
    0 4px 10px rgb(232 9 141 / 22%),
    0 0 0 1px color-mix(in srgb, var(--brand-pink) 55%, transparent);
  text-decoration: none;
}

.top-social a:focus-visible {
  outline: 2px solid var(--brand-pink);
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  .top-social a {
    transition: none;
  }

  .top-social a:hover,
  .top-social a:focus-visible {
    transform: none;
  }
}

.brand {
  grid-column: 1;
  grid-row: 1;
  align-self: start;
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  min-width: 0;
  font-weight: 700;
  letter-spacing: -0.03em;
}

.brand span {
  min-width: 0;
}

.brand img {
  display: block;
  width: auto;
  height: clamp(5.75rem, 13vw, 8.5rem);
  max-width: min(100%, 17rem);
  object-fit: contain;
  object-position: top left;
  border-radius: 0;
  background: transparent;
}

.stable-nav {
  grid-column: 3;
  grid-row: 1 / 3;
  display: flex;
  align-items: flex-start;
  gap: 0.45rem;
  width: min(28rem, 64vw);
  margin: 0;
  align-self: start;
}

.stable-nav a {
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  align-items: center;
  gap: 0.22rem;
  min-width: 0;
  color: var(--brand-pink);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.15;
  text-align: center;
}

.stable-nav img {
  width: 100%;
  height: auto;
  object-fit: contain;
  border-radius: 0.28rem;
}

.stable-nav a span {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  width: 100%;
  padding: 0 0.1rem;
}

.stable-nav a:hover span,
.stable-nav a:focus-visible span {
  text-decoration: underline;
  text-underline-offset: 0.14rem;
}

.stable-nav a:focus-visible img,
.stable-nav a:focus-visible span {
  outline: 2px solid var(--brand-pink);
  outline-offset: 2px;
}

.cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0.72rem 1.1rem;
  border-radius: 999px;
  color: var(--on-accent);
  background: var(--accent);
  font-weight: 700;
}

main {
  width: min(var(--page-max), calc(100% - 2rem));
  margin: 0 auto;
  padding: 0 0 3rem;
}

section {
  padding: 2.6rem 0;
}

.hero {
  min-height: 86vh;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 0.7rem;
  margin-inline: calc(50% - 50vw);
  padding: 6rem 1.2rem 2.2rem;
  color: #f7f4ef;
  background:
    linear-gradient(to top, rgb(0 0 0 / 78%), rgb(0 0 0 / 18%)),
    var(--hero) center / cover no-repeat;
}

.look-trade .hero,
.look-trust .hero,
.look-clean .hero,
.look-studio .hero {
  min-height: 0;
  margin-inline: 0;
  padding: 3.2rem 0 1rem;
  color: var(--ink);
  background: none;
}

.eyebrow {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--accent);
}

h1 {
  max-width: 16ch;
  font-family: var(--display);
  font-size: clamp(2.4rem, 8vw, 5.4rem);
  font-weight: 650;
  letter-spacing: -0.045em;
  line-height: 0.95;
}

.lede,
#about p,
#contact p,
.hours,
#products > p {
  max-width: 38rem;
  color: var(--muted);
  font-size: 1.05rem;
}

.hero .lede {
  color: rgb(247 244 239 / 82%);
}

.look-trade .hero .lede,
.look-trust .hero .lede,
.look-clean .hero .lede,
.look-studio .hero .lede {
  color: var(--muted);
}

.reel {
  position: relative;
  width: 100vw;
  max-width: 100vw;
  margin: 1.1rem calc(50% - 50vw) 0;
  overflow: hidden;
  touch-action: pan-y;
  cursor: grab;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
}

.reel.reel--dragging {
  cursor: grabbing;
  user-select: none;
}

.reel-track {
  display: flex;
  width: max-content;
  will-change: transform;
}

.reel-arrow {
  position: absolute;
  top: 50%;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  min-width: 44px;
  min-height: 44px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  color: var(--brand-pink);
  background: rgb(255 255 255 / 92%);
  box-shadow: 0 2px 10px rgb(36 48 71 / 16%);
  transform: translateY(-50%);
  cursor: pointer;
  touch-action: none;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease, transform 0.2s ease, background 0.2s ease;
}

.reel-arrow--prev {
  left: max(0.45rem, calc(50% - 50vw + 0.45rem));
}

.reel-arrow--next {
  right: max(0.45rem, calc(50% - 50vw + 0.45rem));
}

.reel:hover .reel-arrow,
.reel:focus-within .reel-arrow {
  opacity: 1;
  pointer-events: auto;
}

.reel-arrow:hover,
.reel-arrow:focus-visible {
  background: #fff;
  transform: translateY(-50%) scale(1.04);
}

.reel-arrow:focus-visible {
  outline: 2px solid var(--brand-pink);
  outline-offset: 2px;
}

.reel-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.reel-photo {
  display: block;
  padding: 0;
  border: 0;
  background: transparent;
  line-height: 0;
  cursor: pointer;
  min-height: 44px;
}

.reel-photo img {
  display: block;
  width: auto;
  max-width: none;
  height: clamp(9.25rem, 22vw, 15.5rem);
  object-fit: contain;
  border-radius: 0.35rem;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--ink) 12%, transparent);
}

.reel-photo:focus-visible {
  outline: 2px solid var(--brand-pink);
  outline-offset: 3px;
}

@media (hover: none) {
  .reel-arrow {
    opacity: 0.92;
    pointer-events: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  .reel {
    overflow-x: auto;
    -webkit-mask-image: none;
    mask-image: none;
  }

  .reel-row[aria-hidden="true"] {
    display: none;
  }

  .reel-arrow {
    opacity: 1;
    pointer-events: auto;
  }
}

h2 {
  margin-bottom: 1rem;
  font-family: var(--display);
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  letter-spacing: -0.04em;
  line-height: 1;
}

.cards {
  display: grid;
  gap: 0.75rem;
  list-style: none;
}

.cards li {
  padding: 1.05rem 1.1rem;
  border-radius: 1rem;
  background: color-mix(in srgb, var(--ink) 6%, var(--paper));
}

.cards h3 {
  font-size: 1.05rem;
  letter-spacing: -0.03em;
  color: var(--brand-teal);
}

.card-photos {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.4rem;
  margin-top: 0.75rem;
}

.card-wide .card-copy {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 9.75rem) minmax(0, 1fr);
  align-items: center;
  justify-items: center;
  column-gap: 0.2rem;
  width: 100%;
  max-width: none;
}

.card-wide .party-deco {
  display: block;
  width: min(3.6rem, 18vw);
  pointer-events: none;
}

.card-wide .party-deco-balloons {
  justify-self: end;
}

.card-wide .party-deco-popper {
  justify-self: start;
}

.card-wide .party-deco svg {
  width: 100%;
  height: auto;
  animation: party-bob 4.8s ease-in-out infinite;
}

.card-wide .party-deco-popper svg {
  animation-delay: -1.4s;
}

.card-wide .card-copy-text,
.card-wide h3,
.card-wide p {
  margin: 0;
  text-align: center;
}

.card-wide p {
  margin-top: 0.28rem;
}

.card-wide h3 {
  font-family: var(--display);
  font-size: 1.2rem;
  font-weight: 560;
  line-height: 1.1;
}

.card-wide .card-photos {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.55rem;
  margin-top: 0.85rem;
  overflow: visible;
}

.card-wide .card-photo {
  width: 100%;
  min-width: 0;
  border-radius: 0.7rem;
}

@media (min-width: 640px) {
  .card-wide .card-photos {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.cards--simple .card-photos {
  grid-template-columns: 1fr;
  max-width: 22rem;
}

.card-photo {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  min-height: 44px;
  padding: 0;
  border: 0;
  border-radius: 0.45rem;
  overflow: hidden;
  background: color-mix(in srgb, var(--ink) 8%, #fff);
  cursor: pointer;
}

.card-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 38%;
  border-radius: 0;
}

.photo-zoom {
  position: fixed;
  inset: 0;
  z-index: 40;
  align-items: center;
  width: min(100% - 1.5rem, 52rem);
  height: fit-content;
  max-height: calc(100vh - 1.5rem);
  max-height: calc(100svh - 1.5rem);
  margin: auto;
  padding: 0.75rem;
  border: 0;
  border-radius: 0.75rem;
  background: #fff;
}

.photo-zoom:not([open]) {
  display: none;
}

.photo-zoom[open] {
  display: flex;
  flex-direction: column;
}

.photo-zoom-bar {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  width: 100%;
  margin-bottom: 0.7rem;
}

.photo-zoom-navs {
  display: flex;
  align-items: center;
  gap: 0.45rem;
}

.photo-zoom-stage {
  width: fit-content;
  max-width: 100%;
}

.photo-zoom::backdrop {
  background: rgb(24 20 28 / 72%);
}

.photo-zoom img {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: calc(100vh - 8.25rem);
  max-height: calc(100svh - 8.25rem);
  margin-inline: auto;
  object-fit: contain;
}

.photo-zoom-close {
  flex: 0 0 auto;
  min-width: 44px;
  min-height: 44px;
  padding: 0 1.05rem;
  border: 0;
  border-radius: 999px;
  background: var(--brand-pink);
  color: #fff;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 0.35rem 0.9rem rgb(232 9 141 / 28%);
}

.photo-zoom-close:hover {
  background: color-mix(in srgb, var(--brand-pink) 82%, #000);
}

.photo-zoom-close:focus-visible {
  outline: 2px solid var(--ink);
  outline-offset: 2px;
}

.photo-zoom-nav {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  padding: 0 1.05rem;
  border: 0;
  border-radius: 999px;
  background: var(--brand-teal);
  color: #fff;
  font: inherit;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  box-shadow: 0 0.35rem 0.9rem rgb(26 154 145 / 28%);
}

.photo-zoom-nav:hover,
.photo-zoom-nav:focus-visible {
  background: color-mix(in srgb, var(--brand-teal) 82%, #000);
}

.photo-zoom-nav:focus-visible {
  outline: 2px solid var(--ink);
  outline-offset: 2px;
}

.photo-zoom-nav[hidden] {
  display: none;
}

.cards p:empty {
  display: none;
}

.jobs {
  display: grid;
  gap: 1.6rem;
}

.job h3 {
  margin: 0 0 0.45rem;
  font-family: var(--display), sans-serif;
  font-size: 1.35rem;
  letter-spacing: -0.03em;
}

.job h3:empty,
.job-note:empty {
  display: none;
}

.job-note {
  margin: 0.45rem 0 0;
  color: var(--muted);
  font-size: 0.92rem;
}

.job-photos {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.4rem;
}

.job-photos figure {
  margin: 0;
}

.job-photos img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 0.2rem;
  background: color-mix(in srgb, var(--ink) 8%, var(--paper));
}

.job-photos figure:only-child,
.job-photos figure:first-child:nth-last-child(n + 3) {
  grid-column: 1 / -1;
}

.job-photos figure:only-child img {
  aspect-ratio: 16 / 10;
}

.look-studio #gallery .gallery-shell {
  width: 100vw;
  max-width: 100vw;
  margin-inline: calc(50% - 50vw);
  padding-inline: var(--page-pad);
}

.gallery-shell {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.gallery-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.15rem 1.45rem;
  padding: 0.2rem 0 0.1rem;
  border-bottom: 0;
}

.gallery-filter {
  min-height: 44px;
  margin-bottom: 0;
  padding: 0.35rem 0.02rem 0.4rem;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  background: transparent;
  color: var(--ink);
  font-family: var(--display);
  font-size: 1.05rem;
  font-weight: 560;
  letter-spacing: -0.02em;
  text-transform: none;
  cursor: pointer;
  transition: color 0.15s ease, border-color 0.15s ease;
}

.gallery-filter:hover,
.gallery-filter:focus-visible {
  border-bottom-color: transparent;
  color: var(--brand-teal);
  background: transparent;
}

.gallery-filter.is-active {
  background: transparent;
  border-bottom-color: var(--brand-pink);
  color: var(--brand-pink);
}

.gallery-filter:focus-visible {
  outline: 2px solid var(--brand-pink);
  outline-offset: 3px;
}

.gallery-meta {
  margin: 0;
  font-size: 0.88rem;
  font-weight: 500;
  color: var(--muted);
}

.gallery-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(0.55rem, 1.5vw, 0.85rem);
  list-style: none;
  margin: 0;
  padding: 0;
}

.gallery-grid > li[hidden] {
  display: none;
}

.gallery-photo {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  border-radius: 0.75rem;
  overflow: hidden;
  cursor: pointer;
  background: color-mix(in srgb, var(--ink) 6%, var(--paper));
  box-shadow: 0 2px 10px rgb(36 48 71 / 8%);
  transition: transform 0.22s ease, box-shadow 0.22s ease;
}

.gallery-photo:hover,
.gallery-photo:focus-visible {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgb(36 48 71 / 14%);
}

.gallery-photo img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  display: block;
  transition: transform 0.35s ease;
}

.gallery-photo:hover img,
.gallery-photo:focus-visible img {
  transform: scale(1.03);
}

.gallery-photo:focus-visible {
  outline: 2px solid var(--brand-pink);
  outline-offset: 2px;
}

@media (min-width: 640px) {
  .gallery-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 960px) {
  .gallery-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (prefers-reduced-motion: reduce) {
  .gallery-filter {
    transition: none;
  }

  .gallery-photo {
    transition: none;
  }

  .gallery-photo img {
    transition: none;
  }

  .gallery-photo:hover,
  .gallery-photo:focus-visible {
    transform: none;
  }

  .gallery-photo:hover img,
  .gallery-photo:focus-visible img {
    transform: none;
  }
}

.look-food #services {
  order: 2;
}

.look-food #gallery {
  order: 3;
}

.look-trust #about,
.look-clean #about {
  order: 2;
}

.look-trust #services,
.look-clean #services {
  order: 3;
}

.look-trust #gallery,
.look-clean #gallery,
.look-trade #gallery {
  order: 4;
}

main {
  display: flex;
  flex-direction: column;
}

.hero {
  order: 1;
  flex-shrink: 0;
}

#services {
  order: 3;
}

#gallery {
  order: 4;
}

#products {
  order: 4;
}

#about {
  order: 5;
}

#bookings {
  order: 8;
}

#hours {
  order: 6;
}

#contact {
  order: 6;
}

.look-studio #services {
  order: 3;
}

.look-studio #gallery {
  order: 4;
}

.look-studio #hours {
  order: 5;
}

.look-studio #contact {
  order: 6;
}

.look-studio #about,
.look-studio #bookings,
.look-studio #products {
  display: none;
}

.reach a[hidden] {
  display: none;
}

.reach a:not([hidden]) + a:not([hidden])::before {
  content: " · ";
  color: var(--muted);
}

.pack-entry .bookings,
.pack-entry nav a[href="#bookings"] {
  display: none;
}

.no-shop #products,
.no-shop nav a[href="#products"] {
  display: none;
}

.no-services #services,
.no-services nav a[href="#services"] {
  display: none;
}

.section-lede {
  max-width: 38rem;
  margin-bottom: 1.25rem;
  color: var(--muted);
  font-size: 1.05rem;
}

.look-studio .hero {
  display: block;
  min-height: auto;
  padding: 0.85rem 0 1rem;
}

.look-studio .hero,
.look-studio #gallery,
.look-studio #contact {
  --section-wash: color-mix(in srgb, var(--brand-teal) 14%, #fff);
}

.look-studio #services,
.look-studio #hours {
  --section-wash: color-mix(in srgb, var(--brand-pink) 12%, #fff);
}

.look-studio .hero,
.look-studio #services,
.look-studio #gallery,
.look-studio #hours,
.look-studio #contact {
  position: relative;
  background: var(--section-wash);
}

.look-studio .hero::before,
.look-studio #services::before,
.look-studio #gallery::before,
.look-studio #hours::before,
.look-studio #contact::before {
  content: "";
  position: absolute;
  z-index: 0;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 100vw;
  transform: translateX(-50%);
  background: var(--section-wash);
  pointer-events: none;
}

.look-studio .hero > *,
.look-studio #services > *,
.look-studio #gallery > *,
.look-studio #hours > *,
.look-studio #contact > * {
  position: relative;
  z-index: 1;
}

.look-studio .cards li {
  background: #fff;
}

.hero-copy {
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
}

.look-studio .hero-copy {
  align-items: center;
  text-align: center;
}

.hero-line {
  display: block;
  margin-top: 0.45rem;
}

.look-studio .hero .eyebrow {
  color: var(--brand-pink);
}

.look-studio .hero h1,
.look-studio .hero .lede {
  max-width: none;
  hyphens: none;
}

.look-studio .hero h1 {
  font-size: clamp(1.65rem, 2.8vw, 2.55rem);
  font-weight: 560;
  letter-spacing: -0.03em;
  line-height: 1.28;
}

.look-studio .reel {
  padding-inline: var(--page-pad);
  -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 94%, transparent);
  mask-image: linear-gradient(90deg, #000 0%, #000 94%, transparent);
}

.look-studio .reel-arrow--prev {
  left: calc(var(--page-pad) + 0.35rem);
}

.look-studio .reel-arrow--next {
  right: calc(var(--page-pad) + 0.35rem);
}

.tagline-band {
  order: 2;
  flex-shrink: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.55rem 1.35rem;
  margin: 0 calc(50% - 50vw);
  padding: 1.1rem 1.75rem;
  text-align: center;
  font-family: var(--display);
  font-weight: 680;
  font-size: clamp(0.98rem, 2.3vw, 1.18rem);
  line-height: 1.35;
  text-transform: uppercase;
  color: var(--on-accent);
  background: linear-gradient(90deg, var(--brand-pink), color-mix(in srgb, var(--brand-pink) 70%, var(--c2)));
}

.tagline-word {
  display: inline-block;
  letter-spacing: 0.22em;
  padding-inline: 0.12em;
  opacity: 0;
  animation: tagline-flash 0.75s ease forwards;
}

.tagline-word:nth-child(1) {
  animation-delay: 0.15s;
}

.tagline-word:nth-child(3) {
  animation-delay: 0.55s;
}

.tagline-word:nth-child(5) {
  animation-delay: 0.95s;
}

.tagline-sep {
  display: inline-block;
  letter-spacing: 0;
  font-weight: 560;
  padding-inline: 0.15rem;
  opacity: 0;
  animation: tagline-flash 0.45s ease forwards;
}

.tagline-sep:nth-child(2) {
  animation-delay: 0.42s;
}

.tagline-sep:nth-child(4) {
  animation-delay: 0.82s;
}

@keyframes tagline-flash {
  0% {
    opacity: 0;
    filter: brightness(2.2);
    transform: translateY(0.2em);
  }

  45% {
    opacity: 1;
    filter: brightness(1.35);
    transform: translateY(0);
  }

  100% {
    opacity: 1;
    filter: brightness(1);
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .tagline-word,
  .tagline-sep {
    animation: none;
    opacity: 1;
    filter: none;
    transform: none;
  }
}

.visit-google-wrap {
  display: grid;
  gap: 1rem;
  align-items: stretch;
}

@media (min-width: 900px) {
  .visit-google-wrap {
    grid-template-columns: minmax(0, 0.44fr) minmax(0, 0.56fr);
    gap: 1.15rem;
  }
}

.visit-gbp {
  display: flex;
  flex-direction: column;
  border-radius: 1rem;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--ink) 12%, transparent);
  background: #fff;
  box-shadow: 0 2px 16px rgb(36 48 71 / 7%);
}

.visit-gbp-photo {
  display: block;
  aspect-ratio: 16 / 9;
  overflow: hidden;
}

.visit-gbp-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.visit-gbp-body {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  padding: 0.85rem 0.95rem 1rem;
}

.visit-gbp-name {
  margin: 0;
  font-family: var(--display);
  font-size: 1.2rem;
  line-height: 1.25;
  letter-spacing: -0.02em;
}

.visit-gbp-name a {
  color: var(--ink);
  text-decoration: none;
}

.visit-gbp-name a:hover,
.visit-gbp-name a:focus-visible {
  color: var(--brand-teal);
}

.visit-gbp-rating {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.5rem;
  margin: 0;
  font-size: 0.9rem;
}

.visit-gbp-stars {
  letter-spacing: 0.05em;
  color: #f5a623;
  font-size: 0.95rem;
  line-height: 1;
}

.visit-gbp-score {
  font-weight: 700;
  color: var(--ink);
}

.visit-gbp-reviews {
  color: #1a73e8;
  font-weight: 500;
  text-decoration: none;
}

.visit-gbp-reviews:hover,
.visit-gbp-reviews:focus-visible {
  text-decoration: underline;
}

.visit-gbp-category {
  margin: 0;
  font-size: 0.88rem;
  color: var(--muted);
}

.visit-gbp-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  padding: 0.35rem 0 0.15rem;
}

.visit-gbp-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0.45rem 0.85rem;
  border-radius: 999px;
  font-size: 0.84rem;
  font-weight: 600;
  text-decoration: none;
  color: #1a73e8;
  background: #e8f0fe;
  border: 1px solid #d2e3fc;
}

.visit-gbp-action--primary {
  color: var(--on-accent);
  background: var(--brand-pink);
  border-color: transparent;
}

.visit-gbp-action:hover,
.visit-gbp-action:focus-visible {
  filter: brightness(0.98);
  text-decoration: none;
}

.visit-gbp-action:focus-visible {
  outline: 2px solid var(--brand-teal);
  outline-offset: 2px;
}

.visit-gbp-details {
  list-style: none;
  margin: 0.35rem 0 0;
  padding: 0.5rem 0 0;
  border-top: 1px solid color-mix(in srgb, var(--ink) 8%, transparent);
  display: grid;
  gap: 0.65rem;
}

.visit-gbp-detail {
  margin: 0;
  padding-left: 1.65rem;
  font-size: 0.88rem;
  line-height: 1.45;
  background-repeat: no-repeat;
  background-position: 0 0.15rem;
  background-size: 1.1rem 1.1rem;
}

.visit-gbp-detail a {
  color: #1a73e8;
  text-decoration: none;
  font-weight: 500;
}

.visit-gbp-detail a:hover,
.visit-gbp-detail a:focus-visible {
  text-decoration: underline;
}

.visit-gbp-detail span {
  color: var(--ink);
}

.visit-gbp-detail--address {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%235f6368'%3E%3Cpath d='M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5a2.5 2.5 0 010-5 2.5 2.5 0 010 5z'/%3E%3C/svg%3E");
}

.visit-gbp-detail--hours {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%235f6368'%3E%3Cpath d='M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zM12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8zm.5-13H11v6l5.25 3.15.75-1.23-4.5-2.67z'/%3E%3C/svg%3E");
}

.visit-gbp-detail--web {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%235f6368'%3E%3Cpath d='M11.99 2C6.48 2 2 6.48 2 12s4.48 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zm6.93 6h-2.95a15.65 15.65 0 00-1.38-3.56A8.03 8.03 0 0118.92 8zM12 4.04c.83 1.2 1.48 2.53 1.91 3.96h-3.82c.43-1.43 1.08-2.76 1.91-3.96zM4.26 14C4.1 13.36 4 12.69 4 12s.1-1.36.26-2h3.38c-.08.66-.14 1.32-.14 2 0 .68.06 1.34.14 2H4.26zm.82 2h2.95c.32 1.25.78 2.45 1.38 3.56A7.987 7.987 0 015.08 16zm2.95-8H5.08a7.987 7.987 0 014.33-3.56A15.65 15.65 0 008.03 8zM12 19.96c-.83-1.2-1.48-2.53-1.91-3.96h3.82c-.43 1.43-1.08 2.76-1.91 3.96zM14.34 14H9.66c-.09-.66-.16-1.32-.16-2 0-.68.07-1.35.16-2h4.68c.09.65.16 1.32.16 2 0 .68-.07 1.34-.16 2zm.25 5.56c.6-1.11 1.06-2.31 1.38-3.56h2.95a8.03 8.03 0 01-4.33 3.56zM16.36 14c.08-.66.14-1.32.14-2 0-.68-.06-1.34-.14-2h3.38c.16.64.26 1.31.26 2s-.1 1.36-.26 2h-3.38z'/%3E%3C/svg%3E");
}

.visit-gbp-detail--plus {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%235f6368'%3E%3Cpath d='M20.5 3l-.16.03L15 5.1 9 3 3.36 4.9c-.21.07-.36.25-.36.48V20.5c0 .28.22.5.5.5l.16-.03L9 18.9l6 2.1 5.64-1.9c.21-.07.36-.25.36-.48V3.5c0-.28-.22-.5-.5-.5zM10 5.47l4 1.4v11.66l-4-1.4V5.47zM5 6.46l4-1.37v11.66l-4 1.37V6.46zm14 11.08l-4 1.37V7.33l4-1.37v11.21z'/%3E%3C/svg%3E");
}

.visit-google {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  min-height: 22rem;
  border-radius: 1rem;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--ink) 12%, transparent);
  background: #fff;
  box-shadow: 0 2px 16px rgb(36 48 71 / 7%);
}

.visit-google-embed {
  display: block;
  flex: 1;
  width: 100%;
  min-height: 22rem;
  height: min(32rem, 72vh);
  border: 0;
}

@media (min-width: 900px) {
  .visit-google {
    min-height: 100%;
  }

  .visit-google-embed {
    min-height: 100%;
    height: auto;
  }
}

#hours {
  padding-bottom: 2rem;
}

.cards li {
  border-left: 3px solid var(--brand-teal);
}

.top .cta {
  background: var(--brand-pink);
}

.contact-channels {
  display: grid;
  gap: 0.65rem;
  margin-bottom: 1.5rem;
}

@media (min-width: 640px) {
  .contact-channels {
    grid-template-columns: minmax(0, 22rem);
  }
}

.contact-link {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  min-height: 44px;
  padding: 0.85rem 1rem;
  border-radius: 0.85rem;
  background: color-mix(in srgb, var(--ink) 5%, var(--paper));
  border: 1px solid color-mix(in srgb, var(--ink) 10%, transparent);
  text-decoration: none;
  color: inherit;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.contact-link:hover,
.contact-link:focus-visible {
  border-color: color-mix(in srgb, var(--brand-teal) 45%, transparent);
  box-shadow: 0 4px 14px rgb(36 48 71 / 8%);
  transform: translateY(-1px);
  text-decoration: none;
}

.contact-link:focus-visible {
  outline: 2px solid var(--brand-pink);
  outline-offset: 2px;
}

.contact-link-icon {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 999px;
  color: #fff;
  background: linear-gradient(145deg, var(--brand-pink), color-mix(in srgb, var(--brand-pink) 78%, #000));
}

.contact-link--whatsapp .contact-link-icon {
  background: linear-gradient(145deg, #25d366, #128c7e);
}

.contact-link-text {
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
  min-width: 0;
}

.contact-link-label {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--brand-teal);
}

.contact-link-value {
  font-size: 0.98rem;
  font-weight: 600;
  color: var(--ink);
  overflow-wrap: anywhere;
}

.contact-social-wrap {
  margin-top: 0.35rem;
  padding-top: 1.35rem;
  border-top: 1px solid color-mix(in srgb, var(--ink) 10%, transparent);
}

.contact-social-heading {
  margin: 0 0 0.35rem;
  font-family: var(--display);
  font-size: clamp(1.25rem, 2.5vw, 1.55rem);
  letter-spacing: -0.03em;
  color: var(--brand-teal);
}

.contact-social-lede {
  margin: 0 0 1rem;
  max-width: 36rem;
  color: var(--muted);
  font-size: 0.98rem;
}

.contact-social {
  display: grid;
  gap: 1rem;
}

@media (min-width: 900px) {
  .contact-social {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
  }
}

@media (min-width: 1100px) {
  .contact-social {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.social-preview {
  display: flex;
  flex-direction: column;
  min-height: 0;
  border-radius: 1rem;
  overflow: hidden;
  background: var(--paper);
  border: 1px solid color-mix(in srgb, var(--ink) 12%, transparent);
  box-shadow: 0 2px 12px rgb(36 48 71 / 6%);
}

.social-preview-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem 0.65rem;
  padding: 0.8rem 0.9rem;
  border-bottom: 1px solid color-mix(in srgb, var(--ink) 8%, transparent);
  background: color-mix(in srgb, var(--ink) 3%, var(--paper));
}

.social-preview-icon {
  display: inline-flex;
}

.social-preview-icon--facebook {
  color: #1877f2;
}

.social-preview-icon--instagram {
  color: #e1306c;
}

.social-preview-icon--tiktok {
  color: #111;
}

.social-preview-title {
  margin: 0;
  flex: 1;
  font-family: var(--display);
  font-size: 1.05rem;
  letter-spacing: -0.02em;
}

.social-preview-open {
  font-size: 0.86rem;
  font-weight: 600;
  color: var(--brand-teal);
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.social-profile-bar {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.75rem 0.9rem;
  border-bottom: 1px solid color-mix(in srgb, var(--ink) 8%, transparent);
  background: #fff;
}

.social-profile-avatar {
  width: 3rem;
  height: 3rem;
  border-radius: 0.45rem;
  object-fit: cover;
  border: 1px solid color-mix(in srgb, var(--ink) 10%, transparent);
}

.social-profile-text {
  min-width: 0;
}

.social-profile-name {
  margin: 0;
  font-weight: 700;
  font-size: 0.95rem;
  color: var(--ink);
}

.social-profile-handle {
  margin: 0.12rem 0 0;
  font-size: 0.86rem;
  color: var(--muted);
}

.social-profile-handle a {
  color: var(--brand-teal);
  text-decoration: underline;
  text-underline-offset: 0.12em;
}

.social-profile-handle a:hover,
.social-profile-handle a:focus-visible {
  color: var(--brand-pink);
}

.social-live-feed {
  position: relative;
  flex: none;
  height: 28rem;
  min-height: 0;
  overflow: hidden;
  background: #fff;
}

.social-live-feed--facebook {
  display: flex;
  justify-content: center;
  background: #fff;
}

.social-live-feed--facebook .fb-page,
.social-live-feed--facebook .fb-page > span,
.social-live-feed--facebook iframe {
  display: block;
  width: min(100%, 500px) !important;
  max-width: 500px;
  margin-inline: auto;
}

.social-live-feed--instagram {
  container-type: inline-size;
  display: block;
  height: auto;
  overflow: hidden;
}

.ig-scale {
  width: 100%;
}

.social-live-feed--tiktok {
  display: flex;
  flex-direction: column;
  min-height: 0;
  background: #fff;
}

.tiktok-row {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.65rem;
  margin: 0;
  padding: 0.65rem;
  flex: 1;
  min-height: 0;
  max-height: none;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior-y: contain;
  scroll-snap-type: y mandatory;
  -webkit-overflow-scrolling: touch;
}

.tiktok-row a {
  position: relative;
  display: block;
  flex: none;
  width: min(100%, 18rem);
  aspect-ratio: 9 / 16;
  overflow: hidden;
  border-radius: 0.7rem;
  background: #111;
  scroll-snap-align: start;
}

.tiktok-row img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.social-feed-play {
  position: absolute;
  left: 50%;
  top: 50%;
  display: grid;
  place-items: center;
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 999px;
  color: #fff;
  background: rgb(0 0 0 / 55%);
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.tiktok-row a:hover img,
.tiktok-row a:focus-visible img {
  transform: scale(1.03);
  transition: transform 0.25s ease;
}

.tiktok-row a:focus-visible {
  outline: 2px solid var(--brand-pink);
  outline-offset: 2px;
}

.social-live-iframe {
  display: block;
  width: 100%;
  height: 36rem;
  border: 0;
  background: #fff;
}

.ig-scale .social-live-iframe--instagram {
  width: 100%;
  max-width: 100%;
  height: calc(15rem + 52cqw);
  transform: none;
}

.social-feed-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2px;
  list-style: none;
  margin: 0;
  padding: 0;
  background: color-mix(in srgb, var(--ink) 8%, transparent);
}

.social-feed-grid a {
  display: block;
  aspect-ratio: 1;
  overflow: hidden;
}

.social-feed-grid img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.25s ease;
}

.social-feed-grid a:hover img,
.social-feed-grid a:focus-visible img {
  transform: scale(1.03);
}

.social-feed-grid a:focus-visible {
  outline: 2px solid var(--brand-pink);
  outline-offset: -2px;
}

.social-feed-note {
  margin: 0;
  padding: 0.65rem 0.9rem 0;
  font-size: 0.82rem;
  color: var(--muted);
  line-height: 1.4;
}

.social-preview-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-top: 0;
  padding: 0.75rem 0.9rem 0.9rem;
  border-top: 1px solid color-mix(in srgb, var(--ink) 8%, transparent);
  background: color-mix(in srgb, var(--ink) 3%, var(--paper));
}

.social-btn {
  display: inline-flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  min-height: 44px;
  padding: 0.5rem 0.75rem;
  border-radius: 0.45rem;
  font-size: 0.88rem;
  font-weight: 600;
  text-decoration: none;
  border: 1px solid color-mix(in srgb, var(--ink) 14%, transparent);
  background: #fff;
  color: var(--ink);
}

.social-btn--follow {
  background: #e7f0ff;
  border-color: #c8daf5;
  color: #0a4eb8;
}

.social-btn--instagram {
  background: linear-gradient(145deg, #fdf2f8, #fce7f3);
  border-color: #f5c2e0;
  color: #be185d;
}

.social-btn--tiktok {
  background: #111;
  border-color: #111;
  color: #fff;
}

.social-btn--ghost {
  flex: 0 1 auto;
  min-width: 6.5rem;
  background: #fff;
}

.social-btn:hover,
.social-btn:focus-visible {
  filter: brightness(0.98);
  text-decoration: none;
}

.social-btn:focus-visible {
  outline: 2px solid var(--brand-pink);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  .contact-link {
    transition: none;
  }

  .contact-link:hover,
  .contact-link:focus-visible {
    transform: none;
  }

  .social-feed-grid img {
    transition: none;
  }

  .social-feed-grid a:hover img,
  .social-feed-grid a:focus-visible img,
  .tiktok-row a:hover img,
  .tiktok-row a:focus-visible img {
    transform: none;
  }
}

@media (max-width: 799px) {
  :root {
    --mobile-header: 2.75rem;
  }

  .top {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.15rem;
    padding: 0.7rem 0.85rem 0.55rem;
    text-align: center;
  }

  .top-scroll-spacer.is-active {
    display: block;
  }

  .top > .brand,
  .top > .top-center,
  .top > .stable-nav {
    grid-column: auto;
    grid-row: auto;
    width: min(100%, 28rem);
    max-width: 100%;
    margin-inline: auto;
  }

  .top-center {
    display: flex;
    align-items: center;
    align-self: center;
    flex: none;
    gap: 0.95rem;
    width: min(100%, 28rem);
    padding-top: 0;
  }

  .top-tagline {
    width: 100%;
    margin: 0;
    padding: 0;
    text-align: center;
  }

  .top-social {
    width: fit-content;
    max-width: 100%;
    margin-inline: auto;
    justify-content: center;
    gap: 1.2rem;
    flex: none;
    padding: 0.15rem 0;
  }

  .brand {
    justify-content: center;
    align-items: center;
    align-self: center;
  }

  .brand img {
    height: 3.4rem;
    max-width: 8.5rem;
    object-position: center center;
    margin-inline: auto;
  }

  .stable-nav {
    align-self: center;
    align-items: flex-start;
    justify-content: center;
    gap: 0.4rem;
    width: min(100%, 28rem);
  }

  .stable-nav a {
    gap: 0.15rem;
    overflow: hidden;
    font-size: 0.72rem;
    line-height: 1.15;
  }

  .stable-nav a span {
    min-height: 2.4rem;
    padding: 0 0.08rem;
  }

  .stable-nav img {
    display: block;
    width: 100%;
    max-height: 8.5rem;
  }

  .top.top--scrolled {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 0.4rem;
    min-height: var(--mobile-header);
    padding: 0.15rem 0.7rem;
    text-align: left;
  }

  .top.top--scrolled > .brand,
  .top.top--scrolled > .stable-nav {
    width: auto;
    max-width: none;
    margin-inline: 0;
  }

  .top.top--scrolled .brand {
    flex: 0 0 auto;
    justify-content: flex-start;
  }

  .top.top--scrolled .brand img {
    height: 2.05rem;
    max-width: 6.5rem;
    margin-inline: 0;
  }

  .top.top--scrolled .stable-nav {
    flex: 1 1 auto;
    align-items: center;
    justify-content: flex-end;
    gap: 0.1rem;
  }

  .top.top--scrolled .stable-nav a {
    gap: 0;
    font-size: 0.62rem;
    line-height: 1.05;
  }

  .top.top--scrolled .stable-nav a span {
    min-height: 2.45rem;
    padding: 0 0.12rem;
  }

  .top.top--scrolled .top-center,
  .top.top--scrolled .stable-nav img {
    display: none;
  }

  #services,
  #gallery,
  #hours,
  #contact {
    scroll-margin-top: var(--mobile-header);
  }

  main section {
    text-align: center;
  }

  .hero-copy {
    align-items: center;
  }

  .eyebrow,
  h1,
  h2,
  h3,
  .look-studio .hero h1,
  .look-studio .hero .lede {
    text-align: center;
    margin-inline: auto;
  }

  .lede,
  .section-lede,
  #about p,
  #contact p,
  .hours,
  .contact-social-lede,
  .gallery-meta,
  .foot-tag,
  .social-feed-note {
    margin-inline: auto;
    text-align: center;
  }

  .gallery-shell {
    align-items: center;
  }

  .gallery-filters {
    justify-content: center;
  }

  .cards li {
    border-left: 0;
    border-top: 3px solid var(--brand-teal);
  }

  .cards--simple .card-photos {
    margin-inline: auto;
  }

  .contact-channels {
    justify-items: stretch;
  }

  .contact-link {
    display: grid;
    grid-template-columns: 2.5rem minmax(0, 1fr);
    justify-content: start;
    justify-items: start;
    align-items: center;
    column-gap: 0.85rem;
    text-align: left;
    width: 100%;
    margin-inline: 0;
  }

  .contact-link-text {
    align-items: flex-start;
    text-align: left;
  }

  .visit-gbp-body {
    align-items: center;
    text-align: center;
  }

  .visit-gbp-rating,
  .visit-gbp-actions {
    justify-content: center;
  }

  .visit-gbp-detail {
    padding-left: 0;
    padding-top: 1.45rem;
    background-position: 50% 0;
    text-align: center;
  }

  .foot-grid {
    text-align: center;
    justify-items: center;
  }

  .foot-name,
  .foot-label {
    text-align: center;
  }

  .site-foot a:not(.footer-vibeit) {
    justify-content: center;
  }

  .social-preview-head {
    justify-content: center;
    text-align: center;
  }

  .social-preview-title {
    flex: 1 1 100%;
    text-align: center;
  }

  .social-profile-bar {
    justify-content: center;
    text-align: center;
  }

  .social-profile-text {
    text-align: center;
  }

  .social-preview-actions {
    justify-content: center;
  }

  .social-btn {
    flex: 0 1 auto;
    min-width: min(100%, 14rem);
  }
}

@media (min-width: 800px) {
  .look-studio .hero {
    padding-top: 1rem;
  }

  .cards {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .cards {
    grid-template-columns: repeat(4, 1fr);
  }
}

.site-foot {
  margin-top: 0.5rem;
  padding: 2.35rem var(--page-pad) calc(2.75rem + env(safe-area-inset-bottom));
  color: var(--ink);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--brand-teal) 10%, #fff) 0%, color-mix(in srgb, var(--brand-teal) 4%, #fff) 100%);
  border-top: 3px solid var(--brand-teal);
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--brand-pink) 35%, transparent);
}

.site-foot-inner {
  width: min(var(--page-max), calc(100% - 2rem));
  margin: 0 auto;
}

.foot-grid {
  display: grid;
  gap: 1.65rem 1.25rem;
}

.foot-name {
  font-family: var(--display);
  font-size: clamp(1.12rem, 2vw, 1.32rem);
  font-weight: 680;
  letter-spacing: -0.02em;
  line-height: 1.2;
  color: var(--ink);
}

.foot-tag {
  max-width: 22rem;
  margin-top: 0.4rem;
  color: var(--muted);
  font-size: 0.95rem;
  line-height: 1.45;
}

.foot-grid p + p {
  margin-top: 0.15rem;
}

.foot-label {
  margin: 0 0 0.45rem;
  color: var(--brand-pink);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.site-foot a {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  color: var(--ink);
  text-decoration: none;
  font-size: 0.92rem;
  font-weight: 500;
}

.site-foot a:hover,
.site-foot a:focus-visible {
  color: var(--brand-teal);
  text-decoration: underline;
  text-underline-offset: 0.14rem;
}

.foot-copy {
  margin: 1.65rem 0 0;
  padding-top: 1.15rem;
  border-top: 1px solid color-mix(in srgb, var(--ink) 12%, transparent);
  color: var(--muted);
  font-size: 0.88rem;
  text-align: center;
}

.foot-base {
  position: relative;
  z-index: 0;
  margin: 1.6rem calc(50% - 50vw) calc(-1 * (2.75rem + env(safe-area-inset-bottom)));
  padding: 1.45rem 1rem calc(1.7rem + env(safe-area-inset-bottom));
  border-top: 0;
  background: #000;
  text-align: center;
}

.site-foot a.footer-vibeit {
  display: grid;
  justify-items: center;
  gap: 0.05rem;
  width: fit-content;
  min-height: 0;
  margin: 0 auto;
  color: #fff;
  text-decoration: none;
}

.site-foot a.footer-vibeit:hover,
.site-foot a.footer-vibeit:focus-visible {
  color: #fff;
  text-decoration: none;
}

.footer-vibeit-sign {
  font-family: Georgia, "Times New Roman", serif;
  font-style: italic;
  font-size: 1.05rem;
  font-weight: 400;
  letter-spacing: 0.04em;
  color: #fff;
  text-align: center;
}

.footer-vibeit img {
  width: 5.6rem;
  height: 5.6rem;
  margin: 0.05rem 0 0;
  object-fit: contain;
  pointer-events: none;
  background: transparent;
}

.footer-vibeit-cta {
  font-family: Georgia, "Times New Roman", serif;
  font-style: italic;
  font-size: 1.12rem;
  letter-spacing: 0.03em;
  text-align: center;
  background-image: linear-gradient(105deg, #c45cff 0%, #7a5cff 22%, #2ad6ff 52%, #ff9a3c 86%, #ff7a2e 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

.site-foot .footer-vibeit:hover .footer-vibeit-sign,
.site-foot .footer-vibeit:focus-visible .footer-vibeit-sign {
  color: #fff;
}

@media (min-width: 640px) {
  .foot-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .foot-brand-col {
    grid-column: 1 / -1;
  }
}

@media (min-width: 900px) {
  .foot-grid {
    grid-template-columns: 1.15fr 0.95fr 0.95fr 0.85fr;
    gap: 1.35rem 1.5rem;
  }

  .foot-brand-col {
    grid-column: auto;
  }

  .foot-copy {
    text-align: left;
  }
}

@media (min-width: 480px) {
  .footer-vibeit-sign,
  .footer-vibeit-cta {
    white-space: nowrap;
  }
}

.wa {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  min-height: 44px;
  padding: 0.75rem 1rem;
  border-radius: 999px;
  color: #fff;
  background: #128c7e;
  font-weight: 700;
}

.wa[hidden] {
  display: none;
}

@media (min-width: 800px) {
  .cards {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: 0.75rem;
    row-gap: 0;
  }

  .cards li {
    display: grid;
    grid-template-rows: subgrid;
    grid-row: span 3;
    align-content: start;
    margin-bottom: 0.75rem;
  }

  .cards h3 {
    margin: 0;
    line-height: 1.2;
  }

  .cards li > p {
    margin: 0.28rem 0 0;
    line-height: 1.35;
  }

  .card-photos {
    margin-top: 0.75rem;
  }

  .cards li.card-wide {
    grid-column: 1 / -1;
    grid-row: auto;
    grid-template-rows: auto;
    grid-template-columns: minmax(0, 1fr);
    display: grid;
    align-items: start;
    margin-bottom: 0.75rem;
    padding-top: 1.15rem;
  }

  .cards li.card-wide .card-photos {
    margin-top: 0.9rem;
  }

  .cards li.card-wide .card-copy {
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: end;
    column-gap: 0.75rem;
  }

  .cards li.card-wide .party-deco {
    width: 9.25rem;
  }

  .cards li.card-wide h3 {
    font-size: 1.7rem;
  }

  .job-photos {
    grid-template-columns: repeat(3, 1fr);
  }

  .job-photos figure:only-child,
  .job-photos figure:first-child:nth-last-child(n + 3) {
    grid-column: 1 / -1;
  }
}

html.site-intro-active {
  overflow: hidden;
}

body.intro-locked {
  overflow: hidden;
}

body.intro-locked .top,
body.intro-locked main,
body.intro-locked .site-foot,
body.intro-locked .wa,
body.intro-locked #fb-root {
  visibility: hidden;
}

.site-intro {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: #000;
  cursor: pointer;
}

.site-intro-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  background: #000;
  pointer-events: none;
}

@media (max-width: 799px) {
  .site-intro-video {
    position: static;
    inset: auto;
    width: 100%;
    height: auto;
    max-height: 100%;
    object-fit: contain;
  }
}

.site-intro.is-splash {
  background: #000;
}

.site-intro-splash {
  display: flex;
  position: absolute;
  inset: 0;
  z-index: 2;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding: 1.25rem;
  background: #fff;
  opacity: 0;
  pointer-events: none;
}

.site-intro.is-splash .site-intro-splash {
  opacity: 1;
  transition: opacity 1.05s ease;
}

.site-intro-splash img {
  display: block;
  width: min(92vw, 40rem);
  height: auto;
  opacity: 0;
}

.site-intro.is-splash .site-intro-splash img {
  opacity: 1;
  transition: opacity 1.2s ease 0.28s;
}

@keyframes party-bob {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-5px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .site-intro {
    display: none;
  }

  .party-deco svg {
    animation: none;
  }
}