@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");

:root {
  --width-full: clamp(24px, 1.961vw + 12.706px, 48px);
  --width-xl: max(clamp(24px, 1.961vw + 12.706px, 48px), calc(50% - 910px));
  --width-l: max(clamp(24px, 1.961vw + 12.706px, 48px), calc(50% - 840px));
  --width-m: max(clamp(24px, 1.961vw + 12.706px, 48px), calc(50% - 600px));
  --width-s: max(clamp(24px, 1.961vw + 12.706px, 48px), calc(50% - 430px));
  --width-xs: max(clamp(24px, 1.961vw + 12.706px, 48px), calc(50% - 325px));

  --padding-xxl: clamp(40px, 13.072vw + -35.294px, 200px);
  --padding-xl: clamp(40px, 9.15vw + -12.706px, 152px);
  --padding-l: clamp(40px, 6.863vw + 0.471px, 124px);
  --padding-m: clamp(40px, 5.229vw + 9.882px, 104px);
  --padding-s: clamp(40px, 2.614vw + 24.941px, 72px);
  --padding-xs: clamp(40px, 0.654vw + 36.235px, 48px);
  --padding-xxs: 24px;

  --gap-xxl: clamp(24px, 6.536vw + -13.647px, 104px);
  --gap-xl: clamp(24px, 4.575vw + -2.353px, 80px);
  --gap-l: clamp(24px, 2.614vw + 8.941px, 56px);
  --gap-m: clamp(24px, 1.307vw + 16.471px, 40px);
  --gap-s: 24px;
  --gap-xs: 16px;
  --gap-xxs: 8px;

  --border-radius-s: 4px;
  --border-radius-m: 8px;
  --border-radius-l: 16px;
  --border-radius-xl: 32px;
  --border-radius-max: 999rem;

  /* colors */
  --error: red;
  --color-white: #fff;
  --color-grey-light: #f5f5f5;
  --color-grey: #3a3a3a;
  --color-grey-dark: #282828;
  --color-black: #000;
  --color-red: #cd2b30;
  --color-red-light: #f6d5d6;
  --color-orange: #fb9242;
  --color-orange-light: #fee2cd;
  --color-yellow: #ffb800;
  --color-gradient: linear-gradient(
    100deg,
    var(--color-red) 14.08%,
    var(--color-orange) 86.44%
  );

  /* tokens */
  --color-headings: var(--color-black);
  --color-text: var(--color-grey);
  --color-link: var(--color-orange);
  --color-link-hover: var(--color-red);
}

body,
textarea,
input,
select {
  font-family: "Poppins", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 18px;
  line-height: 1.5;
  color: var(--color-text);
}

