:root { --c8-paper-bg:#FFFFFF; --c8-paper-card:#F2F2F0; --c8-ink:#080808; --c8-sub:#555555; --c8-grid-line:rgba(8,8,8,.08); --c8-blue:#0047E1; --font-body:'DM Sans',sans-serif; --font-mono:'Space Mono',monospace; --font-heading:'Michroma',sans-serif; }
.c8tk { background:var(--c8-paper-bg); padding:8.5rem 3.5rem 5rem; box-sizing:border-box; min-height:100vh; }
.c8tk-inner { max-width:1200px; margin:0 auto; }
.c8tk-eyebrow { font-family:var(--font-mono); font-size:.75rem; color:var(--c8-blue); text-transform:uppercase; letter-spacing:.14em; font-weight:700; margin-bottom:.9rem; }
.c8tk-h1 { font-family:var(--font-heading); font-size:clamp(1.8rem,4vw,3rem); font-weight:700; color:var(--c8-ink); text-transform:uppercase; line-height:1.12; margin:0 0 1.1rem; max-width:18ch; }
.c8tk-lede { font-family:var(--font-body); font-size:1.1rem; line-height:1.75; color:var(--c8-sub); max-width:60ch; margin:0 0 3rem; }
.c8tk-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.c8tk-card { display:flex; flex-direction:column; background:var(--c8-paper-card); border:1px solid var(--c8-grid-line); border-radius:4px; padding:2rem; text-decoration:none; color:var(--c8-ink); transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease; }
.c8tk-card:hover, .c8tk-card:focus-visible { transform:translateY(-4px); border-color:var(--c8-blue); box-shadow:0 14px 34px rgba(0,71,225,.12); outline:none; }
.c8tk-ico { width:52px; height:52px; border-radius:6px; background:var(--c8-blue); display:flex; align-items:center; justify-content:center; margin-bottom:1.4rem; }
.c8tk-ico svg { width:26px; height:26px; fill:none; stroke:#fff; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.c8tk-tag { font-family:var(--font-mono); font-size:.68rem; letter-spacing:.12em; font-weight:700; color:var(--c8-blue); margin-bottom:.6rem; }
.c8tk-name { font-family:var(--font-heading); font-size:1.15rem; text-transform:uppercase; line-height:1.25; margin:0 0 .8rem; color:var(--c8-ink); }
.c8tk-desc { font-family:var(--font-body); font-size:.98rem; line-height:1.65; color:var(--c8-sub); margin:0 0 1.6rem; }
.c8tk-go { margin-top:auto; font-family:var(--font-mono); font-size:.8rem; font-weight:700; letter-spacing:.06em; color:var(--c8-blue); }
.c8tk-go::after { content:" \2192"; }
.c8tk-sub { margin-top:4rem; padding-top:2.5rem; border-top:1px solid var(--c8-grid-line); }
.c8tk-sub-h { font-family:var(--font-heading); font-size:1rem; text-transform:uppercase; margin:0 0 1.2rem; color:var(--c8-ink); }
.c8tk-plugins { display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; }
.c8tk-plugin { display:block; padding:1.2rem 1.4rem; border:1px solid var(--c8-grid-line); border-radius:4px; text-decoration:none; color:var(--c8-ink); background:#fff; transition:border-color .2s ease; }
.c8tk-plugin:hover { border-color:var(--c8-blue); }
.c8tk-plugin b { display:block; font-family:var(--font-body); font-size:1rem; margin-bottom:.25rem; }
.c8tk-plugin span { font-family:var(--font-body); font-size:.9rem; color:var(--c8-sub); line-height:1.55; }
@media (max-width: 960px) { .c8tk-grid { grid-template-columns:1fr; } .c8tk-plugins { grid-template-columns:1fr; } }
@media (max-width: 700px) { .c8tk { padding:6.5rem 1.25rem 3rem; } .c8tk-card { padding:1.5rem; }