/**
 * Responsive Styles
 * Heritage Rails Theme
 */

/* Tablets and below */
@media (max-width: 1024px) {
    .container {
        padding: 0 var(--spacing-md);
    }

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

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

/* Mobile devices */
@media (max-width: 768px) {
    :root {
        --spacing-xl: 2rem;
        --spacing-lg: 1.5rem;
    }

    h1 {
        font-size: 2rem;
    }

    h2 {
        font-size: 1.5rem;
    }

    h3 {
        font-size: 1.25rem;
    }

    /* Navigation */
    .main-navigation {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--spacing-md);
    }

    .nav-menu {
        flex-direction: column;
        width: 100%;
        gap: 0;
    }

    .nav-menu li {
        width: 100%;
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    }

    .nav-menu a {
        display: block;
        padding: var(--spacing-sm);
    }

    /* Grids */
    .railways-grid,
    .news-grid,
    .posts-grid {
        grid-template-columns: 1fr;
    }

    .footer-widgets {
        grid-template-columns: 1fr;
        gap: var(--spacing-lg);
    }

    /* Hero Banner */
    .hero-banner {
        padding: var(--spacing-lg) 0;
    }

    .hero-subtitle {
        font-size: 1rem;
    }

    .btn-large {
        padding: 12px 30px;
        font-size: 1rem;
    }

    /* Railway Meta */
    .railway-meta {
        flex-direction: column;
        gap: var(--spacing-sm);
        align-items: flex-start;
    }

    /* Railway Section */
    .railway-section {
        padding: var(--spacing-md);
    }

    /* Ticket Card */
    .ticket-card::before,
    .ticket-card::after {
        display: none;
    }

    /* Newsletter Form */
    .railway-newsletter-form {
        flex-direction: column;
    }

    .railway-newsletter-form input[type="email"],
    .railway-newsletter-form button {
        width: 100%;
    }

    /* Map Placeholder */
    .interactive-map-placeholder {
        min-height: 300px;
        padding: var(--spacing-md);
    }

    /* Station Board */
    .station-board-row {
        flex-direction: column;
        gap: var(--spacing-xs);
    }

    /* Timetable */
    .timetable-row {
        grid-template-columns: 1fr;
        gap: var(--spacing-xs);
    }
}

/* Small mobile devices */
@media (max-width: 480px) {
    :root {
        --spacing-xl: 1.5rem;
        --spacing-lg: 1rem;
    }

    .container {
        padding: 0 var(--spacing-sm);
    }

    h1 {
        font-size: 1.75rem;
    }

    h2 {
        font-size: 1.35rem;
    }

    .site-header {
        padding: var(--spacing-sm) 0;
    }

    .site-title {
        font-size: 1.4rem;
    }

    .btn {
        padding: 10px 20px;
        font-size: 0.9rem;
    }

    .railway-section h2 {
        font-size: 1.25rem;
    }
}

/* Print Styles */
@media print {
    .site-header,
    .site-footer,
    .nav-menu,
    .newsletter-section,
    .btn {
        display: none;
    }

    body {
        background: white;
        color: black;
    }

    .railway-line-map-container {
        page-break-inside: avoid;
    }
}