/* ============================================================
   YIELD FILES v4 — Style 3
   Slate Blue #1e2d45 + Electric Amber #e8a020
   Inter 800 headlines · IBM Plex Mono data
   ============================================================ */

/* ── Variables ── */
:root {
    --bg:    #f4f6f8;
    --bg2:   #eaecf0;
    --card:  #ffffff;
    --str:   #1e2d45;
    --str-b: #172438;
    --dat:   #e8a020;
    --dat-b: #f0b030;
    --dat-l: rgba(232,160,32,0.09);
    --bone:  #eef2f8;
    --text:  #0e1620;
    --tm:    #384858;
    --tl:    #607080;
    --td:    #9aacbc;
    --bor:   rgba(30,45,69,0.13);
    --bors:  rgba(30,45,69,0.07);
    --dbor:  rgba(238,242,248,0.09);
    --dbors: rgba(238,242,248,0.05);
    --green: #2a8a50;
    --red:   #d05050;
    --sans:  'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    --serif: 'Newsreader', Georgia, serif;
    --mono:  'IBM Plex Mono', 'Courier New', monospace;
    --shadow: 0 2px 12px rgba(14,22,32,0.08);
    --max-w: 1320px;
    --pad:   32px;
}

/* ── Reset ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 16px; -webkit-font-smoothing: antialiased; scroll-behavior: smooth; }
body { font-family: var(--sans); color: var(--text); background: var(--bg); line-height: 1.6; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }

/* ── Layout helpers ── */
.gh-site { display: flex; flex-direction: column; min-height: 100vh; }
.gh-main { flex: 1; }
.yf-inner { max-width: var(--max-w); margin: 0 auto; padding-left: var(--pad); padding-right: var(--pad); }

