

:root {
  /* Colors */
  --c-white: #ffffff;
  --c-orange: #f24e24;
  --c-orange-bg: #FFEDE9;
  --c-orange-h: #dd431b;
  --c-deepblue: #0b2639;
  --c-blue: #aacfdf;
  --c-text: #6a7a89;
  --c-border: #b5c1cc;
  --c-gray: #f2f2f2;
  --c-blue-bg: #f4f8fb;
  --c-lightblue: #eaf4fb;
  --c-lightorange: #fff6f4;
  --c-dark: #24394c;
  --c-dark-2: #2d5f76;
  --c-gray-2: #e2e2e2;
  /* Typography desktop */
  --fs-h1: 3.5rem;     /* 56 */
  --lh-h1: 5.25rem;    /* 84 */
  --fs-h2: 3rem;       /* 48 */
  --lh-h2: 4.5rem;     /* 72 */
  --fs-h3: 2rem;       /* 32 */
  --lh-h3: 3rem;       /* 48 */
  --fs-h4: 1.5rem;     /* 24 */
  --lh-h4: 2.25rem;    /* 36 */
  --fs-h5: 1.25rem;    /* 20 */
  --lh-h5: 1.875rem;   /* 30 */
  --fs-p: 1rem;        /* 16 */
  --lh-p: 1.5rem;      /* 24 */
  --cont-width: 1232px;
}

html, body {
  font-family: "Mulish", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 0;
  color: var(--c-text);
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 2px solid var(--c-orange);
  outline-offset: 2px;
}

.container {
  width: 100%;
  max-width: var(--cont-width);
  margin: 0 auto;
  padding: 0 16px;
}

h1,
.h1 {
  font-size: var(--fs-h1);
  line-height: var(--lh-h1);
  font-weight: 600;
  color: var(--c-deepblue);
  margin-bottom: 16px;
}

h2,
.h2 {
  font-size: var(--fs-h2);
  line-height: var(--lh-h2);
  font-weight: 600;
  color: var(--c-deepblue);
  margin-bottom: 24px;
}

h3,
.h3 {
  font-size: var(--fs-h3);
  line-height: var(--lh-h3);
  font-weight: 600;
  color: var(--c-deepblue);
  margin-bottom: 16px;
}

h4,
.h4 {
  font-size: var(--fs-h4);
  line-height: var(--lh-h4);
  font-weight: 600;
  color: var(--c-deepblue);
  margin-bottom: 16px;
}

h5,
.h5 {
  font-size: var(--fs-h5);
  line-height: var(--lh-h5);
  font-weight: 600;
  color: var(--c-deepblue);
  margin-bottom: 16px;
}

p,
.text-p {
  font-size: var(--fs-p);
  line-height: var(--lh-p);
  font-weight: 400;
  color: var(--c-text);
  margin-bottom: 16px;
}

strong{
  font-weight: 700;
}

@media (max-width: 1200px) {
  :root {
    --cont-width: 960px;

    --fs-h1: 3rem;      /* 48 */
    --lh-h1: 4.5rem;    /* 72 */

    --fs-h2: 2.5rem;    /* 40 */
    --lh-h2: 3.5rem;    /* 56 */

    --fs-h3: 1.75rem;   /* 28 */
    --lh-h3: 2.5rem;    /* 40 */
  }
}


@media (max-width: 576px) {
  :root {
    --cont-width: 500px;

    --fs-h1: 2.25rem;   /* 36 */
    --lh-h1: 3.75rem;   /* 60 */

    --fs-h2: 2rem;      /* 32 */
    --lh-h2: 3rem;      /* 48 */

    --fs-h3: 1.5rem;    /* 24 */
    --lh-h3: 2.25rem;   /* 36 */

    --fs-h4: 1.25rem;   /* 20 */
    --lh-h4: 1.875rem;  /* 30 */

    --fs-h5: 1.125rem;  /* 18 */
    --lh-h5: 1.75rem;   /* 28 */

    --fs-p: 1rem;       /* 16 */
    --lh-p: 1.5rem;     /* 24 */
  }
}

.margin-40{
  margin-bottom: 40px;
}
.margin-80{
  margin-bottom: 80px;
}
.margin-120{
  margin-bottom: 120px;
}
.margin-160{
  margin-bottom: 160px;
}

@media(max-width: 1200px){
  .margin-40{
    margin-bottom: 20px;
  }
  .margin-80{
    margin-bottom: 40px;
  }
  .margin-120{
    margin-bottom: 60px;
  }
  .margin-160{
    margin-bottom: 80px;
  }
}

ul.wp-block-list,
ol.wp-block-list {
  margin: 0 0 16px;
  padding: 0;
}

ul.wp-block-list:last-child,
ol.wp-block-list:last-child {
  margin-bottom: 0;
}

ul.wp-block-list {
  display: grid;
  gap: 12px;
}

ul.wp-block-list li {
  position: relative;
  padding-left: 20px;
  color: var(--c-text);
}

ul.wp-block-list li::before {
  content: "";
  position: absolute;
  top: 11px;
  left: 0;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: var(--c-orange);
}

ol.wp-block-list {
  display: grid;
  gap: 12px;
  counter-reset: item;
}

ol.wp-block-list li {
  position: relative;
  padding-left: 36px;
  color: var(--c-text);
  counter-increment: item;
}

ol.wp-block-list li::before {
  content: counter(item) ".";
  position: absolute;
  top: 0;
  left: 0;
  color: var(--c-deepblue);
  font-weight: 600;
}

.wp-block-list li > ul,
.wp-block-list li > ol {
  margin-top: 12px;
  margin-bottom: 0;
}

.wp-block-list li:last-child {
  margin-bottom: 0;
}
