:root {
    --bt-primary: #0A2A66;       /* Deep Blue */
    --bt-primary-light: #0F1C3A; /* Navy backdrop */
    --bt-accent: #D20A0A;        /* Strong Red */
    --bt-light: #FFFFFF;         /* White */
    --bt-muted: #C9CED6;         /* Soft grey */
}

/* Change background theme from black to navy */
body,
.bg-dark {
    background-color: var(--bt-primary-light) !important;
}

.text-light {
    color: var(--bt-light) !important;
}

.text-muted,
.text-secondary {
    color: var(--bt-muted) !important;
}

/* Replace "warning" buttons with "accent-red" */
.btn-warning {
    background-color: var(--bt-accent) !important;
    border-color: var(--bt-accent) !important;
    color: var(--bt-light) !important;
}

.btn-outline-light {
    border-color: var(--bt-light) !important;
    color: var(--bt-light) !important;
}
.btn-outline-light:hover {
    background-color: var(--bt-light) !important;
    color: var(--bt-primary-light) !important;
}

/* Card styling: blue borders and red hovers */
.card {
    background-color: var(--bt-primary-light);
    border: 1px solid var(--bt-primary);
}

.card:hover {
    border-color: var(--bt-accent);
}

/* Titles: swap gold to red */
.text-warning,
.text-orange,
h1, h2, h3, h4, h5 {
    color: var(--bt-accent) !important;
}

/* Links */
a.text-warning,
a.text-orange {
    color: var(--bt-accent) !important;
}

/* Button micro-effects */
.btn:hover {
    transform: translateY(-2px);
}

/* Buttons subtle lift */
.btn {
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.35);
}

/* Card hover glow */
.card {
    transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.card:hover {
    transform: translateY(-2px);
    box-shadow: 0 0.75rem 1.25rem rgba(0,0,0,0.5);
    border-color: rgba(255, 193, 7, 0.5); /* bootstrap warning-ish */
}
.bg-primary-light {
    background-color: var(--bt-primary-light) !important;
}
.text-accent {
    color: var(--bt-accent) !important;
}
.btn-accent {
    background-color: var(--bt-accent) !important;
    border-color: var(--bt-accent) !important;
    color: var(--bt-light) !important;
}
.btn-accent:hover {
    background-color: #B30909 !important; /* slightly darker red */
}

/* -----------------------------------------------------
   GLOBAL COLORS
----------------------------------------------------- */
:root {
    --tbt-red: #D20A0A;
    --tbt-red-dark: #B30909;
    --tbt-navy: #0A2A66;
    --tbt-dark: #050814;
    --tbt-light-blue: #F4F7FB;
}

/* -----------------------------------------------------
   BASE STYLE
----------------------------------------------------- */
body {
    font-family: Inter, Arial, sans-serif;
    background-color: #ffffff;
    color: #333;
}

h1, h2, h3, h4, h5 {
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    font-weight: 700;
}

/* -----------------------------------------------------
   NAVBAR (Transparent → Solid)
----------------------------------------------------- */
#tbtNav {
    background: transparent;
    transition: 0.35s ease-in-out;
}

#tbtNav.nav-solid {
    background: var(--tbt-navy);
    box-shadow: 0 2px 12px rgba(0,0,0,0.25);
}

.navbar-nav .nav-link {
    color: #ffffff;
    font-weight: 500;
}

.navbar-nav .nav-link:hover {
    color: var(--tbt-red);
}

/* -----------------------------------------------------
   BUTTONS
----------------------------------------------------- */
.btn-danger {
    background: var(--tbt-red);
    border-color: var(--tbt-red);
}

.btn-danger:hover {
    background: var(--tbt-red-dark);
    border-color: var(--tbt-red-dark);
}

.btn-outline-danger {
    border-color: var(--tbt-red);
    color: var(--tbt-red);
}

.btn-outline-danger:hover {
    background: var(--tbt-red);
    color: #fff;
}

/* -----------------------------------------------------
   FOOTER LINKS
----------------------------------------------------- */
.footer-link {
    color: #bbbbbb;
    text-decoration: none;
}
.footer-link:hover {
    color: var(--tbt-red);
    text-decoration: underline;
}

