/* shared primitives — lifted from the campus page so the forms match it */
@import url('/internship/assets/fonts.css');
:root{
  --ink:#08070F; --ink-2:#0F0E1C; --ink-3:#15142A;
  --text:#EAEDFF; --muted:#8E93B5; --muted-2:#5C6182;
  --line:rgba(255,255,255,.09); --line-2:rgba(255,255,255,.16);
  --surface:rgba(255,255,255,.028); --surface-2:rgba(255,255,255,.055);
  --violet:#516AF6; --violet-hi:#A3B0FF;
  --green:#19D97C; --orange:#FF5B2E; --pink:#FF4D8F;
  --glow-v:0 0 0 1px rgba(81,106,246,.35), 0 18px 60px -18px rgba(81,106,246,.55);
  --r-m:16px; --r-l:24px; --r-xl:34px;
  --display:'Aeonik',system-ui,sans-serif;
  --body:'Aeonik',system-ui,sans-serif;
  --mono:'Aeonik',ui-monospace,monospace;
  --pad:clamp(20px,5vw,72px); --maxw:1280px;
}
*{box-sizing:border-box;margin:0;padding:0}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
input,select,textarea,option,optgroup{font:inherit}
::placeholder{font:inherit}
html{scroll-behavior:smooth}
body{background:var(--ink);color:var(--text);font-family:var(--body);font-size:16px;line-height:1.55;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;position:relative}
body::after{content:'';position:fixed;inset:0;pointer-events:none;z-index:200;opacity:.14;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E")}
#stars{position:fixed;inset:0;z-index:0;pointer-events:none}
.aurora{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.aurora i{position:absolute;display:block;border-radius:50%;filter:blur(90px);opacity:.5}
.aurora i:nth-child(1){width:60vw;height:60vw;left:-18vw;top:-22vw;background:radial-gradient(circle,#2E3EB8,transparent 65%)}
.aurora i:nth-child(2){width:48vw;height:48vw;right:-16vw;top:14vh;background:radial-gradient(circle,#516AF6,transparent 62%);opacity:.32}
.aurora i:nth-child(3){width:52vw;height:52vw;left:22vw;bottom:-26vw;background:radial-gradient(circle,#141C52,transparent 66%)}
main,header,footer{position:relative;z-index:1}
h1,h2,h3,h4{font-family:var(--display);font-weight:700;letter-spacing:-.035em;line-height:.94;text-transform:lowercase}
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--pad)}
section{padding-block:clamp(80px,11vw,150px);position:relative;scroll-margin-top:84px}
.eyebrow{font-family:var(--mono);font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--violet-hi);display:inline-flex;align-items:center;gap:.6em}
.eyebrow::before{content:'';width:22px;height:1px;background:var(--violet)}
.btn{display:inline-flex;align-items:center;gap:.6em;padding:14px 24px;border-radius:100px;font-weight:600;font-size:.92rem;
  letter-spacing:-.01em;transition:transform .25s cubic-bezier(.2,.8,.3,1),box-shadow .25s,background .25s,border-color .25s}
.btn-p{background:linear-gradient(180deg,#6C82F8,#3D53E0);color:#fff;box-shadow:var(--glow-v)}
.btn-p:hover{transform:translateY(-2px);box-shadow:0 0 0 1px rgba(81,106,246,.55),0 26px 70px -18px rgba(81,106,246,.85)}
.btn-g{background:transparent;border:1px solid var(--line-2);color:var(--text)}
.btn-g:hover{background:var(--surface-2);border-color:var(--violet);transform:translateY(-2px)}
.btn-sm{padding:9px 16px;font-size:.8rem}
header{position:sticky;top:0;z-index:100;transition:background .3s,border-color .3s;border-bottom:1px solid transparent}
.nav{display:flex;align-items:center;gap:32px;height:70px;max-width:var(--maxw);margin:0 auto;padding-inline:var(--pad)}
.logo{display:flex;align-items:center;gap:9px;font-family:var(--display);font-weight:700;font-size:1.32rem;letter-spacing:-.05em}
.logo-mark{width:34px;height:34px;display:grid;place-items:center;color:var(--text);flex:none}
.logo-mark svg{width:100%;height:100%;display:block}
.logo span{color:var(--muted-2);font-weight:600}
.burger{display:none;margin-left:auto;width:40px;height:40px;border:1px solid var(--line);border-radius:12px;place-items:center}
.h1{font-family:var(--display);font-weight:700;text-transform:lowercase;letter-spacing:-.045em;line-height:.88;
  font-size:clamp(3.1rem,8.4vw,6.6rem);margin:22px 0 0}
.h1 .out{-webkit-text-stroke:1.4px var(--violet-hi);color:transparent;paint-order:stroke}
.h1 .grad{background:linear-gradient(100deg,#fff 10%,#A3B0FF 45%,#19D97C 95%);-webkit-background-clip:text;background-clip:text;color:transparent}
.card-glass{background:linear-gradient(165deg,rgba(255,255,255,.07),rgba(255,255,255,.02));border:1px solid var(--line);
  border-radius:var(--r-l);backdrop-filter:blur(14px);box-shadow:0 40px 90px -40px rgba(0,0,0,.9)}
@keyframes fade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
footer{border-top:1px solid var(--line);padding-block:56px 40px;margin-top:clamp(60px,9vw,120px)}
.f-grid{display:grid;grid-template-columns:1fr;gap:34px}
.f-grid p{font-size:.86rem;margin-top:14px;max-width:34ch}
.f-bot{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:46px;padding-top:26px;border-top:1px solid var(--line);font-family:var(--mono);font-size:.66rem;color:var(--muted-2)}
.rv{opacity:0;transform:translateY(26px);transition:opacity .8s cubic-bezier(.2,.8,.3,1),transform .8s cubic-bezier(.2,.8,.3,1)}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}}
/* ── FORM PAGES ─────────────────────────────────────── */
.pagehead{padding-block:clamp(48px,7vw,86px) clamp(24px,3vw,36px)}
.pagehead .h1{font-size:clamp(2.4rem,6vw,4.2rem)}
.pagehead p{font-size:1.02rem;max-width:60ch;margin-top:18px}
.back{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.64rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--muted-2);margin-bottom:22px;transition:.25s}
.back:hover{color:var(--text);gap:12px}
.back{color:var(--muted)}
.formwrap{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(22px,3.4vw,48px);align-items:start;
  padding-bottom:clamp(60px,9vw,120px)}
@media(max-width:940px){.formwrap{grid-template-columns:1fr}}
.card{border:1px solid var(--line);border-radius:var(--r-l);background:var(--surface);padding:clamp(24px,3.2vw,38px)}
.card+.card{margin-top:14px}
.fset{border:0;margin:0 0 30px}
.fset:last-of-type{margin-bottom:0}
.fset legend{font-family:var(--mono);font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--violet-hi);margin-bottom:18px;padding:0}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:620px){.frow{grid-template-columns:1fr}}
.f{display:block;margin-bottom:14px}
.f>span{display:block;font-size:.86rem;margin-bottom:7px;color:var(--text)}
.f>span em{font-style:normal;color:var(--muted-2);font-size:.78rem}
.f .hint{display:block;font-size:.78rem;color:var(--muted-2);margin-top:6px;line-height:1.45}
input[type=text],input[type=email],input[type=url],input[type=tel],input[type=date],select,textarea{
  width:100%;padding:13px 15px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.03);
  color:var(--text);font-family:var(--body);font-size:.92rem;transition:.24s;-webkit-appearance:none;appearance:none}
select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238E93B5' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 15px center;background-size:12px;padding-right:40px;
  /* macOS draws the open list itself and ignores our colours, so it comes out
     dark either way. Windows draws it in the browser off the light system
     scheme and off the select's own colours — a see-through white background
     under near-white text — so the list lands unreadable there. Ask for the
     dark scheme and paint the rows opaquely. */
  color-scheme:dark}
select option,select optgroup{background-color:var(--ink-2);color:var(--text)}
select option:disabled{color:var(--muted-2)}
textarea{min-height:104px;resize:vertical;line-height:1.55}
input[type=date]::-webkit-calendar-picker-indicator{filter:invert(1);opacity:.5;cursor:pointer}
input[type=date]::-webkit-calendar-picker-indicator:hover{opacity:.9}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--violet);background:rgba(81,106,246,.07);
  box-shadow:0 0 0 3px rgba(81,106,246,.16)}
