:root { color-scheme: light; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #102a4d; background: #f7fafc; }
* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; }
.page-shell { min-height: 100vh; display: grid; grid-template-columns: minmax(320px, .9fr) minmax(0, 1.1fr); background: linear-gradient(135deg, #f8fbff 0%, #ffffff 58%, #eff6ff 100%); }
.brand-panel { position: relative; isolation: isolate; overflow: hidden; display: flex; min-height: 380px; flex-direction: column; justify-content: center; padding: clamp(3rem, 9vw, 8rem); color: #fff; background: linear-gradient(145deg, #071f42, #194991 56%, #2776bc); }
.brand-panel::after { position: absolute; z-index: -1; inset: 0; content: ""; opacity: .35; background-image: radial-gradient(circle at 20% 20%, #8ed3ff 0 2px, transparent 3px), radial-gradient(circle at 75% 70%, #fff 0 1px, transparent 2px); background-size: 42px 42px, 58px 58px; }
.pebble { position: absolute; z-index: -1; border-radius: 48% 52% 47% 53% / 62% 39% 61% 38%; filter: blur(.1px); transform: rotate(-22deg); }
.pebble-one { width: 22rem; height: 15rem; right: -7rem; bottom: -3rem; background: #d8a849; opacity: .9; }
.pebble-two { width: 16rem; height: 12rem; left: -6rem; top: -3rem; background: #54a76e; opacity: .62; }
.brand-mark { display: grid; width: 4.25rem; height: 4.25rem; place-items: center; border: 3px solid rgba(255,255,255,.75); border-radius: 1rem; font-size: 2.25rem; font-weight: 900; box-shadow: 0 16px 36px rgba(0,0,0,.2); }
.eyebrow { margin: 1.75rem 0 .5rem; color: inherit; font-size: .75rem; font-weight: 800; letter-spacing: .19em; text-transform: uppercase; }
h1, h2 { margin: 0; letter-spacing: -.045em; line-height: .98; }
h1 { max-width: 8ch; font-size: clamp(3rem, 7vw, 5.6rem); }
.brand-copy { max-width: 32rem; margin: 1.75rem 0 0; font-size: 1.125rem; line-height: 1.7; color: #e4f1ff; }
.content-panel { display: grid; place-items: center; padding: clamp(2.5rem, 8vw, 8rem); }
.content-wrap { width: min(100%, 42rem); }
.content-panel .eyebrow { margin: 0 0 1rem; color: #194991; }
h2 { font-size: clamp(2.5rem, 5vw, 4.5rem); color: #102a4d; }
.content-wrap > p:not(.eyebrow) { max-width: 39rem; margin: 1.75rem 0; color: #4a607a; font-size: 1.125rem; line-height: 1.8; }
.notice { display: grid; gap: .5rem; margin: 2.5rem 0 1.5rem; padding: 1.5rem; border: 1px solid #bedbff; border-radius: 1.25rem; background: #edf6ff; color: #123b75; box-shadow: 0 18px 45px rgba(25,73,145,.08); }
.notice strong { font-size: 1.05rem; }
.notice span, .quiet { font-size: .95rem !important; line-height: 1.6 !important; }
.quiet { color: #6e7f94 !important; }
@media (max-width: 760px) { .page-shell { grid-template-columns: 1fr; } .brand-panel { min-height: 430px; } }