:root {
  /* Desktop logos */
  --height-logo-header: 80px;
  --height-logo-footer: 120px;
  --height-logo-footer-creators: 50px;

  /* Mobile logos */
  --height-logo-mobile-header: 50px;
  --height-logo-tablet-footer: 70px;
  --height-logo-mobile-footer: 70px;
  --height-logo-tablet-footer-creators: 35px;
  --height-logo-mobile-footer-creators: 30px;

  /* Logo colours */
  --gcg-wordmark-colour: #151618;

  /* Tryst logo colours */
  --tryst-wordmark-colour: #000000;
  --tryst-pin-colour: #666666;
  --tryst-heart-colour: #333333;

  /* Satisfaction Project logo colours */
  --sp-dark-colour: #000000;
  --sp-light-colour: #666666;

  /* Created by alignment */
  --left-padding-created-desktop: 5em;
  --left-padding-created-tablet: 2.8em;
  --left-padding-created-mobile: 3em;
}

/* Logos */
.wordmark path {
  fill: var(--gcg-wordmark-colour);
}

.divider path {
  opacity: 0.5;
}

/* Footer */
.footer-logo svg {
  width: auto;
  height: var(--height-logo-footer);
}

.footer-creators {
  padding-left: var(--left-padding-created-desktop);
}

.footer-creators p {
  font-style: italic;
  opacity: 0.6;
  margin-bottom: 12px;
  font-size: 80%;
}

.footer-creators svg {
  height: var(--height-logo-footer-creators);
  opacity: 0.6;
}

.footer-creators .tryst-logo {
  padding-right: 2em;
}

.tryst-logo .wordmark path,
.tryst-logo .wordmark polygon {
  fill: var(--tryst-wordmark-colour);
}

.tryst-logo .heart {
  fill: var(--tryst-heart-colour);
}

.tryst-logo .heart-pin {
  fill: var(--tryst-pin-colour);
}

.tsp-logo .the,
.tsp-logo .project {
  fill: var(--sp-light-colour);
}

.tsp-logo .satisfaction {
  fill: var(--sp-dark-colour);
}

/*.dark-mode .wordmark path,
.auto-dark-mode .wordmark path,
.partial-dark-mode .wordmark path {
  fill: #fff;
}

.dark-mode .divider path,
.auto-dark-mode .divider path,
.partial-dark-mode .divider path {
  fill: #fff;
}

.dark-mode .tryst-logo .wordmark path,
.auto-dark-mode .tryst-logo .wordmark path,
.partial-dark-mode
  .tryst-logo
  .wordmark
  path
  .dark-mode
  .tryst-logo
  .wordmark
  polygon,
.auto-dark-mode .tryst-logo .wordmark polygon,
.partial-dark-mode .tryst-logo .wordmark polygon {
  fill: #fff;
}

.dark-mode .tsp-logo .the,
.auto-dark-mode .tsp-logo .the,
.patial-dark-mode .tsp-logo .the,
.dark-mode .tsp-logo .project,
.auto-dark-mode .tsp-logo .project,
.patial-dark-mode .tsp-logo .project {
  fill: #fff;
}*/

.tsp-videos .special-wrap {
  grid-template-columns: repeat(3, 1fr);
}

.tsp-videos .item-image.global-image-orientation {
  aspect-ratio: 16/9;
}

@media (max-width: 769px) {
  .footer-logo {
    margin-bottom: 20px;
  }

  .footer-logo .is-logo svg {
    height: var(--height-logo-tablet-footer);
  }

  .footer-creators {
    padding-left: var(--left-padding-created-tablet);
    padding-bottom: 2em;
  }

  .footer-creators svg {
    height: var(--height-logo-tablet-footer-creators);
  }

  .footer-creators .tryst-logo {
    padding-right: 1em;
  }
}

@media (max-width: 480px) {
  .header-logo .is-logo svg {
    height: var(--height-logo-mobile-header);
  }

  .tsp-videos .special-wrap {
    grid-template-columns: repeat(1, 1fr);
  }

  .tsp-videos .special-wrap .item:not(:last-child) {
    margin-bottom: 1em;
  }

  .footer-logo {
    margin-bottom: 15px;
  }

  .footer-logo .is-logo svg {
    height: var(--height-logo-mobile-footer);
  }

  .footer-creators {
    padding-left: var(--left-padding-created-mobile);
  }

  .footer-creators svg {
    height: var(--height-logo-mobile-footer-creators);
  }
}
