/* global link color (no browser-default purple) */
a { color: var(--gold-dark, #a78a52); }
.ed-side-all { color: var(--gold-dark, #a78a52) !important; }
/* ─────────────────────────────────────────────────────────────────────
   pages.css — interior-page extensions to home.css
   Tokens, fonts, and shared components live in home.css; this file only
   adds the components specific to interior pages.
   ───────────────────────────────────────────────────────────────────── */

/* ─── Page hero (compact dark band, transparent nav floats over it) ── */
.page-hero {
    position: relative;
    min-height: clamp(200px, 26vw, 320px);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding: clamp(3.6rem, 6vw, 5rem) clamp(1rem, 3vw, 2rem) clamp(1.6rem, 3vw, 2.4rem);
    background: linear-gradient(135deg, var(--navy) 0%, var(--navy-light) 40%, var(--slate) 100%);
}
.page-hero h1 { margin-bottom: 0.6rem !important; }
.page-hero .lede { font-size: clamp(0.78rem, 0.95vw, 0.9rem) !important; }
.page-hero-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 35%;
    opacity: 0.42;
    pointer-events: none;
    user-select: none;
    -webkit-user-drag: none;
}
.hero img, .page-hero img {
    pointer-events: none;
    user-select: none;
    -webkit-user-drag: none;
}
.page-hero::after {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse at 85% 15%, rgba(201,169,110,0.10) 0%, transparent 50%),
        radial-gradient(ellipse at 15% 100%, rgba(201,169,110,0.05) 0%, transparent 55%),
        linear-gradient(180deg, rgba(12,24,41,0.42) 0%, rgba(12,24,41,0.88) 100%);
    pointer-events: none;
}
.page-hero-inner {
    position: relative;
    z-index: 2;
    text-align: center;
    max-width: 760px;
    margin: 0 auto;
}
.page-hero .hero-label {
    justify-content: center;
    margin-bottom: 0.6rem !important;  /* was 2rem; pulls eyebrow down toward the H1 */
}
.page-hero h1 {
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(1.9rem, 4.2vw, 3.4rem);
    font-weight: 400;
    color: var(--white);
    line-height: 1.15;
    letter-spacing: -0.01em;
    margin-bottom: 1.1rem;
}
.page-hero h1 strong {
    font-weight: 600;
    color: var(--gold-light);
    font-style: italic;
}
.page-hero .lede {
    font-size: clamp(0.82rem, 1vw, 0.95rem);
    color: rgba(255,255,255,0.72);
    line-height: 1.75;
    max-width: 620px;
    margin: 0 auto;
}

/* ─── Generic content section ─── */
.section {
    padding: 5rem 4rem;
    background: var(--white);
}
.section.alt {
    background:
        radial-gradient(ellipse at top right, rgba(201,169,110,0.05) 0%, transparent 50%),
        linear-gradient(180deg, var(--cream) 0%, var(--cream-dark) 100%);
}
.section.dark { background: var(--navy); color: rgba(255,255,255,0.85); }

/* ─── Career timeline — centred spine, strict left/right alternation.
       Both sides of the line are used at the same time so the visible
       length is roughly half a single-column stack. ─── */
.timeline-compact {
    max-width: 1180px;
    margin: 2.5rem auto 0;
    padding: 0 2rem;
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 3rem;
    row-gap: 1.4rem;
    position: relative;
}
/* The spine */
.timeline-compact::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 0.4rem;
    bottom: 0.4rem;
    width: 1px;
    background: rgba(201,169,110,0.35);
    transform: translateX(-0.5px);
}
.tlc-item {
    background: var(--white);
    border: 1px solid rgba(201,169,110,0.18);
    border-radius: 4px;
    padding: 1.4rem 1.4rem 1.6rem;
    position: relative;
    transition: all 0.25s;
}
.tlc-item:hover {
    border-color: var(--gold);
    box-shadow: 0 14px 30px -22px rgba(12,24,41,0.28);
    transform: translateY(-2px);
}
/* Odd rows sit on the left of the spine; even on the right. nth-child
   ignores the tlc-left/tlc-right HTML hints and strictly alternates so
   both columns are populated every row. */
.tlc-item:nth-child(odd) {
    grid-column: 1;
    border-right: 3px solid var(--gold);
    text-align: right;
}
.tlc-item:nth-child(even) {
    grid-column: 2;
    border-left: 3px solid var(--gold);
}
/* Spine connector dot — gold disc sitting on the centre line, aligned
   with the year label of each card. */
.tlc-item::after {
    content: '';
    position: absolute;
    top: 1.5rem;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--gold);
    border: 2px solid var(--off);
    box-shadow: 0 0 0 1px rgba(201,169,110,0.35);
}
.tlc-item:nth-child(odd)::after  { right: calc(-1.5rem - 5px); }
.tlc-item:nth-child(even)::after { left:  calc(-1.5rem - 5px); }
.tlc-year {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--gold-dark);
    letter-spacing: 0.04em;
    margin-bottom: 0.4rem;
}
.tlc-title {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--navy);
    line-height: 1.25;
    margin-bottom: 0.5rem;
}
.tlc-item p {
    font-size: 0.78rem;
    color: var(--text-body);
    line-height: 1.65;
    margin: 0;
}
/* Mobile — collapse to single column with the spine on the left. */
@media (max-width: 760px) {
    .timeline-compact {
        grid-template-columns: 1fr;
        column-gap: 0;
        padding: 0 1rem 0 2.6rem;
    }
    .timeline-compact::before { left: 1rem; }
    .tlc-item:nth-child(odd),
    .tlc-item:nth-child(even) {
        grid-column: 1;
        text-align: left;
        border-right: 0;
        border-left: 3px solid var(--gold);
    }
    .tlc-item:nth-child(odd)::after,
    .tlc-item:nth-child(even)::after {
        left: calc(-1.6rem - 5px);
        right: auto;
    }
}

.section-head {
    text-align: center;
    max-width: 720px;
    margin: 0 auto 3.5rem;
}
.section-head .section-tag {
    justify-content: center;
}
.section-head h2 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 2.4rem;
    font-weight: 600;
    color: var(--navy);
    margin: 0.5rem 0 0.8rem;
    line-height: 1.2;
}
.section.dark .section-head h2 { color: var(--white); }
.section-head h2 strong { color: var(--gold-dark); font-weight: 700; }
.section.dark .section-head h2 strong { color: var(--gold-light); }
.section-head .lede {
    font-size: 0.95rem;
    color: var(--text-light);
    line-height: 1.8;
}
.section.dark .section-head .lede { color: rgba(255,255,255,0.55); }

/* Two-column hero-style layout (photo + text) — bare version of about-section */
.split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: 520px;
}
.split-image {
    background: linear-gradient(135deg, var(--cream), var(--cream-dark));
    position: relative;
    overflow: hidden;
}
.split-image img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
}
.split-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 4rem 4rem 4rem 3rem;
}
.split-content h2 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 2.4rem;
    font-weight: 600;
    color: var(--navy);
    line-height: 1.2;
    margin-bottom: 1.2rem;
}
.split-content h2 strong { color: var(--gold-dark); font-weight: 700; }
.split-content p {
    font-size: 0.95rem;
    color: var(--text-body);
    margin-bottom: 1rem;
    line-height: 1.8;
}

/* ─── Career timeline ─── */
.timeline {
    max-width: 820px;
    margin: 0 auto;
    position: relative;
    padding-left: 2rem;
}
.timeline::before {
    content: '';
    position: absolute;
    left: 0;
    top: 12px;
    bottom: 12px;
    width: 1px;
    background: linear-gradient(180deg, transparent, var(--gold) 8%, var(--gold) 92%, transparent);
}
.tl-item {
    position: relative;
    padding: 0 0 2.5rem 2.5rem;
}
.tl-item:last-child { padding-bottom: 0; }
.tl-item::before {
    content: '';
    position: absolute;
    left: -5px;
    top: 0.4rem;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--white);
    border: 2px solid var(--gold);
}
.tl-year {
    font-size: 0.7rem;
    color: var(--gold-dark);
    text-transform: uppercase;
    letter-spacing: 0.18em;
    font-weight: 700;
    margin-bottom: 0.4rem;
}
.tl-title {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.3rem;
    font-weight: 600;
    color: var(--navy);
    margin-bottom: 0.4rem;
    line-height: 1.3;
}
.tl-desc {
    font-size: 0.88rem;
    color: var(--text-body);
    line-height: 1.75;
}

/* ─── Feature grid (2-up philosophy/principle cards on cream) ─── */
.feature-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    max-width: 1100px;
    margin: 0 auto;
}
.feature-grid.cols-2 { grid-template-columns: repeat(2, 1fr); max-width: 880px; }
.feature-card {
    background: var(--cream);
    padding: 2rem 1.8rem;
    border-radius: 4px;
    border: 1px solid transparent;
    position: relative;
    transition: all 0.4s;
    overflow: hidden;
}
.feature-card:hover {
    background: var(--white);
    border-color: var(--gold);
    transform: translateY(-4px);
    box-shadow: 0 12px 30px rgba(0,0,0,0.06);
}
.feature-card::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: var(--gold);
    transform: scaleX(0);
    transition: transform 0.4s;
}
.feature-card:hover::before { transform: scaleX(1); }
.feature-num {
    font-family: 'Cormorant Garamond', serif;
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--gold-dark);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 0.8rem;
    display: block;
}
.feature-card h3 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.3rem;
    font-weight: 600;
    color: var(--navy);
    margin-bottom: 0.6rem;
    line-height: 1.3;
}
.feature-card p {
    font-size: 0.85rem;
    color: var(--text-body);
    line-height: 1.7;
}

/* ─── List rows (papers, media items, updates) ─── */
.list-rows {
    max-width: 920px;
    margin: 0 auto;
}
.list-row {
    display: grid;
    grid-template-columns: 120px 1fr auto;
    gap: 2rem;
    align-items: center;
    padding: 1.6rem 0;
    border-bottom: 1px solid #e8e3db;
    transition: background 0.3s;
}
.list-row:hover { background: var(--cream); padding-left: 1rem; padding-right: 1rem; }
.list-row .row-meta {
    font-size: 0.7rem;
    color: var(--gold-dark);
    text-transform: uppercase;
    letter-spacing: 0.15em;
    font-weight: 700;
}
.list-row .row-title {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.15rem;
    font-weight: 600;
    color: var(--navy);
    line-height: 1.4;
    margin-bottom: 0.3rem;
}
.list-row .row-sub {
    font-size: 0.82rem;
    color: var(--text-light);
    line-height: 1.6;
}
.list-row .row-action {
    font-size: 0.7rem;
    color: var(--gold-dark);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

/* ─── Profile cards (colleagues) ─── */
.profile-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 360px));
    justify-content: center;
    gap: 2rem;
    max-width: 1100px;
    margin: 0 auto;
}
.profile-card {
    background: var(--white);
    border: 1px solid #e8e3db;
    border-radius: 4px;
    overflow: hidden;
    transition: all 0.4s;
}
.profile-card:hover {
    border-color: var(--gold);
    transform: translateY(-4px);
    box-shadow: 0 12px 30px rgba(0,0,0,0.06);
}
.profile-photo {
    aspect-ratio: 4/3;
    background: linear-gradient(135deg, var(--cream), var(--cream-dark));
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    position: relative;
}
.profile-photo .initials {
    font-family: 'Cormorant Garamond', serif;
    font-size: 3rem;
    color: var(--gold);
    font-weight: 600;
}
.profile-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.profile-body {
    padding: 1.5rem;
}
.profile-name {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--navy);
    margin-bottom: 0.2rem;
    line-height: 1.3;
}
.profile-role {
    font-size: 0.72rem;
    color: var(--gold-dark);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-weight: 600;
    margin-bottom: 0.8rem;
}
.profile-bio {
    font-size: 0.82rem;
    color: var(--text-body);
    line-height: 1.7;
    margin-bottom: 1rem;
}
.profile-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.profile-tags span {
    font-size: 0.65rem;
    padding: 4px 10px;
    background: var(--cream);
    color: var(--navy);
    border: 1px solid #e8e3db;
    letter-spacing: 0.04em;
    font-weight: 600;
}

/* ─── Prose / article body ─── */
.prose {
    max-width: 720px;
    margin: 0 auto;
    font-size: 0.95rem;
    color: var(--text-body);
    line-height: 1.85;
}
.prose h2 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 2rem;
    font-weight: 600;
    color: var(--navy);
    margin: 2.5rem 0 1rem;
    line-height: 1.25;
}
.prose h3 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.4rem;
    font-weight: 600;
    color: var(--navy);
    margin: 2rem 0 0.8rem;
}
.prose p { margin-bottom: 1.2rem; }
.prose ul, .prose ol {
    margin: 1rem 0 1.5rem 1.5rem;
}
.prose li { margin-bottom: 0.5rem; }
.prose blockquote {
    border-left: 3px solid var(--gold);
    padding: 0.5rem 0 0.5rem 1.5rem;
    margin: 1.5rem 0;
    font-style: italic;
    color: var(--text-dark);
}
.prose a { color: var(--gold-dark); font-weight: 600; }

/* ─── Anchor / chip nav (specialisms, conditions) ─── */
.anchor-bar {
    background: var(--cream);
    border-bottom: 1px solid #e8e3db;
    padding: 1.4rem 2rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    justify-content: center;
}
.anchor-bar a {
    font-size: 0.66rem;
    color: var(--text-dark);
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    font-weight: 600;
    padding: 9px 18px;
    border: 1px solid var(--gold);
    border-radius: 100px;
    background: transparent;
    transition: all 0.25s ease;
    white-space: nowrap;
}
.anchor-bar a:hover {
    color: var(--white);
    background: var(--gold);
    border-color: var(--gold);
}

/* ─── Detail block (specialism, condition deep section) ─── */
.detail-block {
    max-width: 1100px;
    margin: 0 auto;
    padding: 3rem 0;
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 3rem;
    align-items: start;
    border-bottom: 1px solid #e8e3db;
}
.detail-block:last-child { border-bottom: none; }
.detail-side .section-tag { margin-top: 0.6rem; margin-bottom: 0; }
.detail-side h3 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.7rem;
    font-weight: 600;
    color: var(--navy);
    line-height: 1.2;
    margin-bottom: 0.4rem;
}
.detail-img {
    width: 160px;
    height: 160px;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 6px;
    box-shadow: 0 8px 24px -14px rgba(12,24,41,0.35);
    display: block;
}
.detail-side-img {
    width: 100%;
    max-width: 280px;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    border-radius: 4px;
    margin-top: 1rem;
    box-shadow: 0 12px 28px -20px rgba(12,24,41,0.35);
    display: block;
}

/* ─── Detail grid (2-up card layout — used on specialisms) ─── */
.detail-grid {
    max-width: 1180px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
}
.detail-grid .detail-block {
    max-width: none;
    margin: 0;
    padding: 2.2rem 2rem;
    display: block;
    border: 1px solid #e8e3db;
    border-radius: 8px;
    background: var(--white);
    transition: box-shadow 0.3s, transform 0.3s;
}
.detail-grid .detail-block:hover {
    box-shadow: 0 18px 50px -28px rgba(12,24,41,0.25);
    transform: translateY(-2px);
}
.detail-grid .detail-side {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.4rem;
    flex-wrap: wrap;
}
.detail-grid .detail-side .detail-img {
    width: 64px;
    height: 64px;
    flex-shrink: 0;
    margin-top: 0;
}
.detail-grid .detail-side .detail-num {
    width: 64px;
    height: 64px;
    flex-shrink: 0;
    border: 1px solid var(--gold);
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Cormorant Garamond', serif;
    font-size: 2rem;
    font-weight: 600;
    color: var(--gold-dark);
    background: linear-gradient(135deg, #fbf8f1 0%, #f5efe2 100%);
}
.detail-grid .detail-side .detail-side-text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.35rem;
    flex: 1;
    min-width: 0;
}
.detail-grid .detail-side h3 {
    margin-bottom: 0;
    font-size: 1.5rem;
}
.detail-grid .detail-side .section-tag {
    margin-bottom: 0;
    flex-shrink: 0;
}
.detail-grid .detail-side .section-tag span {
    font-size: 0.58rem;
}
.detail-grid .detail-body p {
    font-size: 0.92rem;
    line-height: 1.8;
}
.detail-grid .detail-body ul {
    font-size: 0.88rem;
    line-height: 1.75;
}
.detail-body p {
    font-size: 0.95rem;
    color: var(--text-body);
    line-height: 1.8;
    margin-bottom: 1rem;
}
.detail-body ul {
    margin: 1rem 0 0 1.2rem;
    color: var(--text-body);
    font-size: 0.9rem;
    line-height: 1.8;
}
.detail-body li { margin-bottom: 0.4rem; }

/* ─── Form elements (contact, book) ─── */
.form-grid {
    max-width: 720px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.2rem;
}
.form-grid .full { grid-column: 1 / -1; }
.form-grid label {
    display: block;
    font-size: 0.7rem;
    color: var(--gold-dark);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-weight: 700;
    margin-bottom: 0.5rem;
}
.form-grid input,
.form-grid select,
.form-grid textarea {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid #e8e3db;
    background: var(--white);
    font-family: 'Inter', sans-serif;
    font-size: 0.9rem;
    color: var(--text-dark);
    border-radius: 4px;
    transition: border-color 0.3s;
}
.form-grid input:focus,
.form-grid select:focus,
.form-grid textarea:focus {
    outline: none;
    border-color: var(--gold);
}
.form-grid textarea { min-height: 140px; resize: vertical; }
.form-actions { grid-column: 1 / -1; text-align: center; margin-top: 1rem; }

/* ─────────────────────────────────────────────────────────────────────
   Latest publications featured strip (publications.html top)
   ───────────────────────────────────────────────────────────────────── */
