/*
Theme Name: Reid Chatham
Theme URI: https://reidchatham.com
Description: Child theme for reidchatham.com built on Twenty Twenty-Four: header navigation, a compact hero, a Projects section, recent posts from blog.reidchatham.com, and a links footer.
Template: twentytwentyfour
Author: Reid Chatham
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 8.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: reidchatham
*/

/* Header ------------------------------------------------------------ */
.rc-header { border-bottom: 1px solid var(--wp--preset--color--accent-6, rgba(0, 0, 0, 0.08)); }
.rc-header .wp-block-site-title a { text-decoration: none; }
.rc-header .wp-block-navigation a { text-decoration: none; }
.rc-header .wp-block-navigation a:hover { text-decoration: underline; text-underline-offset: 4px; }

/* Hero -------------------------------------------------------------- */
.rc-hero .wp-block-post-featured-image img {
    aspect-ratio: 4 / 3;
    border-radius: 18px;
    object-fit: cover;
    width: 100%;
}
.rc-hero .wp-block-site-title { font-family: var(--wp--preset--font-family--heading); font-size: clamp(2.6rem, 5.5vw, 4rem); font-weight: 400; line-height: 1.05; margin: 0; }
.rc-hero .wp-block-site-title a { text-decoration: none; }
.rc-hero__role { color: var(--wp--preset--color--contrast-2); font-size: 1.1rem; margin-top: 0.4rem; }
.rc-hero .wp-block-post-content > p:empty { display: none; }
.rc-hero .wp-block-post-content p { line-height: 1.7; }

/* Section headings -------------------------------------------------- */
.rc-section { scroll-margin-top: 24px; }
.rc-eyebrow {
    color: var(--wp--preset--color--contrast-2);
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

/* Project cards ----------------------------------------------------- */
.rc-card {
    background: var(--wp--preset--color--base);
    border: 1px solid rgba(17, 17, 17, 0.08);
    border-radius: 18px;
    height: 100%;
    overflow: hidden;
    transition: box-shadow 0.2s ease, transform 0.2s ease;
}
.rc-card:hover { box-shadow: 0 18px 40px -24px rgba(17, 17, 17, 0.35); transform: translateY(-2px); }
.rc-card .wp-block-image { margin: 0; }
.rc-card .wp-block-image img { aspect-ratio: 16 / 9; display: block; object-fit: cover; object-position: top; width: 100%; }
.rc-card__body { padding: 1.4rem 1.5rem 1.6rem; }
.rc-card h3 { margin: 0 0 0.5rem; }
.rc-card h3 a,
.rc-oss h3 a { text-decoration: none; }
.rc-card p { margin: 0 0 0.75rem; }
.rc-card__link a { font-weight: 600; text-decoration: none; }

.rc-oss {
    border-top: 1px solid rgba(17, 17, 17, 0.08);
}
.rc-oss h3 { font-size: 1.15rem; margin: 0 0 0.25rem; }
.rc-oss p { margin: 0; }

/* Recent posts (shortcode) ------------------------------------------ */
.rc-posts {
    display: grid;
    gap: 1.5rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    list-style: none;
    margin: var(--wp--preset--spacing--30) 0 0;
    padding: 0;
}
.rc-post a { color: inherit; display: block; height: 100%; text-decoration: none; }
.rc-post__thumb {
    aspect-ratio: 16 / 10;
    background: linear-gradient(135deg, var(--wp--preset--color--base-2) 0%, var(--wp--preset--color--accent-2, #e6e0d6) 100%);
    border-radius: 14px;
    display: block;
    object-fit: cover;
    width: 100%;
}
.rc-post__thumb--empty {
    align-items: center;
    color: var(--wp--preset--color--contrast-3, #a4a4a4);
    display: flex;
    font-family: var(--wp--preset--font-family--heading);
    font-size: clamp(3rem, 6vw, 4.5rem);
    justify-content: center;
}
.rc-post__date { color: var(--wp--preset--color--contrast-2); display: block; font-size: 0.85rem; margin-top: 0.9rem; }
.rc-post__title { font-family: var(--wp--preset--font-family--heading); font-size: 1.35rem; line-height: 1.25; margin: 0.25rem 0 0.4rem; }
.rc-posts .rc-post__title { margin-block: 0.25rem 0.4rem; }
.rc-post__excerpt { color: var(--wp--preset--color--contrast-2); font-size: 0.95rem; line-height: 1.6; margin: 0; }
.rc-post a:hover .rc-post__title { text-decoration: underline; text-underline-offset: 4px; }

/* Footer ------------------------------------------------------------ */
.rc-footer { border-top: 1px solid rgba(17, 17, 17, 0.08); }
.rc-footer a { text-decoration: none; }
.rc-footer a:hover { text-decoration: underline; text-underline-offset: 4px; }

@media (max-width: 781px) {
    .rc-posts { gap: 1.25rem; grid-template-columns: 1fr; }
    .rc-post a { align-content: start; column-gap: 1rem; display: grid; grid-template-columns: 96px minmax(0, 1fr); grid-template-rows: auto auto 1fr; }
    .rc-post__thumb { aspect-ratio: 1; border-radius: 12px; grid-row: 1 / span 3; }
    .rc-post__thumb--empty { font-size: 2.2rem; }
    .rc-post__date,
    .rc-post__title,
    .rc-post__excerpt { grid-column: 2; }
    .rc-post__date { margin-top: 0; }
    .rc-post__title { font-size: 1.15rem; }
    .rc-hero .wp-block-site-title { text-align: left; }
}