:root {
    --bg-primary: #0a1628;
    --bg-secondary: #0d1e35;
    --bg-card: #0f2240;
    --bg-card-hover: #132a4e;
    --accent: #00e5ff;
    --accent-dim: #00bcd4;
    --accent-glow: rgba(0, 229, 255, 0.15);
    --accent-glow-strong: rgba(0, 229, 255, 0.3);
    --text-primary: #e8f4f8;
    --text-secondary: #8bafc4;
    --text-muted: #4a6a82;
    --border: rgba(0, 229, 255, 0.12);
    --border-hover: rgba(0, 229, 255, 0.35);
    --nav-bg: rgba(10, 22, 40, 0.95);
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
    background: var(--bg-primary);
    color: var(--text-primary);
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    line-height: 1.6;
    overflow-x: hidden;
}

/* ── Grid noise overlay ── */
body::before {
    content: '';
    position: fixed;
    inset: 0;
    background-image:
            linear-gradient(rgba(0,229,255,0.02) 1px, transparent 1px),
            linear-gradient(90deg, rgba(0,229,255,0.02) 1px, transparent 1px);
    background-size: 40px 40px;
    pointer-events: none;
    z-index: 0;
}

/* ── NAV ── */
nav {
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 100;
    background: var(--nav-bg);
    backdrop-filter: blur(16px);
    border-bottom: 1px solid var(--border);
    padding: 0 40px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.nav-logo {
    display: flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
}

.logo-icon {
    width: 38px;
    height: 38px;
    position: relative;
}

.logo-icon svg {
    width: 100%;
    height: 100%;
    filter: drop-shadow(0 0 8px var(--accent));
}

.logo-text {
    font-family: 'Rajdhani', sans-serif;
    font-size: 22px;
    font-weight: 700;
    color: var(--accent);
    letter-spacing: 0.5px;
    text-shadow: 0 0 20px rgba(0,229,255,0.4);
}

.nav-links {
    display: flex;
    align-items: center;
    gap: 4px;
    list-style: none;
}

.nav-links a {
    color: var(--text-secondary);
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    padding: 8px 16px;
    border-radius: 6px;
    transition: all 0.2s;
    letter-spacing: 0.3px;
    position: relative;
}

.nav-links a:hover, .nav-links a.active {
    color: var(--accent);
    background: var(--accent-glow);
}

.nav-links .has-dropdown {
    position: relative;
}

.nav-links .has-dropdown > a::after {
    content: ' ▾';
    font-size: 11px;
    opacity: 0.7;
}

.dropdown {
    display: none;
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 10px;
    min-width: 220px;
    padding: 8px;
    z-index: 200;
    box-shadow: 0 20px 60px rgba(0,0,0,0.5), 0 0 30px rgba(0,229,255,0.05);
}

.has-dropdown:hover .dropdown { display: block; }

.dropdown a {
    display: block;
    padding: 8px 14px;
    border-radius: 6px;
    font-size: 13px;
}

.mobile-toggle {
    display: none;
    background: none;
    border: none;
    color: var(--accent);
    cursor: pointer;
}

/* ── LAYOUT ── */
.page-wrap {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
    position: relative;
    z-index: 1;
}

.content-grid {
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: 32px;
    margin-top: 32px;
}

/* ── HERO BANNER ── */
.hero {
    margin-top: 64px;
    padding: 72px 24px 56px;
    text-align: center;
    position: relative;
    z-index: 1;
    overflow: hidden;
}

.hero::before {
    content: '';
    position: absolute;
    top: -60px; left: 50%;
    transform: translateX(-50%);
    width: 600px; height: 300px;
    background: radial-gradient(ellipse, rgba(0,229,255,0.08) 0%, transparent 70%);
    pointer-events: none;
}

.hero-eyebrow {
    display: inline-block;
    font-family: 'Space Mono', monospace;
    font-size: 11px;
    color: var(--accent);
    letter-spacing: 3px;
    text-transform: uppercase;
    background: var(--accent-glow);
    border: 1px solid var(--border-hover);
    padding: 5px 14px;
    border-radius: 20px;
    margin-bottom: 20px;
}

.hero h1 {
    font-family: 'Rajdhani', sans-serif;
    font-size: clamp(32px, 5vw, 54px);
    font-weight: 700;
    line-height: 1.1;
    color: var(--text-primary);
    margin-bottom: 16px;
    letter-spacing: -0.5px;
}

.hero h1 span { color: var(--accent); text-shadow: 0 0 30px rgba(0,229,255,0.5); }

.hero p {
    color: var(--text-secondary);
    font-size: 16px;
    max-width: 480px;
    margin: 0 auto 28px;
}

.subscribe-form {
    display: flex;
    gap: 10px;
    max-width: 420px;
    margin: 0 auto;
}

.subscribe-form input {
    flex: 1;
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 11px 16px;
    color: var(--text-primary);
    font-size: 14px;
    outline: none;
    transition: border 0.2s;
    font-family: 'Inter', sans-serif;
}

.subscribe-form input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-glow); }
.subscribe-form input::placeholder { color: var(--text-muted); }

.btn-primary {
    background: var(--accent);
    color: var(--bg-primary);
    border: none;
    padding: 11px 22px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.2s;
    font-family: 'Rajdhani', sans-serif;
    letter-spacing: 0.5px;
    white-space: nowrap;
}

.btn-primary:hover {
    background: #33ecff;
    box-shadow: 0 0 20px rgba(0,229,255,0.4);
    transform: translateY(-1px);
}

/* ── SECTION HEADERS ── */
.section-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
}