.latest-pubs-section { background: var(--cream); }
.latest-pubs-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.2rem;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 2rem;
}
.latest-pub-card {
    display: flex;
    flex-direction: column;
    background: var(--white);
    border: 1px solid #e8e3db;
    border-top: 3px solid var(--gold);
    border-radius: 4px;
    padding: 1.3rem 1.2rem 1.4rem;
    color: var(--navy);
    text-decoration: none;
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}
.latest-pub-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 22px rgba(12,24,41,0.08);
    border-top-color: var(--gold-dark);
}
.latest-pub-card .lpc-meta {
    font-size: 0.6rem;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: #6b7280;
    font-weight: 600;
    margin-bottom: 0.5rem;
}
.latest-pub-card .lpc-tag {
    display: inline-block;
    font-size: 0.55rem;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    font-weight: 700;
    color: var(--gold-dark);
    background: rgba(201,169,110,0.10);
    padding: 3px 8px;
    border-radius: 2px;
    align-self: flex-start;
    margin-bottom: 0.7rem;
}
.latest-pub-card h3 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.15rem;
    line-height: 1.25;
    font-weight: 500;
    color: var(--navy);
    margin: 0 0 0.6rem;
}
.latest-pub-card p {
    font-size: 0.82rem;
    line-height: 1.5;
    color: #4b5563;
    margin: 0 0 0.9rem;
    flex: 1;
}
.latest-pub-card .lpc-link {
    font-size: 0.62rem;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    font-weight: 700;
    color: var(--gold-dark);
}
.latest-pub-card:hover .lpc-link { color: var(--navy); }
@media (max-width: 1100px) {
    .latest-pubs-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
    .latest-pubs-grid { grid-template-columns: 1fr; padding: 0 1rem; }
}

/* Home page — 3-up version of the same card */
.recent-pubs-home-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.2rem;
}
@media (max-width: 900px) {
    .recent-pubs-home-grid { grid-template-columns: 1fr; }
    /* Hide the "THE LONDON CLINIC · OS CLINIC · CROMWELL HOSPITAL" eyebrow on inner-page heroes — too long for mobile and breaks the layout */
    .page-hero .hero-label { display: none !important; }
}

/* ─────────────────────────────────────────────────────────────────────
   OS Clinic events strip — 5 candid photos at desktop, 3 tablet, 2 mobile
   ───────────────────────────────────────────────────────────────────── */
.events-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 1rem;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 2rem;
}
.event-card {
    margin: 0;
    background: var(--white);
    border: 1px solid #e8e3db;
    border-radius: 4px;
    overflow: hidden;
    transition: transform 0.35s ease, box-shadow 0.35s ease;
}
.event-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 18px rgba(12,24,41,0.08);
}
.event-card img {
    width: 100%;
    height: 180px;
    object-fit: cover;
    display: block;
}
.event-card figcaption {
    padding: 0.7rem 0.85rem 0.85rem;
    font-size: 0.62rem;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: #6b7280;
    text-align: center;
    font-weight: 600;
}
@media (max-width: 1100px) {
    .events-strip { grid-template-columns: repeat(3, 1fr); }
    .events-strip .event-card:nth-child(n+4) { display: none; }
}
@media (max-width: 700px) {
    .events-strip { grid-template-columns: repeat(2, 1fr); gap: 0.7rem; padding: 0 1rem; }
    .events-strip .event-card:nth-child(n+3) { display: none; }
    .event-card img { height: 150px; }
}

/* ─── Tablet (mid-collapse to 2-col where appropriate) ─── */
@media (max-width: 1100px) {
    .feature-grid, .profile-grid, .pub-grid, .research-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ─── Mobile ─── */
@media (max-width: 900px) {
    .page-hero { padding: 5rem 1.25rem 3rem; min-height: 280px; }
    .page-hero h1 { font-size: 2.4rem; word-wrap: break-word; overflow-wrap: break-word; }
    .page-hero .lede { font-size: 0.88rem; word-wrap: break-word; overflow-wrap: break-word; }
    .section { padding: 3rem 1.5rem; }
    .section-head h2 { font-size: 1.8rem; }
    .split { grid-template-columns: 1fr; }
    .split-image { min-height: 320px; }
    .split-content { padding: 2.5rem 1.5rem; }
    .feature-grid, .feature-grid.cols-2 { grid-template-columns: 1fr; }
    .profile-grid { grid-template-columns: 1fr; }
    .list-row { grid-template-columns: 1fr; gap: 0.4rem; }
    .list-row .row-meta { font-size: 0.65rem; }
    .list-row .row-action { justify-self: start; }
    .detail-block { grid-template-columns: 1fr; gap: 1.5rem; }
    .detail-grid { grid-template-columns: 1fr; gap: 1.2rem; }
    .detail-grid .detail-block { padding: 1.6rem 1.2rem; }
    .form-grid { grid-template-columns: 1fr; }
    .timeline { padding-left: 1.2rem; }
    .tl-item { padding-left: 1.5rem; }
}

@media (max-width: 600px) {
    .page-hero { padding: 4.5rem 1rem 2.5rem; }
    .page-hero h1 { font-size: 1.95rem; line-height: 1.2; }
    .page-hero .lede { font-size: 0.82rem; }
    .page-hero h1 strong { font-size: 1em; }
    /* Long body strings with strong/em ought to wrap */
    .lede strong, p strong { word-wrap: break-word; overflow-wrap: break-word; }
    /* Stats band: 2-up at narrow widths */
    .channel-stats { padding: 1.6rem 1rem; }
    .channel-stats-inner { grid-template-columns: repeat(2, 1fr); gap: 1.4rem 1rem; }
    .cs-item .num { font-size: 2rem; }
    .cs-item .lab { font-size: 0.55rem; }
    /* Section padding tightening */
    .section { padding: 2.5rem 1rem; }
    .section-head h2 { font-size: 1.55rem; }
    /* Testimonial / library / spec card grids stack */
    .testimonial-row { grid-template-columns: 1fr; }
    .lib-grid { grid-template-columns: 1fr !important; padding: 0 0.5rem; }
    .spec-cards { grid-template-columns: 1fr; }
    .timeline-compact { grid-template-columns: 1fr; padding: 0 0.5rem; }
    .feature-grid { grid-template-columns: 1fr; }
}
@media (max-width: 380px) {
    .page-hero { padding: 4.2rem 0.8rem 2.2rem; }
    .page-hero h1 { font-size: 1.6rem; }
    .page-hero .lede { font-size: 0.78rem; }
    .section { padding: 2.2rem 0.8rem; }
    .section-head h2 { font-size: 1.4rem; }
    .anchor-bar { padding: 1rem 0.6rem; gap: 0.4rem; }
    .anchor-bar a { padding: 7px 12px; font-size: 0.6rem; letter-spacing: 0.1em; }
    .credential-bar { gap: 0.8rem; padding: 1rem 0.4rem; }
    .credential-mark .mark { width: 42px; height: 42px; }
    .credential-mark .label { font-size: 0.52rem; }
}

/* ─────────────────────────────────────────────────────────────────────
   Credential bar (sits under trust-bar, shows institution monograms)
   ───────────────────────────────────────────────────────────────────── */
.credential-bar {
    background: var(--white);
    border-bottom: 1px solid #e8e3db;
    padding: 1.6rem 2rem;
    display: flex;
    flex-wrap: wrap;
    gap: 2.2rem;
    justify-content: center;
    align-items: center;
}
.credential-mark {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    text-decoration: none;
    color: var(--text-light);
    transition: color 0.3s;
}
.credential-mark:hover { color: var(--gold-dark); }
.credential-mark .mark {
    width: 56px; height: 56px;
    border-radius: 50%;
    border: 1.5px solid var(--gold);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Cormorant Garamond', serif;
    font-weight: 700;
    color: var(--navy);
    background: var(--cream);
    transition: all 0.3s;
}
.credential-mark .mark.sm { font-size: 0.78rem; letter-spacing: 0.03em; }
.credential-mark .mark.md { font-size: 0.95rem; letter-spacing: 0.02em; }
.credential-mark:hover .mark {
    background: var(--gold);
    color: var(--white);
    border-color: var(--gold);
}
.credential-mark .mark.is-logo { background: var(--white); padding: 6px; overflow: hidden; display: flex; align-items: center; justify-content: center; }
.credential-mark .mark.is-logo img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; object-position: center center; display: block; margin: auto; }
/* Text monogram fallback for marks whose source SVGs don't crop cleanly into a circle (AO landscape lockup, Churchill stacked wordmark). */
.credential-mark .mark.is-mono { background: var(--white); color: var(--navy); font-family: 'Cormorant Garamond', serif; font-weight: 600; font-size: 1.55rem; letter-spacing: 0.04em; line-height: 1; }
.credential-mark:hover .mark.is-mono { background: var(--gold); color: var(--white); border-color: var(--gold); }
/* Per-logo scaling so the visual weight inside each circle reads consistently across landscape (AO), stacked (WCMT), and square marks. */
.credential-mark .mark.is-logo img[src*="ao.svg"] { transform: scale(0.4); transform-origin: center center; filter: brightness(0); }
.credential-mark .mark.is-logo img[src*="wcmt.svg"] { transform: scale(1.3); transform-origin: center center; }
.credential-mark .mark.is-logo img[src*="frcs.png"] { transform: scale(1); }
.credential-mark .mark.is-logo img[src*="boa.svg"] { transform: scale(1); }
.credential-mark .mark.is-logo img[src*="blrs.png"] { transform: scale(0.92); }
.credential-mark .mark.is-logo img[src*="gmc.svg"] { transform: scale(0.88); }
.credential-mark:hover .mark.is-logo {
    background: var(--white);
    border-color: var(--gold-dark);
    box-shadow: 0 0 0 3px rgba(201,169,110,0.18);
}
.credential-mark .label {
    font-size: 0.6rem;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-weight: 700;
    white-space: nowrap;
}

/* ─────────────────────────────────────────────────────────────────────
   Featured publication hero (cream band, image + abstract preview)
   ───────────────────────────────────────────────────────────────────── */
.featured-pub {
    background: linear-gradient(135deg, var(--cream) 0%, var(--cream-dark) 100%);
    padding: 5rem 2rem;
}
.featured-pub-inner {
    background: var(--white);
    border: 1px solid rgba(201,169,110,0.22);
    border-radius: 8px;
    padding: 1.6rem;
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
    box-shadow: 0 8px 24px -18px rgba(12,24,41,0.25);
}
.featured-pub-stack {
    max-width: 1280px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.6rem;
}
.featured-pub-img {
    width: 100%;
    height: 200px;
    border-radius: 6px;
    overflow: hidden;
    position: relative;
    background: var(--gold);
}
.featured-pub-img img { width:100%; height:100%; object-fit: cover; display: block; }
.featured-pub-img .badge {
    position: absolute; top: 0.8rem; left: 0.8rem;
    background: var(--white); color: var(--navy);
    padding: 5px 10px; border-radius: 100px;
    font-size: 0.52rem; font-weight: 700; letter-spacing: 0.15em;
    text-transform: uppercase;
    box-shadow: 0 4px 12px -4px rgba(12,24,41,0.2);
}
.featured-pub-text .feat-meta {
    display: flex; gap: 0.6rem; margin-bottom: 1.2rem; flex-wrap: wrap;
}
.featured-pub-text .feat-chip {
    background: var(--white); color: var(--gold-dark);
    padding: 6px 14px; border-radius: 100px;
    font-size: 0.65rem; font-weight: 700; letter-spacing: 0.13em;
    text-transform: uppercase;
    border: 1px solid #d4dcd5;
}
.featured-pub-text .feat-chip.solid { background: var(--gold-dark); color: var(--white); border-color: var(--gold-dark); }
.featured-pub-text { display: flex; flex-direction: column; flex: 1; }
.featured-pub-text h3 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.4rem; font-weight: 600; color: var(--navy);
    line-height: 1.25; margin-bottom: 0.8rem;
}
.featured-pub-text .feat-abstract { font-size: 0.85rem; color: var(--text-body); line-height: 1.7; margin-bottom: 1.2rem; flex: 1; }
.featured-pub-text .feat-link {
    display: inline-flex; align-items: center; gap: 8px;
    color: var(--gold-dark); font-weight: 700; font-size: 0.7rem;
    text-decoration: none; letter-spacing: 0.15em; text-transform: uppercase;
    border-bottom: 1px solid var(--gold);
    padding-bottom: 4px;
}
.feat-stats { display: flex; gap: 1.2rem; margin-top: 1rem; padding-top: 1rem; border-top: 1px solid #d4dcd5; flex-wrap: wrap; }
.feat-stat .num { font-family: 'Cormorant Garamond', serif; font-size: 1.3rem; font-weight: 700; color: var(--gold-dark); line-height: 1; }
.feat-stat .lab { font-size: 0.55rem; text-transform: uppercase; letter-spacing: 0.12em; color: var(--text-light); margin-top: 4px; font-weight: 700; }
.featured-pub-text .feat-meta .feat-chip { padding: 4px 10px; font-size: 0.55rem; }

/* ─────────────────────────────────────────────────────────────────────
   Pilot featured publication — split clinical / plain English
   ───────────────────────────────────────────────────────────────────── */
.featured-pub-pilot {
    max-width: 1280px;
    margin: 0 auto;
    background: var(--white);
    border: 1px solid rgba(201,169,110,0.22);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 12px 32px -22px rgba(12,24,41,0.3);
}
.pilot-img {
    position: relative;
    width: 100%;
    height: 280px;
    background: var(--gold);
    overflow: hidden;
}
.pilot-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pilot-img .badge {
    position: absolute; top: 1.2rem; left: 1.2rem;
    background: var(--white); color: var(--navy);
    padding: 6px 14px; border-radius: 100px;
    font-size: 0.55rem; font-weight: 700; letter-spacing: 0.18em;
    text-transform: uppercase;
    box-shadow: 0 4px 12px -4px rgba(12,24,41,0.2);
}
.pilot-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
}
.pilot-col { padding: 2rem 2.2rem; display: flex; flex-direction: column; }
.pilot-clinical { background: var(--white); border-right: 1px solid rgba(0,0,0,0.06); }
.pilot-plain { background: var(--cream); }
.pilot-col .col-eyebrow {
    font-size: 0.55rem;
    color: var(--gold-dark);
    text-transform: uppercase;
    letter-spacing: 0.2em;
    font-weight: 700;
    margin-bottom: 0.8rem;
}
.pilot-col h3 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.5rem; font-weight: 600; color: var(--navy);
    line-height: 1.25; margin: 0.6rem 0 1rem;
}
.pilot-clinical .feat-citation {
    font-size: 0.72rem;
    color: var(--text-light);
    line-height: 1.55;
    margin: 0 0 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px dashed rgba(0,0,0,0.1);
}
.pilot-clinical .feat-abstract {
    font-size: 0.82rem;
    line-height: 1.7;
    color: var(--text-body);
}
.pilot-plain p {
    font-size: 0.88rem;
    line-height: 1.75;
    color: var(--text-body);
    margin-bottom: 0.9rem;
}
.pilot-plain p strong {
    color: var(--navy);
    font-weight: 700;
}
.pilot-col .feat-link { margin-top: auto; padding-top: 1rem; }
.pilot-clinical .feat-stats { margin-top: 1.2rem; padding-top: 1.2rem; }

@media (max-width: 900px) {
    .pilot-split { grid-template-columns: 1fr; }
    .pilot-clinical { border-right: 0; border-bottom: 1px solid rgba(0,0,0,0.06); }
    .pilot-img { height: 200px; }
    .pilot-col { padding: 1.6rem 1.4rem; }
}

/* ─────────────────────────────────────────────────────────────────────
   Theses cards
   ───────────────────────────────────────────────────────────────────── */
.thesis-grid {
    max-width: 1100px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
    padding: 0 2rem;
}
.thesis-card {
    background: var(--white);
    border: 1px solid rgba(201,169,110,0.25);
    border-left: 3px solid var(--gold);
    border-radius: 6px;
    padding: 1.8rem 1.6rem;
}
.thesis-card .thesis-eyebrow {
    display: inline-block;
    font-size: 0.55rem;
    color: var(--gold-dark);
    text-transform: uppercase;
    letter-spacing: 0.2em;
    font-weight: 700;
    margin-bottom: 0.6rem;
}
.thesis-card h3 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.4rem; font-weight: 600;
    color: var(--navy); line-height: 1.25;
    margin: 0 0 0.8rem;
}
.thesis-card .thesis-meta {
    font-size: 0.85rem;
    line-height: 1.7;
    color: var(--text-light);
    margin: 0;
}
@media (max-width: 900px) { .thesis-grid { grid-template-columns: 1fr; padding: 0 1rem; } }

/* ─────────────────────────────────────────────────────────────────────
   Research-area card grid (3-up, themed)
   ───────────────────────────────────────────────────────────────────── */
.research-grid {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    padding: 0 2rem;
}
.research-card {
    background: var(--white);
    border: 1px solid #e8e3db;
    border-radius: 6px;
    padding: 2.2rem 1.8rem;
    transition: all 0.3s;
    position: relative;
    overflow: hidden;
}
.research-card::after {
    content: '';
    position: absolute; left: 0; bottom: 0;
    height: 3px; width: 0;
    background: var(--gold);
    transition: width 0.3s;
}
.research-card:hover {
    border-color: var(--gold);
    transform: translateY(-3px);
    box-shadow: 0 12px 32px -16px rgba(12,24,41,0.2);
}
.research-card:hover::after { width: 100%; }
.research-num {
    font-family: 'Cormorant Garamond', serif;
    font-size: 3rem; font-weight: 400;
    color: var(--gold);
    line-height: 1;
    margin-bottom: 0.8rem;
}
.research-year {
    display: inline-block;
    font-size: 0.6rem; font-weight: 700; letter-spacing: 0.15em;
    text-transform: uppercase; padding: 5px 12px;
    background: var(--cream-dark); color: var(--text-dark);
    border-radius: 100px; margin-bottom: 1rem;
}
.research-card h4 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.45rem; font-weight: 600; color: var(--navy);
    line-height: 1.25; margin-bottom: 0.8rem;
}
.research-card p { font-size: 0.85rem; color: var(--text-body); line-height: 1.7; }

