/* Cresco mobile fixes.
   Deliberately NOT in uploads/cresco-ui/parts/, because cresco-ui.php globs
   that folder and enqueues everything in it early, where these rules lose.
   Selectors here are one class-repeat above the rules they correct, so they
   win on specificity rather than on load order. */

/* The .split global class has a correct mobile override (1fr at max-width 900),
   but .split.split--copy sets 1.05fr .95fr at the same specificity with no
   mobile counterpart and lands later in the cascade, so split sections stayed
   two columns of ~167px and ~151px on a phone. */
@media (max-width: 900px) {
  .split.split--copy.split--copy { grid-template-columns: 1fr; }
}

/* A <button> does not inherit font-family, so the gallery "extra" control was
   rendering in Chrome's default UI face (Arial) instead of the site's mono. */
.gallery__extra.gallery__extra {
  font-family: var(--font-mono, "IBM Plex Mono", ui-monospace, SFMono-Regular, monospace);
  font-size: inherit;
  letter-spacing: inherit;
}

/* The body texture was a 1,165KB PNG loading on every page, four to five times
   heavier than any photograph on the site. It is stretched with background-size
   cover under a dark gradient overlay, never tiled, so fine detail is mostly
   invisible. WebP at q40 is visually identical at 286KB. Noise compresses badly
   even in WebP, so this is close to the floor for the same image.
   Declared here rather than in flat.css because that file is regenerated by
   the prototype converter and a hand edit would be lost. */
body {
  background-image:
    linear-gradient(
      color-mix(in srgb, var(--dark) 60%, transparent),
      color-mix(in srgb, var(--dark) 20%, transparent)
    ),
    url('/wp-content/uploads/cresco-proto/assets/img/bg-texture.webp');
}