/* === Responsive Grid Classes === */
@media (min-width: 641px) {
    .hero-grid { grid-template-columns: 1fr 1fr !important; }
    .grid-2 { grid-template-columns: repeat(2, 1fr) !important; }
    .grid-3 { grid-template-columns: repeat(2, 1fr) !important; }
    .process-grid { grid-template-columns: repeat(2, 1fr) !important; }
    .logistics-grid { grid-template-columns: 1fr 1fr !important; }
    .blog-layout { grid-template-columns: 1fr 300px !important; }
}

@media (min-width: 769px) {
    .grid-3 { grid-template-columns: repeat(3, 1fr) !important; }
    .process-grid { grid-template-columns: repeat(4, 1fr) !important; }
    .footer-grid { grid-template-columns: 1.5fr 1fr 1fr 1.2fr !important; }
    .mobile-menu-btn { display: none !important; }
    .main-nav .menu { display: flex !important; }
}

@media (max-width: 768px) {
    .main-nav .menu { display: none; }
    .mobile-menu-btn { display: flex !important; }
    .hero-stats { grid-template-columns: repeat(2, 1fr); }
    .blog-layout { grid-template-columns: 1fr !important; }
    .footer-grid { grid-template-columns: 1fr 1fr !important; }
}

@media (max-width: 480px) {
    .footer-grid { grid-template-columns: 1fr !important; }
    .nav-actions .btn { display: none; }
    .trust-bar-inner { justify-content: center; text-align: center; }
}

/* === WordPress Core === */
.wp-block-image img {
    border-radius: 0.5rem;
}

.wp-block-table {
    border-collapse: collapse;
    width: 100%;
}

.wp-block-table td,
.wp-block-table th {
    padding: 0.75rem;
    border: 1px solid var(--color-ink-200);
}

.wp-block-quote {
    border-left: 4px solid var(--color-primary-600);
    margin: 1.5rem 0;
    padding: 1rem 1.5rem;
    background: var(--color-ink-50);
    font-style: italic;
}

/* === Pagination === */
.pagination,
.wp-pagenavi,
nav.pagination .nav-links {
    display: flex;
    gap: 0.5rem;
    justify-content: center;
    flex-wrap: wrap;
}

.pagination .page-numbers,
.wp-pagenavi a,
.wp-pagenavi span,
nav.pagination .nav-links a,
nav.pagination .nav-links span {
    padding: 0.625rem 1rem;
    border: 1px solid var(--color-ink-200);
    font-size: 0.9rem;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.2s;
}

.pagination .page-numbers.current,
.wp-pagenavi span.current,
nav.pagination .nav-links span.current {
    background: var(--color-primary-600);
    color: #fff;
    border-color: var(--color-primary-600);
}

.pagination a:hover,
nav.pagination .nav-links a:hover {
    background: var(--color-ink-50);
    border-color: var(--color-primary-600);
    color: var(--color-primary-600);
}

/* === Comments === */
.comment-list {
    list-style: none;
    padding: 0;
}

.comment {
    padding: 1.5rem 0;
    border-bottom: 1px solid var(--color-ink-100);
}

.comment .comment-author {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.comment .comment-author img {
    border-radius: 50%;
    width: 40px;
    height: 40px;
}

.comment .comment-metadata {
    font-size: 0.8rem;
    color: var(--color-ink-400);
}

.comment-reply-link {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--color-primary-600);
}

/* === Widgets === */
.widget {
    margin-bottom: 2rem;
}

.widget-title {
    font-size: 1.1rem;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid var(--color-primary-600);
}

.widget ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.widget ul li {
    padding: 0.5rem 0;
    border-bottom: 1px solid var(--color-ink-50);
}

.widget ul li a {
    font-size: 0.9rem;
    color: var(--color-ink-700);
}

.widget ul li a:hover {
    color: var(--color-primary-600);
}
