.island-brand-wordmark {
  display: inline-flex;
  align-items: center;
  gap: .26em;
  flex-shrink: 0;
  font-family: var(--font-inter), sans-serif;
  font-size: var(--island-wordmark-size, 22px);
  font-weight: 650;
  line-height: 1;
  letter-spacing: -.055em;
  white-space: nowrap;
}
.island-brand-wordmark svg { display: block; flex-shrink: 0; width: 1.16em; height: 1.16em; overflow: visible; }
.island-brand-red { fill: var(--island-spark-red, #d7184e); }
.island-brand-blue { fill: var(--island-spark-blue, #1d5eb8); }
.island-brand-gold { fill: var(--island-spark-gold, #eaa80b); }
.island-brand-green { fill: var(--island-spark-green, #159e85); }
.island-brand-lettering { position: relative; }
.island-brand-lettering::after {
  content: attr(data-text);
  position: absolute;
  inset: 0;
  pointer-events: none;
  color: transparent;
  background: linear-gradient(110deg, transparent 38%, #91c9e7 50%, transparent 62%) 180% 0 / 240% 100% no-repeat;
  background-clip: text;
  -webkit-background-clip: text;
  opacity: 0;
  animation: island-letter-glint 12s ease-in-out infinite;
}
@keyframes island-letter-glint {
  0%, 5% { background-position: 180% 0; opacity: 0; }
  7% { opacity: 1; }
  17% { background-position: -80% 0; opacity: 1; }
  19%, 100% { background-position: -80% 0; opacity: 0; }
}

/* Visible from the first moment, with still lettering and fixed header geometry. */
.island-brand-wordmark svg path, .island-brand-twinkle path {
  transform-box: fill-box;
  transform-origin: center;
  animation: island-sparkle 3.6s cubic-bezier(.4,0,.2,1) infinite;
}
.island-brand-wordmark svg .island-brand-red, .island-brand-twinkle .island-brand-red { --spark-scale: 1.22; --spark-turn: 10deg; animation-delay: -.7s; }
.island-brand-wordmark svg .island-brand-blue, .island-brand-twinkle .island-brand-blue { --spark-scale: 1.35; --spark-turn: -12deg; animation-delay: -1.3s; }
.island-brand-wordmark svg .island-brand-gold, .island-brand-twinkle .island-brand-gold { --spark-scale: 1.42; --spark-turn: 18deg; animation-delay: -1.9s; }
.island-brand-wordmark svg .island-brand-green, .island-brand-twinkle .island-brand-green { --spark-scale: 1.5; --spark-turn: -18deg; animation-delay: -3s; }
@keyframes island-sparkle {
  0%, 100% { transform: scale(.84) rotate(-6deg); opacity: .58; }
  45% { transform: scale(var(--spark-scale)) rotate(var(--spark-turn)); opacity: 1; }
  72% { transform: scale(1) rotate(0deg); opacity: .92; }
}
@media (prefers-reduced-motion: reduce) {
  .island-brand-wordmark svg path, .island-brand-twinkle path { animation: none; transform: none; opacity: 1; }
  .island-brand-lettering::after { animation: none; opacity: 0; }
}

@font-face {
  font-family: MauritiusWordmark;
  src: url('/fonts/inter-wordmark.woff2') format('woff2');
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}
a.brand > .island-brand-wordmark {
  --font-inter: MauritiusWordmark;
  color: #1c4662;
  font-size: var(--island-wordmark-size, 22px);
  font-weight: 650;
  line-height: 1;
  letter-spacing: -.055em;
}
@media (max-width: 760px) {
  .header .brand .island-brand-wordmark { --island-wordmark-size: 20px; }
}
