/* ============================================================
   HeroCopy (.c-hero-copy)
   Rendered on dark hero backgrounds. Copy locked to the approved
   messaging; the Op 1 / Op 2 variant switcher is retired.
   Structure unified with the product-template hero
   (.pr-hero__copy in pages/product.css): identity pill ·
   display title · hairline row (sub + action).
   ============================================================ */

/* product identity pill: glyph tile + name */
.c-hero-copy__id {
  display: flex;
  align-items: center;
  gap: 12px;
}
.c-hero-copy__glyph {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: var(--radius-md);
  border: 1px solid rgba(255, 255, 255, 0.16);
  background:
    radial-gradient(120% 120% at 20% 0%, color-mix(in oklab, var(--color-x3-blue-deep) 55%, transparent), transparent 70%),
    rgba(255, 255, 255, 0.04);
  color: var(--color-white);
}
.c-hero-copy__glyph .ds-icon {
  width: 20px;
  height: 20px;
}
.c-hero-copy__name {
  font-family: var(--font-display);
  font-weight: 500;
  letter-spacing: var(--track-tight);
  font-size: var(--fs-xl);
  color: var(--color-white);
}

.c-hero-copy__title {
  margin-top: 28px;
  max-width: 26ch;
  font-weight: 500;
  letter-spacing: var(--track-tighter);
  font-size: 10.5vw;
  line-height: 0.98;
}
@media (min-width: 640px) { .c-hero-copy__title { font-size: 7vw; } }
@media (min-width: 1024px) { .c-hero-copy__title { font-size: clamp(40px, 4.3vw, 62px); } }

.c-hero-copy__row {
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin-top: 36px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  padding-top: 28px;
}

.c-hero-copy__subtitle {
  max-width: 576px;
  font-size: var(--fs-body);
  line-height: var(--leading-body);
  color: rgba(255, 255, 255, 0.75);
}
@media (min-width: 640px) { .c-hero-copy__subtitle { font-size: var(--fs-body); } }

.c-hero-copy__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}