/* ─────────────────────────────────────────────────────────────────────
   Publication card grid (3-up, journal chip + title)
   ───────────────────────────────────────────────────────────────────── */
.pub-grid {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    padding: 0 2rem;
}
.pub-card {
    background: var(--white);
    border: 1px solid #e8e3db;
    border-radius: 6px;
    padding: 1.8rem;
    transition: all 0.3s;
    display: flex; flex-direction: column;
    position: relative;
    overflow: hidden;
}
.pub-card::before {
    content: '';
    position: absolute; left: 0; top: 0; bottom: 0;
    width: 3px;
    background: var(--gold);
    transform: translateX(-3px);
    transition: transform 0.3s;
}
.pub-card:hover {
    border-color: var(--gold);
    box-shadow: 0 12px 32px -16px rgba(12,24,41,0.18);
    transform: translateY(-3px);
}
.pub-card:hover::before { transform: translateX(0); }
.pub-meta { display: flex; gap: 0.5rem; margin-bottom: 1rem; flex-wrap: wrap; }
.pub-year, .pub-journal {
    font-size: 0.58rem; font-weight: 700; letter-spacing: 0.15em;
    text-transform: uppercase; padding: 5px 11px; border-radius: 100px;
}
.pub-year { background: var(--navy); color: var(--white); }
.pub-journal { background: var(--cream); color: var(--text-dark); border: 1px solid #d4dcd5; }
.pub-card h4 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.25rem; font-weight: 600; color: var(--navy);
    line-height: 1.3; margin-bottom: 0.6rem;
}
.pub-card .pub-cite { font-size: 0.78rem; color: var(--text-light); margin-bottom: 1.2rem; flex: 1; line-height: 1.6; }
.pub-card .pub-link {
    font-size: 0.62rem; font-weight: 700; letter-spacing: 0.15em;
    text-transform: uppercase; color: var(--gold-dark);
    text-decoration: none; align-self: flex-start;
    border-bottom: 1px solid transparent;
    transition: all 0.3s;
    padding-bottom: 3px;
}
.pub-card:hover .pub-link { border-bottom-color: var(--gold-dark); }

/* ─────────────────────────────────────────────────────────────────────
   Churchill spotlight panel (dark, gradient, big WCMT watermark)
   ───────────────────────────────────────────────────────────────────── */
.churchill-spotlight {
    background: linear-gradient(135deg, var(--navy) 0%, var(--slate) 100%);
    padding: 5rem 2rem;
    color: var(--white);
    position: relative;
    overflow: hidden;
}
.churchill-spotlight::before {
    content: 'WCMT';
    position: absolute;
    right: -2%; top: -15%;
    font-family: 'Cormorant Garamond', serif;
    font-size: 26rem; font-weight: 700;
    color: rgba(255,255,255,0.035);
    line-height: 1;
    pointer-events: none;
    letter-spacing: -0.04em;
}
.churchill-inner {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: 4rem;
    align-items: center;
    position: relative;
    z-index: 1;
}
.churchill-side .section-tag span { color: var(--gold-light); }
.churchill-side .section-tag .tag-line { background: var(--gold-light); }
.churchill-side .section-tag::after { background: var(--gold-light); }
.churchill-side h2 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 2.6rem; font-weight: 400;
    color: var(--white); line-height: 1.15;
    margin: 1rem 0 1.2rem;
    letter-spacing: -0.005em;
}
.churchill-side h2 strong { color: var(--gold-light); font-weight: 500; font-style: italic; }
.churchill-side p { font-size: 0.95rem; color: rgba(255,255,255,0.75); line-height: 1.85; }
.fellowship-list {
    display: flex; flex-direction: column; gap: 1rem;
}
.fellowship-item {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 6px;
    padding: 1.4rem 1.6rem;
    display: grid;
    grid-template-columns: 78px 1fr auto;
    gap: 1.4rem;
    align-items: center;
    transition: all 0.3s;
    text-decoration: none;
}
.fellowship-item:hover {
    background: rgba(201,169,110,0.08);
    border-color: var(--gold);
    transform: translateX(4px);
}
.fellowship-year {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.9rem; font-weight: 700; color: var(--gold-light);
    line-height: 1;
}
.fellowship-title { color: var(--white); font-weight: 600; font-size: 0.95rem; line-height: 1.4; }
.fellowship-org { color: rgba(255,255,255,0.5); font-size: 0.7rem; margin-top: 5px; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 600; }
.fellowship-arrow { color: var(--gold-light); font-size: 1.4rem; }

@media (max-width: 900px) {
    .featured-pub-stack { grid-template-columns: 1fr; }
    .churchill-inner { grid-template-columns: 1fr; gap: 2rem; }
    .pub-grid, .research-grid { grid-template-columns: 1fr; }
    .fellowship-item { grid-template-columns: 60px 1fr auto; gap: 1rem; }
    .churchill-spotlight { padding: 3.5rem 1.25rem; }
    .churchill-spotlight::before { font-size: 14rem; right: -5%; top: 5%; }
    .churchill-side h2 { font-size: 1.9rem; }
    .featured-pub { padding: 3rem 1.25rem; }
    .credential-bar { gap: 1.4rem; padding: 1.2rem; }
    .credential-mark .mark { width: 48px; height: 48px; }
}
@media (max-width: 480px) {
    .churchill-spotlight::before { font-size: 8rem; }
    .churchill-side h2 { font-size: 1.5rem; }
    .fellowship-item { grid-template-columns: 50px 1fr; gap: 0.8rem; padding: 1.1rem 1.1rem; }
    .fellowship-arrow { display: none; }
    .fellowship-year { font-size: 1.5rem; }
}

/* ─────────────────────────────────────────────────────────────────────
   MEDIA PAGE — channel stats, video features, grids, calendar
   Adapted from /Nima/styles.css with draft variable mappings.
   ───────────────────────────────────────────────────────────────────── */
.channel-stats {
    background:
        radial-gradient(ellipse at 20% 0%, rgba(201,169,110,0.10) 0%, transparent 55%),
        radial-gradient(ellipse at 80% 100%, rgba(201,169,110,0.06) 0%, transparent 55%),
        linear-gradient(180deg, var(--navy) 0%, var(--navy-light) 50%, var(--navy) 100%);
    padding: 2.6rem 4rem;
    position: relative;
    border-top: 1px solid rgba(201,169,110,.18);
    border-bottom: 1px solid rgba(201,169,110,.18);
}
.channel-stats::before {
    content: '';
    position: absolute;
    top: 0; left: 50%;
    transform: translateX(-50%);
    width: 80%;
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, rgba(201,169,110,0.45) 50%, transparent 100%);
}
.channel-stats-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: repeat(4,1fr); gap: 2rem; text-align: center; position: relative; z-index: 1; }
.cs-item { text-decoration: none; display: block; padding: 0.4rem 0.6rem; border-radius: 4px; transition: background 0.25s, transform 0.25s; }
a.cs-item:hover { background: rgba(201,169,110,0.10); transform: translateY(-2px); }
a.cs-item:hover .num { color: var(--gold-light); }
.cs-item .num { font-family: 'Cormorant Garamond', serif; font-size: 2.4rem; font-weight: 700; color: var(--gold); line-height: 1; transition: color 0.25s; }
.cs-item .lab { font-size: .6rem; color: rgba(255,255,255,.55); text-transform: uppercase; letter-spacing: .18em; font-weight: 600; margin-top: .5rem; }

/* Media split (talks left, featured right) */
.media-split { padding-top: 4rem; padding-bottom: 4rem; }
.media-split-inner { max-width: 1240px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1.15fr; gap: 3.5rem; align-items: start; }
.media-split-col h2 { font-family: 'Cormorant Garamond', serif; font-size: 2.1rem; font-weight: 600; color: var(--navy); line-height: 1.2; margin: 0.4rem 0 0.8rem; }
.media-split-col h2 em { color: var(--gold-dark); font-style: italic; font-weight: 600; }
.media-split-col .section-tag { margin-bottom: 0.4rem; }
.media-split-lede { font-size: 0.9rem; color: var(--text-body); line-height: 1.7; margin-bottom: 1.4rem; }
.media-feature-col p { font-size: 0.9rem; color: var(--text-body); line-height: 1.75; }
.media-feature-col .video-embed { margin: 1rem 0 0.8rem; }

.upcoming-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 0.4rem; }
.upcoming-list li { display: grid; grid-template-columns: 60px 1fr; gap: 1.1rem; align-items: center; padding: 0.85rem 0; border-bottom: 1px solid rgba(0,0,0,0.06); }
.upcoming-list li:last-child { border-bottom: 0; }
.upcoming-list .up-date { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 0.45rem 0; background: var(--cream); border: 1px solid rgba(201,169,110,0.3); border-radius: 4px; }
.upcoming-list .up-date strong { font-family: 'Cormorant Garamond', serif; font-size: 1.4rem; font-weight: 700; color: var(--navy); line-height: 1; }
.upcoming-list .up-date { font-size: 0.55rem; color: var(--gold-dark); text-transform: uppercase; letter-spacing: 0.14em; font-weight: 700; }
.upcoming-list h4 { font-family: 'Cormorant Garamond', serif; font-size: 1.05rem; font-weight: 600; color: var(--navy); line-height: 1.25; margin: 0 0 0.2rem; }
.upcoming-list li p { font-size: 0.7rem; color: var(--text-light); margin: 0; letter-spacing: 0.04em; }

/* Compact-list variant — short pill badge instead of date block */
.upcoming-list.compact-list li { grid-template-columns: 64px 1fr; }
.upcoming-list .up-badge {
    display: inline-flex; align-items: center; justify-content: center;
    padding: 0.3rem 0.4rem;
    background: var(--cream);
    border: 1px solid rgba(201,169,110,0.35);
    border-radius: 100px;
    font-size: 0.6rem;
    font-weight: 700;
    color: var(--gold-dark);
    letter-spacing: 0.06em;
    text-align: center;
    line-height: 1.1;
}
.upcoming-list .up-badge.press {
    font-family: 'Cormorant Garamond', serif;
    font-size: 0.7rem;
    letter-spacing: 0.02em;
}
.upcoming-list.story-list h4 { font-style: italic; font-weight: 500; }

@media (max-width: 900px) {
    .media-split-inner { grid-template-columns: 1fr; gap: 3rem; }
}

.video-feature { display: grid; grid-template-columns: 1.3fr 1fr; gap: 2rem; margin: 2rem 0; align-items: center; max-width: 1200px; margin-left: auto; margin-right: auto; }
.video-embed { display: block; position: relative; padding-bottom: 56.25%; border-radius: 12px; overflow: hidden; background: var(--navy); }
.video-meta h3 { font-family: 'Cormorant Garamond', serif; font-size: 1.6rem; font-weight: 600; color: var(--navy); line-height: 1.25; margin-bottom: .6rem; }
.video-meta p { font-size: .85rem; color: var(--text-light); line-height: 1.75; margin-bottom: .8rem; }
.video-meta .meta-line { font-size: .58rem; color: var(--gold-dark); text-transform: uppercase; letter-spacing: .15em; font-weight: 700; margin-bottom: .8rem; }

.video-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.5rem; margin: 2rem 0; max-width: 1200px; margin-left: auto; margin-right: auto; }
.video-card { background: var(--white); border: 1px solid #e8e3db; border-radius: 12px; overflow: hidden; transition: all .3s; text-decoration: none; color: inherit; display: block; }
.video-card:hover { border-color: var(--gold); transform: translateY(-3px); box-shadow: 0 12px 30px rgba(12,24,41,.08); }
.video-thumb { position: relative; padding-bottom: 56.25%; background: var(--navy); overflow: hidden; }
.video-thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.video-card:hover .video-thumb img { transform: scale(1.05); }
.video-thumb::after { content:''; position: absolute; inset: 0; background: linear-gradient(180deg,transparent 60%,rgba(12,24,41,.5) 100%); }
.video-play { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 54px; height: 54px; border-radius: 50%; background: rgba(255,255,255,.92); display: flex; align-items: center; justify-content: center; z-index: 2; transition: all .3s; }
.video-card:hover .video-play { background: var(--gold); transform: translate(-50%,-50%) scale(1.1); }
.video-play svg { width: 20px; height: 20px; fill: var(--navy); margin-left: 3px; }
.video-dur { position: absolute; bottom: 10px; right: 10px; padding: 3px 8px; background: rgba(0,0,0,.75); color: var(--white); font-size: .55rem; font-weight: 600; border-radius: 3px; z-index: 2; }
.video-body { padding: 1.2rem; }
.video-body h4 { font-family: 'Cormorant Garamond', serif; font-size: 1.05rem; font-weight: 500; color: var(--navy); line-height: 1.3; margin-bottom: .4rem; }
.video-body .v-meta { font-size: .65rem; color: var(--text-light); font-weight: 500; }

.shorts-grid { display: grid; grid-template-columns: repeat(6,1fr); gap: 1rem; margin: 2rem 0; max-width: 1200px; margin-left: auto; margin-right: auto; }
.short-card { position: relative; padding-bottom: 177%; background: var(--navy); border-radius: 10px; overflow: hidden; display: block; text-decoration: none; color: inherit; transition: transform .3s; }
.short-card:hover { transform: translateY(-3px); }
.short-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.short-card::after { content:''; position: absolute; inset: 0; background: linear-gradient(180deg,transparent 50%,rgba(0,0,0,.85) 100%); }
.short-card .short-play { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 44px; height: 44px; border-radius: 50%; background: rgba(255,255,255,.92); display: flex; align-items: center; justify-content: center; z-index: 2; transition: all .3s; }
.short-card:hover .short-play { background: var(--gold); }
.short-card .short-play svg { width: 16px; height: 16px; fill: var(--navy); margin-left: 2px; }
.short-card .short-title { position: absolute; bottom: 12px; left: 12px; right: 12px; font-size: .68rem; font-weight: 600; color: var(--white); line-height: 1.4; z-index: 3; }

.story-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.4rem; margin: 2rem 0; max-width: 1200px; margin-left: auto; margin-right: auto; }
.story-card { background: var(--white); border: 1px solid #e8e3db; border-radius: 12px; overflow: hidden; display: flex; flex-direction: column; text-decoration: none; color: inherit; transition: all .3s; }
.story-card:hover { border-color: var(--gold); transform: translateY(-3px); box-shadow: 0 12px 30px rgba(12,24,41,.08); }
.story-thumb { position: relative; padding-bottom: 62%; background: var(--navy); overflow: hidden; }
.story-thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.story-thumb::after { content:''; position: absolute; inset: 0; background: linear-gradient(180deg,rgba(12,24,41,.15) 0%,rgba(12,24,41,.7) 100%); }
.story-thumb .story-play { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 54px; height: 54px; border-radius: 50%; background: rgba(255,255,255,.9); display: flex; align-items: center; justify-content: center; z-index: 2; }
.story-thumb .story-play svg { width: 20px; height: 20px; fill: var(--navy); margin-left: 3px; }
.story-thumb .story-tag { position: absolute; top: 14px; left: 14px; background: var(--gold); color: var(--white); font-size: .5rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; padding: 5px 10px; border-radius: 100px; z-index: 3; }
.story-body { padding: 1.3rem 1.4rem 1.5rem; }
.story-quote { font-family: 'Cormorant Garamond', serif; font-size: 1.05rem; font-style: italic; color: var(--navy); line-height: 1.45; margin-bottom: .7rem; }
.story-attr { font-size: .68rem; color: var(--text-light); font-weight: 500; }
.story-attr strong { color: var(--navy); font-weight: 700; }

.article-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 1.5rem; margin: 2rem 0; max-width: 1200px; margin-left: auto; margin-right: auto; }
.article-card { padding: 0; background: var(--white); border: 1px solid #e8e3db; border-radius: 12px; border-left: 3px solid var(--gold); transition: all .3s; text-decoration: none; color: inherit; display: flex; align-items: stretch; overflow: hidden; }
.article-card:hover { transform: translateX(3px); box-shadow: 0 10px 30px rgba(12,24,41,.06); }
.article-thumb { flex-shrink: 0; width: 140px; background: var(--navy); overflow: hidden; position: relative; }
.article-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.article-card:hover .article-thumb img { transform: scale(1.06); }
.article-card .article-body { padding: 1.4rem 1.6rem; flex: 1; min-width: 0; }
.article-card .publication { font-size: .55rem; color: var(--gold-dark); text-transform: uppercase; letter-spacing: .15em; font-weight: 700; margin-bottom: .4rem; }
.article-card h4 { font-family: 'Cormorant Garamond', serif; font-size: 1.15rem; font-weight: 600; color: var(--navy); line-height: 1.3; margin-bottom: .5rem; }
.article-card p { font-size: .78rem; color: var(--text-light); line-height: 1.65; margin-bottom: .6rem; }
.article-card .read-more { font-size: .58rem; color: var(--gold-dark); text-transform: uppercase; letter-spacing: .1em; font-weight: 700; }

.podcast-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.2rem; margin: 2rem 0; max-width: 1200px; margin-left: auto; margin-right: auto; }
.podcast-card { background: var(--white); border: 1px solid #e8e3db; border-radius: 12px; padding: 1.4rem 1.5rem; display: flex; gap: 1rem; align-items: flex-start; text-decoration: none; color: inherit; transition: all .3s; }
.podcast-card:hover { border-color: var(--gold); transform: translateY(-3px); box-shadow: 0 10px 24px rgba(12,24,41,.08); }
.podcast-cover { flex-shrink: 0; width: 78px; height: 78px; border-radius: 8px; overflow: hidden; background: var(--navy); position: relative; }
.podcast-cover img { width: 100%; height: 100%; object-fit: cover; }
.podcast-cover .pod-play { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 30px; height: 30px; border-radius: 50%; background: rgba(255,255,255,.92); display: flex; align-items: center; justify-content: center; }
.podcast-cover .pod-play svg { width: 12px; height: 12px; fill: var(--navy); margin-left: 2px; }
.podcast-info { flex: 1; min-width: 0; }
.podcast-show { font-size: .55rem; color: var(--gold-dark); text-transform: uppercase; letter-spacing: .15em; font-weight: 700; margin-bottom: .4rem; }
.podcast-info h4 { font-size: .9rem; font-weight: 700; color: var(--navy); line-height: 1.35; margin-bottom: .35rem; }
.podcast-meta { font-size: .68rem; color: var(--text-light); }

.calendar { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin: 2rem 0; max-width: 1200px; margin-left: auto; margin-right: auto; }
.cal-item { display: grid; grid-template-columns: 90px 1fr auto; gap: 1.4rem; padding: 1.2rem 1.4rem; background: var(--white); border: 1px solid #e8e3db; border-radius: 10px; align-items: center; transition: border-color .3s; }
.cal-item:hover { border-color: var(--gold); }
.cal-date { text-align: center; padding: .6rem; background: var(--navy); border-radius: 8px; color: var(--white); }
.cal-date .day { font-family: 'Cormorant Garamond', serif; font-size: 1.6rem; font-weight: 700; line-height: 1; }
.cal-date .month { font-size: .55rem; text-transform: uppercase; letter-spacing: .15em; color: var(--gold); font-weight: 600; margin-top: .2rem; }
.cal-body h4 { font-size: .92rem; font-weight: 700; color: var(--navy); margin-bottom: .25rem; }
.cal-body .venue { font-size: .75rem; color: var(--text-light); margin-bottom: .15rem; }
.cal-body .topic { font-size: .72rem; color: var(--gold-dark); font-style: italic; }
.cal-tag { font-size: .55rem; font-weight: 700; color: var(--gold-dark); text-transform: uppercase; letter-spacing: .15em; padding: 5px 12px; border: 1px solid var(--gold); border-radius: 100px; white-space: nowrap; }

.topic-chips { display: flex; flex-wrap: wrap; gap: .55rem; justify-content: center; margin: 1.4rem 0 2rem; }
.topic-chip { font-size: .62rem; font-weight: 600; color: var(--navy); text-transform: uppercase; letter-spacing: .14em; padding: 9px 18px; border: 1px solid var(--gold); border-radius: 100px; background: transparent; text-decoration: none; transition: all .25s; white-space: nowrap; cursor: pointer; }
.topic-chip:hover, .topic-chip.is-active { background: var(--gold); color: var(--white); }

@media (max-width: 900px) {
    .video-feature { grid-template-columns: 1fr; }
    .video-grid, .story-grid, .podcast-grid { grid-template-columns: 1fr; }
    .shorts-grid { grid-template-columns: repeat(3, 1fr); }
    .article-grid, .calendar { grid-template-columns: 1fr; }
    .channel-stats { padding: 1.8rem 1.5rem; }
    .channel-stats-inner { grid-template-columns: repeat(2, 1fr); gap: 1.2rem; }
    .article-card { flex-direction: column; }
    .article-thumb { width: 100%; height: 160px; }
}

/* ============================================================
   CONDITION / PROCEDURE PAGE TEMPLATE STYLES
   ============================================================ */

/* Breadcrumbs in page hero */
.breadcrumbs {
    font-size: 0.7rem;
    letter-spacing: 0.08em;
    color: rgba(255,255,255,0.5);
    margin-bottom: 1.2rem;
    text-transform: uppercase;
}
.breadcrumbs a {
    color: rgba(255,255,255,0.7);
    text-decoration: none;
    transition: color 0.2s;
}
.breadcrumbs a:hover { color: var(--gold); }
.breadcrumbs span { margin: 0 6px; color: rgba(255,255,255,0.35); }

/* Quick facts strip */
.condition-facts {
    background: var(--navy);
    color: var(--white);
    padding: 2.2rem 4rem;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2rem;
    border-top: 1px solid rgba(201,169,110,0.3);
    border-bottom: 1px solid rgba(201,169,110,0.3);
}
.cf-item { text-align: center; }
.cf-item .num {
    font-family: 'Cormorant Garamond', serif;
    font-size: 2.4rem;
    font-weight: 600;
    color: var(--gold);
    line-height: 1;
    margin-bottom: 0.5rem;
}
.cf-item .lab {
    font-size: 0.62rem;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: rgba(255,255,255,0.7);
    font-weight: 500;
}

/* 2-column prose */
.prose-2col {
    max-width: 1100px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
}
.prose-2col h4 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.3rem;
    font-weight: 600;
    color: var(--navy);
    margin: 1.5rem 0 0.6rem;
}
.prose-2col h4:first-child { margin-top: 0; }
.prose-2col p {
    font-size: 0.92rem;
    color: var(--text-light);
    line-height: 1.8;
    margin-bottom: 1.1rem;
}

/* Symptom card grid */
.symptom-grid {
    max-width: 1180px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.4rem;
}
.symptom-card {
    background: var(--white);
    padding: 1.8rem 1.6rem;
    border-radius: 6px;
    border: 1px solid rgba(201,169,110,0.2);
    border-left: 3px solid var(--gold);
}
.symptom-card h4 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--navy);
    margin: 0 0 0.5rem;
}
.symptom-card p {
    font-size: 0.85rem;
    color: var(--text-light);
    line-height: 1.65;
    margin: 0;
}

