:root {
    color-scheme: light;
    font-family: Inter, ui-sans-serif, system-ui, sans-serif;
    --brand-navy: #203162;
    --brand-charcoal: #181c24;
    --brand-slate: #7a828f;
    --brand-silver: #cbcfd5;
    color: var(--brand-charcoal);
    background: #f1f2f4;
}
* { box-sizing: border-box; }
body { min-height: 100vh; margin: 0; display: grid; place-items: center; padding: 1.5rem; background: radial-gradient(circle at top, #fff 0, #e8ebef 100%); }
.card { width: min(100%, 28rem); padding: clamp(1.5rem, 6vw, 2.5rem); border: 1px solid var(--brand-silver); border-top: 3px solid var(--brand-navy); border-radius: .75rem; background: #fff; box-shadow: 0 1.25rem 4rem rgba(24, 28, 36, .1); }
.brand-logo { display: block; width: 150px; max-width: 100%; height: auto; }
h1 { margin: 1.75rem 0 .4rem; font-size: 1.8rem; color: var(--brand-charcoal); }
h2 { margin: 0 0 .5rem; font-size: 1.2rem; color: var(--brand-charcoal); }
.intro { margin: 0 0 1.5rem; color: #505866; line-height: 1.5; overflow-wrap: anywhere; }
label { display: block; margin: 1rem 0 .4rem; font-weight: 650; font-size: .9rem; }
input { width: 100%; padding: .8rem .9rem; border: 1px solid var(--brand-slate); border-radius: .4rem; background: #fff; color: var(--brand-charcoal); font: inherit; }
input:focus { outline: 3px solid rgba(32, 49, 98, .2); outline-offset: 1px; border-color: var(--brand-navy); }
button { width: 100%; margin-top: 1.4rem; padding: .85rem; border: 0; border-radius: .4rem; background: var(--brand-navy); color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
button:hover { background: var(--brand-charcoal); }
button:focus-visible { outline: 3px solid var(--brand-navy); outline-offset: 3px; }
.iframe-notice { margin-top: 1.5rem; padding: 1rem; border: 1px solid var(--brand-silver); border-left: 4px solid var(--brand-navy); border-radius: .4rem; background: #f5f6f8; }
.iframe-notice p { margin: 0 0 1rem; color: #505866; line-height: 1.5; }
.iframe-notice .iframe-fallback { margin: 1rem 0 0; font-size: .85rem; }
.button-link { display: block; width: 100%; padding: .85rem; border-radius: .4rem; background: var(--brand-navy); color: #fff; font-weight: 700; text-align: center; text-decoration: none; }
.button-link:hover { background: var(--brand-charcoal); }
.button-link:focus-visible, .secondary-link:focus-visible { outline: 3px solid var(--brand-navy); outline-offset: 3px; }
.secondary-link { display: block; margin-top: .9rem; color: var(--brand-navy); font-weight: 650; text-align: center; }
.error { padding: .8rem; border-radius: .4rem; background: #fff0f0; color: #9b1c1c; font-size: .9rem; }