
:root{
 --ink:#0b1724;--muted:#687786;--line:#e8edf2;--blue:#159ac5;--blue2:#0e3150;
 --soft:#f6f9fb;--white:#fff;--green:#20a875;--amber:#e5a23b;--red:#da5e69;
 --shadow:0 20px 60px rgba(24,52,74,.10)
}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Arial,Helvetica,sans-serif;background:#fff;color:var(--ink)}
a{text-decoration:none;color:inherit}button,input,select,textarea{font:inherit}
.container{width:min(1180px,90vw);margin:auto}
.topnav{display:flex;align-items:center;justify-content:space-between;padding:20px 0}
.logo{width:175px;height:auto;display:block}.navlinks{display:flex;gap:26px;align-items:center}
.navlinks a{font-size:13px;color:#26475e}.actions{display:flex;gap:9px}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 18px;border-radius:999px;border:1px solid var(--line);font-size:12px;font-weight:700;cursor:pointer}
.btn-dark{background:var(--blue2);border-color:var(--blue2);color:white}.btn-light{background:rgba(255,255,255,.86);color:#19384e}.btn-blue{background:var(--blue);border-color:var(--blue);color:#fff}
.hero{min-height:720px;position:relative;overflow:hidden;background:#f4fbfd;display:flex;align-items:center}
.clouds{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.78}
.overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.95),rgba(255,255,255,.84) 50%,rgba(255,255,255,.38))}
.hero-content{position:relative;z-index:2;max-width:760px;padding:80px 0}
.kicker{font-size:11px;font-weight:800;letter-spacing:1.8px;color:#168faf}.hero h1{font-size:68px;line-height:1.02;letter-spacing:-2.8px;margin:16px 0}.hero h1 span{color:var(--blue)}
.hero p{font-size:18px;line-height:1.75;color:#5e7181;max-width:670px}.typed{height:34px;font-size:20px;font-weight:650;color:#294b62;margin:22px 0}.typed span{color:var(--blue)}
.section{padding:95px 0}.section.soft{background:var(--soft)}.center{max-width:800px;margin:0 auto 44px;text-align:center}.center h2{font-size:44px;letter-spacing:-1.6px;margin:10px 0 14px}.center p{color:var(--muted);font-size:15px;line-height:1.7}
.features{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.feature{background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px}.feature h3{font-size:15px}.feature p{font-size:12px;line-height:1.7;color:#718291}
.footer{border-top:1px solid var(--line);padding:32px 0;color:#82909c;font-size:11px;display:flex;justify-content:space-between;align-items:center}
.footer img{width:145px}

.auth-shell{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;background:#f8fbfd}
.auth-visual{position:relative;overflow:hidden;background:#eefaFC}.auth-visual video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.auth-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(255,255,255,.15),rgba(12,49,80,.15))}
.auth-panel{display:flex;align-items:center;justify-content:center;padding:40px}.auth-card{width:min(440px,100%)}.auth-card .logo{margin-bottom:34px}.auth-card h1{font-size:34px;margin:0 0 8px}.auth-card>p{color:var(--muted);line-height:1.6;margin-bottom:28px}
.field{margin-bottom:15px}.field label{display:block;font-size:11px;font-weight:700;margin-bottom:7px}.field input,.field select,.field textarea{width:100%;padding:13px 14px;border:1px solid #dfe7ed;border-radius:12px;background:#fff;outline:none}.field input:focus,.field select:focus,.field textarea:focus{border-color:#83d4de;box-shadow:0 0 0 3px rgba(21,154,197,.08)}
.full{width:100%}.muted{color:var(--muted);font-size:12px}.notice{padding:12px 14px;border-radius:12px;font-size:12px;margin-bottom:16px}.notice.error{background:#fff0f2;color:#a43f49}.notice.ok{background:#eaf9f3;color:#187a58}

.app-shell{min-height:100vh;background:#f5f7fa}.sidebar{position:fixed;inset:0 auto 0 0;width:250px;background:linear-gradient(180deg,#0e2f4b,#123b5d);color:white;padding:22px 16px}.sidebar .logo{background:white;border-radius:10px;padding:5px;margin:0 8px 24px;width:165px}.company-box{padding:13px;border:1px solid rgba(255,255,255,.12);border-radius:13px;background:rgba(255,255,255,.05);margin:0 4px 17px}.company-box span{font-size:9px;color:#78e1e4;letter-spacing:1.2px}.company-box strong{display:block;font-size:13px;margin-top:5px}.sidenav{display:flex;flex-direction:column;gap:4px}.sidenav a{padding:10px 11px;border-radius:10px;color:#b8c9d6;font-size:12px;font-weight:600}.sidenav a:hover,.sidenav a.active{background:rgba(255,255,255,.09);color:#fff}.main{margin-left:250px;padding:28px 32px}.app-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.app-top p{margin:0;color:#8b98a5;font-size:10px}.app-top h1{margin:5px 0 0;font-size:26px}
.hero-card{background:linear-gradient(120deg,#123654,#165373);color:#fff;border-radius:22px;padding:26px;display:flex;justify-content:space-between;align-items:center;box-shadow:var(--shadow)}.hero-card h2{font-size:27px;margin:8px 0}.hero-card h2 span{color:#73e0e5}.hero-card p{color:#bdd0dd;font-size:12px}.progress-pill{width:110px;height:110px;border-radius:50%;background:conic-gradient(#45cbd4 0 18%,rgba(255,255,255,.12) 18% 100%);display:grid;place-items:center;font-size:23px;font-weight:800}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin:17px 0}.stat{background:#fff;border:1px solid var(--line);border-radius:16px;padding:17px}.stat span{font-size:9px;color:#84929e}.stat strong{display:block;font-size:23px;margin-top:5px}
.panel{background:#fff;border:1px solid var(--line);border-radius:19px;padding:21px;margin-top:17px}.panel h3{margin:0 0 15px}.clauses{display:grid;grid-template-columns:repeat(4,1fr);gap:11px}.clause{display:block;border:1px solid var(--line);border-radius:15px;padding:16px;background:#fff;min-height:125px}.clause:hover{border-color:#9bdde2;box-shadow:0 10px 22px rgba(24,126,142,.07)}.clause .num{font-size:10px;color:#79909f;font-weight:800}.clause strong{display:block;font-size:12px;line-height:1.4;margin:12px 0}.bar{height:5px;border-radius:9px;background:#edf1f4;overflow:hidden}.bar i{display:block;height:100%;background:#28bec8;border-radius:9px}.clause small{font-size:9px;color:#8a98a5}
.table-wrap{overflow:auto}.table{width:100%;border-collapse:collapse}.table th,.table td{text-align:left;padding:12px 10px;border-bottom:1px solid #edf1f4;font-size:11px;vertical-align:top}.table th{color:#6f7e8b;font-size:9px;letter-spacing:.7px}.tag{display:inline-block;padding:5px 8px;border-radius:999px;font-size:9px;font-weight:700}.tag.green{background:#eaf9f3;color:#187a58}.tag.gray{background:#eef2f5;color:#5f6f7b}
.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.form-grid .fullrow{grid-column:1/-1}
.page-head{display:flex;align-items:center;justify-content:space-between;gap:15px}.page-head h2{margin:0}.empty{padding:32px;text-align:center;color:#81909c;border:1px dashed #d9e3ea;border-radius:14px}
@media(max-width:1000px){.features{grid-template-columns:1fr 1fr}.clauses{grid-template-columns:repeat(2,1fr)}.stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.navlinks{display:none}.hero h1{font-size:45px}.auth-shell{grid-template-columns:1fr}.auth-visual{display:none}.sidebar{display:none}.main{margin-left:0;padding:18px}.features,.clauses,.stats,.form-grid{grid-template-columns:1fr}.hero-card{display:block}.progress-pill{margin-top:18px}.footer{display:block}.footer img{margin-bottom:10px}}
