/*
Theme Name:  Crucible Insight
Theme URI:   https://crucibleinsight.com
Description: Defense and policy think tank theme. Editorial layout, navy and gold design system. FSE block theme.
Version:     0.5.0
Author:      The Daniel Group LLC
License:     Proprietary
Text Domain: crucible-insight
Requires at least: 6.5
Requires PHP: 7.4
*/

/* ============================================================
   BASE
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; padding: 0; }
img { max-width: 100%; height: auto; display: block; }

/* ============================================================
   HERO MASTHEAD
   ============================================================ */
.ci-masthead {
    border-bottom: 3px solid var(--wp--preset--color--gold);
}

/* Constrain content width for readable line lengths */
.ci-masthead-inner {
    max-width: 860px;
}

/* Overline label */
.ci-masthead-label {
    display: block;
    margin: 0 0 0.75rem;
}

/* H1 — no default WP margin bleed */
.ci-masthead-h1 {
    max-width: 860px;
}

/* Sub-paragraph — constrained for reading comfort */
.ci-masthead-sub {
    max-width: 660px;
}

/* Button group — left-aligned, not stretched */
.ci-masthead .wp-block-buttons {
    justify-content: flex-start;
}

/* ============================================================
   HEADER
   ============================================================ */
.ci-header {
    position: sticky;
    top: 0;
    z-index: 100;
    border-bottom: 3px solid var(--wp--preset--color--gold);
}
.ci-header .wp-block-navigation a {
    color: #fff;
    text-decoration: none;
    font-size: 0.9375rem;
    font-weight: 500;
    transition: color 0.15s;
}
.ci-header .wp-block-navigation a:hover { color: var(--wp--preset--color--gold); }
.wp-block-navigation__responsive-container-open svg { fill: #fff; }

/* ============================================================
   EDITORIAL HERO
   ============================================================ */
.ci-editorial-hero { border-bottom: 1px solid var(--wp--preset--color--light-gray); }

.ci-section-rule {
    border: none;
    border-bottom: 3px solid #1A1A1A;
    margin-bottom: 1.25rem;
}

/* Featured article */
.ci-feature-title {
    font-family: var(--wp--preset--font-family--serif);
    font-size: clamp(1.375rem, 2.5vw, 1.875rem);
    line-height: 1.2;
    font-weight: 700;
}
.ci-feature-title a { color: #1A1A1A; text-decoration: none; }
.ci-feature-title a:hover { color: var(--wp--preset--color--navy); }

/* Sidebar list */
.ci-article-row {
    padding: 0.875rem 0;
    border-bottom: 1px solid var(--wp--preset--color--light-gray);
}
.ci-article-row:first-child { border-top: 1px solid var(--wp--preset--color--light-gray); }

/* ============================================================
   PUB TYPE LABEL
   ============================================================ */
.ci-pub-type {
    display: inline-block;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--wp--preset--color--gold);
    border-left: 3px solid var(--wp--preset--color--gold);
    padding-left: 0.5rem;
    line-height: 1.2;
    margin-bottom: 0.375rem;
}

/* wp:post-terms renders as a p or div — normalize */
.ci-pub-type p,
.ci-pub-type a {
    display: inline;
    font-size: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
    color: inherit;
    text-decoration: none;
    margin: 0;
    padding: 0;
}

/* ============================================================
   DOMAIN LABEL
   ============================================================ */
.ci-domain-label {
    display: inline-block;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--wp--preset--color--gold);
    background: rgba(212,168,75,0.10);
    padding: 0.25rem 0.625rem;
    border-radius: 3px;
    margin-bottom: 0.625rem;
}

.ci-domain-label p,
.ci-domain-label a {
    display: inline;
    font-size: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
    color: inherit;
    text-decoration: none;
    margin: 0;
    padding: 0;
}

.ci-domain-label a:hover { color: var(--wp--preset--color--light-gold); }

/* ============================================================
   PAPER CARDS
   ============================================================ */
.ci-card {
    background: #fff;
    border-top: 3px solid var(--wp--preset--color--gold);
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    height: 100%;
    transition: box-shadow 0.15s;
}
.ci-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,0.08); }

/* ============================================================
   DOMAIN TILES
   ============================================================ */
.ci-domain-tile {
    background: var(--wp--preset--color--off-white);
    border-top: 3px solid var(--wp--preset--color--light-gray);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    height: 100%;
    transition: border-top-color 0.15s;
}
.ci-domain-tile:hover { border-top-color: var(--wp--preset--color--gold); }
.ci-domain-tile img { width: 100%; aspect-ratio: 16/9; object-fit: cover; display: block; }
.ci-domain-tile-body { padding: 1.25rem; display: flex; flex-direction: column; flex-grow: 1; }
.ci-domain-tile-body p { flex-grow: 1; }

/* ============================================================
   ANALYST CARDS
   ============================================================ */
.ci-analyst-card {
    background: #fff;
    border-top: 3px solid var(--wp--preset--color--gold);
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    height: 100%;
    transition: box-shadow 0.15s;
}
.ci-analyst-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,0.08); }

