@font-face {
  font-family: 'RLYN Lexend';
  src: url('public/fonts/LexendDeca-VariableFont_wght.ttf') format('truetype');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

.account-page { min-height:100vh; background:#fff; color:#171313; }
.account-layout { display:grid; grid-template-columns:1fr 1fr; min-height:100vh; }
.account-panel { position:relative; display:flex; flex-direction:column; min-height:100vh; padding:clamp(34px,5vw,76px) clamp(34px,8vw,164px) 32px; }
.account-brand { align-self:center; color:#4a0a04; font:500 clamp(28px,3vw,42px)/1 'RLYN Lexend',sans-serif; letter-spacing:-.07em; text-decoration:none; }
.account-form-wrap { width:min(100%,526px); margin:auto; transform:translateY(-2vh); }
.account-form-wrap h1 { margin:0 0 8px; font:500 18px/1.3 var(--sans); letter-spacing:-.02em; }
.account-form-wrap > p { margin:0 0 29px; color:#716b66; font:16px/1.45 var(--sans); }
.email-field { display:flex; align-items:center; height:72px; border:1px solid #201d1b; }
.email-field input { min-width:0; flex:1; height:100%; padding:0 15px; border:0; outline:0; color:var(--ink); background:transparent; font:16px var(--sans); }
.email-field input::placeholder { color:#77716c; }
.email-field button { width:60px; height:100%; border:0; background:transparent; color:var(--ink); font:34px/1 var(--sans); cursor:pointer; }
.email-field:focus-within { outline:1px solid #4a0a04; outline-offset:2px; }
.news-opt-in { display:flex; align-items:center; gap:13px; margin:20px 0 26px; font:16px/1.35 var(--sans); cursor:pointer; }
.news-opt-in input { appearance:none; width:26px; height:26px; margin:0; border:1px solid #201d1b; background:#fff; cursor:pointer; }
.news-opt-in input:checked { background:#4a0a04; box-shadow:inset 0 0 0 6px #fff; }
.account-terms { max-width:510px; margin:0; color:#77716c; font:15px/1.45 var(--sans); }
.account-terms a, .account-privacy { color:inherit; text-underline-offset:3px; }
.account-status { min-height:22px; margin:18px 0 0; color:#4a0a04; font:14px/1.4 var(--sans); }
.account-privacy { margin-top:auto; align-self:center; color:#171313; font:16px var(--sans); text-decoration:none; }
.account-image { min-height:100vh; margin:0; overflow:hidden; background:#e9e7e4; }
.account-image img { display:block; width:100%; height:100%; object-fit:cover; object-position:center; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

@media (max-width:760px) {
  .account-layout { grid-template-columns:1fr; }
  .account-panel { min-height:72svh; padding:32px 25px 28px; }
  .account-form-wrap { margin:auto 0; transform:none; }
  .account-form-wrap > p { font-size:15px; }
  .email-field { height:62px; }
  .news-opt-in { font-size:15px; }
  .account-terms { font-size:14px; }
  .account-image { min-height:72svh; }
}
