.product { --bleed: 8vh; position: relative; padding: 12vh var(--raw-spacing-page); }
.product__tabs, .product__panels { max-width: 78rem; margin-inline: auto; }
.product__tabs { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1.5rem; }
.product__tab {
  padding: 0.75rem 1rem;
  min-height: 2.75rem;
  border: 1px solid var(--border-soft);
  border-radius: var(--raw-radius-sm);
  color: var(--foreground-muted);
  text-transform: none;
  letter-spacing: 0;
}
.product__tab[aria-selected="true"] { color: var(--foreground); background: var(--surface-glass); border-color: var(--border-signal); }
.product__tab:hover { color: var(--foreground); }
.product__panel { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1fr); gap: 3rem; align-items: center; min-height: 26rem; }
.product__panel[hidden] { display: none; }
.product__step { display: flex; flex-direction: column; gap: 1rem; min-width: 0; }
.product__n { color: var(--foreground-signal); }
.product__title { color: var(--foreground); font-size: 2.5rem; line-height: 1.05; }
.product__body { color: var(--foreground-muted); max-width: 30rem; }
.product__stage { min-width: 0; }
.product__panel:focus-visible { outline: 1px solid var(--border-signal); outline-offset: 0.5rem; }
@media (max-width: 1024px) {
  .product__panel { min-height: 0; grid-template-columns: 1fr; gap: 1.5rem; }
  .product__stage { width: 100%; max-width: 42rem; margin-inline: auto; }
  .product__title { font-size: 2rem; }
  .product__body { font-size: 1rem; line-height: 1.5; }
}
@media (max-width: 640px) {
  .product__tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .product__tab { padding: 0.6rem; font-size: 0.8rem; line-height: 1.3; }
  .product__step { min-height: 12rem; }
}