.vbrn-gate { --vbrn-navy: #082b66; --vbrn-blue: #0b4da2; --vbrn-cyan: #1f8fc6; --vbrn-text: #0b214f; --vbrn-muted: #52627a; --vbrn-border: #d7e3f1; --vbrn-info: #eef7ff; --vbrn-card: #fff; --vbrn-overlay: rgba(3, 18, 48, .82); }
html.vbrn-has-ack .vbrn-gate { display: none; }
body.vbrn-modal-open { overflow: hidden; }
.vbrn-gate { position: fixed; inset: 0; z-index: 999999; display: flex; align-items: center; justify-content: center; overflow: auto; padding: 24px; color: var(--vbrn-text); background: var(--vbrn-overlay); isolation: isolate; }
.vbrn-gate::before, .vbrn-gate::after { position: absolute; z-index: -1; content: ''; pointer-events: none; }
.vbrn-gate::before { inset: 0; opacity: .7; background: radial-gradient(circle at 12% 78%, rgba(31, 143, 198, .55), transparent 28%), radial-gradient(circle at 90% 18%, rgba(36, 145, 226, .4), transparent 32%), linear-gradient(135deg, #031633, #0a3e78 52%, #02142f); }
.vbrn-gate::after { width: 52vw; height: 120%; right: -12vw; top: -10%; opacity: .34; border: 18px solid rgba(75, 201, 255, .4); border-radius: 50%; transform: rotate(31deg); box-shadow: 0 0 0 26px rgba(75, 201, 255, .08), 0 0 0 54px rgba(75, 201, 255, .07); }
.vbrn-card { width: min(720px, 100%); max-height: calc(100dvh - 48px); overflow: hidden; border: 1px solid rgba(174, 207, 239, .9); border-radius: 18px; background: var(--vbrn-card); box-shadow: 0 24px 70px rgba(0, 7, 24, .46); display: flex; flex-direction: column; }
.vbrn-card__body { overflow: auto; padding: 26px 34px 24px; }
.vbrn-brand { min-height: 48px; display: flex; align-items: center; justify-content: center; }
.vbrn-brand .custom-logo-link { display: inline-flex; align-items: center; justify-content: center; max-width: 260px; }
.vbrn-brand .custom-logo { display: block; width: auto; max-width: 100%; max-height: 52px; }
.vbrn-wordmark { color: var(--vbrn-navy); font-size: 25px; font-weight: 800; letter-spacing: .16em; }
.vbrn-wordmark span { display: block; margin-top: 2px; color: var(--vbrn-blue); font-size: 10px; letter-spacing: .32em; text-align: center; }
.vbrn-research-mark { width: 76px; height: 76px; margin: 12px auto 8px; display: grid; place-items: center; border-radius: 50%; background: #edf6ff; }
.vbrn-research-mark svg { width: 64px; height: 64px; fill: none; stroke: var(--vbrn-blue); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.vbrn-research-mark circle { fill: var(--vbrn-navy); stroke: none; }
.vbrn-research-mark circle + path { stroke: #fff; stroke-width: 2.2; }
.vbrn-eyebrow { margin: 4px 0 0; color: var(--vbrn-navy); font-size: 26px; font-weight: 800; letter-spacing: .02em; text-align: center; }
.vbrn-card h2 { margin: 2px 0 14px; color: var(--vbrn-blue); font-size: 25px; line-height: 1.15; text-align: center; }
.vbrn-intro { margin: 0 0 16px; padding: 12px 16px; border: 1px solid #cfe4f8; border-radius: 10px; background: var(--vbrn-info); color: var(--vbrn-text); font-size: 14px; line-height: 1.45; text-align: center; }
.vbrn-notices { border: 1px solid var(--vbrn-border); border-radius: 12px; overflow: hidden; }
.vbrn-notice { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 12px; align-items: center; padding: 10px 13px; border-bottom: 1px solid var(--vbrn-border); }
.vbrn-notice:last-child { border-bottom: 0; }
.vbrn-notice__icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; background: #edf6ff; color: var(--vbrn-blue); font-size: 22px; font-weight: 700; }
.vbrn-notice strong, .vbrn-notice span { display: block; }
.vbrn-notice strong { color: var(--vbrn-navy); font-size: 14px; line-height: 1.25; }
.vbrn-notice div span { margin-top: 3px; color: var(--vbrn-muted); font-size: 13px; line-height: 1.3; }
.vbrn-confirmation { margin-top: 18px; }
.vbrn-confirmation h3 { display: flex; align-items: center; gap: 12px; margin: 0 0 12px; color: var(--vbrn-blue); font-size: 19px; line-height: 1.2; text-align: center; }
.vbrn-confirmation h3::before, .vbrn-confirmation h3::after { content: ''; height: 1px; flex: 1; background: #bfd5eb; }
.vbrn-check { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border: 1px solid #cfe0f2; border-radius: 11px; background: #fbfdff; color: var(--vbrn-text); cursor: pointer; font-size: 14px; line-height: 1.45; }
.vbrn-check input { flex: 0 0 auto; width: 22px; height: 22px; margin: 1px 0 0; accent-color: var(--vbrn-blue); }
.vbrn-actions { display: grid; gap: 10px; margin-top: 14px; }
.vbrn-button { width: 100%; min-height: 52px; border-radius: 9px; padding: 12px 18px; font: inherit; font-size: 16px; font-weight: 700; cursor: pointer; transition: background-color .15s ease, border-color .15s ease, opacity .15s ease; }
.vbrn-button:focus-visible, .vbrn-terms:focus-visible, .vbrn-check:focus-within { outline: 3px solid #7dc9f4; outline-offset: 3px; }
.vbrn-button--primary { display: flex; justify-content: center; align-items: center; gap: 18px; border: 1px solid var(--vbrn-navy); background: var(--vbrn-navy); color: #fff; }
.vbrn-button--primary:disabled { opacity: .48; cursor: not-allowed; }
.vbrn-button--secondary { border: 1px solid var(--vbrn-blue); background: #fff; color: var(--vbrn-blue); }
.vbrn-button--secondary:hover, .vbrn-button--secondary:focus-visible { background: #f0f7ff; }
.vbrn-terms { display: block; margin-top: 15px; color: var(--vbrn-blue); font-size: 14px; text-align: center; text-decoration: underline; }
.vbrn-trust { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; padding: 15px 22px; background: var(--vbrn-navy); color: #fff; }
.vbrn-trust span { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 34px; padding: 0 10px; border-right: 1px solid rgba(255,255,255,.28); color: #d8ebff; font-size: 11px; line-height: 1.3; text-align: center; }
.vbrn-trust span:last-child { border-right: 0; }
.vbrn-trust b { color: #fff; font-weight: 600; }
.vbrn-noscript { position: fixed; inset: 0; z-index: 1000000; display: grid; place-items: center; margin: 0; padding: 24px; background: #031633; color: #fff; text-align: center; }
@media (prefers-reduced-motion: reduce) { .vbrn-button { transition: none; } }
@media (max-width: 767px) { .vbrn-gate { align-items: center; padding: 12px; } .vbrn-card { width: 100%; max-height: calc(100dvh - 24px); border-radius: 14px; } .vbrn-card__body { padding: 19px 16px 18px; } .vbrn-brand .custom-logo { max-height: 42px; } .vbrn-wordmark { font-size: 20px; } .vbrn-research-mark { width: 61px; height: 61px; margin: 7px auto 5px; } .vbrn-research-mark svg { width: 51px; height: 51px; } .vbrn-eyebrow { font-size: 20px; } .vbrn-card h2 { font-size: 18px; margin-bottom: 10px; } .vbrn-intro { margin-bottom: 10px; padding: 10px 11px; font-size: 13px; } .vbrn-notice { grid-template-columns: 34px minmax(0, 1fr); gap: 9px; padding: 8px 9px; } .vbrn-notice__icon { width: 31px; height: 31px; font-size: 17px; } .vbrn-notice strong { font-size: 13px; } .vbrn-notice div span { font-size: 13px; } .vbrn-confirmation { margin-top: 13px; } .vbrn-confirmation h3 { font-size: 17px; margin-bottom: 9px; } .vbrn-check { gap: 9px; padding: 11px; font-size: 13px; } .vbrn-check input { width: 20px; height: 20px; } .vbrn-button { min-height: 48px; font-size: 15px; } .vbrn-terms { margin-top: 11px; font-size: 13px; } .vbrn-trust { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 9px 10px; } .vbrn-trust span { min-height: 27px; padding: 5px 4px; border-right: 0; font-size: 10px; } }
@media (max-width: 430px) { .vbrn-card__body { padding-inline: 13px; } .vbrn-eyebrow { font-size: 19px; } .vbrn-notice div span { font-size: 12.5px; } }
@media (max-width: 375px) { .vbrn-gate { padding: 8px; } .vbrn-card { max-height: calc(100dvh - 16px); } .vbrn-card__body { padding-block: 14px; } .vbrn-research-mark { margin-top: 3px; } .vbrn-intro { font-size: 12.5px; } .vbrn-notice { padding-block: 7px; } .vbrn-check { font-size: 12.5px; } }