.campaign-banner { position: relative; isolation: isolate; overflow: hidden; min-height: clamp(240px, 35vw, 490px); margin-bottom: 22px; border: 3px solid #071321; border-radius: 24px; background: #071321; box-shadow: 0 14px 25px rgba(31, 61, 121, .2); }
.campaign-banner > img { position: absolute; z-index: 0; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.campaign-banner::after { position: absolute; z-index: 1; inset: 0; content: ''; background: linear-gradient(90deg, rgba(3, 13, 28, .78), rgba(3, 13, 28, .12) 68%); }
.campaign-banner-copy { position: relative; z-index: 2; display: grid; align-content: center; min-height: inherit; max-width: min(62%, 580px); padding: clamp(26px, 5vw, 70px); color: #fff; }
.campaign-banner-copy p { margin: 0 0 10px; color: #86f4ff; font-size: 11px; font-weight: 900; letter-spacing: .16em; }
.campaign-banner-copy h2 { margin: 0; font-family: 'Baloo 2', sans-serif; font-size: clamp(34px, 5.5vw, 76px); line-height: .92; text-shadow: 0 4px 14px rgba(0,0,0,.35); }
.campaign-banner-copy button { width: fit-content; margin-top: 22px; padding: 11px 15px; color: #071321; border: 2px solid #071321; border-radius: 10px; background: #baffd5; font-size: 11px; font-weight: 900; text-transform: uppercase; }
.campaign-arrow { position: absolute; z-index: 3; top: 50%; display: grid; width: 38px; height: 38px; place-items: center; transform: translateY(-50%); color: #fff; border: 1px solid rgba(255,255,255,.75); border-radius: 50%; background: rgba(0, 13, 30, .45); font-size: 31px; line-height: 1; }
.campaign-arrow.previous { left: 15px; }.campaign-arrow.next { right: 15px; }
.campaign-dots { position: absolute; z-index: 3; right: 22px; bottom: 18px; display: flex; gap: 7px; }.campaign-dots button { width: 9px; height: 9px; padding: 0; border: 1px solid #fff; border-radius: 50%; background: transparent; }.campaign-dots button.active { background: #fff; }
@media (max-width: 650px) { .campaign-banner { min-height: 280px; }.campaign-banner-copy { max-width: 100%; padding: 34px 48px; }.campaign-banner::after { background: linear-gradient(90deg, rgba(3,13,28,.76), rgba(3,13,28,.36)); }.campaign-arrow { width: 32px; height: 32px; }.campaign-arrow.previous { left: 8px; }.campaign-arrow.next { right: 8px; } }