:root{--bg:#0f1115;--bg2:#161a21;--fg:#e8e6e1;--muted:#9aa0a6;--acc:#e4b363;--line:#262b34;--max:1080px}
@media (prefers-color-scheme:light){:root{--bg:#faf8f4;--bg2:#ffffff;--fg:#1c1b19;--muted:#6b6f76;--acc:#b8862b;--line:#e6e2da}}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font:16px/1.6 "Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:var(--bg);color:var(--fg)}
a{color:inherit;text-decoration:none}img,svg{max-width:100%;display:block}
.wrap{max-width:var(--max);margin:0 auto;padding:0 20px}
header{position:sticky;top:0;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);z-index:9}
header .wrap{display:flex;align-items:center;justify-content:space-between;height:64px}
.logo{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:.02em}.logo svg{width:26px;height:26px}
nav a{margin-left:26px;color:var(--muted);font-size:15px}nav a:hover,nav a.on{color:var(--fg)}
.hero{padding:96px 0 64px}.hero h1{font-size:clamp(34px,6vw,64px);line-height:1.05;margin:0 0 20px;letter-spacing:-.02em;max-width:820px}
.hero p{font-size:20px;color:var(--muted);max-width:620px;margin:0 0 32px}
.btn{display:inline-block;padding:13px 22px;border-radius:8px;background:var(--acc);color:#111;font-weight:600;border:0;font:inherit;cursor:pointer}.btn.ghost{background:transparent;border:1px solid var(--line);color:var(--fg);margin-left:10px}
section{padding:56px 0;border-top:1px solid var(--line)}h2{font-size:28px;margin:0 0 8px;letter-spacing:-.01em}.lead{color:var(--muted);margin:0 0 32px;max-width:640px}
.grid{display:grid;gap:22px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.card{background:var(--bg2);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.card .th{aspect-ratio:4/3}.card .b{padding:16px 18px}.card h3{margin:0 0 6px;font-size:17px}.card p{margin:0;color:var(--muted);font-size:14px}
.svc{display:grid;gap:26px;grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}.svc h3{margin:0 0 8px;font-size:18px}.svc p{color:var(--muted);margin:0}
.svc .n{color:var(--acc);font-family:ui-monospace,Menlo,monospace;font-size:13px;margin-bottom:10px}
.two{display:grid;gap:40px;grid-template-columns:1fr 1fr}@media(max-width:760px){.two{grid-template-columns:1fr}nav a{margin-left:16px}}
.prose p{color:var(--muted)}.prose h3{margin:26px 0 8px}ul.clean{padding-left:18px;color:var(--muted)}
form{display:grid;gap:14px;max-width:520px}label{font-size:14px;color:var(--muted)}input,textarea{width:100%;padding:12px 14px;border-radius:8px;border:1px solid var(--line);background:var(--bg2);color:var(--fg);font:inherit}
footer{border-top:1px solid var(--line);padding:36px 0;color:var(--muted);font-size:14px}footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}
.th-1{background:linear-gradient(135deg,#2b3a67,#e4b363)}.th-2{background:linear-gradient(135deg,#1f6f78,#f2d0a4)}.th-3{background:linear-gradient(135deg,#4b3b47,#c86b85)}.th-4{background:linear-gradient(135deg,#334d3b,#a8c686)}.th-5{background:linear-gradient(135deg,#5a3e36,#e8a87c)}.th-6{background:linear-gradient(135deg,#2d2d44,#9fa8da)}