/*

 * brainstorm-2026.css

 * Utility classes built from the inline style="" attributes in the Brainstorm theme (generated 2026-11-04).

 * 380 classes cover 3971 static inline style attributes.

 *

 * Naming:

 *   spacing   {m|mt|mb|ml|mr|p|pt|pb|pl}-{value}   px dropped, n = negative, values joined by -   e.g. p-72-48, ml-n8

 *   sizing    {w|minw|maxw|h|minh|maxh}-{value}     p = %, vw/vh kept, calc-... for calc()       e.g. maxw-100p, w-calc-100p-plus-72

 *   flex/grid flex, flex-row, items-center, justify-between, gap-24, row-gap-12, col-gap-6, cols-3

 *   type      fs-{px}, fw-{weight}, lh-{value}, text-{left|center}, italic

 *   colour    color-{name|hex}, bg-{name|hex}[-a{alpha}]

 *             Named colours stay as var(--name) so each page still resolves them from its own stylesheet

 *             (for example --light-grey is different in brainstorm-2024.css and the SEMM stylesheets).

 *   borders   border[-t|-b]-{width}-{colour}, border-none, radius-{value}

 *   other     object-cover, overflow-hidden, relative, pointer, grayscale, opacity-{0-100}, shadow-soft

 *

 * Every declaration is  so the classes keep the precedence the inline styles had over stylesheet rules.

 * Shorthands (margin, padding, gap, background, border) come before their longhands, so a pair such as

 * m-0 + mt-12 resolves the same way the original inline style did.

 *

 * Must stay inline (not converted):

 *   - 23 dynamic styles that contain PHP output: the scorecard ring charts (stroke-dasharray) in the

 *     single-*scorecard* templates and the calc() bars in single-sc_scorecard_results.php.

 * Not converted because browsers already ignore them (invalid CSS); remove them during migration:

 *   - "max: width 100%" in SEMM/SEMM-Conference-2027.php

 *   - empty "width:" in Careers/CDF.php and Employer Relations + Engagement/ERF.php

 *   - stray "48px" after "padding:64px;" in Employer Relations + Engagement/ERF.php

 */


/* ----- Fonts ----- */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400;1,500;1,600;1,700;1,800&display=swap');
html, body, div, .heading-2xl, .heading-xl, .heading-lg, .heading-md, .heading-sm, .heading-xs, h1, h2, h3, h4, h5, h6, span, .text-xl, .text-lg, .text-md, .text-sm, .text-xs, p, a, strong, em, i {
    font-family: 'Montserrat', sans-serif;
    -ms-text-size-adjust:100%;
    -webkit-text-size-adjust:100%;
}

/* ----- Variables ----- */
:root {
    --cobalt: rgb(0,97,255);
    --navy: rgb(4,0,97);
    --purple: rgb(99,15,255);
    --light-blue: rgb(0,209,255);
    --pink: rgb(194,106,255);
    --dark-grey:rgb(16,24,40);
    --light-grey:rgb(247,247,247);
    --montserrat: 'Montserrat', sans-serif;
}


/* --- Baseline Text Styles --- */
.heading-2xl, .heading-xl, .heading-lg, .heading-md, .heading-sm, .heading-xs, h1, h2, h3, h4, h5, h6 {
    color:var(--navy);
    font-weight:700;
}
.text-xl, .text-lg, .text-md, .text-sm, .text-xs, p, a, strong, em, i {
    color:var(--dark-grey);
}
p {
    margin-bottom:20px;
}

