:root {
  font-size:1.3vw;
  --color-background: white;
  --color-text: black;
  --color-primary: var(--color-blue);
  --color-secondary: var(--color-orange);
  --color-highlight: var(--color-yellow);
  --color-gray: rgb(128, 128, 128); /* #999999 */
  --color-gray-dark: rgb(38, 38, 38); /* #262626 */
  --color-gray-light: rgb(240, 240, 240); /* #f0f0f0 */
  --color-blue: rgb(38, 61, 119); /* #263d77 */
  --color-yellow: rgb(251, 175, 51); /* #fbaf33 */
  --color-orange: rgb(242, 102, 44); /* #f2662c */
  --color-green: rgb(125, 194, 159); /* #7dc29f */
  --font-heading: p22-mackinac-pro, serif;
  --font-special: Montserrat Variable, sans-serif;
  --font-paragraph: p22-mackinac-pro, serif;
  --spacing-default: 6vw;
  --header-height: 10vw;
}

@media (max-width:767px) {
  :root {
    font-size:2.2vw;
    --header-height:15vw;
  }
}


/* html elements */

  body { position:relative; }
  figure.wp-block-video.Branded video { border-radius:1vw; outline:.3vw solid var(--color-yellow); outline-offset:-.15vw; }


/* acf blocks */

  .Slider.Carousel { margin-block-start:0; aspect-ratio:1.5!important; border-radius:1vw; outline:.3vw solid var(--color-yellow); outline-offset:-.15vw; }

  h1, h2, h3 { line-height:1.15!important; }

  .wp-block-separator { border-top:.2rem solid var(--color-highlight) !important; /*width:60%!important;*/ }

  .Cta button { border:.3vw solid var(--color-primary); font-family:var(--font-special); background-color:white; color:black; }
  .Cta:hover button { background-color:var(--color-primary)!important; color:white; }
  .Cta::after { content:none; }

  .wp-block-heading.has-montserrat-font-family { line-height:.8; letter-spacing:-.01em; }
  .wp-block-heading.has-mackinac-font-family { line-height:1; letter-spacing:-.01em; }
  .wp-block-heading.has-xx-large-font-size { line-height:var(--font-size-huge-leading); letter-spacing:var(--font-size-huge-kerning); }
  .wp-block-heading.has-xxx-large-font-size { line-height:var(--font-size-huge-leading); letter-spacing:var(--font-size-huge-kerning); }
  .wp-block-heading.has-huge-font-size { line-height:var(--font-size-huge-leading); letter-spacing:var(--font-size-huge-kerning); }
  p.has-xxx-large-font-size { line-height:1.3; }

  .has-large-font-size { margin-top:.5em!important; }

  body { /*margin-top:var(--header-height);*/ min-height:50vw; }

  header { /*padding:0;*/ background-color:white; font-family:var(--font-heading); font-size:1.1rem; font-weight:700; text-transform:capitalize; color:var(--color-primary); letter-spacing:.02em; }
  header.Stucco { /*padding:0;*/ /*height:inherit;*/ align-items:center; /*background-color:black;*/ color:revert; background-position:90%; /*height:unset!important;*/ }
  header.Stucco .Pattern { background:revert; }
  header .Logo { height:70%; width:18.5%; }
  header .Logo button svg { /*width:unset;*/ }
  header nav { width:85%; }
  header nav .Right { height:100%; }
  header nav .Right .Cta button { background-color:var(--color-primary); color:white; }
  header nav .Left { height:100%; }

    header nav ul.Primary > li > a { color:var(--color-primary); }
    header nav ul.Primary > li > a > button { padding:.5em; }

  header nav ul.Primary > li > a > button span { padding:4px 2px; }
  header nav ul.Primary > li:hover > a > button { background-color:unset; color:var(--color-primary); }
  header nav ul.Primary > li:hover > a > button span { box-shadow: 0 .3vw 0 0 var(--color-yellow); }
  header nav ul.Primary > li ul.Secondary { margin-top:-2vw; }
  header nav ul.Primary > li:hover ul.Secondary { width:max-content; }
  header nav ul.Secondary { /*background-color:wheat;*/ border:1px solid gray; border-radius:.5rem; }

  header nav ul.Secondary::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.6); /* or any color with alpha */
    backdrop-filter: blur(10px);
    z-index: -1;
    border-radius: 8px; /* optional */
  }

  header nav ul.Secondary > li { border-bottom:unset; background-color:unset; color:var(--color-primary); }
  header nav ul.Secondary > li > a button { color:var(--color-primary); }

  @media (max-width:767px) {
    header .Logo { width:25vw!important; height:15vw!important; }
    header.Stucco { height: var(--header-height) !important; }
  }

  main { padding-top:var(--header-height); }

  :where(main.Post, main.Project) { padding-top: calc(var(--header-height) + 25vw)!important; }
  :where(main.Post, main.Project) .Hero.Short {
    flex-direction:column!important; justify-content:center!important;
    background-image:url('/wp-content/uploads/2025/07/Circle-bkgrnd-blue-1920px.png')!important; background-size:100vw auto; }
  :where(main.Post, main.Project) .Hero.Short { margin-top: calc(var(--header-height) + var(--wp-login-bar)); }
  :where(main.Post, main.Project) .Hero.Short .Inner {
    width:60%!important; height:fit-content!important;
    background-image:url('/wp-content/uploads/2025/07/Circle-bkgrnd-orange-1920px.png'); background-size:100vw auto; background-position:0 -7.4vw;
    /* padding: 2rem 6rem 2rem 24vw!important; */
    margin: 0!important; padding-right:4rem!important;
    border-top-right-radius: 9999px; border-bottom-right-radius: 9999px;

  }
  :where(main.Post, main.Project) .Hero.Short .Inner p { margin-bottom:0; }

  @media (max-width:767px) {
    :where(main#home-page, main#about, main#impact, main#campaign) { padding-top: calc(175vw - 4vw + var(--header-height)) !important; }
    :where(main.Post) { margin-top: calc(var(--header-height) + 50vw)!important; padding-top:0!important; }
    :where(main.Project) { margin-top: calc(var(--header-height) + 40vw)!important; padding-top:0!important; }
    :where(main.Post, main.Project) .Hero.Short .Inner { width:95%!important; }
  }


/* hero */

  .Hero { }
  .Hero.Tall { height:50vw; }
  .Hero.Medium { height:30vw; }
  .Hero.Short { height:20vw; }
  .Hero.Auto { }
  .Hero.Auto h1 { padding-bottom:.25em; border-bottom:.2vw solid gray; }
  .Hero.Content { /*position:relative;*/ }
  .Hero.Content .Column.Text { min-height:30vw; margin-bottom:12vw; }
  .Hero.Content.Tall .Column.Text.rounded-tr-full { background-image: url('/wp-content/uploads/2025/07/Circle-bkgrnd-blue-1920px.png') !important; }
  @media (max-width:767px) {
    .Hero.Content .Column.Text { margin-bottom:0; }
    .Hero.Content.Tall .wp-block-cover__inner-container.is-layout-flow.wp-block-cover-is-layout-flow { margin-left:0; margin-right:auto; width:80%; }
    .Hero.Content.Tall h1  { width:90%; font-size:1.5rem!important; }
    .Hero.Content.Tall p { margin-left:0; margin-right:auto; /*width:70%;*/ width:90%; font-size:14px; }
    .Post .Hero.Short { height:40vw; }

  }


/* work on these */

  .grecaptcha-badge { visibility:hidden; }
  .BottomBar { padding-bottom:5rem!important; box-shadow: 0px -3rem 0px 0px var(--color-primary) inset; }

  .Gutenberg > .Hero.Content { position:relative; padding-top:0; /*margin-top: calc(var(--header-height)); height:50vw;*/ }
  .Gutenberg > .Hero.Content h1 { margin-top:0!important; }
  .LoggedIn .Gutenberg > .Hero.Content {  /* margin-top: calc(var(--header-height) + var(--wp-login-bar)); */ }


/* acf block overrides */

  .SliderFixed h1 { line-height:.8; }
  .PostInserter .Tiles .Item .Image { position:relative; overflow:hidden; aspect-ratio:1!important; border-radius:1em; }
  .PostInserter .Tiles .Item .Image::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    box-shadow: 0px 10px 28px 1px rgba(0,0,0,0.54) inset;
    pointer-events: none;
    z-index: 1;
  }
  .PostInserter .Tiles .Item .Image img {  }
  .PostInserter .Tiles .Item .Label {
    padding:.75em 2em!important;
    text-align:left!important;
    font-family:var(--font-special);
    font-size:var(--font-size-normal);
    text-align:right!important;
  }
  .PostInserter .Tiles .Item .Label h3 { color:var(--color-primary)!important; font-weight:700; }
  .PostInserter .Tiles .Item:hover .Label h3 { color:var(--color-highlight)!important; }
  .PostInserter .Tiles .Item .Label .Description { font-family:var(--font-paragraph); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
  .PostInserter .Tiles .Item .Label button { all:unset; margin: 0; padding: 0 !important; font-family: var(--font-special); font-size: var(--font-size-large); }
  .PostInserter .Tiles .Item:hover .Label button { background-color:unset!important; color:var(--color-highlight); }

  @media (max-width:767px) {
    .PostInserter .Tiles.ThreeColumns { grid-template-columns:1fr!important; }
  }


/* block patterns */

  .ColumnsCoverTextPhoto { /*aspect-ratio:2;*/ min-height:75%; }
  .ColumnsCoverTextPhoto > .wp-block-column { /*height:100%;*/ /*min-height:100%;*/ }
  .ColumnsCoverTextPhoto > .wp-block-column .wp-block-cover { height:100%; }

  .ColumnsPunchout h4 { margin-top:1rem; }
  .ColumnsPunchout .wp-block-buttons { margin-top:2rem; }

  .StatsGridSmall .wp-block-group.is-vertical { padding:1rem 2rem; gap:0; }
  .StatsGridSmall .wp-block-group.is-vertical h4 { line-height:1.1; }
  .StatsGridSmall .wp-block-group.is-vertical p { margin-top:.2em; }

  .SchoolsGrid .wp-block-group.is-vertical { padding:1rem 2rem; gap:0; }
  .SchoolsGrid .wp-block-group.is-vertical .Title { min-height:2.6em; }
  .SchoolsGrid .wp-block-group.is-vertical h3 { line-height:1.1; }

  .Document h1 { font-size:2.5rem; font-weight:bold; text-transform:uppercase; }
  .Document h2 { font-size:2.5rem; font-weight:bold; text-transform:uppercase; }
  .Document h3 { font-size:1.75rem; font-weight:bold; text-transform:uppercase; }
  .Document h4 { font-size:1.5rem; font-weight:bold; text-transform:uppercase; }
  .Document ul, .Document ol { padding-left:2em; font-size:var(--font-size-normal); }
  .Document li { margin-bottom:.5em; }
  .Document p { font-size:var(--font-size-normal); }
  .Document .ListLowerAlpha { list-style:lower-alpha; }

  @media (max-width:767px) {
    .ColumnsCoverTextPhoto { /*aspect-ratio:4/3;*/  }

    .ColumnsCoverTextPhoto > .PhotoColumn { order:0; /* aspect-ratio:4/3; */ min-height:75vw; }
    .ColumnsCoverTextPhoto > .TextColumn { order:1; min-height:75vw; }

    .ColumnsCoverTextPhoto > .wp-block-column { /*height:100%;*/ /*min-height:100%;*/ }
    .ColumnsCoverTextPhoto .wp-block-cover { min-height:unset; }
    .ColumnsPunchout { --wp--preset--font-size--x-large:1.5rem; height:100vw!important; font-size:90%; }

    .StatsGridSmall { grid-template-columns:1fr!important; }

    .SchoolsGrid .wp-block-group-is-layout-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); }

    .StudentCarousel { padding:var(--spacing-medium) 0!important; }
    .StudentCarousel h2 { text-align:center; }
    .StudentCarousel p { text-align:center; }
    .StudentCarousel .wp-block-buttons { justify-content:center; }
    .StudentCarousel .wp-block-column { padding:0 var(--spacing-medium)!important; }

  }


