body {
  --jacquard-surface-pattern: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Crect width='180' height='180' fill='none'/%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='.34' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M90 14 C104 30 104 48 90 64 C76 48 76 30 90 14Z'/%3E%3Cpath d='M90 166 C104 150 104 132 90 116 C76 132 76 150 90 166Z'/%3E%3Cpath d='M14 90 C30 76 48 76 64 90 C48 104 30 104 14 90Z'/%3E%3Cpath d='M166 90 C150 76 132 76 116 90 C132 104 150 104 166 90Z'/%3E%3Cpath d='M90 58 C112 70 126 78 138 90 C126 102 112 110 90 122 C68 110 54 102 42 90 C54 78 68 70 90 58Z'/%3E%3Cpath d='M56 56 C70 64 80 74 90 90 C100 74 110 64 124 56'/%3E%3Cpath d='M56 124 C70 116 80 106 90 90 C100 106 110 116 124 124'/%3E%3C/g%3E%3Cg fill='%23ffffff' fill-opacity='.16'%3E%3Ccircle cx='90' cy='90' r='7'/%3E%3Ccircle cx='90' cy='14' r='3'/%3E%3Ccircle cx='90' cy='166' r='3'/%3E%3Ccircle cx='14' cy='90' r='3'/%3E%3Ccircle cx='166' cy='90' r='3'/%3E%3C/g%3E%3C/svg%3E");
  position: relative;
  min-height: 100vh;
  background:
    var(--jacquard-surface-pattern),
    radial-gradient(circle at 50% 0%, rgba(255,250,241,.42), transparent 28rem),
    linear-gradient(180deg, #9fc8c5 0%, #7faba9 46%, #6d9b98 100%);
  background-size: 180px 180px, auto, auto;
  background-repeat: repeat, no-repeat, no-repeat;
}

.hero {
  background:
    linear-gradient(rgba(127,171,169,.06), rgba(111,157,154,.12)),
    var(--jacquard-surface-pattern),
    radial-gradient(circle at 50% 35%, rgba(255,250,241,.5), transparent 0 15rem),
    linear-gradient(145deg, #a7cbc8, #7faba9 55%, #689693);
  background-size: auto, 190px 190px, auto, auto;
  background-repeat: no-repeat, repeat, no-repeat, no-repeat;
}

section {
  background:
    linear-gradient(rgba(255,250,241,.68), rgba(255,250,241,.82)),
    var(--jacquard-surface-pattern),
    linear-gradient(135deg, #a7cbc8, #7faba9);
  background-size: auto, 170px 170px, auto;
  background-repeat: no-repeat, repeat, no-repeat;
}

.gallery div {
  background:
    linear-gradient(rgba(76,125,122,.16), rgba(76,125,122,.32)),
    var(--jacquard-surface-pattern),
    var(--ribbon-pattern);
  background-size: auto, 150px 150px, 64px auto;
  background-repeat: no-repeat, repeat, repeat;
}