:root{
  --navy-950:#070f1f;
  --navy-900:#0a1728;
  --navy-800:#0f2038;
  --navy-700:#152c4a;
  --navy-600:#1c3a5e;
  --blue:#7dd3fc;
  --blue-bright:#bae6fd;
  --purple:#7b3fe4;
  --purple-soft:#a06ff0;
  --text-hi:#eaf1fb;
  --text-mid:#a9bad3;
  --text-lo:#6f83a3;
  --good:#2fd18f;
  --warn:#f2b84b;
  --line:rgba(160,190,230,0.14);
  --radius:14px;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--navy-950);
  color:var(--text-hi);
  font-family:'Inter',sans-serif;
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
}
body::before{
  content:"";
  position:fixed;inset:0;
  background:
    radial-gradient(1200px 600px at 85% -10%, rgba(123,63,228,0.16), transparent 60%),
    radial-gradient(900px 500px at -10% 20%, rgba(125,211,252,0.14), transparent 55%);
  pointer-events:none;
  z-index:0;
}
h1,h2,h3,h4{font-family:'Space Grotesk',sans-serif;font-weight:600;letter-spacing:-0.01em;}
.mono{font-family:'IBM Plex Mono',monospace;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
button{font-family:inherit;cursor:pointer;}
::selection{background:var(--blue);color:var(--navy-950);}
:focus-visible{outline:2px solid var(--blue-bright);outline-offset:3px;}

/* layout */
.wrap{max-width:1180px;margin:0 auto;padding:0 28px;}
.app{position:relative;z-index:1;}

/* nav */
.topnav{
  position:sticky;top:0;z-index:50;
  background:rgba(7,15,31,0.82);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.topnav .wrap{display:flex;align-items:center;justify-content:space-between;height:76px;}
.brand{display:flex;align-items:center;gap:12px;}
.brand img{height:38px;width:auto;}
.brand-name{font-family:'Space Grotesk';font-size:14px;font-weight:600;color:var(--text-mid);letter-spacing:0.02em;}
.brand-name b{color:var(--text-hi);}
.navlinks{display:flex;align-items:center;gap:6px;}
.navlinks button{
  background:none;border:none;color:var(--text-mid);font-size:14.5px;font-weight:500;
  padding:9px 16px;border-radius:9px;transition:.15s;
}
.navlinks button:hover{color:var(--text-hi);background:var(--navy-800);}
.navlinks button.active{color:var(--text-hi);background:var(--navy-800);}
.nav-cta{
  background:linear-gradient(135deg,var(--blue),var(--purple));
  color:#fff !important;padding:10px 20px !important;border-radius:9px;font-weight:600 !important;
}
.nav-cta:hover{filter:brightness(1.08);background:linear-gradient(135deg,var(--blue),var(--purple)) !important;}

/* view management */
.view{display:none;animation:fadeIn .35s ease;}
.view.active{display:block;}
@keyframes fadeIn{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:translateY(0);}}
@media (prefers-reduced-motion:reduce){.view{animation:none;}*{animation-duration:.01ms !important;}}

/* section rhythm */
section{padding:88px 0;}
.eyebrow{
  font-family:'IBM Plex Mono';font-size:12.5px;letter-spacing:0.14em;text-transform:uppercase;
  color:var(--blue-bright);margin-bottom:16px;display:flex;align-items:center;gap:10px;
}
.eyebrow::before{content:"";width:22px;height:1px;background:var(--blue-bright);}

/* buttons */
.btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:14px 26px;border-radius:10px;font-size:15px;font-weight:600;
  border:1px solid transparent;transition:.15s;
}
.btn-primary{background:linear-gradient(135deg,var(--blue),var(--purple));color:#fff;}
.btn-primary:hover{filter:brightness(1.1);transform:translateY(-1px);}
.btn-ghost{background:transparent;border-color:var(--line);color:var(--text-hi);}
.btn-ghost:hover{background:var(--navy-800);border-color:var(--navy-600);}
.btn-sm{padding:9px 16px;font-size:13.5px;border-radius:8px;}
.btn-block{width:100%;justify-content:center;}
.btn[disabled]{opacity:.5;cursor:not-allowed;}

/* ============ HERO ============ */
.hero{padding:96px 0 60px;}
.hero-grid{display:grid;grid-template-columns:1.1fr 0.9fr;gap:60px;align-items:center;}
.hero h1{font-size:52px;line-height:1.08;margin-bottom:22px;}
.hero h1 .hl{background:linear-gradient(135deg,var(--blue-bright),var(--purple-soft));-webkit-background-clip:text;background-clip:text;color:transparent;}
.hero p.lead{font-size:17.5px;color:var(--text-mid);line-height:1.65;max-width:520px;margin-bottom:34px;}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;}
.hero-stats{display:flex;gap:34px;margin-top:46px;}
.hero-stat b{display:block;font-family:'Space Grotesk';font-size:26px;}
.hero-stat span{font-size:12.5px;color:var(--text-lo);}

