/*
Theme Name: The Mind Factory
Theme URI: https://melvindsouza.com
Author: Melvin D'Souza
Author URI: https://melvindsouza.com
Description: Bespoke luxury editorial theme for Melvin D'Souza - The Mind Factory. Features seamless cross-view transitions, 3D book elevation, kinetic animations, editorial typography, and an integrated executive publishing desk.
Version: 1.2.1
Requires at least: 5.9
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mindfactory
Tags: custom-background, custom-colors, custom-menu, featured-images, full-width-template
*/

:root {
    --navy: #011A38;
    --navy-dark: #001226;
    --navy-surface: #032145;
    --red: #D90000;
    --red-bright: #E00000;
    --white: #FFFFFF;
    --off-white: #F4F6F9;
    --light-gray: #E2E6EC;
    --black: #0A0A0A;
    --font-heading: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
    --font-nav: 'Plus Jakarta Sans', sans-serif;
    --font-body: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

body {
    font-family: var(--font-body);
    letter-spacing: -0.011em;
    line-height: 1.6;
    background-color: var(--off-white);
    background-image: 
        radial-gradient(at 100% 0%, rgba(1, 26, 56, 0.04) 0px, transparent 50%),
        radial-gradient(at 0% 100%, rgba(217, 0, 0, 0.02) 0px, transparent 50%);
    background-attachment: fixed;
    color: var(--navy);
    overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6, .font-heading, .font-serif {
    font-family: var(--font-heading) !important;
    letter-spacing: -0.025em;
    font-feature-settings: "cv02", "cv03", "cv04", "cv11";
}

nav, button, input, select, textarea, label, .font-nav, .font-mono, .nav-item-link {
    font-family: var(--font-nav) !important;
    letter-spacing: -0.01em;
}

::selection {
    background-color: var(--navy);
    color: var(--white);
}

/* Custom Editorial Scrollbar */
::-webkit-scrollbar {
    width: 7px;
}
::-webkit-scrollbar-track {
    background: var(--off-white);
}
::-webkit-scrollbar-thumb {
    background: var(--navy);
}
::-webkit-scrollbar-thumb:hover {
    background: var(--red);
}

/* Core Multi-View Routing State (Enforces Home by default) */
.page-view {
    display: none;
    opacity: 0;
    transition: opacity 0.4s cubic-bezier(0.16, 1, 0.3, 1), transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
#view-home,
.page-view.active-view {
    display: block !important;
    opacity: 1 !important;
}
.page-view:not(.active-view):not(#view-home) {
    display: none !important;
}
body.has-custom-view #view-home:not(.active-view) {
    display: none !important;
}

/* Ensure Logo Always Displays Responsively */
.brand-logo-img {
    width: 36px;
    height: 36px;
    object-fit: contain;
    display: block;
}

/* ============================================================ */
/* THE MIND FACTORY - 6 PILLAR CARDS SLIGHT POP-UP ANIMATION    */
/* ============================================================ */
@keyframes pillarPopUp {
    0% {
        opacity: 0;
        transform: translateY(20px) scale(0.97);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.pillar-card {
    position: relative !important;
    border: 1px solid #00224d !important;
    background-color: #001733 !important;
    border-radius: 8px !important;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), 
                box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1), 
                background-color 0.3s ease, 
                border-color 0.3s ease !important;
    cursor: pointer !important;
    transform-origin: center center !important;
}

.pillar-card::before {
    content: '';
    position: absolute;
    inset: -1px;
    border-radius: 8px;
    border: 1.5px solid transparent;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
    pointer-events: none;
    z-index: 1;
}

/* Hover & Active Slight Pop-up Elevation */
.pillar-card:hover,
.pillar-card.pillar-active {
    transform: translateY(-5px) scale(1.015) !important;
    background-color: #001c3d !important;
    box-shadow: 0 14px 28px -6px rgba(0, 0, 0, 0.5), 
                0 0 20px rgba(217, 0, 0, 0.25) !important;
    border-color: #D90000 !important;
    z-index: 10 !important;
}

.pillar-card:hover::before,
.pillar-card.pillar-active::before {
    border-color: #D90000 !important;
    box-shadow: inset 0 0 10px rgba(217, 0, 0, 0.12), 0 0 14px rgba(217, 0, 0, 0.25) !important;
}

.pillar-card:active {
    transform: translateY(-2px) scale(1.005) !important;
}

.pillar-card:hover .pillar-icon,
.pillar-card.pillar-active .pillar-icon {
    transform: scale(1.12) rotate(4deg) !important;
    color: #FF2E2E !important;
}

.pillar-card:hover .pillar-num,
.pillar-card.pillar-active .pillar-num {
    color: #FF2E2E !important;
    letter-spacing: 0.14em !important;
}

.pillar-card:hover .pillar-title,
.pillar-card.pillar-active .pillar-title {
    color: #FFFFFF !important;
    text-shadow: 0 0 15px rgba(255, 255, 255, 0.35) !important;
}

.pillar-icon {
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), color 0.3s ease !important;
}
.pillar-num {
    transition: color 0.25s ease, letter-spacing 0.25s ease !important;
}
.pillar-title {
    transition: color 0.25s ease, text-shadow 0.25s ease !important;
}

/* ============================================================ */
/* BLOG SYSTEM & ARTICLE TEMPLATE COMPREHENSIVE RESPONSIVE FIX  */
/* ============================================================ */

/* Global container & text wrap protection for blog elements */
#view-articles,
#view-article-single,
#articles-grid-container,
#home-articles-grid,
#article-reader-modal,
article,
.article-container,
.blog-card {
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* Ensure flex & grid children in blog hierarchies can shrink and wrap */
#articles-grid-container > *,
#home-articles-grid > *,
#view-article-single article,
#view-article-single article > div,
.article-header,
.article-body,
.article-footer {
    min-width: 0 !important;
    max-width: 100% !important;
}

/* Robust text wrapping for all dynamic blog headings, titles, and prose */
#single-article-title,
#article-reader-title,
#articles-grid-container h3,
#home-articles-grid h3,
#home-articles-grid h4,
#single-article-summary,
#single-article-content,
#single-article-content p,
#single-article-content h1,
#single-article-content h2,
#single-article-content h3,
#single-article-content h4,
#single-article-content h5,
#single-article-content h6,
#single-article-content blockquote,
#single-article-content li,
#single-article-content a,
#article-reader-content,
#article-reader-content p,
.blog-text-wrap {
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
    hyphens: auto;
    min-width: 0 !important;
    max-width: 100% !important;
}

/* Core Premise & Reflection Callout Box */
#single-article-summary-box {
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
}

#single-article-summary-box p,
#single-article-summary {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
    white-space: normal !important;
}