/* plugins */

  .Cf7 {font-family:var(--font-special); }
  .Contact .Cf7 { min-height:50vw; }

  @media (max-width:767px) {
    .Contact .Cf7 form .Cta {  }
  }

  .Gutenberg .Fluid.wp-block-cover.alignfull { padding-left:7vw!important; }

  figure.Background { position: absolute!important; /* z-index: 0; */ width:100%!important; aspect-ratio:2; filter: opacity(.20); }
  figure.Background img {
    position: absolute;
    z-index: 0;
    width:100%!important; aspect-ratio:2;
    transform: scaleY(-1);
    object-fit: contain!important;
    object-position: calc(100% + 10px) calc(100% + 5px);
  }
  .Gutenberg figure.Background { width:100%!important; }
  .Gutenberg figure.Background img { }


/* other */

  .BelowMain { display:none; }
  .Circles { flex-direction:column!important; justify-content:center!important; background-size:100vw auto; }
  .Circles.Orange { background-image:url('/wp-content/uploads/2025/07/Circle-bkgrnd-orange-1920px.png')!important; }
  .Circles.Blue { background-image:url('/wp-content/uploads/2025/07/Circle-bkgrnd-blue-1920px.png')!important; }
  .Counter { opacity:0; transition: opacity 0.3s ease; }


