/* Quasar name artwork v1. Independent of the approved product opening. */
.quasar-story { background: #211e1f; scroll-margin-top: 72px; }
.quasar-origin {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #171516;
  border-block: 1px solid rgba(255,242,135,.14);
}
.quasar-origin__image {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.quasar-origin::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(90deg,rgba(23,21,22,.91),rgba(23,21,22,.82) 32%,rgba(23,21,22,.62) 58%,rgba(23,21,22,.18) 92%);
}
.quasar-origin__inner { display: flex; align-items: flex-start; gap: 48px; min-height: clamp(430px,35vw,520px); padding-block: 64px; }
.quasar-origin__copy { flex-shrink: 0; width: min(42%,440px); }
.quasar-origin .eyebrow { font-size: .75rem; letter-spacing: .18em; margin-bottom: 18px; }
.quasar-origin h2 { max-width: 19ch; margin-bottom: 24px; color: #f1eee6; font-size: clamp(2rem,3.4vw,3rem); line-height: 1.1; letter-spacing: -.025em; }
.quasar-origin__copy > p:not(.eyebrow) { max-width: 44ch; color: #e1dbd1; font-size: 1rem; line-height: 1.65; }
.quasar-story__purpose { flex: 1; display: flex; flex-direction: column; gap: 20px; padding-top: calc(.75rem + 18px + clamp(2rem,3.4vw,3rem) * 1.1 + 24px); color: #c4bfb9; font-size: .95rem; line-height: 1.65; }
@media (min-width: 701px) and (max-width: 1000px) {
  .quasar-origin__copy { width: min(48%,420px); }
  .quasar-origin__inner { gap: 32px; }
  .quasar-origin::before { background: linear-gradient(90deg,rgba(23,21,22,.97),rgba(23,21,22,.88) 38%,rgba(23,21,22,.68) 62%,rgba(23,21,22,.2) 92%); }
}
@media (max-width: 700px) {
  .quasar-origin__image { position: relative; z-index: 0; height: auto; aspect-ratio: 8 / 5; object-fit: cover; object-position: 78% center; }
  .quasar-origin::before { display: none; }
  .quasar-origin__inner { flex-direction: column; align-items: flex-start; gap: 24px; min-height: 0; padding-block: 30px 34px; }
  .quasar-origin__copy { flex-shrink: unset; width: 100%; }
  .quasar-origin h2 { max-width: 21ch; margin-bottom: 20px; font-size: 2rem; }
  .quasar-story__purpose { gap: 16px; }
}
