:root{
  --ink:#12233B; --ink-2:#33465F; --muted:#6B7C93;
  --surface:#F4F7FA; --card:#FFFFFF; --line:#E5ECF2; --line-2:#D2DEE8;
  --teal:#0E7C6B; --teal-ink:#0B5F52; --teal-wash:#E4F2EF;
  --amber:#B4741F; --amber-wash:#F7ECD9;
  --file:#FBF5E9; --file-edge:#E9D9BC;
  --shadow:0 1px 2px rgba(18,35,59,.05), 0 12px 30px rgba(18,35,59,.07);
  --shadow-sm:0 1px 2px rgba(18,35,59,.06);
  --font-d:"Bricolage Grotesque",system-ui,sans-serif;
  --font-b:"IBM Plex Sans",system-ui,-apple-system,sans-serif;
  --font-m:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0; background:var(--surface); color:var(--ink); font-family:var(--font-b); line-height:1.5}
a{color:var(--teal-ink)}

/* ---------- app shell ---------- */
.app{display:grid; grid-template-columns:214px 1fr; min-height:100vh}
.rail{background:var(--ink); color:#b7c6da; padding:16px 13px; display:flex; flex-direction:column; gap:3px; position:sticky; top:0; height:100vh}
.rail__logo{display:flex; align-items:center; gap:10px; padding:6px 8px 16px; margin-bottom:6px; border-bottom:1px solid rgba(255,255,255,.08)}
.rail__mark{width:30px; height:30px; border-radius:9px; background:linear-gradient(150deg,var(--teal),#13a58c); display:flex; align-items:center; justify-content:center; color:#fff; font-weight:700; flex:none; box-shadow:inset 0 0 0 1px rgba(255,255,255,.15)}
.rail__name{font-family:var(--font-d); font-weight:600; font-size:14px; color:#fff; line-height:1.15}
.rail__name small{display:block; font-family:var(--font-b); font-weight:400; font-size:10.5px; color:#7f93ac; letter-spacing:.02em}
.nav{display:flex; flex-direction:column; gap:2px; margin-top:4px}
.nav a{display:flex; align-items:center; gap:11px; padding:9px 11px; border-radius:9px; color:#a6b8ce; text-decoration:none; font-size:13.5px; font-weight:500}
.nav a:hover{background:rgba(255,255,255,.06); color:#e7eef6}
.nav a.active{background:rgba(20,165,140,.16); color:#fff; box-shadow:inset 0 0 0 1px rgba(20,165,140,.35)}
.nav a .ic{width:18px; height:18px; flex:none; stroke:currentColor; fill:none; stroke-width:1.7}
.rail__foot{margin-top:auto; padding-top:12px; border-top:1px solid rgba(255,255,255,.08)}
.rail__user{display:flex; align-items:center; gap:10px; padding:7px 8px; border-radius:9px; text-decoration:none}
.rail__ava{width:30px; height:30px; border-radius:50%; background:#25405f; color:#cfe0f0; display:flex; align-items:center; justify-content:center; font-weight:600; font-size:12px; flex:none}
.rail__user b{font-size:13px; color:#e7eef6; font-weight:600; display:block; line-height:1.2}
.rail__user small{font-size:11px; color:#7f93ac}

.main{display:flex; flex-direction:column; min-width:0}
.topbar{display:flex; align-items:center; gap:14px; padding:15px 24px; background:#fff; border-bottom:1px solid var(--line); position:sticky; top:0; z-index:10}
.topbar__title{font-family:var(--font-d); font-weight:600; font-size:17px; letter-spacing:-.01em}
.crumb{font-size:13px; color:var(--muted)}
.crumb a{color:var(--muted); text-decoration:none}
.crumb b{color:var(--ink); font-weight:600}
.search{margin-left:auto; display:flex; align-items:center; gap:8px; background:var(--surface); border:1px solid var(--line); border-radius:9px; padding:7px 12px; color:var(--muted); font-size:13px; min-width:190px}
.search input{border:0; background:transparent; outline:none; font-family:var(--font-b); font-size:13px; color:var(--ink); width:100%}
.search .ic{width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:1.8; flex:none}
.content{padding:24px; max-width:1120px; width:100%}

/* ---------- buttons ---------- */
.btn{display:inline-flex; align-items:center; gap:7px; font-family:var(--font-b); font-weight:600; font-size:13.5px; padding:9px 15px; border-radius:9px; border:1px solid transparent; cursor:pointer; text-decoration:none; white-space:nowrap; line-height:1}
.btn .ic{width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:1.8}
.btn--primary{background:var(--teal); color:#fff; box-shadow:var(--shadow-sm)}
.btn--primary:hover{background:var(--teal-ink)}
.btn--ghost{background:#fff; color:var(--ink); border-color:var(--line-2)}
.btn--ghost:hover{border-color:#b9c8d6; background:#fbfdfe}
.btn--soft{background:var(--teal-wash); color:var(--teal-ink)}
.btn--sm{padding:6px 11px; font-size:12.5px; border-radius:8px}

/* ---------- badges ---------- */
.badge{display:inline-flex; align-items:center; gap:6px; font-weight:600; font-size:12px; padding:4px 10px 4px 8px; border-radius:999px; line-height:1; white-space:nowrap}
.badge::before{content:""; width:7px; height:7px; border-radius:50%; background:currentColor; opacity:.9}
.s-applied{background:#EEF2F6; color:#5B6B80}
.s-reviewed{background:#E9EFFC; color:#3562C4}
.s-accepted{background:var(--teal-wash); color:var(--teal-ink)}
.s-depositpaid{background:var(--amber-wash); color:var(--amber)}
.s-enrolled{background:#E3F2E9; color:#1F7A4D}
.s-inprogress{background:#ECEAFA; color:#514BC0}
.s-completed{background:#DDEEE4; color:#0F6B3E}

/* ---------- stat cards ---------- */
.stats{display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:22px}
.stat{background:#fff; border:1px solid var(--line); border-radius:14px; padding:16px 16px 15px; box-shadow:var(--shadow-sm)}
.stat__l{font-size:12.5px; color:var(--muted); font-weight:500; display:flex; align-items:center; gap:7px}
.stat__l .ic{width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:1.7; color:var(--teal)}
.stat__n{font-family:var(--font-d); font-weight:700; font-size:28px; margin-top:9px; letter-spacing:-.02em; line-height:1}
.stat__d{font-size:11.5px; color:var(--muted); margin-top:6px}

.greet{font-family:var(--font-d); font-weight:600; font-size:20px; margin:0 0 3px; letter-spacing:-.01em}
.greet + .sub{font-size:13px; color:var(--muted); margin:0 0 20px}

.cols{display:grid; grid-template-columns:1.55fr 1fr; gap:16px; align-items:start}
.panel{background:#fff; border:1px solid var(--line); border-radius:14px; box-shadow:var(--shadow-sm); overflow:hidden}
.panel__h{display:flex; align-items:center; justify-content:space-between; padding:14px 16px; border-bottom:1px solid var(--line)}
.panel__h h3{font-family:var(--font-d); font-weight:600; font-size:14px; margin:0}
.panel__h a{font-size:12.5px; color:var(--teal-ink); text-decoration:none; font-weight:600}
.rev{display:flex; align-items:center; gap:12px; padding:12px 16px; border-bottom:1px solid var(--line); text-decoration:none; color:inherit}
.rev:last-child{border-bottom:0}
.rev:hover{background:#FBFDFE}
.rev__ava{width:34px; height:34px; border-radius:50%; background:var(--teal-wash); color:var(--teal-ink); display:flex; align-items:center; justify-content:center; font-weight:600; font-size:13px; flex:none}
.rev__who b{font-size:13.5px; font-weight:600}
.rev__who small{display:block; color:var(--muted); font-size:12px}
.rev__meta{margin-left:auto; text-align:right; display:flex; align-items:center; gap:12px}
.rev__meta .t{font-family:var(--font-m); font-size:11.5px; color:var(--muted)}
.empty{padding:26px 16px; text-align:center; color:var(--muted); font-size:13px}

.pipe{padding:8px 16px 14px}
.pipe__row{display:flex; align-items:center; gap:10px; padding:8px 0}
.pipe__row .lbl{font-size:12.5px; width:96px; color:var(--ink-2); flex:none}
.pipe__bar{height:8px; border-radius:5px; background:#EEF3F7; flex:1; overflow:hidden}
.pipe__bar i{display:block; height:100%; border-radius:5px; background:var(--teal)}
.pipe__row .n{font-family:var(--font-m); font-size:12px; color:var(--ink-2); width:26px; text-align:right; flex:none}

/* ---------- filter chips ---------- */
.chips{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:16px}
.chip{font-size:13px; font-weight:500; padding:7px 13px; border-radius:999px; border:1px solid var(--line-2); background:#fff; color:var(--ink-2); cursor:pointer; text-decoration:none}
.chip.active{background:var(--ink); color:#fff; border-color:var(--ink)}

/* ---------- table ---------- */
.tablewrap{background:#fff; border:1px solid var(--line); border-radius:14px; box-shadow:var(--shadow-sm); overflow:hidden}
table.t{width:100%; border-collapse:collapse}
table.t th{text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); font-weight:600; padding:12px 16px; background:#FBFDFE; border-bottom:1px solid var(--line)}
table.t td{padding:13px 16px; border-bottom:1px solid var(--line); font-size:13.5px; vertical-align:middle}
table.t tr:last-child td{border-bottom:0}
table.t tr:hover td{background:#FBFDFE}
.id{font-family:var(--font-m); font-size:12.5px; color:var(--ink-2)}
.who{display:flex; align-items:center; gap:11px}
.who .a{width:32px; height:32px; border-radius:50%; background:#EAF1F6; color:var(--ink-2); display:flex; align-items:center; justify-content:center; font-weight:600; font-size:12px; flex:none}
.who b{font-weight:600; font-size:13.5px}
.who small{display:block; color:var(--muted); font-size:12px}
.tright{text-align:right}
.upd{font-family:var(--font-m); font-size:11.5px; color:var(--muted)}

/* ---------- STUDENT FILE ---------- */
.file__head{position:relative; margin-top:16px; background:var(--file); border:1px solid var(--file-edge); border-radius:4px 16px 16px 16px; padding:20px 22px 18px; box-shadow:var(--shadow-sm)}
.file__tab{position:absolute; top:-27px; left:-1px; height:28px; padding:0 18px 0 16px; background:var(--file); border:1px solid var(--file-edge); border-bottom:none; border-radius:9px 12px 0 0; display:flex; align-items:center; gap:9px; font-family:var(--font-m); font-size:12.5px; font-weight:600; color:var(--ink-2)}
.file__tab::after{content:""; position:absolute; right:-13px; bottom:-1px; width:14px; height:14px; background:var(--file); border-bottom:1px solid var(--file-edge); border-left:1px solid var(--file-edge); transform:skewX(-24deg); border-radius:0 0 0 4px}
.file__tab .dotm{width:7px; height:7px; border-radius:50%; background:var(--teal)}
.file__top{display:flex; align-items:flex-start; gap:16px; flex-wrap:wrap}
.file__ava{width:52px; height:52px; border-radius:12px; background:#fff; border:1px solid var(--file-edge); color:var(--ink); display:flex; align-items:center; justify-content:center; font-family:var(--font-d); font-weight:700; font-size:19px; flex:none}
.file__id h1{font-family:var(--font-d); font-weight:600; font-size:22px; margin:0 0 3px; letter-spacing:-.01em}
.file__id .meta{font-size:13px; color:var(--ink-2)}
.file__id .meta .dot{color:var(--file-edge); margin:0 7px}
.file__act{margin-left:auto; display:flex; align-items:center; gap:9px; flex-wrap:wrap}

.pipeline{display:flex; align-items:center; gap:0; margin-top:18px; overflow:auto; padding-bottom:2px}
.pstep{display:flex; align-items:center; gap:8px; flex:none}
.pstep .dot{width:22px; height:22px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:700; background:#fff; border:1.5px solid var(--file-edge); color:var(--muted); flex:none}
.pstep .nm{font-size:11.5px; color:var(--muted); font-weight:500; white-space:nowrap}
.pstep.done .dot{background:var(--teal); border-color:var(--teal); color:#fff}
.pstep.done .nm{color:var(--ink-2)}
.pstep.now .dot{background:#fff; border-color:var(--teal); color:var(--teal-ink); box-shadow:0 0 0 4px var(--teal-wash)}
.pstep.now .nm{color:var(--teal-ink); font-weight:700}
.pline{width:24px; height:1.5px; background:var(--file-edge); flex:none; margin:0 3px}
.pline.done{background:var(--teal)}

.tabs{display:flex; gap:2px; margin-top:20px; border-bottom:1px solid var(--line); flex-wrap:wrap}
.tabs a{padding:11px 15px; font-size:13.5px; font-weight:600; color:var(--muted); text-decoration:none; border-bottom:2px solid transparent; margin-bottom:-1px}
.tabs a:hover{color:var(--ink-2)}
.tabs a.active{color:var(--teal-ink); border-bottom-color:var(--teal)}
.tabpanel{padding-top:18px}

.detrow{display:flex; justify-content:space-between; gap:14px; padding:11px 2px; border-bottom:1px dashed var(--line); font-size:14px}
.detrow:last-child{border-bottom:0}
.detrow .k{color:var(--muted)}
.card{background:#fff; border:1px solid var(--line); border-radius:14px; box-shadow:var(--shadow-sm); padding:6px 18px}

/* documents */
.dropzone{margin:0 0 18px; border:1.5px dashed var(--line-2); border-radius:13px; background:#fff; padding:20px; display:flex; align-items:center; gap:16px; flex-wrap:wrap}
.dropzone .ic{width:30px; height:30px; stroke:var(--teal); fill:none; stroke-width:1.6; flex:none}
.dropzone b{font-size:14px; display:block}
.dropzone small{color:var(--muted); font-size:12.5px}
.dropzone form{margin-left:auto; display:flex; align-items:center; gap:8px; flex-wrap:wrap}
.docs{display:grid; grid-template-columns:repeat(2,1fr); gap:12px}
.doc{display:flex; align-items:center; gap:13px; background:#fff; border:1px solid var(--line); border-radius:12px; padding:13px 14px; box-shadow:var(--shadow-sm); text-decoration:none; color:inherit}
.doc:hover{border-color:var(--line-2)}
.doc__open{display:flex; align-items:center; gap:13px; text-decoration:none; color:inherit; flex:1; min-width:0}
.doc__open:hover .doc__meta b{color:var(--teal-ink); text-decoration:underline}
.doc__ic{width:40px; height:46px; border-radius:6px; position:relative; flex:none; display:flex; align-items:flex-end; justify-content:center; padding-bottom:6px; color:#fff; font-family:var(--font-m); font-size:9px; font-weight:600; background:#5B7893}
.doc__ic::before{content:""; position:absolute; top:0; right:0; border-width:0 11px 11px 0; border-style:solid; border-color:rgba(255,255,255,.5) #fff; border-radius:0 0 0 3px}
.ic-jpg,.ic-jpeg{background:#2E8B87} .ic-pdf{background:#C0533F} .ic-png{background:#3E6DB0} .ic-doc,.ic-docx{background:#2f5fa0}
.doc__meta{min-width:0}
.doc__meta b{font-size:13px; font-weight:600; display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.doc__meta small{color:var(--muted); font-size:11.5px; font-family:var(--font-m)}
.doc__go{margin-left:auto; display:flex; gap:6px; align-items:center; flex:none}
.iconbtn{width:30px; height:30px; border-radius:8px; border:1px solid var(--line-2); background:#fff; color:var(--muted); cursor:pointer; font-size:13px; line-height:1}
.iconbtn:hover{color:#B4291B; border-color:#E4A99F}

/* ---------- form ---------- */
.formgrid{display:grid; grid-template-columns:1fr 1fr; gap:16px; align-items:start}
.fcard{background:#fff; border:1px solid var(--line); border-radius:14px; box-shadow:var(--shadow-sm); padding:18px}
.fcard h3{font-family:var(--font-d); font-weight:600; font-size:13px; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-2); margin:0 0 14px}
.fld{margin-bottom:13px}
.fld:last-child{margin-bottom:0}
.fld label{display:block; font-size:12.5px; font-weight:600; color:var(--ink-2); margin-bottom:6px}
.fld label i{color:#C0533F; font-style:normal}
.inp{width:100%; padding:10px 12px; border:1px solid var(--line-2); border-radius:9px; font-family:var(--font-b); font-size:13.5px; color:var(--ink); background:#fff}
.inp::placeholder{color:#9fb0c1}
textarea.inp{resize:vertical; min-height:64px}
select.inp{appearance:none; background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%236B7C93' stroke-width='1.8'><path d='M4 6l4 4 4-4'/></svg>"); background-repeat:no-repeat; background-position:right 11px center}
.frow{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.formfoot{grid-column:1/-1; display:flex; align-items:center; gap:12px; padding-top:4px; flex-wrap:wrap}
.formfoot .req{font-size:12px; color:var(--muted)}
.formfoot .sp{margin-left:auto}
.err{background:#FDECEA; color:#A23B2D; border:1px solid #F5C9C1; padding:10px 13px; border-radius:9px; margin-bottom:16px; font-size:13.5px}

/* ---------- login ---------- */
.login{display:grid; grid-template-columns:1.05fr .95fr; min-height:100vh}
.login__brand{background:radial-gradient(120% 100% at 0% 0%, #1a3454 0%, var(--ink) 60%); color:#fff; padding:44px; display:flex; flex-direction:column; position:relative; overflow:hidden}
.login__brand::after{content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px); background-size:26px 26px; -webkit-mask:radial-gradient(80% 60% at 70% 40%,#000,transparent); mask:radial-gradient(80% 60% at 70% 40%,#000,transparent)}
.login__brand > *{position:relative; z-index:1}
.login__mark{display:flex; align-items:center; gap:11px; margin-bottom:auto}
.login__mark .m{width:34px; height:34px; border-radius:10px; background:linear-gradient(150deg,var(--teal),#13a58c); display:flex; align-items:center; justify-content:center; font-weight:700; box-shadow:inset 0 0 0 1px rgba(255,255,255,.15)}
.login__mark b{font-family:var(--font-d); font-weight:600; font-size:15px}
.login__mark small{display:block; font-size:10.5px; color:#8ea3bd; font-weight:400}
.login__eyebrow{font-family:var(--font-m); font-size:11.5px; letter-spacing:.16em; color:#7fd8c8; text-transform:uppercase; margin:0 0 14px}
.login__brand h2{font-family:var(--font-d); font-weight:600; font-size:32px; line-height:1.12; letter-spacing:-.02em; margin:0 0 14px; max-width:15ch}
.login__brand p{color:#b7c6da; font-size:14px; max-width:34ch; margin:0}
.login__form{background:#fff; padding:44px 40px; display:flex; flex-direction:column; justify-content:center}
.login__form h3{font-family:var(--font-d); font-weight:600; font-size:21px; margin:0 0 4px}
.login__form .lead{color:var(--muted); font-size:13.5px; margin:0 0 24px}
.login__form .fld{margin-bottom:16px}
.login__form .btn{width:100%; justify-content:center; padding:12px; font-size:14px; margin-top:6px}
.login__form .foot{margin-top:18px; font-size:12px; color:var(--muted); text-align:center}

/* ---------- guided workflow ---------- */
.s-declined{background:#FDECEA; color:#B4291B}
.btn--danger{background:#fff; color:#B4291B; border-color:#F0C4BD}
.btn--danger:hover{background:#FDF3F1; border-color:#E4A99F}
.nextsteps{display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; margin-top:16px; padding-top:16px; border-top:1px solid var(--file-edge)}
.nextsteps__k{display:block; font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); font-weight:600; margin-bottom:2px}
.nextsteps__l b{font-size:14px}
.nextsteps__b{display:flex; gap:8px; flex-wrap:wrap; align-items:center}
.nextsteps form{margin:0}
.banner{display:flex; align-items:flex-start; gap:12px; background:var(--teal-wash); border:1px solid #BFE3DB; border-radius:12px; padding:13px 16px; margin-top:16px}
.banner .ic{width:20px; height:20px; stroke:var(--teal-ink); fill:none; stroke-width:1.7; flex:none; margin-top:1px}
.banner b{font-size:13.5px}
.banner small{display:block; color:var(--teal-ink); font-size:12.5px; opacity:.85}
.declined-note{margin-top:16px; background:#FDECEA; color:#B4291B; border:1px solid #F3C7C0; border-radius:10px; padding:12px 14px; font-size:13.5px; font-weight:500}
.advanced{margin-top:18px}
.advanced summary{cursor:pointer; color:var(--muted); font-size:12.5px; font-weight:600; list-style:none}
.advanced summary::-webkit-details-marker{display:none}
.advanced summary::before{content:"⚙ "}

/* ---------- profile photos ---------- */
.file__ava, .who .a, .rev__ava, .photo-preview{overflow:hidden}
.ava-img{width:100%; height:100%; object-fit:cover; display:block}
.photo-row{display:flex; gap:16px; align-items:center; background:#fff; border:1px solid var(--line); border-radius:14px; padding:16px; margin-bottom:14px}
.photo-preview{width:72px; height:72px; border-radius:14px; background:#EAF1F6; color:var(--ink-2); display:flex; align-items:center; justify-content:center; font-weight:700; font-family:var(--font-d); font-size:22px; flex:none; border:1px solid var(--line)}
.photo-row b{font-size:14px}

/* ---------- public application ---------- */
.pubbar{display:flex; align-items:center; gap:10px; padding:15px 22px; background:#fff; border-bottom:1px solid var(--line); font-family:var(--font-d); font-weight:600; font-size:16px}
.pubwrap{max-width:780px; margin:0 auto; padding:28px 18px 60px}
.pubhero{margin:6px 0 22px}
.pubhero h1{font-family:var(--font-d); font-weight:600; font-size:30px; letter-spacing:-.02em; margin:0 0 8px}
.pubhero p{color:var(--muted); font-size:15px; margin:0; max-width:54ch}
.pubfoot{text-align:center; color:var(--muted); font-size:12.5px; padding:24px}
.thanks{background:#fff; border:1px solid var(--line); border-radius:16px; box-shadow:var(--shadow); padding:40px 30px; text-align:center; margin-top:20px}
.thanks .big{width:56px; height:56px; border-radius:50%; background:var(--teal-wash); color:var(--teal-ink); display:flex; align-items:center; justify-content:center; margin:0 auto 16px; font-size:26px; font-weight:700}
.thanks h1{font-family:var(--font-d); font-weight:600; font-size:24px; margin:0 0 8px}
.thanks .ref{font-family:var(--font-m); font-weight:600; background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:6px 12px; display:inline-block; margin:10px 0}

/* ---------- marketing site ---------- */
body.site{background:#fff}
.site-nav{position:sticky; top:0; z-index:20; display:flex; align-items:center; gap:18px; padding:14px 24px; background:rgba(255,255,255,.9); backdrop-filter:blur(8px); border-bottom:1px solid var(--line)}
.site-brand{display:flex; align-items:center; gap:9px; font-family:var(--font-d); font-weight:600; font-size:16px; color:var(--ink); text-decoration:none}
.site-links{display:flex; gap:20px; margin-left:14px}
.site-links a{color:var(--ink-2); text-decoration:none; font-size:14px; font-weight:500}
.site-links a:hover{color:var(--teal-ink)}
.site-actions{margin-left:auto; display:flex; gap:8px; align-items:center}
.hero{position:relative; overflow:hidden; background:radial-gradient(120% 120% at 80% 0%, #14324f 0%, #0d1f31 55%, #0b1a29 100%); color:#fff; min-height:560px; display:flex; align-items:center}
#bg3d{position:absolute; inset:0; width:100%; height:100%; display:block}
.hero-inner{position:relative; z-index:1; max-width:1080px; margin:0 auto; padding:70px 24px; width:100%}
.hero-eyebrow{font-family:var(--font-m); font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:#7fd8c8; margin:0 0 14px}
.hero h1{font-family:var(--font-d); font-weight:600; font-size:clamp(34px,6vw,60px); line-height:1.04; letter-spacing:-.02em; margin:0 0 16px; max-width:16ch}
.hero .lead{font-size:clamp(15px,2vw,19px); color:#c3d3e2; max-width:46ch; margin:0 0 28px}
.hero-cta{display:flex; gap:12px; flex-wrap:wrap}
.ghost-light{background:rgba(255,255,255,.08); color:#fff; border:1px solid rgba(255,255,255,.25)}
.ghost-light:hover{background:rgba(255,255,255,.16)}
.section{max-width:1080px; margin:0 auto; padding:66px 24px}
.section.alt{background:var(--surface); max-width:none}
.section.alt > *{max-width:1080px; margin-left:auto; margin-right:auto}
.section__head{margin-bottom:26px}
.section__head h2{font-family:var(--font-d); font-weight:600; font-size:30px; letter-spacing:-.01em; margin:0 0 6px}
.section__head p{color:var(--muted); margin:0; font-size:15px}
.progs{display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:16px}
.prog{background:#fff; border:1px solid var(--line); border-radius:16px; padding:20px; box-shadow:var(--shadow-sm); transition:transform .15s, box-shadow .15s}
.prog:hover{transform:translateY(-3px); box-shadow:var(--shadow)}
.prog h3{font-family:var(--font-d); font-weight:600; font-size:19px; margin:0 0 8px}
.prog p{color:var(--ink-2); font-size:14px; margin:0 0 16px}
.prog__meta{display:flex; align-items:center; justify-content:flex-end; border-top:1px solid var(--line); padding-top:12px}
.prog__apply{font-size:13.5px; font-weight:600; color:var(--teal-ink); text-decoration:none}
.about-text{font-size:17px; line-height:1.7; color:var(--ink-2); max-width:64ch}
.contact-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:14px; margin-bottom:22px}
.contact-card{background:#fff; border:1px solid var(--line); border-radius:14px; padding:18px; box-shadow:var(--shadow-sm)}
.contact-card .k{display:block; font-size:12px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); margin-bottom:6px}
.contact-card b{font-size:15px}
.contact-cta{display:flex; gap:12px; flex-wrap:wrap}
.site-foot{text-align:center; padding:30px; color:var(--muted); font-size:13px; border-top:1px solid var(--line)}
.site-foot a{color:var(--teal-ink)}
.svc-row{display:grid; grid-template-columns:1.2fr 2.6fr auto; gap:8px; align-items:center; margin-bottom:8px}
.svc-del{display:flex; align-items:center; gap:5px; font-size:12px; color:var(--muted); white-space:nowrap}
@media(max-width:720px){.site-links{display:none} .svc-row{grid-template-columns:1fr 1fr}}

/* ---------- payment requests + pay link ---------- */
.tabh{font-family:var(--font-d); font-weight:600; font-size:14px; margin:0 0 4px}
.req{display:flex; align-items:center; gap:12px; background:#fff; border:1px solid var(--line); border-radius:12px; padding:12px 14px; box-shadow:var(--shadow-sm); margin-bottom:8px}
.req__main{min-width:0; flex:1}
.req__main b{font-size:15px}
.req__link{display:flex; align-items:center; gap:10px; margin-top:6px; flex-wrap:wrap}
.req__link code{font-family:var(--font-m); font-size:12px; color:var(--ink-2); background:var(--surface); border:1px solid var(--line); border-radius:6px; padding:3px 8px}
.reqtag{font-size:11px; font-weight:700; padding:2px 9px; border-radius:999px}
.reqtag.due{background:var(--amber-wash); color:var(--amber)}
.reqtag.paid{background:#DDEEE4; color:#0F6B3E}
.req__actions{display:flex; gap:8px; align-items:center; flex:none; flex-wrap:wrap}
.btn--wa{background:#25D366; color:#fff}
.btn--wa:hover{background:#1eb457}
.picklist{max-height:210px; overflow:auto; border:1px solid var(--line); border-radius:10px; padding:6px 12px; background:#fff}
.pick{display:flex; align-items:center; gap:9px; padding:7px 2px; font-size:14px; cursor:pointer}
.pick input{width:auto; margin:0}
.yes{color:var(--teal-ink); font-weight:700}
.paycard{max-width:420px; margin:26px auto; background:#fff; border:1px solid var(--line); border-radius:18px; box-shadow:var(--shadow); padding:34px 30px; text-align:center}
.paycard__eyebrow{font-size:12.5px; color:var(--muted); margin:0 0 12px}
.paycard__amt{font-family:var(--font-d); font-weight:700; font-size:52px; letter-spacing:-.02em; color:var(--ink); line-height:1}
.paycard__desc{font-size:15px; color:var(--ink-2); margin:10px 0 4px}

/* ---- Leads: 3 company boxes, source tags, lead statuses ---- */
.lead-intro{color:var(--muted); font-size:14px; margin:2px 0 18px; max-width:640px}
.lead-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px}
.lead-box{display:flex; flex-direction:column; gap:10px; min-height:140px; background:#fff; border:1px solid var(--line); border-radius:16px; box-shadow:var(--shadow-sm); padding:20px; text-decoration:none; color:var(--ink); transition:border-color .12s, box-shadow .12s, transform .12s}
.lead-box:hover{border-color:var(--teal); box-shadow:var(--shadow); transform:translateY(-2px)}
.lead-box__name{font-family:var(--font-d); font-weight:700; font-size:17px; line-height:1.25}
.lead-box__count{font-size:14px; color:var(--ink-2); margin-top:auto}
.lead-box__count b{font-family:var(--font-d); font-size:22px; color:var(--ink)}
.lead-box__ok{align-self:flex-start; font-size:12px; color:var(--muted)}
.src{display:inline-flex; align-items:center; gap:5px; font-size:12px; font-weight:600; padding:3px 9px 3px 7px; border-radius:999px; white-space:nowrap}
.src--chat{background:#E9EFFC; color:#3562C4}
.src--call{background:var(--teal-wash); color:var(--teal-ink)}
.ic-sm{width:13px; height:13px; stroke:currentColor; fill:none; stroke-width:1.7; flex:none}
.src--call .ic-sm{fill:currentColor; stroke:none}
.badge.s-new{background:#E9EFFC; color:#3562C4}
.badge.s-contacted{background:var(--amber-wash); color:var(--amber)}
.badge.s-done{background:#DDEEE4; color:#0F6B3E}
td.reason{color:var(--ink-2); font-size:13px; max-width:260px}

a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,.btn:focus-visible{outline:2px solid var(--teal); outline-offset:2px}
.inp:focus{outline:2px solid var(--teal); outline-offset:1px; border-color:var(--teal)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media (max-width:900px){
  .app{grid-template-columns:1fr} .rail{position:static; height:auto; flex-direction:row; flex-wrap:wrap; align-items:center}
  .rail__logo{border-bottom:0; margin:0; padding:6px} .nav{flex-direction:row; flex-wrap:wrap; margin:0}
  .rail__foot{display:none}
  .stats{grid-template-columns:1fr 1fr} .cols{grid-template-columns:1fr}
  .docs{grid-template-columns:1fr} .formgrid{grid-template-columns:1fr}
  .login{grid-template-columns:1fr} .login__brand{display:none}
  .lead-grid{grid-template-columns:1fr}
}