/* --- Heading Sizes --- */
.heading-2xl {
    font-size:4.5rem ;
    line-height:5rem ;
}
.heading-xl {
    font-size:3.25rem ;
    line-height:4rem ;
}
.heading-lg {
    font-size:2.5rem ;
    line-height:3rem ;
}
.heading-md {
    font-size:2.25rem ;
    line-height:2.75rem ;
}
.heading-sm {
    font-size:1.875rem ;
    line-height:2.375rem ;
}
.heading-xs {
    font-size:1.5rem ;
    line-height:2rem ;
}
/* --- Body Text --- */
.text-2xl {
    font-size:1.375rem;
    line-height:1.6;
}
.text-xl {
    font-size:1.2rem;
    line-height:1.6;
}
.text-rg {
    font-size:1.1rem;
    line-height:1.65;
}
.text-lg, p {
    font-size:1rem;
    line-height:1.65;
}
.text-md {
    font-size:0.925rem;
    line-height:1.54rem;
}
.text-sm {
    font-size:0.9rem;
    line-height:1.65rem;
}
.text-xs {
    font-size:0.75rem;
    line-height:1.5rem;
}

/* --- Text Styling --- */
.underline {
    text-decoration:underline;
    text-decoration-color:var(--cobalt);
    text-underline-offset:5px;
    text-decoration-thickness:2px;
}
.underline:hover {
    text-decoration-color:var(--purple);
}
a {
    transition: all .3s ease;
    color:var(--cobalt);
}
a:hover {
    color:var(--purple);
}
.medium {
    font-weight:500;
}
.semibold {
    font-weight:600;
}
strong,
.bold {
    font-weight:700;
}
.text-left {
    text-align:left;
}
.text-right {
    text-align:right;
}
.text-center {
    text-align:center;
}

/* --- Lists --- */
ol, ul {
    padding-left:22px;
    float:left;
    margin:0;
    width:100%;
}
ul {
    list-style-type:disc;
}
ul li, ol li {
    font-size:1rem;
    line-height:1.65rem;
    margin-bottom:8px;
}
ul li::marker,
ol li::marker {
    color:var(--cobalt);
    font-weight:700;
}
ul li:last-child,
ol li:last-child {
    margin-bottom:0;
}



/* ----- Utility Classes ----- */
.hidden {
    display:none ;
}
.mobile {
    display:none ;
}
/* --- Flexbox --- */
.flex {
    display:flex;
}
.inline-flex {
    display:inline-flex;
}
.flex-row {
    flex-direction:row;
}
.flex-column {
    flex-direction:column;
}
.align-start {
    align-items:flex-start;
}
.align-end {
    align-items:flex-end;
}
.align-center {
    align-items:center;
}
.justify-center {
    justify-content:center;
}
.justify-space-between {
    justify-content:space-between;
}
/* --- Grid --- */
.grid-2 {
    display:grid;
    grid-template-columns:1fr 1fr;
    grid-template-rows:auto;
    grid-gap:16px;
}
.grid-3 {
    display:grid;
    grid-template-columns:1fr 1fr 1fr;
    grid-template-rows:auto;
    grid-gap:16px;
}
.grid-4 {
    display:grid;
    grid-template-columns:1fr 1fr 1fr 1fr;
    grid-template-rows:auto;
    grid-gap:16px;
}
.inline-grid {
    display:inline-grid;
}
/* --- Spacing --- */
.p-16 {padding:16px;}
.p-24 {padding:24px;}
.p-32 {padding:32px;}
.p-48 {padding:48px;}



