.eyebrow {
  margin: 0 0 22px;

  font-family: "Inter", sans-serif;
  font-size: 10px;
  font-weight: 700;

  letter-spacing: 0.48em;
  text-transform: uppercase;

  color: rgba(182, 196, 255, 0.72);
}

h1 {
  margin: 0;

  font-family: "Cormorant", serif;

  font-size: clamp(68px, 9vw, 150px);
  font-weight: 700;

  line-height: 0.86;
  letter-spacing: -0.06em;

  background:
    linear-gradient(
      100deg,
      #ffffff 0%,
      #f3f3f3 22%,
      #fff6df 38%,
      #ffffff 52%,
      #d7deff 68%,
      #ffffff 100%
    );

  background-size: 240% 240%;

  -webkit-background-clip: text;
  background-clip: text;

  -webkit-text-fill-color: transparent;

  animation: metallicShift 8s ease-in-out infinite;

  text-shadow:
    0 6px 28px rgba(0,0,0,0.28);
}

.subtitle {
  margin: 32px 0 0;

  max-width: 780px;

  font-family: "Inter", sans-serif;
  font-size: clamp(12px, 1.1vw, 16px);
  font-weight: 500;

  line-height: 1.9;
  letter-spacing: 0.18em;

  text-transform: uppercase;

  color: rgba(255, 236, 205, 0.78);
}

.hero-actions {
  margin-top: 36px;

  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.hero-actions a,
.hero-actions span {
  display: inline-flex;

  align-items: center;
  justify-content: center;

  min-height: 40px;
  padding: 12px 18px;

  border-radius: 999px;

  font-family: "Inter", sans-serif;
  font-size: 10px;
  font-weight: 800;

  letter-spacing: 0.2em;
  text-transform: uppercase;

  backdrop-filter: blur(18px);
}

.hero-actions a {
  color: #0a0a0a;

  background:
    linear-gradient(
      135deg,
      #ffffff 0%,
      #efe1bc 55%,
      #d9c7ff 100%
    );

  box-shadow:
    0 12px 42px rgba(255,255,255,0.08),
    inset 0 1px 0 rgba(255,255,255,0.9);
}

.hero-actions span {
  color: rgba(255,255,255,0.62);

  border: 1px solid rgba(255,255,255,0.16);

  background: rgba(255,255,255,0.045);
}

@keyframes metallicShift {

  0% {
    background-position: 0% 50%;
  }

  50% {
    background-position: 100% 50%;
  }

  100% {
    background-position: 0% 50%;
  }
}

@media (max-width: 900px) {

  h1 {
    font-size: clamp(58px, 18vw, 118px);
  }

  .subtitle {
    max-width: 94%;

    font-size: 11px;
    line-height: 1.7;

    letter-spacing: 0.12em;
  }
}