:root{--ink:#f4fbfc;--muted:#f4fbfcad;--night:#031a28;--deep:#062f45;--panel:#083144d1;--panel-strong:#0a4059;--line:#b0edf92e;--cyan:#b0edf9;--cyan-strong:#64cadf;--coral:#ffb078;--green:#a8df77;--shadow:0 24px 70px #0008104d;--radius:22px}body{color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,sans-serif}.site-header{background:#04344cf7}.nav-shell{width:min(1180px,100% - 48px)}.brand{width:190px}.brand img{max-height:62px}.main-nav{align-items:stretch;gap:28px}.main-nav>a{border-radius:0;padding:0}.main-nav>a:hover,.main-nav>a.active{background:0 0}.main-nav a.active:after{display:block}.nav-auth{border:0}.profile-trigger{border-radius:14px;padding:6px 10px}.profile-trigger:hover{background:0 0}.profile-avatar,.profile-avatar-img{width:38px;height:38px}.profile-avatar-img{object-fit:cover;border:2px solid #ffffff8c;border-radius:50%}.profile-dropdown{border-color:var(--line);box-shadow:var(--shadow);background:#031a28fa}.hero-section{min-height:calc(100vh - var(--header-height));background-color:var(--night);padding:40px 0 70px}.hero-overlay{background:linear-gradient(90deg,#031a28db,#031a2847 62%,#031a2894)}.hero-shell{grid-template-columns:minmax(0,1.08fr) minmax(320px,.92fr);gap:64px;width:min(1240px,100% - 48px);min-height:610px}.hero-copy{max-width:650px}.hero-copy h1{letter-spacing:-.055em;font-size:clamp(44px,5.4vw,78px);line-height:.99}.hero-copy h1 span{color:var(--coral)}.hero-description{max-width:530px;color:var(--muted);margin-top:28px;font-size:17px;line-height:1.65}.primary-cta{background:var(--cyan);border-radius:14px;min-height:56px;margin-top:32px;box-shadow:0 16px 34px #00000040}.primary-cta:hover{background:#d8f8fc}.benefit-grid{gap:12px;margin-top:54px}.benefit-item{border-color:var(--line);background:#031a2857;padding:13px}.benefit-text h2{font-size:13px}.benefit-text p{color:var(--muted)}.hero-visual{min-height:560px}.mascot-glow{background:radial-gradient(circle,#ffb07838,#0000 68%);width:450px;height:450px}.mascot{filter:drop-shadow(0 30px 34px #00000061);width:min(100%,450px)}.stats-section{border-top-color:var(--line);max-width:1240px;margin-top:28px;padding:34px 0 0}.stats-section h2{letter-spacing:.16em;color:var(--muted);font-size:14px}.stats-section h2 span{color:var(--cyan)!important}.stats-grid{gap:12px}.stat-card{border-radius:18px;padding:24px 14px;border:1px solid var(--line)!important;background:#031a2852!important}.stat-circle{background:var(--deep);width:104px;height:104px}.stat-circle:before{border-top-color:var(--coral);border-right-color:var(--coral)}.stat-circle .counter{color:var(--cyan)}.stat-label,.stat-card p{color:var(--muted)}.login,.register-page,.complete-page{background:var(--night)}.login:after,.register-overlay,.complete-overlay{background:linear-gradient(90deg,#031a28eb,#031a2885 58%,#031a282e)}.login-child{border:1px solid var(--line);border-radius:var(--radius);width:min(520px,100% - 48px);min-height:0;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#062f45d1;margin:0 0 0 clamp(24px,7vw,96px);padding:42px}.masuk-ke-skillmatch-container{text-align:left;width:min(100% - 84px,436px);margin:0 0 0 clamp(66px,10vw,138px);font-size:clamp(30px,3vw,42px)}.login form{width:min(100% - 84px,436px);margin:0 0 0 clamp(66px,10vw,138px);padding-top:0}.login form:has(.login-child2){margin-top:100px}.login form:has(.login-child2) .form-group label{color:var(--muted);letter-spacing:.04em;font-size:13px;font-weight:700}.login input,.register-card input,.complete-card input,.edit-profile-page input,.edit-profile-page select{border:1px solid var(--line);min-height:52px;color:var(--ink);background:#031a2875;border-radius:13px}.login input:focus,.register-card input:focus,.complete-card input:focus,.edit-profile-page input:focus,.edit-profile-page select:focus{border-color:var(--cyan);box-shadow:0 0 0 4px #b0edf91f}.login form .login-child2,.login form .rectangle-div{border-radius:13px;min-height:52px}.login form .login-child2{border:1px solid var(--line);background:0 0}.login form .rectangle-div{background:var(--cyan)}.register-page,.complete-page{align-items:center;padding:70px 6vw 42px;display:flex}.register-content,.complete-content{width:min(560px,100%);margin:0;padding:0}.register-logo,.complete-logo{margin:0 0 22px}.register-logo img,.complete-logo img{width:170px}.register-card,.complete-card{border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#062f45d1;padding:38px}.register-card h1,.complete-card h1{letter-spacing:-.04em;margin-bottom:28px;font-size:clamp(28px,3vw,40px)}.register-card h1 span,.complete-card h1 span{color:var(--coral)}.register-card label,.complete-card label{color:var(--muted);font-size:13px;font-weight:700}.register-actions,.complete-actions{gap:10px}.btn-back,.btn-register,.btn-skip,.btn-save{border-radius:13px;min-height:52px}.btn-back,.btn-skip{border:1px solid var(--line);background:0 0}.btn-register,.btn-save{background:var(--cyan);color:var(--night)}.register-footer{color:var(--muted)}.register-footer a,.daftar-sekarang{color:var(--cyan)}.form-errors{color:#ffd1d1;background:#ff60601f;border-radius:10px;padding:10px 12px}.profile-page,.edit-profile-page{background:linear-gradient(135deg, var(--night), var(--deep))}.profile-navbar,.edit-navbar{border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#031a28e0}.profile-navbar-inner,.edit-navbar-inner{max-width:1240px;height:76px}.profile-brand img,.edit-brand img{width:156px}.profile-nav,.edit-nav{gap:8px}.profile-nav a,.edit-nav a{border-radius:10px;padding:10px 14px;font-size:14px}.profile-nav a:hover,.edit-nav a:hover{color:var(--cyan);background:#b0edf917}.profile-main,.edit-main{width:min(1120px,100% - 48px);margin:0 auto;padding:56px 0 80px}.profile-header,.edit-card{border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);background:#062f45b8}.profile-header{padding:34px}.profile-header h1,.edit-card-header h1{letter-spacing:-.05em;font-size:clamp(30px,4vw,48px)}.profile-subtitle,.card-desc,.info-label{color:var(--muted)}.edit-profile-btn,.save-btn,.cancel-btn{border-radius:12px;min-height:48px}.profile-grid{gap:16px;margin-top:16px}.profile-card{border:1px solid var(--line);box-shadow:none;background:#062f4594;border-radius:18px}.info-box,.status-box,.project-item{border-color:var(--line);background:#031a2857;border-radius:14px}.skill-tags span,.project-badge{border-color:var(--line);color:var(--cyan);background:#b0edf91f}.edit-card{width:100%}.edit-card form{padding:34px}.edit-card-header{border-bottom-color:var(--line);padding:28px 34px}.tentang-kami-page{padding:56px 40px 72px}.tentang-kami-container{align-items:stretch;gap:18px}.tentang-kami-page .faq-box,.tentang-kami-page .about-card{border-color:var(--line);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#062f45bd;border-radius:18px}.tentang-kami-page .faq-box{padding:8px 24px}.tentang-kami-page .faq-item{border-bottom-color:var(--line)}.tentang-kami-page .faq-title{min-height:54px;font-size:14px}.tentang-kami-page .about-title{letter-spacing:-.05em;margin-top:0;font-size:clamp(28px,4vw,44px)}.tentang-kami-page .about-title .match-text{color:var(--coral)}.tentang-kami-page .about-card{padding:30px}.tentang-kami-page .about-card p{color:var(--muted);font-size:16px;line-height:1.75}@media (width<=900px){.hero-shell{text-align:center;grid-template-columns:1fr;gap:10px}.hero-copy,.hero-description{margin-left:auto;margin-right:auto}.hero-visual{min-height:390px;margin-top:-30px}.benefit-grid{text-align:left}.profile-main,.edit-main{padding-top:30px}}@media (width<=640px){.nav-shell,.hero-shell{width:calc(100% - 32px)}.hero-copy h1{font-size:clamp(38px,12vw,58px)}.hero-description{font-size:15px}.stats-section{padding-left:0;padding-right:0}.login-child{padding:20px;inset:82px 16px 20px}.masuk-ke-skillmatch-container,.login form{width:100%;margin-left:0}.login form:has(.login-child2){margin-top:60px}.register-page,.complete-page{padding:34px 14px}.register-card,.complete-card{padding:24px 18px}.profile-main,.edit-main{width:calc(100% - 28px)}.profile-header,.edit-card form,.edit-card-header{padding:22px 18px}.tentang-kami-page{padding:32px 14px 54px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}