.tutorials-page[data-v-36dbb0f8]{background-color:var(--bg-base)}.tu-hero[data-v-36dbb0f8]{padding:var(--space-16) 0 var(--space-8);background:linear-gradient(180deg,var(--bg-card) 0%,var(--bg-base) 100%);text-align:center}.tu-h1[data-v-36dbb0f8]{font-family:var(--font-serif);font-size:clamp(40px,6vw,64px);font-weight:700;color:var(--text-title);margin-bottom:var(--space-3);letter-spacing:var(--tracking-display)}.tu-subtitle[data-v-36dbb0f8]{font-size:var(--fs-lg);color:var(--text-body);margin-bottom:var(--space-8);max-width:720px;margin-left:auto;margin-right:auto;line-height:var(--lh-relaxed)}.tu-tags[data-v-36dbb0f8]{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-2);max-width:720px;margin:0 auto}.tag[data-v-36dbb0f8]{padding:6px 14px;background-color:var(--bg-card-warm);border:1px solid var(--border-default);border-radius:var(--radius-pill);font-size:var(--fs-xs);font-weight:600;color:var(--text-muted);cursor:pointer;transition:background-color var(--dur-fast),color var(--dur-fast)}.tag[data-v-36dbb0f8]:hover{border-color:var(--brand-primary);color:var(--brand-primary)}.tag.active[data-v-36dbb0f8]{background-color:var(--brand-primary);color:var(--text-on-brand);border-color:var(--brand-primary)}.tu-list[data-v-36dbb0f8]{padding:var(--space-12) 0 var(--space-20)}.tu-grid[data-v-36dbb0f8]{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-6)}@media (max-width: 1024px){.tu-grid[data-v-36dbb0f8]{grid-template-columns:repeat(2,1fr)}}@media (max-width: 600px){.tu-grid[data-v-36dbb0f8]{grid-template-columns:1fr}}.tu-card[data-v-36dbb0f8]{display:flex;background-color:var(--bg-card-warm);border:1px solid var(--border-default);border-radius:var(--radius-2xl);overflow:hidden;transition:transform var(--dur-base),box-shadow var(--dur-base)}.tu-card[data-v-36dbb0f8]:hover{transform:translateY(-3px);box-shadow:var(--shadow-elevated)}.tu-link[data-v-36dbb0f8]{display:flex;flex-direction:column;height:100%;width:100%;color:inherit;text-decoration:none}.tu-cover[data-v-36dbb0f8]{height:140px;display:flex;align-items:center;justify-content:center;font-family:var(--font-serif);font-size:var(--fs-3xl);font-weight:700;color:var(--text-title);position:relative}.tu-cover-cat[data-v-36dbb0f8]{font-size:var(--fs-xs);font-weight:700;text-transform:uppercase;letter-spacing:var(--tracking-wide);color:var(--text-warm);position:absolute;top:var(--space-3);left:var(--space-4)}.tu-body[data-v-36dbb0f8]{padding:var(--space-5);display:flex;flex-direction:column;gap:var(--space-3);flex:1}.tu-name[data-v-36dbb0f8]{font-family:var(--font-sans);font-size:var(--fs-lg);font-weight:700;color:var(--text-title);line-height:var(--lh-snug);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.tu-desc[data-v-36dbb0f8]{font-size:var(--fs-sm);color:var(--text-body);line-height:var(--lh-relaxed);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;flex:1}.tu-meta[data-v-36dbb0f8]{display:flex;gap:var(--space-2);font-size:var(--fs-xs);color:var(--text-muted)}.dot[data-v-36dbb0f8]{color:var(--border-strong)}.tu-tags-row[data-v-36dbb0f8]{display:flex;flex-wrap:wrap;gap:var(--space-2);padding-top:var(--space-2);border-top:1px solid var(--border-default)}.tu-tags-row .tu-tag[data-v-36dbb0f8]{font-size:var(--fs-xs);color:var(--brand-primary);font-weight:500}