/* view specific rules */

  #about #board h3 + p { margin-top:.5em; }
  #about #team .wp-block-group.is-vertical.is-layout-flex { gap:0!important; }
  #about #team h3 + p { margin-top:.5em; }

  #campaign #blackbaud-embed { margin-block-start:0!important; }

  #donate #form-wrapper { width:100%; }
  #donate #form-wrapper [id^="blackbaud-donation-form_"] { width:100%; }
  #donate .wp-block-button:hover .wp-block-button__link { color:white!important; }
  #donate .wp-block-button:hover .show-form-gift { color:white!important; }

  main#cise-sgo .Hero .wp-block-cover__inner-container { margin:auto; }
  main#cise-sgo .Hero .wp-block-cover__inner-container .wp-block-image { width:auto; }

  main#students .PostInserter .Tiles .Item .Image img { object-position:top center; }

  :where(main#school, main#about, main#buildings) .wp-block-buttons.Javascript .GradeSchools {  }
  :where(main#school, main#about, main#buildings) .wp-block-buttons.Javascript .GradeSchools:hover {  color:white!important; }
  :where(main#school, main#about, main#buildings) .wp-block-buttons.Javascript .GradeSchools:hover a { background-color:var(--color-blue); color:white!important; }
  :where(main#school, main#about, main#buildings) .wp-block-buttons.Javascript .GradeSchools.Clicked { color:white!important; }
  :where(main#school, main#about, main#buildings) .wp-block-buttons.Javascript .GradeSchools.Clicked a { background-color:var(--color-blue)!important; color:white!important; }
  :where(main#school, main#about, main#buildings) .wp-block-buttons.Javascript .HighSchools:hover { color:white!important; }
  :where(main#school, main#about, main#buildings) .wp-block-buttons.Javascript .HighSchools:hover a { background-color:var(--color-yellow)!important; color:white!important; }
  :where(main#school, main#about, main#buildings) .wp-block-buttons.Javascript .HighSchools.Clicked { color:white!important; }
  :where(main#school, main#about, main#buildings) .wp-block-buttons.Javascript .HighSchools.Clicked a { background-color:var(--color-yellow)!important; color:white!important; }

  body.single-landing header.Minimal { /*position:absolute!important;*/ background-color:unset; }
  body.single-landing header.Minimal .Logo { visibility:hidden; }
  body.single-landing header.Minimal.Stucco {  background-color:white; }
  body.single-landing header.Minimal.Stucco .Logo { visibility:visible; }
  body.single-landing main { padding-top:0; }

  @media (max-width:767px) {
    #home-page .PostInserter .Tiles > div:nth-of-type(n+3) { display:none; }
    #home-page .PostInserter .Tiles .Label * { text-align:center; }
    #about #team .is-layout-grid { grid-template-columns:repeat(2, 1fr); }
    #about #board .NamesBig { grid-template-columns:repeat(2, minmax(0, 1fr)); }
    #about #board .NamesSmall { grid-template-columns:repeat(2, minmax(0, 1fr)); }
    :where(#campaign, #ways-to-give) #donate-bar .wp-block-column { flex-basis:50%!important; }
    :where(#campaign, #ways-to-give) #donate-bar .wp-block-column:first-of-type { display:none; }
    :where(#campaign, #ways-to-give) #donate-bar .wp-block-column:last-of-type { display:none; }
    #cte #governor .wp-block-column:last-of-type { padding:var(--spacing-medium)!important; }
    #hs-scholarships #real-impact .wp-block-column:last-of-type { padding:var(--spacing-medium)!important; }
    main#contact #contact { position:inherit; }
    main#contact .PostInserter .Tiles > div:nth-of-type(n+3) { display:none; }
  }


/* modal */

  #modal { font-size:.5rem; }
  #modal menu.Columns { /*font-size:1.5rem;*/ }
  #modal menu.Columns .Column div { flex-direction:column; align-items:end!important; }
  #modal .Glass { filter:unset!important; background-color:white!important; }
  #modal .Heading { font-size:1.2rem; }
  #modal menu.Columns .Column { padding:unset!important; }
  #modal menu.Columns .Column .ItemSecondary { color:inherit!important; }
  #modal menu.Columns .Column div a { width:100%; }
  #modal menu.Columns .Column .ItemSecondary .Active { color:var(--color-yellow)!important; }
  #modal menu.Columns .Column .ItemSecondary .Active .Symbols { color:inherit!important; }
  #modal menu.Columns button { font-size:1rem; text-align:left; }


/* settings bar */

  #settingsBar { position:absolute!important; }
  #settingsBar .Privacy.Collapsed { margin-left:0; width:100%; outline:0; border-top:1px solid white; background-color:unset; }
  #settingsBar .Privacy.Collapsed .Info { width:100%; }
  #settingsBar .Privacy.Collapsed .Info .Main { width:100%; justify-content:center; background-color:unset; }


/* footer */

  footer { --color-text:white; }
  footer .Column.Logo svg #C { fill:white; }
  footer .Column.Logo svg #i #Stick { fill:white; }
  footer .Column.Logo svg #S { fill:white; }
  footer .Column.Logo svg #E { fill:white; }
	footer #logo-social-instagram g { fill:white; }
	footer #logo-social-linkedin g { fill:white; }
	footer #logo-social-facebook g path { fill:white; }

  footer { height:unset; background-color:var(--color-blue); }
  footer menu.Columns .Column.Left { width:50%; }
  footer menu.Columns .Column.Right { width:50%; justify-content:flex-end; }
  footer .Illustration { display:block; margin:auto; width:90%; }
  footer menu nav.WpMenu { height:15vw; margin:0 auto; padding-top:2vw; /*border-top:1px solid white;*/ width:85%; }


  @media (max-width: 767px) {
    /* :root { font-size:2.25vw; } */
    /* body { font-size:2.25vw!important; } */
    :root { font-size:15px; }
    body { font-size:15px!important; }
    footer menu.Columns { padding:0%; flex-wrap:wrap; flex-direction:column; }
    footer menu.Columns .Column.Left { width:100%; flex-direction:column; }
    footer menu.Columns .Column.Left .Heading button { margin:3vw auto 0 auto; font-size:inherit;  }
    footer menu.Columns .Column.Logo a { width:100%; }
    footer menu.Columns .Column.Logo a button { margin:auto; width:fit-content; }
    footer menu.Columns.Top .Column.Logo .Phone { text-align:center; }
    footer menu.Columns.Top .Column.Logo .Email { text-align:center; }
    footer menu.Columns .Column.Logo { margin:auto; text-align:center; }
    footer menu.Columns .Column.Company { margin:auto; width:100%; text-align:center; }
    footer menu.Columns .Column.Company .Social { justify-content:center; }
    footer menu.Columns .Column.Company .Social svg { margin-left:.5em; margin-right:.5em; }

    footer menu.Columns .Column.Right { margin-top:3rem; width:100%; text-align:center; }
    footer menu.Columns .Column.Right .wpcf7-form-control.wpcf7-submit.has-spinner.Cta { margin-left:72px; }
    footer menu nav.WpMenu { display:none; }

  }