* {
      --dark-red: #942B00;
      --white: #ffffff;
      --light-gray: #F7F7F7;
    }

    html,
    body {
      margin: 0;
      padding: 0;
      width: 100%;
      height: 100%;

      h1, h2, h3, h4, h5, h6 {
        font-family: "Vollkorn", serif;
        font-optical-sizing: auto;
        font-weight: 400;
        font-style: normal;
      }

      h2 {
        font-size: calc(1.25rem + 1vw);
      }

      h3 {
        font-size: calc(.6rem + 1vw);
      }

      p {
        font-size: calc(1rem + .25vw);
        line-height: 2rem;
        font-family: "Quattrocento", sans-serif;
        font-weight: 400;
        font-style: normal;
      }

      .text-bold, .font-bold {
        font-weight: 600;
      }

      .text-center {
        text-align: center;
      }

      .text-white {
        color: #ffffff;
      }

      .text-red {
        color: #942B00;
      }

      .button {
        display: inline-block;
        text-transform: uppercase;
        background: transparent;
        padding: 0.75rem 2rem;
        font-size: 1.1rem;
        text-decoration: none;
        border-radius: 0;
        margin-top: 2rem;

        &.button-white, &.white {
          color: #fff;
          border: 1px solid #fff;
        }

        &.button-red, &.red {
          color: var(--dark-red);
          border: 1px solid var(--dark-red);
        }

        &.button-center, &.center {
          margin: auto;
          display: table;
        }
      }

      .sr-only, [class*=screen-reader] {
        visibility: hidden;
      }

      [class*=hidden] {
        display: none;
      }

    }

    .vollkorn-regular {
      font-family: "Vollkorn", serif;
      font-optical-sizing: auto;
      font-weight: 400;
      font-style: normal;
    }

    .quattrocento-regular {
      font-family: "Quattrocento", sans-serif;
      font-weight: 400;
      font-style: normal;
    }

    .quattrocento-bold {
      font-family: "Quattrocento", serif;
      font-weight: 700;
      font-style: normal;
    }

    header {
      position: absolute;
      display: flex;
      justify-content: center;
      background: rgba(40, 40, 40, 0.95);
      width: 100%;    
      top: 0;
      left: 0;
      z-index: 10;
      
      .container {
        max-width: 1800px;
        width: 100%;
        height: 100px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 3rem;
        box-sizing: border-box;
      }

      .logo {
        height: 48px;
        display: flex;
        align-items: center;

        img {
          height: 48px;
          width: auto;
        }
      }

      .navlink {
        color: #fff;
        text-decoration: none;
        font-size: 1.1rem;
        text-transform: uppercase;
      }
    }

    .banner-section {
      position: relative;
      width: 100%;
      height: 100%;
      min-height: 600px;
      overflow: hidden;

      .wrapper {
        /* background-color: #707070; */
        position: relative;
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: right;
        z-index: 5;

        .container {
          display: flex;
          align-items: center;
          background: rgba(148, 43, 0, 0.7);
          color: #ffffff;
          width: 50%;
          height: 100%;
          padding-top: 100px;
        }

        .container-copy {
          display: flex;
          width: 100%;
          max-width: 900px;
          padding: 0 calc(1rem + 7vw);
          flex-direction: column;
          flex-wrap: wrap;
          align-items: flex-start;

          h1 {
            font-size: calc(2rem + 1vw);
            margin: 3rem 0 0 0;
            line-height: 1.25;
          }

          h1, p {
            text-align: left;
          }
        }
      }

      video {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        min-height: 600px;
        padding-top: 100px;
        object-fit: cover;
        object-position: center;
        z-index: 1;
      }
    }    

    #main {
      background: url('https://www.triariiadvisors.com/wp-content/uploads/2025/07/main-copy-background.png') center center / cover no-repeat;
      min-height: 400px;
      display: flex;
      justify-content: center;
      align-items: center;
      color: #fff;

      .wrapper {
        width: 100%;
        max-width: 1800px;
        display: flex;
        justify-content: center;
        align-items: center;

        .container {
          padding: 3rem;
          width: 100%;
          max-width: 900px;

          .our-story {
            margin: 10rem 0;
            text-align: center;

            h2 {
              font-size: calc(2rem + 1vw);
              margin: 0rem 0 1rem 0;
            }

            h3 {
              font-size: calc(1.2rem + 1vw);
              font-weight: 400;
              margin: 0 0 .5rem 0;
            }
          }

        }

      }

    }

    #services {
      
      .wrapper {
        width: 100%;
        display: flex;
        align-items: stretch;

        .container-half:first-child {
          width: 50%;
          background: url(/wp-content/uploads/2025/07/services-partners-background.jpg) no-repeat center center / cover;
        }

        .container-half:last-child {
          width: 50%;

          .row {
            width: 100%;

            .copy {
              width: calc(100% - 12rem);
              max-width: 750px;
              padding: 5rem 6rem;
              
              h2 {
                margin-bottom: 1rem;
              }
            }

            &:first-child {
              background: #ffffff;
            }

            &:last-child {
              background: #F7F7F7;
            }
          }
        }
      }
    }

    #mission {
      background: url(/wp-content/uploads/2025/07/mission-background.jpg) no-repeat center center / cover;

      .wrapper {
        background: linear-gradient(180deg, hwb(0deg 0% 100% / 40%), hwb(0deg 0% 100% / 10%));
        display: flex;
        justify-content: center;

        .container {
          background: linear-gradient(0deg, hwb(0deg 0% 100% / 80%), hwb(0deg 0% 100% / 10%));
          padding: 7rem 3rem;
          width: 100%;
          max-width: 900px;
        }

      }

    }

    #advantage {
      background: url(/wp-content/uploads/2025/07/advantage-background.jpg) no-repeat center center / cover;
      padding: 3em 0;
      display: flex;
      flex-direction: column;
      align-items: center;

      .wrapper {
        width: 100%;
        max-width: 1800px;

        .container {
          width: calc(100% - 10em);
          padding: 0 5em;

          h2 {
            color: #ffffff;
            display: flex;
            align-items: center;
            justify-content: center;

            img {
              width: calc(6rem + 10vw);
              margin: -.5rem calc(.5rem + 1vw) 0;
            }
          }

          .row {
            width: 100%;
            display: flex;
            gap: 3rem;
            flex-direction: row;
            flex-wrap: wrap;
            justify-content: center;
            margin: 3rem 0;

            .card {
              background: #ffffff;
              width: calc(33.3% - 3rem);
              min-width: 20rem;

              img {
                width: 100%;
                aspect-ratio: 3 / 2;
                object-fit: cover;
              }

              .copy {
                padding: 2rem 3rem;

                h3 {
                  min-height: 100px;
                  display: flex;
                  align-items: center;
                  justify-content: center;
                  margin: 0;
                }

              }

            }

          }

        }

      }
    }

    @keyframes marquee-content {
      from {
        transform: translateX( 0% );
      }
      to {
        transform: translateX( -100% );
      }
    }

    #partners {
      background-color: var(--white);
      display: flex;
      justify-content: center;
      align-items: center;
      flex-direction: column;

      .wrapper {
        width: 100%;
        max-width: 1800px;
        display: flex;
        justify-content: center;
        align-items: center;

        .container {
          padding: 3rem;
          width: 100%;
          max-width: 900px;
        }

      }

      .marquee {
        display: flex;
        overflow: hidden;
        white-space: nowrap;
        width: 100%;
        margin: 3em 0 7em;
      }
      .marquee__item {
        animation-duration: 30s;
        animation-iteration-count: infinite;
        animation-name: marquee-content;
        animation-timing-function: linear;
        max-height: 65px;
        padding: 20px 0;
        width: max-content;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-around;

        img {
          max-width: 250px;
          max-height: 100%;
        }
      }
      /* .marquee:hover .marquee__item {
        animation-play-state: paused;
      } */

    }

    #about {
      background: radial-gradient(#353B3E, #151B1F);
      color: var(--white);
      display: flex;
      justify-content: center;
      align-items: center;
      flex-direction: column;

      .wrapper {
        width: 100%;
        max-width: 1800px;
        display: flex;
        justify-content: center;
        align-items: center;

        .container {
          padding: 3rem;
          width: 100%;
          max-width: 900px;

          &.images {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 4rem;
            padding: 0rem 2rem 3rem;
          }
        }

      }

    }

    #contact {
      background: url(/wp-content/uploads/2025/07/contact-background.jpg) no-repeat center center / cover;
      color: var(--white);
      display: flex;
      justify-content: center;
      align-items: center;
      flex-direction: column;
      
      .wrapper:first-child {
        background: linear-gradient(180deg,rgba(21, 27, 31, 1), rgba(21, 27, 31, .5));
      }

      .wrapper {
        background: rgba(21, 27, 31, .5);
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;

        .container {
          padding: 4rem 2rem 0;
          width: 100%;
          max-width: 900px;
          display: flex;
          flex-direction: column;
          flex-wrap: nowrap;
          align-items: center;

          h2 {
            font-size: calc(2rem + 1vw);
            margin: 0rem 0 1rem 0;
          }

          div#wpcf7-f550-o1, form {
            max-width: 750px;
            width: 100%;
            margin: auto;
          }

          form fieldset + p {
            height: 3rem;
            display: flex;
            align-items: center;

            span {
              width: 100%;
              height: 100%;
            } 
            
            span > input, span + input {
              width: calc(100% - 2rem);
            }
          }

          input[type=email] {
            height: 100% !important;
            padding-block: 0 !important;
            padding: 0 1rem;
            border: 0;
            font-size: calc(1rem + .25vw);
          }

          input[type=submit] {
            height: 100%;
            text-transform: uppercase;
            color: var(--white) !important;
            background: var(--dark-red)url(https://www.triariiadvisors.com/wp-content/uploads/2025/07/triarii-emblem.png) no-repeat 23% / 25px !important;
            padding: 0 1rem 0 3rem !important;
            max-width: 150px;
            margin: 0 !important;
            font-size: calc(1rem + .25vw)!important;
          }

          img {
            margin: 4em 0;
          }

        }

      }

    }

    footer {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      padding: 0 0 2rem 0;
      margin: 1rem 0;
      gap: 1rem;
      text-transform: uppercase;

      p {
        margin: 0;
        text-align: center;
      }

      a {
        color: var(--white);
        text-decoration: none;

        &:hover, &:active, &:visited {
          color: var(--white);
          text-decoration: underline;
          text-underline-offset: 3px;
        }
      }
    }
    p.address {
      text-align: center;
      width: 75%;
      }
    #terms-of-service {
        width: 90%;
        margin: auto;
    }
    @media screen and (max-width: 979px) {
      h3 {
        font-size: 1.25rem!important;
      }

      .banner-section .wrapper .container {
        width: 100%;
      }

      #services {
        .wrapper {
          width: 100%;
          display: flex;
          align-items: center;
          flex-direction: column;

          .container-half:first-child {
            display: none;
          }

          .container-half:last-child {
            width: 100%;
          }

          .copy {
            width: calc(100% - 6rem)!important;
            max-width: 750px;
            padding: 5rem 3rem!important;
          }
        }
      }
    }

    @media screen and (max-width: 875px) {
      header {
        .container {
          height: 175px;
          align-items: center;
          flex-direction: column;
          justify-content: space-evenly;
        }
      }
    }

    @media screen and (max-width: 700px) {
      header {
        .container {
          height: 200px;

          .nav-wrapper {
            gap: 1.5rem!important;
            margin-top: 1rem;
            flex-direction: column-reverse;
          }
        }
      }
      .address {
        width: 75%;
        text-align: center;
      }
    }

    @media screen and (max-width: 595px) {
      header {
        .navlink {
          font-size: .9rem;
        }
      }
      footer {
        flex-direction: column;
        p:nth-child(2) {
          display: none;
        }
      }
      .address {
          text-align: center;
          width: 75%;
        }
    }