/* Affiliate sign up / sign in pages: two columns, hero on the left and the form card on the right */
.au { margin: 0; min-height: 100vh; font-family: 'Inter', system-ui, sans-serif; color: #14224a; display: flex; flex-direction: column; }
.au--light { background: linear-gradient(135deg, #eef5ff 0%, #f8fbff 60%, #e8f1ff 100%); }
.au--blue { background: linear-gradient(135deg, #2c6fe0 0%, #3f8cff 55%, #7fb4ff 100%); color: #fff; }
.au a { color: #2f6fe0; text-decoration: none; font-weight: 600; } .au--blue .au-top a { color: #fff; }
.au-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px max(16px, 5vw); } .au-top p { margin: 0; font-size: 13px; }
.au-logo { display: flex; align-items: center; gap: 8px; color: #1d5be0 !important; } .au--blue .au-logo { color: #fff !important; } .au-logo span { display: grid; line-height: 1.1; } .au-logo b { font-size: 24px; font-weight: 800; letter-spacing: -.5px; } .au-logo small { font-size: 9.5px; font-weight: 600; color: inherit; opacity: .8; }
.au-main { flex: 1; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(320px, 440px); gap: 28px; align-items: start; width: min(1180px, 100%); margin: 0 auto; padding: 8px 16px 32px; box-sizing: border-box; }
.au-hero { position: relative; padding: 8px 0 0; } .au-pill { display: inline-block; padding: 5px 12px; border-radius: 999px; font-size: 11px; font-weight: 700; letter-spacing: .06em; background: #dbe9ff; color: #2f6fe0; } .au--blue .au-pill { background: rgba(255, 255, 255, .22); color: #fff; }
.au-hero h1 { font-size: clamp(30px, 4vw, 46px); line-height: 1.1; margin: 14px 0 10px; max-width: 440px; letter-spacing: -.02em; } .au--light h1 { color: #14224a; } .au--light h1 { background: none; }
.au-hero > p { margin: 0 0 18px; max-width: 420px; font-size: 14.5px; line-height: 1.6; opacity: .85; }
.au-feats { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; max-width: 330px; } .au-feats li { display: flex; align-items: center; gap: 12px; } .au-feats b { display: block; font-size: 14px; } .au-feats small { display: block; font-size: 12px; opacity: .75; }
.au-ic { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; color: #fff; flex: none; } .au-ic svg { width: 20px; height: 20px; }
.au-ic--0 { background: linear-gradient(135deg, #a15cff, #6a4cff); } .au-ic--1 { background: linear-gradient(135deg, #3f9bff, #1d6fe0); } .au-ic--2 { background: linear-gradient(135deg, #35d0a0, #12a37a); } .au-ic--3 { background: linear-gradient(135deg, #ffb13d, #ff7a1a); }
.au-art { position: absolute; right: -10px; top: 70px; width: min(380px, 48%); } .au-art svg { width: 100%; height: auto; filter: drop-shadow(0 10px 18px rgba(20, 50, 120, .18)); }
.au-bubble { position: absolute; right: 4%; top: -6px; padding: 14px 16px; border-radius: 50%; background: #1d8cff; color: #fff; font-weight: 800; font-size: 15px; transform: rotate(8deg); box-shadow: 0 6px 16px rgba(29, 140, 255, .4); } .au--blue .au-bubble { background: #ff5fa0; }
.au-script { margin: 26px 0 0; font-family: 'Segoe Script', 'Brush Script MT', cursive; font-size: 24px; color: #1d5be0; max-width: 200px; } .au--blue .au-script { color: #fff; }
.au-card { background: #fff; color: #14224a; border-radius: 16px; padding: 24px; box-shadow: 0 14px 40px rgba(25, 70, 160, .18); border: 1px solid #e3ecfb; }
.au-card h2 { margin: 0; font-size: 20px; } .au-sub { margin: 4px 0 16px; font-size: 13px; color: #6a7a9c; }
.au-card form label { display: grid; gap: 5px; margin-bottom: 11px; font-size: 12px; font-weight: 600; color: #34456e; } .au-card small { font-weight: 400; color: #8493b2; font-size: 11px; }
.au-in { display: flex; align-items: center; gap: 8px; height: 42px; padding: 0 12px; border: 1px solid #d5e0f3; border-radius: 9px; background: #fff; } .au-in:focus-within { border-color: #3f8cff; box-shadow: 0 0 0 3px rgba(63, 140, 255, .18); }
.au-in svg { width: 17px; height: 17px; color: #7b8bb0; flex: none; } .au-in input, .au-in select { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font: inherit; font-size: 13.5px; color: #14224a; height: 100%; font-weight: 400; }
.au-eye { border: 0; background: none; cursor: pointer; padding: 0; display: grid; color: #7b8bb0; }
.au-check { display: flex !important; align-items: flex-start; gap: 8px; font-weight: 400 !important; } .au-check input { margin-top: 2px; }
.au-between { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; } .au-between label { margin: 0 !important; } .au-between a { font-size: 12px; }
.au-btn { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; height: 46px; border: 0; border-radius: 10px; cursor: pointer; font: inherit; font-weight: 700; font-size: 15px; color: #fff !important; background: linear-gradient(90deg, #2f7bff, #a24cf0); box-shadow: 0 8px 18px rgba(80, 100, 240, .35); text-decoration: none; margin-top: 4px; } .au-btn:disabled { opacity: .6; cursor: wait; } .au-btn svg { width: 17px; height: 17px; }
.au-err { margin: 0 0 12px; padding: 9px 11px; border-radius: 8px; font-size: 12.5px; color: #b3261e; background: #fdecea; border: 1px solid #f5b5b0; }
.au-ok { margin-top: 14px; padding: 12px; border-radius: 8px; font-size: 13px; color: #0b6b43; background: #e6f8ef; border: 1px solid #a9e3c8; line-height: 1.5; } .au-ok .au-btn { margin-top: 10px; }
.au-note { display: flex; gap: 10px; align-items: center; margin: 18px 0 0; padding: 11px 12px; border-radius: 10px; background: #eaf2ff; font-size: 11.5px; color: #34456e; line-height: 1.4; } .au-note svg { width: 22px; height: 22px; color: #2f6fe0; flex: none; }
.au-hint { margin: 10px 0 0; font-size: 11px; color: #8493b2; text-align: center; } .au-foot { text-align: center; margin: 14px 0 0; font-size: 13px; }
.au-done { text-align: center; } .au-done svg { width: 44px; height: 44px; color: #12a37a; } .au-done p { color: #6a7a9c; line-height: 1.55; }
.au-trust { display: flex; justify-content: center; gap: 48px; flex-wrap: wrap; padding: 18px 16px 24px; border-top: 1px solid #dfe9fa; background: #fff; } .au-trust span { display: grid; grid-template-columns: 36px auto; column-gap: 10px; align-items: center; } .au-trust svg { grid-row: span 2; width: 30px; height: 30px; color: #2f6fe0; } .au-trust b { font-size: 13px; } .au-trust small { font-size: 11.5px; color: #6a7a9c; }
@media (max-width: 880px) { .au-main { grid-template-columns: 1fr; } .au-art { display: none; } .au-hero h1 { max-width: none; } .au-trust { gap: 20px; } }
.au [hidden] { display: none !important; }
.au-art { top: auto; bottom: 10px; right: 0; width: min(300px, 42%); }
.au-hero { min-height: 540px; } .au-hero > p { max-width: 400px; }
@media (max-width: 1100px) { .au-art { width: 220px; } }

.au-or { display: flex; align-items: center; gap: 10px; margin: 16px 0 12px; font-size: 12px; color: #6a7a9c; } .au-or::before, .au-or::after { content: ''; flex: 1; height: 1px; background: #e1e8f5; }
.au-social { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; } .au-social button { display: flex; align-items: center; justify-content: center; gap: 8px; height: 40px; border: 1px solid #d9e2f2; border-radius: 9px; background: #fff; font: inherit; font-size: 13px; font-weight: 500; color: #14224a; cursor: pointer; } .au-social button:hover { border-color: #3f8cff; background: #f5f9ff; }
.au-soc-msg { margin: 10px 0 0; font-size: 12px; color: #6a7a9c; text-align: center; }
.au-main { width: min(1320px, 100%); grid-template-columns: minmax(0, 1fr) 420px; gap: 8px; padding-top: 0; }
.au-top { padding-top: 14px; } .au-logo b { font-size: 30px; } .au-logo svg { width: 32px; height: 32px; }
.au-hero { padding-left: 4vw; min-height: 600px; } .au-art { width: min(440px, 52%); right: 2%; bottom: 24px; }
.au-script { position: absolute; left: 4vw; bottom: 30px; margin: 0; font-size: 34px; line-height: 1; transform: rotate(-6deg); }
@media (max-width: 880px) { .au-hero { padding-left: 0; min-height: 0; } .au-script { position: static; transform: none; font-size: 26px; margin-top: 18px; } .au-main { grid-template-columns: 1fr; } }
