/* Shared styles for Elvira & Lupita site — used by every page */

.material-symbols-outlined {
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.ambient-shadow {
  box-shadow: 0 16px 32px rgba(104, 93, 76, 0.08);
}

/* Zoom-on-hover imagery used across gallery, services, about, contact */
.img-zoom {
  overflow: hidden;
}
.img-zoom img {
  transition: transform 0.7s ease;
}
.img-zoom:hover img {
  transform: scale(1.05);
}

/* Contact form floating labels */
.floating-label-input:focus-within label {
  transform: translateY(-1.5rem) scale(0.85);
  color: #685d4c;
}
.floating-label-input input:not(:placeholder-shown) + label,
.floating-label-input textarea:not(:placeholder-shown) + label {
  transform: translateY(-1.5rem) scale(0.85);
}
input[type="checkbox"]:checked {
  background-color: #685d4c;
  border-color: #685d4c;
}

/* Gallery masonry grid */
.masonry-grid {
  column-count: 1;
  column-gap: 24px;
}
@media (min-width: 640px) {
  .masonry-grid {
    column-count: 2;
  }
}
@media (min-width: 1024px) {
  .masonry-grid {
    column-count: 3;
  }
}
.masonry-item {
  break-inside: avoid;
  margin-bottom: 24px;
}

/* Mobile nav panel: closed by default via [hidden], toggled by site.js */
#mobile-menu.hidden {
  display: none;
}

/* Prevent any accidental horizontal scroll on small screens */
html, body {
  max-width: 100%;
  overflow-x: hidden;
}

/* Comfortable, thumb-friendly tap targets on touch screens */
@media (max-width: 767px) {
  #mobile-menu a {
    min-height: 44px;
    display: flex;
    align-items: center;
  }
}
