@import url("https://use.typekit.net/iwq4iwv.css");

:root {
  /* Typography */
  --heading-font-family: "itc-avant-garde-gothic-pro", sans-serif;
  --body-font-family:  "inter-variable", sans-serif;

  /* Header */
  --header-height: 80px;

  /* Colors */  
  --brand-neutral-grey: #cbcbcb;
  --brand-black: #000C1B;
  --brand-white: #ffffff;
  --brand-light-grey: #f7f7f7;

  --brand-blue: #0179B6;
  --brand-red: #DB181F;


  /* Neutrals */


  /* Green Variables - 500 Brand */


    /* Misc */
  --normal-radius: 15px;
  --small-radius:10px;
  --xsmall-radius:8px;

  --small-shadow:0px 4px 10px 0px rgba(0, 0, 0, 0.03);

}


[data-bg-color="color-black"] {
    background-color: var(--brand-black);
}

[data-bg-color="color-white"] {
    background-color: var(--brand-white);
}

[data-bg-color="color-light-grey"] {
    background-color: var(--brand-light-grey);
}

[data-color="color-black"] {
    color: var(--brand-black);
}

[data-color="color-white"] {
    color: var(--brand-white);
}

/*--------------------------------------------------------------
  >> : Typography
--------------------------------------------------------------*/

  body {
    text-rendering: auto;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: auto;
    -webkit-tap-highlight-color: transparent;
    overflow-x: hidden;
    font-family: var(--body-font-family);
    color: var(--body-color);

  }

  .small, 
  small {
    font-size: 0.75rem;
  }

  h1, .h1,
  h2, .h2,
  h3, .h3,
  h4, .h4,
  h5, .h5,
  h6, .h6 {
    font-weight:500;
    font-style: normal;
    font-family: var(--heading-font-family);
    text-rendering: geometricPrecision;
  }

  h1, .h1 {
    line-height: 1.2em;
    font-size: 3.8em;
    letter-spacing: -0.03em;
    font-weight:400;
  }

  h2, .h2 {
    line-height: 1.2em;
    font-size: 2.9em;
    letter-spacing: -0.02em;
  }

  h3, .h3 {
    font-size: 1.75em;
    line-height: 1.25em;
    letter-spacing: -0.01em;
  }

  h4, .h4 {
    font-size: 1.4em;
    line-height: 1.3em;
  }

  h5, .h5 {
    font-size: 1.3em;
    line-height: 1.5;
  }

  h6, .h6 {
    font-size: 0.8em;
    line-height: 1.5;
    text-transform: uppercase;
    font-weight: normal;
  }

  @media (max-width: 992px) {

    h1, .h1 {
      font-size: 3.2rem;
    }

    h2, .h2 {
      font-size: 2rem;
      margin-bottom:15px;
    }

    h3, .h3 {
      font-size: 1.7rem;
    }
  }

  h1:first-child,
  h2:first-child,
  h3:first-child,
  h4:first-child,
  h5:first-child,
  h6:first-child,
  p:first-child, 
  ul:first-child, 
  ol:first-child {
    margin-top: 0;
  }

  h1:last-child,
  h2:last-child,
  h3:last-child,
  h4:last-child,
  h5:last-child,
  h6:last-child,
  p:last-child, 
  ul:last-child, 
  ol:last-child {
    margin-bottom: 0;
  }

  a {
    color: var(--brand-black);
  }

  p {
    font-size:1.1rem;
    font-optical-sizing: auto;
    font-style: normal;
    font-variation-settings: "slnt" 0, "wght" 300;
  }

  strong {
    font-variation-settings: "slnt" 0, "wght" 500;
  }

  p.sub-title {
    text-transform:uppercase;
    letter-spacing:0.1em;
    font-size:0.9em;
    color:var(--brand-red);
  } 

/*--------------------------------------------------------------
  >> : Basic Asset Sizes and Setup
--------------------------------------------------------------*/

  picture {
    display: inline-block;
    width: 100%;
    height: auto;
    overflow: hidden;
    vertical-align: middle;
    border-radius:5px;
  }

  picture img {
    width: 100%;
    height: auto;
    vertical-align: middle;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: center center;
       object-position: center center;
  }

  video {
    width: 100%;
    height: auto;
    vertical-align: middle;
  }

/*--------------------------------------------------------------
  >> : Button
--------------------------------------------------------------*/

  .btn-outline-dark:hover svg path {
    fill: #000;
  }

/*--------------------------------------------------------------
  >> : Forms
--------------------------------------------------------------*/
  
  [readonly="readonly"] {
    position: relative;
    background: #f7f7f7;
    color: #585858;
    pointer-events: none;
    cursor: not-allowed;
  }
  
/*--------------------------------------------------------------
  >> : Min Height Utilities
--------------------------------------------------------------*/
  .min-vh-25 {
    min-height: 25vh!important;
  }

  .min-vh-50 {
    min-height: 50vh!important;
  }

  .min-vh-75 {
    min-height: 75vh!important;
  }