/* ══════════════════════════════════════
   NAV
══════════════════════════════════════ */
.gh-head {
    background: var(--str-b);
    position: sticky; top: 0; z-index: 100;
    border-bottom: 1px solid var(--dbor);
    transition: box-shadow 0.2s;
}
.gh-head.scrolled { box-shadow: 0 2px 20px rgba(0,0,0,0.25); }
.gh-head-inner {
    height: 54px; display: flex; align-items: center;
    max-width: var(--max-w); margin: 0 auto;
    padding-left: var(--pad); padding-right: var(--pad);
}
.gh-head-brand { flex-shrink: 0; margin-right: 44px; }
.gh-head-logo { display: flex; align-items: center; }
.gh-logo-wrap { display: flex; flex-direction: column; padding-left: 10px; border-left: 2px solid var(--dat); }
.gh-logo-name { font-family: var(--serif); font-size: 18px; font-weight: 700; color: var(--bone); letter-spacing: 0; line-height: 1.1; }
.gh-logo-sub { font-size: 8.5px; color: rgba(238,242,248,0.45); letter-spacing: 0.14em; text-transform: uppercase; margin-top: 3px; }
.gh-head-logo img { height: 32px; width: auto; }
.gh-head-menu { flex: 1; }
.gh-head-menu .nav { display: flex; align-items: center; list-style: none; }
.gh-head-menu .nav li a { font-size: 12.5px; font-weight: 500; color: rgba(238,242,248,0.65); padding: 0 14px; border-right: 1px solid rgba(255,255,255,0.06); transition: color 0.15s; white-space: nowrap; }
.gh-head-menu .nav li:first-child a { padding-left: 0; }
.gh-head-menu .nav li a:hover { color: var(--bone); }
.gh-head-actions { margin-left: auto; display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.gh-head-signin { font-size: 11px; font-weight: 500; color: rgba(238,242,248,0.45); border: 1px solid rgba(238,242,248,0.16); padding: 5px 14px; transition: all 0.15s; white-space: nowrap; }
.gh-head-signin:hover { color: var(--bone); border-color: rgba(238,242,248,0.35); }
.gh-head-btn { font-size: 11px; font-weight: 700; color: var(--str) !important; background: var(--dat); padding: 6px 16px; white-space: nowrap; transition: background 0.15s; letter-spacing: -0.01em; }
.gh-head-btn:hover { background: var(--dat-b); }
.gh-head-member { display: flex; align-items: center; }
.gh-member-avatar { width: 28px; height: 28px; border-radius: 50%; object-fit: cover; }
.gh-member-initial { width: 28px; height: 28px; background: var(--dat); color: var(--str); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; overflow: hidden; }

/* Hamburger */
.gh-burger { display: none; flex-direction: column; justify-content: center; gap: 5px; width: 36px; height: 36px; background: none; border: none; cursor: pointer; padding: 4px; margin-left: 4px; flex-shrink: 0; }
.gh-burger span { display: block; width: 20px; height: 2px; background: rgba(238,242,248,0.6); border-radius: 2px; transition: all 0.25s; transform-origin: center; }
.gh-burger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.gh-burger.is-open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.gh-burger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Zone 1 — Option C: fully light with amber left border accent */
.yf-zone1 { border-bottom: 1px solid var(--bor); }
.yf-zone1-inner { display: grid; grid-template-columns: 58% 42%; max-width: var(--max-w); margin: 0 auto; }

/* Featured analysis — white with amber left accent */
.yf-feat { padding: 30px var(--pad); border-right: 1px solid var(--bor); display: flex; flex-direction: column; justify-content: space-between; background: var(--card); }
.yf-feat-eyebrow { font-size: 8px; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: var(--dat); margin-bottom: 12px; display: flex; align-items: center; gap: 10px; }
.yf-feat-eyebrow::after { content: ''; flex: 1; height: 1px; background: var(--bor); }
.yf-feat-tag { font-size: 8px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--dat); display: block; margin-bottom: 8px; }
.yf-feat-title { font-size: clamp(20px, 2.2vw, 24px); font-weight: 800; color: var(--text); line-height: 1.18; margin-bottom: 14px; letter-spacing: -0.03em; }
.yf-feat-title a { color: inherit; transition: color 0.15s; }
.yf-feat-title a:hover { color: var(--dat); }
.yf-feat-body { font-size: 13px; color: var(--tl); line-height: 1.72; font-weight: 300; margin-bottom: 20px; flex: 1; }
.yf-feat-meta { font-family: var(--mono); font-size: 9.5px; color: var(--td); padding-top: 14px; border-top: 1px solid var(--bors); display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
.yf-feat-lock { color: var(--dat); font-weight: 500; }
.yf-feat-btn { font-family: var(--sans); font-size: 10px; font-weight: 700; letter-spacing: -0.01em; background: var(--dat); color: var(--str) !important; padding: 8px 16px; margin-left: auto; white-space: nowrap; flex-shrink: 0; transition: background 0.15s; }
.yf-feat-btn:hover { background: var(--dat-b); }

/* Pulse panel — light background, dark header row */
.yf-pulse { padding: 26px 28px 26px 24px; display: flex; flex-direction: column; background: var(--bg); }
.yf-pulse-eyebrow { font-size: 7.5px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--dat); margin-bottom: 4px; }
.yf-pulse-title { font-size: 17px; font-weight: 800; color: var(--text); letter-spacing: -0.02em; margin-bottom: 2px; }
.yf-pulse-date { font-family: var(--mono); font-size: 9px; color: var(--td); margin-bottom: 16px; }
.yf-pulse-table-wrap { flex: 1; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.yf-pulse-table { width: 100%; border-collapse: separate; border-spacing: 0; }
.yf-pulse-table thead tr { background: var(--str); }
.yf-pulse-table th { font-size: 7.5px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(238,242,248,0.62); padding: 8px 8px 8px; text-align: left; white-space: nowrap; }
.yf-pulse-table th.r { text-align: right; }
.yf-pulse-table th.c { text-align: center; }
.yf-pulse-table td { padding: 6px 8px; vertical-align: middle; border-bottom: 1px solid var(--bors); background: var(--card); }
.yf-pulse-table tbody tr:last-child td { border-bottom: none; }
.yf-pulse-table tbody tr:hover td { background: var(--dat-l); }
.yf-pt-cat { font-size: 11.5px; color: var(--text); font-weight: 500; white-space: nowrap; }
.yf-pt-yv { font-family: var(--mono); font-size: 14px; font-weight: 500; color: var(--dat); text-align: right; white-space: nowrap; }
.yf-pt-yv.high { color: #b87000; } .yf-pt-yv.low { color: var(--tl); }
.yf-pt-mv { font-family: var(--mono); font-size: 10.5px; text-align: right; white-space: nowrap; }
.yf-pt-mv.p { color: var(--green); } .yf-pt-mv.n { color: var(--red); } .yf-pt-mv.f { color: var(--td); }
.yf-pt-rf { font-family: var(--mono); font-size: 10px; color: var(--tm); text-align: center; font-weight: 500; }
.yf-pt-note { font-size: 10.5px; color: var(--tm); line-height: 1.5; }
.yf-pill { font-size: 7.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; padding: 2px 6px; border: 1px solid currentColor; white-space: nowrap; }
.yf-pill.g { color: var(--green); } .yf-pill.a { color: var(--dat); } .yf-pill.s { color: var(--td); }
.yf-pulse-foot { font-size: 8.5px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--dat); text-align: right; margin-top: 12px; transition: color 0.15s; }
.yf-pulse-foot:hover { color: var(--dat-b); }
.yf-pulse-loading { font-size: 12px; color: var(--td); padding: 16px 8px; text-align: center; font-family: var(--mono); }
.yf-pulse-error { font-size: 12px; color: var(--tl); padding: 16px 8px; }

/* ══════════════════════════════════════
   ZONE 2 — Latest Analysis + Reviews (light)
══════════════════════════════════════ */
.yf-zone2 { border-bottom: 1px solid var(--bor); }
.yf-zone2-inner { display: grid; grid-template-columns: 58% 42%; max-width: var(--max-w); margin: 0 auto; }
.yf-latest { padding: 22px var(--pad); background: var(--card); border-right: 1px solid var(--bor); }
.yf-reviews { padding: 22px 24px; background: var(--bg); }
.yf-zone-hdr { font-size: 8px; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--tl); margin-bottom: 14px; padding-bottom: 9px; border-bottom: 1px solid var(--bor); display: flex; justify-content: space-between; align-items: center; }
.yf-zone-more { color: var(--dat); font-weight: 700; letter-spacing: 0.08em; font-size: 8px; transition: opacity 0.15s; }
.yf-zone-more:hover { opacity: 0.7; }

/* Article grid cards */
.yf-art-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 22px; }
.yf-art { padding: 10px 0; border-bottom: 1px solid var(--bors); }
.yf-art:nth-last-child(-n+2) { border-bottom: none; }
.yf-art-tag { font-size: 7.5px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--dat); display: block; margin-bottom: 4px; }
.yf-art-t { font-size: 13px; font-weight: 700; color: var(--text); line-height: 1.3; margin-bottom: 3px; letter-spacing: -0.01em; }
.yf-art-t a { color: inherit; transition: color 0.15s; }
.yf-art-t a:hover { color: var(--dat); }
.yf-art-x { font-size: 11px; color: var(--tl); line-height: 1.55; font-weight: 300; }
.yf-art-meta { font-family: var(--mono); font-size: 9px; color: var(--td); margin-top: 4px; }

