/* ==========================================================================
   WordPress-specific additions (the design system lives in style.css).
   ========================================================================== */

/* Admin bar: keep the fixed header and mobile menu below it. */
.admin-bar .site-header { top: 32px; }
.admin-bar .mobile-menu { top: 32px; }
@media (max-width: 782px) {
    .admin-bar .site-header { top: 46px; }
    .admin-bar .mobile-menu { top: 46px; }
}
@media (max-width: 600px) {
    /* The admin bar scrolls away on small screens. */
    .admin-bar .site-header.is-hidden { top: 0; }
}

/* Contact form honeypot. */
.rr-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Core accessibility helper. */
.screen-reader-text {
    position: absolute !important;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px);
    white-space: nowrap;
}

/* Generic pages, posts and archives --------------------------------------- */
.page-masthead--compact .masthead-title { font-size: var(--fs-h2); }
.rr-content-section { padding: var(--section-y) 0; color: var(--ink); background: var(--white); }

.entry-content { max-width: 46rem; font-size: var(--fs-body); }
.entry-content > * + * { margin-top: 1.25em; }
.entry-content h2,
.entry-content h3,
.entry-content h4 { margin-top: 2em; font-family: var(--font-display); font-weight: 500; letter-spacing: -0.03em; line-height: 1.1; }
.entry-content h2 { font-size: var(--fs-h3); }
.entry-content a { border-bottom: 1px solid currentColor; }
.entry-content img { height: auto; }
.entry-content blockquote { margin-left: 0; padding-left: 1.5rem; border-left: 2px solid var(--ink); font-size: var(--fs-lead); }
.entry-content ul,
.entry-content ol { padding-left: 1.25rem; }
.alignwide { max-width: 64rem; }
.alignfull { width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); }
.wp-caption-text,
figcaption { font-family: var(--font-mono); font-size: var(--fs-label); color: var(--muted); }

.rr-featured { margin-bottom: 3rem; }
.rr-featured img { width: 100%; }

.rr-post-list { border-top: 1px solid var(--line-light); }
.rr-post-link {
    display: grid;
    grid-template-columns: 10rem 1fr 1.5fr auto;
    gap: 1.5rem;
    align-items: baseline;
    padding: 2rem 0;
    border-bottom: 1px solid var(--line-light);
}
.rr-post-meta { font-family: var(--font-mono); font-size: var(--fs-label); text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted); }
.rr-post-title { font-family: var(--font-display); font-size: var(--fs-h3); font-weight: 500; line-height: 1.1; letter-spacing: -0.03em; }
.rr-post-excerpt { color: var(--muted); }
.rr-post-link i { font-style: normal; transition: transform var(--t-med) var(--ease-out); }
.rr-post-link:hover i,
.rr-post-link:focus-visible i { transform: translate(3px, -3px); }
@media (max-width: 767.98px) {
    .rr-post-link { grid-template-columns: 1fr; gap: 0.5rem; }
    .rr-post-link i { display: none; }
}

.navigation.pagination,
.post-navigation { margin-top: 3rem; font-family: var(--font-mono); font-size: var(--fs-small); }
.nav-links { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: space-between; }
.page-numbers.current { text-decoration: underline; }

.rr-empty { max-width: 36rem; }
.search-form { display: flex; gap: 0.75rem; margin-top: 1rem; }
.search-form .search-field { flex: 1; padding: 0.75rem 0; border: 0; border-bottom: 1px solid var(--ink); background: transparent; }
.search-form .search-submit { padding: 0.75rem 1.25rem; border: 1px solid var(--ink); background: var(--ink); color: var(--white); }

.comments-area { max-width: 46rem; margin-top: 4rem; }
.comment-list { padding-left: 0; list-style: none; }
.comment-list .comment { padding: 1.5rem 0; border-bottom: 1px solid var(--line-light); }
.comment-form input:not([type="submit"]):not([type="checkbox"]),
.comment-form textarea { width: 100%; padding: 0.75rem; border: 1px solid var(--line-light); }
.comment-form .submit { padding: 0.85rem 1.5rem; border: 0; background: var(--ink); color: var(--white); }