/* -----------------------------------------------------
   SECTION HELPERS
----------------------------------------------------- */
.page-wrap {
    padding-top: 72px;
}

.bg-navy {
    background-color: var(--tbt-navy);
    color: #fff;
}

.bg-light-blue {
    background-color: var(--tbt-light-blue);
}

.text-danger {
    color: var(--tbt-red) !important;
}

/* Smooth hero fade-in */
section[class*="py-5"] {
    animation: fadeIn 0.7s ease-out forwards;
    opacity: 0;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Button hover pulse */
.btn-danger:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(210,10,10,0.45);
}

.btn-outline-danger:hover {
    transform: translateY(-2px);
}

/* Card hover lift */
.card:hover {
    transform: translateY(-4px);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    box-shadow: 0 6px 20px rgba(0,0,0,0.15);
}

/* Navigation slide-in */
.tbt-navbar {
    animation: navLoad 0.6s ease-out forwards;
    opacity: 0;
}
@keyframes navLoad {
    from { opacity: 0; transform: translateY(-10px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* Improve text contrast in light sections */

body, p, li, td, th {
    color: #222 !important;  /* darker, high contrast */
}

.text-muted {
    color: #555 !important;  /* no longer super light gray */
}

section.bg-white p,
section.bg-light p,
section.bg-white .text-secondary,
section.bg-light .text-secondary {
    color: #333 !important;  /* darker than muted */
}

/* Make muted text readable on light backgrounds */
p.text-muted,
.text-muted {
    color: #333 !important;
}

/* ENSURE hero text is bright on dark backgrounds */
section.bg-dark .lead,
section.bg-dark p,
section.bg-dark .text-secondary,
section.bg-dark .text-muted,
.hero-dark .lead,
.hero-dark p {
    color: #fff !important;
}

/* Ensure lists inside dark sections are white */
section.bg-dark ul,
section.bg-dark ul li,
.hero-dark ul,
.hero-dark ul li {
    color: #fff !important;
}
/* Ensure dark cards use light text */
.card.bg-dark .card-body,
.card.bg-dark .card-body p,
.card.bg-dark .card-body li,
.card.bg-dark .card-body .text-secondary,
.card.bg-dark .card-body .small {
    color: #fff !important;
}
/* FORCE white text inside dark cards, even if .text-secondary is used */
.card.bg-dark .card-body ul.text-secondary,
.card.bg-dark .card-body ul.text-secondary li,
.card.bg-dark .card-body .small.text-secondary,
.card.bg-dark .card-body li {
    color: #fff !important;
}
/* MAIN HERO BACKGROUND STYLE */
.hero-main {
    background-image:
        linear-gradient(
            to bottom,
            rgba(10, 42, 102, 0.45) 0%,   /* navy overlay */
            rgba(5, 8, 20, 0.52) 60%,    /* deep dark overlay */
            rgba(5, 8, 20, .6) 100%
        ),
        url('/images/fanscheering.jpg');
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
}
/* Pricing bullet styling */
.tbt-pricing-bullets li {
    position: relative;
    padding-left: 1.4rem;
    margin-bottom: 0.25rem;
}

.tbt-pricing-bullets li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    font-weight: 700;
    color: #FFC72C;
}

/* Universal headline color for readability */
/* Universal headline color for readability */
h1, h2, h3, h4,
.section-title, .card-title {
    color: #FFC72C !important; /* Gold */
}
/* Headlines on dark backgrounds */
.bg-dark h1, .bg-dark h2, .bg-dark h3, .bg-dark h4 {
    color: #FFC72C !important;
}

/* Headlines on light backgrounds */
.bg-light h1, .bg-light h2, .bg-light h3, .bg-light h4 {
    color: #D20A0A !important; /* Existing red */
}

/* Universal card header color override */
.card h1,
.card h2,
.card h3,
.card h4,
.card .card-title,
.card .h1,
.card .h2,
.card .h3,
.card .h4 {
    color: #FFC72C !important; /* Gold */
}

/* Global gold heading class for card titles & section headers */
.tbt-gold-heading {
    color: #FFC72C;           /* your gold */
}

/* Optional: tweak for small card headings if you want */
.tbt-card-heading {
    color: #FFC72C;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}