:root{color:#1f2937;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#f3f5f7;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Arial,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:#f3f5f7;min-width:320px;min-height:100vh;margin:0}a{color:inherit}button,input,textarea,select{font:inherit}#root{min-height:100vh}:root{--navy:#0d1b3d;--blue:#1e3a8a;--blue-bright:#2563eb;--green:#16a34a;--gray-50:#f8fafc;--gray-100:#f3f5f7;--gray-200:#e5e7eb;--gray-300:#d1d5db;--gray-500:#6b7280;--gray-700:#374151;--white:#fff;--shadow:0 12px 30px #0d1b3d12}.site{min-height:100vh;color:var(--gray-700);background:radial-gradient(circle at top right, #2563eb12, transparent 32%), var(--gray-100)}.site-header{border-bottom:1px solid #0d1b3d14;width:min(1100px,100% - 40px);margin:0 auto;padding:30px 0 24px}.brand{align-items:center;gap:18px;text-decoration:none;display:inline-flex}.brand-mark{object-fit:contain;width:92px;height:92px;display:block}.brand-name{color:var(--navy);letter-spacing:.12em;font-size:1.35rem;font-weight:800}.container{width:min(1100px,100% - 40px);margin:0 auto}.hero{text-align:center;padding:74px 0 42px}.eyebrow{color:var(--blue);letter-spacing:.18em;margin-bottom:12px;font-size:.76rem;font-weight:800;display:inline-block}.hero h1{color:var(--navy);letter-spacing:-.05em;margin:0;font-size:clamp(2.7rem,6vw,4.6rem);font-weight:800;line-height:1}.intro{max-width:650px;color:var(--gray-500);margin:20px auto 0;font-size:1.08rem;line-height:1.7}.projects{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;padding:20px 0 75px;display:grid}.card{min-height:250px;color:inherit;background:var(--white);border:1px solid var(--gray-200);box-shadow:var(--shadow);border-radius:20px;flex-direction:column;justify-content:space-between;padding:30px;text-decoration:none;transition:transform .18s,box-shadow .18s,border-color .18s;display:flex}.card:hover{border-color:#2563eb38;transform:translateY(-4px);box-shadow:0 18px 38px #0d1b3d1f}.card-live{cursor:pointer}.future{box-shadow:none;background:#ffffff94;border-style:dashed}.icon{border-radius:14px;place-items:center;width:50px;height:50px;margin-bottom:22px;font-size:1.35rem;font-weight:700;display:grid}.icon-blue{color:var(--blue-bright);background:#edf3ff}.icon-green{color:var(--green);background:#edf9f0}.icon-gray{color:var(--gray-500);background:#f0f2f4}.project-header{align-items:center;gap:12px;display:flex}.project-header h2{margin:0}.live-badge{color:#166534;background:#ecfdf3;border:1px solid #bbf7d0;border-radius:999px;align-items:center;gap:7px;padding:5px 9px;font-size:.72rem;font-weight:800;display:inline-flex}.status-dot{background:var(--green);border-radius:50%;width:7px;height:7px}.card h2{color:var(--navy);letter-spacing:-.025em;font-size:1.48rem}.card p{color:var(--gray-500);margin:10px 0 0;line-height:1.65}.arrow{color:var(--blue-bright);margin-top:24px;font-size:.95rem;font-weight:750}.arrow.muted{color:var(--gray-500)}.about{border-top:1px solid var(--gray-200);grid-template-columns:88px 1fr;align-items:center;gap:24px;max-width:800px;margin:0 auto 75px;padding:30px 0;display:grid}.about-mark{width:74px;height:74px;color:var(--white);background:var(--navy);letter-spacing:-.04em;border-radius:18px;place-items:center;font-size:1.35rem;font-weight:800;display:grid;box-shadow:0 10px 25px #0d1b3d24}.about-label{color:var(--blue);letter-spacing:.16em;margin-bottom:5px;font-size:.72rem;font-weight:800;display:block}.about p{color:var(--gray-500);margin:0;line-height:1.6}.site-footer{text-align:center;width:min(1100px,100% - 40px);color:var(--gray-500);margin:0 auto;padding:0 0 34px;font-size:.88rem}@media (width<=700px){.site-header,.container,.site-footer{width:min(100% - 28px,1100px)}.site-header{padding-top:24px}.brand-mark{width:62px;height:62px}.brand-name{letter-spacing:.08em;font-size:.95rem}.hero{padding-top:58px}.projects{grid-template-columns:1fr}.card{min-height:220px}.project-header{flex-direction:column;align-items:flex-start;gap:8px}.about{grid-template-columns:1fr;gap:18px}}@media (width<=420px){.brand-mark{width:54px;height:54px}.brand-name{letter-spacing:.06em;font-size:.78rem}.hero h1{font-size:2.65rem}.intro{font-size:1rem}.card{padding:24px}}