/* Article Body Content Embeds & Rich Media Responsiveness */
#single-article-content img,
#single-article-content video,
#single-article-content iframe,
#single-article-content figure,
#article-reader-content img,
#article-reader-content video,
#article-reader-content iframe {
    max-width: 100% !important;
    height: auto !important;
    box-sizing: border-box !important;
    border-radius: 8px;
}

#single-article-content table,
#article-reader-content table {
    width: 100% !important;
    max-width: 100% !important;
    border-collapse: collapse;
    overflow-x: auto;
    display: block;
}

#single-article-content pre,
#article-reader-content pre {
    max-width: 100% !important;
    overflow-x: auto !important;
    white-space: pre-wrap !important;
    word-break: break-word !important;
}

#single-article-content code,
#article-reader-content code {
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
}

/* Blog Cards Excerpts and Controls Protection & Uniform Compact Height */
#articles-grid-container article,
#home-articles-grid article,
#home-articles-grid > div {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
}

#articles-grid-container article p,
#home-articles-grid p {
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
    max-width: 100% !important;
}

/* Multi-line Truncation utilities matching Image 2 */
.line-clamp-2 {
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.line-clamp-3 {
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.line-clamp-4 {
    display: -webkit-box !important;
    -webkit-line-clamp: 4 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.blog-card-compact {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    min-height: 290px !important;
}