/* KAGO site enhancement layer - subtle texture + depth on the Hallmark system.
 * Self-contained (inline SVG noise, no CDN). Loaded on every page after the inline styles.
 * Princess doctrine: material warmth at low opacity, no hard edges, never overwhelming.
 */

/* 1. Film grain over the whole page - premium paper/photographic texture.
   Inline fractal-noise SVG, fixed, pointer-events off, very low opacity. */
body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 70;
  pointer-events: none;
  opacity: 0.05;
  mix-blend-mode: soft-light;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 240px 240px;
}

/* 2. Warm paper grain on the cream body sections - felt, not seen. */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: 0.5;
  background-image:
    radial-gradient(1200px 700px at 88% -8%, color-mix(in srgb, var(--ochre) 6%, transparent), transparent 60%),
    radial-gradient(1000px 800px at -10% 12%, color-mix(in srgb, var(--clay) 5%, transparent), transparent 55%);
}

/* 3. Depth on the dark (ink) bands - a faint grain + inner light so flat navy reads as material.
   Applies to common dark blocks across the pages without touching their own rules. */
.mhero, .bundles-sec, footer, .cta, .band, section.ink, .darkband {
  position: relative;
}
.mhero::after, .bundles-sec::after, footer::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: 0.4;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='d'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23d)' opacity='0.6'/%3E%3C/svg%3E");
  mix-blend-mode: overlay;
}
/* keep the dark bands' own content above their grain */
.mhero > *, .bundles-sec > *, footer > * { position: relative; z-index: 1; }

/* 4. Hairline top light on cards - a touch of dimensionality on hover-lift cards. */
.item, .bundle, .tier {
  box-shadow: inset 0 1px 0 color-mix(in srgb, #ffffff 40%, transparent);
}

@media (prefers-reduced-motion: reduce) {
  body::after, body::before { background-attachment: scroll; }
}