/* ==========================================================================
    CAREER PATHS PAGE CSS
========================================================================== */
/* Hide breadcrumbs */
nav.cwf-breadcrumb {
    display: none;
}


/* Grid Overrides */
.cwf-grid--page-layout {
    --cwf-grid--padding: 0 1rem;
}
.cwf-grid__column--page-layout {
    --cwf-grid__column--padding: 0 1rem;
}
@media (min-width: 768px) {
    .cwf-grid--page-layout {
        --cwf-grid--padding: 0 2rem;
    }
    .cwf-grid__column--page-layout {
        --cwf-grid__column--padding: 0;
    }
}
      

/* Fade-In Sections */
.fade-in-section {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 1s ease-out, transform 1s ease-out;
}
.fade-in-section.visible {
    opacity: 1;
    transform: translateY(0);
}
      

/* WYSIWYGS */
.paths {
    margin: 1rem 0;
}
@media (min-width: 1024px) {
    .paths {
        margin: 2rem 2rem 0;
    }
}
.paths p.h3:before {
    font-family: "Font Awesome 6 Free";
    font-weight: 400;
    content: "\f358";
    color: var(--vcu-rust);
    margin-right: .25rem;
}
.explore:before {
    font-family: "Font Awesome 6 Free";
    color: var(--vcu-rust);
    content: "\f05a";
    margin-right: .25rem;
    font-weight: 900;
}
      

/* White Rows */
.white-row {
    border-image: conic-gradient(var(--vcu-white) 0 0) fill 0 / 0 / 0 100vw;
}
.white-row__content {
    padding-top: 1rem;
}
@media (min-width: 1024px) {
    .white-row__content {
        padding: 1rem 2rem;
    }
}
@media (min-width: 1024px) {
    .white-row .plugin-tabs {
        padding: 1rem 2rem;
    }
}
.plugin-tabs__tab:focus:before {
    z-index: 1;
}


/* Gray Rows */
.gray-row {
    border-image: conic-gradient(var(--vcu-gray) 0 0) fill 0 / 0 / 0 100vw;
    padding-block: 2rem;
    margin: 3rem auto 1rem;
}
.gray-row__content {
    background-color: var(--vcu-white);
    padding: 1rem;
}
@media (min-width: 1024px) {
    .gray-row {
        padding-block: 4rem;
    }
    .gray-row__content {
        padding: 1rem 2rem;
    }
}

      
/* Row Subheadings */
.rowhead {
    background-color: var(--vcu-white);
}
.gray-row .rowhead {
    padding: 1rem;
}
@media (min-width: 1024px) {
    .rowhead, 
    .gray-row .rowhead {
        padding: 1rem 2rem;
    }
}
.rowhead h2 {
    margin: 1.5rem auto 0;
}