/* signature: transformation pathway graphic */
.pathway{position:relative;height:360px;}
.pathway svg{width:100%;height:100%;}
.pathway-label{position:absolute;font-family:'IBM Plex Mono';font-size:11px;color:var(--text-lo);background:var(--navy-900);border:1px solid var(--line);padding:5px 9px;border-radius:7px;white-space:nowrap;}
.path-line{stroke-dasharray:900;stroke-dashoffset:900;animation:drawpath 1.8s ease forwards .2s;}
@keyframes drawpath{to{stroke-dashoffset:0;}}
.path-dot{opacity:0;animation:popdot .4s ease forwards;}
@media (prefers-reduced-motion:reduce){.path-line{stroke-dashoffset:0;animation:none;}.path-dot{opacity:1;animation:none;}}

/* ============ SECTION HEADINGS ============ */
.sec-head{max-width:640px;margin-bottom:52px;}
.sec-head h2{font-size:34px;margin-bottom:14px;}
.sec-head p{color:var(--text-mid);font-size:15.5px;line-height:1.65;}
.pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;margin-top:20px;}
.pillar{background:var(--navy-900);padding:26px 22px;}
.pillar .n{font-family:'IBM Plex Mono';font-size:12px;color:var(--blue-bright);margin-bottom:10px;}
.pillar h4{font-size:15px;margin-bottom:6px;}
.pillar p{font-size:13px;color:var(--text-lo);line-height:1.5;}