/* Diagnosis numbered steps */
.diag-steps {
    max-width: 1100px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.8rem;
}
.diag-step {
    background: var(--white);
    padding: 1.8rem;
    border-radius: 6px;
    position: relative;
}
.diag-step .step-num {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--gold);
    margin-bottom: 0.3rem;
}
.diag-step h4 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.3rem;
    font-weight: 600;
    color: var(--navy);
    margin: 0 0 0.6rem;
}
.diag-step p {
    font-size: 0.88rem;
    color: var(--text-light);
    line-height: 1.7;
    margin: 0;
}

/* Treatment options */
.treatment-grid {
    max-width: 1180px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.4rem;
}
.treatment-card {
    background: var(--cream);
    padding: 1.8rem 1.6rem;
    border-radius: 6px;
    border: 1px solid transparent;
    transition: all 0.3s;
}
.treatment-card:hover {
    border-color: var(--gold);
    background: var(--white);
}
.treatment-card h4 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--navy);
    margin: 0 0 0.5rem;
}
.treatment-card p {
    font-size: 0.85rem;
    color: var(--text-light);
    line-height: 1.65;
    margin: 0;
}

/* Surgical options (large cards) */
.surgery-options {
    max-width: 1100px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.6rem;
}
.surgery-card {
    background: var(--white);
    padding: 2.2rem 2rem;
    border-radius: 6px;
    border: 1px solid rgba(201,169,110,0.25);
    position: relative;
    display: flex;
    flex-direction: column;
}
.surgery-card .surgery-tag {
    position: absolute;
    top: 1.2rem;
    right: 1.2rem;
    font-size: 0.55rem;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--navy);
    background: var(--gold);
    padding: 4px 10px;
    border-radius: 3px;
    font-weight: 700;
}
.surgery-card h3 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--navy);
    margin: 0 0 0.8rem;
    line-height: 1.25;
    padding-right: 6rem;
}
.surgery-card > p {
    font-size: 0.9rem;
    color: var(--text-light);
    line-height: 1.7;
    margin: 0 0 1rem;
}
.surgery-card ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.surgery-card ul li {
    font-size: 0.82rem;
    color: var(--text-dark);
    line-height: 1.6;
    padding: 0.35rem 0 0.35rem 1.4rem;
    position: relative;
    border-bottom: 1px solid rgba(0,0,0,0.04);
}
.surgery-card ul li::before {
    content: '\2713';
    position: absolute;
    left: 0;
    color: var(--gold-dark);
    font-weight: 700;
}
.surgery-card ul li:last-child { border-bottom: 0; }

/* FAQ accordion */
.faq-list {
    max-width: 900px;
    margin: 0 auto;
}
.faq-list details {
    background: var(--white);
    border-radius: 6px;
    margin-bottom: 0.8rem;
    border: 1px solid rgba(201,169,110,0.2);
    overflow: hidden;
}
.faq-list details[open] { border-color: var(--gold); }
.faq-list summary {
    padding: 1.2rem 1.5rem;
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.15rem;
    font-weight: 600;
    color: var(--navy);
    cursor: pointer;
    list-style: none;
    position: relative;
    padding-right: 3rem;
    transition: background 0.2s;
}
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after {
    content: '+';
    position: absolute;
    right: 1.5rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.4rem;
    color: var(--gold);
    font-weight: 300;
    transition: transform 0.2s;
}
.faq-list details[open] summary::after { transform: translateY(-50%) rotate(45deg); }
.faq-list summary:hover { background: var(--cream); }
.faq-list details p {
    padding: 0 1.5rem 1.4rem;
    font-size: 0.9rem;
    color: var(--text-light);
    line-height: 1.75;
    margin: 0;
}

/* Related procedures cross-link grid */
.related-grid {
    max-width: 1180px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.4rem;
}
.related-card {
    background: var(--white);
    border: 1px solid rgba(201,169,110,0.2);
    border-radius: 6px;
    padding: 1.8rem 1.6rem;
    text-decoration: none;
    color: inherit;
    transition: all 0.3s;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.related-card:hover {
    border-color: var(--gold);
    transform: translateY(-3px);
    box-shadow: 0 18px 38px -22px rgba(12,24,41,0.25);
}
.related-card .rel-eyebrow {
    font-size: 0.55rem;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--gold-dark);
    font-weight: 700;
}
.related-card h4 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--navy);
    margin: 0;
    line-height: 1.25;
}
.related-card p {
    font-size: 0.85rem;
    color: var(--text-light);
    line-height: 1.65;
    margin: 0;
    flex: 1;
}
.related-card .rel-link {
    font-size: 0.65rem;
    color: var(--gold-dark);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    border-bottom: 1px solid var(--gold);
    padding-bottom: 4px;
    align-self: flex-start;
}

/* Mobile */
@media (max-width: 1100px) {
    .symptom-grid, .treatment-grid, .related-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 900px) {
    .condition-facts { padding: 1.6rem 1.5rem; grid-template-columns: repeat(2, 1fr); gap: 1.4rem; }
    .cf-item .num { font-size: 1.9rem; }
    .prose-2col { grid-template-columns: 1fr; gap: 1.5rem; }
    .symptom-grid, .treatment-grid, .related-grid { grid-template-columns: 1fr; }
    .diag-steps, .surgery-options { grid-template-columns: 1fr; }
    .surgery-card h3 { padding-right: 0; }
    .surgery-card .surgery-tag { position: static; align-self: flex-start; margin-bottom: 0.8rem; }
}
@media (max-width: 480px) {
    .condition-facts { padding: 1.4rem 1rem; gap: 1rem; }
    .cf-item .num { font-size: 1.6rem; }
    .cf-item .lab { font-size: 0.55rem; letter-spacing: 0.12em; }
    .channel-stats { padding: 1.4rem 1rem; }
    .channel-stats-inner { gap: 0.9rem; }
    .cs-item .num { font-size: 1.65rem; }
}

/* ─────────────────────────────────────────────────────────────────────
   Theme stacks on /research — multiple split-cards per theme
   ───────────────────────────────────────────────────────────────────── */
.pub-theme {
    background: var(--cream);
}
.pub-theme + .pub-theme {
    background: var(--white);
}
.theme-stack {
    max-width: 1280px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 2.4rem;
}
.theme-stack .paper-card {
    margin: 0 auto;
    width: 100%;
}

/* ─────────────────────────────────────────────────────────────────────
   Updates blog index grid
   ───────────────────────────────────────────────────────────────────── */
.updates-grid {
    max-width: 1180px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.6rem;
    padding: 0 2rem;
}
.update-card {
    background: var(--white);
    border: 1px solid rgba(201,169,110,0.22);
    border-radius: 8px;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    transition: all 0.3s;
}
.update-card:hover {
    border-color: var(--gold);
    transform: translateY(-3px);
    box-shadow: 0 18px 38px -22px rgba(12,24,41,0.25);
}
.update-thumb {
    width: 100%;
    height: 160px;
    overflow: hidden;
    background: var(--gold);
}
.update-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.update-body {
    padding: 1.4rem 1.4rem 1.6rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    flex: 1;
}
.update-eyebrow {
    font-size: 0.55rem;
    color: var(--gold-dark);
    text-transform: uppercase;
    letter-spacing: 0.18em;
    font-weight: 700;
}
.update-card h3 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--navy);
    margin: 0;
    line-height: 1.25;
}
.update-card p {
    font-size: 0.82rem;
    color: var(--text-light);
    line-height: 1.6;
    margin: 0;
    flex: 1;
}
.update-link {
    font-size: 0.6rem;
    color: var(--gold-dark);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    border-bottom: 1px solid var(--gold);
    padding-bottom: 4px;
    align-self: flex-start;
    margin-top: 0.3rem;
}
@media (max-width: 900px) {
    .updates-grid { grid-template-columns: 1fr; padding: 0 1rem; }
}

/* ─────────────────────────────────────────────────────────────────────
   COMBINED-only — Sutton-style dark updates page + post layout
   ───────────────────────────────────────────────────────────────────── */
body.dark-theme { background: var(--navy); color: rgba(255,255,255,0.85); }
body.dark-theme .site-nav { background: var(--navy); border-bottom: 1px solid rgba(201,169,110,0.15); height: 88px; margin-bottom: 0; }

/* Updates hero */
.updates-hero {
    position: relative;
    height: clamp(220px, 28vh, 280px);
    min-height: 220px;
    background: var(--navy);
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}
.updates-hero-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.3;
}
.updates-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(12,24,41,0.55) 0%, rgba(12,24,41,0.92) 100%);
}
.updates-hero-content {
    position: relative;
    z-index: 2;
    text-align: center;
    color: var(--white);
    max-width: 760px;
    padding: 0 2rem;
}
.updates-hero-content .hero-eyebrow {
    font-size: 0.62rem;
    letter-spacing: 0.28em;
    color: var(--gold);
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 1.4rem;
}
.updates-hero-content h1 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 4.4rem;
    font-weight: 300;
    line-height: 1.05;
    margin: 0 0 1.2rem;
    letter-spacing: -0.01em;
}
.updates-hero-content h1 em {
    font-weight: 600;
    font-style: italic;
    color: var(--gold-light);
}
.updates-hero-content p {
    font-size: 0.92rem;
    color: rgba(255,255,255,0.6);
    line-height: 1.7;
    margin: 0;
}

/* Filter pills */
.updates-filters {
    background: var(--navy);
    padding: 1.5rem 4rem;
    border-bottom: 1px solid rgba(201,169,110,0.12);
}
.filter-row {
    max-width: 1280px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    justify-content: center;
}
.filter-pill {
    padding: 9px 20px;
    border-radius: 100px;
    font-size: 0.66rem;
    font-weight: 500;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    background: transparent;
    color: rgba(255,255,255,0.55);
    border: 1px solid rgba(255,255,255,0.15);
    cursor: pointer;
    transition: all 0.25s;
    font-family: inherit;
}
.filter-pill:hover { color: var(--white); border-color: rgba(255,255,255,0.4); }
.filter-pill.active { background: var(--gold); color: var(--navy); border-color: var(--gold); font-weight: 700; }

/* Feed grid */
.updates-feed {
    background: var(--navy);
    padding: 3.5rem 4rem 6rem;
    min-height: 60vh;
}
.feed-grid {
    max-width: 1280px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.6rem;
}
.feed-card-wrap {
    display: flex;
    flex-direction: column;
}
.feed-card-wrap .feed-card { flex: 1; }
.feed-card-wrap .share-row { padding-top: 0.4rem; padding-bottom: 0; margin-top: 0.35rem; }
/* Six-up variant — for the /updates blog index */
.feed-grid-6 {
    max-width: 1480px;
    grid-template-columns: repeat(6, 1fr);
    gap: 1rem;
}
.feed-grid-6 .feed-card { font-size: 0.85em; }
.feed-grid-6 .feed-thumb { aspect-ratio: 1 / 1; }
/* Safari 14 fallback (aspect-ratio supported from Safari 15). Falls back to the
   inherited 200px height — visually acceptable square-ish thumbnail. */
@supports not (aspect-ratio: 1/1) { .feed-grid-6 .feed-thumb { height: 0; padding-bottom: 100%; position: relative; } .feed-grid-6 .feed-thumb img { position: absolute; inset: 0; } }
.feed-grid-6 .feed-card h3 { font-size: 0.95rem; line-height: 1.25; }
.feed-grid-6 .feed-meta { font-size: 0.55rem; }
.feed-grid-6 .feed-tag { font-size: 0.5rem; padding: 3px 7px; }
.feed-grid-6 .feed-readmore { font-size: 0.55rem; }
@media (max-width: 1400px) { .feed-grid-6 { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 1100px) { .feed-grid-6 { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 800px) { .feed-grid-6 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .feed-grid-6 { grid-template-columns: 1fr; } }

/* /updates pager — older / newer / page-of-page navigation under the grid. */
.updates-pager {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.2rem;
    max-width: 720px;
    margin: 3rem auto 0;
    padding: 1.2rem 1.6rem;
    border-top: 1px solid rgba(201,169,110,0.22);
    color: rgba(255,255,255,0.78);
    font-size: 0.78rem;
    letter-spacing: 0.02em;
}
.updates-pager .pager-link {
    color: var(--gold-light);
    text-decoration: none;
    font-weight: 600;
    letter-spacing: 0.06em;
    border-bottom: 1px solid rgba(201,169,110,0.4);
    padding: 0.2rem 0.1rem;
    transition: color 0.2s, border-color 0.2s;
}
.updates-pager .pager-link:hover { color: var(--white); border-color: var(--white); }
.updates-pager .pager-link.is-disabled {
    opacity: 0.35;
    pointer-events: none;
    cursor: not-allowed;
    border-color: transparent;
}
.updates-pager .pager-status {
    font-size: 0.7rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.55);
}
.updates-pager .pager-current { color: var(--gold); font-weight: 700; }
.updates-lastmod {
    text-align: center;
    margin: 1.2rem auto 0;
    font-size: 0.65rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.5);
}
@media (max-width: 540px) {
    .updates-pager { flex-direction: column; gap: 0.8rem; padding: 1rem 1.2rem; }
}

