:root {
    --primary-color: #dc143c;
    --secondary-color: #e94560;
    --accent-color: #c72c41;
    --bg-dark: #0a0a0a;
    --bg-panel: #141414;
    --bg-nav: #0f0f0f;
    --text-light: #fafafa;
    --text-muted: #e0e0e0;
    --font-heading: 'Bitter', georgia, "Times New Roman", times, serif;
    --font-body: 'Helvetica Neue', helvetica, arial, sans-serif;
}

body {
    padding-top: 70px;

    /* Default for fixed navbar */
    color: var(--secondary-color);
    width: 100%;
    margin: 0 auto;
    background-color: var(--bg-dark);
    font-family: var(--font-body);
    line-height: 1.6;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/* Emoji-friendly inputs */
input[type="text"], textarea, .form-control {
    font-family: var(--font-body), "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", Twemoji, sans-serif;
}

/* Sticky Footer Helper */
body>.container,
body>.main-content {
    flex: 1;
}

/* Home Page Specifics */
body.has-banner {
    padding-top: 0 !important;
}

/* Navbar Styling */
.navbar-inverse {
    background-color: var(--bg-nav);
    border-color: transparent;
    border-bottom: 1px solid #8b0000;
    box-shadow: 0 2px 20px rgba(139, 0, 0, 0.3);
}

.navbar-inverse .navbar-nav>li>a {
    color: var(--text-light);
    transition: color 0.3s ease;
}

.navbar-inverse .navbar-nav>li>a:hover,
.navbar-inverse .navbar-nav>li>a:focus {
    color: var(--secondary-color);
    background-color: rgba(255, 255, 255, 0.05);
}

.navbar-inverse .navbar-brand {
    color: var(--primary-color);
    font-family: var(--font-heading);
    font-weight: bold;
    letter-spacing: 1px;
}

.nav-glow {
    height: 4px;
    background: linear-gradient(90deg, var(--primary-color), var(--accent-color));
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
}

/* Home Banner */
.home-banner-img {
    width: 100%;
    min-height: 40vh;

    /* Reduced height */
    background-color: #000;
    background-image: url('../img/honeycomb.jpg');

    /* Ensure this path is correct relative to CSS */
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.home-banner-img::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);

    /* Overlay for better text contrast if needed */
}


/* Main Content Area */
.main-content {
    padding: 40px 0;
    min-height: 400px;
}

.text-block {
    background-color: var(--bg-panel);
    color: var(--text-light);
    padding: 40px;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
    max-width: 800px;
    margin: 0 auto;

    /* Center it */
    position: relative;
    z-index: 10;
    margin-top: 40px;

    /* Consistent spacing below banner */
}

.text-block h1 {
    font-family: var(--font-heading);
    color: var(--secondary-color);
    margin-top: 0;
    margin-bottom: 20px;
    font-size: 2.5rem;
}

.text-block p {
    font-size: 1.1rem;
    color: #f0f0f0;
}

/* Footer */
.copyright {
    background-color: var(--bg-nav);
    color: var(--text-muted);
    padding: 30px 0;
    font-size: 0.9rem;
}

.copyright a {
    color: var(--secondary-color);
    text-decoration: none;
}

.copyright a:hover {
    text-decoration: underline;
}

/* Responsive Adjustments */
@media (width <= 768px) {
    body {
        padding-top: 50px;
    }

    .home-banner-img {
        min-height: 40vh;
    }

    .text-block {
        border-radius: 0;
        padding: 20px;
        margin: 0 15px 20px;
        
        /* Add side margins on mobile */
    }

    .text-block h1 {
        font-size: 2rem;
    }
}

@media (width <= 480px) {
    .text-block h1 {
        font-size: 1.75rem;
    }
}

/* Utility */
.text-center {
    text-align: center;
}

img {
    max-width: 100%;
    height: auto;
}

.text-block.wide {
    max-width: 100%;
}