.pt-0 {padding-top:0px;}
.pt-4 {padding-top:4px;}
.pt-8 {padding-top:8px;}
.pt-12 {padding-top:12px;}
.pt-16 {padding-top:16px;}
.pt-24 {padding-top:24px;}
.pt-32 {padding-top:32px;}
.pt-48 {padding-top:48px;}
.pt-64 {padding-top:64px;}
.pt-96 {padding-top:96px;}
.pt-128 {padding-top:128px;}
.pb-0 {padding-bottom:0px;}
.pb-4 {padding-bottom:4px;}
.pb-8 {padding-bottom:8px;}
.pb-12 {padding-bottom:12px;}
.pb-16 {padding-bottom:16px;}
.pb-24 {padding-bottom:24px;}
.pb-32 {padding-bottom:32px;}
.pb-48 {padding-bottom:48px;}
.pb-64 {padding-bottom:64px;}
.pb-96 {padding-bottom:96px;}
.pb-128 {padding-bottom:128px;}
.mb-0 {margin-bottom:0px;}
.mb-4 {margin-bottom:4px;}
.mb-8 {margin-bottom:8px;}
.mb-12 {margin-bottom:12px;}
.mb-16 {margin-bottom:16px;}
.mb-24 {margin-bottom:24px;}
.mb-32 {margin-bottom:32px;}
.mb-48 {margin-bottom:48px;}
.mb-64 {margin-bottom:64px;}
.mb-96 {margin-bottom:96px;}
.mb-128 {margin-bottom:128px;}
.mt-0 {margin-top:0px;}
.mt-4 {margin-top:4px;}
.mt-8 {margin-top:8px;}
.mt-12 {margin-top:12px;}
.mt-16 {margin-top:16px;}
.mt-24 {margin-top:24px;}
.mt-32 {margin-top:32px;}
.mt-48 {margin-top:48px;}
.mt-64 {margin-top:64px;}
.mt-96 {margin-top:96px;}
.mt-128 {margin-top:128px;}
.row-gap-8 {row-gap:8px;}
.row-gap-16 {row-gap:16px;}
.row-gap-24 {row-gap:24px;}
.row-gap-32 {row-gap:32px;}
.row-gap-48 {row-gap:48px;}
.row-gap-64 {row-gap:64px;}
.col-gap-8 {column-gap:8px;}
.col-gap-16 {column-gap:16px;}
.col-gap-24 {column-gap:24px;}
.col-gap-32 {column-gap:32px;}
.col-gap-48 {column-gap:48px;}
.col-gap-64 {column-gap:64px;}
.col-gap-96 {column-gap:96px;}
.grid-gap-12 {grid-gap:12px;}
.grid-gap-16 {grid-gap:16px;}
.grid-gap-24 {grid-gap:24px;}
.grid-gap-32 {grid-gap:32px;}





/* ----- Containers ----- */
.container {
    display:flex;
    flex-direction:column;
    align-items:center;
    width:100%;
}
.width-900 {width:900px;max-width:90%;}
.width-1400 {width:1400px;max-width:90%;}


/* ----- Elements ----- */
.divider {
    display:block;
    margin:24px 0;
    height:2px;
    background-color:var(--light-grey);
    width:100%;
    float:left;
}

/* ----- Buttons ----- */
.button {
    text-decoration:none;
    transition:all .3s ease;
    border-radius:10px;
    font-weight:600;
    font-family: 'Montserrat', sans-serif;
    padding:8px 16px;
    display:inline-block;
    cursor:pointer;
    min-width:100px;
    color:#fff;
    border:2px solid var(--cobalt);
    text-align:center;
    background-color:var(--cobalt);
    color:#fff;
}
a.button img {
    -webkit-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
}
.button:hover,
.button:active,
.button:focus,
.button:focus-within {
    border:2px solid var(--purple);
    background-color:var(--purple);
    color:#fff;
}
.button.outline {
    color:var(--cobalt);
    background-color:rgba(0,0,0,0);
    border:2px solid var(--cobalt);
}
.button.outline:hover,
.button.outline:active,
.button.outline:focus,
.button.outline:focus-within {
    background-color:var(--purple);
    border:2px solid var(--purple);
    color:white;
}



/* ----- Colors ----- */
.cobalt {color:var(--cobalt)}
.navy {color:var(--navy)}
.purple {color:var(--purple)}
.light-blue {color:var(--light-blue)}
.pink {color:var(--pink)}
.dark-grey {color:var(--dark-grey)}
.light-grey {color:var(--light-grey)}
.bg-cobalt  {background-color:var(--cobalt)}
.bg-navy {background-color:var(--navy)}
.bg-purple {background-color:var(--purple)}
.bg-light-blue {background-color:var(--light-blue)}
.bg-pink {background-color:var(--pink)}
.bg-dark-grey {background-color:var(--dark-grey)}
.bg-light-grey {background-color:var(--light-grey)}
.white {color:white}
::selection {
    background: var(--cobalt);
    color:white;
}