.feed-card {
    background: rgba(255,255,255,0.025);
    border: 1px solid rgba(201,169,110,0.18);
    border-radius: 8px;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    transition: all 0.3s;
}
.feed-card:hover {
    border-color: var(--gold);
    transform: translateY(-3px);
    box-shadow: 0 18px 38px -22px rgba(0,0,0,0.7);
    background: rgba(255,255,255,0.04);
}
.feed-thumb {
    width: 100%;
    height: 200px;
    background: var(--navy-light);
    overflow: hidden;
}
.feed-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.feed-body {
    padding: 1.4rem 1.4rem 1.6rem;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    flex: 1;
}
.feed-tags { display: flex; gap: 6px; flex-wrap: wrap; }
.feed-tag {
    font-size: 0.55rem;
    color: var(--gold-light);
    background: rgba(201,169,110,0.12);
    border: 1px solid rgba(201,169,110,0.28);
    padding: 3px 9px;
    border-radius: 100px;
    text-transform: uppercase;
    letter-spacing: 0.13em;
    font-weight: 600;
}
.feed-meta {
    font-size: 0.62rem;
    color: rgba(255,255,255,0.4);
    letter-spacing: 0.04em;
}
.feed-card h3 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.22rem;
    font-weight: 600;
    color: var(--white);
    line-height: 1.3;
    margin: 0;
}
.feed-card p {
    font-size: 0.82rem;
    color: rgba(255,255,255,0.5);
    line-height: 1.6;
    margin: 0;
    flex: 1;
}
.feed-readmore {
    font-size: 0.62rem;
    color: var(--gold);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    margin-top: 0.4rem;
}

/* ─────── Single blog post (Sutton-style) ─────── */
.post-header {
    background: var(--navy);
    padding: 4rem 4rem 2.5rem;
    border-bottom: 1px solid rgba(201,169,110,0.12);
}
.post-header-inner {
    max-width: 1100px;
    margin: 0 auto;
}
.post-header .breadcrumbs {
    font-size: 0.65rem;
    letter-spacing: 0.12em;
    color: rgba(255,255,255,0.4);
    margin-bottom: 1.4rem;
    text-transform: uppercase;
}
.post-header .breadcrumbs a { color: rgba(255,255,255,0.6); text-decoration: none; transition: color 0.2s; }
.post-header .breadcrumbs a:hover { color: var(--gold); }
.post-header .breadcrumbs span { margin: 0 6px; color: rgba(255,255,255,0.25); }
.post-header h1 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 3rem;
    font-weight: 400;
    color: var(--white);
    line-height: 1.15;
    margin: 0;
    max-width: 900px;
    letter-spacing: -0.005em;
}

.post-featured-img {
    background: var(--navy);
    padding: 0 4rem 0;
}
.post-featured-img img {
    display: block;
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    height: 460px;
    object-fit: cover;
    border-radius: 6px;
}

.post-body {
    background: var(--navy);
    padding: 3rem 4rem 5rem;
}
.post-body-grid {
    max-width: 1100px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 3rem;
    align-items: start;
}
.post-main {
    color: rgba(255,255,255,0.85);
}
.post-meta-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: 1.4rem;
    border-bottom: 1px solid rgba(201,169,110,0.12);
    margin-bottom: 1.8rem;
    flex-wrap: wrap;
}
.post-author { display: flex; align-items: center; gap: 12px; }
.author-avatar {
    width: 44px; height: 44px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--gold) 0%, var(--gold-light, #e6cc8a) 55%, #f5deb3 100%);
    box-shadow: 0 2px 10px rgba(201,169,110,0.35), inset 0 1px 0 rgba(255,255,255,0.35);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Cormorant Garamond', serif;
    font-weight: 700;
    color: var(--navy, #0b1a2b);
    font-size: 1rem;
    letter-spacing: 0.03em;
    flex-shrink: 0;
    border: 1px solid rgba(255,255,255,0.18);
}
.author-name { font-size: 0.82rem; font-weight: 600; color: var(--white); }
.author-role { font-size: 0.65rem; color: rgba(255,255,255,0.45); margin-top: 2px; }
.post-meta {
    font-size: 0.65rem;
    color: rgba(255,255,255,0.45);
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.post-meta .dot { color: var(--gold); margin: 0 6px; }

.post-content { line-height: 1.85; font-size: 0.95rem; color: rgba(255,255,255,0.78); }
.post-content p { margin: 0 0 1.2rem; }
.post-content h2 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.7rem;
    font-weight: 600;
    color: var(--white);
    margin: 2.4rem 0 1rem;
    line-height: 1.25;
}
.post-content em { color: var(--gold-light); }
.post-content strong { color: var(--white); }

.post-tags {
    margin-top: 2rem;
    padding-top: 1.6rem;
    border-top: 1px solid rgba(201,169,110,0.12);
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
}
.post-tags-label {
    font-size: 0.7rem;
    color: rgba(255,255,255,0.55);
    margin-right: 0.4rem;
    letter-spacing: 0.02em;
}
.post-tag {
    font-size: 0.55rem;
    color: var(--gold-light);
    background: rgba(201,169,110,0.1);
    border: 1px solid rgba(201,169,110,0.25);
    padding: 4px 12px;
    border-radius: 100px;
    text-transform: uppercase;
    letter-spacing: 0.13em;
    font-weight: 600;
    cursor: default;
    transition: background 0.2s, border-color 0.2s;
}
.post-tag:hover { background: rgba(201,169,110,0.18); border-color: rgba(201,169,110,0.45); }

/* Social share row */
.post-share {
    margin-top: 2rem;
    padding: 1.2rem 0;
    border-top: 1px solid rgba(201,169,110,0.12);
    border-bottom: 1px solid rgba(201,169,110,0.12);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}
.post-share-label {
    font-size: 0.7rem;
    color: rgba(255,255,255,0.55);
    text-transform: uppercase;
    letter-spacing: 0.12em;
}
.post-share-buttons { display: flex; gap: 8px; }
.share-btn {
    width: 38px; height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(201,169,110,0.22);
    color: rgba(255,255,255,0.7);
    text-decoration: none;
    cursor: pointer;
    transition: background 0.2s, border-color 0.2s, color 0.2s, transform 0.15s;
    padding: 0;
}
.share-btn:hover {
    background: rgba(201,169,110,0.12);
    border-color: var(--gold);
    color: var(--gold);
    transform: translateY(-1px);
}
.share-btn svg { width: 16px; height: 16px; fill: currentColor; }
.share-btn.share-copy svg { fill: none; stroke: currentColor; }
.share-btn.copied {
    background: rgba(201,169,110,0.2);
    border-color: var(--gold);
    color: var(--gold);
}
.share-btn.copied::after {
    content: 'Copied';
    position: absolute;
    margin-top: -52px;
    font-size: 0.6rem;
    color: var(--gold);
    background: var(--navy);
    padding: 4px 8px;
    border-radius: 4px;
    border: 1px solid rgba(201,169,110,0.3);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    pointer-events: none;
    white-space: nowrap;
}

/* Compact inline share row — used beneath video cards on /media and feed cards on /updates */
.share-row {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.55rem 0 0.4rem 1.2rem;
    margin-top: 0.5rem;
    font-size: 0.62rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.4);
}
.share-row-label {
    color: rgba(255,255,255,0.45);
    font-weight: 600;
    margin-right: 0.2rem;
}
.share-row a,
.share-row button {
    width: 26px;
    height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    padding: 0;
    background: transparent;
    color: rgba(255,255,255,0.42);
    cursor: pointer;
    border-radius: 4px;
    text-decoration: none;
    position: relative;
    transition: color 0.18s ease, transform 0.18s ease, background 0.18s ease;
}
.share-row a:hover,
.share-row button:hover,
.share-row a:focus-visible,
.share-row button:focus-visible {
    color: var(--gold);
    background: rgba(201,169,110,0.08);
    transform: translateY(-1px);
    outline: none;
}
.share-row svg {
    width: 16px;
    height: 16px;
    fill: currentColor;
    display: block;
}
.share-row .share-row-copy svg {
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.share-row .share-row-copy.copied {
    color: var(--gold);
    background: rgba(201,169,110,0.12);
}
.share-row .share-row-copy.copied::after {
    content: 'Link copied';
    position: absolute;
    bottom: calc(100% + 6px);
    left: 50%;
    transform: translateX(-50%);
    font-size: 0.58rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--gold);
    background: var(--navy);
    padding: 4px 8px;
    border-radius: 4px;
    border: 1px solid rgba(201,169,110,0.3);
    white-space: nowrap;
    pointer-events: none;
    z-index: 4;
}
/* Light backgrounds (e.g. media-feature col on cream sections) */
body:not(.dark-theme) .share-row,
.share-row.share-row-light {
    color: rgba(12,24,41,0.45);
}
body:not(.dark-theme) .share-row a,
body:not(.dark-theme) .share-row button,
.share-row.share-row-light a,
.share-row.share-row-light button {
    color: rgba(12,24,41,0.45);
}
body:not(.dark-theme) .share-row a:hover,
body:not(.dark-theme) .share-row button:hover,
.share-row.share-row-light a:hover,
.share-row.share-row-light button:hover {
    color: var(--gold-dark, var(--gold));
    background: rgba(201,169,110,0.1);
}
@media (max-width: 640px) {
    .share-row { padding-left: 0.6rem; gap: 0.45rem; }
    .share-row a, .share-row button { width: 24px; height: 24px; }
    .share-row svg { width: 14px; height: 14px; }
}

.post-source {
    margin-top: 2rem;
    padding: 1.2rem 1.4rem;
    background: rgba(255,255,255,0.025);
    border-left: 2px solid var(--gold);
    border-radius: 4px;
    font-size: 0.78rem;
    color: rgba(255,255,255,0.6);
    line-height: 1.7;
}
.post-source strong { color: var(--white); }
.post-source em { color: var(--gold-light); }
.post-source a { color: var(--gold); text-decoration: none; border-bottom: 1px solid rgba(201,169,110,0.3); }
.post-source a:hover { border-bottom-color: var(--gold); }

.post-sidebar {
    position: sticky;
    top: 110px;
}
.sidebar-block {
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(201,169,110,0.15);
    border-radius: 8px;
    padding: 1.4rem;
}
.sidebar-block h4 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--white);
    margin: 0 0 1rem;
    padding-bottom: 0.7rem;
    border-bottom: 1px solid rgba(201,169,110,0.15);
}
/* TOP STORIES — gold pill header (Sutton-style) */
.sidebar-top-stories {
    padding: 0;
    overflow: hidden;
}
.sidebar-top-stories .sidebar-header {
    background: linear-gradient(90deg, var(--gold) 0%, var(--gold-light, #e6cc8a) 100%);
    color: var(--navy, #0b1a2b);
    font-family: 'Inter', sans-serif;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.22em;
    padding: 0.85rem 1.2rem;
}
.sidebar-top-stories .related-posts { padding: 0.4rem 1.2rem 1.2rem; }
.sidebar-top-stories .related-posts li {
    margin: 0;
    padding: 0.85rem 0;
    border-bottom: 1px solid rgba(201,169,110,0.12);
}
.sidebar-top-stories .related-posts li:last-child { border-bottom: none; padding-bottom: 0.4rem; }
.sidebar-top-stories .related-posts li:first-child { padding-top: 0.85rem; }
.related-posts { list-style: none; margin: 0; padding: 0; }
.related-posts li { margin-bottom: 0.9rem; }
.related-posts li:last-child { margin-bottom: 0; }
.related-posts a {
    display: flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    color: rgba(255,255,255,0.78);
    transition: color 0.2s;
}
.related-posts a:hover { color: var(--gold); }
.related-posts img {
    width: 56px;
    height: 56px;
    object-fit: cover;
    border-radius: 4px;
    flex-shrink: 0;
}
.related-posts span {
    font-family: 'Cormorant Garamond', serif;
    font-size: 0.85rem;
    font-weight: 600;
    line-height: 1.3;
    color: inherit;
}

/* More on theme — bottom strip */
.more-on-theme {
    background: var(--navy);
    padding: 0 4rem 5rem;
}
.more-head {
    max-width: 1100px;
    margin: 0 auto 1.8rem;
}
.more-head h2 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.7rem;
    font-weight: 600;
    color: var(--white);
    margin: 0;
    padding-top: 2rem;
    border-top: 1px solid rgba(201,169,110,0.15);
}
.more-grid {
    max-width: 1100px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.2rem;
}
.more-grid .feed-card { background: rgba(255,255,255,0.025); }
.more-grid .feed-thumb { height: 140px; }
.more-grid .feed-body { padding: 1rem 1rem 1.2rem; gap: 0.4rem; }
.more-grid .feed-card h3 { font-size: 1rem; }

@media (max-width: 1100px) {
    .post-body-grid { grid-template-columns: 1fr; }
    .post-sidebar { position: static; }
    .more-grid { grid-template-columns: repeat(2, 1fr); }
    .feed-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 900px) {
    .feed-grid { grid-template-columns: 1fr; }
    .updates-hero-content h1 { font-size: 2.6rem; }
    .updates-feed { padding: 2rem 1.5rem 3rem; }
    .post-header { padding: 2.5rem 1.25rem 2rem; }
    .post-header h1 { font-size: 1.9rem; word-wrap: break-word; overflow-wrap: break-word; line-height: 1.2; }
    .post-featured-img { padding: 0 1.25rem; }
    .post-featured-img img { height: 240px; }
    .post-body { padding: 2rem 1.25rem 3rem; }
    .more-on-theme { padding: 0 1.25rem 3rem; }
    .more-grid { grid-template-columns: 1fr; }
    .updates-hero-content h1 { font-size: 1.9rem; }
    .updates-hero-content { padding: 0 1rem; }
    .updates-filters { padding: 1.2rem 1rem; }
}

/* ─────────────────────────────────────────────────────────────────────
   COMBINED specialisms page — editorial multi-section grouped grid
   ───────────────────────────────────────────────────────────────────── */
.spec-block {
    padding: 5rem 4rem;
    background: var(--white);
}
.spec-block.alt { background: var(--cream); }
.spec-block-head {
    text-align: center;
    max-width: 760px;
    margin: 0 auto 3rem;
}
.spec-eyebrow {
    font-size: 0.62rem;
    color: var(--gold-dark);
    letter-spacing: 0.32em;
    text-transform: uppercase;
    font-weight: 600;
    margin-bottom: 1rem;
}
.spec-block-head h2 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 2.6rem;
    font-weight: 400;
    color: var(--navy);
    margin: 0;
    line-height: 1.15;
    letter-spacing: -0.005em;
}
.spec-block-head h2 em {
    font-weight: 600;
    font-style: italic;
    color: var(--gold-dark);
}
.spec-block-head .spec-lede {
    font-size: 0.9rem;
    color: var(--text-light);
    line-height: 1.75;
    margin-top: 1rem;
}
.spec-cards {
    max-width: 1280px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.4rem;
}
.spec-card-lite {
    background: var(--white);
    border: 1px solid rgba(201,169,110,0.18);
    border-radius: 4px;
    padding: 1.4rem 1.4rem 1.6rem;
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    transition: all 0.3s;
    position: relative;
}
.spec-card-lite::before {
    content: '';
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    padding: 1px;
    background: linear-gradient(135deg, transparent 0%, rgba(201,169,110,0.0) 50%, rgba(201,169,110,0.0) 100%);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor; mask-composite: exclude;
    pointer-events: none;
    transition: background 0.45s;
}
.spec-block.alt .spec-card-lite { background: var(--white); }
a.spec-card-lite:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 32px -22px rgba(12,24,41,0.3);
}
a.spec-card-lite:hover::before {
    background: linear-gradient(135deg, var(--gold) 0%, rgba(201,169,110,0.45) 50%, var(--gold-dark) 100%);
}
.spec-card-eyebrow {
    font-size: 0.55rem;
    color: var(--gold-dark);
    letter-spacing: 0.22em;
    text-transform: uppercase;
    font-weight: 700;
}
.spec-card-lite h3 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--navy);
    margin: 0;
    line-height: 1.25;
}
.spec-card-lite p {
    font-size: 0.82rem;
    color: var(--text-light);
    line-height: 1.65;
    margin: 0;
}