/* ============ TIER CARDS ============ */
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.tier-card{
  background:var(--navy-900);border:1px solid var(--line);border-radius:var(--radius);
  padding:32px 28px;display:flex;flex-direction:column;transition:.2s;
}
.tier-card:hover{border-color:var(--navy-600);transform:translateY(-3px);}
.tier-card.featured{border-color:rgba(125,211,252,0.40);background:linear-gradient(180deg,rgba(125,211,252,0.06),var(--navy-900) 40%);position:relative;}
.tier-badge{position:absolute;top:-12px;right:28px;background:linear-gradient(135deg,var(--blue),var(--purple));color:#fff;font-size:11px;font-weight:600;padding:5px 12px;border-radius:20px;letter-spacing:0.03em;}
.tier-card h3{font-size:20px;margin-bottom:8px;}
.tier-card .tagline{font-size:13.5px;color:var(--text-lo);margin-bottom:20px;line-height:1.5;min-height:38px;}
.tier-price{display:flex;align-items:baseline;gap:8px;margin-bottom:4px;}
.tier-price .amt{font-family:'Space Grotesk';font-size:32px;font-weight:600;}
.tier-price .per{font-size:13px;color:var(--text-lo);}
.tier-term{font-size:12.5px;color:var(--text-lo);margin-bottom:22px;}
.tier-desc{font-size:13.5px;color:var(--text-mid);line-height:1.6;margin-bottom:22px;}
.tier-list{list-style:none;margin-bottom:14px;flex:1;}
.tier-list-label{font-family:'IBM Plex Mono';font-size:11px;color:var(--text-lo);text-transform:uppercase;letter-spacing:0.08em;margin-bottom:12px;}
.tier-list li{font-size:13.5px;color:var(--text-mid);padding:7px 0;border-top:1px solid var(--line);display:flex;gap:10px;}
.tier-list li .num{font-family:'IBM Plex Mono';color:var(--blue-bright);font-size:12px;min-width:16px;}
.tier-outcomes{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:24px;}
.chip{font-size:11.5px;background:var(--navy-800);border:1px solid var(--line);color:var(--text-mid);padding:5px 10px;border-radius:20px;}

/* ============ FORMS ============ */
.form-shell{max-width:760px;margin:0 auto;}
.form-card{background:var(--navy-900);border:1px solid var(--line);border-radius:var(--radius);padding:40px;}
.form-section-title{font-family:'IBM Plex Mono';font-size:12px;text-transform:uppercase;letter-spacing:0.1em;color:var(--blue-bright);margin:28px 0 16px;}
.form-section-title:first-child{margin-top:0;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:14px;}
.form-row.full{grid-template-columns:1fr;}
.field label{display:block;font-size:13px;color:var(--text-mid);margin-bottom:7px;}
.field input,.field select,.field textarea{
  width:100%;background:var(--navy-800);border:1px solid var(--line);border-radius:9px;
  padding:12px 14px;color:var(--text-hi);font-size:14px;font-family:inherit;transition:.15s;
}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--blue);outline:none;}
.field textarea{resize:vertical;min-height:120px;}
.field-note{background:var(--navy-800);border:1px solid var(--line);border-radius:9px;padding:12px 14px;font-size:14px;color:var(--text-hi);}
.confirm-box{text-align:center;padding:60px 30px;}
.confirm-icon{width:60px;height:60px;border-radius:50%;background:rgba(47,209,143,0.14);border:1px solid rgba(47,209,143,0.4);display:flex;align-items:center;justify-content:center;margin:0 auto 24px;color:var(--good);font-size:28px;}
.confirm-box h3{font-size:22px;margin-bottom:14px;}
.confirm-box p{color:var(--text-mid);font-size:14.5px;line-height:1.6;max-width:440px;margin:0 auto 28px;}
.confirm-ref{font-family:'IBM Plex Mono';font-size:13px;color:var(--blue-bright);background:var(--navy-800);border:1px solid var(--line);padding:10px 16px;border-radius:9px;display:inline-block;margin-bottom:28px;}

/* ============ LOGIN ============ */
.login-shell{max-width:420px;margin:60px auto;}
.login-card{background:var(--navy-900);border:1px solid var(--line);border-radius:var(--radius);padding:40px;}
.login-card h3{font-size:22px;margin-bottom:6px;}
.login-card .sub{color:var(--text-lo);font-size:13.5px;margin-bottom:28px;}
.demo-hint{margin-top:22px;font-size:12.5px;color:var(--text-lo);background:var(--navy-800);border:1px dashed var(--navy-600);padding:12px 14px;border-radius:9px;line-height:1.6;}
.demo-hint b{color:var(--text-mid);}
.error-msg{color:#ef5b7a;font-size:13px;margin-top:10px;display:none;}

/* ============ DASHBOARD SHELL ============ */
.dash-topbar{border-bottom:1px solid var(--line);background:var(--navy-900);}
.dash-topbar .wrap{display:flex;align-items:center;justify-content:space-between;height:64px;}
.dash-id{font-family:'IBM Plex Mono';font-size:12.5px;color:var(--text-lo);}
.dash-body{padding:44px 0 80px;}
.dash-grid{display:grid;grid-template-columns:300px 1fr;gap:26px;align-items:start;}
.card{background:var(--navy-900);border:1px solid var(--line);border-radius:var(--radius);padding:26px;}
.card h4{font-size:14px;text-transform:uppercase;letter-spacing:0.06em;color:var(--text-lo);margin-bottom:18px;font-family:'IBM Plex Mono';font-weight:500;}
.profile-row{display:flex;justify-content:space-between;padding:10px 0;border-top:1px solid var(--line);font-size:13.5px;}
.profile-row:first-of-type{border-top:none;}
.profile-row span:first-child{color:var(--text-lo);}
.profile-row span:last-child{color:var(--text-hi);text-align:right;}
.status-pill{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;padding:4px 11px;border-radius:20px;}
.status-pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;}

