:root {
    --affiliate-navy: #032a4c;
    --affiliate-navy-deep: #021f38;
    --affiliate-blue: #0b73b7;
    --affiliate-cyan: #19a9df;
    --affiliate-ink: #071f34;
    --affiliate-muted: #708497;
    --affiliate-line: #d5e1ea;
    --affiliate-bg: #f3f7fa;
}

* { box-sizing: border-box; }
html, body { min-height: 100%; }
body.affiliate-page { margin: 0; color: var(--affiliate-ink); background: var(--affiliate-bg); font-family: "Inter", sans-serif; }
.affiliate-shell { display: grid; grid-template-columns: minmax(460px, 46%) minmax(520px, 54%); min-height: 100vh; }

.affiliate-story { position: relative; display: flex; flex-direction: column; min-height: 100vh; padding: 38px clamp(38px, 4.6vw, 76px) 30px; overflow: hidden; color: #fff; background: linear-gradient(140deg, var(--affiliate-navy-deep), #064a7c); }
.affiliate-story::before { content: ""; position: absolute; top: -34%; right: -32%; width: 76%; aspect-ratio: 1; border: 1px solid rgba(40,184,235,.22); border-radius: 50%; box-shadow: 0 0 0 90px rgba(40,184,235,.04), 0 0 0 180px rgba(40,184,235,.025); }
.affiliate-story::after { content: ""; position: absolute; left: 0; bottom: 0; width: 7px; height: 38%; background: var(--affiliate-cyan); }
.affiliate-brandbar, .affiliate-story-copy, .affiliate-story-footer { position: relative; z-index: 1; }
.affiliate-brandbar { display: flex; align-items: center; justify-content: space-between; }
.affiliate-brandbar img { display: block; width: 138px; height: auto; filter: brightness(0) invert(1); }
.affiliate-login-link { display: inline-flex; align-items: center; gap: 8px; color: rgba(255,255,255,.76); font-size: 12px; font-weight: 700; text-decoration: none; }
.affiliate-login-link:hover { color: #fff; }
.affiliate-story-copy { width: 100%; max-width: 610px; margin: auto 0; padding: 54px 0 46px; }
.affiliate-eyebrow, .affiliate-step { display: block; color: #67cef4; font-size: 11px; font-weight: 850; letter-spacing: .17em; }
.affiliate-story h1 { margin: 25px 0 20px; color: #fff; font-size: clamp(2.8rem, 4.2vw, 5rem); font-weight: 850; line-height: .98; letter-spacing: -.065em; }
.affiliate-story h1 em { color: #54c5ee; font-style: normal; }
.affiliate-story-copy > p { max-width: 540px; margin: 0; color: rgba(255,255,255,.65); font-size: 15px; line-height: 1.7; }
.affiliate-benefits { display: grid; margin-top: 38px; border-top: 1px solid rgba(255,255,255,.16); }
.affiliate-benefits article { display: grid; grid-template-columns: 42px 1fr; gap: 14px; align-items: center; padding: 16px 0; border-bottom: 1px solid rgba(255,255,255,.16); }
.affiliate-benefits article > span { color: #62c9ef; font-size: 10px; font-weight: 850; letter-spacing: .12em; }
.affiliate-benefits strong, .affiliate-benefits small { display: block; }
.affiliate-benefits strong { color: #fff; font-size: 13px; }
.affiliate-benefits small { margin-top: 3px; color: rgba(255,255,255,.5); font-size: 11px; line-height: 1.45; }
.affiliate-story-footer { display: flex; justify-content: space-between; color: rgba(255,255,255,.35); font-size: 9px; font-weight: 800; letter-spacing: .14em; }

.affiliate-form-side { display: flex; align-items: center; justify-content: center; min-height: 100vh; padding: 48px clamp(40px, 6vw, 110px); background: linear-gradient(145deg, #fff 0%, #f1f7fb 100%); }
.affiliate-form-wrap { width: 100%; max-width: 620px; }
.affiliate-step { color: var(--affiliate-blue); }
.affiliate-form-wrap h2 { margin: 20px 0 12px; font-size: clamp(2.5rem, 3.7vw, 4.5rem); font-weight: 850; line-height: .98; letter-spacing: -.06em; }
.affiliate-form-lead { margin: 0 0 30px; color: var(--affiliate-muted); font-size: 14px; line-height: 1.65; }
.affiliate-field { margin-bottom: 17px; }
.affiliate-field label { display: block; margin-bottom: 8px; color: var(--affiliate-ink); font-size: 11px; font-weight: 800; }
.affiliate-fields-row { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
.affiliate-input { display: flex; align-items: center; min-height: 54px; border: 1px solid #cbd9e4; background: #fff; transition: border-color .2s, box-shadow .2s; }
.affiliate-input:focus-within { border-color: var(--affiliate-cyan); box-shadow: 0 0 0 3px rgba(25,169,223,.11); }
.affiliate-input i { width: 52px; color: #7d909e; text-align: center; }
.affiliate-input input { width: 100%; min-width: 0; padding: 15px 15px 15px 0; border: 0; outline: 0; color: var(--affiliate-ink); background: transparent; font: 500 13px "Inter", sans-serif; }
.affiliate-input input::placeholder { color: #9aa9b4; }
.affiliate-primary { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 56px; margin-top: 6px; padding: 0 20px; border: 0; border-radius: 0; color: #fff; background: var(--affiliate-navy); font: 800 12px "Inter", sans-serif; text-decoration: none; cursor: pointer; box-shadow: 7px 7px 0 #d9ebf5; transition: background .2s, transform .2s; }
.affiliate-primary:hover { color: #fff; background: var(--affiliate-blue); transform: translateY(-1px); }
.affiliate-primary-link { margin-top: 18px; }
.affiliate-back { display: block; margin: 16px auto 0; padding: 7px; border: 0; color: var(--affiliate-blue); background: transparent; font: 750 11px "Inter", sans-serif; cursor: pointer; }
.affiliate-check { display: flex; align-items: center; gap: 9px; margin: 2px 0 17px; color: #647989; font-size: 11px; cursor: pointer; }
.affiliate-check input { width: 16px; height: 16px; accent-color: var(--affiliate-blue); }
.affiliate-check a { color: var(--affiliate-blue); font-weight: 750; }
.affiliate-security { display: flex; align-items: center; gap: 10px; margin-top: 32px; padding-top: 20px; border-top: 1px solid var(--affiliate-line); color: #80919f; font-size: 10px; line-height: 1.45; }
.affiliate-security i { color: var(--affiliate-blue); }
.affiliate-form-wrap .alert { border-width: 0 0 0 3px; border-radius: 0; font-size: 12px; }

@media (max-width: 1050px) {
    .affiliate-shell { grid-template-columns: minmax(390px, 43%) minmax(0, 57%); }
    .affiliate-story { padding-left: 38px; padding-right: 38px; }
    .affiliate-form-side { padding-left: 42px; padding-right: 42px; }
    .affiliate-fields-row { grid-template-columns: 1fr; gap: 0; }
}
@media (max-width: 767.98px) {
    .affiliate-shell { display: block; }
    .affiliate-story, .affiliate-form-side { min-height: auto; }
    .affiliate-story { padding: 26px 24px 34px; }
    .affiliate-brandbar img { width: 120px; }
    .affiliate-story-copy { padding: 58px 0 28px; }
    .affiliate-story h1 { font-size: clamp(2.7rem, 12vw, 4.1rem); }
    .affiliate-benefits { margin-top: 30px; }
    .affiliate-story-footer { display: none; }
    .affiliate-form-side { padding: 50px 24px 60px; }
    .affiliate-form-wrap h2 { font-size: 2.75rem; }
}