:root { --black:#000; --white:#fff; --muted:#a7a7a7; --line:rgba(255,255,255,.28); }
* { box-sizing:border-box; }
html { background:var(--black); }
body { margin:0; color:var(--white); font-family:Montserrat,sans-serif; background:var(--black); }
.page-shell { min-height:100svh; padding:34px clamp(26px,6vw,96px) 24px; display:flex; flex-direction:column; }
.brand, footer { display:flex; align-items:center; }
.brand { width:100%; flex-direction:column; justify-content:center; gap:18px; margin-top:clamp(34px,8vh,92px); text-align:center; transition:.35s ease; }
.brand p { margin:0 0 0 .34em; font-family:Raleway,sans-serif; font-size:clamp(30px,5vw,54px); line-height:1; letter-spacing:.34em; font-weight:400; white-space:nowrap; }
.monogram { width:clamp(105px,12vw,150px); height:clamp(130px,15vw,184px); object-fit:cover; object-position:center; mix-blend-mode:screen; }
.panel { width:min(100%,560px); position:relative; animation:appear .45s ease both; }
.access-panel { margin:clamp(58px,9vh,110px) auto auto; padding-bottom:30px; }
.access-tagline { margin:0 0 34px; color:#c6c6c6; font:400 11px/1.4 Montserrat,sans-serif; letter-spacing:.18em; text-transform:uppercase; }
form label { display:block; color:#fff; text-transform:uppercase; font-size:10px; letter-spacing:.16em; }
.code-row { margin-top:13px; display:flex; border-bottom:1px solid var(--line); transition:border-color .2s; }
.code-row:focus-within { border-color:#fff; }
input { width:100%; color:var(--white); border:0; outline:0; background:transparent; font:400 15px Raleway,sans-serif; padding:14px 0; }
input::placeholder { color:#777; letter-spacing:.08em; }
.code-row button { color:var(--white); border:0; background:none; padding:0 5px 0 18px; font-size:25px; cursor:pointer; transition:transform .2s; }
.code-row button:hover,.submit-button:hover { transform:translateX(3px); }
.fine-print,.feedback { color:var(--muted); font:10px/1.65 Montserrat,sans-serif; letter-spacing:.04em; }
.fine-print { margin-top:18px; }
.feedback { min-height:16px; margin:10px 0 0; }
.feedback.error,.feedback.success { color:#fff; }
.is-hidden { display:none; }
.application-panel { width:min(100%,780px); margin:clamp(52px,8vh,88px) auto auto; padding-bottom:36px; text-transform:uppercase; }
.application-heading h1 { margin:0 0 42px; font:400 clamp(27px,3.5vw,40px)/1 Raleway,sans-serif; letter-spacing:-.015em; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:28px 36px; }
.form-grid input { margin-top:9px; border-bottom:1px solid var(--line); padding:11px 0; text-transform:none; }
.full-width { grid-column:1/-1; }
.upload-area { border:1px solid var(--line); margin-top:36px; min-height:108px; display:flex; align-items:center; gap:18px; padding:20px 24px; cursor:pointer; transition:border-color .2s; }
.upload-area:hover { border-color:#fff; }
.upload-area input { display:none; }
.upload-mark { color:#fff; font:32px Raleway,sans-serif; }
.upload-area strong { display:block; font:500 11px Montserrat,sans-serif; letter-spacing:.08em; }
.upload-area small { display:block; margin-top:8px; color:var(--muted); font:10px Montserrat,sans-serif; letter-spacing:.06em; }
.submission { display:flex; gap:34px; align-items:flex-end; justify-content:space-between; margin-top:38px; }
.submission p { max-width:430px; margin:0; color:#ddd; font:500 12px/1.7 Montserrat,sans-serif; letter-spacing:.07em; }
.submit-button { flex:none; color:var(--white); border:1px solid rgba(255,255,255,.8); background:transparent; padding:15px 19px; font:500 10px Montserrat,sans-serif; letter-spacing:.14em; text-transform:uppercase; cursor:pointer; transition:transform .2s; }
.submit-button span { margin-left:17px; font-size:17px; vertical-align:-1px; }
footer { justify-content:space-between; margin-top:auto; padding-top:34px; color:#777; font-size:8px; letter-spacing:.18em; }
.application-mode .brand { flex-direction:column; justify-content:center; align-items:center; gap:14px; margin-top:0; text-align:center; }
.application-mode .brand .monogram { width:118px; height:146px; }
.application-mode .brand p { margin:0 0 0 .34em; font-size:clamp(18px,2.3vw,26px); letter-spacing:.34em; }
@keyframes appear { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }
@media (max-width:620px) {
  .page-shell { padding:24px 22px 18px; }
  .brand { margin-top:7vh; gap:15px; }
  .brand p { font-size:31px; letter-spacing:.26em; margin-left:.26em; }
  .monogram { width:96px; height:118px; }
  .access-panel { margin-top:9vh; }
  .application-mode .brand { margin-top:0; flex-direction:column; justify-content:center; align-items:center; gap:12px; text-align:center; }
  .application-mode .brand p { margin:0 0 0 .28em; font-size:18px; letter-spacing:.28em; }
  .application-mode .brand .monogram { width:94px; height:116px; }
  .application-panel { margin-top:48px; }
  .application-heading h1 { margin-bottom:34px; font-size:28px; }
  .form-grid { grid-template-columns:1fr; gap:23px; }
  .full-width { grid-column:auto; }
  .submission { align-items:flex-start; flex-direction:column; }
  .submission p { font-size:11px; }
  .submit-button { width:100%; }
}