/* ornaments.css – Masterpiece Armenian Khachkar Motifs (Embossed Stone Relief) */

/* Divider with historical monastery feel (Carved deep into the stone) */
.ornament-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 40px 0;
  gap: 16px;
  opacity: 0.8;
}

.ornament-divider::before,
.ornament-divider::after {
  content: '';
  height: 2px;
  width: 140px;
  /* Simulating a chiseled trench in the stone */
  background: linear-gradient(90deg, transparent, var(--border2), transparent);
  box-shadow: var(--shadow-carved-in);
}

.ornament-divider .motif {
  width: 16px;
  height: 16px;
  background: var(--bg2); /* Same as stone */
  transform: rotate(45deg);
  position: relative;
  /* Outward carved pyramid feel */
  box-shadow: var(--shadow-carved-out);
}
.ornament-divider .motif::before {
  content: '';
  position: absolute;
  inset: 3px;
  border: 1px solid var(--accent);
  opacity: 0.5;
}

/* Background Khachkar Geometric Pattern (Embossed) */
.khachkar-bg {
  position: absolute; inset: 0; pointer-events: none;
}
.khachkar-bg::before {
  content: '';
  position: absolute;
  inset: 0;
  /* Deep Carved geometry logic */
  background-image: 
    linear-gradient(45deg, var(--border2) 25%, transparent 25%, transparent 75%, var(--border2) 75%, var(--border2)),
    linear-gradient(45deg, var(--border2) 25%, transparent 25%, transparent 75%, var(--border2) 75%, var(--border2));
  background-size: 80px 80px;
  background-position: 0 0, 40px 40px;
  opacity: 0.05; /* Barely visible pattern in the stone */
  z-index: 0;
  mix-blend-mode: multiply;
}

/* Elegant Section Outline (Monastery Frame) */
.museum-frame {
  padding: 12px;
  background: var(--bg);
  /* The frame itself sticks out */
  box-shadow: var(--shadow-carved-out);
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
}
/* Inner border looks carved in */
.museum-frame::before {
  content: '';
  position: absolute;
  inset: 8px;
  border: 2px solid var(--bg2);
  box-shadow: var(--shadow-carved-in);
  pointer-events: none;
  z-index: 2;
  border-radius: calc(var(--radius-lg) - 8px);
}

/* Golden text for special emphasis (like gold leaf inlay) */
.text-gold {
  color: var(--accent2);
  font-family: var(--font-display);
  font-style: italic;
  text-shadow: 0px 1px 2px rgba(0,0,0,0.4), 0px -1px 1px rgba(255,255,255,0.2);
}

/* Global button update to mimic stone blocks */
.btn {
  box-shadow: var(--shadow-carved-out);
  transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 16px rgba(51,43,37,0.2), -2px -2px 8px rgba(255, 255, 255, 0.4);
}
.btn:active {
  transform: translateY(1px);
  box-shadow: var(--shadow-carved-in);
}