@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/manrope-400.ttf') format('truetype');
}

@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/manrope-500.ttf') format('truetype');
}

@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/manrope-600.ttf') format('truetype');
}

@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/manrope-700.ttf') format('truetype');
}

@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('../fonts/manrope-800.ttf') format('truetype');
}

body {
  background: #fff;
  color: #061632;
}

.grid-bg {
  background-image:
    linear-gradient(rgba(8, 104, 247, .05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(8, 104, 247, .05) 1px, transparent 1px);
  background-size: 30px 30px;
}

.legal-grid {
  background-image:
    linear-gradient(rgba(255, 255, 255, .07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .07) 1px, transparent 1px);
  background-size: 32px 32px;
}

.glow {
  background: radial-gradient(circle, rgba(42, 147, 255, .2), transparent 68%);
}

.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: .7s cubic-bezier(.2, .8, .2, 1);
}

.reveal.show {
  opacity: 1;
  transform: none;
}

@keyframes float {
  50% {
    transform: translateY(-8px);
  }
}

.float {
  animation: float 4s ease-in-out infinite;
}

details[open] .plus {
  transform: rotate(45deg);
}

#klaro {
  font-family: Manrope, sans-serif;
}

#klaro .cookie-modal .cm-modal,
#klaro .cookie-notice:not(.cookie-modal-notice) {
  border-radius: 1rem;
}

#klaro .cookie-modal .cm-btn.cm-btn-success,
#klaro .context-notice .cm-btn.cm-btn-success,
#klaro .cookie-notice .cm-btn.cm-btn-success {
  background: #0868f7;
}

#klaro .cookie-modal .cm-list-input:checked + .cm-list-label .slider,
#klaro .context-notice .cm-list-input:checked + .cm-list-label .slider,
#klaro .cookie-notice .cm-list-input:checked + .cm-list-label .slider {
  background: #0868f7;
}