/* Review cards */
.yf-rev { padding: 10px 0; border-bottom: 1px solid var(--bors); }
.yf-rev:last-child { border-bottom: none; padding-bottom: 0; }
.yf-rev-tag { font-size: 7.5px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--dat); display: block; margin-bottom: 3px; }
.yf-rev-t { font-size: 13px; font-weight: 700; color: var(--text); line-height: 1.3; letter-spacing: -0.01em; margin-bottom: 3px; }
.yf-rev-t a { color: inherit; transition: color 0.15s; }
.yf-rev-t a:hover { color: var(--dat); }
.yf-rev-x { font-size: 11px; color: var(--tl); line-height: 1.55; font-weight: 300; }
.yf-rev-meta { font-family: var(--mono); font-size: 9px; color: var(--td); margin-top: 4px; }

/* ══════════════════════════════════════
   ZONE 3 — Three columns
══════════════════════════════════════ */
.yf-zone3 { display: grid; grid-template-columns: repeat(3, 1fr); max-width: var(--max-w); margin: 0 auto; gap: 1px; background: var(--bor); border-top: 1px solid var(--bor); border-bottom: 1px solid var(--bor); }
.yf-col { background: var(--bg); padding: 20px 22px; }
.yf-col-hdr { font-size: 8px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--tl); margin-bottom: 12px; padding-bottom: 9px; border-bottom: 1px solid var(--bor); display: flex; justify-content: space-between; align-items: center; }
.yf-col-more { color: var(--dat); font-weight: 700; letter-spacing: 0.08em; transition: opacity 0.15s; }
.yf-col-more:hover { opacity: 0.7; }
.yf-ci { padding: 9px 0; border-bottom: 1px solid var(--bors); }
.yf-ci:last-child { border-bottom: none; padding-bottom: 0; }
.yf-ci-tag { font-size: 7.5px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--dat); display: block; margin-bottom: 3px; }
.yf-ci-t { font-size: 12.5px; font-weight: 700; color: var(--text); line-height: 1.3; letter-spacing: -0.01em; }
.yf-ci-t a { color: inherit; transition: color 0.15s; }
.yf-ci-t a:hover { color: var(--dat); }
.yf-ci-x { font-size: 10.5px; color: var(--tl); line-height: 1.5; font-weight: 300; margin-top: 2px; }
.yf-ci-meta { font-family: var(--mono); font-size: 9px; color: var(--td); margin-top: 3px; }

/* ══════════════════════════════════════
   CTA STRIP
══════════════════════════════════════ */
.yf-cta-strip { background: var(--str-b); padding: 16px var(--pad); display: flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--dbor); max-width: 100%; }
.yf-cta-strip-copy { }
.yf-cta-strip-title { font-size: 15px; font-weight: 800; color: var(--bone); letter-spacing: -0.02em; }
.yf-cta-strip-sub { font-size: 11px; color: rgba(238,242,248,0.35); font-weight: 300; margin-top: 2px; }
.yf-cta-strip-btn { font-size: 10.5px; font-weight: 700; letter-spacing: -0.01em; background: var(--dat); color: var(--str) !important; padding: 10px 22px; flex-shrink: 0; margin-left: 28px; transition: background 0.15s; white-space: nowrap; }
.yf-cta-strip-btn:hover { background: var(--dat-b); }

/* ══════════════════════════════════════
   POST / ARTICLE CARD (archive)
══════════════════════════════════════ */
.yf-post-card { background: var(--card); border: 1px solid var(--bor); overflow: hidden; transition: border-color 0.15s, box-shadow 0.15s; }
.yf-post-card:hover { border-color: var(--dat); box-shadow: var(--shadow); }
.yf-card-img { display: block; position: relative; aspect-ratio: 16/9; overflow: hidden; background: var(--bg2); }
.yf-card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s; }
.yf-post-card:hover .yf-card-img img { transform: scale(1.02); }
.yf-card-lock { position: absolute; bottom: 8px; right: 8px; background: rgba(14,22,32,0.85); color: var(--dat); font-size: 8.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; padding: 3px 7px; }
.yf-card-body { padding: 16px 18px 18px; }
.yf-card-tag { font-size: 8.5px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--dat); display: block; margin-bottom: 7px; }
.yf-card-title { font-size: 15px; font-weight: 700; color: var(--text); line-height: 1.3; margin-bottom: 8px; letter-spacing: -0.01em; }
.yf-card-title a:hover { color: var(--dat); }
.yf-card-excerpt { font-size: 12px; color: var(--tl); line-height: 1.6; margin-bottom: 12px; font-weight: 300; }
.yf-card-meta { display: flex; justify-content: space-between; font-family: var(--mono); font-size: 10px; color: var(--td); }

/* ══════════════════════════════════════
   ARCHIVE / PAGINATION
══════════════════════════════════════ */
.yf-archive { padding: 40px 0; }
.yf-post-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.yf-post-grid--3 { grid-template-columns: repeat(3, 1fr); }
.yf-pagination { display: flex; align-items: center; justify-content: center; gap: 16px; padding-top: 36px; margin-top: 36px; border-top: 1px solid var(--bor); }
.yf-page-btn { font-size: 11.5px; font-weight: 700; color: var(--dat); padding: 8px 16px; border: 1px solid var(--bor); transition: all 0.15s; }
.yf-page-btn:hover { background: var(--dat); color: var(--str); border-color: var(--dat); }
.yf-page-info { font-family: var(--mono); font-size: 11px; color: var(--td); }

