:root {
  color: #003a63;
  background: #eef3f6;
  font-family: "minion-pro", Georgia, serif;
}

* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; }
.welcome-shell { width: min(1120px, calc(100% - 32px)); margin: 0 auto; padding: 28px 0 48px; }
.brand { display: flex; gap: 10px; align-items: center; min-height: 54px; letter-spacing: .04em; }
.brand-mark { display: grid; place-items: center; width: 38px; height: 38px; color: white; background: #003a63; font-size: 13px; font-weight: 800; border-radius: 4px; }
.brand strong, .brand small { display: block; }
.brand strong { font-size: 14px; }
.brand small { margin-top: 2px; font-size: 8px; letter-spacing: .2em; }
.welcome-card { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(280px, .85fr); margin-top: 24px; overflow: hidden; border-radius: 20px; box-shadow: 0 24px 70px rgba(0, 58, 99, .16); }
.welcome-copy { padding: clamp(48px, 7vw, 88px); color: white; background: #003a63; }
.eyebrow { margin: 0 0 13px; color: #fdb813; letter-spacing: .14em; text-transform: uppercase; font-weight: 750; font-size: 11px; }
h1 { max-width: 660px; margin: 0; font: 600 clamp(38px, 5.6vw, 68px)/1.02 Georgia, serif; letter-spacing: -.04em; }
.lede { max-width: 620px; margin: 24px 0 0; color: #dce8f0; font-size: 17px; line-height: 1.6; }
.signin-form { max-width: 430px; margin-top: 36px; }
.signin-button { display: flex; align-items: center; justify-content: space-between; gap: 24px; width: 100%; padding: 16px 18px; border: 0; border-radius: 8px; color: #003a63; background: #fdb813; cursor: pointer; text-align: left; font: 800 14px/1.2 inherit; }
.signin-button:hover, .signin-button:focus-visible { background: #ffc934; outline: 3px solid rgba(255, 255, 255, .55); outline-offset: 3px; }
.signin-button span { font-size: 20px; }
.signin-error { max-width: 520px; margin: 14px 0 0; padding: 12px 14px; border: 1px solid rgba(253, 184, 19, .7); border-radius: 6px; color: #fff5d6; background: rgba(0, 0, 0, .14); font-size: 12px; line-height: 1.5; }
.security-note { max-width: 520px; margin: 16px 0 0; color: #c3d5e1; font-size: 11px; line-height: 1.55; }
.ownership-note { max-width: 520px; margin: 10px 0 0; color: #c3d5e1; font-size: 11px; line-height: 1.55; }
.ownership-note a { color: #fdb813; text-underline-offset: 2px; }
.ownership-note a:hover, .ownership-note a:focus-visible { color: #ffd15a; }
.process { padding: 54px 42px; background: #fffdf7; }
.process .eyebrow { color: #526979; }
.process ol { margin: 30px 0 0; padding: 0; list-style: none; }
.process li { display: flex; gap: 14px; padding: 0 0 26px; }
.process li > span { flex: 0 0 auto; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; color: white; background: #003a63; font-size: 12px; font-weight: 800; }
.process p { margin: 0; }
.process strong, .process small { display: block; }
.process strong { font: 650 17px/1.2 Georgia, serif; }
.process small { margin-top: 7px; color: #526979; font-size: 12px; line-height: 1.45; }
.brand, .eyebrow, h1, .signin-button, .process strong { font-family: "myriad-pro", "Segoe UI", Arial, sans-serif; }

@media (max-width: 760px) {
  .welcome-shell { padding-top: 14px; }
  .welcome-card { grid-template-columns: 1fr; }
  .welcome-copy { padding: 44px 28px; }
  .process { padding: 38px 28px 20px; }
}
