/* RESET & VARIABLES */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
:root {
  --innocent-snowdrop: rgb(211, 201, 251);
  --cold-white: rgb(237, 252, 249);
  --placebo-orange: rgb(252, 243, 237);
  --connecticut-lilac: rgb(202, 191, 243);
  --negroni: rgb(237, 200, 163);
  --mint-blue: rgb(188, 225, 220);
  --white: rgb(255, 255, 255);
  --black: rgb(33, 35, 36);
  --hydrargyrum: rgb(154, 154, 154);
  --lavender-syrup: rgb(232, 229, 244);
  --foundation-white: rgb(240, 238, 255);
  --purple-sand: rgb(194, 180, 248);
  --placebo-purple: rgb(238, 234, 252);
  --alpine-goat: rgb(241, 239, 249);
  --leukocyte-white: rgb(243, 241, 237);
  --wistful: rgb(163, 152, 211);
  --aria: rgb(227, 227, 227);
  --error: rgb(229, 72, 77);
  --zhen-zhu-bai-pearl: rgb(248, 248, 248);
  --alyssa: rgb(244, 226, 214);
  --teal: #59aaa1;
  --purple-btn: #9d88f7;
  --text-dark: rgb(33, 35, 36);
  --text-body: rgb(100, 100, 106);
  --text-muted: rgb(154, 154, 154);
  --bg-main: rgb(243, 241, 237);
  --radius-sm: 11px;
  --radius-md: 20px;
  --radius-lg: 30px;
}
html { scroll-behavior: smooth; }
body { background: var(--bg-main); color: var(--text-dark); font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif; -webkit-font-smoothing: antialiased; line-height: 1.6; font-size: 17px; }
h1, h2, h3, h4, h5, h6 { font-family: 'Plus Jakarta Sans', -apple-system, sans-serif; font-weight: 800; }

