/*!
 * ===========================
 * Author: Steve Gotthardt
 * Created: 4/2026
 * ===========================
 */

main#top {
  padding-bottom:0;
}

.button-container {
  display:flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap:6px;
  max-width:285px;
  margin:0 auto;
  @media (min-width:768px) {
    flex-direction: row;
    max-width:none;
    gap:12px;
  }
  .button {
    width:100%;
    @media (min-width:768px) {
      width:285px;
    }    
  }
  .button.button--secondary {
    color:#00447c;
    &:hover, &:focus {
      color:white;
    }
  }
}  

.highlight-row.grid,
.section-container .grid {
  align-items: stretch;
  .grid__unit > div,
  .grid__unit > div > div{
    display:flex;
    flex-direction:column;
    text-align:center;
    @media (min-width: 768px) {
      height:100%;
      display:flex;
      flex-direction:column;
      justify-content: center;
    }      
  }
}
.highlight-row.grid {
  .grid__unit > div > div{
    text-align:start;
  }
}

.section-container {
  padding:108px 0; 
  &.interstitial {
    padding:0 24px 24px !important;
    @media (min-width:960px) {
      padding:0 48px !important;
    }
    @media (min-width:1376px) {
      padding:0 !important;
    }
    &.interstitial--left {
      @media (min-width:960px) {
        padding-right:0 !important;
      }
    }
    &.interstitial--right {
      @media (min-width:960px) {
        padding-left:0 !important;
      }
    }
  }
  .card {
    h2.h3, h3 {
      line-height:1.2;
    }
  }
  &.pricing-cta {
    padding-top:0;
    padding-bottom:0;
    margin:0;
    background:#f6f6f6;    
    h2, p {
      text-align:start;
    }
  }
  &.pricing {
    padding-bottom:0;
  }
  &.more-info {
    padding-left:24px;
    @media (min-width:768px) {
      padding-left:48px;
    }
    .grid {
      margin:0;      
    }
  }
  &.join-promo {
    margin:0;
    background: #00447c;
  }
  &.why-recommend, &.testimonial, &.pricing {
    padding-left:24px;
    padding-right:24px;
    @media (min-width:768px){
      padding-left:48px;
      padding-right:48px;
    }
    @media (min-width:1376px) {
      padding-left:0;
      padding-right:0;
    }
  }
  &.why-recommend {
    background:#00447c;
    color:white;
    .h1 {
      font-family: "Barlow Semi Condensed", "Roboto", Helvetica, Arial, sans-serif;
      font-size:54px;
      line-height:1.15;
      font-weight:600;
      color:white;
    }
  }
  &.testimonial {
    background: #00447c;
    color:white;
    text-align: center;
    p {
      max-width:70ch;
      margin-left: auto;
      margin-right:auto;
    }
    .quote {
      font-family: "Halant", "Roboto", Helvetica, Arial, sans-serif;
      font-size:18pt;
      line-height:1.6;
      font-style:italic;
    }
  }
  &.benefits, &.benefits-expanded {
    .page-bounds {
      padding:0 24px;
      @media (min-width:768px) {
        padding:0 48px;
      }
      @media (min-width:1376px) {
        padding:0;
      }
    }    
    .benefit-tile-container {
      display:grid;
      grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
      grid-gap:12px;
      justify-content: center;
      .benefit {
        background:linear-gradient(rgba(0,0,0,1),rgba(0,0,0,1)), url(https://www.ifebp.org/images/default-source/site-images/membership/membership-thumbnail-2025.jpg);
        background-blend-mode: saturation;
        background-size:cover;
        background-position:top center;
        background-repeat:no-repeat;
        padding:48px;
        position:relative;
        display:flex;
        flex-direction:column;
        justify-content: center;
        &::before {
          position:absolute;
          content:"";
          top:0;
          left:0;
          width:100%;
          height:100%;        
          opacity:.9;
        }
        &::after {
          position:absolute;
          content:"";
          top:0;
          left:0;
          width:100%;
          height:100%;        
          background:white;
          opacity:.2;
        }
        h3, p {
          color:#262626;
          z-index:1;
          position:relative;
          text-align:center;
        }
        h3 {
          font-family: "Barlow Semi Condensed", "Roboto", Helvetica, Arial, sans-serif;
          font-size: 25px;
          line-height: 32px;
          font-weight:600;
          margin-bottom:12px;
        }   
      }      
    }
    &.benefits {
      .benefit-tile-container .benefit {
        &:nth-of-type(4n+1) {
          &::before { background:#f7c414; }
        }
        &:nth-of-type(4n+2) {
          &::before { background:#82bf43; }
        }
        &:nth-of-type(4n+3) {
          &::before { background:#9bcfe8; }
        }
        &:nth-of-type(4n+4) {
          &::before { background:#3bac96; }
        }
      }
    }
    &.benefits-expanded {
      padding-top:0;
      .benefit-tile-container {
        display:grid;
        grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
        .benefit {
          &:nth-of-type(3n+1) {
            &::before { background:#f7c414; }
          }
          &:nth-of-type(3n+2) {
            &::before { background:#82bf43; }
          }
          &:nth-of-type(3n+3) {
            &::before { background:#9bcfe8; }
          }
        }        
      }
    }
  &.pricing {
    background:#f6f6f6;
  }
}

div#RateChartMainContainer {
  margin-top:0;
}