*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;font:400 17px/1.75 Inter,system-ui,-apple-system,sans-serif;color:#1e1b2e;background:#fafafc}
a{color:var(--a)}.wrap{max-width:1120px;margin:0 auto;padding:0 20px}
h1,h2,h3{font-family:"Plus Jakarta Sans",Inter,system-ui,sans-serif;letter-spacing:-.02em;line-height:1.25;color:#0f0d1a}
.top{position:sticky;top:0;z-index:9;background:rgba(255,255,255,.85);backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid #ecebf3}
.top .wrap{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{font:800 1.25rem "Plus Jakarta Sans",sans-serif;text-decoration:none;color:#0f0d1a;display:flex;align-items:center;gap:10px}
.dot{width:14px;height:14px;border-radius:5px;background:linear-gradient(135deg,var(--a),var(--a2))}
.top nav{display:flex;gap:18px;align-items:center}.top nav a{text-decoration:none;color:#4b4763;font-weight:500;font-size:.95rem}.top nav a:hover{color:var(--a)}
.lsw{border:1px solid #e3e1ee;border-radius:10px;padding:6px 8px;background:#fff;font:500 .85rem Inter,sans-serif;color:#4b4763}
.hero{background:radial-gradient(1200px 400px at 10% -10%,color-mix(in srgb,var(--a) 18%,transparent),transparent),radial-gradient(900px 400px at 100% 0,color-mix(in srgb,var(--a2) 20%,transparent),transparent);padding:72px 0 48px;border-bottom:1px solid #ecebf3}
.hero h1{font-size:clamp(2.2rem,5vw,3.4rem);margin:14px 0 8px;font-weight:800}.hero p{color:#5b5775;font-size:1.15rem;margin:0;max-width:600px}
.pill{display:inline-block;padding:6px 12px;border-radius:999px;background:#fff;border:1px solid #ecebf3;font-size:.8rem;font-weight:600;color:var(--a);box-shadow:0 1px 2px rgba(20,10,50,.05)}
.sec{font-size:1.3rem;margin:40px 0 18px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:22px;margin-bottom:60px}
.card{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid #ecebf3;border-radius:18px;padding:24px;text-decoration:none;color:inherit;box-shadow:0 1px 2px rgba(20,10,50,.04),0 8px 24px -12px rgba(20,10,50,.08);transition:transform .2s,box-shadow .2s,border-color .2s;overflow:hidden}
.card:before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:linear-gradient(90deg,var(--a),var(--a2));opacity:0;transition:opacity .2s}
.card:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--a) 30%,#ecebf3);box-shadow:0 20px 40px -18px color-mix(in srgb,var(--a) 45%,transparent)}.card:hover:before{opacity:1}
.card time{font-size:.8rem;color:#8a86a3;font-weight:500}.card h3{font-size:1.15rem;margin:8px 0 8px}.card p{color:#5b5775;font-size:.95rem;line-height:1.6;margin:0 0 14px;flex:1}
.more{color:var(--a);font-weight:700}
.post{max-width:740px;margin:0 auto;padding:40px 20px 20px}
.back{font-size:.9rem;text-decoration:none;font-weight:500}
.post h1{font-size:clamp(1.9rem,4.5vw,2.75rem);font-weight:800;margin:18px 0 10px}
.meta{color:#8a86a3;margin:0 0 30px;padding-bottom:24px;border-bottom:1px solid #ecebf3}
.post h2{font-size:1.55rem;margin:2.2em 0 .6em}.post h3{font-size:1.2rem;margin:1.8em 0 .5em}.post p,.post li{color:#2d2a40}
.post ul,.post ol{padding-inline-start:1.3em}.post li{margin:.35em 0}.post li::marker{color:var(--a)}
.post blockquote{margin:1.5em 0;padding:14px 20px;border-inline-start:4px solid var(--a);background:#fff;border-radius:10px}
.post table{width:100%;border-collapse:collapse;margin:1.5em 0;font-size:.95rem}.post th,.post td{border:1px solid #ecebf3;padding:10px;text-align:start}.post th{background:#f4f3f9}
.post strong{color:#0f0d1a}.post img{max-width:100%;border-radius:14px}
.rel{border-top:1px solid #ecebf3;padding-top:30px;margin-top:30px}.rel h2{font-size:1.3rem}
.foot{border-top:1px solid #ecebf3;padding:28px 0;color:#8a86a3;font-size:.9rem;background:#fff}
@media(max-width:600px){body{font-size:16px}.top nav{gap:12px}.top nav a:first-child{display:none}.hero{padding:48px 0 32px}.grid{grid-template-columns:1fr}}