.zpl-body .zpl-links .zpl-affiliate-nav { color: #ffe08a; padding: 9px 13px; background: #ffffff12; border: 1px solid #ffe08a88; border-radius: 999px; white-space: nowrap; }
.zpl-body .zpl-affiliates { position: relative; isolation: isolate; overflow: hidden; padding: 76px 0 42px; background: #071c35; color: #fff; scroll-margin-top: 0; }
.zpl-body .zpl-affiliates::before,
.zpl-body .zpl-affiliates::after { content: ""; position: absolute; z-index: -1; width: 320px; height: 320px; border-radius: 50%; background: #ad2540; border: 40px solid #382541; pointer-events: none; }
.zpl-body .zpl-affiliates::before { left: -210px; top: -190px; }
.zpl-body .zpl-affiliates::after { right: -255px; bottom: 50px; }
.zpl-body .zpl-affiliate-grid { display: grid; grid-template-columns: 0.95fr 1.05fr; align-items: center; gap: 44px; }
.zpl-body .zpl-affiliate-copy { position: relative; z-index: 1; min-width: 0; }
.zpl-body .zpl-affiliate-label { display: inline-block; margin: 0 0 20px; padding: 7px 21px; border: 2px solid #ffd467; border-radius: 999px; font-size: 1rem; line-height: 1.25; }
.zpl-body .zpl-affiliate-copy h2 { margin: 0; font: 700 clamp(3.4rem, 5.2vw, 4.8rem)/1.05 "Oswald", "Arial Narrow", Arial, sans-serif; text-transform: uppercase; letter-spacing: -0.03em; color: #fff; }
.zpl-body .zpl-affiliate-copy h2 span { color: #ffd467; }
.zpl-body .zpl-affiliate-intro { max-width: 510px; margin: 24px 0; color: #edf2fa; font-size: 1.12rem; line-height: 1.75; }
.zpl-body .zpl-affiliate-actions { display: flex; align-items: flex-start; flex-direction: column; gap: 20px; }
.zpl-body .zpl-affiliate-join { display: inline-flex; align-items: center; justify-content: center; gap: 22px; max-width: 100%; padding: 20px 25px; background: #df2028; border: 1px solid #ff5f64; border-radius: 18px; color: #fff; font-size: 1.08rem; line-height: 1.35; font-weight: 800; text-decoration: none; transition: transform 160ms ease, background 160ms ease; }
.zpl-body .zpl-affiliate-join:hover { background: #c71620; transform: translateY(-2px); }
.zpl-body .zpl-affiliate-join i { font-size: 1.4rem; }
.zpl-body .zpl-affiliate-learn { color: #fff; font-size: 1.03rem; font-weight: 700; text-underline-offset: 5px; }
.zpl-body .zpl-affiliate-free { margin: 24px 0 0; font-size: 0.97rem; line-height: 1.6; color: #edf2fa; }
.zpl-body .zpl-affiliate-photos { position: relative; min-width: 0; aspect-ratio: 1.02; margin: 0 10px; }
.zpl-body .zpl-affiliate-main-photo { position: absolute; width: 100%; height: auto; aspect-ratio: 4 / 3; top: 5px; right: 0; display: block; object-fit: cover; border: 3px solid #fff; border-radius: 28px; transform: rotate(2deg); }
.zpl-body .zpl-affiliate-circle { position: absolute; width: 45%; height: auto; aspect-ratio: 1; bottom: 0; object-fit: cover; border: 5px solid #071c35; outline: 3px solid #fff; border-radius: 50%; }
.zpl-body .zpl-affiliate-circle-one { left: -2%; }
.zpl-body .zpl-affiliate-circle-two { right: -2%; }
.zpl-body .zpl-affiliate-dot { position: absolute; z-index: -1; display: block; width: 28px; height: 28px; background: #ff3131; border-radius: 50%; }
.zpl-body .zpl-affiliate-dot-one { top: -15px; right: 20px; width: 36px; height: 36px; background: #ffd467; }
.zpl-body .zpl-affiliate-dot-two { bottom: 30px; left: -38px; }
.zpl-body .zpl-affiliate-dot-three { bottom: 50px; left: 48%; background: #ffd467; }
.zpl-body .zpl-affiliate-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; margin: 54px 0 0; padding: 36px 0 0; border-top: 1px solid #ffffff40; list-style: none; }
.zpl-body .zpl-affiliate-steps li { display: flex; align-items: flex-start; gap: 20px; min-width: 0; }
.zpl-body .zpl-affiliate-number { color: #ffd467; font: 700 4.4rem/1 "Oswald", "Arial Narrow", Arial, sans-serif; }
.zpl-body .zpl-affiliate-steps li > div { min-height: 96px; padding-left: 20px; border-left: 1px solid #ffffff66; }
.zpl-body .zpl-affiliate-steps h3 { margin: 0 0 10px; font: 700 1.8rem/1.15 "Oswald", "Arial Narrow", Arial, sans-serif; color: #fff; }
.zpl-body .zpl-affiliate-steps p { color: #edf2fa; font-size: 0.96rem; line-height: 1.65; margin: 0; }
.zpl-body .zpl-affiliate-terms { margin: 32px 0 0; font-size: 0.85rem; color: #b8c8dc; line-height: 1.8; }
.zpl-body .zpl-affiliate-terms a { color: #fff; margin-left: 12px; text-underline-offset: 4px; }
.zpl-body .zpl-affiliates a:focus-visible { outline: 3px solid #ffd467; outline-offset: 5px; }
@media (max-width: 1060px) {
  .zpl-body .zpl-affiliate-grid { gap: 30px; }
  .zpl-body .zpl-affiliate-copy h2 { font-size: clamp(3rem, 5.5vw, 4rem); }
  .zpl-body .zpl-affiliate-intro { font-size: 1rem; }
  .zpl-body .zpl-affiliate-join { gap: 12px; padding: 18px; font-size: 0.98rem; }
  .zpl-body .zpl-affiliate-steps { gap: 20px; }
  .zpl-body .zpl-affiliate-steps li { gap: 12px; }
  .zpl-body .zpl-affiliate-steps li > div { padding-left: 12px; }
  .zpl-body .zpl-affiliate-number { font-size: 3.5rem; }
}
@media (max-width: 760px) {
  .zpl-body .zpl-affiliates { padding: 48px 0 34px; }
  .zpl-body .zpl-affiliate-grid { grid-template-columns: 1fr; gap: 42px; }
  .zpl-body .zpl-affiliate-copy h2 { font-size: clamp(3.35rem, 10.8vw, 4.4rem); }
  .zpl-body .zpl-affiliate-copy { padding: 0 10px; }
  .zpl-body .zpl-affiliate-intro { max-width: 100%; }
  .zpl-body .zpl-affiliate-photos { width: calc(100% - 40px); max-width: 550px; margin: 0 auto; }
  .zpl-body .zpl-affiliate-steps { grid-template-columns: 1fr; margin-top: 42px; gap: 28px; padding: 32px 10px 0; }
  .zpl-body .zpl-affiliate-steps li { gap: 22px; }
  .zpl-body .zpl-affiliate-steps li > div { padding-left: 22px; min-height: 76px; }
  .zpl-body .zpl-affiliate-number { flex: 0 0 64px; font-size: 3.8rem; }
  .zpl-body .zpl-affiliate-steps h3 { font-size: 1.65rem; }
  .zpl-body .zpl-affiliate-terms { padding: 0 10px; }
}
@media (max-width: 380px) {
  .zpl-body .zpl-affiliate-copy h2 { font-size: 2.85rem; }
  .zpl-body .zpl-affiliate-join { width: 100%; font-size: 0.91rem; padding: 17px 10px; }
  .zpl-body .zpl-affiliate-label { font-size: 0.9rem; }
  .zpl-body .zpl-affiliate-free { font-size: 0.9rem; }
}
