@font-face {
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/montserrat-latin-400-normal.woff2") format("woff2");
}

@font-face {
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/montserrat-latin-500-normal.woff2") format("woff2");
}

@font-face {
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/montserrat-latin-600-normal.woff2") format("woff2");
}

@font-face {
  font-family: "Montserrat";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/montserrat-latin-400-italic.woff2") format("woff2");
}

:root {
  --typography-family-heading: "Montserrat", system-ui, sans-serif;
  --typography-family-main: "Montserrat", system-ui, sans-serif;
  --typography-family-paragraph: var(--typography-family-main);

  --color-sienna: #015a75;
  --color-sienna-deep: #01465c;
  --color-canadian-red: #456b78;
  --color-paper: #fffaf2;
  --color-paper-tint: #f7f1e7;
  --color-paper-deep: #efe4d3;
  --color-rule: #d8c6aa;
  --color-ink: #16191d;
  --color-ink-soft: #4f555b;
  --color-surface-container: #f3eadc;
  --color-tertiary-dark: #304f59;
  --color-tertiary-container: #e5eef0;

  --color-primary: #015a75;
  --color-on-primary: #ffffff;
  --color-primary-fixed: #efe4d3;
  --color-primary-fixed-dim: #fffaf2;
  --color-secondary: #01465c;
  --color-tertiary: #456b78;
  --color-surface: #fffaf2;
  --color-surface-container-low: #f7f1e7;
  --color-surface-container-high: #efe4d3;
  --color-surface-container-highest: #d8c6aa;
  --color-on-surface: #16191d;
  --color-accent: #015a75;
  --color-accent-hover: #01465c;
  --color-heading: #16191d;
  --color-main: #16191d;
  --color-paragraph: #4f555b;
  --color-link-text: #015a75;
  --color-link-text-hover: #01465c;

  --color-current: #015a75;
  --color-current-dropdown: #015a75;
  --color-main-level: #16191d;
  --color-hover-main-level: #015a75;
  --color-sub-menu: #16191d;
  --color-hover-sub-menu: #015a75;
  --color-background-sub-menu: #fffaf2;
  --color-background-nav-mobile-header: #fffaf2;
  --color-background-nav-mobile-header-active: #f7f1e7;
  --color-background-menu-items: #fffaf2;
  --color-background-menu-items-active: #efe4d3;
  --color-separator-nav-mobile: #d8c6aa;
  --color-current-menu-item: #015a75;
  --color-dropdown-toggle-mobile: #015a75;
  --color-main-level-menu-item-mobile: #16191d;
  --color-main-level-menu-item-hover-focus-mobile: #015a75;
  --color-sub-menu-mobile: #16191d;
  --hamburger-color: #015a75;
  --hamburger-color-active: #01465c;
}

body {
  background: #fffaf2;
}

.block-cta-banner {
  overflow: hidden;
  padding-block: 2rem;
}

.cta-banner {
  position: relative;
  isolation: isolate;
  overflow: visible;
  padding: clamp(2rem, 5vw, 4.5rem);
  border: 2px solid #015a75;
  border-radius: 1.25rem;
  background-color: #fffaf2;
  background-image:
    repeating-linear-gradient(35deg, rgba(216, 198, 170, 0.22) 0 1px, transparent 1px 8px),
    repeating-linear-gradient(145deg, rgba(247, 241, 231, 0.8) 0 2px, transparent 2px 10px);
  box-shadow: 0 1rem 2.5rem rgba(22, 25, 29, 0.08);
  color: #16191d;
  text-align: center;
}

.cta-banner::after {
  position: absolute;
  z-index: -1;
  inset: 0.75rem;
  border: 1px solid #d8c6aa;
  border-radius: 0.8rem;
  content: "";
  pointer-events: none;
}

.cta-banner-heading {
  color: #16191d;
}

.cta-banner-description {
  max-width: 44rem;
  margin-inline: auto;
  color: #4f555b;
}

.cta-banner-buttons {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.85rem;
  margin-top: 1.5rem;
}

.cta-banner-button {
  display: inline-flex;
  min-height: 3rem;
  align-items: center;
  justify-content: center;
  padding: 0.8rem 1.35rem;
  border: 2px solid #015a75;
  border-radius: 999px;
  font-weight: 600;
  text-decoration: none;
  transition: background-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.cta-banner-button-primary {
  background: #015a75;
  color: #ffffff;
}

.cta-banner-button-primary:hover,
.cta-banner-button-primary:focus-visible {
  border-color: #01465c;
  background: #01465c;
  color: #ffffff;
  transform: translateY(-1px);
}

.cta-banner-button-secondary {
  background: #fffaf2;
  color: #015a75;
}

.cta-banner-button-secondary:hover,
.cta-banner-button-secondary:focus-visible {
  background: #efe4d3;
  color: #01465c;
  transform: translateY(-1px);
}

.cta-banner-fringe {
  position: absolute;
  right: 1.5rem;
  left: 1.5rem;
  height: 0.9rem;
  background: repeating-linear-gradient(90deg, #d8c6aa 0 2px, transparent 2px 7px);
  pointer-events: none;
}

.cta-banner-fringe-top {
  top: -0.9rem;
}

.cta-banner-fringe-bottom {
  bottom: -0.9rem;
}

.process-step + .process-step::before,
.process-step + .process-step:before {
  content: none !important;
  display: none !important;
}

@media (max-width: 600px) {
  .cta-banner {
    padding: 2rem 1.25rem;
    border-radius: 1rem;
  }

  .cta-banner-buttons {
    flex-direction: column;
  }

  .cta-banner-button {
    width: 100%;
  }
}