/* ===================================================
   Texture & Filigree
   Cassie & Louis · November 22, 2026

   Ambient paper grain and the gothic corner flourish.
   Palette lives entirely in css/styles.css :root — this
   file no longer carries theme variants.
   =================================================== */

/* ============ Paper Texture ============
   Fractal-noise grain from an inline SVG filter — no image asset,
   no network request. Blend mode flips so it reads as tooth on
   both dark cardstock and light parchment instead of muddying one. */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 997;
  pointer-events: none;
  opacity: 0.035;
  mix-blend-mode: screen;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ============ Filigree Corners ============
   One gothic scrollwork <symbol> (defined once in index.html),
   echoed at low opacity in the gate and hero corners — the two
   moments that most directly mirror the save-the-date's framed
   card layout. Mirrored via scaleX(-1) for the right-hand corners
   so one drawing serves all four placements site-wide. */
.filigree-corner {
  position: absolute;
  width: 96px;
  height: 96px;
  color: var(--subtle);
  opacity: 0.3;
  pointer-events: none;
  z-index: 0;
}

.filigree-corner--tl { top: 1.5rem;  left: 1.5rem; }
.filigree-corner--tr { top: 1.5rem;  right: 1.5rem; transform: scaleX(-1); }
.filigree-corner--bl { bottom: 1.5rem; left: 1.5rem; transform: scaleY(-1); }
.filigree-corner--br { bottom: 1.5rem; right: 1.5rem; transform: scale(-1, -1); }

@media (max-width: 600px) {
  .filigree-corner {
    width: 52px;
    height: 52px;
    opacity: 0.22;
  }
}