@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:opsz,wght@9..40,400;9..40,500&family=Instrument+Serif:ital@0;1&display=swap');

:root { color: #fffef7; background: #28483a; font-family: 'DM Sans', Arial, sans-serif; }
* { box-sizing: border-box; }
body { margin: 0; }
.password-page { display: grid; min-height: 100svh; place-items: center; padding: clamp(1.25rem, 5vw, 4rem); background: linear-gradient(180deg, rgba(13, 26, 21, .44), rgba(13, 26, 21, .62)), url('../assets/alex-and-jenn-hero-web.jpg') center / cover no-repeat, #28483a; }
.password-panel { width: min(100%, 34rem); padding: clamp(2.25rem, 7vw, 5rem); border: 1px solid rgba(255, 254, 247, .35); background: rgba(30, 48, 38, .78); box-shadow: 0 1.5rem 5rem rgba(7, 17, 12, .3); text-align: center; backdrop-filter: blur(8px); }
.password-panel__eyebrow, .password-panel__date { margin: 0; font-family: 'DM Mono', monospace; font-size: .65rem; letter-spacing: .12em; line-height: 1.6; text-transform: uppercase; }
.password-panel h1 { margin: 1.25rem 0 1.4rem; font-family: 'Instrument Serif', Georgia, serif; font-size: clamp(3.75rem, 10vw, 6.5rem); font-weight: 400; letter-spacing: -.055em; line-height: .85; }
.password-panel__intro { max-width: 25rem; margin: 0 auto 2.25rem; line-height: 1.55; }
.password-panel form { display: grid; gap: .8rem; }
.password-panel label { font-family: 'DM Mono', monospace; font-size: .65rem; letter-spacing: .1em; text-align: left; text-transform: uppercase; }
.password-panel input { width: 100%; min-height: 3.25rem; padding: .8rem 1rem; border: 1px solid rgba(255, 254, 247, .68); border-radius: 0; color: #1e3026; background: #fffef7; font: inherit; }
.password-panel input:focus-visible, .password-panel button:focus-visible { outline: 2px solid #fffef7; outline-offset: 3px; }
.password-panel button { min-height: 3.25rem; margin-top: .4rem; border: 1px solid #fffef7; border-radius: 0; color: #28483a; background: #fffef7; font-family: 'DM Mono', monospace; font-size: .67rem; letter-spacing: .1em; text-transform: uppercase; cursor: pointer; }
.password-panel button:hover { color: #fffef7; background: transparent; }
.password-panel .hs-error-msgs, .password-panel .hs_error_rollup { margin: .85rem 0 0; color: #ffe1dd; }
.password-panel__date { margin-top: 2.5rem; opacity: .82; }
@media (max-width: 420px) { .password-panel { padding: 2.5rem 1.5rem; } }
