.wrap { max-width: 960px; margin: 0 auto; padding: var(--space-l) var(--space-m) 24px; }
.intro { margin-bottom: var(--space-l); }
.intro h1 { font-size: clamp(1.6rem, 5vw, 2.2rem); }

.layout { display: grid; gap: var(--space-l); grid-template-columns: 1fr; }
@media (min-width: 820px) { .layout { grid-template-columns: 1.4fr 1fr; align-items: start; } .preview { position: sticky; top: 16px; } }

.form { display: flex; flex-direction: column; gap: var(--space-m); }
.field { display: flex; flex-direction: column; gap: 6px; border: 0; padding: 0; margin: 0; min-width: 0; }
.field > span, .field legend { font-family: var(--font-heading); font-weight: 500; padding: 0; }
.field em { font-style: normal; font-family: var(--font-body); font-size: .85rem; }
.row2 { display: grid; gap: var(--space-m); grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.row3 { display: grid; gap: var(--space-s); grid-template-columns: .8fr 1.4fr 1fr; }

input, select {
  font: inherit; font-size: 1rem; color: var(--text-primary);
  padding: 12px 14px; border: 1.5px solid #E2E2E2; border-radius: var(--radius-button); background: #fff;
  width: 100%; min-width: 0;
}
input:focus, select:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px var(--color-primary-soft); }
input[aria-invalid="true"], select[aria-invalid="true"] { border-color: #E53935; }

.consent { display: flex; gap: var(--space-s); align-items: flex-start; font-size: .92rem; line-height: 1.55; background: var(--color-cream); padding: var(--space-m); border-radius: var(--radius-button); }
.consent input { width: 22px; height: 22px; flex: none; margin-top: 2px; accent-color: var(--color-primary); }
.consent a { color: var(--color-primary); }

.error { color: #C62828; margin: 0; font-weight: 500; }
.btn-big { font-size: 1.1rem; padding: 15px 28px; align-self: stretch; }

.preview { text-align: center; }
.preview img { width: 70%; max-width: 240px; aspect-ratio: 1; object-fit: contain; transition: opacity .3s, transform .3s, filter .3s; }
.preview img.dim { filter: grayscale(1) brightness(1.15); opacity: .35; }
.preview img.pop { transform: scale(1.06); }
.pv-z { font-family: var(--font-heading); font-weight: 700; font-size: 1.4rem; color: var(--color-primary); margin: var(--space-s) 0 4px; }
