/* Arch-style masseuse cards (home + list) */
.masseuse-bento--arch {
  --masseuse-arch-radius: 50% 50% 0 0 / 38% 38% 0 0;
  --arch-glow-pink-soft: rgba(255, 210, 230, 0.32);
  --arch-glow-pink-mid: rgba(255, 175, 210, 0.24);
  --arch-glow-pink-deep: rgba(255, 155, 195, 0.2);
  --arch-glow-pink-edge: rgba(255, 195, 220, 0.28);
  --arch-glow-blur: 8px;
  --arch-glow-opacity: 0.48;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(1.5rem, 4vw, 3.25rem);
  overflow: visible;
}

@media (max-width: 1024px) {
  .masseuse-bento--arch {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 420px) {
  .masseuse-bento--arch {
    grid-template-columns: 1fr;
  }
}

.masseuse-bento--arch .masseuse-card {
  border-radius: 0;
  border: none;
  background: transparent;
  transition: none;
  overflow: visible;
}

.masseuse-bento--arch .masseuse-card:hover {
  transform: none;
}

.masseuse-bento--arch .masseuse-card--unavailable {
  opacity: 1;
}

.masseuse-bento--arch .masseuse-card--unavailable .masseuse-card__photo-wrap {
  opacity: 0.72;
}

.masseuse-bento--arch .masseuse-card--unavailable .masseuse-card__link::before {
  opacity: calc(var(--arch-glow-opacity) * 0.5);
}

.masseuse-bento--arch .masseuse-card__link {
  position: relative;
  isolation: isolate;
}

.masseuse-bento--arch .masseuse-card__link::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  width: 100%;
  aspect-ratio: 3 / 4;
  border-radius: var(--masseuse-arch-radius);
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(
    175deg,
    rgba(255, 200, 225, 0.12) 0%,
    var(--arch-glow-pink-soft) 28%,
    var(--arch-glow-pink-mid) 55%,
    var(--arch-glow-pink-deep) 82%,
    rgba(255, 170, 205, 0.28) 100%
  );
  opacity: var(--arch-glow-opacity);
  -webkit-filter: blur(var(--arch-glow-blur));
  filter: blur(var(--arch-glow-blur));
  -webkit-transform: scale(1.018) translateZ(0);
  transform: scale(1.018) translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  box-shadow:
    0 0 0 1px var(--arch-glow-pink-edge),
    0 0 10px rgba(255, 175, 210, 0.2),
    0 0 20px rgba(255, 150, 195, 0.12),
    0 0 32px rgba(255, 130, 185, 0.08),
    0 4px 20px rgba(255, 120, 180, 0.1);
  transition:
    opacity 0.45s ease,
    -webkit-filter 0.45s ease,
    filter 0.45s ease,
    box-shadow 0.45s ease;
}

.masseuse-bento--arch .masseuse-card__photo-wrap {
  border-radius: var(--masseuse-arch-radius);
  aspect-ratio: 3 / 4;
  overflow: hidden;
  position: relative;
  z-index: 1;
  isolation: isolate;
  contain: paint;
}

.masseuse-bento--arch .masseuse-card__photo-wrap::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  border-radius: inherit;
  background: linear-gradient(
    to top,
    rgba(220, 125, 170, 0.1) 0%,
    rgba(210, 115, 165, 0.05) 14%,
    rgba(200, 105, 155, 0.02) 24%,
    transparent 36%
  );
  opacity: 1;
  transition: opacity 0.55s ease;
  pointer-events: none;
}

@media (hover: hover) {
  .masseuse-bento--arch .masseuse-card:hover .masseuse-card__link::before,
  .masseuse-bento--arch .masseuse-card:focus-within .masseuse-card__link::before {
    opacity: 0.58;
    --arch-glow-blur: 9px;
    box-shadow:
      0 0 0 1px rgba(255, 205, 225, 0.35),
      0 0 12px rgba(255, 180, 215, 0.24),
      0 0 22px rgba(255, 155, 200, 0.16),
      0 0 36px rgba(255, 135, 190, 0.1),
      0 5px 24px rgba(255, 125, 185, 0.14);
  }

  .masseuse-bento--arch .masseuse-card:hover .masseuse-card__photo-wrap::before,
  .masseuse-bento--arch .masseuse-card:focus-within .masseuse-card__photo-wrap::before {
    background: linear-gradient(
      to top,
      rgba(220, 125, 170, 0.12) 0%,
      rgba(210, 115, 165, 0.06) 14%,
      rgba(200, 105, 155, 0.025) 24%,
      transparent 36%
    );
  }
}