input::placeholder,textarea::placeholder{color:var(--muted-2);opacity:.7}
input[aria-invalid=true],textarea[aria-invalid=true],select[aria-invalid=true]{border-color:var(--orange);background:rgba(255,91,46,.06)}
.err{display:none;font-size:.78rem;color:#FF8A66;margin-top:6px}
.err.on{display:block}
.count{float:right;font-family:var(--mono);font-size:.66rem;color:var(--muted-2)}
.checks{display:grid;gap:10px}
.chk{display:flex;gap:11px;align-items:flex-start;font-size:.86rem;line-height:1.5;color:#B4ADD4;cursor:pointer;
  padding:13px 15px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.02);transition:.24s}
.chk:hover{border-color:var(--line-2)}
.chk input{width:17px;height:17px;flex:none;margin-top:1px;accent-color:var(--violet);cursor:pointer}
.chk.bad{border-color:var(--orange)}
.seatpick{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:8px}
@media(max-width:900px){.seatpick{grid-template-columns:repeat(3,1fr)}}
@media(max-width:520px){.seatpick{grid-template-columns:repeat(2,1fr)}}
.seat{padding:14px 12px;border-radius:12px;border:1px solid var(--line);background:var(--surface);
  text-align:left;transition:.26s;cursor:pointer}