/* ══════════════════════════════════════
   ARTICLE PAGES
══════════════════════════════════════ */
.yf-article-hdr { padding: 44px var(--pad) 32px; background: var(--card); border-bottom: 1px solid var(--bor); }
.yf-article-hdr .yf-inner { max-width: 760px; padding-left: 0; padding-right: 0; margin-left: auto; margin-right: auto; }
.yf-article-tag { font-size: 8.5px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--dat); display: block; margin-bottom: 10px; }
.yf-article-title { font-size: clamp(24px, 3.5vw, 38px); font-weight: 800; color: var(--text); line-height: 1.15; margin-bottom: 16px; letter-spacing: -0.03em; }
.yf-article-excerpt { font-size: 17px; color: var(--tl); line-height: 1.65; margin-bottom: 22px; font-weight: 300; }
.yf-article-meta { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding-top: 16px; border-top: 1px solid var(--bors); flex-wrap: wrap; }
.yf-author-wrap { display: flex; align-items: center; gap: 9px; }
.yf-author-img { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; border: 1px solid var(--bors); }
.yf-author-name { font-size: 12px; font-weight: 600; color: var(--text); }
.yf-article-meta-right { display: flex; align-items: center; gap: 10px; font-family: var(--mono); font-size: 10.5px; color: var(--td); }
.yf-article-image { border-bottom: 1px solid var(--bor); }
.yf-article-image img { width: 100%; max-height: 480px; object-fit: cover; }
.yf-article-image figcaption { font-size: 11.5px; color: var(--td); text-align: center; padding: 10px var(--pad); background: var(--bg2); }

/* Article content */
.yf-content { padding: 38px var(--pad) 52px; background: var(--card); }
.yf-content .yf-inner { max-width: 720px; padding-left: 0; padding-right: 0; margin-left: auto; margin-right: auto; }
.yf-content p { font-size: 16px; line-height: 1.8; color: var(--tm); margin-bottom: 22px; }
.yf-content h2 { font-size: clamp(20px, 2.5vw, 26px); font-weight: 800; color: var(--text); margin: 40px 0 14px; letter-spacing: -0.02em; }
.yf-content h3 { font-size: clamp(17px, 2vw, 21px); font-weight: 700; color: var(--text); margin: 32px 0 12px; letter-spacing: -0.02em; }
.yf-content h4 { font-size: 12.5px; font-weight: 700; color: var(--text); margin: 26px 0 10px; text-transform: uppercase; letter-spacing: 0.06em; }
.yf-content a { color: var(--dat); text-decoration: underline; }
.yf-content a:hover { color: var(--str); }
.yf-content strong { color: var(--text); font-weight: 700; }
.yf-content ul, .yf-content ol { padding-left: 20px; margin-bottom: 22px; }
.yf-content li { font-size: 16px; line-height: 1.75; margin-bottom: 7px; color: var(--tm); }
.yf-content blockquote { border-left: 2px solid var(--dat); padding: 4px 0 4px 20px; margin: 32px 0; font-size: 18px; color: var(--text); line-height: 1.65; font-style: italic; }
.yf-content hr { border: none; border-top: 1px solid var(--bors); margin: 40px 0; }
.yf-content table { width: 100%; border-collapse: collapse; margin-bottom: 26px; display: block; overflow-x: auto; }
.yf-content th { background: var(--str); color: var(--bone); padding: 9px 12px; text-align: left; font-size: 10px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; white-space: nowrap; }
.yf-content td { padding: 9px 12px; border-bottom: 1px solid var(--bors); font-size: 14px; color: var(--tm); }
.yf-content tr:nth-child(even) td { background: var(--bg); }
.yf-content img { border: 1px solid var(--bor); margin: 26px 0; }
.yf-article-footer { padding: 22px var(--pad); border-top: 1px solid var(--bors); background: var(--card); }
.yf-article-tags { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.yf-tag { display: inline-block; font-size: 11px; font-weight: 500; color: var(--tl); background: var(--bg2); border: 1px solid var(--bor); padding: 4px 11px; transition: all 0.15s; }
.yf-tag:hover { color: var(--dat); border-color: rgba(232,160,32,0.35); }

/* Paywall */
.yf-paywall { padding: 0 0 44px; }
.yf-paywall-inner { background: var(--str); padding: 36px 28px; text-align: center; border-left: 2px solid var(--dat); }
.yf-paywall-title { font-size: 20px; font-weight: 800; color: var(--bone); margin-bottom: 10px; letter-spacing: -0.02em; }
.yf-paywall-body { font-size: 13px; color: rgba(238,242,248,0.45); line-height: 1.65; margin-bottom: 22px; max-width: 380px; margin-left: auto; margin-right: auto; font-weight: 300; }
.yf-paywall-btns { display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: wrap; }

/* Buttons */
.yf-btn-primary { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: -0.01em; color: var(--str) !important; background: var(--dat); padding: 11px 22px; transition: background 0.15s; }
.yf-btn-primary:hover { background: var(--dat-b); }
.yf-btn-ghost { display: inline-block; font-size: 11px; font-weight: 500; color: rgba(238,242,248,0.45) !important; padding: 11px 16px; transition: color 0.15s; }
.yf-btn-ghost:hover { color: var(--bone) !important; }

/* Related */
.yf-related { padding: 40px 0; background: var(--bg); border-top: 1px solid var(--bor); }
.yf-related-hdr { font-size: 8px; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--tl); margin-bottom: 20px; padding-bottom: 10px; border-bottom: 1px solid var(--bor); }

/* ══════════════════════════════════════
   TAG / AUTHOR PAGES
══════════════════════════════════════ */
.yf-tag-hdr { background: var(--str); padding: 48px var(--pad) 44px; border-bottom: 1px solid var(--dbor); }
.yf-tag-eyebrow { font-size: 8px; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(232,160,32,0.65); margin-bottom: 10px; }
.yf-tag-title { font-size: clamp(26px, 4vw, 40px); font-weight: 800; color: var(--bone); margin-bottom: 10px; letter-spacing: -0.03em; }
.yf-tag-desc { font-size: 14px; color: rgba(238,242,248,0.42); max-width: 460px; line-height: 1.65; font-weight: 300; }
.yf-tag-count { font-family: var(--mono); font-size: 11px; color: rgba(238,242,248,0.28); margin-top: 14px; }
.yf-author-avatar { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; margin-bottom: 14px; border: 1px solid rgba(238,242,248,0.18); }

