/* QMAX V139.2 — Restore sidebar, move Why It Works to top navigation,
   and refine hero typography only. No functional architecture changes. */

/* Top-level educational discovery CTA */
.hub-why-it-works-cta {
  min-height: 42px;
  padding: 0 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid rgba(211, 196, 224, .78);
  border-radius: 14px;
  color: #f7f3fa;
  background:
    radial-gradient(circle at 20% 18%, rgba(198, 132, 255, .16), transparent 32%),
    linear-gradient(180deg, rgba(49, 29, 61, .96), rgba(18, 12, 24, .98));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 8px 20px rgba(0,0,0,.25);
  font-family: Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 13px;
  line-height: 1;
  font-weight: 800;
  letter-spacing: .035em;
  cursor: pointer;
  white-space: nowrap;
  transition:
    transform 150ms ease,
    border-color 150ms ease,
    box-shadow 150ms ease,
    filter 150ms ease;
}

.hub-why-it-works-cta > span:first-child {
  color: #c990f4;
  font-size: 14px;
}

.hub-why-it-works-cta:hover {
  transform: translateY(-2px);
  border-color: rgba(244, 236, 250, .96);
  filter: brightness(1.03);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.15),
    0 12px 26px rgba(0,0,0,.32),
    0 0 18px rgba(131, 59, 186, .12);
}

.hub-why-it-works-cta:active {
  transform: translateY(1px);
}

.hub-why-it-works-cta:focus-visible,
.mobile-why-it-works:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 2px #050507,
    0 0 0 5px rgba(181,124,255,.90);
}

/* Responsive equivalent; no change to existing mobile navigation structure. */
.mobile-why-it-works {
  min-height: 44px;
  padding: 0 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 1px solid rgba(211, 196, 224, .75);
  border-radius: 14px;
  color: #f8f4fb;
  background:
    linear-gradient(180deg, rgba(48, 28, 60, .96), rgba(17, 11, 22, .98));
  font-family: Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .025em;
  cursor: pointer;
}

/* Editorial hero refinement:
   image remains primary; typography becomes lighter, narrower, and quieter. */
.hmc-premium-welcome-copy {
  width: min(760px, calc(100% - 72px));
  padding:
    clamp(18px, 2.2vw, 28px)
    clamp(18px, 2.4vw, 30px)
    clamp(18px, 2.3vw, 28px);
  transform: translateY(clamp(-8px, -.75vw, -3px));
}

.hmc-premium-welcome-copy__headline {
  gap: clamp(8px, .8vw, 12px);
  letter-spacing: -.02em;
  text-shadow:
    0 2px 12px rgba(0,0,0,.44),
    0 1px 1px rgba(0,0,0,.34);
}

.hmc-premium-welcome-copy__headline span {
  color: #f3ede5;
  font-size: clamp(28px, 3.2vw, 52px);
  line-height: 1.05;
  font-weight: 650;
}

.hmc-premium-welcome-copy__headline strong {
  color: #f8f3eb;
  font-size: clamp(31px, 3.55vw, 58px);
  line-height: 1.04;
  font-weight: 720;
  text-shadow:
    0 2px 14px rgba(0,0,0,.46),
    0 1px 1px rgba(0,0,0,.34);
}

.hmc-premium-welcome-copy__support {
  max-width: 650px;
  margin-top: clamp(18px, 2vw, 25px);
}

.hmc-premium-welcome-copy__welcome {
  color: rgba(250,247,242,.95);
  font-size: clamp(14px, 1.08vw, 17px);
  line-height: 1.35;
  font-weight: 680;
}

.hmc-premium-welcome-copy__definition {
  max-width: 620px;
  margin-top: 10px;
  color: rgba(246,242,236,.90);
  font-size: clamp(12px, .94vw, 15px);
  line-height: 1.62;
  font-weight: 460;
}

.hmc-premium-welcome-copy__invitation {
  margin-top: clamp(17px, 1.8vw, 22px);
  color: rgba(251,248,243,.94);
  font-size: clamp(12px, .92vw, 14px);
  line-height: 1.5;
  font-weight: 580;
  letter-spacing: .008em;
}

.hmc-premium-welcome-copy__invitation span:not(:last-child)::after {
  color: rgba(211, 184, 227, .70);
}

@media (max-width: 1100px) {
  .hub-why-it-works-cta {
    padding-inline: 14px;
    font-size: 12px;
  }

  .hmc-premium-welcome-copy {
    width: min(720px, calc(100% - 44px));
  }
}

@media (max-width: 900px) {
  .hmc-premium-welcome-copy {
    width: min(88%, 650px);
    transform: none;
  }

  .hmc-premium-welcome-copy__headline span {
    font-size: clamp(29px, 5.4vw, 46px);
  }

  .hmc-premium-welcome-copy__headline strong {
    font-size: clamp(32px, 5.9vw, 51px);
  }
}

@media (max-width: 620px) {
  .hmc-premium-welcome-copy {
    width: calc(100% - 24px);
    padding: 16px 10px;
  }

  .hmc-premium-welcome-copy__headline {
    gap: 7px;
  }

  .hmc-premium-welcome-copy__headline span {
    font-size: clamp(26px, 8.2vw, 39px);
    line-height: 1.06;
  }

  .hmc-premium-welcome-copy__headline strong {
    font-size: clamp(29px, 8.8vw, 43px);
    line-height: 1.05;
  }

  .hmc-premium-welcome-copy__support {
    max-width: 34ch;
    margin-top: 16px;
  }

  .hmc-premium-welcome-copy__definition {
    max-width: 33ch;
    line-height: 1.55;
  }

  .hmc-premium-welcome-copy__invitation {
    max-width: 28ch;
    gap: 5px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hub-why-it-works-cta,
  .mobile-why-it-works {
    transition: none;
  }

  .hub-why-it-works-cta:hover,
  .hub-why-it-works-cta:active {
    transform: none;
  }
}