/**
 * Chief Magazine — Dynamic Homepage Builder v1.0 Stylesheet
 * Strict adherence to visual mockup (media_1794212099527_59669437.png)
 * Colors: Chief Red #dc2626 / #c8102e, Dark #1a1a1a / #141414, Warm Beige #fbf8f3, Text #111827
 */

/* ==========================================================================
   0. PARENT FOOTER SUPPRESSION & CONTAINER SETUP
   ========================================================================== */
body.chief-hp-builder-active .footer-wrapper,
body.chief-hp-builder-active .footer-sidebar-wrapper,
body.chief-hp-builder-active .footer-sidebar-2-wrapper,
body.chief-hp-builder-active .chief-footer-wrapper {
    display: none !important;
}

.chief-hp-builder-main {
    background-color: #ffffff;
    color: #111827;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    line-height: 1.5;
    overflow-x: hidden;
}

.chief-hp-builder-main * {
    box-sizing: border-box;
}

.chief-section {
    padding: 32px 0;
}

/* Preview Banner */
.chief-preview-mode-banner {
    background: #111827;
    color: #ffffff;
    padding: 8px 0;
    font-size: 13px;
    border-bottom: 2px solid #dc2626;
    position: sticky;
    top: 0;
    z-index: 99999;
}

.chief-preview-banner-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.chief-preview-mode-banner .preview-tag {
    background: #dc2626;
    color: #ffffff;
    font-weight: 800;
    font-size: 10px;
    padding: 2px 8px;
    border-radius: 3px;
    letter-spacing: 1px;
}

.chief-preview-mode-banner .preview-text {
    font-size: 12px;
    color: #e5e7eb;
}

.chief-preview-mode-banner .preview-btn {
    color: #ffffff;
    text-decoration: underline;
    font-weight: 600;
    font-size: 12px;
}

/* Common Typography & Badges */
.chief-pill-badge {
    display: inline-block;
    background: #dc2626;
    color: #ffffff;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    padding: 3px 8px;
    border-radius: 2px;
}

.chief-pill-badge-small {
    display: inline-block;
    color: #dc2626;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    margin-bottom: 4px;
}

.chief-pill-badge-tiny {
    display: inline-block;
    color: #dc2626;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 4px;
}

.meta-separator {
    margin: 0 6px;
    color: #9ca3af;
}

.meta-reading-time, .meta-date {
    font-size: 12px;
    color: #6b7280;
    font-weight: 500;
}

.chief-btn-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 30px;
    padding: 8px 20px;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.2s ease;
}

.chief-btn-red {
    background-color: #dc2626;
    color: #ffffff !important;
}

.chief-btn-red:hover {
    background-color: #b91c1c;
    color: #ffffff !important;
}

/* ==========================================================================
   1. HERO EDITORIAL SECTION
   ========================================================================== */
.chief-section-hero {
    padding-top: 24px;
    padding-bottom: 24px;
}

.chief-hero-grid {
    display: grid;
    grid-template-columns: 1.6fr 1fr;
    gap: 36px;
    align-items: stretch;
}

/* Primary Card */
.chief-hero-primary-card {
    background: #ffffff;
    border-radius: 4px;
}

.chief-hero-primary-inner {
    display: grid;
    grid-template-columns: 1fr 1.05fr;
    gap: 20px;
    height: 100%;
    align-items: center;
}

.chief-hero-primary-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-right: 10px;
}

.chief-hero-badge-wrap {
    margin-bottom: 12px;
}

.chief-hero-primary-title {
    font-family: "Georgia", "Times New Roman", serif;
    font-size: 32px;
    line-height: 1.15;
    font-weight: 800;
    color: #111827;
    margin: 0 0 14px 0;
    letter-spacing: -0.5px;
}

.chief-hero-primary-title a {
    color: inherit;
    text-decoration: none;
    transition: color 0.15s ease;
}

.chief-hero-primary-title a:hover {
    color: #dc2626;
}

.chief-hero-primary-excerpt {
    font-size: 14px;
    line-height: 1.55;
    color: #4b5563;
    margin: 0 0 16px 0;
}

