/* roboto-italic - latin */
@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 400;
    src: local(''),
    url('/fonts/roboto-v47-latin-italic.woff2') format('woff2'), 
    url('/fonts/roboto-v47-latin-italic.woff') format('woff');
}
/* roboto-700 - latin */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: local(''),
    url('/fonts/roboto-v47-latin-700.woff2') format('woff2'), 
    url('/fonts/roboto-v47-latin-700.woff') format('woff'); 
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: local(''),
    url('/fonts/roboto-v47-latin-regular.woff2') format('woff2'),
    url('/fonts/roboto-v47-latin-regular.woff') format('woff');
    font-display: swap;
}

/* zen-dots-regular - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Zen Dots';
    font-style: normal;
    font-weight: 400;
    src: url('/fonts/zen-dots-v12-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }

:root {

    --main-font: 'Roboto', 'Arial', sans-serif;
    --logo-font: 'Zen Dots','Roboto', 'Arial', sans-serif;
    --primary: #17946D;
    --primaryDark:#167456;
    --primaryLight: #b6f1bb;
    --secondary: #002C37;
    --secondaryLight:#175362;
    --darkBlack:#0B0B0B;
    --darkBlackLight:#1A1A1A;
    --headerColor: #1a1a1a;
    --headerColorWhite: #fafbfc;
    --bodyTextColor: #171717;
    --bodyTextColorWhite: #fafbfc;

    --topperFontSize: clamp(0.8125rem, 1.6vw, 1rem);

    --headerFontSize: clamp(2.5rem, 6vw, 3.5625rem);
    --headerRegularFontSize: clamp(1.44rem, 5vw, 2.49rem);
    --headerSmallFontSize:  clamp(1.44rem, 2vw, 2rem);


    --sectionTitleFontSize:clamp(2.07375rem, 5.5vw, 2.98625rem);


    --bodyFontSize: 1rem;

    --bodyBigFontSize: clamp(1.2rem, 2vw, 1.44rem);
    /* 60px - 100px top and bottom */
    --sectionPadding: clamp(3.75rem, 7.82vw, 6.25rem) 1rem;
}

body {
    margin: 0;
    padding: 0;
    font-family: var(--main-font);
}

*, *:before, *:after {
    box-sizing: border-box;
}


.container-logo .logo {
    font-family: var(--logo-font);
     text-decoration: none;
     color: var(--bodyTextColor);
   
     font-size: 1.2rem;
 
   }

.section-title {
    font-size: var(--sectionTitleFontSize);
}
 

.topper {
    font-size: var(--topperFontSize);
    line-height: 1.2em;
    text-transform: uppercase;
    text-align: inherit;
    letter-spacing: .1em;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 0.25rem;
    display: block;
}



.title {
  max-width: 17ch;
    font-size: var(--headerFontSize);
    font-weight: 900;
    line-height: 1.2em;
    text-align: inherit;
    max-width: 43.75rem;
    margin: 0 0 1rem 0;
    color: var(--headerColorWhite);
  
}

.cs-text {
    font-size: var(--bodyFontSize);
    line-height: 1.5em;
    text-align: inherit;
    width: 100%;
    max-width: 40.625rem;
    margin: 0;
    color: var(--bodyTextColor);
}