/* Avatar in grid card */
.ci-analyst-avatar img,
.ci-analyst-avatar .wp-block-post-featured-image img {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--wp--preset--color--light-gray);
}

/* Full-size avatar on single analyst page */
.ci-analyst-avatar-lg img,
.ci-analyst-avatar-lg .wp-block-post-featured-image img {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 4px;
    border: 1px solid var(--wp--preset--color--light-gray);
}

/* ============================================================
   STATS
   ============================================================ */
.ci-stat-value {
    font-family: var(--wp--preset--font-family--serif);
    font-size: clamp(2rem,4vw,3rem);
    font-weight: 700;
    color: var(--wp--preset--color--gold);
    line-height: 1;
    display: block;
    margin-bottom: 0.375rem;
}
.ci-stat-label {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #9ca3af;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    display: block;
}

/* ============================================================
   PAPER SINGULAR
   ============================================================ */
.ci-paper-sidebar {
    border: 1px solid var(--wp--preset--color--light-gray);
    border-top: 3px solid var(--wp--preset--color--gold);
    padding: 1.5rem;
    background: #fff;
}
.ci-meta-row { padding: 0.75rem 0; border-bottom: 1px solid var(--wp--preset--color--light-gray); }
.ci-meta-row:last-child { border-bottom: none; }
.ci-meta-key { font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: #9ca3af; display: block; margin-bottom: 0.2rem; }
.ci-meta-val { font-size: 0.9375rem; font-weight: 500; }

/* ============================================================
   HEADER — nav right alignment
   ============================================================ */
.ci-header .wp-block-navigation {
    margin-left: auto;
}

/* ============================================================
   FOOTER — eliminate WordPress blockGap before template part
   ============================================================ */
.wp-site-blocks > footer,
.wp-site-blocks > .wp-block-template-part:last-child {
    margin-top: 0 !important;
}

/* Footer itself has no top border — dark CTA section runs flush */
.ci-footer { /* border-top removed v0.4.1 */ }
.ci-footer-links { list-style: none; padding: 0; margin: 0; }
.ci-footer-links a { color: #9ca3af; text-decoration: none; font-size: 0.9375rem; line-height: 2.4; transition: color 0.15s; }
.ci-footer-links a:hover { color: var(--wp--preset--color--gold); }

/* ============================================================
   PULL QUOTE
   ============================================================ */
.ci-pull-quote {
    border-left: 4px solid var(--wp--preset--color--gold);
    padding-left: 1.5rem;
    margin: 2.5rem 0;
}

/* ============================================================
   DOMAIN TILES — homepage variant (no image)
   ============================================================ */

/* Equal-height columns: ensure tiles fill column height */
.wp-block-columns .wp-block-column > .ci-domain-tile {
    height: 100%;
}

/* Tile name — serif heading, links inherit color */
.ci-domain-tile-name a {
    color: inherit;
    text-decoration: none;
    transition: color 0.15s;
}
.ci-domain-tile:hover .ci-domain-tile-name a {
    color: var(--wp--preset--color--navy);
}

/* CTA link at tile bottom */
.ci-domain-tile-cta {
    margin-top: auto;
}
.ci-domain-tile-cta a {
    color: var(--wp--preset--color--gold);
    text-decoration: none;
    font-weight: 700;
    transition: color 0.15s;
}
.ci-domain-tile-cta a:hover { color: var(--wp--preset--color--light-gold); }

/* ============================================================
   ANALYST CARD — read-more link
   ============================================================ */
.ci-analyst-card .wp-block-read-more {
    display: inline-block;
    color: var(--wp--preset--color--gold);
    text-decoration: none;
    font-size: 0.8125rem;
    font-weight: 700;
    margin-top: auto;
    padding-top: var(--wp--preset--spacing--4);
    transition: color 0.15s;
}
.ci-analyst-card .wp-block-read-more:hover { color: var(--wp--preset--color--light-gold); }

.ci-analyst-name a {
    color: inherit;
    text-decoration: none;
    transition: color 0.15s;
}
.ci-analyst-card:hover .ci-analyst-name a { color: var(--wp--preset--color--navy); }

/* ============================================================
   CARD READ-MORE LINKS (research cards)
   ============================================================ */
.ci-card .wp-block-read-more {
    color: var(--wp--preset--color--gold);
    text-decoration: none;
    font-weight: 600;
    transition: color 0.15s;
}
.ci-card .wp-block-read-more:hover { color: var(--wp--preset--color--light-gold); }

/* ============================================================
   ACCESSIBILITY
   ============================================================ */
:focus-visible {
    outline: 3px solid var(--wp--preset--color--gold);
    outline-offset: 2px;
}

.screen-reader-text {
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    word-wrap: normal;
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 782px) {
    .ci-domain-tile-body { padding: 1rem; }
    .ci-paper-sidebar { margin-top: 2rem; }
    .ci-analyst-card { margin-bottom: 1rem; }
}