.masseuse-bento--arch .masseuse-card__photo {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  border-radius: var(--masseuse-arch-radius);
  transform: none;
  transition: transform 0.55s cubic-bezier(0.25, 0.1, 0.25, 1);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

@media (hover: hover) {
  .masseuse-bento--arch .masseuse-card:hover .masseuse-card__photo,
  .masseuse-bento--arch .masseuse-card:focus-within .masseuse-card__photo {
    transform: scale(1.045);
  }
}

@media (hover: none), (pointer: coarse) {
  .masseuse-bento--arch .masseuse-card__photo {
    transform: none;
    transition: none;
  }
}

.masseuse-bento--arch .masseuse-card__photo-wrap::after {
  inset: 40% 0 0 0;
  background: linear-gradient(to top, rgba(14, 11, 9, 0.92) 0%, transparent 100%);
  z-index: 1;
}

.masseuse-bento--arch .masseuse-card__badge {
  z-index: 2;
  top: auto;
  bottom: 22%;
  right: clamp(0.625rem, 2vw, 1rem);
  padding: 0.375rem 0.75rem;
  font-size: 0.5625rem;
  letter-spacing: 0.14em;
  font-weight: 400;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.masseuse-bento--arch .masseuse-card__badge--available {
  background: rgba(72, 160, 110, 0.35);
  border: 1px solid rgba(120, 210, 155, 0.65);
  color: #b8efd0;
}

.masseuse-bento--arch .masseuse-card__badge--busy {
  background: rgba(190, 60, 60, 0.38);
  border: 1px solid rgba(230, 110, 110, 0.65);
  color: #f5b0b0;
}

.masseuse-bento--arch .masseuse-card__badge--new {
  top: clamp(0.625rem, 2vw, 1rem);
  bottom: auto;
  background: rgba(200, 169, 110, 0.35);
  border: 1px solid rgba(228, 201, 147, 0.65);
  color: var(--aura-gold-light);
}

.masseuse-bento--arch .masseuse-card__body {
  padding: clamp(1rem, 2.5vw, 1.375rem) clamp(1.125rem, 3.5vw, 1.75rem) clamp(0.5rem, 1.5vw, 0.75rem);
  margin-top: clamp(0.75rem, 2.5vw, 1.125rem);
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.masseuse-bento--arch .masseuse-card__name {
  font-family: 'Jost', var(--font-sans);
  font-weight: 300;
  color: var(--aura-cream);
  margin: 0 0 0.375rem;
}

.masseuse-bento--arch .masseuse-card__chips .chip {
  font-size: 0.6875rem;
  color: var(--aura-cream-dim);
  border-color: rgba(200, 169, 110, 0.28);
}

@media (max-width: 768px) {
  .masseuse-bento--arch {
    --arch-glow-blur: 6px;
    --arch-glow-opacity: 0.42;
  }

  .masseuse-bento--arch .masseuse-card__link::before {
    box-shadow:
      0 0 0 1px var(--arch-glow-pink-edge),
      0 0 8px rgba(255, 175, 210, 0.18),
      0 0 16px rgba(255, 150, 195, 0.1),
      0 3px 18px rgba(255, 120, 180, 0.09);
  }
}

@media (prefers-reduced-motion: reduce) {
  .masseuse-bento--arch .masseuse-card__photo,
  .masseuse-bento--arch .masseuse-card__photo-wrap::before,
  .masseuse-bento--arch .masseuse-card__link::before {
    transition: none;
  }
}

@supports (-webkit-touch-callout: none) {
  .masseuse-bento--arch .masseuse-card__photo-wrap {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-mask-image: -webkit-radial-gradient(white, black);
  }
}