/* Make table rows transparent to see through to background */
.table-dark tbody tr,
.table-dark tbody td,
.table tbody tr,
.table tbody td {
    background-color: transparent !important;
}

.table-dark thead th {
    background-color: rgba(0, 0, 0, 0.5) !important;
}

.navbar-inverse .dropdown-menu { background-color: var(--bg-nav); border: none; }
.navbar-inverse .dropdown-menu>li>a { color: var(--text-light); }
.navbar-inverse .dropdown-menu>li>a:hover { color: var(--primary-color); background-color: rgba(255,255,255,0.05); }

.navbar-dark { background-color: var(--bg-nav); border-bottom: 1px solid #8b0000; box-shadow: 0 2px 20px rgba(139,0,0,0.3); }
.navbar-dark .navbar-brand { color: var(--primary-color); font-family: var(--font-heading); font-weight: bold; letter-spacing: 1px; }
.navbar-dark .navbar-nav .nav-link { color: var(--text-light); transition: color .3s ease; }
.navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus { color: var(--secondary-color); background-color: rgba(255,255,255,0.05); }
.navbar-dark .navbar-toggler { border-color: rgba(220,20,60,0.5); }
.navbar-dark .dropdown-menu { background-color: var(--bg-nav); border: 1px solid #8b0000; padding: 8px 0; box-shadow: 0 8px 24px rgba(0,0,0,0.6); }
.navbar-dark .dropdown-item { color: #f5f5f5; }
.navbar-dark .dropdown-item:hover, .navbar-dark .dropdown-item:focus { color: var(--primary-color); background-color: rgba(255,255,255,0.05); }
.navbar-dark .dropdown-menu>li>a { color: var(--text-light); display: block; padding: 8px 16px; }
.navbar-dark .dropdown-menu>li>a:hover { color: var(--primary-color); background-color: rgba(255,255,255,0.05); }

.footer-glow { height: 4px; background: linear-gradient(90deg, var(--primary-color), var(--accent-color)); width: 100%; }
.site-footer { background-color: var(--bg-nav); padding: 40px 0; border-top: 1px solid #8b0000; text-align: center; }
.site-footer p { color: var(--text-muted); }

.hero-section {
    height: 90vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #0a0a0a 0%, #1a0000 100%);
    position: relative;
    overflow: hidden;
}
.hero-content { text-align: center; z-index: 2; }
.hero-content h1 { font-size: 72px; font-weight: 100; letter-spacing: 8px; margin-bottom: 30px; color: var(--primary-color); text-transform: uppercase; }
.hero-tagline { font-size: 18px; color: #777; font-weight: 300; letter-spacing: 2px; margin-bottom: 40px; text-transform: uppercase; }
.hero-description { font-size: 16px; color: #999; max-width: 600px; margin: 0 auto 50px; line-height: 1.8; }
.btn-flame { background: transparent; color: var(--primary-color); border: 2px solid var(--primary-color); padding: 15px 40px; font-weight: 300; letter-spacing: 2px; text-transform: uppercase; transition: all 0.4s; font-size: 12px }
.btn-flame:hover { background: var(--primary-color); color: #000; box-shadow: 0 0 20px rgba(220, 20, 60, 0.5); }
.section-dark { background: #0f0f0f; padding: 100px 0; position: relative; }
.section-title { text-align: center; font-size: 42px; font-weight: 100; letter-spacing: 4px; margin-bottom: 20px; color: var(--primary-color); text-transform: uppercase; }
.section-subtitle { text-align: center; color: #666; font-size: 14px; letter-spacing: 2px; margin-bottom: 60px; text-transform: uppercase; }
.divider { width: 60px; height: 2px; background: var(--primary-color); margin: 30px auto; }
.pillar-card { background: linear-gradient(135deg, rgba(20,20,20,0.9) 0%, rgba(30,10,10,0.9) 100%); border: 1px solid rgba(220, 20, 60, 0.2); padding: 50px 30px; margin: 30px 0; transition: all 0.5s cubic-bezier(0.4,0,0.2,1); position: relative; overflow: hidden; }
.pillar-icon { font-size: 60px; color: var(--primary-color); margin-bottom: 30px; display: block; }
.pillar-card h3 { color: var(--primary-color); font-size: 24px; font-weight: 300; letter-spacing: 2px; margin-bottom: 20px; text-transform: uppercase; }
.pillar-card p { color: #999; line-height: 1.8; font-size: 14px }
.pillar-card ul { list-style: none; padding: 0; margin-top: 20px }
.pillar-card li { padding: 10px 0; color: #777; font-size: 13px; border-bottom: 1px solid rgba(220,20,60,0.1) }
.ethos-section { background: linear-gradient(135deg, #0a0a0a 0%, #1a0505 100%); padding: 80px 0; border-top: 1px solid rgba(220,20,60,0.2); border-bottom: 1px solid rgba(220,20,60,0.2) }
.ethos-grid { display: flex; flex-wrap: wrap; margin-top: 50px }
.ethos-item { flex: 1; min-width: 250px; padding: 30px; text-align: center; border-right: 1px solid rgba(220,20,60,0.1) }
.ethos-item:last-child { border-right: none }
.ethos-item h4 { color: var(--primary-color); font-weight: 300; letter-spacing: 2px; margin-bottom: 15px; text-transform: uppercase; font-size: 16px }
.ethos-item p { color: #777; font-size: 13px; line-height: 1.6 }
.contact-section { padding: 100px 0; background: #0a0a0a }
.contact-form { max-width: 600px; margin: 0 auto; background: rgba(20,20,20,0.8); padding: 50px; border: 1px solid rgba(220,20,60,0.2) }
.contact-form .form-control { background: rgba(0,0,0,0.5); border: 1px solid rgba(220,20,60,0.3); color: #e0e0e0; padding: 15px; font-size: 14px; transition: all 0.3s }
.contact-form label { color: #999; font-weight: 300; letter-spacing: 1px; text-transform: uppercase; font-size: 11px; margin-bottom: 10px }

/* Global modern theme for all pages */
body { background: var(--bg-dark); color: var(--text-light); }
.text-block { background: rgba(20,20,20,0.85); border: 1px solid rgba(220,20,60,0.2); padding: 25px; }
.text-block.wide { padding: 35px; }
.text-block img { border: 1px solid rgba(220,20,60,0.35); border-radius: 8px; background: #000; }

/* Improve form readability */
.form-control { background: #121212; border: 1px solid rgba(220,20,60,0.45); color: #f5f5f5; }
.form-control::-webkit-input-placeholder { color: #bfbfbf; }
.form-control::-moz-placeholder { color: #bfbfbf; }
.form-control:-ms-input-placeholder { color: #bfbfbf; }
.form-control::placeholder { color: #bfbfbf; }
label, .form-label { color: #ededed; }
.small, small { color: #dcdcdc; }
.lead { color: #efefef; }
.text-muted { color: #dcdcdc !important; }

/* Tables: increase contrast */
.table { color: #efefef; }
.table>thead>tr>th { color: #fafafa; background-color: rgba(0,0,0,0.5) !important; }
.table th { background-color: rgba(0,0,0,0.5); }
.table-striped>tbody>tr:nth-of-type(odd) { background-color: rgba(255,255,255,0.06); }
.table-hover>tbody>tr:hover { background-color: rgba(255,255,255,0.1); }
.text-block .table th, .text-block .table td { color: #f2f2f2; }
.card, .panel { color: #f3f3f3; }
.card-header { color: #f7f7f7; }

.table .tbl-group-head th {
    background-color: rgba(0,0,0,0.6);
    color: #fafafa;
    border-bottom: 2px solid rgba(220,20,60,0.3);
}

/* Remove white bars: inputs inside table headers and filters */
.table thead input,
.table tfoot input,
.text-block .table thead input,
.text-block input[type="text"],
.text-block input[type="search"] {
    background: #121212;
    border: 1px solid rgba(220,20,60,0.45);
    color: #f5f5f5;
}
.table thead input::placeholder,
.text-block input[type="text"]::placeholder,
.text-block input[type="search"]::placeholder { color: #cfcfcf; }

/* Dark selects and input-group accessories */
.form-select { background-color: #121212; border: 1px solid rgba(220,20,60,0.45); color: #f5f5f5; }
.input-group-text { background-color: #121212; border: 1px solid rgba(220,20,60,0.45); color: #f5f5f5; }

/* Consistent center content spacing */
.has-banner .container { padding-top: 40px; padding-bottom: 40px; }
.container .row + .row { margin-top: 20px; }

/* Headings styled like homepage section titles */
.text-block h1, .panel h1, .text-block h2, .panel h2 { 
    text-align: center; 
    font-weight: 100; 
    letter-spacing: 4px; 
    margin-bottom: 20px; 
    color: var(--primary-color); 
    text-transform: uppercase; 
}
.text-block h1::after, .panel h1::after, .text-block h2::after, .panel h2::after {
    content: "";
    display: block;
    width: 60px; height: 2px;
    background: var(--primary-color);
    margin: 15px auto 0;
}

/* Paragraph rhythm inside content blocks */
.text-block p, .panel p { color: #bbb; line-height: 1.8; }

/* Links */
a { color: var(--secondary-color); }
a:hover, a:focus { color: var(--primary-color); text-decoration: none; }

.panel { background: rgba(20,20,20,0.85); border: 1px solid rgba(220,20,60,0.2); box-shadow: 0 8px 30px rgba(0,0,0,0.3); }
.panel-default { border-color: rgba(220,20,60,0.2); }
.panel-login { border-color: rgba(220,20,60,0.25); }
.panel-heading { background: rgba(0,0,0,0.4); border-bottom: 1px solid rgba(220,20,60,0.2); color: var(--text-light); }
.panel-body { padding: 25px; }

.form-control { background: rgba(0,0,0,0.5); border: 1px solid rgba(220,20,60,0.25); color: var(--text-light); transition: all 0.3s; }
.form-control:focus { border-color: var(--primary-color); box-shadow: 0 0 0 2px rgba(220,20,60,0.25); background: rgba(0,0,0,0.6); }
label { color: var(--text-muted); }

.btn { border-radius: 24px; letter-spacing: 1px; }
.btn-custom, .btn-primary { background: linear-gradient(135deg, var(--primary-color), var(--accent-color)); border: none; color: #fff; box-shadow: 0 6px 20px rgba(220,20,60,0.3); }
.btn-custom:hover, .btn-primary:hover { filter: brightness(1.05); box-shadow: 0 10px 26px rgba(220,20,60,0.45); }
.btn-default { background: rgba(255,255,255,0.08); color: var(--text-light); border: 1px solid rgba(220,20,60,0.2); }
.btn-default:hover { background: rgba(255,255,255,0.15); }
.btn-danger { background: linear-gradient(135deg, #b00020, #7a0015); border: none; }
.btn-success { background: linear-gradient(135deg, #0b7a3b, #095f2e); border: none; }

.table { color: var(--text-light); }
.table>thead>tr>th { border-bottom: 2px solid rgba(220,20,60,0.3); }
.table-striped>tbody>tr:nth-of-type(odd) { background-color: rgba(255,255,255,0.03); }
.table-hover>tbody>tr:hover { background-color: rgba(255,255,255,0.06); }

.breadcrumb { background: rgba(0,0,0,0.35); border: 1px solid rgba(220,20,60,0.2); }
.pagination>li>a, .pagination>li>span { background: rgba(0,0,0,0.4); border: 1px solid rgba(220,20,60,0.2); color: var(--text-light); }
.pagination>li>a:hover { background: rgba(0,0,0,0.55); color: var(--primary-color); }

/* Podcast section headers align with homepage titles */
.section-header h2 { 
    text-align: center; 
    font-weight: 100; 
    letter-spacing: 4px; 
    margin-bottom: 20px; 
    color: var(--primary-color); 
    text-transform: uppercase; 
}
.section-header h2::after { 
    content: ""; display: block; width: 60px; height: 2px; background: var(--primary-color); margin: 15px auto 0; 
}

/* Blog cards styled to match theme */
.card { background: rgba(20,20,20,0.85); border: 1px solid rgba(220,20,60,0.2); box-shadow: 0 8px 30px rgba(0,0,0,0.3); }
.card-header { background: rgba(0,0,0,0.4); border-bottom: 1px solid rgba(220,20,60,0.2); color: var(--text-light); }
.card-body { color: var(--text-light); }
.card-title { color: var(--primary-color); letter-spacing: 1px; }
.badge { background: linear-gradient(135deg, var(--primary-color), var(--accent-color)); border: none; }
.page-link { background: rgba(0,0,0,0.4); border: 1px solid rgba(220,20,60,0.2); color: var(--text-light); }
.page-item.active .page-link { background: var(--primary-color); border-color: var(--primary-color); color: #000; }

/* Flash Messages */
.flash { 
    position: relative;
    max-width: 960px; 
    margin: 10px auto 25px; 
    padding: 14px 48px; 
    border-radius: 8px; 
    text-align: center; 
    background: rgba(20,20,20,0.92); 
    border: 1px solid rgba(220,20,60,0.3); 
    color: var(--text-light); 
    box-shadow: 0 10px 30px rgba(0,0,0,0.35); 
    animation: flashIn .35s ease both; 
}
.flash::before { 
    content: ""; 
    position: absolute; 
    left: 0; right: 0; top: -3px; 
    height: 3px; 
    background: linear-gradient(90deg, var(--primary-color), var(--accent-color)); 
    opacity: .85; 
}
.flash .flash-text { 
    font-weight: 300; 
    letter-spacing: 2px; 
    text-transform: uppercase; 
}
.flash-success { border-color: rgba(93,193,185,0.5); background: linear-gradient(135deg, rgba(93,193,185,0.12), rgba(0,0,0,0.12)); }
.flash-info { border-color: rgba(93,193,185,0.5); background: linear-gradient(135deg, rgba(93,193,185,0.10), rgba(0,0,0,0.12)); }
.flash-warning { border-color: rgba(255,165,0,0.6); background: linear-gradient(135deg, rgba(255,165,0,0.14), rgba(0,0,0,0.12)); }
.flash-danger { border-color: rgba(220,20,60,0.7); background: linear-gradient(135deg, rgba(220,20,60,0.18), rgba(0,0,0,0.12)); box-shadow: 0 12px 32px rgba(220,20,60,0.25); }
.flash-primary { border-color: var(--primary-color); background: linear-gradient(135deg, rgba(220,20,60,0.14), rgba(0,0,0,0.12)); }
.flash-close { 
    position: absolute; 
    right: 10px; 
    top: 50%; 
    transform: translateY(-50%); 
    background: transparent; 
    border: none; 
    color: var(--text-light); 
    font-size: 22px; 
    line-height: 1; 
    cursor: pointer; 
    opacity: .7; 
}
.flash-close:hover { opacity: 1; }
.flash.hide { opacity: 0; transform: translateY(-6px); transition: opacity .25s ease, transform .25s ease; }
@keyframes flashIn { from { transform: translateY(-6px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }

.flash-wide { width: 100%; max-width: none; }
.flash .flash-text { font-size: 13px; }
.flash-success .flash-text::before { content: "✔"; margin-right: 10px; color: var(--secondary-color); }
.flash-info .flash-text::before { content: "ℹ"; margin-right: 10px; color: var(--secondary-color); }
.flash-warning .flash-text::before { content: "⚠"; margin-right: 10px; color: #ffae00; }
.flash-danger .flash-text::before { content: "✖"; margin-right: 10px; color: var(--primary-color); }
