/* Enhanced Page Hero */
.page-hero {
    min-height: 70vh;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 140px 20px 80px;
    position: relative;
    overflow: hidden;
}

.hero-background {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -2;
}

.hero-particles {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(circle at 20% 20%, rgba(102,126,234,0.15) 0%, transparent 50%),
        radial-gradient(circle at 80% 80%, rgba(240,147,251,0.15) 0%, transparent 50%),
        radial-gradient(circle at 40% 60%, rgba(79,172,254,0.1) 0%, transparent 50%);
    animation: backgroundShift 20s ease-in-out infinite;
    z-index: -1;
    pointer-events: none;
}

.page-hero .hero-content h1 {
    font-size: var(--heading-h1);
    font-weight: var(--font-weight-extrabold);
    margin-bottom: var(--text-margin-lg);
    background: var(--primary-gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: titleReveal 1.5s ease-out;
}

.page-hero .hero-content p {
    font-size: 1.2rem;
    color: var(--text-secondary);
    max-width: 600px;
    margin: 0 auto;
    animation: fadeInUp 1s ease-out 0.3s both;
}

/* Hero Stats */
.hero-stats {
    display: flex;
    justify-content: center;
    gap: 40px;
    margin-top: 40px;
    animation: fadeInUp 1s ease-out 0.6s both;
}

.hero-stats .stat-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

.hero-stats .stat-number {
    font-size: 2.5rem;
    font-weight: 800;
    background: var(--secondary-gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.hero-stats .stat-label {
    font-size: 0.9rem;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Articles Filter */
.articles-filter {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 40px;
    padding: 20px;
    background: var(--glass-bg-light);
    backdrop-filter: blur(25px);
    border: 2px solid var(--glass-border-light);
    border-radius: 0px;
}

.filter-tabs {
    display: flex;
    gap: 10px;
}

.filter-tab {
    padding: 10px 20px;
    background: var(--glass-bg);
    border: 2px solid var(--glass-border-light);
    border-radius: 0px;
    color: var(--text-secondary);
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: var(--transition-normal);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.filter-tab:hover {
    background: var(--primary-gradient);
    color: white;
    border-color: rgba(102,126,234,0.4);
    transform: translateY(-2px);
}

.filter-tab.active {
    background: var(--accent-gradient);
    color: white;
    border-color: rgba(79,172,254,0.4);
    box-shadow: 0 5px 15px rgba(79,172,254,0.3);
}

.filter-tab:focus,
.pagination-btn:focus {
    outline: 2px solid var(--accent-gradient);
    outline-offset: 2px;
}

.filter-sort select {
    padding: 10px 15px;
    background: var(--glass-bg);
    border: 2px solid var(--glass-border-light);
    border-radius: 0px;
    color: var(--text-primary);
    font-size: 0.9rem;
    cursor: pointer;
    transition: var(--transition-normal);
}

.filter-sort select:focus {
    outline: none;
    border-color: rgba(102,126,234,0.4);
    box-shadow: 0 0 15px rgba(102,126,234,0.2);
}.articles-section{padding:80px 0;background:linear-gradient(135deg,#16141e 0%,#1a1826 50%,#0f0e1a 100%),radial-gradient(circle at 30% 30%,rgba(102,126,234,0.1) 0%,transparent 50%),radial-gradient(circle at 70% 70%,rgba(240,147,251,0.08) 0%,transparent 50%)}.articles-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:30px;margin-bottom:60px}.article-card{background:rgba(255,255,255,0.05);backdrop-filter:blur(25px);border:2px solid rgba(102,126,234,0.2);border-radius:var(--radius-sm);overflow:hidden;transition:all 0.5s cubic-bezier(0.175,0.885,0.32,1.275);position:relative;opacity:0;transform:translateY(50px);animation:cardReveal 1s ease-out forwards;box-shadow:0 8px 32px rgba(0,0,0,0.1),inset 0 1px 0 rgba(255,255,255,0.1)}.article-card:nth-child(1){animation-delay:0.1s}.article-card:nth-child(2){animation-delay:0.2s}.article-card:nth-child(3){animation-delay:0.3s}.article-card:nth-child(4){animation-delay:0.4s}.article-card:nth-child(5){animation-delay:0.5s}.article-card:nth-child(6){animation-delay:0.6s}.article-card.featured{grid-column:span 2;display:grid;grid-template-columns:1fr 1fr;gap:0}.article-card::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:var(--primary-gradient);opacity:0;transition:opacity 0.3s ease;z-index:-1}.article-card:hover::before{opacity:0.1}.article-card:hover{transform:translateY(-15px) rotateX(8deg) scale(1.02);box-shadow:0 30px 60px rgba(0,0,0,0.4),0 0 0 1px rgba(255,255,255,0.2),inset 0 1px 0 rgba(255,255,255,0.3);border-color:rgba(102,126,234,0.3)}.article-image{position:relative;overflow:hidden;height:250px}.article-card.featured .article-image{height:100%}.article-image img{width:100%;height:100%;object-fit:cover;transition:all 0.4s ease;filter:brightness(0.9) contrast(1.1) saturate(1.1)}.article-card:hover .article-image img{transform:scale(1.08) rotate(1deg);filter:brightness(1.1) contrast(1.3) saturate(1.3)}/* Enhanced Article Cards */
.article-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: var(--transition-normal);
}

.article-card:hover .article-overlay {
    opacity: 1;
}

.article-actions {
    display: flex;
    gap: 15px;
}

.action-btn {
    width: 40px;
    height: 40px;
    background: var(--glass-bg-light);
    border: 2px solid var(--glass-border-light);
    border-radius: 50%;
    color: var(--text-secondary);
    cursor: pointer;
    transition: var(--transition-normal);
    display: flex;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(10px);
    position: relative;
}

.action-btn i {
    font-size: 1.1rem;
    font-weight: 600;
    text-shadow: 0 0 8px rgba(255,255,255,0.3);
    transition: var(--transition-normal);
}

.action-btn:hover {
    background: var(--primary-gradient);
    color: white;
    border-color: rgba(102,126,234,0.4);
    transform: scale(1.1);
    box-shadow: 0 5px 15px rgba(102,126,234,0.4);
}

.action-btn:hover i {
    color: white;
    text-shadow: 0 0 12px rgba(255,255,255,0.6);
    transform: scale(1.1);
}

.action-btn.bookmark:hover {
    background: var(--warning-gradient);
    border-color: rgba(251,191,36,0.4);
    box-shadow: 0 5px 15px rgba(251,191,36,0.4);
}

.action-btn.bookmark:hover i {
    color: white;
    text-shadow: 0 0 12px rgba(255,255,255,0.6);
}

.article-badge {
    position: absolute;
    top: 20px;
    right: 20px;
    background: var(--accent-gradient);
    color: white;
    padding: 8px 16px;
    border-radius: var(--radius-sm);
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 0 5px 15px rgba(79,172,254,0.4);
    border: 2px solid rgba(79,172,254,0.3);
    display: flex;
    align-items: center;
    gap: 5px;
}

.article-read-time {
    position: absolute;
    bottom: 15px;
    left: 15px;
    background: rgba(0,0,0,0.7);
    color: white;
    padding: 5px 10px;
    border-radius: var(--radius-sm);
    font-size: 0.8rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 5px;
    backdrop-filter: blur(10px);
}.article-content{padding:30px}.article-card.featured .article-content{padding:40px}/* Enhanced Article Meta */
.article-meta {
    display: flex;
    gap: 15px;
    margin-bottom: 15px;
    font-size: 0.9rem;
    flex-wrap: wrap;
}

.article-meta span {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 5px 10px;
    background: var(--glass-bg);
    border: 1px solid var(--glass-border-light);
    border-radius: var(--radius-sm);
    font-size: 0.8rem;
    font-weight: 600;
    transition: var(--transition-normal);
}

.article-meta span:hover {
    background: var(--glass-bg-light);
    border-color: rgba(102,126,234,0.3);
}

.article-meta i {
    color: var(--text-accent);
    font-size: 0.9em;
}

.article-date {
    color: var(--text-secondary);
}

.article-category {
    background: var(--secondary-gradient);
    color: white;
    border-color: rgba(102,126,234,0.3);
}

.article-views {
    color: var(--text-secondary);
}

/* Article Footer */
.article-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 25px;
    padding-top: 20px;
    border-top: 1px solid rgba(255,255,255,0.1);
}

.article-footer .btn-hover {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    font-size: 0.9rem;
    font-weight: var(--font-weight-semibold);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: white;
    background: var(--accent-gradient);
    border: 2px solid rgba(79, 172, 254, 0.4);
    border-radius: 0px;
    text-decoration: none;
    position: relative;
    overflow: visible;
    transition: var(--transition-normal);
    box-shadow: 0 5px 15px rgba(79, 172, 254, 0.3);
}

.article-footer .btn-hover:hover {
    transform: translateY(-3px) scale(1.05);
    background: var(--primary-gradient);
    border-color: rgba(102, 126, 234, 0.4);
    box-shadow: 0 10px 25px rgba(102, 126, 234, 0.5);
}

.article-footer .btn-hover:focus {
    outline: 2px solid var(--accent-gradient);
    outline-offset: 2px;
}

.article-author {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--text-secondary);
    font-size: 0.8rem;
    font-weight: 600;
}

.article-author i {
    color: var(--text-accent);
}

/* Enhanced Tags */
.tag.more {
    background: var(--glass-bg-light);
    color: var(--text-accent);
    border-color: rgba(79,172,254,0.3);
    font-weight: 700;
}.article-content h2,.article-content h3{font-size:1.5rem;font-weight:700;margin-bottom:15px;background:var(--secondary-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;transition:all 0.4s ease;line-height:1.3}.article-card.featured .article-content h2{font-size:2rem}.article-card:hover .article-content h2,.article-card:hover .article-content h3{transform:translateX(8px) scale(1.02);text-shadow:0 0 20px rgba(240,147,251,0.3)}.article-content p{font-size:1rem;line-height:1.7;margin-bottom:20px;color:var(--text-secondary);transition:all 0.3s ease}.article-card:hover .article-content p{color:var(--text-primary)}.article-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:25px}.tag{background:rgba(255,255,255,0.1);color:var(--text-secondary);padding:6px 12px;border-radius:var(--radius-sm);font-size:0.8rem;font-weight:500;transition:all 0.3s ease;border:1px solid rgba(102,126,234,0.2)}.tag:hover{background:var(--accent-gradient);color:white;transform:translateY(-2px);box-shadow:0 5px 15px rgba(79,172,254,0.3)}/* Enhanced Pagination */
.pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin-top: 60px;
}

.pagination-numbers {
    display: flex;
    gap: 5px;
    align-items: center;
}

.pagination-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 20px;
    background: var(--glass-bg-light);
    color: var(--text-secondary);
    text-decoration: none;
    border-radius: var(--radius-sm);
    border: 2px solid var(--glass-border-light);
    transition: all 0.3s ease;
    font-weight: 600;
    font-size: 0.9rem;
    cursor: pointer;
    backdrop-filter: blur(10px);
}

.pagination-btn:hover {
    background: var(--primary-gradient);
    color: white;
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(102,126,234,0.4);
    border-color: rgba(102,126,234,0.4);
}

.pagination-btn.active {
    background: var(--accent-gradient);
    color: white;
    box-shadow: 0 5px 15px rgba(79,172,254,0.4);
    border-color: rgba(79,172,254,0.4);
}

.pagination-btn.disabled {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
}

.pagination-dots {
    color: var(--text-secondary);
    font-weight: 600;
    padding: 0 10px;
}

/* Notifications */
.notification {
    position: fixed;
    top: 20px;
    right: 20px;
    background: var(--glass-bg-light);
    backdrop-filter: blur(25px);
    border: 2px solid var(--glass-border-light);
    border-radius: var(--radius-sm);
    padding: 15px 20px;
    display: flex;
    align-items: center;
    gap: 10px;
    z-index: 1000;
    transform: translateX(400px);
    opacity: 0;
    transition: all 0.3s ease;
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
}

.notification.show {
    transform: translateX(0);
    opacity: 1;
}

.notification.success {
    border-color: rgba(34,197,94,0.3);
    background: linear-gradient(135deg, rgba(34,197,94,0.1), var(--glass-bg-light));
}

.notification.info {
    border-color: rgba(79,172,254,0.3);
    background: linear-gradient(135deg, rgba(79,172,254,0.1), var(--glass-bg-light));
}

.notification i {
    color: var(--text-accent);
    font-size: 1.2rem;
}

.notification span {
    color: var(--text-primary);
    font-weight: 600;
}.newsletter-section{padding:80px 0;background:linear-gradient(135deg,var(--bg-secondary) 0%,#1a1a2e 50%,var(--bg-tertiary) 100%),radial-gradient(circle at 50% 50%,rgba(240,147,251,0.05) 0%,transparent 70%);text-align:center}.newsletter-content h2{font-size:2.5rem;font-weight:700;margin-bottom:20px;background:var(--secondary-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.newsletter-content p{font-size:1.1rem;color:var(--text-secondary);margin-bottom:40px;max-width:600px;margin-left:auto;margin-right:auto}.newsletter-form{display:flex;gap:20px;max-width:500px;margin:0 auto;align-items:center}.newsletter-form input{flex:1;padding:15px 20px;background:rgba(255,255,255,0.1);border:2px solid rgba(102,126,234,0.2);border-radius:var(--radius-sm);color:var(--text-primary);font-size:1rem;backdrop-filter:blur(10px);transition:all 0.3s ease}.newsletter-form input::placeholder{color:var(--text-secondary)}.newsletter-form input:focus{outline:none;border-color:rgba(102,126,234,0.5);box-shadow:0 0 20px rgba(102,126,234,0.2);background:rgba(255,255,255,0.15)}.newsletter-form .btn-hover{padding:15px 30px;font-size:1rem;white-space:nowrap}.nav-links a.active{background:var(--primary-gradient);color:white;opacity:1;transform:scale(1.05)}.nav-links a.active::before{opacity:0.3;transform:scale(1)}@media (max-width:768px){
    .hero-stats {
        flex-direction: column;
        gap: 20px;
    }
    
    .articles-filter {
        flex-direction: column;
        gap: 20px;
        align-items: stretch;
    }
    
    .filter-tabs {
        justify-content: center;
        flex-wrap: wrap;
    }
    
    .articles-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .article-card.featured {
        grid-column: span 1;
        display: block;
    }
    
    .article-card.featured .article-image {
        height: 250px;
    }
    
    .article-content {
        padding: 25px;
    }
    
    .article-card.featured .article-content {
        padding: 25px;
    }
    
    .article-meta {
        flex-direction: column;
        gap: 10px;
    }
    
    .article-footer {
        flex-direction: column;
        gap: 15px;
        align-items: stretch;
    }
    
    .newsletter-form {
        flex-direction: column;
        gap: 15px;
    }
    
    .newsletter-form input {
        width: 100%;
    }
    
    .pagination {
        flex-wrap: wrap;
        gap: 8px;
    }
    
    .pagination-btn {
        padding: 10px 15px;
        font-size: 0.8rem;
    }
    
    .notification {
        right: 10px;
        left: 10px;
        transform: translateY(-100px);
    }
    
    .notification.show {
        transform: translateY(0);
    }
}@media (max-width:480px){.page-hero{padding:120px 20px 60px}.articles-section{padding:60px 0}.article-content{padding:20px}.article-content h2,.article-content h3{font-size:1.3rem}.article-card.featured .article-content h2{font-size:1.5rem}.newsletter-content h2{font-size:2rem}.newsletter-form input{padding:12px 15px;font-size:0.9rem}.newsletter-form .btn-hover{padding:12px 25px;font-size:0.9rem}}

/* Portal: grupowanie filtrów (działy + typ listy) */
.filter-groups{display:flex;flex-direction:column;gap:10px}

/* -------------------------------------------------
   Responsive scale tweaks (global UI is now smaller)
   ------------------------------------------------- */
.page-hero { padding: 120px var(--space-lg) 70px; }

@media (max-width: 480px) {
    .page-hero { padding: 100px var(--space-lg) 56px; }
}