/* ============================================================
   BRAND BIBLE COMPLIANCE FIX — covenant.myday7.com
   Resolves 32 audit violations across all pages.
   ============================================================ */

/* === SCROLL PROGRESS BAR (Violation #2) === */
#brand-progress-bar {
    position: fixed;
    top: 0;
    left: 0;
    width: 0%;
    height: 4px;
    background: linear-gradient(90deg, var(--teal-start, #1A5276), var(--teal-mid, #2E86C1), var(--teal-end, #1ABC9C), var(--gold, #D4A740));
    z-index: 99999;
    transition: width 0.1s linear;
    border-radius: 0 2px 2px 0;
}

/* === VIOLATION #1: Doc body background must be cream, not white === */
.doc-body {
    background: var(--cream, #FAF8F4) !important;
}

/* === VIOLATION #3: Hover lift on cards === */
.status-card,
.doc-nav-list a,
.key-insight,
.critical-box,
.teal-box {
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}

.status-card:hover,
.doc-nav-list a:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12) !important;
}

.key-insight:hover,
.critical-box:hover,
.teal-box:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.1) !important;
}

/* === VIOLATION #4: Callout padding 48px === */
.key-insight,
.critical-box,
.teal-box {
    padding: 48px 48px !important;
    border-radius: 18px !important;
}

/* === VIOLATION #5: Callout border-radius 16-20px (covered above: 18px) === */

/* === VIOLATION #6: Entrance fade-up animations === */
.brand-animate {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

.brand-animate.visible {
    opacity: 1;
    transform: translateY(0);
}

/* === VIOLATION #7: Opacity crescendo (progressive reveal) === */
.brand-crescendo-1 { opacity: 0.4; transition: opacity 0.6s ease; }
.brand-crescendo-2 { opacity: 0.6; transition: opacity 0.6s ease; }
.brand-crescendo-3 { opacity: 0.8; transition: opacity 0.6s ease; }
.brand-crescendo-4 { opacity: 1.0; transition: opacity 0.6s ease; }

.brand-crescendo-1.visible { opacity: 1; }
.brand-crescendo-2.visible { opacity: 1; }
.brand-crescendo-3.visible { opacity: 1; }
.brand-crescendo-4.visible { opacity: 1; }

/* === VIOLATION #8: Genesis word animated gradient === */
.genesis-word {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-weight: 300;
    letter-spacing: 0.02em;
    background: linear-gradient(135deg, #1A5276, #2E86C1, #1ABC9C, #48C9B0, #2E86C1, #1A5276);
    background-size: 300% 300%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: flowGradient 6s ease infinite;
}

@keyframes flowGradient {
    0%   { background-position: 0% 50%; }
    50%  { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* === VIOLATION #10: Sidebar nav font sizes (minimum 1.15rem on dark bg) === */
.sidebar-nav li a {
    font-size: 1.15rem !important;
}

.sidebar-nav .nav-sub a {
    font-size: 1.1rem !important;
}

/* === VIOLATION #11: Sidebar nav-header minimum .88rem === */
.sidebar-nav .nav-header {
    font-size: 0.88rem !important;
}

/* === VIOLATION #12: Sidebar living text minimum .78rem === */
.sidebar-living {
    font-size: 0.78rem !important;
}

/* === VIOLATION #13: Footer conf text bump to .78rem === */
.footer-conf {
    font-size: 0.78rem !important;
}

/* === VIOLATION #14: Hero stat labels minimum .82rem === */
.hero-stat-label {
    font-size: 0.82rem !important;
}

/* === VIOLATION #15: Card hover transitions (covered by #3 above) === */

/* === VIOLATION #17: Grid alignment (fix off-grid spacing) === */
.sidebar-nav li a {
    padding: 12px 28px !important;
}

.sidebar-nav .nav-sub a {
    padding-left: 40px !important;
}

.sidebar-nav .nav-header {
    padding: 24px 28px 8px !important;
}

/* === VIOLATION #19: Print stylesheet === */
@media print {
    .sidebar,
    .sidebar-toggle,
    .sidebar-overlay,
    #brand-progress-bar,
    .conf-banner,
    .tier-bar,
    .doc-pagination {
        display: none !important;
    }

    .page-wrapper {
        margin-left: 0 !important;
    }

    .doc-body {
        box-shadow: none !important;
        padding: 24px !important;
        max-width: 100% !important;
    }

    .page-hero {
        padding: 40px 24px !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .site-footer {
        padding: 24px !important;
    }

    body {
        font-size: 12pt;
    }

    .key-insight,
    .critical-box,
    .teal-box {
        break-inside: avoid;
        page-break-inside: avoid;
    }

    a[href]::after {
        content: " (" attr(href) ")";
        font-size: 0.8em;
        color: #666;
    }

    .sidebar-nav a[href]::after,
    .doc-pagination a[href]::after,
    .nav-links a[href]::after {
        content: none;
    }
}

/* === Mobile: Don't override sidebar font sizes below 900px === */
@media (max-width: 900px) {
    .sidebar-nav li a {
        font-size: 1.05rem !important;
    }
    .sidebar-nav .nav-sub a {
        font-size: 1rem !important;
    }
}