@media (max-width: 1180px) {
    .spec-cards { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 900px) {
    .spec-block { padding: 3rem 1.5rem; }
    .spec-cards { grid-template-columns: repeat(2, 1fr); gap: 1rem; }
    .spec-block-head h2 { font-size: 2rem; }
}
@media (max-width: 560px) {
    .spec-cards { grid-template-columns: 1fr; }
    .spec-block { padding: 2.5rem 1rem; }
    .spec-block-head h2 { font-size: 1.7rem; }
}

/* ─────────────────────────────────────────────────────────────────────
   COMBINED — smaller updates hero + tighter cards
   ───────────────────────────────────────────────────────────────────── */
.updates-hero { height: auto; min-height: clamp(200px, 26vw, 320px); }
.updates-hero-content h1 { font-size: 3.2rem; }
.updates-hero-content p { font-size: 0.85rem; }
.updates-feed { padding: 2.5rem 4rem 5rem; }
.feed-thumb { height: 160px; }
.feed-card h3 { font-size: 1.08rem; }
.feed-body { padding: 1.1rem 1.2rem 1.3rem; gap: 0.45rem; }

/* ─────────────────────────────────────────────────────────────────────
   COMBINED — research library page (compact 4-col paper cards)
   ───────────────────────────────────────────────────────────────────── */
.lib-section {
    padding: 4rem 4rem 1rem;
}
.lib-section + .lib-section { padding-top: 3rem; }
.lib-section:last-of-type { padding-bottom: 4rem; }
.lib-section-head {
    text-align: center;
    max-width: 760px;
    margin: 0 auto 2.4rem;
}
.lib-section-head h2 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 2rem;
    font-weight: 600;
    color: var(--navy);
    margin: 0;
    line-height: 1.2;
}
.lib-grid {
    max-width: 1280px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.4rem;
}
.lib-card {
    background: var(--white);
    border: 1px solid rgba(201,169,110,0.45);
    border-top: 3px solid var(--gold);
    border-radius: 4px;
    padding: 1.1rem 1.1rem 1.2rem;
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    transition: all 0.25s;
    box-shadow: 0 1px 0 rgba(201,169,110,0.12), 0 8px 18px -16px rgba(12,24,41,0.14);
}
.lib-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    margin-top: 0.4rem;
}
.lib-col {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    padding: 0.9rem 1rem;
}
.lib-col-original {
    background: rgba(248,243,232,0.45);
    border-right: 1px dashed rgba(201,169,110,0.45);
    border-radius: 3px 0 0 3px;
}
.lib-col-translation {
    background: var(--white);
    border-radius: 0 3px 3px 0;
}
.lib-col-eyebrow {
    font-size: 0.55rem;
    color: var(--gold-dark);
    letter-spacing: 0.2em;
    text-transform: uppercase;
    font-weight: 700;
}
.lib-col-translation .lib-col-eyebrow { color: var(--navy); opacity: 0.62; }
.lib-col h3 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.02rem;
    font-weight: 600;
    color: var(--navy);
    line-height: 1.3;
    margin: 0;
}
.lib-col .lib-authors {
    font-size: 0.7rem;
    color: var(--text-light);
    line-height: 1.55;
    margin: 0;
    font-style: italic;
}
.lib-plain-snippet {
    font-size: 0.78rem;
    color: var(--text-body);
    line-height: 1.55;
    margin: 0;
    flex: 1;
}
.lib-col .lib-link { margin-top: auto; padding-top: 0.5rem; }
.lib-card:hover {
    border-color: var(--gold);
    box-shadow: 0 1px 0 rgba(201,169,110,0.25), 0 22px 36px -22px rgba(12,24,41,0.30);
    transform: translateY(-2px);
}
.lib-meta {
    font-size: 0.6rem;
    color: var(--gold-dark);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-weight: 700;
}
.lib-meta .lib-journal { color: var(--text-light); font-weight: 600; }
.lib-card h3 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.02rem;
    font-weight: 600;
    color: var(--navy);
    line-height: 1.3;
    margin: 0;
}
.lib-card .lib-authors {
    font-size: 0.7rem;
    color: var(--text-light);
    line-height: 1.55;
    margin: 0;
    font-style: italic;
}
.lib-card .lib-plain {
    font-size: 0.78rem;
    color: var(--text-body);
    line-height: 1.55;
    margin: 0.3rem 0 0;
    flex: 1;
}
.lib-actions {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-top: 0.6rem;
    padding-top: 0.7rem;
    border-top: 1px dashed rgba(201,169,110,0.25);
}
.lib-link {
    font-size: 0.6rem;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    font-weight: 700;
    color: var(--text-light);
    text-decoration: none;
    transition: color 0.2s;
}
.lib-link.primary { color: var(--gold-dark); }
.lib-link:hover { color: var(--gold); }

@media (max-width: 1100px) { .lib-grid { grid-template-columns: 1fr; } }
@media (max-width: 900px) {
    .lib-section { padding: 3rem 1.5rem 1rem; }
    .lib-grid { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
    .lib-split { grid-template-columns: 1fr; }
    .lib-col-original {
        border-right: none;
        border-bottom: 1px dashed rgba(201,169,110,0.45);
        border-radius: 3px 3px 0 0;
    }
    .lib-col-translation { border-radius: 0 0 3px 3px; }
}

/* ─────────────────────────────────────────────────────────────────────
   COMBINED — blog post header refinements
   ───────────────────────────────────────────────────────────────────── */
.post-back-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.65rem;
    color: rgba(255,255,255,0.55);
    text-transform: uppercase;
    letter-spacing: 0.15em;
    font-weight: 600;
    text-decoration: none;
    margin-bottom: 2rem;
    transition: color 0.2s;
}
.post-back-link:hover { color: var(--gold); }
/* Theme badge — restyled as a quiet gold-rule eyebrow over the title, not a pill */
.post-theme-badge {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 0.6rem;
    color: var(--gold);
    padding: 0;
    background: none;
    border: none;
    text-transform: uppercase;
    letter-spacing: 0.22em;
    font-weight: 700;
    margin: 0 0 1rem;
}
.post-theme-badge::before {
    content: '';
    width: 28px;
    height: 1px;
    background: var(--gold);
    flex-shrink: 0;
}

@media (max-width: 900px) {
    .updates-hero { height: auto; min-height: clamp(200px, 40vw, 300px); }
    .updates-hero-content h1 { font-size: 2.1rem; }
    .feed-thumb { height: 180px; }
}

/* ─────────────────────────────────────────────────────────────────────
   COMBINED specialisms — magazine-style section feature openers
   ───────────────────────────────────────────────────────────────────── */
.section-feature {
    max-width: 1080px;
    margin: 0 auto 2.5rem;
    padding: 0 4rem;
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 2.5rem;
    align-items: center;
}
.section-feature.flip > .feature-image { order: 2; }
.section-feature.flip > .spec-block-head { order: 1; }
.section-feature .spec-block-head {
    margin: 0;
    text-align: left;
    max-width: none;
}
.section-feature.flip > .spec-block-head { text-align: right; }
.section-feature.flip > .spec-block-head .spec-eyebrow,
.section-feature.flip > .spec-block-head .spec-lede { text-align: right; }
.feature-image {
    margin: 0;
    aspect-ratio: 1 / 1;
    width: 220px;
    height: 220px;
    position: relative;
    overflow: hidden;
    border-radius: 4px;
    background: var(--cream);
    box-shadow: 0 18px 40px -28px rgba(12,24,41,0.35);
}
.feature-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: saturate(0.92) contrast(1.02);
    transition: transform 1.2s cubic-bezier(.2,.7,.3,1), filter 0.6s;
}
.feature-image:hover img { transform: scale(1.04); filter: saturate(1) contrast(1.04); }
.feature-image::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 65%, rgba(12,24,41,0.18) 100%);
    pointer-events: none;
}
.feature-image figcaption {
    position: absolute;
    bottom: 1rem;
    left: 1rem;
    background: rgba(255,255,255,0.94);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
    padding: 0.55rem 0.95rem;
    border-left: 2px solid var(--gold);
    display: flex;
    align-items: baseline;
    gap: 8px;
    font-size: 0.62rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    z-index: 2;
}
.feature-image figcaption span {
    font-family: 'Cormorant Garamond', serif;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--gold-dark);
    letter-spacing: 0.05em;
}
.feature-image figcaption p {
    margin: 0;
    color: var(--navy);
    font-weight: 600;
}
@media (max-width: 900px) {
    .section-feature {
        grid-template-columns: 1fr;
        gap: 1.6rem;
        padding: 0 1.5rem;
        margin-bottom: 2rem;
    }
    .section-feature.flip > .feature-image { order: 0; }
    .section-feature.flip > .spec-block-head { order: 1; text-align: left; }
    .section-feature.flip > .spec-block-head .spec-eyebrow,
    .section-feature.flip > .spec-block-head .spec-lede { text-align: left; }
    .feature-image { aspect-ratio: 1 / 1; width: 180px; height: 180px; }
}

/* ─────────────────────────────────────────────────────────────────────
   COMBINED research library — chic document icon
   ───────────────────────────────────────────────────────────────────── */
.lib-card { position: relative; }
.lib-card .lib-meta { padding-right: 38px; }
.lib-doc-icon {
    position: absolute;
    top: 1rem;
    right: 1rem;
    width: 22px;
    height: 28px;
    color: var(--gold-dark);
    opacity: 0.55;
    transition: opacity 0.25s, transform 0.3s;
    flex-shrink: 0;
}
.lib-card:hover .lib-doc-icon {
    opacity: 1;
    transform: translateY(-2px);
}

/* ─────────────────────────────────────────────────────────────────────
   COMBINED locations — editorial venues ledger
   Three clinics presented as a vertical, considered ledger rather
   than a grid of cards. TLC (lead venue) gets a full map;
   OS Clinic and Cromwell Hospital use atmospheric monogram
   panels (no fake photography).
   ───────────────────────────────────────────────────────────────────── */
.venues {
    background: var(--white);
    padding: 4rem 1.5rem 5rem;
}
.venues-inner {
    max-width: 1180px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 0;
}
.venue {
    display: grid;
    grid-template-columns: minmax(300px, 1fr) 1.25fr;
    gap: 3rem;
    align-items: stretch;
    padding: 3.5rem 0;
    border-top: 1px solid rgba(12,24,41,0.08);
    position: relative;
}
.venue:first-of-type { border-top: 0; padding-top: 1rem; }
.venue:last-of-type { padding-bottom: 1rem; }
.venue.venue-flip { grid-template-columns: 1.25fr minmax(300px, 1fr); }
.venue.venue-flip .venue-visual { order: 2; }
.venue.venue-flip .venue-body { order: 1; }

/* Lead venue gets bigger visual + map */
.venue.venue-lead {
    grid-template-columns: 1.05fr 1.2fr;
    padding-bottom: 4.5rem;
}

/* ── Visual panel ── */
.venue-visual {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-height: 320px;
}
.venue-monogram {
    position: relative;
    flex: 1;
    min-height: 240px;
    background:
        radial-gradient(ellipse at 25% 20%, rgba(201,169,110,0.18) 0%, transparent 55%),
        radial-gradient(ellipse at 80% 85%, rgba(201,169,110,0.10) 0%, transparent 60%),
        linear-gradient(135deg, var(--navy) 0%, var(--navy-light) 60%, #060d18 100%);
    border-radius: 2px;
    overflow: hidden;
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    padding: 1.6rem 1.8rem;
}
.venue-monogram::before {
    content: '';
    position: absolute;
    inset: 0;
    background: repeating-linear-gradient(
        135deg,
        rgba(201,169,110,0.05) 0 1px,
        transparent 1px 60px
    );
    pointer-events: none;
}
.venue-monogram::after {
    content: '';
    position: absolute;
    top: 1.6rem;
    right: 1.6rem;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(201,169,110,0.4);
    border-radius: 50%;
    background:
        radial-gradient(circle at 50% 50%, rgba(201,169,110,0.18) 0%, transparent 70%);
}
.venue-monogram.alt {
    background:
        radial-gradient(ellipse at 80% 20%, rgba(201,169,110,0.22) 0%, transparent 55%),
        radial-gradient(ellipse at 20% 90%, rgba(255,255,255,0.05) 0%, transparent 60%),
        linear-gradient(225deg, var(--navy-light) 0%, var(--navy) 70%, #060d18 100%);
}
.venue-num {
    position: absolute;
    top: 1.4rem;
    left: 1.8rem;
    font-family: 'Cormorant Garamond', serif;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.3em;
    color: var(--gold);
    text-transform: uppercase;
}
.venue-num::before {
    content: '';
    display: inline-block;
    width: 22px;
    height: 1px;
    background: var(--gold);
    vertical-align: middle;
    margin-right: 8px;
    transform: translateY(-2px);
}
.venue-mono {
    position: relative;
    font-family: 'Cormorant Garamond', serif;
    font-size: 5.5rem;
    font-weight: 300;
    line-height: 0.85;
    color: var(--gold-light);
    letter-spacing: -0.02em;
    text-shadow: 0 2px 24px rgba(0,0,0,0.4);
}

/* ── Real exterior photo (replaces monogram when available) ── */
.venue-image {
    position: relative;
    flex: 1;
    margin: 0;
    min-height: 240px;
    aspect-ratio: 4 / 3;
    border-radius: 2px;
    overflow: hidden;
    background: var(--cream);
    box-shadow: 0 18px 36px -28px rgba(12,24,41,0.4);
}
.venue-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    filter: saturate(0.94) contrast(1.02);
    transition: transform 1.2s cubic-bezier(.2,.7,.3,1), filter 0.6s;
}
.venue-image:hover img { transform: scale(1.03); filter: saturate(1) contrast(1.05); }
.venue-image::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 60%, rgba(12,24,41,0.28) 100%);
    pointer-events: none;
}
.venue-image .venue-num {
    z-index: 2;
    color: #fff;
    text-shadow: 0 2px 8px rgba(0,0,0,0.6);
}
.venue-image .venue-num::before { background: var(--gold); }

/* ── Map (lead venue only) ── */
.venue-map {
    height: 220px;
    border-radius: 2px;
    overflow: hidden;
    border: 1px solid rgba(12,24,41,0.1);
    background: var(--cream);
    position: relative;
}
.venue-map iframe {
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
    filter: saturate(0.85) contrast(0.95);
}

