/* AGGRESSIVE SECTION REORDERING
 * This CSS forces section reordering with maximum specificity
 */

/* Force flex layout with highest priority */
html body div#root {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-orient: vertical !important;
    -webkit-box-direction: normal !important;
    -ms-flex-direction: column !important;
    flex-direction: column !important;
}

/* Reorder sections with maximum specificity */
html body div#root > div:nth-of-type(1) {
    -webkit-box-ordinal-group: 2 !important;
    -ms-flex-order: 1 !important;
    order: 1 !important;
}

html body div#root > div:nth-of-type(2) {
    -webkit-box-ordinal-group: 3 !important;
    -ms-flex-order: 2 !important;
    order: 2 !important;
}

/* Services - move to position 5 */
html body div#root > div:nth-of-type(3),
html body div#root > section:nth-of-type(3),
html body div#root > [id="services"] {
    -webkit-box-ordinal-group: 6 !important;
    -ms-flex-order: 5 !important;
    order: 5 !important;
}

/* Experiences - move to position 6 */
html body div#root > div:nth-of-type(4),
html body div#root > section:nth-of-type(4),
html body div#root > [id="experiences"] {
    -webkit-box-ordinal-group: 7 !important;
    -ms-flex-order: 6 !important;
    order: 6 !important;
}

/* About - move to position 3 */
html body div#root > div:nth-of-type(5),
html body div#root > section:nth-of-type(5),
html body div#root > [id="about"] {
    -webkit-box-ordinal-group: 4 !important;
    -ms-flex-order: 3 !important;
    order: 3 !important;
}

/* Portfolio - move to position 4 */
html body div#root > div:nth-of-type(6),
html body div#root > section:nth-of-type(6),
html body div#root > [id="portfolio"] {
    -webkit-box-ordinal-group: 5 !important;
    -ms-flex-order: 4 !important;
    order: 4 !important;
}

/* Remaining sections */
html body div#root > div:nth-of-type(n+7) {
    -webkit-box-ordinal-group: 8 !important;
    -ms-flex-order: 7 !important;
    order: 7 !important;
}