/* Brainstorm */
.ast-container {display:flex;flex-direction:column;padding:0;max-width:100%;}
.program-card {
    border:3px solid var(--light-grey);
    padding:24px;    
    text-align:left;
}   
.rounded {
    border-radius: 16px;
}
.program-image {
    width: 100%;
    max-width: 100%;
    border-radius: 12px;
    object-fit: cover;
    aspect-ratio: 16/10;
    height:auto;
    background-color:var(--light-grey)
}
#bsg-logo {
    width: 260px;
}
.program-title {
    font-size:53px;
    line-height:120%;
}
.program-title span {
    font-weight:400;
    text-transform:uppercase;
    letter-spacing: 13%;
    font-size:48px;
}

/* Logo Carousel */
.slider {
    height: 100px;
    position: relative;
    width: 100%;
    max-width: 100vw;
    display: grid;
    place-items: center;
    overflow: hidden;
}
.slider::before,
.slider::after {
    position: absolute;
    background-image: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
    content: '';
    height: 100%;
    width: 25%;
    z-index: 2;
    pointer-events: none;
}
.slider::before {
    left: 0;
    top: 0;
}
.slider::after {
    right: 0;
    top: 0;
    transform: rotateZ(180deg);
}
.avatar-md {
    min-width:48px;
    aspect-ratio:1/1;
    width: 48px;
    height: 48px;
    border-radius: 100px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
/* ----- Header Menu ----- */

.menu-container {
    position:relative;
    width:100%;
    padding:20px 0;
    box-sizing:border-box;
    max-width:100%;
    background-color:white;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:0;
    border-bottom:1px solid rgba(0,0,0,0.1);
}
    
.desktop-menu {
    max-width:95%;
    width:1400px;
}

/* --- Site Menu--- */
.menu-item {
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
    border-bottom:2px solid rgba(0,0,0,0);
    color:var(--dark-grey);
    display:inline-flex;
    align-items:center;
    column-gap:4px;
    margin-right:16px;
}
.menu-container .menu-item {
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
    border-bottom:2px solid rgba(0,0,0,0);
    color:var(--dark-grey);
    display:inline-flex;
    align-items:center;
    column-gap:4px;
    margin:8px 0 6px 0;
}
.menu-item:hover {
  border-bottom:2px solid var(--purple);
}
.menu-item:last-child {
    margin-right:0;
}


  .menu-dropdown {
    display:inline-block;
    float:left;
    position:relative;
  }
  .menu-dropdown .menu-item {
    border:none;
    padding:8px 0;
  }
  .nav-carat {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: .75rem;
    height: auto;
    display: inline-flex;
    transition:all .3s ease;
  }
  .menu-dropdown:hover .nav-carat {
    transform:rotate(180deg);
  }
  .submenu {
    display:none;
    position:absolute;
    top:calc(100%);
    left:0;
    right:0;
    margin-inline:auto;
    width:fit-content;
    padding:24px;
    background-color:white;
    border-radius:8px;
    border:1px solid rgba(0,0,0,0.1);
    text-align:left;
    flex-direction:column;
    row-gap:4px;
    align-items:flex-start;
    white-space:pre;
  }
  .menu-dropdown:hover .submenu {
    display:inline-flex;
  }
  .menu-icon {
    position:relative;
    width:30px;
    height:16px;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
            justify-content:space-between;
            flex-direction:column;
    cursor:pointer;
    z-index:11;
    }
    .menu-icon div {
      display:inline-block;
      width:100%;
      height:3px;
      background-color:var(--cobalt);
      transition: all .5s ease;
    }
    .menu-icon div:first-child {
              transform:rotate(0deg);
      position:absolute;
      top:0px;
      left:0;
    }
    .menu-icon div:last-child {
              transform:rotate(0deg);
      position:absolute;
      top:12px;
      left:auto;
      right:0;
    }
    .menu-icon.active div:first-child {
              transform:rotate(45deg);
      position:absolute;
      top:8px;
      left:0;
    }
    .menu-icon.active div:last-child {
              transform:rotate(-45deg);
      position:absolute;
      top:8px;
      left:auto;
      right:0;
      width:30px;
    }
    .mobile-menu {
      display:none;
      width:100vw;
      padding:16px;
    }
    .mobile-menu::selection {
    background: white;
    }
    .off-canvas {
      position:fixed;
      top:70px;
      left:100vw;
      background-color:white;
      transition: all .5s ease;
      height:calc(100vh - 70px);
      width:100vw;
      overflow-y:scroll;
    }
    .off-canvas.active {
      left:0;
    }
    .footer {
        width:100vw;
        max-width:100vw;
        border-top:1px solid rgba(0,0,0,0.1);
    }

    .footer > div:first-child {
        width:1400px;
        max-width:95%;;
        display:inline-flex;
        flex-direction:row;
        column-gap:48px;
        justify-content:space-between;
        align-items:flex-start;
    }

    @media(max-width:1240px) {
      .desktop-menu {display:none;}
      .mobile-menu {display:flex;height:70px;}
      .menu-container {padding:0;}
      .menu-item {border:none;margin:0;}
    }

    @media(max-width:1024px) {
        .footer > div:first-child {max-width:calc(100% - 32px);}
    .footer > div:first-child {
        flex-direction:column;
        row-gap:24px;

      }
      .footer .copyright > div:first-child {
        flex-direction:column;
        row-gap:8px;
      }
      .footer .copyright .text-sm {
        font-size:0.85rem;
      }
      .footer .copyright {margin-top:16px;}
    }

@media(max-width:768px) {
    .program-title {
        font-size:8vw;
        line-height:120%;
    }
    .program-title span {
        font-size:7vw;
    }
    .slider {
        margin-top: 35px;
    }
    .slide {
        width: auto;
        height: 70px;
        padding: 0 5px;
    }
}






/* ----- Mobile Media Query ----- */
@media(max-width:800px) {
    .mobile {
        display:inherit ;
    }
    /* --- Heading Sizes --- */
    .display-2xl {
        font-size:3.25rem;
        line-height:3.5rem;
    }
    .display-xl {
        font-size:2.5rem;
        line-height:3.15rem;
    }
    .display-lg {
        font-size:2rem;
        line-height:2.5rem;
    }
    .display-md {
        font-size:1.75rem;
        line-height:2.25rem;
    }
    .display-sm {
        font-size:1.5rem;
        line-height:2rem;
    }
    .display-xs {
        font-size:1.375rem;
        line-height:1.75rem;
    }
    /* --- Body Text --- */
    .text-2xl {
        font-size:1.125rem;
        line-height:1.;
    }
    .text-xl {
        font-size:1.05rem;
        line-height:1.65;
    }
    .text-lg {
        font-size:1.125rem;
        line-height:1.65;
    }
    .text-md {
        font-size:1rem;
        line-height:1.65rem;
    }
    .text-sm {
        font-size:1rem;
        line-height:1.5rem;
    }
    .text-xs {
        font-size:0.85rem;
        line-height:1.5rem;
    }
    ul,ol {
        padding-left:18px;
    }
    .grid-2,
    .grid-3 {
        grid-template-columns:1fr;
        row-gap:16px;
    }
    .row-gap-8 {row-gap:4px;}
    .row-gap-16 {row-gap:8px;}
    .row-gap-24 {row-gap:16px;}
    .row-gap-32 {row-gap:24px;}
    .row-gap-48 {row-gap:32px;}
    .row-gap-64 {row-gap:48px;}
    .col-gap-8 {column-gap:4px;}
    .col-gap-16 {column-gap:8px;}
    .col-gap-24 {column-gap:16px;row-gap:16px;}
    .col-gap-32 {column-gap:24px;}
    .col-gap-48 {column-gap:32px;}
    .col-gap-64 {column-gap:48px;}
    .col-gap-96 {column-gap:64px;}
    .grid-gap-16 {grid-gap:8px;}
    .grid-gap-24 {grid-gap:16px;}
    .grid-gap-32 {grid-gap:24px;}
}