/* ── Body / editorial column ── */
.venue-body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0.5rem 0;
}
.venue-eyebrow {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    margin-bottom: 1.1rem;
    flex-wrap: wrap;
}
.venue-tag {
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--navy);
    background: var(--gold);
    padding: 6px 12px;
    border-radius: 2px;
}
.venue.venue-lead .venue-tag {
    background: var(--navy);
    color: var(--gold);
}
.venue-role {
    font-size: 0.72rem;
    font-weight: 500;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--gold-dark);
}
.venue-name {
    font-family: 'Cormorant Garamond', serif;
    font-size: 2.6rem;
    font-weight: 400;
    line-height: 1.05;
    color: var(--navy);
    margin: 0 0 0.6rem;
    letter-spacing: -0.005em;
}
.venue.venue-lead .venue-name {
    font-size: 3rem;
}
.venue-address {
    font-size: 0.85rem;
    color: var(--text-body, #364252);
    line-height: 1.55;
    margin: 0 0 1.2rem;
}
.venue-address-sub {
    font-size: 0.78rem;
    color: var(--text-light, #6a7589);
}
.venue-address-note {
    font-style: italic;
    color: var(--text-light, #6a7589);
    font-size: 0.82rem;
}
.venue-lede {
    font-size: 0.95rem;
    line-height: 1.7;
    color: var(--text-body, #364252);
    margin: 0 0 1.5rem;
    max-width: 560px;
}
.venue-lede strong { color: var(--navy); font-weight: 600; }

/* ── Facts list ── */
.venue-facts {
    margin: 0 0 1.6rem;
    padding: 1.1rem 0 0;
    border-top: 1px solid rgba(12,24,41,0.08);
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}
.venue-facts > div {
    display: grid;
    grid-template-columns: 130px 1fr;
    gap: 1rem;
    align-items: baseline;
}
.venue-facts dt {
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--gold-dark);
    margin: 0;
}
.venue-facts dd {
    font-size: 0.85rem;
    color: var(--text-body, #364252);
    margin: 0;
    line-height: 1.5;
}

/* ── Action links ── */
.venue-actions {
    display: flex;
    gap: 1.6rem;
    flex-wrap: wrap;
    align-items: center;
    margin-top: 0.4rem;
}
.venue-link {
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--navy);
    text-decoration: none;
    padding-bottom: 4px;
    border-bottom: 1px solid rgba(12,24,41,0.2);
    transition: color 0.25s, border-color 0.25s, transform 0.25s;
}
.venue-link:hover {
    color: var(--gold-dark);
    border-bottom-color: var(--gold);
}
.venue-link.primary {
    color: var(--gold-dark);
    border-bottom-color: var(--gold);
}
.venue-link.primary:hover {
    color: var(--navy);
    border-bottom-color: var(--navy);
}

/* ── Responsive ── */
@media (max-width: 960px) {
    .venues { padding: 3rem 1.25rem 3.5rem; }
    .venue,
    .venue.venue-lead,
    .venue.venue-flip {
        grid-template-columns: 1fr;
        gap: 1.8rem;
        padding: 2.5rem 0;
    }
    .venue.venue-flip .venue-visual { order: 1; }
    .venue.venue-flip .venue-body { order: 2; }
    .venue-visual { min-height: 220px; }
    .venue-monogram { min-height: 200px; }
    .venue-image { min-height: 200px; aspect-ratio: 16 / 10; }
    .venue-mono { font-size: 4.5rem; }
    .venue-name,
    .venue.venue-lead .venue-name { font-size: 2rem; }
    .venue-map { height: 200px; }
    .venue-facts > div { grid-template-columns: 110px 1fr; gap: 0.8rem; }
}
@media (max-width: 560px) {
    .venue-mono { font-size: 3.6rem; }
    .venue-num { font-size: 0.62rem; left: 1.3rem; top: 1.1rem; }
    .venue-num::before { width: 16px; }
    .venue-monogram { padding: 1.2rem 1.3rem; }
    .venue-actions { gap: 1rem; }
    .venue-link { font-size: 0.72rem; letter-spacing: 0.1em; }
    .venue-facts > div { grid-template-columns: 1fr; gap: 0.2rem; }
    .venue-facts dt { font-size: 0.6rem; }
}

/* ============================================================
   RESEARCH FILTER STRIP — multi-axis filtering on /research
   ============================================================ */
.research-filters {
    background: var(--cream);
    border-top: 1px solid rgba(201,169,110,0.18);
    border-bottom: 1px solid rgba(201,169,110,0.18);
    padding: 1.4rem 2rem 1.2rem;
}
.research-filters-inner {
    max-width: 1280px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
}
.research-filter-row {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    flex-wrap: wrap;
}
.research-filter-row-pills { gap: 0.3rem; }
.research-filter-label {
    font-size: 0.6rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--gold-dark);
    margin-right: 0.5rem;
}
.research-search {
    flex: 1 1 320px;
    min-width: 240px;
    padding: 0.65rem 0.95rem;
    font-family: inherit;
    font-size: 0.86rem;
    border: 1px solid rgba(12,24,41,0.18);
    border-radius: 4px;
    background: var(--white);
    color: var(--text-dark);
    transition: border 0.18s, box-shadow 0.18s;
}
.research-search:focus {
    outline: none;
    border-color: var(--gold);
    box-shadow: 0 0 0 3px rgba(201,169,110,0.18);
}
.research-journal-select,
.research-sort-select {
    padding: 0.6rem 0.85rem;
    font-family: inherit;
    font-size: 0.78rem;
    border: 1px solid rgba(12,24,41,0.18);
    border-radius: 4px;
    background: var(--white);
    color: var(--text-dark);
    cursor: pointer;
    max-width: 240px;
}
.research-pills,
.research-yearpills,
.research-rolepills {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
}
.research-pill,
.research-yearpill,
.research-rolepill {
    padding: 0.42rem 0.85rem;
    font-family: inherit;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    border: 1px solid rgba(12,24,41,0.18);
    border-radius: 50px;
    background: transparent;
    color: var(--text-body);
    cursor: pointer;
    transition: all 0.16s;
}
.research-pill:hover,
.research-yearpill:hover,
.research-rolepill:hover {
    border-color: var(--gold);
    color: var(--navy);
}
.research-pill.active,
.research-yearpill.active,
.research-rolepill.active {
    background: var(--navy);
    color: var(--white);
    border-color: var(--navy);
}
/* Self-validating pills: pills whose count would be 0 are dimmed and inert. */
.research-pill[data-disabled="1"],
.research-yearpill[data-disabled="1"],
.research-rolepill[data-disabled="1"] {
    opacity: 0.35;
    pointer-events: none;
    cursor: default;
}
.research-result-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding-top: 0.4rem;
    border-top: 1px dashed rgba(201,169,110,0.3);
    margin-top: 0.3rem;
}
.research-count {
    font-size: 0.74rem;
    color: var(--text-body);
    letter-spacing: 0.04em;
}
.research-clear,
.research-clear-inline {
    background: transparent;
    border: 0;
    padding: 0;
    font-family: inherit;
    font-size: 0.74rem;
    color: var(--gold-dark);
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.research-clear:hover,
.research-clear-inline:hover { color: var(--gold); }
.research-pending-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.72rem;
    letter-spacing: 0.03em;
    color: var(--text-body);
    cursor: pointer;
    user-select: none;
}
.research-pending-toggle input {
    appearance: none;
    -webkit-appearance: none;
    width: 14px;
    height: 14px;
    border: 1.5px solid rgba(201,169,110,0.55);
    border-radius: 3px;
    background: #fff;
    cursor: pointer;
    position: relative;
    margin: 0;
    flex-shrink: 0;
}
.research-pending-toggle input:checked {
    background: var(--gold-dark);
    border-color: var(--gold-dark);
}
.research-pending-toggle input:checked::after {
    content: '';
    position: absolute;
    left: 3px;
    top: -1px;
    width: 4px;
    height: 8px;
    border: solid #fff;
    border-width: 0 1.5px 1.5px 0;
    transform: rotate(45deg);
}
.research-pending-toggle:hover input { border-color: var(--gold); }
.research-empty {
    max-width: 760px;
    margin: 2rem auto 4rem;
    padding: 1.6rem 1.4rem;
    background: var(--cream);
    border: 1px dashed rgba(201,169,110,0.42);
    border-radius: 4px;
    text-align: center;
    color: var(--text-body);
}
.research-empty p { margin: 0; font-size: 0.9rem; }
.research-empty strong { color: var(--navy); }
/* Minimised inline empty-state — only used when free-text search has no matches.
   Pill filters are self-validating, so the prominent panel is no longer needed. */
.research-empty.research-empty-inline {
    max-width: 600px;
    margin: 1.2rem auto 2.4rem;
    padding: 0.9rem 1.2rem;
    background: transparent;
    border: 1px dashed rgba(201,169,110,0.35);
    color: var(--text-muted, var(--text-body));
}
.research-empty.research-empty-inline p { font-size: 0.78rem; letter-spacing: 0.01em; }

.lib-card .lib-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 0.45rem;
    align-items: center;
}
.lib-theme-tag,
.lib-role-tag {
    background: rgba(12,24,41,0.06);
    color: var(--navy);
    padding: 0.15rem 0.55rem;
    border-radius: 50px;
    font-size: 0.55rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
.lib-link-pending {
    color: var(--text-light) !important;
    font-style: italic;
    font-weight: 500 !important;
}

@media (max-width: 720px) {
    .research-filters { padding: 1rem 1.2rem; }
    .research-search { flex: 1 1 100%; }
    .research-journal-select,
    .research-sort-select { flex: 1 1 calc(50% - 0.4rem); max-width: none; }
    .research-result-row { flex-direction: column; align-items: flex-start; gap: 0.5rem; }
}

/* ============================================================
   ACADEMIC TRANSLATION PAGE — /translations/<slug>.html
   ============================================================ */
.trans-header {
    background: var(--navy);
    color: var(--white);
    padding: calc(104px + 1.4rem) 2.4rem 1rem;
    border-bottom: 2px solid var(--gold);
}
.trans-header-inner {
    max-width: 1180px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}
.trans-header-left {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}
.trans-stamp {
    font-family: 'Cormorant Garamond', serif;
    font-style: italic;
    font-weight: 500;
    font-size: 0.95rem;
    color: var(--gold-light);
    letter-spacing: 0.02em;
}
.trans-theme-tag {
    background: rgba(255,255,255,0.08);
    color: var(--gold-light);
    padding: 0.22rem 0.68rem;
    border-radius: 50px;
    font-size: 0.6rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    font-weight: 700;
}
.trans-header-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.18rem;
    font-size: 0.74rem;
    color: rgba(255,255,255,0.75);
    font-family: 'Inter', sans-serif;
}
.trans-id-line a {
    color: var(--gold-light);
    text-decoration: none;
    border-bottom: 1px dotted rgba(201,169,110,0.45);
}
.trans-id-line a:hover { color: var(--white); border-bottom-color: var(--gold); }
.trans-id-label {
    color: rgba(255,255,255,0.55);
    font-weight: 700;
    letter-spacing: 0.08em;
    margin-right: 0.4rem;
}

.trans-titleblock {
    background: var(--cream);
    padding: 2.6rem 2.4rem 2.2rem;
    border-bottom: 1px solid rgba(201,169,110,0.22);
}
.trans-titleblock-inner {
    max-width: 1180px;
    margin: 0 auto;
}
.trans-citation {
    font-family: 'Inter', sans-serif;
    font-size: 0.78rem;
    color: var(--text-body);
    margin: 0 0 1rem;
    line-height: 1.6;
    padding: 0.6rem 0.9rem;
    background: var(--white);
    border-left: 2px solid var(--gold);
    border-radius: 2px;
}
.trans-citation em {
    font-style: italic;
    color: var(--navy);
}
.trans-title {
    font-family: 'Cormorant Garamond', serif;
    font-size: 2.2rem;
    font-weight: 600;
    color: var(--navy);
    line-height: 1.2;
    margin: 0 0 0.7rem;
    letter-spacing: -0.01em;
}
.trans-authors {
    font-family: 'Inter', sans-serif;
    font-size: 0.85rem;
    color: var(--text-body);
    line-height: 1.55;
    margin: 0;
}
.trans-auth-role {
    color: var(--gold-dark);
    font-weight: 600;
    margin-left: 0.4rem;
    font-size: 0.75rem;
}

.trans-body {
    background: var(--white);
    padding: 2.6rem 2.4rem 3.2rem;
}
.trans-body-grid {
    max-width: 1180px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 3rem;
}
.trans-leadin {
    padding: 0.9rem 1.1rem;
    background: var(--cream);
    border-left: 3px solid var(--gold);
    border-radius: 2px;
    margin-bottom: 1.8rem;
}
.trans-leadin p {
    font-family: 'Inter', sans-serif;
    font-size: 0.86rem;
    line-height: 1.65;
    color: var(--text-body);
    margin: 0;
    font-style: italic;
}
.trans-section {
    margin-bottom: 2rem;
}
.trans-section h2 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.55rem;
    font-weight: 600;
    color: var(--navy);
    line-height: 1.25;
    margin: 0 0 0.7rem;
    border-bottom: 1px solid rgba(201,169,110,0.4);
    padding-bottom: 0.3rem;
}
.trans-section h3 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.15rem;
    font-weight: 600;
    color: var(--navy);
    margin: 1.2rem 0 0.5rem;
}
.trans-section p {
    font-family: 'Inter', sans-serif;
    font-size: 0.92rem;
    line-height: 1.72;
    color: var(--text-dark);
    margin: 0 0 0.85rem;
}
.trans-section p strong {
    color: var(--navy);
    font-weight: 600;
}
.trans-pending {
    padding: 1.6rem 1.5rem;
    background: var(--cream);
    border-radius: 4px;
    border: 1px dashed rgba(201,169,110,0.55);
}
.trans-pending h2 {
    border-bottom: none;
    font-style: italic;
    color: var(--gold-dark);
    margin-bottom: 0.4rem;
}
.trans-pending h3 {
    font-size: 1rem;
    color: var(--text-body);
    margin-top: 1.2rem;
}
.trans-abstract {
    font-family: 'Inter', sans-serif;
    font-size: 0.84rem;
    color: var(--text-body);
    line-height: 1.65;
    background: var(--white);
    padding: 0.9rem 1.1rem;
    border-radius: 3px;
    border: 1px solid rgba(12,24,41,0.06);
}
.trans-footnote {
    margin-top: 2.6rem;
    padding-top: 1.4rem;
    border-top: 2px solid var(--gold);
}
.trans-source {
    font-family: 'Inter', sans-serif;
    font-size: 0.78rem;
    color: var(--text-body);
    line-height: 1.6;
    margin: 0 0 1rem;
    font-style: italic;
}
.trans-source strong {
    font-style: normal;
    color: var(--navy);
}
.trans-original-btn {
    display: inline-block;
    padding: 0.55rem 1rem;
    margin-right: 0.6rem;
    background: var(--navy);
    color: var(--white);
    text-decoration: none;
    border-radius: 4px;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    transition: background 0.16s;
}
.trans-original-btn:hover { background: var(--gold-dark); }
.trans-oa-btn {
    display: inline-block;
    padding: 0.55rem 1rem;
    margin-right: 0.6rem;
    background: var(--gold);
    color: var(--navy);
    text-decoration: none;
    border-radius: 4px;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    transition: background 0.16s, transform 0.16s;
}
.trans-oa-btn:hover { background: var(--gold-light); transform: translateY(-1px); }
.trans-back {
    display: inline-block;
    color: var(--gold-dark);
    text-decoration: none;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.04em;
}
.trans-back:hover { color: var(--gold); }

.trans-sidebar {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    align-self: start;
    position: sticky;
    top: 2rem;
}
.trans-sidebar-block {
    background: var(--cream);
    border: 1px solid rgba(201,169,110,0.22);
    border-radius: 4px;
    padding: 1rem 1.1rem;
}
.trans-sidebar-h {
    font-size: 0.6rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--gold-dark);
    margin-bottom: 0.5rem;
}
.trans-cite {
    font-family: 'Inter', sans-serif;
    font-size: 0.74rem;
    line-height: 1.55;
    color: var(--text-body);
    margin: 0;
    word-break: break-word;
}
.trans-sidebar-block .trans-id-line {
    font-size: 0.78rem;
    color: var(--text-body);
    margin-bottom: 0.3rem;
    align-items: center;
    display: flex;
    gap: 0.4rem;
    flex-wrap: wrap;
}
.trans-sidebar-block .trans-id-line a {
    color: var(--gold-dark);
    text-decoration: none;
    border-bottom: 1px dotted rgba(201,169,110,0.35);
    word-break: break-all;
}
.trans-sidebar-block .trans-id-line a:hover { color: var(--gold); }
.trans-sidebar-block .trans-id-label {
    color: var(--gold-dark);
    margin-right: 0;
}
.trans-kw-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.32rem;
}
.trans-kw {
    background: var(--white);
    border: 1px solid rgba(12,24,41,0.1);
    color: var(--text-body);
    padding: 0.22rem 0.62rem;
    border-radius: 50px;
    font-size: 0.66rem;
    letter-spacing: 0.04em;
}
.trans-auth-name {
    font-family: 'Inter', sans-serif;
    font-size: 0.82rem;
    color: var(--text-dark);
    margin: 0;
}

@media (max-width: 980px) {
    .trans-body-grid { grid-template-columns: 1fr; gap: 2rem; }
    .trans-sidebar { position: static; order: 2; }
}
@media (max-width: 720px) {
    .trans-header { padding: 0.7rem 1.2rem; }
    .trans-titleblock { padding: 1.8rem 1.2rem 1.5rem; }
    .trans-title { font-size: 1.65rem; }
    .trans-body { padding: 1.6rem 1.2rem 2rem; }
    .trans-section h2 { font-size: 1.3rem; }
    .trans-header-right { align-items: flex-start; }
}

/* ============================================================
   TRANSLATIONS INDEX — /translations/index.html
   Theme-grouped landing page. Mirrors publications.html palette:
   cream background, navy text, gold accents.
   ============================================================ */
.trans-idx-section {
    background: var(--cream);
    padding: 3rem 2rem 4rem;
}
.trans-idx-inner {
    max-width: 1180px;
    margin: 0 auto;
}
.trans-idx-intro {
    font-size: 0.9rem;
    color: var(--text-body);
    max-width: 760px;
    margin: 0 0 2.4rem;
    line-height: 1.6;
}
.trans-idx-group {
    margin-bottom: 2.6rem;
    border-top: 1px solid rgba(12,24,41,0.08);
    padding-top: 1.6rem;
}
.trans-idx-group:first-of-type {
    border-top: 0;
    padding-top: 0;
}
.trans-idx-group-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}
.trans-idx-group-head h2 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.7rem;
    font-weight: 500;
    color: var(--navy);
    margin: 0;
    letter-spacing: 0.01em;
}
.trans-idx-group-count {
    font-size: 0.7rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--gold-dark);
    font-weight: 600;
}
.trans-idx-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 0.9rem;
}
.trans-idx-item a {
    display: block;
    background: #fff;
    border: 1px solid rgba(12,24,41,0.08);
    border-radius: 6px;
    padding: 1rem 1.1rem;
    text-decoration: none;
    color: var(--navy);
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
    height: 100%;
}
.trans-idx-item a:hover {
    border-color: var(--gold);
    box-shadow: 0 6px 20px rgba(12,24,41,0.06);
    transform: translateY(-1px);
}
.trans-idx-meta {
    font-size: 0.65rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--text-light);
    margin-bottom: 0.4rem;
    font-weight: 600;
}
.trans-idx-year {
    color: var(--gold-dark);
}
.trans-idx-title {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.05rem;
    font-weight: 500;
    line-height: 1.3;
    color: var(--navy);
    margin: 0 0 0.7rem;
}
.trans-idx-cta {
    font-size: 0.72rem;
    letter-spacing: 0.06em;
    color: var(--gold-dark);
    font-weight: 600;
}
.trans-idx-item-pending a {
    background: rgba(12,24,41,0.025);
    border-style: dashed;
}
.trans-idx-item-pending .trans-idx-title {
    color: var(--text-body);
    font-style: italic;
}
.trans-idx-item-pending .trans-idx-cta {
    color: var(--text-light);
    font-style: italic;
    font-weight: 500;
}
.trans-idx-foot {
    margin-top: 2.4rem;
    text-align: center;
}
.trans-idx-foot .trans-back {
    color: var(--gold-dark);
    text-decoration: none;
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.04em;
}
.trans-idx-foot .trans-back:hover {
    color: var(--gold);
}

@media (max-width: 720px) {
    .trans-idx-section { padding: 2rem 1.2rem 3rem; }
    .trans-idx-list { grid-template-columns: 1fr; }
}

/* ─────────────────────────────────────────────────────────────────────
   Accessibility — skip link + global focus-visible
   ───────────────────────────────────────────────────────────────────── */
.skip-link {
    position: absolute;
    left: 1rem;
    top: 0;
    transform: translateY(-120%);
    z-index: 1000;
    background: var(--navy);
    color: var(--gold-light);
    padding: 0.7rem 1.1rem;
    font-family: 'Inter', sans-serif;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none;
    border: 2px solid var(--gold);
    border-radius: 4px;
    transition: transform 0.2s;
}
.skip-link:focus,
.skip-link:focus-visible {
    transform: translateY(0.6rem);
    outline: none;
}

/* Global focus-visible — gold outline on any interactive element */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: 2px solid var(--gold);
    outline-offset: 2px;
    border-radius: 2px;
}

/* ─────────────────────────────────────────────────────────────────────
   Custom 404 — uses .four04-* prefix to avoid CSS Modules-style clashes
   ───────────────────────────────────────────────────────────────────── */
.four04-grid {
    max-width: 1100px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.2rem;
    padding: 0 1rem;
}
.four04-card {
    background: var(--white);
    border: 1px solid rgba(201,169,110,0.22);
    border-left: 3px solid var(--gold);
    border-radius: 4px;
    padding: 1.6rem 1.4rem 1.7rem;
    text-decoration: none;
    color: var(--text-dark);
    transition: all 0.25s;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}
