@font-face {
  font-family: "Inter";
  src: url("../fonts/inter-variable.ttf") format("truetype");
  font-weight: 100 900;
  font-display: swap;
}

@font-face {
  font-family: "Source Serif 4";
  src: url("../fonts/source-serif-4-variable.ttf") format("truetype");
  font-weight: 200 900;
  font-display: swap;
}

* { box-sizing: border-box; }
body { min-width: 320px; min-height: 100vh; margin: 0; color: #eaf0f5; background: radial-gradient(circle at 50% 15%, #15314d 0, #0a1b2c 36%, #050c13 100%); font-family: "Inter", sans-serif; }
.access-shell { display: grid; min-height: 100vh; place-items: center; padding: 24px; }
.access-card { width: min(100%, 470px); padding: clamp(30px, 7vw, 52px); border: 1px solid rgba(170, 195, 215, 0.3); background: rgba(7, 19, 33, 0.94); box-shadow: 0 28px 90px rgba(0, 0, 0, 0.48); }
.access-mark { display: grid; width: 48px; height: 48px; margin-bottom: 28px; place-items: center; color: white; background: #c42026; font: 500 2rem/1 Arial, sans-serif; transform: rotate(45deg); }
.access-mark span { transform: rotate(-45deg); }
.access-classification { margin: 0 0 10px; color: #e99fa2; font-size: 0.68rem; font-weight: 800; letter-spacing: 0.16em; }
h1 { margin: 0 0 15px; font: 450 clamp(2rem, 7vw, 3.2rem)/1 "Source Serif 4", Georgia, serif; }
.access-intro { margin: 0 0 28px; color: #afbeca; font-size: 0.88rem; line-height: 1.65; }
.access-form { display: grid; gap: 9px; }
.access-form label { margin-top: 9px; color: #c7d3dc; font-size: 0.7rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.access-form input { width: 100%; min-height: 48px; padding: 10px 13px; color: #f8fbfd; border: 1px solid #60788b; border-radius: 2px; outline: 0; background: #0c2235; font: inherit; }
.access-form input:focus { border-color: #ec6c71; box-shadow: 0 0 0 3px rgba(196, 32, 38, 0.22); }
.access-form button { min-height: 50px; margin-top: 17px; color: white; border: 0; background: linear-gradient(135deg, #c42026, #8f1419); font: 800 0.78rem "Inter", sans-serif; letter-spacing: 0.04em; text-transform: uppercase; cursor: pointer; }
.access-form button:hover { filter: brightness(1.1); }
.access-error { margin: 7px 0 0; padding: 10px 12px; color: #ffd9da; border-left: 3px solid #ec555a; background: rgba(196, 32, 38, 0.16); font-size: 0.78rem; }
.access-footnote { margin: 28px 0 0; color: #71889a; font-size: 0.66rem; letter-spacing: 0.04em; text-transform: uppercase; }
.access-footnote span { color: #51bb82; }
