/* ==========================================================================
   RESPONSIVE DESKTOP - 992px à 1200px
   ========================================================================== */

/* LAYOUTS COMPLEXES - Desktop */
@media (min-width: 992px) {
    .product-container {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 30px;
        align-items: start;
    }
    
    .static-product-image {
        grid-column: 1;
        align-self: start;
    }
    
    .product-info {
        grid-column: 2;
    }

    .connection-layout {
        flex-direction: row;
    }
    
    .connection-diagram {
        flex: 3;
    }
    
    .connection-details {
        flex: 2;
        padding-left: 30px;
    }

    .dashboard-example {
        flex-direction: row;
    }
    
    .dashboard-image {
        flex: 3;
    }
    
    .dashboard-description {
        flex: 2;
    }

    .pcb-features {
        grid-template-columns: 1fr 2fr;
    }
}

/* GRILLES ET CONTENUS - Desktop */
@media (min-width: 992px) and (max-width: 1200px) {
    .products-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 25px;
    }
    
    .feature-grid, .advantages-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 25px;
    }
    
    .comparison-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px;
    }
    
    .benefits-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    
    .tech-vignettes-grid, .budget-vignettes-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px;
    }
    
    .steps-cards-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px;
    }
    
    .innovation-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px;
    }
    
    .photo-gallery, .gallery-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 30px;
    }
    
    .model-3d-grid, .project-view-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px;
    }
}

/* PRODUITS - Desktop */
@media (min-width: 992px) and (max-width: 1200px) {
    .product-item {
        min-height: 500px;
    }
    
    .product-item .product-img {
        height: 240px;
    }
    
    .product-item-content {
        height: calc(100% - 240px);
        padding: 25px;
    }
    
    .product-item-content h3 {
        font-size: 1.3rem;
        min-height: 50px;
    }
    
    .product-overview {
        grid-template-columns: 1fr 1fr;
        gap: 40px;
    }
}

/* NAVIGATION - Desktop */
@media (min-width: 992px) and (max-width: 1200px) {
    .tab-navigation {
        flex-wrap: wrap;
        gap: 10px;
    }
    
    .tab-btn {
        min-width: 150px;
        padding: 12px 25px;
        font-size: 1rem;
    }
    
    .categories-filter {
        justify-content: center;
        gap: 20px;
    }
    
    .category-btn {
        padding: 10px 25px;
        font-size: 0.95rem;
    }
}

/* SPÉCIFICATIONS - Desktop */
@media (min-width: 992px) and (max-width: 1200px) {
    .specs-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px;
    }
    
    .pcb-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px;
    }
    
    .diagrams-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px;
    }
    
    .performance-stats {
        grid-template-columns: repeat(4, 1fr);
    }
    
    .warranty-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    
    .status-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    
    .document-grid {
        grid-template-columns: repeat(4, 1fr);
    }
    
    .connector-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* PRICING - Desktop */
@media (min-width: 992px) and (max-width: 1200px) {
    .pricing-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 25px;
    }
    
    .discount-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 25px;
    }
    
    .examples-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 25px;
    }
}

/* CONTACT - Desktop */
@media (min-width: 992px) and (max-width: 1200px) {
    .contact-grid {
        grid-template-columns: 1fr 2fr;
        gap: 50px;
    }
    
    .form-row {
        grid-template-columns: 1fr 1fr;
        gap: 30px;
    }
    
    .checkbox-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .contact-info, .contact-form {
        padding: 35px;
    }
}

/* ARCHITECTURE ET DIAGRAMMES - Desktop */
@media (min-width: 992px) and (max-width: 1200px) {
    .architecture-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    
    .exploded-view-item {
        grid-template-columns: 1fr 1fr;
        gap: 40px;
    }
    
    .exploded-view-item.reverse {
        direction: rtl;
    }
    
    .exploded-view-item.reverse .exploded-view-info {
        direction: ltr;
    }
}

/* PROCESS ET ÉTAPES - Desktop */
@media (min-width: 992px) and (max-width: 1200px) {
    .solution-steps {
        grid-template-columns: repeat(3, 1fr);
        gap: 25px;
    }
    
    .flow-steps {
        grid-template-columns: repeat(3, 1fr);
    }
    
    .timeline-item {
        grid-template-columns: auto 1fr;
        gap: 30px;
        align-items: flex-start;
    }
    
    .timeline-year {
        margin-bottom: 0;
    }
}

/* GALERIES ET VUES - Desktop */
@media (min-width: 992px) and (max-width: 1200px) {
    .thumbnail-grid {
        grid-template-columns: repeat(4, 1fr);
    }
    
    .image-zoom-area {
        min-height: 200px;
    }
    
    .gallery-item {
        min-height: 350px;
    }
}



/* DASHBOARD ET INTÉGRATIONS - Desktop */
@media (min-width: 992px) and (max-width: 1200px) {
    .integration-cta {
        flex-direction: row;
        gap: 20px;
    }
    
    .integration-cta .btn {
        flex: 1;
        max-width: 200px;
    }
}