/* LOGIN */
.login-overlay{position:fixed;inset:0;z-index:9999;background:var(--bg-main);display:flex;align-items:center;justify-content:center;transition:opacity 0.6s,visibility 0.6s}
.login-overlay.hidden{opacity:0;visibility:hidden;pointer-events:none}
.login-card{background:var(--white);border-radius:var(--radius-lg);padding:48px 44px;width:400px;max-width:90vw;border:1px solid var(--aria);text-align:center;animation:loginUp 0.7s cubic-bezier(0.16,1,0.3,1)}
@keyframes loginUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
.login-logo{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:28px}
.login-logo img{height:40px}
.login-title{font-family:'Plus Jakarta Sans',sans-serif;font-size:24px;font-weight:700;margin-bottom:6px;letter-spacing:-0.3px}
.login-desc{font-size:15px;color:var(--text-muted);margin-bottom:28px;line-height:1.5}
.login-form{display:flex;flex-direction:column;gap:14px}
.login-field{display:flex;flex-direction:column;gap:5px;text-align:left}
.login-field label{font-size:12px;font-weight:600;color:var(--text-body);text-transform:uppercase;letter-spacing:0.5px}
.login-field input{padding:12px 16px;border:1px solid var(--aria);border-radius:var(--radius-sm);font-family:'Plus Jakarta Sans',sans-serif;font-size:15px;color:var(--text-dark);outline:none;transition:border-color 0.3s;background:var(--white)}
.login-field input:focus{border-color:var(--wistful)}
.login-field input::placeholder{color:var(--text-muted)}
.login-error{font-size:12px;color:var(--error);min-height:18px}
.login-btn{padding:14px;border:none;border-radius:var(--radius-sm);background:var(--teal);color:white;font-family:'Plus Jakarta Sans',sans-serif;font-size:15px;font-weight:700;cursor:pointer;transition:all 0.3s}
.login-btn:hover{background:#4d9a91;transform:translateY(-1px)}
.login-footer{margin-top:24px;font-size:11px;color:var(--text-muted)}

/* PORTAL & NAVBAR */
.portal{display:none}.portal.visible{display:block}
.navbar{position:fixed;top:12px;left:12px;right:12px;z-index:1000;background:var(--leukocyte-white);border-radius:var(--radius-sm);padding:0 20px;height:56px;display:flex;align-items:center;justify-content:space-between;transition:all 0.3s}
.navbar.compact{top:8px;box-shadow:0 0 8px rgba(0,0,0,0.08)}
.navbar-left{display:flex;align-items:center;gap:10px;flex-shrink:0}
.navbar-left img{height:22px}
.navbar-center{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;flex:1;justify-content:center;padding:0 16px}
.navbar-center::-webkit-scrollbar{display:none}
.nav-link{font-family:'Plus Jakarta Sans',sans-serif;font-size:14px;font-weight:600;color:var(--text-muted);text-decoration:none;padding:8px 14px;border-radius:var(--radius-sm);white-space:nowrap;transition:all 0.3s}
.nav-link:hover,.nav-link.active{color:var(--text-dark);background:var(--innocent-snowdrop)}
.navbar-right{display:flex;align-items:center;gap:12px;flex-shrink:0}
.partner-badge{display:flex;align-items:center;gap:6px;background:var(--placebo-purple);padding:6px 16px;border-radius:100px;font-size:13px;font-weight:600;color:var(--wistful)}
.partner-badge-dot{width:6px;height:6px;border-radius:50%;background:var(--teal)}
.logout-btn{font-family:'Plus Jakarta Sans',sans-serif;font-size:12px;font-weight:500;color:var(--text-muted);background:none;border:1px solid var(--aria);padding:6px 16px;border-radius:var(--radius-sm);cursor:pointer;transition:all 0.3s}
.logout-btn:hover{color:var(--error);border-color:var(--error)}

/* BUTTONS */
.btn-p{padding:14px 30px;border-radius:var(--radius-sm);background:var(--white);color:var(--teal);font-family:'Plus Jakarta Sans',sans-serif;font-size:16px;font-weight:700;border:2px solid var(--white);cursor:pointer;transition:all 0.4s;text-decoration:none;display:inline-flex;align-items:center;gap:8px;box-shadow:0 4px 20px rgba(0,0,0,0.08)}
.btn-p:hover{background:var(--teal);color:var(--white);border-color:var(--teal);transform:translateY(-2px);box-shadow:0 8px 30px rgba(89,170,161,0.3)}
.btn-s{padding:14px 30px;border-radius:var(--radius-sm);background:transparent;color:rgb(55,55,55);font-family:'Plus Jakarta Sans',sans-serif;font-size:16px;font-weight:700;border:2px solid rgba(255,255,255,0.5);cursor:pointer;transition:all 0.4s;text-decoration:none;display:inline-flex;align-items:center;gap:8px;backdrop-filter:blur(4px)}
.btn-s:hover{border-color:var(--white);background:rgba(255,255,255,0.2);color:rgb(38,38,38)}

/* ANIMATIONS */
.reveal{opacity:0;transform:translateY(28px);transition:opacity 0.7s cubic-bezier(0.16,1,0.3,1),transform 0.7s cubic-bezier(0.16,1,0.3,1)}
.reveal.visible{opacity:1;transform:translateY(0)}
.reveal-d1{transition-delay:0.1s}.reveal-d2{transition-delay:0.2s}.reveal-d3{transition-delay:0.3s}

/* BACK TO TOP */
.back-to-top{position:fixed;bottom:28px;right:28px;width:44px;height:44px;border-radius:50%;background:var(--teal);color:white;border:none;cursor:pointer;font-size:20px;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:all 0.3s;z-index:999}
.back-to-top.show{opacity:1;visibility:visible}
.back-to-top:hover{transform:translateY(-3px)}

/* FOOTER */
.footer{text-align:center;padding:60px 32px 40px}
.footer .content-box{background:var(--white);border-radius:var(--radius-lg);padding:80px 40px 60px;margin:0 8px}
.footer-title{font-family:'Plus Jakarta Sans',sans-serif;font-size:clamp(36px,4.5vw,54px);font-weight:900;letter-spacing:-2px;margin-bottom:12px}
.footer-desc{font-family:'Plus Jakarta Sans',sans-serif;font-size:19px;color:var(--text-body);margin-bottom:32px}
.footer-copy{font-family:'Plus Jakarta Sans',sans-serif;font-size:12px;color:var(--text-muted);margin-top:32px}

/* RESPONSIVE */
@media(max-width:1024px){.navbar-center{display:none}}
@media(max-width:768px){.content-box{padding:48px 20px;margin:0 6px 12px}.section{padding:48px 20px}.hero-section .content-box{padding:80px 24px 60px;margin-top:70px}.navbar{padding:0 12px;left:8px;right:8px}.partner-badge{display:none}}

/* MONO */
.mono{font-family:'DM Mono',monospace;font-weight:700}