/* ====== Grid System & Layout Framework ====== */

/* Hero Layout */
.hero-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.hero-text {
    grid-column: 1 / 2;
}

.hero-stats {
    grid-column: 2 / 3;
}



/* Cards Grid System */
.cards-grid {
    display: grid;
}

.four-columns {
    grid-template-columns: repeat(4, 1fr);
}

/* Section Content - 3 Column Layout */
.section-content {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}

.transform-section .section-content{

   grid-template-columns: 4fr 5fr 3fr;
}
.critical-infrastructure .section-content {
    grid-template-columns: 1fr 2fr 1fr;
}

.results-section .section-content {
    grid-template-columns: 1fr 1fr 1fr 1fr;
}

.value-cards {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
}

.precision-section .section-content {
    grid-template-columns: 1fr 1fr 2fr;
}

.precision-section .section-right {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    align-self: stretch;
}

/* ====== Responsive Grid System ====== */

/* Value Cards & Results Section Responsive */

@media (max-width: 1024px) {
    .hero-container {
        grid-template-columns: 1fr;
    }

    .hero-stats {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
    }

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

    .section-content {
        grid-template-columns: 1fr 1fr;
    }

    .precision-section .section-content {
        grid-template-columns: 1fr 1fr;
    }

    .critical-infrastructure .section-content {
        grid-template-columns: 1fr;
    }

    .critical-infrastructure .section-content .section-left {
        display: grid;
        grid-template-columns: 1fr 1fr;

    }

    .transform-section .section-content, .precision-section .section-content {
        grid-template-columns: inherit;
    }

    .transform-section .section-left,
    .precision-section .section-right {
        grid-column: span 12;
    }

    .transform-section .section-center {
        grid-column: span 10;
    }

    .transform-section .section-right {
	display:grid;
        grid-column: span 2;
    }

    .precision-section .section-left, .precision-section .section-center {

        display: grid;
        grid-column: span 6;
    }

    .value-cards {
        grid-template-columns: repeat(3, 1fr);
    }

    .results-section .section-content {
        grid-template-columns: 1fr;
    }

    .results-section .section-content .section-right {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
    }

    .critical-infrastructure .transmission-features {
        display: grid;
        grid-template-columns: 1fr;
    }

    .critical-infrastructure .protocol-logos {

        display: grid;
        grid-template-columns: 1fr 1fr 1fr;

    }
}

@media (max-width: 768px) {

    .hero-container {
        grid-template-columns: 1fr;
    }

    .hero-text {
        grid-column: 1 / -1;
    }

    .hero-buttons {
        flex-direction: column;
    }

    .hero-stats {
        grid-column: 1 / -1;
        flex-direction: column;
        grid-template-columns: 1fr;
    }

    .four-columns {
        grid-template-columns: 1fr;
    }

    .critical-infrastructure .section-content,
    .precision-section .section-right {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
    }

    .section-content,
    .precision-section .section-content,
    .transform-section .section-content {
        grid-template-columns: 1fr;
        grid-column: span 12;
    }

    .precision-section .section-left,
    .precision-section .section-center,
    .precision-section .section-right,
    .transform-section .section-right {
        display: grid;
        grid-column: span 12;
    }

    .section-center {
        grid-column: 1;
    }

    .transform-section .section-left,
    .transform-section .section-center {
        grid-column: span 12;
    }

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

    .results-section .section-content {
        grid-template-columns: 1fr;
    }

    .critical-infrastructure .section-content .section-left,
    .critical-infrastructure .transmission-features,
    .results-section .section-content .section-right {
        grid-template-columns: 1fr;
    }

    .critical-infrastructure .protocol-logos {
        grid-template-columns: 1fr 1fr 1fr;

    }

    /* Value Cards Grid */
    .value-cards {
        grid-template-columns: repeat(2, 1fr);
    }
}