/* TABLEAUX - Desktop */
@media (min-width: 992px) and (max-width: 1200px) {
    .comparison-table {
        font-size: 1rem;
    }
    
    .comparison-table th,
    .comparison-table td {
        padding: 12px 15px;
    }
    
    .rpi-comparison-table {
        font-size: 0.95rem;
    }
    
    .rpi-comparison-table th,
    .rpi-comparison-table td {
        padding: 15px;
    }
}

/* CTA ET BOUTONS - Desktop */
@media (min-width: 992px) and (max-width: 1200px) {
    .cta-buttons {
        flex-direction: row;
        justify-content: center;
        gap: 25px;
    }
    
    .hero-buttons {
        flex-direction: row;
        gap: 25px;
    }
    
    .btn-group {
        flex-direction: row;
        gap: 20px;
    }
    
    .astro-cta-buttons {
        flex-direction: row;
        gap: 25px;
    }
    
    .astro-features-highlight {
        flex-direction: row;
        gap: 40px;
    }
}

/* SECTIONS SPÉCIALISÉES - Desktop */
@media (min-width: 992px) and (max-width: 1200px) {
    .tech-pros-cons {
        grid-template-columns: 1fr 1fr;
        gap: 25px;
    }
    
    .tech-recommendation {
        flex-direction: row;
        text-align: left;
        gap: 25px;
    }
    
    .recommendation-icon {
        font-size: 3rem;
    }
    
    .pro-options-tabs {
        margin: 20px 0;
    }
    
    .pro-option-tab {
        padding: 20px;
    }
    
    .tips-vignettes {
        grid-template-columns: repeat(3, 1fr);
        gap: 25px;
    }
}

/* BLOG ET ARTICLES - Desktop */
@media (min-width: 992px) and (max-width: 1200px) {
    .content-grid {
        grid-template-columns: 1fr 300px;
        gap: 40px;
    }

    .blog-stats {
        flex-direction: row;
        gap: 40px;
    }

    .articles-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px;
    }

    .featured-article {
        grid-template-columns: 1fr 1fr;
    }
    
    .related-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* COMMENTAIRES - Desktop */
@media (min-width: 992px) and (max-width: 1200px) {
    .comment-header {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }
    
    .comment-helpful {
        flex-direction: row;
        flex-wrap: nowrap;
    }
    
    .comments-container {
        padding: 0 20px;
    }
    
    .comment-form, .comment-item {
        padding: 30px;
    }
}

/* HERO OPTIMISATIONS - Desktop */
@media (min-width: 992px) and (max-width: 1200px) {
    .hero, .energy-hero, .astro-hero, .product-hero, .methodology-hero,
    .vintage-hero, .matrix-hero, .esphome-hero, .domotique-hero, 
    .rpi-hero, .ha-hero, .megohm-hero {
        padding: 80px 0;
        min-height: 450px;
    }
    
    .hero h1, .energy-hero h1, .vintage-hero h1, .matrix-hero h1,
    .esphome-hero h1, .domotique-hero h1, .rpi-hero h1, .ha-hero h1 {
        font-size: 2.8rem;
    }
    
    .hero p, .energy-hero p, .vintage-hero p, .matrix-hero p,
    .esphome-hero p, .domotique-hero p, .rpi-hero p, .ha-hero p {
        font-size: 1.3rem;
    }

    .astro-hero {
        min-height: 500px;
    }
    
    .astro-title {
        font-size: 3.2rem;
    }
    
    .astro-subtitle {
        font-size: 1.5rem;
    }
    
    .astro-description {
        font-size: 1.2rem;
    }
}

/* RESPONSIVE FIXES - Desktop */
@media (min-width: 992px) and (max-width: 1200px) {
    .btn-back {
        position: fixed;
        top: 100px;
        left: 20px;
        z-index: 50;
    }
    
    .methodology-step h2 {
        font-size: 2rem;
    }
    
    .process-detail h3 {
        font-size: 1.5rem;
    }
    
    .section-header h2 {
        font-size: 2.5rem;
    }
}

/* ANIMATIONS ET TRANSITIONS - Desktop */
@media (min-width: 992px) and (max-width: 1200px) {
    .card:hover, .product-card:hover, .reliability-card:hover, 
    .app-card:hover, .gallery-item:hover, .model-3d-item:hover, 
    .project-view-item:hover, .discount-card:hover {
        transform: translateY(-8px);
        box-shadow: 0 12px 25px rgba(0,0,0,0.15);
    }
    
    .feature-card:hover, .device-card:hover, .advantage-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 10px 20px rgba(0,0,0,0.12);
    }
}

/* ===== DESKTOP (À ajouter dans desktop.css) ===== */
@media (min-width: 992px) and (max-width: 1200px) {
    .comparison-table {
        font-size: 0.95rem;
    }
    
    .comparison-table th,
    .comparison-table td {
        padding: 15px 12px;
    }
    
    .pricing-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 25px;
    }
    
    .discount-grid {
        grid-template-columns: repeat(4, 1fr);
    }
    
    .examples-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .feature-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 30px;
    }
    
    .options-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    
    .cta-highlight > div[style*="display: grid"] {
        grid-template-columns: repeat(4, 1fr) !important;
    }
}