/* =============================================================
   invictu5 — Neumorphic Components + Hex Grid + Animations
   ============================================================= */

/* ── HEX GRID OVERLAY ────────────────────────────────────────── */
body::after {
    content: '';
    position: fixed;
    inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='52'%3E%3Cpath d='M30 0 L60 15 L60 45 L30 60 L0 45 L0 15 Z' fill='none' stroke='%2300f5ff' stroke-width='0.6' opacity='0.028'/%3E%3C/svg%3E");
    background-size: 60px 52px;
    pointer-events: none;
    z-index: 0;
    opacity: 1;
    transition: opacity .4s;
}

html[data-theme="light"] body::after { opacity: 0; }

/* Content above overlay */
#main-container, #content, .site-main, main,
.ct-header, .ct-footer,
#invictu5-theme-toggle {
    position: relative;
    z-index: 1;
}

/* ── CARD ENTRY GLOW ─────────────────────────────────────────── */
.ct-post-card::before,
article.post::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(0,245,255,.04) 0%, transparent 60%);
    border-radius: inherit;
    opacity: 0;
    transition: opacity .3s;
    pointer-events: none;
    z-index: 0;
}

.ct-post-card:hover::before, article.post:hover::before { opacity: 1; }

/* ── FEATURED IMAGE ──────────────────────────────────────────── */
.ct-post-card .ct-media-container,
.post-thumbnail {
    border-radius: 14px !important;
    overflow: hidden !important;
    box-shadow: var(--i5-neo-sm) !important;
}

.ct-post-card .ct-media-container img,
.post-thumbnail img {
    transition: transform .6s cubic-bezier(.4,0,.2,1), filter .3s !important;
    filter: brightness(.88) saturate(1.1) !important;
}

.ct-post-card:hover .ct-media-container img,
article:hover .post-thumbnail img {
    transform: scale(1.04) !important;
    filter: brightness(1) saturate(1.2) !important;
}

/* ── SECTION ACCENT LINE ─────────────────────────────────────── */
.entry-content h2::after,
.ct-section h2::after,
.wp-block-heading + * { }

/* h2 with auto-divider */
.ct-section h2,
section > h2,
.entry-content > h2 {
    position: relative;
    padding-bottom: .75rem;
    margin-bottom: 1.5rem;
}

.ct-section h2::after,
.entry-content > h2::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0;
    width: 48px; height: 3px;
    background: linear-gradient(90deg, var(--i5-cyan), var(--i5-green));
    border-radius: 2px;
}

/* ── BREADCRUMBS ─────────────────────────────────────────────── */
.ct-breadcrumbs,
.breadcrumbs, [class*="breadcrumb"] {
    font-family: var(--i5-f-mono) !important;
    font-size: .75rem !important;
    color: var(--i5-muted) !important;
    letter-spacing: .05em;
}

.ct-breadcrumbs a { color: var(--i5-muted) !important; }
.ct-breadcrumbs a:hover { color: var(--i5-cyan) !important; }
.ct-breadcrumbs .ct-separator,
.ct-breadcrumbs span { color: var(--i5-cyan); opacity: .5; }

/* ── TABLE OF CONTENTS ───────────────────────────────────────── */
.ct-toc, [class*="toc"] {
    background: var(--i5-card) !important;
    border: 1px solid rgba(0,245,255,.12) !important;
    border-radius: var(--i5-r-lg) !important;
    padding: 1.5rem !important;
    box-shadow: var(--i5-neo) !important;
}

.ct-toc a { color: var(--i5-muted) !important; font-size: .88rem !important; }
.ct-toc a:hover, .ct-toc a.active { color: var(--i5-cyan) !important; }

/* ── NOTICES / ALERTS ────────────────────────────────────────── */
.ct-alert, .notice, [class*="alert"] {
    border-radius: var(--i5-r-md) !important;
    border-left: 3px solid var(--i5-cyan) !important;
    background: rgba(0,245,255,.05) !important;
    color: var(--i5-txt2) !important;
}

/* ── SCROLL ANIMATIONS (via JS IntersectionObserver) ─────────── */
.anim-hidden {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity .6s ease, transform .6s ease;
}

.anim-visible {
    opacity: 1 !important;
    transform: translateY(0) !important;
}

/* ── CYBER EYEBROW TEXT ──────────────────────────────────────── */
.cyber-eyebrow {
    font-family: var(--i5-f-mono) !important;
    font-size: .72rem !important;
    letter-spacing: .38em !important;
    text-transform: uppercase !important;
    color: var(--i5-green) !important;
    text-shadow: 0 0 12px rgba(57,255,20,.4);
    display: block;
    margin-bottom: .75rem;
}

/* ── GLOW BORDER PULSE ───────────────────────────────────────── */
@keyframes borderGlow {
    0%, 100% { box-shadow: 0 0 8px rgba(0,245,255,.2); }
    50%       { box-shadow: 0 0 24px rgba(0,245,255,.45); }
}

.glow-pulse { animation: borderGlow 3s ease-in-out infinite; }

/* ── MATRIX CANVAS FADE ──────────────────────────────────────── */
@keyframes fadeInMatrix {
    from { opacity: 0; }
    to   { opacity: .12; }
}

#matrix-canvas { animation: fadeInMatrix 1.5s ease forwards; }

/* ── COUNTER NUMBERS ─────────────────────────────────────────── */
.stat-number {
    font-family: var(--i5-f-mono) !important;
    font-size: 3rem !important;
    font-weight: 700 !important;
    color: var(--i5-cyan) !important;
    text-shadow: var(--i5-glow-sm);
    line-height: 1;
}

/* ── LIGHT MODE CARD OVERRIDES ───────────────────────────────── */
html[data-theme="light"] .ct-post-card,
html[data-theme="light"] article.post {
    box-shadow: var(--i5-neo) !important;
    border-color: rgba(0,123,153,.1) !important;
}

html[data-theme="light"] .ct-post-card:hover {
    border-color: rgba(0,123,153,.25) !important;
}

/* ── KEYFRAMES ───────────────────────────────────────────────── */
@keyframes pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50%       { opacity: .6; transform: scale(.85); }
}

@keyframes shimmer {
    0%   { transform: translateX(-100%); }
    100% { transform: translateX(200%); }
}

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

@keyframes scanline {
    0%   { transform: translateY(-100%); }
    100% { transform: translateY(100vh); }
}