/* ══════════════════════════════════════
   STATIC PAGES
══════════════════════════════════════ */
.yf-page-hdr { padding: 48px var(--pad) 32px; background: var(--card); border-bottom: 1px solid var(--bor); }
.yf-page-title { font-size: clamp(26px, 3.5vw, 36px); font-weight: 800; color: var(--text); letter-spacing: -0.03em; }
.yf-page-excerpt { font-size: 15px; color: var(--tl); margin-top: 10px; line-height: 1.65; max-width: 480px; font-weight: 300; }

/* ══════════════════════════════════════
   PULSE FULL PAGE
══════════════════════════════════════ */
.yf-pulse-page-hdr { background: var(--str); padding: 44px var(--pad) 40px; border-bottom: 1px solid var(--dbor); }
.yf-pulse-page-title-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 0; flex-wrap: wrap; }
.yf-pulse-page-title { font-size: clamp(24px, 3vw, 36px); font-weight: 800; color: var(--bone); margin-bottom: 8px; letter-spacing: -0.03em; }
.yf-pulse-page-sub { font-size: 13px; color: rgba(238,242,248,0.42); line-height: 1.65; max-width: 500px; font-weight: 300; }
.yf-pulse-page-meta { text-align: right; flex-shrink: 0; }
.yf-pulse-page-date { font-size: 14px; font-weight: 700; color: var(--dat-b); font-family: var(--mono); }
.yf-pulse-page-note { font-size: 10px; color: rgba(238,242,248,0.28); margin-top: 3px; }
.yf-pulse-full-body { padding: 32px 0 48px; }
.yf-pulse-table--full { min-width: 680px; }

/* ── Full pulse page: light background overrides ── */
.yf-pulse-full-body .yf-pulse-table-wrap {
    background: var(--card);
    border: 1px solid var(--bor);
    overflow-x: auto; -webkit-overflow-scrolling: touch;
}
.yf-pulse-full-body .yf-pulse-table thead tr {
    background: var(--str);
    border-bottom: none;
}
.yf-pulse-full-body .yf-pulse-table th {
    color: rgba(238,242,248,0.62);
    border-bottom: none;
}
.yf-pulse-full-body .yf-pulse-table td {
    border-bottom: 1px solid var(--bors);
    background: var(--card);
}
.yf-pulse-full-body .yf-pulse-table tbody tr:last-child td { border-bottom: none; }
.yf-pulse-full-body .yf-pulse-table tbody tr:hover td { background: var(--dat-l); }

/* Column widths — explicit so nothing wraps or overlaps */
.yf-pulse-table--full colgroup { display: table-column-group; }
.yf-pulse-full-body .yf-pulse-table--full { table-layout: fixed; min-width: 860px; }
.yf-pulse-full-body .yf-pulse-table--full th:nth-child(1),
.yf-pulse-full-body .yf-pulse-table--full td:nth-child(1) { width: 220px; min-width: 220px; }
.yf-pulse-full-body .yf-pulse-table--full th:nth-child(2),
.yf-pulse-full-body .yf-pulse-table--full td:nth-child(2) { width: 72px; min-width: 72px; text-align: right; }
.yf-pulse-full-body .yf-pulse-table--full th:nth-child(3),
.yf-pulse-full-body .yf-pulse-table--full td:nth-child(3) { width: 72px; min-width: 72px; text-align: right; }
.yf-pulse-full-body .yf-pulse-table--full th:nth-child(4),
.yf-pulse-full-body .yf-pulse-table--full td:nth-child(4) { width: 72px; min-width: 72px; text-align: right; }
.yf-pulse-full-body .yf-pulse-table--full th:nth-child(5),
.yf-pulse-full-body .yf-pulse-table--full td:nth-child(5) { width: 80px; min-width: 80px; text-align: center; }
.yf-pulse-full-body .yf-pulse-table--full th:nth-child(6),
.yf-pulse-full-body .yf-pulse-table--full td:nth-child(6) { width: 90px; min-width: 90px; text-align: center; }
.yf-pulse-full-body .yf-pulse-table--full th:nth-child(7),
.yf-pulse-full-body .yf-pulse-table--full td:nth-child(7) { width: auto; min-width: 180px; }

