/* referral.html — 2-col media + form */
.ref-grid { display:grid; grid-template-columns:1fr; gap:32px; align-items:center; }
.ref-media img { width:100%; border-radius:18px; box-shadow:var(--shadow-lg); object-fit:cover; }
.ref-form-wrap { background:#fff; }
.ref-form { display:grid; gap:14px; }
.field { display:flex; flex-direction:column; gap:7px; }
.field label { font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--fg-subtle); }
.field input { font-family:inherit; font-size:16px; min-height:48px; padding:13px 14px; border:1.5px solid var(--border); border-radius:9px; outline:none; background:#fff; color:var(--fg); transition:border .12s, box-shadow .12s; }
.field input:focus { border-color:var(--green); box-shadow:0 0 0 3px rgba(28,190,114,.15); }
.ref-form .btn { margin-top:6px; }
@media (min-width:768px){ .ref-grid { grid-template-columns:.9fr 1.1fr; gap:48px; } }