/* Panel textures for cream/dark bands ("tab" surfaces).
   Music-tech / industrial — no microphone diagram. 2026-09-25-goldpaper-banners */
:root {
  --tex-sawdust: url("MEDIA/IMAGES/TEXTURES/APPROVED/panel-sawdust-press-neutral.webp");
  --tex-foam: url("MEDIA/IMAGES/TEXTURES/APPROVED/panel-acoustic-foam-neutral.webp");
  --tex-felt: url("MEDIA/IMAGES/TEXTURES/APPROVED/panel-industrial-felt-neutral.webp");
  --tex-mesh: url("MEDIA/IMAGES/TEXTURES/APPROVED/panel-perforated-mesh-seamless.webp");
  --tex-grit: url("MEDIA/IMAGES/TEXTURES/APPROVED/panel-grit-fine-neutral.webp");
  --tex-console: url("MEDIA/IMAGES/TEXTURES/APPROVED/panel-brushed-console-neutral.webp");
  --tex-paper: url("MEDIA/IMAGES/TEXTURES/vintage-paper-background.jpeg");
  --tex-paper-grey: url("MEDIA/IMAGES/TEXTURES/APPROVED/panel-paper-grey-on-white.webp");
  --tex-paper-gold: url("MEDIA/IMAGES/TEXTURES/APPROVED/panel-paper-gold-on-white.webp");

  --panel-texture-size: 240px auto;
  --panel-texture-size-foam: 220px auto;
  --panel-texture-opacity-light: .42;
  --panel-texture-opacity-dark: .34;
  --panel-texture-opacity-reviews: .48;
  --panel-texture-opacity-foam: .28;
}

/* Shared positioning / stacking for textured bands */
.proofbox,
.section.light,
.pagebody,
.demo-reel-section,
.pagecta,
.formbox,
.contactbox,
.sound-proof {
  position: relative;
  isolation: isolate;
}

.proofbox::before,
.section.light::before,
.pagebody::before,
.demo-reel-section::before,
.pagecta::before,
.formbox::before,
.contactbox::before,
.sound-proof::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-repeat: repeat;
  background-size: var(--panel-texture-size);
}

.proofbox > *,
.section.light > *,
.pagebody > *,
.demo-reel-section > *,
.pagecta > *,
.formbox > *,
.contactbox > *,
.sound-proof > * {
  position: relative;
  z-index: 1;
}

/* Light banners — same champagne-gold grain over white as .section.light */
.section.light,
.pagebody,
.demo-reel-section,
.proofbox,
#reviews .proofbox {
  background-color: #ffffff;
  background-image: none;
}
.section.light::before,
.pagebody::before,
.demo-reel-section::before,
.proofbox::before,
#reviews .proofbox::before {
  background-image: var(--tex-paper-gold);
  /* Asset already composites gold on white — no multiply (that muddy-grey’d B&W). */
  opacity: .72;
  mix-blend-mode: normal;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  filter: none;
}

/* Dark page CTAs (default) — industrial felt */
.pagecta::before {
  background-image: var(--tex-felt);
  opacity: var(--panel-texture-opacity-dark);
  mix-blend-mode: overlay;
}

/* Studio A/B black CTAs only — acoustic foam */
.pagecta.pagecta--foam::before {
  background-image: var(--tex-foam);
  background-size: var(--panel-texture-size-foam);
  opacity: var(--panel-texture-opacity-foam);
  /* screen: soft-light stays too quiet on #11110f even with boosted tile */
  mix-blend-mode: screen;
}

/* Form / contact panels — industrial felt.
   Site formbox sits on cream: multiply so grain reads (soft-light/overlay vanish on light). */
.formbox::before,
.contactbox::before {
  background-image: var(--tex-felt);
  opacity: .24;
  mix-blend-mode: multiply;
}

/* Listen / sound-proof dark band — industrial felt */
.sound-proof::before {
  background-image: var(--tex-felt);
  opacity: var(--panel-texture-opacity-dark);
  mix-blend-mode: overlay;
}