/*
Theme Name: Dustshard
Theme URI: https://ruzqa.id/
Author: Tris | RUZQA Strategic Architecture
Description: V1.3.5 The Phantom Uniformity. Uniform Feed layout with Dual-Vector Routing, Shadow Open Graph, Executive Courier, and Anti-Kusam Typography.
Version: 1.3.5
License: GNU General Public License v2 or later
Text Domain: dustshard
*/

:root {
    --bg-main: #FFFFFF;
    --text-primary: #09090B;
    --text-body: #111827;
    --text-muted: #64748B;
    --border-color: #E2E8F0;
    --font-serif: Georgia, Cambria, "Times New Roman", Times, serif;
    --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --read-width: 680px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
body { background-color: var(--bg-main); color: var(--text-primary); font-family: var(--font-sans); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; display: flex; flex-direction: column; min-height: 100vh; }

/* STEALTH HEADER */
.site-header { border-bottom: 1px solid var(--border-color); padding: 20px 0; background: rgba(255, 255, 255, 0.98); position: sticky; top: 0; z-index: 1000; }
.header-inner { max-width: 980px; margin: 0 auto; padding: 0 24px; display: flex; align-items: center; gap: 16px; }
.nav-toggle { background: none; border: none; color: var(--text-primary); font-size: 1.5rem; cursor: pointer; padding: 4px; display: flex; align-items: center; justify-content: center; transition: opacity 0.2s ease; }
.nav-toggle:hover { opacity: 0.6; }
.site-title { font-weight: 800; font-size: 1.35rem; letter-spacing: -0.04em; text-decoration: none; color: var(--text-primary); text-transform: lowercase; }

/* COMMAND DRAWER */
.nav-backdrop { position: fixed; inset: 0; background: rgba(9, 9, 11, 0.45); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); z-index: 1500; opacity: 0; pointer-events: none; transition: opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1); }
.nav-backdrop.is-open { opacity: 1; pointer-events: auto; }
.nav-drawer { position: fixed; top: 0; left: 0; width: 300px; height: 100vh; background: var(--bg-main); z-index: 2000; transform: translateX(-100%); transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1); box-shadow: 20px 0 50px rgba(0, 0, 0, 0.1); display: flex; flex-direction: column; padding: 32px 24px; overflow-y: auto; }
.nav-drawer.is-open { transform: translateX(0); }
.drawer-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 48px; padding-bottom: 20px; border-bottom: 1px solid var(--border-color); }
.drawer-title { font-weight: 800; font-size: 1.35rem; letter-spacing: -0.04em; color: var(--text-primary); text-transform: lowercase; }
.nav-close { background: none; border: none; color: var(--text-muted); font-size: 1.25rem; cursor: pointer; padding: 4px; transition: color 0.2s; }
.nav-close:hover { color: var(--text-primary); }
.drawer-menu { list-style: none; display: flex; flex-direction: column; gap: 20px; }
.drawer-menu li a { text-decoration: none; color: var(--text-primary); font-size: 1.15rem; font-weight: 600; letter-spacing: -0.02em; display: block; transition: transform 0.2s, color 0.2s; }
.drawer-menu li a:hover { color: #10B981; transform: translateX(6px); }

/* READING SANCTUARY */
.container { max-width: var(--read-width); margin: 56px auto 64px auto; padding: 0 24px; flex: 1; width: 100%; }

/* ANTI-KUSAM TYPOGRAPHY */
h1, h2, h3, h4 { font-family: var(--font-sans); font-weight: 700; color: var(--text-primary); letter-spacing: -0.03em; }
h1.post-title { font-size: 2.8rem; line-height: 1.15; margin-bottom: 18px; font-weight: 800; }
h2 { font-size: 1.8rem; margin: 48px 0 16px; line-height: 1.25; }
h3 { font-size: 1.4rem; margin: 36px 0 12px; }
.post-meta { font-size: 0.875rem; color: var(--text-muted); margin-bottom: 48px; display: flex; align-items: center; gap: 8px; font-weight: 500; }
.post-meta span::after { content: "•"; margin-left: 8px; opacity: 0.5; }
.post-meta span:last-child::after { content: ""; }
.post-content { font-family: var(--font-serif); font-size: 1.25rem; line-height: 1.72; color: var(--text-body); font-weight: 400; }
.post-content p { margin-bottom: 2.2rem; }
.post-content a { color: var(--text-primary); text-decoration: underline; text-decoration-color: var(--border-color); text-underline-offset: 6px; transition: text-decoration-color 0.2s; font-weight: 500; }
.post-content a:hover { text-decoration-color: var(--text-primary); }
.post-content blockquote { border-left: 3px solid var(--text-primary); padding-left: 24px; margin: 36px 0; font-style: italic; color: var(--text-muted); font-size: 1.35rem; }
.post-content > *:last-child { margin-bottom: 0 !important; padding-bottom: 0 !important; border-bottom: none !important; }

/* UNIFORM FEED (V1.3.5) */
.post-preview { margin-bottom: 56px; padding-bottom: 56px; border-bottom: 1px solid var(--border-color); }
.meta-signifier { font-size: 0.85rem; font-weight: 700; color: var(--text-muted); margin-bottom: 12px; display: flex; align-items: center; gap: 8px; letter-spacing: 0.04em; }
.meta-signifier a.badge-cat { color: var(--text-primary); font-weight: 800; text-decoration: none; transition: opacity 0.2s; }
.meta-signifier a.badge-cat:hover { opacity: 0.7; }
.meta-signifier span::after, .meta-signifier a::after { content: "•"; margin-left: 8px; font-weight: 400; opacity: 0.4; }
.meta-signifier span:last-child::after, .meta-signifier a:last-child::after { content: ""; }
.post-preview h2 { font-size: 1.6rem; line-height: 1.3; margin-bottom: 12px; font-weight: 700; letter-spacing: -0.02em; }
.post-preview p.excerpt { font-family: var(--font-serif); font-size: 1.1rem; line-height: 1.6; color: var(--text-body); }
h2 a { text-decoration: none; color: var(--text-primary); transition: opacity 0.2s; }
h2 a:hover { opacity: 0.7; }

@media (max-width: 640px) {
    h1.post-title { font-size: 2.2rem; }
    .post-preview h2 { font-size: 1.4rem; }
}