@import url('https://fonts.googleapis.com/css2?family=Secular+One&family=Noto+Sans+Hebrew:wght@400;500;600;700;800&display=swap');

:root {
  --color-primary: #755C92;
  --color-primary-dark: #5D4877;
  --color-secondary: #98B4BA;
  --color-secondary-dark: #7A9CA3;
  --color-background: #FFFFFF;
  --color-foreground: #2E2438;
  --color-muted: #F6F3F8;
  --color-muted-teal: #EAF2F3;
  --color-border: #E1D8E8;
  --color-line: #17141A;
}

@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

body {
  font-family: 'Noto Sans Hebrew', sans-serif;
  color: var(--color-foreground);
  background-color: var(--color-background);
}

.font-heading {
  font-family: 'Secular One', 'Noto Sans Hebrew', sans-serif;
}

/* Soft claymorphism: chunky rounded shapes, thin dark outline, soft double shadow */
.clay {
  border: 2px solid var(--color-line);
  border-radius: 20px;
  box-shadow: 4px 4px 0 rgba(23, 20, 26, 0.9), 0 8px 20px rgba(117, 92, 146, 0.15);
}

.clay-btn {
  border: 2px solid var(--color-line);
  border-radius: 16px;
  box-shadow: 3px 3px 0 rgba(23, 20, 26, 0.9);
  transition: transform 150ms ease-out, box-shadow 150ms ease-out;
}

.clay-btn:hover {
  transform: translate(-1px, -1px);
  box-shadow: 4px 4px 0 rgba(23, 20, 26, 0.9);
}

.clay-btn:active {
  transform: translate(1px, 1px);
  box-shadow: 1px 1px 0 rgba(23, 20, 26, 0.9);
}

.gallery-placeholder {
  background-image: repeating-linear-gradient(
    45deg,
    var(--color-muted-teal),
    var(--color-muted-teal) 10px,
    #ffffff 10px,
    #ffffff 20px
  );
}

.bubble {
  position: absolute;
  border-radius: 9999px;
  background: var(--color-secondary);
  opacity: 0.35;
}

/* Services price-list: scrollable card of medium-size price boxes */
.services-scroll {
  max-height: 420px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--color-secondary) var(--color-muted);
}

.services-scroll::-webkit-scrollbar {
  width: 8px;
}

.services-scroll::-webkit-scrollbar-track {
  background: var(--color-muted);
  border-radius: 9999px;
}

.services-scroll::-webkit-scrollbar-thumb {
  background: var(--color-secondary);
  border-radius: 9999px;
}

.service-card {
  border: 2px solid var(--color-line);
  border-radius: 14px;
  background: var(--color-muted);
  padding: 12px 14px;
  box-shadow: 2px 2px 0 rgba(23, 20, 26, 0.9);
}