.section-title {
    font-family: 'Rajdhani', sans-serif;
    font-size: 18px;
    font-weight: 700;
    color: var(--text-primary);
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

.section-line {
    flex: 1;
    height: 1px;
    background: linear-gradient(to right, var(--border-hover), transparent);
}

/* ── FEATURED POST ── */
.featured-card {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 14px;
    overflow: hidden;
    transition: all 0.3s;
    cursor: pointer;
    margin-bottom: 32px;
}

.featured-card:hover {
    border-color: var(--border-hover);
    box-shadow: 0 0 40px rgba(0,229,255,0.1);
    transform: translateY(-2px);
}

.featured-img-placeholder {
    width: 100%;
    height: 300px;
    background: linear-gradient(135deg, #0d2a4a 0%, #091e38 50%, #0a2540 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
}

.featured-img-placeholder::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
            radial-gradient(circle at 30% 50%, rgba(0,229,255,0.12) 0%, transparent 50%),
            radial-gradient(circle at 70% 30%, rgba(0,150,200,0.08) 0%, transparent 40%);
}

.featured-img-text {
    font-family: 'Rajdhani', sans-serif;
    font-size: 38px;
    font-weight: 700;
    color: var(--accent);
    text-align: center;
    text-shadow: 0 0 40px rgba(0,229,255,0.6);
    z-index: 1;
    line-height: 1.1;
    padding: 20px;
}

.featured-body { padding: 24px; }

.post-category-badge {
    display: inline-block;
    font-family: 'Space Mono', monospace;
    font-size: 10px;
    font-weight: 700;
    color: var(--accent);
    background: var(--accent-glow);
    border: 1px solid rgba(0,229,255,0.2);
    padding: 3px 10px;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 12px;
}

.post-title {
    font-family: 'Rajdhani', sans-serif;
    font-size: 22px;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 10px;
    line-height: 1.3;
    transition: color 0.2s;
}

.featured-card:hover .post-title { color: var(--accent); }

.post-meta {
    display: flex;
    align-items: center;
    gap: 16px;
    color: var(--text-muted);
    font-size: 12px;
    margin-bottom: 12px;
    font-family: 'Space Mono', monospace;
    flex-wrap: wrap;
}

.post-meta span { display: flex; align-items: center; gap: 5px; }

.post-excerpt {
    color: var(--text-secondary);
    font-size: 14px;
    line-height: 1.6;
    margin-bottom: 16px;
}

.read-more {
    color: var(--accent);
    text-decoration: none;
    font-size: 13px;
    font-weight: 600;
    font-family: 'Space Mono', monospace;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: gap 0.2s;
}

.read-more:hover { gap: 10px; }

/* ── LATEST POSTS (list) ── */
.latest-section { margin-bottom: 32px; }

.post-list-card {
    display: grid;
    grid-template-columns: 100px 1fr;
    gap: 16px;
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 16px;
    margin-bottom: 12px;
    cursor: pointer;
    transition: all 0.25s;
}

.post-list-card:hover {
    border-color: var(--border-hover);
    background: var(--bg-card-hover);
    transform: translateX(4px);
    box-shadow: -3px 0 0 var(--accent);
}

.post-list-thumb {
    width: 100px;
    height: 70px;
    border-radius: 7px;
    overflow: hidden;
    background: linear-gradient(135deg, #0d2a4a, #1a3a6b);
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Rajdhani', sans-serif;
    font-size: 10px;
    color: var(--accent);
    text-align: center;
    font-weight: 700;
    line-height: 1.2;
    padding: 6px;
}

.post-list-body .post-title {
    font-size: 15px;
    margin-bottom: 6px;
}

/* ── POPULAR POSTS (grid) ── */
.popular-section { margin-bottom: 32px; }

.popular-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.popular-card {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.25s;
}

.popular-card:hover {
    border-color: var(--border-hover);
    box-shadow: 0 8px 30px rgba(0,229,255,0.1);
    transform: translateY(-3px);
}

.popular-thumb {
    width: 100%;
    height: 110px;
    background: linear-gradient(135deg, #0d2a4a, #0a3050);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Rajdhani', sans-serif;
    font-size: 12px;
    font-weight: 700;
    color: var(--accent);
    text-align: center;
    padding: 10px;
    line-height: 1.2;
    position: relative;
    overflow: hidden;
}

.popular-thumb::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 40px;
    background: linear-gradient(to top, var(--bg-card), transparent);
}

.popular-body { padding: 14px; }

.popular-body .post-title {
    font-size: 13px;
    color: var(--accent);
    margin-bottom: 6px;
    line-height: 1.3;
}

.popular-body .post-excerpt {
    font-size: 12px;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ── CATEGORIES GRID ── */
.categories-section { margin-bottom: 32px; }

.categories-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.category-tile {
    border-radius: 12px;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.3s;
    border: 1px solid var(--border);
    position: relative;
    height: 160px;
}

.category-tile:hover {
    border-color: var(--accent);
    box-shadow: 0 0 30px rgba(0,229,255,0.15);
    transform: scale(1.02);
}

.cat-bg {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Rajdhani', sans-serif;
    font-size: 48px;
    font-weight: 700;
    letter-spacing: -2px;
    opacity: 0.15;
    color: var(--accent);
    pointer-events: none;
}

.cat-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(9,18,32,0.95) 0%, rgba(9,18,32,0.4) 60%, transparent 100%);
}

.cat-content {
    position: absolute;
    bottom: 0; left: 0; right: 0;
    padding: 14px 16px;
}

.cat-name {
    font-family: 'Rajdhani', sans-serif;
    font-size: 16px;
    font-weight: 700;
    color: var(--accent);
    display: block;
    margin-bottom: 4px;
}

.cat-meta {
    font-size: 11px;
    color: var(--text-muted);
    font-family: 'Space Mono', monospace;
}

.cat-bg-1 { background: linear-gradient(135deg, #091428 0%, #0d2a50 100%); }
.cat-bg-2 { background: linear-gradient(135deg, #0a1a30 0%, #0d3a52 100%); }
.cat-bg-3 { background: linear-gradient(135deg, #12082a 0%, #1a0d3a 100%); }
.cat-bg-4 { background: linear-gradient(135deg, #091428 0%, #051838 100%); }

/* ── SIDEBAR ── */
.sidebar { position: sticky; top: 80px; align-self: start; }

.sidebar-widget {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 20px;
    margin-bottom: 20px;
}

.widget-title {
    font-family: 'Rajdhani', sans-serif;
    font-size: 14px;
    font-weight: 700;
    color: var(--text-primary);
    text-transform: uppercase;
    letter-spacing: 1.5px;
    margin-bottom: 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--border);
    display: flex;
    align-items: center;
    gap: 8px;
}

.widget-title::before {
    content: '';
    width: 3px;
    height: 14px;
    background: var(--accent);
    border-radius: 2px;
    box-shadow: 0 0 8px var(--accent);
    display: block;
}

/* Tags */
.tags-wrap { display: flex; flex-wrap: wrap; gap: 8px; }

.tag-pill {
    font-family: 'Space Mono', monospace;
    font-size: 11px;
    color: var(--accent);
    background: var(--accent-glow);
    border: 1px solid rgba(0,229,255,0.2);
    padding: 4px 12px;
    border-radius: 20px;
    cursor: pointer;
    transition: all 0.2s;
    text-decoration: none;
}

.tag-pill:hover {
    background: rgba(0,229,255,0.2);
    border-color: var(--accent);
    box-shadow: 0 0 12px rgba(0,229,255,0.2);
}

/* Category list */
.cat-list { list-style: none; }

.cat-list li {
    border-bottom: 1px solid var(--border);
    padding: 8px 0;
}

.cat-list li:last-child { border-bottom: none; }

.cat-list a {
    color: var(--text-secondary);
    text-decoration: none;
    font-size: 13px;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: color 0.2s;
}

.cat-list a::before {
    content: '›';
    color: var(--accent);
    font-size: 16px;
    line-height: 1;
}

.cat-list a:hover { color: var(--accent); padding-left: 4px; }

/* Newsletter widget */
.newsletter-widget input {
    width: 100%;
    background: var(--bg-secondary);
    border: 1px solid var(--border);
    border-radius: 7px;
    padding: 10px 14px;
    color: var(--text-primary);
    font-size: 13px;
    outline: none;
    margin-bottom: 10px;
    font-family: 'Inter', sans-serif;
    transition: border 0.2s;
}

.newsletter-widget input:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 2px var(--accent-glow);
}

.newsletter-widget input::placeholder { color: var(--text-muted); }

.newsletter-widget .btn-primary { width: 100%; justify-content: center; display: block; }

/* ── FOOTER ── */
footer {
    background: var(--bg-secondary);
    border-top: 1px solid var(--border);
    margin-top: 64px;
    position: relative;
    z-index: 1;
}

.footer-top {
    max-width: 1200px;
    margin: 0 auto;
    padding: 48px 24px 32px;
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr 1fr;
    gap: 40px;
}

.footer-brand p {
    color: var(--text-secondary);
    font-size: 13px;
    line-height: 1.7;
    margin-top: 14px;
    margin-bottom: 14px;
}

.footer-more {
    color: var(--accent);
    text-decoration: none;
    font-size: 13px;
    font-weight: 600;
}

.footer-col-title {
    font-family: 'Rajdhani', sans-serif;
    font-size: 13px;
    font-weight: 700;
    color: var(--accent);
    text-transform: uppercase;
    letter-spacing: 1.5px;
    margin-bottom: 16px;
}

.footer-links { list-style: none; }

.footer-links li { margin-bottom: 9px; }

.footer-links a {
    color: var(--text-secondary);
    text-decoration: none;
    font-size: 13px;
    transition: color 0.2s;
}

.footer-links a:hover { color: var(--accent); }

.footer-bottom {
    border-top: 1px solid var(--border);
    padding: 20px 24px;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.footer-copy {
    color: var(--text-muted);
    font-size: 12px;
    font-family: 'Space Mono', monospace;
}

.social-links {
    display: flex;
    gap: 10px;
}

.social-btn {
    width: 34px;
    height: 34px;
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s;
    text-decoration: none;
    color: var(--text-secondary);
    font-size: 14px;
}

.social-btn:hover {
    border-color: var(--accent);
    background: var(--accent-glow);
    color: var(--accent);
    box-shadow: 0 0 12px rgba(0,229,255,0.2);
}



/* PAGE INTRO */
.page-intro{
    margin-top:64px;padding:48px 24px 0;position:relative;z-index:1;
    animation:fadeInUp 0.5s ease both;
}
.page-intro-inner{
    background:var(--bg-card);border:1px solid var(--border);border-radius:16px;
    padding:40px 48px;position:relative;overflow:hidden;
}
.page-intro-inner::before{
    position:absolute;right:-10px;top:50%;transform:translateY(-50%);
    font-family:'Rajdhani',sans-serif;font-size:120px;font-weight:700;
    color:var(--accent);opacity:0.03;letter-spacing:-4px;pointer-events:none;
}
.page-intro-inner.about::before{
    content:'ABOUT';
}
.page-intro-inner.contact::before{
    content:'CONTACT';position:absolute;right:-10px;top:50%;transform:translateY(-50%);
    font-family:'Rajdhani',sans-serif;font-size:120px;font-weight:700;
    color:var(--accent);opacity:0.03;letter-spacing:-4px;pointer-events:none;
}
.page-eyebrow{
    font-family:'Space Mono',monospace;font-size:11px;color:var(--accent);
    background:var(--accent-glow);border:1px solid var(--border-hover);
    padding:4px 14px;border-radius:20px;letter-spacing:2px;text-transform:uppercase;
    margin-bottom:18px;display:inline-block;
}
.page-intro-inner h1{
    font-family:'Rajdhani',sans-serif;font-size:clamp(28px,4vw,44px);font-weight:700;
    color:var(--text-primary);margin-bottom:16px;line-height:1.1;
}
.page-intro-inner h1 span{color:var(--accent);text-shadow:0 0 20px rgba(0,229,255,0.4)}
.page-intro-inner p{color:var(--text-secondary);font-size:15px;max-width:600px}

/* ABOUT CONTENT */
.about-content{animation:fadeInUp 0.5s ease 0.1s both}

.about-section{margin-bottom:32px}
.section-title-bar{
    display:flex;align-items:center;gap:12px;margin-bottom:18px;
}
.section-title-bar h2{
    font-family:'Rajdhani',sans-serif;font-size:22px;font-weight:700;
    color:var(--text-primary);letter-spacing:0.3px;
}
.section-title-bar::after{content:'';flex:1;height:1px;background:linear-gradient(to right,var(--border-hover),transparent)}

.about-text{color:var(--text-secondary);font-size:15px;line-height:1.8;margin-bottom:14px}

/* FEATURE LIST */
.feature-list{list-style:none;display:flex;flex-direction:column;gap:12px}
.feature-list li{
    background:var(--bg-card);border:1px solid var(--border);border-radius:10px;
    padding:14px 18px;display:flex;align-items:flex-start;gap:14px;
    transition:all 0.2s;cursor:default;
}
.feature-list li:hover{border-color:var(--border-hover);transform:translateX(4px);box-shadow:-3px 0 0 var(--accent)}
.feature-icon{font-size:22px;flex-shrink:0;margin-top:2px}
.feature-text strong{display:block;font-family:'Rajdhani',sans-serif;font-size:16px;font-weight:700;color:var(--text-primary);margin-bottom:3px}
.feature-text span{font-size:13px;color:var(--text-secondary)}

/* MISSION CARD */
.mission-card{
    background:linear-gradient(135deg,var(--bg-card) 0%,#0a2040 100%);
    border:1px solid var(--border-hover);border-radius:14px;padding:28px 32px;
    position:relative;overflow:hidden;margin-bottom:32px;
    animation:fadeInUp 0.5s ease 0.2s both;
}
.mission-card::before{
    content:'';position:absolute;top:-40px;right:-40px;width:200px;height:200px;
    background:radial-gradient(circle,rgba(0,229,255,0.08),transparent 70%);
    pointer-events:none;
}
.mission-card h2{font-family:'Rajdhani',sans-serif;font-size:22px;font-weight:700;color:var(--accent);margin-bottom:12px}
.mission-card p{color:var(--text-secondary);font-size:15px;line-height:1.8;position:relative;z-index:1}

/* DIFF GRID */
.diff-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:32px;animation:fadeInUp 0.5s ease 0.25s both}
.diff-card{
    background:var(--bg-card);border:1px solid var(--border);border-radius:10px;
    padding:18px 20px;transition:all 0.25s;
}
.diff-card:hover{border-color:var(--border-hover);box-shadow:0 8px 24px rgba(0,229,255,0.08);transform:translateY(-2px)}
.diff-card-icon{font-size:24px;margin-bottom:10px}
.diff-card-title{font-family:'Rajdhani',sans-serif;font-size:16px;font-weight:700;color:var(--text-primary);margin-bottom:6px}
.diff-card-text{font-size:13px;color:var(--text-secondary);line-height:1.5}

/* COMMUNITY */
.community-section{
    background:var(--bg-card);border:1px solid var(--border);border-radius:14px;
    padding:28px 32px;animation:fadeInUp 0.5s ease 0.3s both;margin-bottom:32px;
}
.community-section h2{font-family:'Rajdhani',sans-serif;font-size:22px;font-weight:700;color:var(--text-primary);margin-bottom:18px}
.community-link{
    display:flex;align-items:center;gap:14px;padding:14px 0;
    border-bottom:1px solid var(--border);
}
.community-link:last-child{border-bottom:none;padding-bottom:0}
.community-link-icon{font-size:22px;width:40px;text-align:center;flex-shrink:0}
.community-link-body{}
.community-link-label{font-size:12px;color:var(--text-muted);font-family:'Space Mono',monospace;margin-bottom:3px}
.community-link-value{font-size:14px;color:var(--text-primary)}
.community-link-value a{color:var(--accent);text-decoration:none}
.community-link-value a:hover{text-decoration:underline}

/* CLOSING */
.closing-note{
    font-family:'Rajdhani',sans-serif;font-size:18px;color:var(--text-secondary);
    text-align:center;padding:24px;border-top:1px solid var(--border);
    animation:fadeInUp 0.5s ease 0.35s both;
}
.closing-note span{color:var(--accent)}

input.cf-form {
    width: 100%;
    background: var(--bg-secondary);
    border: 1px solid var(--border);
    border-radius: 7px;
    padding: 10px 14px;
    color: var(--text-primary);
    font-size: 13px;
    outline: none;
    margin-bottom: 10px;
    font-family: 'Inter', sans-serif;
    transition: border 0.2s;
}
textarea.cf-form {
    width: 100%;
    background: var(--bg-secondary);
    border: 1px solid var(--border);
    border-radius: 7px;
    padding: 10px 14px;
    color: var(--text-primary);
    font-size: 13px;
    outline: none;
    margin-bottom: 10px;
    font-family: 'Inter', sans-serif;
    transition: border 0.2s;
}
#contact_form_us label{
    display: block;
    margin-bottom: 5px;
}


/* PAGE HEADER */
.page-header-section{
    margin-top:64px;padding:40px 24px 0;position:relative;z-index:1;
    animation:fadeInUp 0.5s ease both;
}
.page-header-inner{
    background:var(--bg-card);border:1px solid var(--border);border-radius:14px;
    padding:32px 40px;position:relative;overflow:hidden;
}
.page-header-inner::before{
    content:'§';position:absolute;right:30px;top:50%;transform:translateY(-50%);
    font-size:140px;color:var(--accent);opacity:0.04;font-family:'Rajdhani',sans-serif;
    pointer-events:none;
}
.page-eyebrow{font-family:'Space Mono',monospace;font-size:11px;color:var(--accent);background:var(--accent-glow);border:1px solid var(--border-hover);padding:4px 14px;border-radius:20px;letter-spacing:2px;text-transform:uppercase;margin-bottom:14px;display:inline-block}
.page-header-inner h1{font-family:'Rajdhani',sans-serif;font-size:clamp(26px,3.5vw,40px);font-weight:700;color:var(--text-primary);margin-bottom:10px}
.effective-date{font-family:'Space Mono',monospace;font-size:11px;color:var(--text-muted);padding:5px 12px;background:rgba(0,229,255,0.05);border:1px solid var(--border);border-radius:6px;display:inline-block}

/* TOC */
.toc-widget{
    background:var(--bg-card);border:1px solid var(--border);border-radius:12px;
    padding:20px;margin-bottom:28px;animation:fadeInUp 0.5s ease 0.1s both;
}
.toc-title{font-family:'Rajdhani',sans-serif;font-size:14px;font-weight:700;color:var(--text-primary);text-transform:uppercase;letter-spacing:1.5px;margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:8px}
.toc-title::before{content:'';width:3px;height:14px;background:var(--accent);border-radius:2px;box-shadow:0 0 8px var(--accent);display:block}
.toc-list{list-style:none}
.toc-list li{padding:5px 0;border-bottom:1px solid var(--border)}
.toc-list li:last-child{border-bottom:none}
.toc-list a{color:var(--text-secondary);text-decoration:none;font-size:13px;display:flex;align-items:center;gap:10px;transition:all 0.2s}
.toc-list a:hover{color:var(--accent);padding-left:4px}
.toc-num{font-family:'Space Mono',monospace;font-size:10px;color:var(--accent);width:20px;flex-shrink:0;opacity:0.7}

/* POLICY CONTENT */
.policy-content{animation:fadeInUp 0.5s ease 0.15s both}
.policy-section{
    background:var(--bg-card);border:1px solid var(--border);border-radius:12px;
    padding:26px 28px;margin-bottom:16px;transition:border 0.2s;
}
.policy-section:hover{border-color:rgba(0,229,255,0.22)}
.policy-section-header{
    display:flex;align-items:center;gap:14px;margin-bottom:14px;
    cursor:pointer;
}
.policy-num{
    font-family:'Space Mono',monospace;font-size:11px;font-weight:700;
    color:var(--bg-primary);background:var(--accent);
    width:26px;height:26px;border-radius:6px;
    display:flex;align-items:center;justify-content:center;flex-shrink:0;
    box-shadow:0 0 12px rgba(0,229,255,0.3);
}
.policy-section-title{font-family:'Rajdhani',sans-serif;font-size:19px;font-weight:700;color:var(--text-primary)}
.policy-body{color:var(--text-secondary);font-size:14px;line-height:1.8}
.policy-body p{margin-bottom:12px}
.policy-body p:last-child{margin-bottom:0}
.policy-list{list-style:none;margin-top:10px;display:flex;flex-direction:column;gap:8px}
.policy-list li{display:flex;align-items:flex-start;gap:10px;font-size:14px;color:var(--text-secondary)}
.policy-list li::before{content:'›';color:var(--accent);font-size:16px;flex-shrink:0;margin-top:1px}
.policy-highlight{
    background:rgba(0,229,255,0.06);border:1px solid rgba(0,229,255,0.15);
    border-radius:8px;padding:12px 16px;margin-top:12px;
    font-size:13px;color:var(--text-secondary);
}
.policy-highlight a{color:var(--accent);text-decoration:none}
.policy-highlight a:hover{text-decoration:underline}

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

@keyframes pulse-glow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(0,229,255,0); }
    50% { box-shadow: 0 0 0 6px rgba(0,229,255,0.08); }
}

.hero { animation: fadeInUp 0.6s ease both; }
.featured-card { animation: fadeInUp 0.6s ease 0.1s both; }
.latest-section { animation: fadeInUp 0.6s ease 0.2s both; }
.popular-section { animation: fadeInUp 0.6s ease 0.3s both; }
.categories-section { animation: fadeInUp 0.6s ease 0.4s both; }

.post-body a{
    color: #06b6d4;
}
.post-body a:hover{
    color: var(--accent);
}

.featured-card:hover .featured-body .post-title a{
    color: var(--accent);
    text-decoration: none;
}
.featured-card .featured-body .post-title a{
    color: #06b6d4;
    text-decoration: none;
}
.post-list-card:hover .post-title a,
.post-list-card:hover .post-list-body .post-title a{
    color: var(--accent);
    text-decoration: none;
}
.post-list-card .post-title a,
.post-list-card .post-list-body .post-title a{
    color: #06b6d4;
    text-decoration: none;
}

.popular-card:hover .popular-body .post-title a{
    color: var(--accent);
    text-decoration: none;
}
.popular-card .popular-body .post-title a{
    color: #06b6d4;
    text-decoration: none;
}



/* BREADCRUMB */
.page-header{margin-top:64px;padding:32px 24px 0;position:relative;z-index:1}
.breadcrumb{font-family:'Space Mono',monospace;font-size:11px;color:var(--text-muted);margin-bottom:0;display:flex;align-items:center;gap:8px;flex-wrap: wrap;}
.breadcrumb a{color:var(--accent);text-decoration:none}
.breadcrumb span{opacity:0.4}

/* ARTICLE */
@keyframes fadeInUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
article{animation:fadeInUp 0.5s ease both}

.post-header{margin-bottom:28px}
.post-header .post-category-badge{
    display:inline-block;font-family:'Space Mono',monospace;font-size:10px;font-weight:700;
    color:var(--accent);background:var(--accent-glow);border:1px solid rgba(0,229,255,0.2);
    padding:3px 10px;border-radius:4px;text-transform:uppercase;letter-spacing:1px;margin-bottom:14px;
}
.post-header h1{
    font-family:'Rajdhani',sans-serif;font-size:clamp(24px,3vw,36px);font-weight:700;
    color:var(--text-primary);line-height:1.2;margin-bottom:14px;
}
.post-meta{
    display:flex;align-items:center;gap:16px;color:var(--text-muted);
    font-size:12px;font-family:'Space Mono',monospace;flex-wrap: wrap;
}
.post-meta span{display:flex;align-items:center;gap:5px}

/* FEATURED IMAGE */
.post-featured-img{
    width:100%;min-height:260px;height:auto;aspect-ratio: 16 / 9;border-radius:14px;overflow:hidden;
    background:linear-gradient(135deg,#091428 0%,#0d2a50 50%,#091e3a 100%);
    display:flex;align-items:center;justify-content:center;
    position:relative;margin-bottom:28px;border:1px solid var(--border);
}
.post-featured-img::before{
    content:'';position:absolute;inset:0;
    background:radial-gradient(circle at 30% 50%,rgba(0,229,255,0.1) 0%,transparent 50%),
    radial-gradient(circle at 75% 30%,rgba(0,150,200,0.07) 0%,transparent 40%);
}
.post-featured-ghost{
    font-family:'Rajdhani',sans-serif;font-size: clamp(60px, 15vw, 120px);font-weight:700;
    color:var(--accent);opacity:0.05;position:absolute;letter-spacing:-3px;
}
.post-featured-text{
    font-family:'Rajdhani',sans-serif;font-size:clamp(20px, 4vw, 32px);font-weight:700;
    color:var(--accent);text-align:center;text-shadow:0 0 40px rgba(0,229,255,0.5);
    z-index:1;line-height:1.2;padding:20px;max-width:500px;
}

/* ARTICLE BODY */
.post-body{margin-bottom:32px}
.post-body p{color:var(--text-secondary);font-size:15px;line-height:1.75;margin-bottom:18px}
.post-body h2{font-family:'Rajdhani',sans-serif;font-size:22px;font-weight:700;color:var(--text-primary);margin:28px 0 12px;border-left:3px solid var(--accent);padding-left:14px}

/* VIDEO EMBED PLACEHOLDER */
.video-embed{
    background:var(--bg-card);border:1px solid var(--border);border-radius:10px;
    height:clamp(180px, 40vw, 360px);display:flex;align-items:center;justify-content:center;
    margin-bottom:24px;position:relative;overflow:hidden;cursor:pointer;
    transition:all 0.25s;
}
.video-embed:hover{border-color:var(--border-hover);box-shadow:0 0 30px rgba(0,229,255,0.1)}
.video-embed::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,rgba(0,229,255,0.05),transparent 60%)}
.play-btn{
    width:60px;height:60px;background:var(--accent);border-radius:50%;
    display:flex;align-items:center;justify-content:center;position:relative;z-index:1;
    box-shadow:0 0 30px rgba(0,229,255,0.4);transition:transform 0.2s;
}
.video-embed:hover .play-btn{transform:scale(1.1)}
.play-btn::after{content:'▶';color:var(--bg-primary);font-size:20px;margin-left:3px}
.video-label{position:absolute;bottom:14px;left:14px;right:14px;font-family:'Space Mono',monospace;font-size:11px;color:var(--text-muted);z-index:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* MORE VIDEOS */
.more-videos{margin-bottom:28px}
.more-videos-label{font-family:'Space Mono',monospace;font-size:11px;color:var(--text-muted);margin-bottom:12px;letter-spacing:1px}
.video-scroll{display:flex;gap:12px;overflow-x:auto;padding-bottom:8px;scroll-snap-type: x mandatory;}
.video-scroll::-webkit-scrollbar{height:4px}
.video-scroll::-webkit-scrollbar-track{background:var(--bg-secondary);border-radius:2px}
.video-scroll::-webkit-scrollbar-thumb{background:var(--accent-glow);border-radius:2px}
.video-mini{
    flex-shrink:0;width:150px;background:var(--bg-card);border:1px solid var(--border);
    border-radius:8px;overflow:hidden;cursor:pointer;transition:all 0.2s;scroll-snap-align: start;
}
.video-mini:hover{border-color:var(--border-hover);transform:translateY(-2px)}
.video-mini-thumb{
    height:84px;background:linear-gradient(135deg,#0d2a4a,#1a3a6b);
    display:flex;align-items:center;justify-content:center;
    font-family:'Rajdhani',sans-serif;font-size:10px;font-weight:700;
    color:var(--accent);text-align:center;padding:8px;line-height:1.2;
}
.video-mini-title{padding:8px;font-size:11px;color:var(--text-secondary);line-height:1.3}

/* CHAPTERS */
.chapters-section{
    background:var(--bg-card);border:1px solid var(--border);border-radius:12px;
    padding:clamp(16px, 4vw, 22px);margin-bottom:28px;
}
.chapters-title{
    font-family:'Rajdhani',sans-serif;font-size:15px;font-weight:700;
    color:var(--text-primary);margin-bottom:16px;display:flex;align-items:center;gap:8px;
}
.chapters-title::before{content:'';width:3px;height:14px;background:var(--accent);border-radius:2px;box-shadow:0 0 8px var(--accent);display:block}
.chapter-row{
    display:flex;align-items:flex-start;gap:12px;padding:9px 0;
    border-bottom:1px solid var(--border);
}
.chapter-row:last-child{border-bottom:none}
.chapter-time{
    font-family:'Space Mono',monospace;font-size:12px;color:var(--accent);
    flex-shrink:0;width:48px;font-weight:700;
}
.chapter-label{font-size:13px;color:var(--text-secondary);line-height: 1.4;}

/* TAGS BLOCK */
.post-tags-block{margin-bottom:28px}
.post-tags-block .tags-wrap{display:flex;flex-wrap:wrap;gap:8px}
.tag-pill{
    font-family:'Space Mono',monospace;font-size:11px;color:var(--accent);
    background:var(--accent-glow);border:1px solid rgba(0,229,255,0.2);
    padding:4px 12px;border-radius:20px;cursor:pointer;transition:all 0.2s;text-decoration:none;
}
.tag-pill:hover{background:rgba(0,229,255,0.2);border-color:var(--accent)}

/* CREDITS */
.credits-section{
    background:var(--bg-card);border:1px solid var(--border);border-radius:10px;
    padding:18px 20px;margin-bottom:28px;
}
.credits-title{font-family:'Rajdhani',sans-serif;font-size:14px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:1px;margin-bottom:12px}
.credit-row{font-size:12px;color:var(--text-muted);margin-bottom:6px;line-height:1.5; word-break: break-all;}
.credit-row a{color:var(--accent);text-decoration:none}


/* COMMENTS */
.comments-section{animation:fadeInUp 0.5s ease 0.3s both}
.comments-header{
    font-family:'Rajdhani',sans-serif;font-size:20px;font-weight:700;
    color:var(--accent);margin-bottom:20px;display:flex;align-items:center;gap:10px;
}
.comments-header::after{content:'';flex:1;height:1px;background:linear-gradient(to right,var(--border-hover),transparent)}
.comment-form{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:clamp(16px, 5vw, 24px)}
.form-row{margin-bottom:14px}
.form-row input,.form-row textarea{
    width:100%;background:var(--bg-secondary);border:1px solid var(--border);
    border-radius:8px;padding:11px 14px;color:var(--text-primary);font-size:14px;
    outline:none;font-family:'Inter',sans-serif;transition:border 0.2s;
}
.form-row input:focus,.form-row textarea:focus{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-glow)}
.form-row input::placeholder,.form-row textarea::placeholder{color:var(--text-muted)}
.form-row textarea{resize:vertical;min-height:100px}
.btn-comment{
    background:var(--accent);color:var(--bg-primary);border:none;
    padding:11px 28px;border-radius:8px;font-weight:700;font-size:14px;
    cursor:pointer;font-family:'Rajdhani',sans-serif;letter-spacing:0.5px;
    transition:all 0.2s; width: 100%;
}
@media (min-width: 640px) { .btn-comment { width: auto; } }
.btn-comment:hover{background:#33ecff;box-shadow:0 0 20px rgba(0,229,255,0.4);transform:translateY(-1px)}

/* CATEGORY BANNER */
.cat-banner {
    background:var(--bg-card);
    border:1px solid var(--border);
    border-radius:14px;
    overflow:hidden;
    margin-bottom:32px;
    animation:fadeInUp 0.5s ease both;
}
@keyframes fadeInUp {
    from{opacity:0;transform:translateY(20px)} to{opacity:1;transform:translateY(0)}
}
.cat-banner-img {
    width:100%; height:260px;
    background:linear-gradient(135deg, #091428 0%, #0d2a50 50%, #091e3a 100%);
    display:flex; align-items:center; justify-content:center;
    position:relative; overflow:hidden;
}
.cat-banner-img::before {
    content:'';
    position:absolute; inset:0;
    background:
            radial-gradient(circle at 20% 50%, rgba(0,229,255,0.1) 0%, transparent 50%),
            radial-gradient(circle at 80% 30%, rgba(0,150,200,0.07) 0%, transparent 40%);
}
.cat-banner-ghost {
    font-family:'Rajdhani',sans-serif; font-size:120px; font-weight:700;
    color:var(--accent); opacity:0.06; position:absolute;
    letter-spacing:-4px; user-select:none;
}
.cat-banner-content {
    position:relative; z-index:1; text-align:center;
}
.cat-banner-icon {
    font-family:'Space Mono',monospace; font-size:11px; color:var(--accent);
    background:var(--accent-glow); border:1px solid var(--border-hover);
    padding:4px 14px; border-radius:20px; letter-spacing:2px;
    text-transform:uppercase; margin-bottom:14px; display:inline-block;
}
.cat-banner-title {
    font-family:'Rajdhani',sans-serif; font-size:38px; font-weight:700;
    color:var(--text-primary); text-shadow:0 0 40px rgba(0,229,255,0.2);
}
.cat-banner-body { padding:20px 24px; }
.cat-banner-meta {
    font-family:'Space Mono',monospace; font-size:11px; color:var(--text-muted);
    margin-bottom:10px; display:flex; gap:16px; flex-wrap:wrap;
}
.cat-banner-desc { color:var(--text-secondary); font-size:14px; }

/* SECTION HEADER */
.section-header { display:flex; align-items:center; gap:12px; margin-bottom:20px; }
.section-title {
    font-family:'Rajdhani',sans-serif; font-size:18px; font-weight:700;
    color:var(--text-primary); letter-spacing:0.5px; text-transform:uppercase;
    white-space:nowrap;
}
.section-line {
    flex:1; height:1px;
    background:linear-gradient(to right, var(--border-hover), transparent);
}

/* SUBCATEGORIES EMPTY STATE */
.subcategory-box {
    background:var(--bg-card); border:1px solid var(--border); border-radius:10px;
    padding:40px 24px; text-align:center; margin-bottom:32px;
    animation:fadeInUp 0.5s ease 0.15s both;
}
.subcategory-box .empty-icon { font-size:32px; margin-bottom:10px; opacity:0.4; }
.subcategory-box p { color:var(--text-muted); font-size:13px; font-style:italic; }

/* POST LIST CARDS */
.posts-list { animation:fadeInUp 0.5s ease 0.25s both; }
.post-list-card {
    display:grid; grid-template-columns:110px 1fr; gap:16px;
    background:var(--bg-card); border:1px solid var(--border);
    border-radius:10px; padding:16px; margin-bottom:12px;
    cursor:pointer; transition:all 0.25s;
}
.post-list-card:hover {
    border-color:var(--border-hover); background:var(--bg-card-hover);
    transform:translateX(4px); box-shadow:-3px 0 0 var(--accent);
}
.post-list-thumb {
    width:110px; height:76px; border-radius:7px;
    background:linear-gradient(135deg,#0d2a4a,#1a3a6b);
    display:flex; align-items:center; justify-content:center;
    font-family:'Rajdhani',sans-serif; font-size:10px; color:var(--accent);
    text-align:center; font-weight:700; line-height:1.2; padding:6px;
    flex-shrink:0; position:relative; overflow:hidden;
}
.post-list-thumb::before {
    content:''; position:absolute; inset:0;
    background:radial-gradient(circle at 50% 50%, rgba(0,229,255,0.08), transparent 70%);
}
.thumb-label { position:relative; z-index:1; }
.post-cat-tag {
    display:inline-block; font-family:'Space Mono',monospace; font-size:10px;
    font-weight:700; color:var(--accent); background:var(--accent-glow);
    border:1px solid rgba(0,229,255,0.2); padding:2px 8px; border-radius:4px;
    text-transform:uppercase; letter-spacing:0.8px; margin-bottom:8px;
}
.post-title {
    font-family:'Rajdhani',sans-serif; font-size:16px; font-weight:700;
    color:var(--text-primary); margin-bottom:6px; line-height:1.3; transition:color 0.2s;
}
.post-list-card:hover .post-title { color:var(--accent); }
.post-meta {
    display:flex; align-items:center; gap:14px; color:var(--text-muted);
    font-size:11px; margin-bottom:8px; font-family:'Space Mono',monospace; flex-wrap:wrap;
}
.post-excerpt { color:var(--text-secondary); font-size:13px; line-height:1.5; margin-bottom:8px; }
.read-more {
    color:var(--accent); text-decoration:none; font-size:12px; font-weight:600;
    font-family:'Space Mono',monospace; display:inline-flex; align-items:center;
    gap:5px; transition:gap 0.2s;
}
.read-more:hover { gap:9px; }


/* ── GLOW SCAN LINE ── */
nav::after {
    content: '';
    position: absolute;
    bottom: -1px; left: 0;
    width: 120px; height: 1px;
    background: linear-gradient(to right, transparent, var(--accent), transparent);
    animation: scanNav 4s ease-in-out infinite;
}

@keyframes scanNav {
    0% { left: 0; opacity: 0; }
    10% { opacity: 1; }
    90% { opacity: 1; }
    100% { left: calc(100% - 120px); opacity: 0; }
}

/* ── RESPONSIVE STYLES ── */
@media (max-width: 992px) {
    .content-grid {
        grid-template-columns: 1fr;
    }

    .sidebar {
        position: static;
        margin-top: 40px;
    }

    .popular-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .footer-top {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    nav {
        padding: 0 20px;
    }

    .nav-links {
        display: none;
        position: absolute;
        top: 64px;
        left: 0;
        right: 0;
        background: var(--nav-bg);
        flex-direction: column;
        padding: 20px;
        border-bottom: 1px solid var(--border);
        gap: 10px;
    }

    .nav-links.show {
        display: flex;
    }

    .nav-links a {
        width: 100%;
        display: block;
        padding: 12px;
    }

    .mobile-toggle {
        display: block;
    }

    .has-dropdown:hover .dropdown {
        position: static;
        display: block;
        background: transparent;
        border: none;
        box-shadow: none;
        padding-left: 20px;
    }

    .hero {
        padding: 60px 20px 40px;
    }

    .hero h1 {
        font-size: 36px;
    }

    .subscribe-form {
        flex-direction: column;
    }

    .featured-img-placeholder, .featured-img-text {
        height: 220px;
    }

    .featured-img-text {
        font-size: 24px;
    }

    .post-list-card {
        grid-template-columns: 1fr;
    }

    .post-list-thumb {
        width: 100%;
        height: 120px;
        font-size: 14px;
    }

    .popular-grid {
        grid-template-columns: 1fr;
    }

    .categories-grid {
        grid-template-columns: 1fr;
    }

    .footer-top {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .footer-brand .nav-logo {
        justify-content: center;
    }

    .footer-bottom {
        flex-direction: column;
        gap: 20px;
        text-align: center;
    }
}

@media (max-width: 480px) {
    .hero h1 {
        font-size: 28px;
    }

    .post-title {
        font-size: 18px;
    }

    .section-title {
        font-size: 16px;
    }
}