/* Soft, matte fabric depth for the white and silver brand surfaces. */
:root {
  --fabric-texture: url("assets/fh-fabric-texture.webp");
}

body,
.header {
  background-color: #fff;
  background-image:
    linear-gradient(to bottom, #fff, rgb(255 255 255 / 86%) 12%, rgb(255 255 255 / 86%) 88%, #fff),
    linear-gradient(to right, #fff, transparent 8%, transparent 92%, #fff),
    var(--fabric-texture);
  background-position: center top;
  background-size: 1600px 1066.6667px;
  background-repeat: repeat;
}

.story-section,
.services-section,
.video-section {
  --muted: #474b53;
  background-color: var(--section-silver);
  background-image:
    linear-gradient(to bottom, #d0d2d7, rgb(208 210 215 / 66%) 12%, rgb(208 210 215 / 66%) 88%, #d0d2d7),
    linear-gradient(to right, #d0d2d7, transparent 8%, transparent 92%, #d0d2d7),
    var(--fabric-texture);
  background-blend-mode: normal, normal, multiply;
  background-position: center top;
  background-size: 1600px 1066.6667px;
  background-repeat: repeat;
}

/* The white artwork canvas blends into the fabric beneath the mark. */
.brand-logo {
  mix-blend-mode: multiply;
}

@media (max-width: 620px) {
  body,
  .header,
  .story-section,
  .services-section,
  .video-section {
    background-size: 900px 600px;
  }
}