.seat:hover{border-color:var(--line-2);transform:translateY(-2px)}
.seat.on{border-color:var(--violet);background:rgba(81,106,246,.16)}
.seat b{display:block;font-family:var(--display);font-size:.96rem;font-weight:700;letter-spacing:-.03em;
  text-transform:lowercase;margin-bottom:3px}
.seat small{font-family:var(--mono);font-size:.56rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted-2)}
.seat.on small{color:var(--violet-hi)}
.actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:26px;padding-top:24px;border-top:1px solid var(--line)}
.actions .note{font-family:var(--mono);font-size:.62rem;color:var(--muted-2);letter-spacing:.06em}
.btn[disabled]{opacity:.55;pointer-events:none}
.aside h4{font-family:var(--display);font-size:1.16rem;text-transform:lowercase;letter-spacing:-.035em;margin-bottom:14px}
.aside ul{list-style:none;display:grid;gap:11px}
.aside li{display:flex;gap:11px;font-size:.85rem;line-height:1.5;color:#B4ADD4}
.aside li::before{content:'▶';font-size:.72em;line-height:1.5;color:var(--violet-hi);flex:none}
.krow{display:flex;justify-content:space-between;gap:14px;padding:12px 0;border-top:1px solid var(--line);font-size:.86rem}
.krow:first-of-type{border-top:0}
.krow b{font-family:var(--mono);font-size:.78rem;color:var(--green);text-align:right;white-space:nowrap}
/* the honeypot: a real applicant never sees it, so anything typed in it
   came from a bot and the sheet drops the row */
.hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none}
.banner{border-radius:14px;padding:16px 18px;font-size:.86rem;line-height:1.55;margin-bottom:22px;display:none}
.banner.on{display:block}
.banner.warn{border:1px solid rgba(255,164,107,.4);background:rgba(255,164,107,.1);color:#FFD2AE}
.banner.bad{border:1px solid rgba(255,91,46,.45);background:rgba(255,91,46,.1);color:#FFB49B}
.done{display:none;text-align:center;padding:clamp(34px,6vw,64px) clamp(20px,4vw,44px);border-radius:var(--r-xl);
  border:1px solid rgba(25,217,124,.35);
  background:radial-gradient(circle at 50% 0%,rgba(25,217,124,.18),transparent 62%),linear-gradient(180deg,rgba(255,255,255,.04),transparent)}
.done.on{display:block}
.done .tick{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;margin:0 auto 20px;
  background:rgba(25,217,124,.16);border:1px solid rgba(25,217,124,.45);color:var(--green);font-size:1.5rem}
.done h2{margin-bottom:14px}
.done p{max-width:52ch;margin:0 auto 10px}
.done .dump{text-align:left;margin:26px auto 0;max-width:560px;font-family:var(--mono);font-size:.72rem;
  color:var(--muted);background:rgba(0,0,0,.3);border:1px solid var(--line);border-radius:12px;padding:18px;
  max-height:280px;overflow:auto;white-space:pre-wrap;word-break:break-word}

/* ── UNIVERSITY AUTOCOMPLETE ─────────────────────────
   the suggestion list hangs off a .f, so the label it sits in becomes
   the positioning context and the list floats over the row below */
.ac-field{position:relative}
.ac-list{position:absolute;z-index:40;left:0;right:0;margin-top:6px;padding:6px;list-style:none;
  max-height:262px;overflow-y:auto;-webkit-overflow-scrolling:touch;
  border:1px solid var(--line-2);border-radius:12px;background:#141322;
  box-shadow:0 18px 40px rgba(0,0,0,.55)}
.ac-list li{padding:10px 12px;border-radius:8px;font-size:.88rem;line-height:1.35;color:#D8D6E8;cursor:pointer}
.ac-list li:hover,.ac-list li.on{background:rgba(81,106,246,.2);color:var(--text)}
.ac-note b{color:var(--text);font-weight:500}
.ac-undo{background:none;border:0;padding:0;font:inherit;color:var(--violet-hi);
  text-decoration:underline;text-underline-offset:2px;cursor:pointer}
