.referral-page { background: var(--black); }
.referral-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,500px); align-items:center; gap:clamp(3rem,6vw,7rem); padding-block:clamp(3.5rem,6vw,6rem); }
.referral-intro { min-width:0; }
.referral-intro .eyebrow { margin-bottom:2.5rem; }
.referral-intro h1 { margin:0; font-size:clamp(3.4rem,5.15vw,5.8rem); line-height:1.055; letter-spacing:-.067em; font-weight:400; }
.referral-accent { color:var(--acid); }
.referral-lead { max-width:540px; margin:1.7rem 0 0; color:#e3e7e5; font-size:clamp(1.1rem,1.6vw,1.3rem); line-height:1.55; }
.referral-start-link { margin-top:2rem; min-width:210px; }
.referral-bonus { max-width:460px; margin:2rem 0 0; color:#bdc9c4; font-size:.95rem; line-height:1.6; }
.referral-bonus strong { color:var(--acid); font-weight:500; }
.referral-card { min-width:0; padding:clamp(1.5rem,3vw,2.5rem); border:1px solid #3a527a; background:var(--cobalt); scroll-margin-top:2rem; }
.referral-card-kicker { margin:0 0 1.3rem; color:var(--acid); font:500 .7rem/1.5 var(--mono); letter-spacing:.06em; text-transform:uppercase; }
.referral-card h2 { margin:0; font-size:clamp(2.4rem,3.5vw,3.2rem); line-height:1.1; letter-spacing:-.05em; font-weight:400; }
.referral-card-copy { margin:1rem 0 0; color:#d5deec; font-size:1rem; line-height:1.6; }
.referral-card form { display:grid; gap:1rem; margin-top:2rem; }
.referral-card .field { min-width:0; gap:.65rem; }
.referral-card .field input { min-height:54px; border-color:#8ca0bb; background:#ffffff0f; }
.referral-card .field input::placeholder { color:#aabbd3; opacity:1; }
.referral-submit { width:100%; min-height:58px; cursor:pointer; }
.referral-submit:disabled { opacity:.7; cursor:wait; transform:none; }
.referral-submit-note { margin:0; color:#c0cde0; font-size:.78rem; line-height:1.55; }
.referral-card .reward-note { border-top:1px solid #ffffff40; margin:1.75rem 0 0; padding-top:1.25rem; font-size:.75rem; line-height:1.6; }
.referral-status { margin:1rem 0 0; padding:.85rem 1rem; border:1px solid #ffb6bf; background:#472433; color:#fff; font-size:.86rem; line-height:1.5; }
.referral-status[hidden] { display:none; }
@media(max-width:920px) { .referral-layout { grid-template-columns:1fr; gap:2.5rem; } .referral-intro h1 { font-size:clamp(3.25rem,8vw,5.7rem); } .referral-card { width:100%; max-width:640px; } }
@media(max-width:600px) { .referral-layout { padding-block:2.5rem 3.5rem; } .referral-intro .eyebrow { margin-bottom:1.7rem; } .referral-intro h1 { font-size:clamp(2.8rem,10vw,3.8rem); } .referral-bonus { margin-top:1.4rem; } }