strong,
b {
  font-weight: 700;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
.hero {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
  line-height: 1.1;
  color: var(--color-headings);
}

.hero {
  font-size: clamp(38px, 2.614vw + 22.941px, 70px);
}
h1,
.h1 {
  font-size: clamp(33px, 1.879vw + 22.176px, 56px);
  font-weight: 700;
}
h2,
.h2 {
  font-size: clamp(31px, 1.634vw + 21.588px, 51px);
}
h3,
.h3 {
  font-size: clamp(29px, 1.307vw + 21.471px, 45px);
}
h4,
.h4 {
  font-size: clamp(26px, 1.144vw + 19.412px, 40px);
}
h5,
.h5 {
  font-size: clamp(23px, 0.654vw + 19.235px, 31px);
}
h6,
.h6 {
  font-size: clamp(21px, 0.49vw + 18.176px, 27px);
}

.subheading,
.large-text {
  font-size: clamp(19px, 0.245vw + 17.588px, 22px);
  font-weight: 600;
}
.small-text {
  font-size: 16px;
}

.subheading {
  display: inline-flex;
  gap: calc(var(--gap-s) / 2);
  margin-bottom: calc(var(--gap-s) / 2) !important;
  &::before {
    position: relative;
    top: 5px;
    content: "";
    display: block;
    min-width: 28px;
    min-height: 22px;
    background: top center / contain no-repeat
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='22' fill='none' viewBox='0 0 28 22'%3E%3Cpath fill='%23cd2b30' d='M9.835 8.5523a29.2 29.2 0 0 1 2.0631-1.754C17.9448 2.1189 24.6358.6107 26.8422 3.4308c2.2068 2.8196-.9058 8.8986-6.953 13.579-1.3293 1.0289-2.6902 1.905-4.0276 2.6148.455-.3173.8818-.6055 1.3431-.9418 7.5379-5.4992 9.7568-11.1319 7.6318-13.8477-2.0914-2.6724-8.7579-1.0022-15.001 3.7177z'/%3E%3Cpath fill='%23cd2b30' d='M2.021 20.8065c2.7008.8189 7.2026.5026 12.1332-2.9263 5.5696-3.8734 8.7709-8.973 6.9712-11.6478a2.8 2.8 0 0 0-.3665-.4401c.743.2515 1.3332.6636 1.7231 1.2433 1.792 2.6643-1.3466 7.8263-6.9559 11.6096-5.6285 3.7967-11.292 4.1511-13.505 2.1613'/%3E%3Cpath fill='%23fb9242' d='M17.7168 13.4475a29.2 29.2 0 0 1-2.0632 1.754C9.6069 19.8809 2.916 21.3891.7096 18.569c-2.2069-2.8197.9058-8.8986 6.953-13.579 1.3293-1.029 2.6902-1.905 4.0276-2.6148-.4551.3173-.8819.6055-1.3432.9418C2.8092 8.8162.5903 14.4488 2.7153 17.1646c2.0914 2.6725 8.7579 1.0023 15.001-3.7176z'/%3E%3Cpath fill='%23fb9242' d='M25.5308 1.1933C22.83.3742 18.3282.6906 13.3976 4.1196 7.828 7.993 4.6267 13.0925 6.4264 15.7674a2.8 2.8 0 0 0 .3665.4401c-.743-.2515-1.3332-.6636-1.723-1.2433-1.7921-2.6644 1.3465-7.8263 6.9558-11.6096 5.6285-3.7967 11.292-4.1512 13.5051-2.1613'/%3E%3C/svg%3E");
  }
}

.underline {
  text-decoration: underline;
}

a {
  display: inline-block;
  color: var(--color-link);
  font-weight: 700;
  transition: color 0.4s ease;

  &:is(:hover, :focus) {
    color: var(--color-link-hover);
  }
}

.alignleft {
  float: left;
  margin-right: 20px;
}
.alignright {
  float: right;
  margin-left: 20px;
}
.aligncenter {
  margin: auto;
  text-align: center;
  display: block;
}

img {
  max-width: 100%;
  height: auto;
}
div.wp-caption {
  max-width: 100%;
  display: inline-block;
}
p.wp-caption-text {
  background-color: #f7f7f7;
  color: #808080;
  padding: 16px 25px;
  font-size: 18px;
  font-style: italic;
}

/* buttons */
.button_container {
  display: inline-flex;
  flex-wrap: wrap;
  gap: var(--gap-xxs) calc(var(--gap-s) / 2);
}
.button {
  --color-text: var(--color-white);
  --color-link: var(--color-white);
  display: inline-block;
  width: 100%;
  padding: var(--gap-xs) calc(var(--gap-xs) * 2);
  text-transform: uppercase;
  text-decoration: none;
  text-align: center;
  font-weight: 500;
  color: var(--color-text);
  background: var(--color-gradient);
  background-size: 200% 100%;
  background-position: 50% 50%;
  border: 1px solid transparent;
  border-radius: var(--border-radius-max);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  cursor: pointer;
  transition:
    background 0.4s ease,
    border-color 0.4s ease,
    color 0.4s ease;

  &:is(:hover, :focus) {
    --color-link-hover: var(--color-white);
    background-position: 0% 50%;
  }

  &:is(.red, .grey_dark, .grey_dark.outline) {
    background-size: 100% 100%;
  }

  &.red {
    background: var(--color-red);
    border-color: var(--color-red);

    &:is(:hover, :focus) {
      background: var(--color-orange);
      border-color: var(--color-orange);
    }
  }

  &.grey_dark {
    background: var(--color-grey-dark);
    border-color: var(--color-grey-dark);

    &:is(:hover, :focus) {
      background: var(--color-black);
      border-color: var(--color-black);
    }
  }

  &.grey_dark.outline {
    background: hsl(from var(--color-grey-dark) h s l / 0);
    border-color: var(--color-grey-dark);
    color: var(--color-grey-dark);

    &:is(:hover, :focus) {
      background: hsl(from var(--color-black) h s l / 1);
      border-color: var(--color-black);
      color: var(--color-white);
    }
  }

  /* responsive */
  @media (width >= 576px) {
    width: auto;
  }
}

img {
  display: block;
}

input[type="search"] {
  -webkit-appearance: none;
}

.mce-content-body a.button[data-mce-selected] {
  padding: 8px 20px;
  margin: 0;
  box-shadow: none;
  border-radius: 0;
}

.mce-content-body a.button.white {
  background: #ddd !important;
}

/* bullet points */
/* default */
.wp_content {
  ul,
  ol {
    li {
      list-style: none;
      position: relative;
      isolation: isolate;
      margin-bottom: calc(var(--gap-s) / 2);

      &::before {
        display: inline-block;
        position: absolute;
        left: 0;
      }

      &:last-child {
        margin-bottom: 0;
      }
    }
  }

  ul {
    li {
      padding-left: 20px;

      &::before {
        content: "";
        top: var(--gap-xxs);
        width: var(--gap-xxs);
        height: var(--gap-xxs);
        border-radius: var(--border-radius-max);
        background-color: var(--color-text);
      }
    }

    /* check ul */
    &.check_ul {
      li {
        padding-left: 39px;

        &::before {
          top: 3px;
          width: 27px;
          height: 20px;
          background: center / contain no-repeat
            url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='27' height='20' fill='none' viewBox='0 0 27 20'%3E%3Cpath fill='%23cd2b30' d='m9 20-9-8.5106 3.15-2.9788L9 14.0426 23.85 0 27 2.9787z'/%3E%3C/svg%3E");
        }
      }
    }

    /* logo ul */
    &.logo_ul {
      li {
        padding-left: 40px;

        &::before {
          top: 2px;
          width: 28px;
          height: 22px;
          background: center / contain no-repeat
            url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='22' fill='none' viewBox='0 0 28 22'%3E%3Cpath fill='%23cd2b30' d='M9.835 8.5525a29.2 29.2 0 0 1 2.0631-1.754C17.9448 2.1191 24.6358.611 26.8422 3.4311c2.2068 2.8196-.9058 8.8986-6.953 13.5789-1.3293 1.029-2.6902 1.905-4.0276 2.6148.455-.3173.8818-.6055 1.3431-.9418 7.5379-5.4992 9.7568-11.1318 7.6318-13.8476C22.7451 2.163 16.0786 3.833 9.8355 8.553z'/%3E%3Cpath fill='%23cd2b30' d='M2.021 20.8068c2.7008.8188 7.2026.5025 12.1332-2.9264 5.5696-3.8734 8.7709-8.973 6.9712-11.6478a2.8 2.8 0 0 0-.3665-.4401c.743.2515 1.3332.6636 1.7231 1.2433 1.792 2.6644-1.3466 7.8263-6.9559 11.6097-5.6285 3.7966-11.292 4.1511-13.505 2.1613'/%3E%3Cpath fill='%23fb9242' d='M17.7168 13.4477a29.2 29.2 0 0 1-2.0632 1.754C9.6069 19.8811 2.916 21.3893.7096 18.5691c-2.2069-2.8196.9058-8.8986 6.953-13.579 1.3293-1.0289 2.6902-1.905 4.0276-2.6147-.4551.3172-.8819.6054-1.3432.9418C2.8092 8.8164.5903 14.449 2.7153 17.1648c2.0914 2.6724 8.7579 1.0023 15.001-3.7176z'/%3E%3Cpath fill='%23fb9242' d='M25.5303 1.1935c-2.7008-.819-7.2026-.5026-12.1332 2.9263-5.5696 3.8734-8.7709 8.9729-6.9712 11.6478a2.8 2.8 0 0 0 .3665.4401c-.743-.2515-1.3331-.6636-1.723-1.2433-1.792-2.6643 1.3465-7.8263 6.9558-11.6096C17.6537-.442 23.3172-.7963 25.5303 1.1935'/%3E%3C/svg%3E");
        }
      }
    }
  }

  ol {
    li {
      counter-increment: ordered-list-item;
      padding-left: 28px;

      &::before {
        content: counter(ordered-list-item) ".";
        color: var(--color-text);
      }
    }

    &:has(li:nth-child(10)) {
      li {
        padding-left: 39px;
      }
    }

    &:has(li:nth-child(100)) {
      li {
        padding-left: 48px;
      }
    }
  }
}

.mce-content-body span[style="color: #ffffff;"] {
  color: #ddd !important;
}

@media (min-width: 451px) {
  .button:last-child {
    margin-right: 0;
  }
}

@media (max-width: 450px) {
  .button {
    min-width: 100%;
    box-sizing: border-box;
    margin: 0 0 1em 0;
    text-align: center;
  }
  .button:last-child {
    margin-bottom: 0;
  }
}

.contact_us_content,
.emergency_contact_us_content {
  a {
    --color-link: var(--color-text);
    text-decoration: none;
    display: flex;
    flex-flow: flow wrap;
    gap: var(--gap-xs);
    &::before {
      content: "";
      display: block;
      min-width: 24px;
      aspect-ratio: 1;
      color: var(--color-red);
      background-color: currentColor;
      transition: color 0.4s ease;
    }
    &:hover {
      --color-link-hover: var(--color-text);
      &::before {
        color: var(--color-orange);
      }
    }
    &[href^="tel:"] {
      &::before {
        mask: center / contain no-repeat
          url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' viewBox='0 0 24 24'%3E%3Cpath stroke='currentColor' stroke-width='2' d='M7.3203 3.0635c-.5773-.7697-1.6213-1.019-2.4844-.5938l-1.7197.8477A2 2 0 0 0 2 5.1114v.328C2 14.5718 9.4284 22 18.5605 22h.3282a2.001 2.001 0 0 0 1.7949-1.1162l.8467-1.7197c.4251-.8631.1759-1.9072-.5938-2.4844l-3.164-2.3731a2.001 2.001 0 0 0-2.4004 0l-1.5967 1.1973a5.34 5.34 0 0 1-3.7178-1.5625 5.338 5.338 0 0 1-1.5615-3.7187L9.6924 8.627a1.999 1.999 0 0 0 0-2.3995z'/%3E%3C/svg%3E");
      }
    }
    &[href^="mailto:"] {
      &::before {
        mask: center / contain no-repeat
          url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' viewBox='0 0 24 24'%3E%3Crect width='22' height='16' x='1' y='4' stroke='currentColor' stroke-width='2' rx='1'/%3E%3Cpath stroke='currentColor' stroke-linejoin='round' stroke-width='2' d='M.75 3.75 12 12l11.25-8.25'/%3E%3Cpath stroke='currentColor' stroke-linecap='round' stroke-width='2' d='m1.5 19.5 6-6M22.5 19.5l-6-6'/%3E%3C/svg%3E");
      }
    }
  }
}

.emergency_contact_us_content {
  a {
    &[href^="tel:"] {
      &::before {
        min-width: 54px;
        mask: center / contain no-repeat
          url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='54' height='54' fill='none' viewBox='0 0 54 54'%3E%3Cpath stroke='%23cd2b30' stroke-width='2' d='M14.8486 6.8135c-.5772-.7698-1.6212-1.019-2.4843-.5938l-5.498 2.709a2 2 0 0 0-1.1163 1.794v1.5166C5.75 32.0964 21.9037 48.25 41.7607 48.25h1.5176a2 2 0 0 0 1.7266-.9912l.0674-.125 2.708-5.4981c.4251-.8629.1756-1.906-.5938-2.4834l-8.6992-6.5244a2 2 0 0 0-2.3994 0l-4.6797 3.5098h-.2969a13.265 13.265 0 0 1-9.3642-3.8848 13.266 13.266 0 0 1-3.8858-9.3642v-.2979l3.5098-4.6797a1.9995 1.9995 0 0 0 0-2.3994z'/%3E%3C/svg%3E");
      }
    }
  }
}