.four04-card:hover {
    border-color: var(--gold);
    transform: translateY(-3px);
    box-shadow: 0 18px 38px -22px rgba(12,24,41,0.32);
}
.four04-card .four04-eyebrow {
    font-size: 0.65rem;
    color: var(--gold-dark);
    text-transform: uppercase;
    letter-spacing: 0.16em;
    font-weight: 700;
}
.four04-card h2 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--navy);
    line-height: 1.2;
    margin: 0;
}
.four04-card p {
    font-size: 0.82rem;
    color: var(--text-body);
    line-height: 1.55;
    margin: 0;
}
.four04-search {
    max-width: 560px;
    margin: 2rem auto 0;
    padding: 0 1rem;
    text-align: center;
}
.four04-search p {
    font-size: 0.88rem;
    color: var(--text-body);
    margin: 0 0 0.5rem;
}
.four04-search a {
    color: var(--gold-dark);
    font-weight: 600;
    text-decoration: none;
    border-bottom: 1px solid rgba(201,169,110,0.35);
}
.four04-search a:hover { color: var(--gold); }
@media (max-width: 1100px) {
    .four04-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
    .four04-grid { grid-template-columns: 1fr; }
}

/* ─────────────────────────────────────────────────────────────────────
   Site search — /search.html (uses .form-grid for the input)
   ───────────────────────────────────────────────────────────────────── */
.site-search-form { margin-bottom: 1.6rem; }
.site-search-form input[type="search"] {
    font-size: 1rem;
    padding: 14px 16px;
}
.ss-meta {
    margin-top: 0.7rem;
    font-size: 0.78rem;
    color: var(--text-body);
    letter-spacing: 0.04em;
}

.ss-results {
    max-width: 720px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.4rem;
}
.ss-group { }
.ss-group-head {
    font-family: 'Inter', sans-serif;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--gold-dark);
    margin: 0 0 0.6rem;
    padding-bottom: 0.4rem;
    border-bottom: 1px solid rgba(201,169,110,0.32);
}
.ss-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.ss-item {
    border: 1px solid #e8e3db;
    border-left: 3px solid transparent;
    background: var(--white);
    border-radius: 4px;
    transition: border-color 0.25s, transform 0.25s, box-shadow 0.25s;
}
.ss-item:hover,
.ss-item.active {
    border-left-color: var(--gold);
    box-shadow: 0 4px 14px rgba(15,32,55,0.06);
}
.ss-link {
    display: block;
    padding: 0.9rem 1.1rem;
    text-decoration: none;
    color: var(--text-dark);
}
.ss-link:hover { text-decoration: none; }
.ss-title {
    display: block;
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.15rem;
    font-weight: 600;
    color: var(--navy);
    line-height: 1.25;
    margin-bottom: 0.25rem;
}
.ss-excerpt {
    display: block;
    font-size: 0.85rem;
    color: var(--text-body);
    line-height: 1.5;
}
.ss-results mark {
    background: rgba(201,169,110,0.28);
    color: inherit;
    padding: 0 1px;
    border-radius: 2px;
}
@media (max-width: 600px) {
    .ss-link { padding: 0.8rem 0.9rem; }
    .ss-title { font-size: 1.05rem; }
    .ss-excerpt { font-size: 0.8rem; }
}

/* ─────────────────────────────────────────────────────────────────────
   Print stylesheet — clean black-on-white handout
   ───────────────────────────────────────────────────────────────────── */
@media print {
    /* Hide chrome */
    .site-nav,
    .footer,
    .share-row,
    .share-row-label,
    .nav-right,
    .credential-bar,
    .channel-stats,
    .cta-banner,
    .anchor-bar,
    .cond-nav-strip,
    .skip-link,
    .video-embed,
    iframe,
    .video-grid,
    .media-cinema,
    .media-shorts,
    .media-archive,
    .media-stories,
    .media-press,
    .media-podcasts,
    .media-enquiry,
    .nav-phone,
    .social-icons,
    .foot-social,
    .feed-card-wrap .share-row,
    .conditions-ribbon,
    .submenu {
        display: none !important;
    }

    /* Reset to clean black-on-white */
    html, body {
        background: #fff !important;
        color: #000 !important;
        font-size: 11pt;
        line-height: 1.45;
    }

    body * {
        background: transparent !important;
        color: #000 !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }

    /* Constrain hero so it doesn't dominate */
    .page-hero {
        min-height: 0 !important;
        padding: 1rem 0 1.2rem !important;
        background: #fff !important;
    }
    .page-hero::after { display: none !important; }
    .page-hero-img { display: none !important; }
    .page-hero h1,
    .page-hero h1 strong {
        color: #000 !important;
        font-style: normal !important;
    }

    /* Section spacing */
    .section { padding: 1rem 0 !important; }
    section { page-break-inside: avoid; }
    h1, h2, h3, h4 { page-break-after: avoid; color: #000 !important; }
    h1 { font-size: 22pt; }
    h2 { font-size: 16pt; }
    h3 { font-size: 13pt; }

    /* Expanded link underlines */
    a {
        color: #000 !important;
        text-decoration: underline !important;
    }
    a[href^="http"]::after {
        content: " (" attr(href) ")";
        font-size: 9pt;
        font-style: italic;
        color: #333 !important;
        word-break: break-all;
    }
    a[href^="mailto:"]::after,
    a[href^="tel:"]::after,
    a[href^="#"]::after { content: ""; }

    /* Avoid orphan images blowing the page */
    img { max-width: 100% !important; page-break-inside: avoid; }

    /* Buttons render as plain text */
    .btn-gold, .btn-ghost, .nav-cta {
        background: transparent !important;
        border: 1px solid #000 !important;
        color: #000 !important;
        padding: 0.2rem 0.5rem !important;
        font-weight: 600;
    }
}

/* "Last updated" line on generated condition + treatment pages and the
   research/updates listings — small and quiet, sits above the CTA banner. */
.page-lastmod {
    text-align: center;
    margin: 0.4rem auto 1.2rem;
    font-size: 0.65rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--text-light, rgba(12,24,41,0.5));
}

/* ───────────────────────────────────────────────────────────────
   Publications-book CTA card (sits at top of /research)
   ─────────────────────────────────────────────────────────────── */
.pubs-cta-card {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 0;
    align-items: stretch;
    background: linear-gradient(135deg, var(--navy) 0%, #11233e 100%);
    color: #fff;
    border-radius: 10px;
    overflow: hidden;
    margin: 1.5rem auto 0;
    max-width: 1080px;
    text-decoration: none;
    position: relative;
    box-shadow: 0 20px 50px -20px rgba(12,24,41,0.45);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.pubs-cta-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 28px 60px -22px rgba(12,24,41,0.55);
}
.pubs-cta-card::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at 78% 30%, rgba(201,169,110,0.18) 0%, transparent 60%);
    pointer-events: none;
}
.pubs-cta-text {
    padding: 1.8rem 2rem 1.8rem 2.2rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    z-index: 1;
}
.pubs-cta-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 0.6rem;
    color: var(--gold);
    text-transform: uppercase;
    letter-spacing: 0.22em;
    font-weight: 700;
    margin-bottom: 0.7rem;
}
.pubs-cta-eyebrow::before {
    content: '';
    width: 22px;
    height: 1px;
    background: var(--gold);
}
.pubs-cta-text h2 {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 500;
    font-size: 1.85rem;
    line-height: 1.1;
    color: #fff;
    margin: 0 0 0.6rem;
}
.pubs-cta-text h2 em {
    font-style: italic;
    color: var(--gold-light);
    font-weight: 600;
}
.pubs-cta-text p {
    font-size: 0.85rem;
    color: rgba(255,255,255,0.78);
    line-height: 1.6;
    margin: 0 0 1rem;
}
.pubs-cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--gold);
    color: var(--navy);
    font-weight: 700;
    font-size: 0.7rem;
    letter-spacing: 0.13em;
    text-transform: uppercase;
    padding: 0.7rem 1.2rem;
    border-radius: 50px;
    align-self: flex-start;
    transition: background 0.2s, transform 0.2s;
}
.pubs-cta-card:hover .pubs-cta-btn {
    background: var(--gold-light);
    transform: translateX(2px);
}
.pubs-cta-illus {
    background: linear-gradient(180deg, #1a2d45 0%, #0c1829 100%);
    position: relative;
    overflow: hidden;
    min-height: 220px;
    z-index: 1;
}
/* Stylised "open book" hint built in CSS — no image dependency */
.pubs-cta-illus::before,
.pubs-cta-illus::after {
    content: '';
    position: absolute;
    top: 18%;
    bottom: 18%;
    width: 36%;
    background: var(--cream);
    box-shadow: 0 14px 30px -10px rgba(0,0,0,0.55);
    border-radius: 2px 6px 6px 2px;
    background-image:
        linear-gradient(transparent 18%, rgba(12,24,41,0.07) 19%, rgba(12,24,41,0.07) 20%, transparent 21%),
        linear-gradient(transparent 30%, rgba(12,24,41,0.07) 31%, rgba(12,24,41,0.07) 32%, transparent 33%),
        linear-gradient(transparent 42%, rgba(12,24,41,0.07) 43%, rgba(12,24,41,0.07) 44%, transparent 45%),
        linear-gradient(transparent 54%, rgba(12,24,41,0.07) 55%, rgba(12,24,41,0.07) 56%, transparent 57%),
        linear-gradient(transparent 66%, rgba(12,24,41,0.07) 67%, rgba(12,24,41,0.07) 68%, transparent 69%),
        linear-gradient(transparent 78%, rgba(12,24,41,0.07) 79%, rgba(12,24,41,0.07) 80%, transparent 81%);
    background-size: 100% 100%;
    background-repeat: no-repeat;
}
.pubs-cta-illus::before {
    left: 12%;
    transform: perspective(800px) rotateY(18deg);
    transform-origin: right center;
    border-radius: 6px 2px 2px 6px;
}
.pubs-cta-illus::after {
    right: 12%;
    transform: perspective(800px) rotateY(-18deg);
    transform-origin: left center;
}
@media (max-width: 720px) {
    .pubs-cta-card { grid-template-columns: 1fr; }
    .pubs-cta-illus { min-height: 140px; order: -1; }
    .pubs-cta-text { padding: 1.4rem 1.4rem 1.6rem; }
    .pubs-cta-text h2 { font-size: 1.45rem; }
}

/* ───────────────────────────────────────────────────────────────
   Scroll-reveal — fade up from below. Driven by lib/scroll-reveal.js
   adding .is-revealed when an element enters the viewport.

   Honours prefers-reduced-motion at the rule level too, so even if
   the JS adds the class users see no transform / no opacity change.
   ─────────────────────────────────────────────────────────────── */
.reveal-up {
    opacity: 0;
    transform: translateY(16px);
    transition: opacity 600ms ease-out, transform 600ms ease-out;
    will-change: opacity, transform;
}
.reveal-up.is-revealed {
    opacity: 1;
    transform: none;
}
@media (prefers-reduced-motion: reduce) {
    .reveal-up,
    .reveal-up.is-revealed {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}

/* ───────────────────────────────────────────────────────────────
   Page-corner curl — subtle hover effect for paper / update cards.
   Top-right corner gently lifts (1.5px) and a soft shadow appears
   to suggest a page about to turn. Pure CSS, GPU-friendly.
   ─────────────────────────────────────────────────────────────── */
/* .latest-pub-card detached from corner-curl — its ::before is used for the
 image strip in the featured-card book-spread layout. .update-card keeps
 the corner curl since it doesn't have the image-strip treatment. */
.update-card {
    position: relative;
    overflow: hidden;
}
.update-card::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 0 14px 14px;
    border-color: transparent transparent rgba(201,169,110,0.0) transparent;
    transition: border-width 200ms ease-out, border-color 200ms ease-out, filter 200ms ease-out;
    pointer-events: none;
    z-index: 2;
}
.update-card:hover::before {
    border-width: 0 0 22px 22px;
    border-color: transparent transparent rgba(201,169,110,0.55) transparent;
    filter: drop-shadow(-2px 2px 2px rgba(12,24,41,0.18));
}
.update-card::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 14px 14px 0;
    border-color: transparent #f5efe2 transparent transparent;
    transition: border-width 200ms ease-out;
    pointer-events: none;
    z-index: 1;
    opacity: 0;
}
.update-card:hover::after {
    border-width: 0 22px 22px 0;
    opacity: 1;
}
@media (prefers-reduced-motion: reduce) {
    .update-card::before, .update-card::after { transition: none !important; }
}

/* ───────────────────────────────────────────────────────────────
   Research card "book spread" — small version of the Publications
   Book opening spread: theme-keyed image on the left, citation +
   original/plain-English split on the right. Image is rendered as
   .lib-card::before with background keyed to data-theme.
   ─────────────────────────────────────────────────────────────── */
.lib-card {
    position: relative;
    overflow: hidden;
    padding-left: calc(160px + 1.2rem) !important;
    min-height: 240px;
}
.lib-card::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 160px;
    background-color: var(--cream-dark, #efe7d4);
    background-image: url(img/heidari/research-hero.jpg);
    background-size: cover;
    background-position: center;
    border-right: 1px solid rgba(201,169,110,0.35);
    transition: filter 0.25s;
}
.lib-card:hover::before { filter: brightness(1.05); }
.lib-card[data-theme="bone-infection"]::before { background-image: url(img/spec/03-infection.webp); }
.lib-card[data-theme="limb-recon"]::before { background-image: url(img/research/precice-vs-ilizarov.jpg); }
.lib-card[data-theme="fa-trauma"]::before { background-image: url(img/spec/06-trauma.webp); }
.lib-card[data-theme="diabetic-foot"]::before { background-image: url(img/spec/07-diabetic-salvage.jpg); }
.lib-card[data-theme="regenerative"]::before { background-image: url(img/research/ocl-repair.webp); }
.lib-card[data-theme="anatomy-approach"]::before { background-image: url(img/spec/05-preservation.jpg); }
.lib-card[data-theme="upper-limb"]::before { background-image: url(img/treatments/04-ligament-reconstruction.jpg); }
.lib-card[data-theme="hip-pelvis"]::before { background-image: url(img/heidari/aotrauma-faculty-2025.jpg); }
.lib-card[data-theme="paediatric"]::before { background-image: url(img/spec/01-foot-ankle.avif); }
.lib-card[data-theme="precision"]::before { background-image: url(img/heidari/research-hero.jpg); }
.lib-card[data-theme="education"]::before { background-image: url(img/heidari/aotrauma-faculty-2025.jpg); }

@media (max-width: 720px) {
    .lib-card {
        padding-left: 1.1rem !important;
        min-height: 0;
        padding-top: calc(140px + 1.1rem);
    }
    .lib-card::before {
        right: 0;
        bottom: auto;
        width: auto;
        height: 140px;
        border-right: none;
        border-bottom: 1px solid rgba(201,169,110,0.35);
    }
}


/* ─────────────────────────────────────────────────────────────────────
   Heidari philosophy pull-quote (issue #98) — reusable cream/navy band
   with gold rule. Use sparingly: one per page max.
   ───────────────────────────────────────────────────────────────────── */
.philosophy-quote {
    background: linear-gradient(180deg, var(--cream) 0%, var(--cream-dark) 100%);
    padding: clamp(3rem, 7vw, 5rem) clamp(1.2rem, 3vw, 3rem);
    text-align: center;
    position: relative;
}
.philosophy-quote::before,
.philosophy-quote::after {
    content: '';
    display: block;
    width: clamp(40px, 6vw, 64px);
    height: 1px;
    background: var(--gold);
    margin: 0 auto;
}
.philosophy-quote::before { margin-bottom: 1.6rem; }
.philosophy-quote::after { margin-top: 1.6rem; }
.philosophy-quote blockquote {
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(1.4rem, 2.6vw, 2rem);
    font-weight: 400;
    font-style: italic;
    color: var(--navy);
    line-height: 1.3;
    margin: 0 auto;
    max-width: 760px;
    quotes: '\201C' '\201D';
}
.philosophy-quote blockquote::before { content: open-quote; color: var(--gold-dark); margin-right: 0.1em; }
.philosophy-quote blockquote::after { content: close-quote; color: var(--gold-dark); margin-left: 0.1em; }
.philosophy-quote cite {
    display: block;
    margin-top: 1.2rem;
    font-family: 'Inter', sans-serif;
    font-style: normal;
    font-size: 0.66rem;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--gold-dark);
    font-weight: 700;
}

/* AEO "Last reviewed" byline — replaces the awkward full-width white
 band with a small centred italic line tucked just above the footer.
 Applied to all condition/treatment/patient pages. */
.aeo-last-reviewed {
    max-width: 1180px;
    margin: 0 auto;
    padding: 1.4rem 1.5rem 2.4rem;
    text-align: center;
    font-family: 'Cormorant Garamond', serif;
    font-style: italic;
    font-size: 0.78rem;
    color: var(--text-light);
    letter-spacing: 0.02em;
    border-top: 1px solid rgba(201,169,110,0.18);
    margin-top: 2rem;
}
.aeo-last-reviewed time { font-style: normal; color: var(--gold-dark); }

.page-signoff { text-align: center; font-style: italic; font-family: 'Inter', sans-serif !important; font-weight: 400; font-size: 0.78rem; letter-spacing: 0.02em; color: rgba(255,255,255,0.6); margin: 1.2rem 0 0; }

/* #64 doc-icon for sidebar research/blog links */
.dd-link-t::before, .ed-side-link-t::before {
  content: ""; display: inline-block; width: 13px; height: 13px; margin-right: 0.45rem; vertical-align: -1px; flex-shrink: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c9a96e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 2v6h6'/%3E%3C/svg%3E") center/contain no-repeat;
}
