:root{
  --bg:#f7fafc; --card:#ffffff; --muted:#6b7280; --text:#111827;
  --primary:#0ea5e9; --secondary:#34d399;
  --grad1:#E0F2FE; --grad2:#E6FFFA;
  --radius:18px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font:16px/1.6 'Inter',system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;color:var(--text);
 background:
 radial-gradient(800px 600px at var(--mx,50%) var(--my,20%), var(--grad1), transparent 60%),
 radial-gradient(1000px 700px at calc(100% - var(--mx,50%)) calc(100% - var(--my,20%)), var(--grad2), transparent 60%),
 var(--bg);
 transition: background-position .2s ease;}
a{color:inherit;text-decoration:none}
.container{width:min(1200px,92vw);margin:0 auto}
.nav{position:sticky;top:0;z-index:80;background:rgba(255,255,255,.8);backdrop-filter:blur(10px);border-bottom:1px solid #e5e7eb}
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:12px 0}
.brand{display:flex;align-items:center;gap:10px;font-weight:900}
.brand img{width:32px;height:32px}
.nav-links{display:flex;gap:16px;color:#374151;font-weight:600;flex-wrap:wrap}
.nav-right{display:flex;gap:10px;align-items:center}
select,input,textarea{background:#fff;color:#111827;border:1px solid #e5e7eb;border-radius:12px;padding:10px 12px;width:100%}
label{font-size:13px;color:#374151}
.card{background:var(--card);border:1px solid #e5e7eb;border-radius:var(--radius);box-shadow:0 6px 18px rgba(17,24,39,.05);padding:18px}
.badge{font-size:12px;padding:6px 10px;border-radius:999px;background:#f3f4f6;border:1px solid #e5e7eb;color:#374151}
.button{display:inline-flex;align-items:center;gap:.5rem;padding:.7rem 1rem;border-radius:14px;background:linear-gradient(135deg,var(--primary),var(--secondary));color:#fff;box-shadow:0 8px 24px rgba(17,24,39,.15);transform:translateZ(0);transition:transform .12s ease,box-shadow .12s ease}
.button:hover{transform:translateY(-1px)} .button:active{transform:translateY(1px) scale(.98);box-shadow:none} .button:focus-visible{outline:2px solid #111827;outline-offset:3px}
.hero{padding:96px 0 40px}
.section{padding:70px 0}
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.grid2{display:grid;grid-template-columns:1.05fr .95fr;gap:18px}
@media(max-width:900px){.grid2{grid-template-columns:1fr} .tiles{grid-template-columns:1fr}}
.footer{padding:40px 0 80px;color:#6b7280}

#nprogress{position:fixed;left:0;top:0;height:2px;width:0;background:linear-gradient(90deg,var(--primary),var(--secondary));z-index:9999;transition:width .2s ease}

.reveal{opacity:0;transform:translateY(16px);transition:.45s ease} .reveal--in{opacity:1;transform:none}

#typed{font-weight:800;font-size:32px;text-align:center}
#typed .static{opacity:.9}
#typed .cursor{display:inline-block;width:2px;background:#111827;animation:blink 1s steps(1) infinite;margin-left:6px}
@keyframes blink{50%{opacity:0}}

.pulse-wrap{position:relative;overflow:hidden;border-radius:16px;background:#fff;border:1px solid #e5e7eb}
.pulse-wrap svg{width:100%;height:220px;display:block}
.pulse-caption{position:absolute;inset:auto 12px 12px 12px;display:flex;gap:10px;flex-wrap:wrap}

.tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.tab{padding:8px 12px;border-radius:12px;background:#f3f4f6;border:1px solid #e5e7eb;cursor:pointer}
.tab.active{background:#e0f2fe;border-color:#93c5fd}
.tab-panel{display:none}.tab-panel.active{display:block}

#intro{position:fixed;inset:0;display:grid;place-items:center;z-index:1000;background:#ffffff}
.fade-out{opacity:0;transition:opacity .6s ease}

.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:900px){.blog-grid{grid-template-columns:1fr}}
.blog-card img{width:100%;height:160px;object-fit:cover;border-radius:12px;margin-bottom:10px}

blockquote{border-left:4px solid #e5e7eb;padding-left:12px;color:#374151;background:#fbfdff;border-radius:6px}