.tab-row{display:flex;gap:6px;margin-bottom:26px;border-bottom:1px solid var(--line);}
.tab-btn{background:none;border:none;color:var(--text-lo);font-size:14px;font-weight:500;padding:12px 4px;margin-right:22px;border-bottom:2px solid transparent;}
.tab-btn.active{color:var(--text-hi);border-color:var(--blue);}
.tab-panel{display:none;}
.tab-panel.active{display:block;}

.step-card{background:var(--navy-900);border:1px solid var(--line);border-radius:12px;padding:20px 22px;margin-bottom:12px;}
.step-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:12px;}
.step-head .num{font-family:'IBM Plex Mono';color:var(--blue-bright);font-size:12px;}
.step-head h5{font-size:15px;margin-top:4px;}
.step-meta{display:flex;gap:18px;flex-wrap:wrap;font-size:12.5px;color:var(--text-lo);margin-bottom:12px;}
.progress-track{height:6px;background:var(--navy-800);border-radius:6px;overflow:hidden;margin-bottom:10px;}
.progress-fill{height:100%;background:linear-gradient(90deg,var(--blue),var(--purple-soft));border-radius:6px;}
.step-comment{font-size:13px;color:var(--text-mid);line-height:1.5;background:var(--navy-800);padding:10px 12px;border-radius:8px;margin-top:10px;}
.step-docs{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;}
.doc-chip{font-size:12px;color:var(--blue-bright);background:rgba(125,211,252,0.08);border:1px solid rgba(125,211,252,0.25);padding:5px 10px;border-radius:7px;display:flex;align-items:center;gap:6px;}

.doc-table,.app-table{width:100%;border-collapse:collapse;font-size:13.5px;}
.doc-table th,.app-table th{text-align:left;color:var(--text-lo);font-weight:500;font-size:11.5px;text-transform:uppercase;letter-spacing:0.05em;padding:10px 12px;border-bottom:1px solid var(--line);}
.doc-table td,.app-table td{padding:14px 12px;border-bottom:1px solid var(--line);color:var(--text-mid);}
.doc-table tr:last-child td,.app-table tr:last-child td{border-bottom:none;}

.comm-item{padding:18px 0;border-top:1px solid var(--line);}
.comm-item:first-child{border-top:none;}
.comm-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;}
.comm-type{font-family:'IBM Plex Mono';font-size:10.5px;text-transform:uppercase;letter-spacing:0.06em;color:var(--purple-soft);}
.comm-date{font-size:12px;color:var(--text-lo);}
.comm-title{font-size:14.5px;font-weight:600;margin-bottom:6px;}
.comm-body{font-size:13.5px;color:var(--text-mid);line-height:1.55;}

/* admin */
.stat-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:30px;}
.stat-box{background:var(--navy-900);border:1px solid var(--line);border-radius:12px;padding:20px 22px;}
.stat-box b{display:block;font-family:'Space Grotesk';font-size:28px;}
.stat-box span{font-size:12px;color:var(--text-lo);}
.row-actions{display:flex;gap:8px;}
.badge{font-size:11px;font-weight:600;padding:4px 10px;border-radius:20px;text-transform:capitalize;}

@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr;}
  .pathway{display:none;}
  .pillars{grid-template-columns:repeat(2,1fr);}
  .tiers{grid-template-columns:1fr;}
  .form-row{grid-template-columns:1fr;}
  .dash-grid{grid-template-columns:1fr;}
  .navlinks{display:none;}
  .stat-row{grid-template-columns:repeat(2,1fr);}
}

/* footer */
footer{border-top:1px solid var(--line);padding:48px 0;color:var(--text-lo);font-size:13.5px;}
footer .wrap{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;}