.chief-hero-meta {
    display: flex;
    align-items: center;
}

/* Visual Stage with Red Angled Badge & Cutout */
.chief-hero-primary-visual {
    position: relative;
    width: 100%;
    height: 420px;
    overflow: hidden;
    background: #fdfbf7;
}

.chief-hero-red-polygon {
    position: absolute;
    top: 0;
    right: 0;
    width: 72%;
    height: 100%;
    background-color: #c8102e;
    clip-path: polygon(30% 0, 100% 0, 100% 100%, 0% 100%);
    z-index: 1;
}

.chief-hero-watermark {
    position: absolute;
    right: -20px;
    bottom: -20px;
    width: 180px;
    height: 180px;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.15) 30%, transparent 70%);
    border-radius: 50%;
}

.chief-hero-cutout-layer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    pointer-events: none;
}

.chief-hero-cutout-img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    object-position: bottom center;
}

.chief-hero-fallback-layer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
}

.chief-hero-fallback-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.chief-hero-default-art {
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #1f2937, #111827);
}

/* Supporting Stories Column */
.chief-hero-supporting-column {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.chief-supporting-list {
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: space-between;
}

.chief-supporting-item {
    display: flex;
    align-items: center;
    gap: 16px;
    padding-bottom: 16px;
}

.chief-supporting-item.has-divider {
    border-bottom: 1px solid #f3f4f6;
    margin-bottom: 16px;
}

.chief-supporting-content {
    flex: 1;
    min-width: 0;
}

.chief-supporting-title {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.35;
    color: #111827;
    margin: 4px 0 6px 0;
}

.chief-supporting-title a {
    color: inherit;
    text-decoration: none;
    transition: color 0.15s ease;
}

.chief-supporting-title a:hover {
    color: #dc2626;
}

.chief-supporting-thumb-wrap {
    width: 110px;
    height: 80px;
    flex-shrink: 0;
}

.chief-supporting-thumb-badge {
    width: 100%;
    height: 100%;
    border-radius: 4px;
    overflow: hidden;
    position: relative;
}

.chief-supporting-thumb-badge.badge-color-0 { background-color: #ffeedb; }
.chief-supporting-thumb-badge.badge-color-1 { background-color: #e0f2fe; }
.chief-supporting-thumb-badge.badge-color-2 { background-color: #fef3c7; }

.chief-supporting-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.chief-supporting-art-placeholder {
    width: 100%;
    height: 100%;
}
.art-style-0 { background: linear-gradient(135deg, #f97316, #ea580c); opacity: 0.8; }
.art-style-1 { background: linear-gradient(135deg, #0284c7, #0369a1); opacity: 0.8; }
.art-style-2 { background: linear-gradient(135deg, #eab308, #ca8a04); opacity: 0.8; }

/* ==========================================================================
   2. IN FOCUS DIVIDER
   ========================================================================== */
.chief-section-in-focus {
    padding: 12px 0;
}

.chief-in-focus-bar {
    display: flex;
    align-items: center;
    border-top: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;
    padding: 12px 0;
    gap: 16px;
}

.chief-in-focus-badge {
    font-weight: 800;
    font-size: 15px;
    letter-spacing: 1px;
    color: #111827;
    white-space: nowrap;
}

.chief-in-focus-separator {
    width: 1px;
    height: 18px;
    background: #d1d5db;
}

.chief-in-focus-text {
    margin: 0;
    font-size: 15px;
    color: #4b5563;
}

.chief-in-focus-text em {
    font-family: "Georgia", "Times New Roman", serif;
    font-style: italic;
}

.chief-in-focus-text a {
    color: inherit;
    text-decoration: none;
    font-family: "Georgia", "Times New Roman", serif;
    font-style: italic;
}

.chief-in-focus-text a:hover {
    color: #dc2626;
}

/* ==========================================================================
   3. CATEGORY SHOWCASES & MOST READ ROW
   ========================================================================== */
.chief-section-category-showcases {
    padding-top: 28px;
    padding-bottom: 28px;
}

.chief-showcases-most-read-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 40px;
    align-items: start;
}

/* Category Showcases Left Column */
.chief-category-showcases-list {
    display: flex;
    flex-direction: column;
}

.chief-cat-showcase-row {
    display: grid;
    grid-template-columns: 1fr 1.05fr 1.25fr;
    gap: 20px;
    align-items: center;
    padding: 24px 0;
}

.chief-cat-showcase-row.has-top-border {
    border-top: 1px solid #f3f4f6;
}

.chief-cat-meta-col {
    display: flex;
    flex-direction: column;
}

.chief-cat-main-title {
    font-size: 26px;
    font-weight: 800;
    letter-spacing: -0.3px;
    color: #111827;
    margin: 0 0 8px 0;
    line-height: 1.15;
}

.chief-cat-subtext {
    font-size: 13px;
    color: #6b7280;
    line-height: 1.45;
    margin: 0 0 12px 0;
}

.chief-cat-cta-link {
    font-size: 12px;
    font-weight: 700;
    color: #dc2626 !important;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
}

.chief-cat-cta-link:hover {
    text-decoration: underline;
}

.chief-cat-visual-col {
    display: flex;
    justify-content: center;
}

.chief-cat-image-wrap {
    width: 100%;
    height: 130px;
    border-radius: 6px;
    overflow: hidden;
    background: #f1f5f9;
}

.chief-cat-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.chief-cat-placeholder-art {
    width: 100%;
    height: 100%;
}
.placeholder-0 { background: linear-gradient(135deg, #d1d5db, #9ca3af); }
.placeholder-1 { background: linear-gradient(135deg, #93c5fd, #3b82f6); }
.placeholder-2 { background: linear-gradient(135deg, #fde047, #eab308); }

.chief-cat-bullet-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.chief-bullet-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 13px;
    line-height: 1.4;
}

.chief-bullet-square {
    width: 5px;
    height: 5px;
    background-color: #dc2626;
    margin-top: 6px;
    flex-shrink: 0;
}

.chief-bullet-link {
    color: #111827;
    font-weight: 600;
    text-decoration: none;
    transition: color 0.15s ease;
}

.chief-bullet-link:hover {
    color: #dc2626;
}

/* Most Read Right Column Card */
.chief-most-read-card {
    background-color: #fbf8f3;
    border-radius: 6px;
    padding: 24px 20px;
}

.chief-most-read-header {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin-bottom: 20px;
    border-bottom: 2px solid #e5e7eb;
    padding-bottom: 12px;
}

.chief-mr-title {
    font-size: 22px;
    font-weight: 900;
    color: #dc2626;
    letter-spacing: -0.5px;
    margin: 0;
    line-height: 1;
}

.chief-mr-subtag {
    font-size: 13px;
    color: #6b7280;
    font-weight: 500;
}

.chief-most-read-list {
    display: flex;
    flex-direction: column;
}

.chief-mr-item {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 12px 0;
}

.chief-mr-item.has-divider {
    border-bottom: 1px solid #f0ece3;
}

.chief-mr-rank {
    font-size: 24px;
    font-weight: 900;
    color: #dc2626;
    line-height: 1.1;
    min-width: 28px;
}

.chief-mr-body {
    flex: 1;
}

.chief-mr-headline {
    font-size: 13px;
    font-weight: 700;
    line-height: 1.35;
    color: #111827;
    margin: 0 0 4px 0;
}

.chief-mr-headline a {
    color: inherit;
    text-decoration: none;
    transition: color 0.15s ease;
}

.chief-mr-headline a:hover {
    color: #dc2626;
}

/* ==========================================================================
   4. PROMOTIONAL BANNERS (FOUNDER CONVERSATION & THINK TANK)
   ========================================================================== */
.chief-section-promo {
    padding-top: 20px;
    padding-bottom: 20px;
}

.chief-promo-card {
    border-radius: 6px;
    color: #ffffff;
    overflow: hidden;
    padding: 24px 32px;
}

/* Founder Conversation */
.chief-promo-founder-grid {
    display: grid;
    grid-template-columns: 1.2fr 1.3fr 1fr;
    gap: 24px;
    align-items: center;
}

.chief-promo-eyebrow {
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 2px;
    color: #9ca3af;
    text-transform: uppercase;
    display: block;
    margin-bottom: 6px;
}

.chief-promo-title-serif {
    font-family: "Georgia", "Times New Roman", serif;
    font-size: 32px;
    font-weight: 700;
    color: #ffffff;
    margin: 0;
    line-height: 1.15;
}

.chief-promo-desc-italic {
    font-family: "Georgia", "Times New Roman", serif;
    font-style: italic;
    font-size: 15px;
    color: #d1d5db;
    margin: 0 0 14px 0;
    line-height: 1.45;
}

.chief-founder-visual-wrap {
    position: relative;
    width: 100%;
    height: 150px;
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
}

.chief-founder-red-polygon {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 140px;
    height: 140px;
    background-color: #dc2626;
    clip-path: polygon(30% 0, 100% 0, 100% 100%, 0% 100%);
    border-radius: 4px;
}

.chief-founder-img {
    position: relative;
    z-index: 2;
    height: 140px;
    object-fit: contain;
}

.chief-founder-placeholder-art {
    position: relative;
    z-index: 2;
    width: 120px;
    height: 140px;
    background: radial-gradient(circle, #4b5563 40%, transparent 80%);
}

/* Think Tank Banner */
.chief-promo-think-tank-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 32px;
    align-items: center;
}

.chief-think-tank-title {
    font-family: "Georgia", "Times New Roman", serif;
    font-size: 30px;
    font-weight: 700;
    color: #ffffff;
    margin: 0 0 8px 0;
    line-height: 1.2;
}

.chief-think-tank-desc {
    font-size: 14px;
    color: #9ca3af;
    margin: 0 0 18px 0;
    max-width: 480px;
}

.chief-staircase-img-wrap {
    width: 100%;
    height: 160px;
    border-radius: 4px;
    overflow: hidden;
    background: #262626;
}

.chief-staircase-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.chief-staircase-art {
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #374151, #1f2937);
}

/* ==========================================================================
   5. THE CHIEF BRIEF (NEWSLETTER CARD)
   ========================================================================== */
.chief-section-chief-brief {
    padding-top: 16px;
    padding-bottom: 16px;
}

.chief-brief-card {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    padding: 24px 32px;
}

.chief-brief-grid {
    display: grid;
    grid-template-columns: 1.2fr 1.6fr 0.5fr;
    gap: 24px;
    align-items: center;
}

.chief-brief-logo-text {
    font-family: "Georgia", "Times New Roman", serif;
    font-size: 32px;
    font-weight: 900;
    color: #111827;
    margin: 0 0 4px 0;
    letter-spacing: -0.5px;
}

.chief-brief-logo-text .text-red-italic {
    color: #dc2626;
    font-style: italic;
    font-weight: 700;
}

.chief-brief-desc {
    font-size: 13px;
    color: #4b5563;
    margin: 0;
    line-height: 1.45;
}

.chief-brief-inline-form .chief-input-button-group {
    display: flex;
    max-width: 520px;
}

.chief-brief-email-input {
    flex: 1;
    height: 42px;
    padding: 0 16px;
    border: 1px solid #d1d5db;
    border-right: none;
    border-radius: 4px 0 0 4px;
    font-size: 13px;
    outline: none;
}

.chief-brief-email-input:focus {
    border-color: #dc2626;
}

.chief-brief-submit-btn {
    height: 42px;
    background-color: #dc2626;
    color: #ffffff;
    border: none;
    border-radius: 0 4px 4px 0;
    padding: 0 24px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.chief-brief-submit-btn:hover {
    background-color: #b91c1c;
}

.chief-brief-icon-col {
    display: flex;
    justify-content: flex-end;
}

/* ==========================================================================
   6. LATEST STORIES (5-COLUMN GRID)
   ========================================================================== */
.chief-section-header-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 20px;
    border-bottom: 1px solid #e5e7eb;
    padding-bottom: 10px;
}

.chief-section-heading-serif {
    font-family: "Georgia", "Times New Roman", serif;
    font-size: 26px;
    font-weight: 700;
    color: #111827;
    margin: 0;
}

.chief-section-view-all {
    font-size: 13px;
    font-weight: 700;
    color: #dc2626 !important;
    text-decoration: none;
}

.chief-section-view-all:hover {
    text-decoration: underline;
}

.chief-latest-stories-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px;
}

.chief-latest-story-card {
    display: flex;
    flex-direction: column;
}

.chief-latest-thumb-wrap {
    width: 100%;
    height: 120px;
    border-radius: 4px;
    overflow: hidden;
    margin-bottom: 10px;
    background: #f1f5f9;
}

.chief-latest-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.2s ease;
}

.chief-latest-story-card:hover .chief-latest-img {
    transform: scale(1.04);
}

.chief-latest-placeholder-thumb {
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #e2e8f0, #cbd5e1);
}

.chief-latest-title {
    font-size: 14px;
    font-weight: 700;
    line-height: 1.35;
    color: #111827;
    margin: 0 0 6px 0;
}

.chief-latest-title a {
    color: inherit;
    text-decoration: none;
}

.chief-latest-title a:hover {
    color: #dc2626;
}

/* ==========================================================================
   7. SPLIT PROMOS (FOUNDERS + EVENTS)
   ========================================================================== */
.chief-section-split-promos {
    padding-top: 20px;
    padding-bottom: 20px;
}

.chief-split-promos-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

.chief-split-card {
    border-radius: 6px;
    padding: 24px 28px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    overflow: hidden;
}

.chief-split-founder-card {
    background: #fff8f8;
    border: 1px solid #fee2e2;
}

.chief-split-events-card {
    background: #faf8ff;
    border: 1px solid #ede9fe;
}

.chief-split-card-content {
    flex: 1;
    z-index: 2;
    padding-right: 20px;
}

.chief-split-card-title {
    font-size: 16px;
    font-weight: 800;
    letter-spacing: 0.5px;
    color: #111827;
    margin: 0 0 8px 0;
}

.chief-split-card-desc {
    font-size: 13px;
    color: #4b5563;
    line-height: 1.45;
    margin: 0 0 14px 0;
}

.chief-split-card-link {
    font-size: 12px;
    font-weight: 700;
    color: #dc2626 !important;
    text-decoration: none;
}

.chief-split-card-link:hover {
    text-decoration: underline;
}

.chief-split-card-visual {
    width: 140px;
    height: 110px;
    position: relative;
    flex-shrink: 0;
}

.chief-founder-mini-badge {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 100px;
    height: 100px;
    background: #dc2626;
    clip-path: polygon(30% 0, 100% 0, 100% 100%, 0% 100%);
    border-radius: 4px;
}

.chief-founder-mini-art {
    position: absolute;
    right: 10px;
    bottom: 0;
    width: 80px;
    height: 95px;
    background: radial-gradient(circle, #374151 50%, transparent 80%);
}

.chief-events-circle-badge {
    position: absolute;
    right: 10px;
    top: 5px;
    width: 90px;
    height: 90px;
    background: #ddd6fe;
    border-radius: 50%;
}

.chief-events-chairs-art {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 120px;
    height: 70px;
    background: radial-gradient(ellipse at bottom, #1e1b4b 60%, transparent 80%);
}

/* ==========================================================================
   8. FROM THE COMMUNITY (WBWK)
   ========================================================================== */
.chief-section-wbwk-community {
    padding-top: 24px;
    padding-bottom: 32px;
}

.chief-wbwk-cards-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.chief-wbwk-card {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    transition: all 0.2s ease;
}

.chief-wbwk-card:hover {
    border-color: #cbd5e1;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);
}

.chief-wbwk-card-link {
    display: block;
    padding: 20px;
    color: inherit;
    text-decoration: none;
}

.chief-wbwk-icon-wrap {
    margin-bottom: 12px;
}

.chief-wbwk-q-title {
    font-size: 15px;
    font-weight: 700;
    line-height: 1.4;
    color: #111827;
    margin: 0 0 16px 0;
}

.chief-wbwk-response-count {
    font-size: 12px;
    color: #6b7280;
    font-weight: 600;
}

/* ==========================================================================
   9. 4-COLUMN EDITORIAL FOOTER
   ========================================================================== */
.chief-editorial-footer {
    background-color: #1a1a1a;
    color: #9ca3af;
    padding: 48px 0 24px 0;
    margin-top: 24px;
}

.chief-footer-columns-grid {
    display: grid;
    grid-template-columns: 2fr 1.1fr 1.2fr 1.2fr;
    gap: 36px;
    border-bottom: 1px solid #2d2d2d;
    padding-bottom: 40px;
}

.chief-footer-brand-name {
    font-family: "Georgia", "Times New Roman", serif;
    font-size: 24px;
    font-weight: 900;
    color: #ffffff;
    letter-spacing: -0.5px;
}

.chief-footer-brand-name .chief-sub {
    font-weight: 400;
    color: #d1d5db;
}

.chief-footer-bio {
    font-size: 13px;
    color: #9ca3af;
    line-height: 1.55;
    margin: 14px 0 20px 0;
    max-width: 320px;
}

.chief-footer-socials {
    display: flex;
    gap: 10px;
}

.chief-social-btn {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #2a2a2a;
    color: #ffffff !important;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: background 0.15s ease;
}

.chief-social-btn:hover {
    background: #dc2626;
}

.chief-footer-heading {
    color: #ffffff;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin: 0 0 16px 0;
}

.chief-footer-links {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.chief-footer-links a {
    color: #9ca3af;
    font-size: 13px;
    text-decoration: none;
    transition: color 0.15s ease;
}

.chief-footer-links a:hover {
    color: #ffffff;
}

.chief-footer-sub-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 20px;
    font-size: 12px;
    color: #6b7280;
}

/* ==========================================================================
   10. RESPONSIVE DESIGN (TABLET & MOBILE)
   ========================================================================== */
@media (max-width: 1199px) {
    .chief-hero-primary-title {
        font-size: 30px;
    }
    .chief-latest-stories-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .chief-footer-columns-grid {
        grid-template-columns: 1fr 1fr;
        gap: 30px;
    }
}

@media (max-width: 991px) {
    .chief-hero-grid {
        grid-template-columns: 1fr;
        gap: 28px;
    }
    .chief-hero-primary-inner {
        grid-template-columns: 1fr;
    }
    .chief-hero-primary-visual {
        height: 320px;
    }
    .chief-showcases-most-read-grid {
        grid-template-columns: 1fr;
    }
    .chief-promo-founder-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .chief-founder-visual-wrap {
        justify-content: center;
    }
    .chief-promo-think-tank-grid {
        grid-template-columns: 1fr;
    }
    .chief-brief-grid {
        grid-template-columns: 1fr;
    }
    .chief-brief-icon-col {
        display: none;
    }
}

/* Mobile Devices (Under 768px): Strict Stacked Editorial Layout */
@media (max-width: 767px) {
    .chief-section {
        padding: 20px 0;
    }
    .chief-hero-primary-title {
        font-size: 26px;
    }
    .chief-supporting-grid {
        grid-template-columns: 1fr;
    }

    /* Stacked Category Showcases (Requirement #11: No horizontal swipe) */
    .chief-cat-showcase-row {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .chief-cat-visual-col {
        width: 100%;
    }
    .chief-cat-image-wrap {
        height: 180px;
    }

    .chief-latest-stories-grid {
        grid-template-columns: 1fr;
    }
    .chief-split-promos-grid {
        grid-template-columns: 1fr;
    }
    .chief-wbwk-cards-grid {
        grid-template-columns: 1fr;
    }
    .chief-footer-columns-grid {
        grid-template-columns: 1fr;
    }
    .chief-footer-sub-bottom {
        flex-direction: column;
        gap: 8px;
        text-align: center;
    }
}