.showcase { background: var(--color-latte); }
.showcase__text { --stack-gap: 1.25rem; max-width: 40rem; margin-inline: auto; }
.showcase__form { display: grid; gap: 1.25rem; }
@media (min-width: 900px) { .showcase__form { grid-template-columns: 1fr 1.3fr; align-items: center; } }
.showcase__hoop {
  position: relative; display: grid; place-items: center; min-height: 9rem;
  border-radius: var(--radius-panel); background: var(--media-tint);
}
.showcase__hoop::before { content: ''; position: absolute; inset: 14px 18px; border: 1.5px dashed rgb(56 56 47 / 0.25); border-radius: var(--radius-control); }
.showcase__preview { position: relative; max-width: 100%; padding-inline: 1rem; font-family: var(--font-script); font-size: clamp(2.5rem, 2rem + 2vw, 3.75rem); line-height: 1.2; color: var(--color-oliva-scura); overflow-wrap: anywhere; text-align: center; }
.showcase .button { align-self: flex-start; }
