/* Responsive Design for Post Controller Website */

/* Extra large screens (1400px and up) */
@media (min-width: 1400px) {
    .container {
        max-width: 1320px;
    }
    
    .hero h1 {
        font-size: 4rem;
    }
    
    .features-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Large screens (992px and up) */
@media (min-width: 992px) and (max-width: 1399px) {
    .hero-content {
        gap: 3rem;
    }
    
    .features-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .pricing-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Medium screens (768px and up) */
@media (min-width: 768px) and (max-width: 991px) {
    .container {
        padding: 0 20px;
    }
    
    .hero {
        padding: 110px 0 70px;
    }
    
    .hero-content {
        grid-template-columns: 1fr;
        gap: 2.5rem;
        text-align: center;
    }
    
    h1 { font-size: 3rem; }
    h2 { font-size: 2.25rem; }
    
    .hero-buttons {
        justify-content: center;
    }
    
    .hero-stats {
        justify-content: center;
    }
    
    .features-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.5rem;
    }
    
    .pricing-grid {
        grid-template-columns: 1fr;
        max-width: 400px;
        margin: 0 auto;
    }
    
    .pricing-card.featured {
        transform: scale(1.02);
    }
    
    .nav-actions {
        gap: 0.5rem;
    }
    
    .btn-signup {
        padding: 10px 20px;
        font-size: 0.875rem;
    }
}

/* Small screens (576px and up) */
@media (min-width: 576px) and (max-width: 767px) {
    .nav-menu {
        display: none;
    }
    
    .hamburger {
        display: flex;
    }
    
    .hero {
        padding: 100px 0 60px;
    }
    
    .hero-content {
        grid-template-columns: 1fr;
        gap: 2rem;
        text-align: center;
    }
    
    h1 { font-size: 2.75rem; }
    h2 { font-size: 2rem; }
    
    .hero-description {
        font-size: 1.125rem;
    }
    
    .hero-buttons {
        flex-direction: column;
        gap: 0.75rem;
        align-items: center;
    }
    
    .hero-stats {
        gap: 1.5rem;
        justify-content: center;
        flex-wrap: wrap;
    }
    
    .features-grid,
    .pricing-grid {
        grid-template-columns: 1fr;
    }
    
    .pricing-card.featured {
        transform: none;
    }
    
    .feature-card {
        padding: 2rem;
    }
    
    .form-row {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .nav-actions {
        flex-direction: column;
        gap: 0.5rem;
    }
}

/* Extra small screens (less than 576px) */
@media (max-width: 575px) {
    .container {
        padding: 0 16px;
    }
    
    /* Typography adjustments */
    h1 { font-size: 2.25rem; line-height: 1.2; }
    h2 { font-size: 1.75rem; }
    h3 { font-size: 1.5rem; }
    h4 { font-size: 1.125rem; }
    
    /* Navigation */
    .navbar .container {
        padding: 0.75rem 16px;
    }
    
    .nav-brand {
        gap: 8px;
    }
    
    .logo {
        width: 32px;
        height: 32px;
    }
    
    .brand-name {
        font-size: 1.25rem;
    }
    
    .nav-menu {
        display: none;
    }
    
    .hamburger {
        display: flex;
    }
    
    .nav-actions {
        gap: 0.5rem;
    }
    
    .btn-login {
        padding: 6px 12px;
        font-size: 0.875rem;
    }
    
    .btn-signup {
        padding: 8px 16px;
        font-size: 0.875rem;
    }
    
    /* Hero section */
    .hero {
        padding: 90px 0 50px;
    }
    
    .hero-content {
        grid-template-columns: 1fr;
        gap: 1.5rem;
        text-align: center;
    }
    
    .hero-description {
        font-size: 1rem;
        margin-bottom: 1.5rem;
    }
    
    .hero-buttons {
        flex-direction: column;
        gap: 0.75rem;
        align-items: stretch;
    }
    
    .btn-primary,
    .btn-secondary {
        padding: 14px 24px;
        font-size: 0.875rem;
        text-align: center;
    }
    
    .hero-stats {
        flex-direction: column;
        gap: 1rem;
        align-items: center;
    }
    
    .stat {
        text-align: center;
    }
    
    .stat-number {
        font-size: 1.5rem;
    }
    
    .stat-label {
        font-size: 0.75rem;
    }
    
    /* Page header */
    .page-header {
        padding: 90px 0 40px;
    }
    
    .page-header h1 {
        font-size: 2rem;
    }
    
    .page-header p {
        font-size: 1rem;
    }
    
    /* Sections */
    .section-header {
        margin-bottom: 2.5rem;
    }
    
    .section-header h2 {
        margin-bottom: 0.75rem;
    }
    
    .section-header p {
        font-size: 1rem;
    }
    
    /* Cards and grids */
    .features-grid,
    .pricing-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    
    .feature-card {
        padding: 1.5rem;
    }
    
    .feature-icon {
        width: 56px;
        height: 56px;
        margin-bottom: 1rem;
    }
    
    .feature-icon i {
        font-size: 1.25rem;
    }
    
    .pricing-card {
        padding: 2rem 1.5rem;
    }
    
    .pricing-card.featured {
        transform: none;
    }
    
    .popular-badge {
        font-size: 0.75rem;
        padding: 6px 16px;
    }
    
    .amount {
        font-size: 2.5rem;
    }
    
    /* Forms */
    .form-row {
        grid-template-columns: 1fr;
        gap: 1rem;
        margin-bottom: 1rem;
    }
    
    .form-group {
        margin-bottom: 1rem;
    }
    
    .form-group input,
    .form-group select,
    .form-group textarea {
        padding: 10px 14px;
        font-size: 0.875rem;
    }
    
    .btn-submit {
        padding: 14px;
        font-size: 0.875rem;
    }
    
    /* Footer */
    .footer {
        padding: 40px 0 20px;
    }
    
    .footer-content {
        grid-template-columns: 1fr;
        gap: 1.5rem;
        margin-bottom: 2rem;
    }
    
    .footer-brand-name {
        font-size: 1.25rem;
    }
    
    .footer-description {
        margin-bottom: 1.5rem;
        font-size: 0.875rem;
    }
    
    .social-links a {
        width: 36px;
        height: 36px;
    }
    
    /* CTA section */
    .cta {
        padding: 60px 0;
    }
    
    .cta-content h2 {
        font-size: 1.75rem;
    }
    
    .cta-content p {
        font-size: 1rem;
        margin-bottom: 1.5rem;
    }
    
    .cta-buttons {
        flex-direction: column;
        gap: 0.75rem;
        align-items: stretch;
    }
    
    /* Tables */
    .comparison-table {
        overflow-x: auto;
    }
    
    .comparison-table table {
        min-width: 600px;
    }
    
    /* Specific page adjustments */
    .contact-methods .contact-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    
    .office-locations .locations-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    
    .values-grid,
    .team-grid,
    .resources-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    
    .about-grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    
    .about-grid .about-text {
        order: 2;
    }
    
    .about-grid .about-image {
        order: 1;
    }
}

/* Print styles */
@media print {
    .navbar,
    .hamburger,
    .nav-actions,
    .cta,
    .footer {
        display: none !important;
    }
    
    .hero {
        padding-top: 0;
    }
    
    body {
        font-size: 12pt;
        line-height: 1.4;
    }
    
    h1 { font-size: 24pt; }
    h2 { font-size: 20pt; }
    h3 { font-size: 16pt; }
    h4 { font-size: 14pt; }
    
    .container {
        max-width: none;
        padding: 0;
    }
}