@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
:root{--blue:#2563eb;--blue2:#1d4ed8;--ink:#111827;--muted:#64748b;--line:#e5e7eb;--pale:#eff6ff;--bg:#f8fafc;--white:#fff;--shadow:0 20px 60px rgba(37,99,235,.13)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:Inter,system-ui,sans-serif;background:var(--bg)}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button,a{transition:.2s ease}.nav{height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(24px,5vw,76px);background:rgba(255,255,255,.94);border-bottom:1px solid var(--line);position:relative;z-index:20}.brand{display:flex;align-items:center;gap:12px;font-size:20px;font-weight:800}.brand span{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:var(--blue);color:#fff;font-size:13px}.nav nav{display:flex;align-items:center;gap:34px;font-weight:500}.nav nav a:hover{color:var(--blue)}.menu{display:none;border:0;background:none;font-size:24px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:1px solid var(--blue);background:var(--blue);color:#fff;border-radius:11px;padding:13px 20px;font-weight:650;cursor:pointer;box-shadow:0 8px 20px rgba(37,99,235,.16)}.btn:hover{background:var(--blue2);transform:translateY(-2px)}.btn.outline{color:var(--blue);background:#fff;box-shadow:none}.google{font-size:16px;padding:16px 26px}.google b{font-size:22px}.eyebrow{color:var(--blue);font-size:13px;font-weight:750;letter-spacing:.16em}.hero{min-height:calc(100vh - 72px);display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:7vw;padding:70px clamp(28px,5vw,80px);overflow:hidden;background:radial-gradient(circle at 75% 48%,#eff6ff 0,transparent 35%),#fff}.hero-copy{max-width:690px}.hero h1{font-size:clamp(45px,5vw,76px);line-height:1.1;letter-spacing:-.05em;margin:25px 0}.hero h1 em{color:var(--blue);font-style:normal}.lead{font-size:20px;line-height:1.7;color:#526077;max-width:650px}.actions{display:flex;align-items:center;gap:34px;margin:34px 0}.text-link{color:var(--blue);font-weight:650}.trust{color:var(--muted);font-size:14px}.profile-demo{position:relative;border:1px solid #cfe0ff;background:rgba(255,255,255,.83);backdrop-filter:blur(14px);border-radius:28px;padding:36px;box-shadow:0 35px 90px rgba(37,99,235,.22);max-width:640px}.demo-head{display:flex;gap:22px;align-items:center}.avatar{width:90px;height:90px;border-radius:50%;background:linear-gradient(145deg,#dbeafe,#93c5fd);display:grid;place-items:center;border:6px solid white;box-shadow:0 8px 20px #a8b8d4;color:#1e3a8a;font-size:25px;font-weight:800}.demo-head h2{margin:0 0 8px;font-size:28px}.demo-head h2 span{color:var(--blue)}.demo-head p,.demo-head a{margin:5px 0;color:var(--muted)}.demo-head a{color:var(--blue)}.metrics{display:grid;grid-template-columns:repeat(3,1fr);margin:28px 0;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:0 8px 24px #dce7f8}.metrics b{text-align:center;padding:18px;color:var(--blue);font-size:26px}.metrics b+ b{border-left:1px solid var(--line)}.metrics small{display:block;color:#526077;font-size:12px;font-weight:500;margin-top:4px}.demo-tabs{border-bottom:1px solid var(--line);padding:0 15px 12px;color:var(--blue);font-weight:650}.demo-tabs span{color:var(--ink);margin-left:40px}.profile-demo article{display:flex;gap:18px;margin-top:18px;padding:18px;border:1px solid var(--line);border-radius:14px;background:#fff}.profile-demo article i{font-size:30px;color:var(--blue)}.profile-demo article small{display:block;color:var(--muted);margin-top:8px}.install-toast{position:absolute;right:-32px;bottom:-70px;display:flex;align-items:center;gap:16px;background:#fff;padding:18px 24px;border:1px solid var(--line);border-radius:17px;box-shadow:var(--shadow);font-size:28px}.install-toast span{display:flex;flex-direction:column;font-size:14px}.install-toast small{color:var(--muted);margin-top:4px}.section{padding:100px clamp(28px,7vw,110px);background:#fff}.section>h2{font-size:clamp(34px,4vw,56px);letter-spacing:-.04em;max-width:720px}.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:50px}.feature-grid article{border:1px solid var(--line);border-radius:20px;padding:28px;background:#fff}.feature-grid article:hover{transform:translateY(-5px);box-shadow:var(--shadow)}.feature-grid i{display:grid;place-items:center;width:46px;height:46px;border-radius:12px;background:var(--pale);color:var(--blue);font-size:22px}.feature-grid p{color:var(--muted);line-height:1.7}.band{margin:0 6vw 100px;border-radius:28px;padding:60px;background:var(--ink);color:white;display:flex;align-items:center;justify-content:space-between;gap:30px}.band h2{font-size:40px;margin:10px 0}.band p{color:#cbd5e1}.auth-shell{min-height:100vh;display:grid;place-items:center;padding:25px;background:radial-gradient(circle at 70% 25%,#dbeafe,transparent 30%),var(--bg)}.auth-card{width:min(500px,100%);padding:50px;border:1px solid #dbeafe;border-radius:26px;background:rgba(255,255,255,.9);box-shadow:var(--shadow)}.auth-card h1{font-size:42px;letter-spacing:-.04em}.auth-card p{color:var(--muted);line-height:1.7}.auth-card .google{width:100%;margin:20px 0}.auth-card small{display:block;text-align:center;color:var(--muted)}.app-shell{display:grid;grid-template-columns:280px 1fr;min-height:calc(100vh - 72px)}.app-shell aside{background:#fff;border-right:1px solid var(--line);padding:35px 24px}.app-shell aside>img{width:74px;height:74px;border-radius:50%;object-fit:cover;background:#dbeafe}.app-shell aside h2{margin-bottom:7px}.app-shell aside>a{font-size:13px;color:var(--blue)}.side-links{margin-top:35px;display:grid;gap:5px}.side-links button{border:0;background:none;text-align:left;padding:13px;border-radius:10px;color:var(--muted);cursor:pointer}.side-links button.active{background:var(--pale);color:var(--blue);font-weight:650}.side-links span{float:right;background:var(--blue);color:#fff;border-radius:30px;padding:1px 7px;font-size:11px}.workspace{padding:45px max(30px,5vw);max-width:1250px;width:100%}.topline{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px}.topline h1{font-size:38px;margin:8px 0}.panel{display:none;background:#fff;border:1px solid var(--line);border-radius:20px;padding:30px}.panel.active{display:block}.panel h2{margin-top:0}.panel-head{display:flex;justify-content:space-between;align-items:center}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.form-grid label,.modal-form label,.contact-section label{display:grid;gap:8px;font-size:13px;font-weight:650;color:#475569}.form-grid label.wide{grid-column:1/-1}input,textarea,select{width:100%;border:1px solid #d7dee8;border-radius:10px;background:#fff;padding:12px 14px;color:var(--ink);outline:none}input:focus,textarea:focus,select:focus{border-color:var(--blue);box-shadow:0 0 0 3px #dbeafe}.input-prefix{display:flex;align-items:center;border:1px solid #d7dee8;border-radius:10px}.input-prefix span{padding-left:12px;color:var(--muted)}.input-prefix input{border:0}.check{display:flex!important;grid-template-columns:auto 1fr!important;align-items:center}.check input{width:auto}.form-grid>.btn{align-self:end}.item-list{display:grid;gap:10px;margin-top:28px}.item-list article{display:grid;grid-template-columns:120px 1fr auto;align-items:center;gap:16px;padding:17px;border:1px solid var(--line);border-radius:12px}.item-list h3{margin:0 0 4px}.item-list p{margin:0;color:var(--muted)}.category{color:var(--blue);background:var(--pale);padding:6px 9px;border-radius:7px;font-size:11px;text-transform:uppercase;font-weight:750}.icon-btn{border:0;background:none;cursor:pointer}.danger{color:#dc2626}.empty{padding:50px;text-align:center;border:1px dashed #cbd5e1;border-radius:14px;color:var(--muted)}.message{border-bottom:1px solid var(--line);padding:20px 0}.message small{float:right;color:var(--muted)}.message p{line-height:1.6}.flash{padding:13px 16px;margin-bottom:20px;border-radius:10px}.flash.success{background:#dcfce7;color:#166534}dialog{border:0;border-radius:22px;padding:0;box-shadow:0 30px 100px #17255455;width:min(650px,92vw)}dialog::backdrop{background:#0f172a99}.modal-form{padding:35px;display:grid;gap:15px}.modal-close{position:absolute;right:20px;top:15px;border:0;background:none;font-size:30px;cursor:pointer}.portfolio{--accent:#2563eb;background:#fff}.portfolio-nav{height:72px;padding:0 6vw;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.portfolio-nav nav{display:flex;gap:25px;font-size:13px}.profile-hero{min-height:580px;background:radial-gradient(circle at 20% 30%,color-mix(in srgb,var(--accent),white 78%),transparent 34%),#f8fafc;display:grid;grid-template-columns:320px 1fr;align-items:center;gap:65px;padding:70px 10vw}.profile-hero img{width:300px;height:300px;border-radius:50%;object-fit:cover;background:#dbeafe;border:12px solid white;box-shadow:var(--shadow)}.profile-hero h1{font-size:clamp(45px,6vw,82px);letter-spacing:-.05em;margin:10px 0}.profile-hero h2{color:var(--muted);font-weight:500}.socials{display:flex;flex-wrap:wrap;gap:16px;margin-top:30px}.socials a{color:var(--accent);font-size:13px;font-weight:650}.profile-section{padding:100px 10vw;border-top:1px solid var(--line)}.profile-section>h2{font-size:45px}.about-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:8vw}.about-grid h2{font-size:45px;line-height:1.15}.big-copy{font-size:20px;line-height:1.8;color:#42506a}.timeline{max-width:950px}.timeline article{display:grid;grid-template-columns:170px 1fr;gap:50px;padding:28px 0;border-bottom:1px solid var(--line)}.timeline h3{font-size:22px;margin:0 0 7px}.timeline h4{color:var(--accent);margin:0}.timeline p{color:var(--muted);line-height:1.7}.timeline a{color:var(--accent);font-weight:650}.date{color:var(--muted);font-size:13px}.contact-section{padding:100px 10vw;background:#0f172a;color:#fff;display:grid;grid-template-columns:1fr 1fr;gap:8vw}.contact-section h2{font-size:48px}.contact-section form{display:grid;gap:15px}.contact-section input,.contact-section textarea{background:#1e293b;border-color:#334155;color:#fff}.portfolio footer{text-align:center;padding:25px;background:#0f172a;color:#94a3b8}.portfolio footer a{color:#fff}.admin-shell{padding:55px 6vw}.table-wrap{overflow:auto;background:#fff;border:1px solid var(--line);border-radius:18px}table{border-collapse:collapse;width:100%;min-width:850px}th,td{padding:16px;text-align:left;border-bottom:1px solid var(--line);font-size:13px}th{color:var(--muted);background:#f8fafc}.user-cell{display:flex;align-items:center;gap:12px}.user-cell img{width:40px;height:40px;border-radius:50%;background:#dbeafe}.user-cell span{display:grid;gap:4px}.user-cell small{color:var(--muted)}
@media(max-width:950px){.nav nav a{display:none}.menu{display:block}.hero{grid-template-columns:1fr;padding-bottom:130px}.profile-demo{margin-top:30px}.feature-grid{grid-template-columns:1fr 1fr}.app-shell{grid-template-columns:1fr}.app-shell aside{border-right:0;border-bottom:1px solid var(--line)}.side-links{grid-template-columns:repeat(3,1fr)}.profile-hero{grid-template-columns:1fr;text-align:center}.profile-hero img{margin:auto}.socials{justify-content:center}.about-grid,.contact-section{grid-template-columns:1fr}.portfolio-nav nav{display:none}}
@media(max-width:600px){.hero{padding:45px 22px 120px}.hero h1{font-size:44px}.actions{align-items:flex-start;flex-direction:column}.profile-demo{padding:22px}.demo-head{align-items:flex-start}.avatar{width:65px;height:65px}.demo-head h2{font-size:20px}.metrics b{font-size:20px;padding:12px 3px}.install-toast{right:0;bottom:-85px}.feature-grid{grid-template-columns:1fr}.section,.profile-section{padding:70px 22px}.band{padding:35px;flex-direction:column;align-items:flex-start}.form-grid{grid-template-columns:1fr}.form-grid label.wide{grid-column:auto}.workspace{padding:30px 16px}.panel{padding:20px}.item-list article{grid-template-columns:1fr}.side-links{grid-template-columns:1fr}.profile-hero{padding:70px 22px}.profile-hero img{width:210px;height:210px}.portfolio-nav{padding:0 22px}.timeline article{grid-template-columns:1fr;gap:10px}.contact-section{padding:70px 22px}.contact-section h2{font-size:38px}}