/* Sticky first column */
.yf-pulse-full-body .yf-pulse-table thead th:first-child,
.yf-pulse-full-body .yf-pulse-table tbody td:first-child {
    position: sticky; left: 0; z-index: 2;
    border-right: 2px solid var(--bor);
    box-shadow: 3px 0 8px rgba(14,22,32,0.07);
}
.yf-pulse-full-body .yf-pulse-table thead th:first-child { background: var(--str); z-index: 3; }
.yf-pulse-full-body .yf-pulse-table tbody td:first-child { background: #ffffff; }
.yf-pulse-full-body .yf-pulse-table tbody tr:hover td:first-child { background: #f5f0e4; }

/* Cell text — these now inherit correctly from base styles */
.yf-pulse-full-body .yf-pt-cat { color: var(--text); font-weight: 500; white-space: normal; }
.yf-pulse-full-body .yf-pt-rf { color: var(--tm); font-weight: 500; }
.yf-pulse-full-body .yf-pt-note { color: var(--tm); }
.yf-pulse-loading-msg { font-size: 13px; color: var(--td); padding: 32px 0; }
.yf-pulse-err { font-size: 13px; color: var(--tl); padding: 18px; background: var(--card); border: 1px solid var(--bor); border-left: 2px solid var(--dat); }
.yf-pulse-disclaimer { margin-top: 12px; font-size: 10.5px; color: var(--tl); line-height: 1.65; padding: 12px 16px; background: var(--card); border: 1px solid var(--bor); border-left: 2px solid var(--dat); }
.yf-pulse-disclaimer strong { color: var(--text); }

/* ══════════════════════════════════════
   ERROR PAGE
══════════════════════════════════════ */
.yf-error { padding: 80px var(--pad); text-align: center; }
.yf-error-inner { max-width: 440px; margin: 0 auto; }
.yf-error-code { font-size: 80px; font-weight: 800; color: var(--bor); line-height: 1; margin-bottom: 16px; letter-spacing: -0.05em; }
.yf-error-title { font-size: 26px; font-weight: 800; color: var(--text); margin-bottom: 12px; letter-spacing: -0.02em; }
.yf-error-msg { font-size: 14px; color: var(--tl); line-height: 1.65; margin-bottom: 26px; font-weight: 300; }

/* ══════════════════════════════════════
   GHOST CARD CLASSES
══════════════════════════════════════ */
.kg-width-wide { position: relative; width: 85vw; min-width: 100%; margin: auto calc(50% - 42.5vw); max-width: 1200px; }
.kg-width-full { position: relative; width: 100vw; left: 50%; margin-left: -50vw; }
.kg-image-card { margin: 26px 0; }
.kg-image-card figcaption { font-size: 11.5px; color: var(--td); text-align: center; margin-top: 8px; }
.kg-gallery-container { display: flex; flex-direction: column; }
.kg-gallery-row { display: flex; justify-content: center; gap: 8px; margin-bottom: 8px; }
.kg-gallery-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.kg-bookmark-card { border: 1px solid var(--bor); overflow: hidden; margin: 22px 0; }
.kg-bookmark-container { display: flex; }
.kg-bookmark-content { padding: 16px; flex: 1; }
.kg-bookmark-title { font-weight: 700; color: var(--text); font-size: 14px; margin-bottom: 4px; }
.kg-bookmark-description { font-size: 12.5px; color: var(--tl); }
.kg-bookmark-thumbnail img { width: 120px; object-fit: cover; }
.kg-callout-card { display: flex; gap: 12px; padding: 16px; background: var(--dat-l); border-left: 2px solid var(--dat); margin: 22px 0; }
.kg-callout-text { font-size: 14px; color: var(--tm); line-height: 1.65; }
.kg-button-card { text-align: center; margin: 22px 0; }
.kg-button-card a { display: inline-block; background: var(--str); color: var(--bone); padding: 11px 24px; font-size: 11.5px; font-weight: 700; }
.kg-hr-card hr { border: none; border-top: 1px solid var(--bors); margin: 40px 0; }
.kg-code-card pre { background: var(--str); color: var(--bone); padding: 18px; overflow-x: auto; font-family: var(--mono); font-size: 13px; line-height: 1.6; }
.kg-header-card { padding: 44px var(--pad); text-align: center; background: var(--str); color: var(--bone); margin: 26px 0; }
.kg-header-card h2 { font-size: clamp(24px, 3vw, 32px); font-weight: 800; letter-spacing: -0.03em; }
.kg-video-card video { width: 100%; }

/* ══════════════════════════════════════
   FOOTER
══════════════════════════════════════ */
.gh-foot { background: var(--str); color: rgba(255,255,255,0.5); padding: 40px 0 24px; margin-top: 20px; }
.gh-foot-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-bottom: 30px; }
.gh-foot-col h6 { font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: rgba(255,255,255,0.85); margin-bottom: 10px; font-family: var(--sans); font-weight: 700; }
.gh-foot-col a { display: block; font-size: 12.5px; color: rgba(255,255,255,0.5); padding: 4px 0; transition: color 0.15s; }
.gh-foot-col a:hover { color: #fff; }
.gh-foot-disclaimer { font-size: 11.5px; line-height: 1.7; border-top: 1px solid rgba(255,255,255,0.1); padding-top: 20px; max-width: 900px; color: rgba(255,255,255,0.5); }
.gh-foot-bottom { font-size: 11px; margin-top: 14px; color: rgba(255,255,255,0.35); }

/* ══════════════════════════════════════
   RESPONSIVE — TABLET (≤1024px)
══════════════════════════════════════ */
@media (max-width: 1024px) {
    .yf-zone1-inner { grid-template-columns: 55% 45%; }
    .yf-zone2-inner { grid-template-columns: 55% 45%; }
    .yf-post-grid--3 { grid-template-columns: repeat(2, 1fr); }

}

/* ══════════════════════════════════════
   RESPONSIVE — MOBILE (≤768px)
══════════════════════════════════════ */
@media (max-width: 768px) {
    :root { --pad: 20px; }
    html { font-size: 15px; }

    /* Nav */
    .gh-burger { display: flex; }
    .gh-head-signin { display: none; }
    .gh-head-menu {
        display: none; position: fixed;
        top: 54px; left: 0; right: 0; bottom: 0;
        background: var(--str-b); z-index: 99;
        overflow-y: auto; padding: 16px 0 40px;
    }
    .gh-head-menu.is-open { display: block; }
    .gh-head-menu .nav { flex-direction: column; }
    .gh-head-menu .nav li a { display: block; padding: 14px var(--pad); font-size: 16px; color: rgba(238,242,248,0.6); border-right: none; border-bottom: 1px solid rgba(238,242,248,0.06); }
    .gh-head-menu .nav li a:hover { color: var(--bone); background: rgba(238,242,248,0.04); }

    /* Zone 1 */
    .yf-zone1-inner { grid-template-columns: 1fr; }
    .yf-feat { border-right: none; border-bottom: 1px solid var(--bor); padding-bottom: 24px; }
    .yf-pulse { padding: 20px var(--pad); }
    .yf-feat-title { font-size: clamp(20px, 6vw, 28px); }

    /* Zone 2 */
    .yf-zone2-inner { grid-template-columns: 1fr; }
    .yf-latest { border-right: none; border-bottom: 1px solid var(--bor); }
    .yf-art-grid { grid-template-columns: 1fr; }
    .yf-art:nth-last-child(-n+2) { border-bottom: 1px solid var(--bors); }
    .yf-art:last-child { border-bottom: none; }

    /* Zone 3 */
    .yf-zone3 { grid-template-columns: 1fr; }

    /* Grids */
    .yf-post-grid, .yf-post-grid--3 { grid-template-columns: 1fr; }

    /* CTA strip */
    .yf-cta-strip { flex-direction: column; align-items: flex-start; gap: 12px; padding: 20px var(--pad); }
    .yf-cta-strip-btn { margin-left: 0; }

    /* Paywall */
    .yf-paywall-btns { flex-direction: column; }

    /* Article */
    .yf-article-meta { flex-direction: column; align-items: flex-start; gap: 8px; }

    /* Pulse page */
    .yf-pulse-page-title-row { flex-direction: column; gap: 10px; }
    .yf-pulse-page-meta { text-align: left; }

    /* Footer */
    .gh-foot-grid { grid-template-columns: 1fr; }
}

/* ══════════════════════════════════════
   RESPONSIVE — SMALL MOBILE (≤480px)
══════════════════════════════════════ */
@media (max-width: 480px) {
    :root { --pad: 16px; }
    html { font-size: 14px; }
    .gh-logo-sub { display: none; }
    .gh-head-btn { font-size: 10px; padding: 6px 12px; }
    .yf-pulse-table-wrap { margin: 0 calc(-1 * var(--pad)); }
    .yf-feat-meta { flex-wrap: wrap; gap: 8px; }
    .yf-feat-btn { margin-left: 0; width: 100%; text-align: center; }
}

/* ── Touch devices ── */
@media (hover: none) {
    .yf-post-card:hover { border-color: var(--bor); box-shadow: none; }
    .yf-post-card:hover .yf-card-img img { transform: none; }
}

/* ── Print ── */
@media print {
    .gh-head, .yf-cta-strip, .yf-paywall, .gh-foot { display: none; }
    .yf-content { padding: 0; }
}

/* ══════════════════════════════════════
   NEWSPAPER HOMEPAGE — added for v4 redesign
   Matches bridge MVP design
══════════════════════════════════════ */



/* ── Layout ── */
.wrap { max-width: var(--max-w); margin: 0 auto; padding: 0 var(--pad); }

.main-grid {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 0;
    padding: 28px 0;
}
.main-col {
    padding-right: 36px;
    border-right: 1px solid var(--bor);
}
.rail { padding-left: 28px; }

/* ── Lead story ── */
.lead {
    padding-bottom: 24px;
    border-bottom: 1px solid var(--bor);
    margin-bottom: 22px;
}
.lead-tag {
    font-family: var(--mono);
    font-size: 10px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
    color: var(--card); background: var(--dat);
    padding: 3px 9px; border-radius: 2px;
    display: inline-block; margin-bottom: 10px;
}
.lead h1 {
    font-family: var(--serif);
    font-size: clamp(26px, 3vw, 36px);
    font-weight: 600; line-height: 1.15; color: var(--str);
    margin: 10px 0 12px;
}
.lead h1 a { color: inherit; }
.lead h1 a:hover { color: var(--dat); }
.lead-dek { font-size: 15px; color: var(--tl); max-width: 620px; margin-bottom: 10px; line-height: 1.65; }
.byline { font-family: var(--mono); font-size: 11px; color: var(--td); }

/* ── Story rows ── */
.story-row {
    display: flex; gap: 16px;
    padding: 16px 0; border-bottom: 1px solid var(--bors);
    align-items: flex-start;
}
.story-row:last-of-type { border-bottom: none; }
.story-tag {
    font-family: var(--mono); font-size: 9.5px; font-weight: 700;
    letter-spacing: 0.06em; text-transform: uppercase;
    color: var(--dat); flex-shrink: 0; width: 104px; padding-top: 3px;
}
.story-body { flex: 1; }
.story-body h3 {
    font-family: var(--serif); font-size: 17px; font-weight: 600;
    color: var(--str); line-height: 1.3; margin-bottom: 4px; font-style: normal;
}
.story-body h3 a { color: inherit; }
.story-body h3 a:hover { color: var(--dat); }
.story-body p { font-size: 13px; color: var(--tl); margin: 4px 0 6px; }

/* ── Recently Reviewed widget ── */
.widget {
    margin: 28px 0; border: 1px solid var(--bor);
    border-radius: 4px; overflow: hidden;
    box-shadow: 0 2px 10px rgba(12,26,52,0.05);
}
.widget-head {
    display: flex; justify-content: space-between; align-items: center;
    padding: 13px 16px; background: var(--str);
}
.widget-head h4 {
    font-family: var(--sans); font-size: 12px; font-weight: 700;
    color: #fff; text-transform: uppercase; letter-spacing: 0.05em;
}
.widget-head a { font-size: 11.5px; font-weight: 700; color: var(--dat-b); }
.rv-row {
    display: grid; grid-template-columns: 1fr 80px 70px;
    gap: 8px; align-items: center;
    padding: 10px 16px; border-bottom: 1px solid var(--bors); font-size: 12.5px;
}
.rv-row:nth-child(even) { background: var(--bg2); }
.rv-row:last-child { border-bottom: none; }
.rv-tick { font-family: var(--mono); font-weight: 700; color: var(--str); font-size: 12.5px; }
.rv-full { font-size: 10.5px; color: var(--td); display: block; }
.rv-date { font-family: var(--mono); font-size: 10.5px; color: var(--td); text-align: right; }
.rv-link { font-size: 11.5px; font-weight: 600; color: var(--dat); text-align: right; }

/* ── Headlines ── */
.headlines-title {
    font-size: 12px; font-weight: 700; color: var(--str);
    text-transform: uppercase; letter-spacing: 0.04em;
    margin: 28px 0 4px; padding-bottom: 10px;
    border-bottom: 2px solid var(--str);
}
.hl-row {
    display: flex; gap: 12px; align-items: center;
    padding: 10px 0; border-bottom: 1px solid var(--bors);
}
.hl-time { font-family: var(--mono); font-size: 10.5px; color: var(--td); width: 52px; flex-shrink: 0; }
.hl-tick {
    font-family: var(--mono); font-size: 10px; font-weight: 700;
    color: var(--dat); background: var(--dat-l); padding: 2px 6px;
    border-radius: 2px; flex-shrink: 0;
}
.hl-text { font-size: 13px; color: var(--tm); flex: 1; }
.hl-text:hover { color: var(--str); text-decoration: underline; }

/* ── Right rail ── */
.rail-block { margin-bottom: 26px; }
.rail-head {
    font-size: 11.5px; font-weight: 700; color: var(--str);
    text-transform: uppercase; letter-spacing: 0.05em;
    margin-bottom: 12px; padding-bottom: 10px;
    border-bottom: 2px solid var(--dat-b);
}

/* Quick takes */
.qt-item { padding: 10px 0; border-bottom: 1px solid var(--bors); }
.qt-item:last-child { border-bottom: none; }
.qt-top { display: flex; gap: 8px; align-items: center; margin-bottom: 3px; }
.qt-date { font-family: var(--mono); font-size: 10px; color: var(--td); }
.qt-tick {
    font-family: var(--mono); font-size: 10px; font-weight: 700;
    color: var(--str); background: var(--bg2); padding: 1px 6px; border-radius: 2px;
}
.qt-text { font-size: 12.5px; color: var(--tm); line-height: 1.5; }

/* Side boxes */
.side-box {
    background: var(--card); border: 1px solid var(--bor);
    border-top: 3px solid var(--dat-b); border-radius: 4px; padding: 16px;
}
.side-box h5 { font-family: var(--sans); font-size: 14.5px; font-weight: 700; color: var(--str); margin-bottom: 6px; }
.side-box p { font-size: 12.5px; color: var(--tl); margin-bottom: 10px; }
.side-box a.go { font-size: 11.5px; font-weight: 700; color: var(--dat); }
.side-box a.go:hover { color: var(--dat-b); }

/* Subscribe box */
.sub-box {
    background: var(--str); border-radius: 4px; padding: 18px; color: #fff;
    background-image: radial-gradient(ellipse at bottom left, rgba(232,160,32,0.14), transparent 60%);
}
.sub-box h5 { font-family: var(--sans); font-size: 15px; font-weight: 700; margin-bottom: 6px; }
.sub-box p { font-size: 12px; color: rgba(255,255,255,0.65); margin-bottom: 12px; }
.sub-box ul { list-style: none; margin-bottom: 12px; }
.sub-box li { font-size: 11.5px; color: rgba(255,255,255,0.75); padding: 3px 0 3px 16px; position: relative; }
.sub-box li::before { content: '✓'; position: absolute; left: 0; color: var(--dat-b); font-weight: 700; }
.sub-box .btn {
    display: block; text-align: center; background: var(--dat-b);
    color: var(--str); font-size: 12.5px; font-weight: 700;
    padding: 9px; border-radius: var(--r);
}
.sub-box .btn:hover { background: #fbb63e; }
.sub-box .fine { font-size: 10.5px; color: rgba(255,255,255,0.4); margin-top: 8px; text-align: center; }

/* Verdict badges */
.verdict { font-size: 9.5px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; padding: 3px 9px; border-radius: 3px; }
.v-hold { background: #fffbeb; color: #b45309; border: 1px solid #fde68a; }
.v-buy  { background: var(--grn-bg); color: var(--green); border: 1px solid #bbf7d0; }
.v-avoid { background: var(--red-bg); color: var(--red); border: 1px solid #fecaca; }

/* Pulse in rail — no horizontal scroll */
.rail .yf-pulse-date { font-family: var(--mono); font-size: 10px; color: var(--td); margin-bottom: 10px; display: block; }
.rail .yf-pulse-foot { font-size: 11px; font-weight: 600; color: var(--dat); display: block; margin-top: 10px; text-align: right; }
.rail .yf-pulse-foot:hover { color: var(--dat-b); }
.rail .yf-pulse-table-wrap { overflow-x: hidden; width: 100%; }
.rail .yf-pulse-table { width: 100%; table-layout: fixed; border: 1px solid var(--bor); }
.rail .yf-pulse-table th { white-space: normal; font-size: 7px; padding: 6px; }
.rail .yf-pulse-table td { padding: 5px 6px; }
.rail .yf-pulse-table th:first-child,
.rail .yf-pulse-table td:first-child { width: 55%; }
.rail .yf-pulse-table th:nth-child(2),
.rail .yf-pulse-table td:nth-child(2) { width: 25%; }
.rail .yf-pulse-table th:nth-child(3),
.rail .yf-pulse-table td:nth-child(3) { width: 20%; }
.rail .yf-pt-cat { font-size: 11px; white-space: normal; word-break: break-word; }
.rail .yf-pt-yv { font-size: 12px; }
.rail .yf-pt-mv { font-size: 10px; }

/* Masthead nav update */
.gh-logo-name { font-family: var(--serif) !important; font-size: 19px !important; font-weight: 700 !important; }

/* ── Responsive ── */
@media (max-width: 900px) {
    .main-grid { grid-template-columns: 1fr; }
    .main-col { border-right: none; padding-right: 0; }
    .rail { padding-left: 0; margin-top: 20px; }
    .rv-row { grid-template-columns: 1fr 60px; }
}
@media (max-width: 600px) {
    .story-row { flex-direction: column; gap: 6px; }
    .story-tag { width: auto; }
    .wrap { padding: 0 18px; }
}