body,h2,h3,h4,h5,h6,p {font-family: 'Montserrat', sans-serif;}
/* Base global styles */
html {
    box-sizing: border-box;
}
/* Ensure the box-sizing model is consistent */
*, *:before, *:after {
    box-sizing: inherit; /* Inherits 'border-box' from html */
}
/* Base styles */
html, body {
    font-family: 'Montserrat', sans-serif;
    line-height: 1.5;
    box-sizing: border-box;
    height: 100%;
}
/* Optional: Hide scrollbars but be cautious about accessibility */
::-webkit-scrollbar {
    width: 0px;
    background: transparent; /* Make scrollbar transparent */
}
/* Mobile-specific styles */
@media only screen and (max-width: 550px) {
    body {
        height: calc(var(--vh, 1vh) * 100); /* Mobile viewport adjustment */
    }
}

html {
  box-sizing: border-box;
  /* stops iOS inflating text when the device rotates to landscape */
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

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

body {
  margin: 0;
  min-height: 100vh;
  min-height: 100dvh; /* modern replacement for the --vh JS hack; see note 4 */
  font-family: var(--font-sans);
  font-size: var(--fs-body);
  line-height: var(--lh-base);
  /* stops the whole PWA rubber-banding when a scroll hits the end */
  overscroll-behavior-y: none;
}
p{
  font-size: 16.5px;
  line-height: 1.50em;
}
h1{
  font-size: 38px;
  font-family:'Montserrat';
  line-height: 1.48em;
}
h2{
  font-size: 32px;
  line-height: 1.48em;
}
h3{
  font-size: 28px;
  line-height: 1.48em;
}
h4{
  font-size: 24px;
  line-height: 1.48em;
}
h5{
  font-size: 21px;
  line-height:1.50em;
}
h6{
  font-size: 18px;
  line-height:1.50em;
}
a{
    font-size: 28px;
    font-family: 'Montserrat';
    line-height: 1.50em;
}a, a:hover, a:active{
    text-decoration:none !important;
}
@media only screen and (max-width: 992px) {
    p{
        font-size: 16px;
    }
    a{
        font-size: 24px;
    }
    h1{
        font-size: 30px;
    }
    h2{
        font-size: 26px;
    }
    h3{
        font-size: 24px;
    }
    h4{
        font-size: 22px;
    }
    h5{
        font-size: 20px;
    }
    h6{
        font-size: 17px;
    }
}
@media only screen and (max-width: 767px) {
    p{
        font-size: 14px;
    }
    a{
        font-size: 21.8px;
    }
    h1{
        font-size: 28px;
    }
    h2{
        font-size: 24.8px;
    }
    h3{
        font-size: 21.8px;
    }
    h4{
        font-size: 20px;
    }
    h5{
        font-size: 18px;
    }
    h6{
        font-size: 16px;
    }
}
@media only screen and (max-width: 550px) {
    p{
        font-size: 12.1px;
    }
    a{
        font-size: 20px;
    }
    h1{
        font-size: 26px;
    }
    h2{
        font-size: 23px;
    }
    h3{
        font-size: 20px;
    }
    h4{
        font-size: 18px;
    }
    h5{
        font-size: 16px;
    }
    h6{
        font-size: 14.6px;
    }
}
@media only screen and (max-width: 410px) {
    p{
        font-size: 12.0px;
    }
    a{
        font-size: 19.2px;
    }
    h1{
        font-size: 25.8px;
    }
    h2{
        font-size: 21.8px;
    }
    h3{
        font-size: 19.2px;
    }
    h4{
        font-size: 17.0px;
    }
    h5{
        font-size: 15px;
    }
    h6{
        font-size: 13.4px;
    }
}
@media only screen and (max-width: 320px) {
    p{
        font-size: 11.8px;
    }
    a{
        font-size: 18px;
    }
    h1{
        font-size: 24px;
    }
    h2{
        font-size: 20px;
    }
    h3{
        font-size: 18px;
    }
    h4{
        font-size: 16.0px;
    }
    h5{
        font-size: 13.6px;
    }
    h6{
        font-size: 12.4px;
    }
}
@media only screen and (max-width: 280px) {
    p{
        font-size: 11.6px;
    }
    a{
        font-size: 17.2px;
    }
    h1{
        font-size: 21.8px;
    }
    h2{
        font-size: 19.2px;
    }
    h3{
        font-size: 17.2px;
    }
    h4{
        font-size: 15.2px;
    }
    h5{
        font-size: 12.8px;
    }
    h6{
        font-size: 11.8px;
    }

img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
}
a,
button,
input,
select,
textarea,
summary,
[role="button"],
[tabindex] {
  /* removes the grey/black flash box on iOS Safari and Android Chrome */
  -webkit-tap-highlight-color: transparent;
}

a,
button,
[role="button"] {
  /* removes the legacy 300ms tap delay and double-tap-to-zoom on controls */
  touch-action: manipulation;
}

/* no ring for mouse/touch... */
:focus:not(:focus-visible) {
  outline: none;
}

/* Bootstrap also puts the same ring on .btn and on checkbox/radio/file
   inputs. Same treatment, same reasoning. */
.btn:focus:not(:focus-visible),
.btn.focus:not(:focus-visible),
.btn:active:focus:not(:focus-visible),
input[type="checkbox"]:focus:not(:focus-visible),
input[type="radio"]:focus:not(:focus-visible),
input[type="file"]:focus:not(:focus-visible) {
  outline: none;
}

/* ...but a clear one for keyboard navigation. Never delete this block. */
:focus-visible {
  outline: var(--focus-ring);
  outline-offset: var(--focus-offset);
  border-radius: 8px;
}