/*!
Theme Name: Kimia
Theme URI: #
Author: #
Author URI: #
Description: Custom WP theme for Kimia
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: kimia
Tags: Custom build WP Theme
*/

/* =========================================
   Fonts
   ========================================= */

@font-face {
  font-family: "ABCArizonaFlare";
  src:
    url("./fonts/ABCArizonaFlare-Light.woff2") format("woff2"),
    url("./fonts/ABCArizonaFlare-Light.woff") format("woff");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

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

@font-face {
  font-family: "OnsiteStandard";
  src:
    url("./fonts/OnsiteStandard-Light.woff2") format("woff2"),
    url("./fonts/OnsiteStandard-Light.woff") format("woff");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "OnsiteStandard";
  src:
    url("./fonts/OnsiteStandard-LightItalic.woff2") format("woff2"),
    url("./fonts/OnsiteStandard-LightItalic.woff") format("woff");
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}

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

/* =========================================
   Typography scale
   ========================================= */

:root {
  --fs-h1: 90px;
  --fs-h2: 72px;
  --fs-h3: 56px;
  --fs-h4: 40px;
  --fs-h5: 36px;
  --fs-subhead: 16px;
  --fs-body-1: 24px;
  --fs-body-2: 20px;
  --fs-onsite-s: 20px;
  --fs-onsite-ext: 16px;
  --fs-arizona-20: 20px;
  --fs-onsite-96: 96px;
  --fs-arizona-42: 42px;
  --fs-onsite-24: 24px;
  --fs-onsite-18: 18px;
  --Calm-Orange: rgba(255, 192, 139, 0.38);
  --fs-38: 38px;
  --fs-22: 22px;
  --fs-64: 64px;
  --fs-30: 30px;
  --sp-60: 60px;
  --sp-80: 80px;
  --sp-90: 90px;
  --sp-120: 120px;
  --sp-160: 160px;
  --sp-240: 240px;
  --sp-445: 445px;
}

@keyframes svgFadeIn {
  to {
    opacity: 1;
  }
}

.svg-plus {
  opacity: 0;
}

.purple-map.is-visible .svg-plus {
  animation: svgFadeIn 2s ease forwards;
}
.purple-map.is-visible .svg-plus--1 {
  animation-delay: 0.2s;
}
.purple-map.is-visible .svg-plus--2 {
  animation-delay: 0.4s;
}
.purple-map.is-visible .svg-plus--3 {
  animation-delay: 0.6s;
}
.purple-map.is-visible .svg-plus--4 {
  animation-delay: 0.8s;
}
.purple-map.is-visible .svg-plus--5 {
  animation-delay: 1s;
}
.purple-map.is-visible .svg-plus--6 {
  animation-delay: 1.2s;
}

html {
  scroll-behavior: auto;
}

html.lenis,
html.lenis body {
  height: auto;
}

.lenis.lenis-smooth {
  scroll-behavior: auto !important;
}

body {
  color: #35002c;
  font-weight: 300;
  overscroll-behavior: none;
}
/* =========================================
   Typography
   ========================================= */

h1,
.h1 {
  font-family: "ABCArizonaFlare", serif;
  font-size: var(--fs-h1);
  line-height: 1.11;
}

h2,
.h2 {
  font-family: "ABCArizonaFlare", serif;
  font-size: var(--fs-h2);
  line-height: 1.18;
}

h3,
.h3 {
  font-family: "ABCArizonaFlare", serif;
  font-size: var(--fs-h3);
  line-height: 1.18;
}

h4,
.h4 {
  font-family: "ABCArizonaFlare", serif;
  font-size: var(--fs-h4);
  line-height: 1.45;
}

h5,
.h5 {
  font-family: "ABCArizonaFlare", serif;
  font-size: var(--fs-h5);
  line-height: 1.33;
}
.mt-60 {
  margin-top: var(--sp-60);
}
.mt-80 {
  margin-top: var(--sp-80);
}

.mt-160 {
  margin-top: var(--sp-160);
}

.mt-120 {
  margin-top: var(--sp-120);
}

.pb-240 {
  padding-bottom: var(--sp-240);
}
.mb-60 {
  margin-bottom: var(--sp-60);
}
.mb-90 {
  margin-bottom: var(--sp-90);
}
.mb-120 {
  margin-bottom: var(--sp-120);
}

.accordion-nav span {
  color: #35002c;
  line-height: 1.5;
  opacity: 0.45;
}
.accordion-nav span.is-active,
.accordion-nav span:hover,
h3.active {
  opacity: 1;
  text-decoration-line: underline;
  text-decoration-style: solid;
  text-decoration-skip-ink: auto;
  text-decoration-color: #d9aded;
  text-decoration-thickness: auto;
  text-underline-offset: 50%;
  text-underline-position: from-font;
}

.my-240 {
  margin-top: var(--sp-240);
  margin-bottom: var(--sp-240);
}
.py-240 {
  padding: var(--sp-240);
}

.subhead {
  font-size: var(--fs-subhead);
  line-height: 1;
}

.purple-gradient {
  background: linear-gradient(180deg, #fff 16.84%, rgba(217, 173, 237, 0.26) 34.53%, rgba(254, 193, 139, 0.44) 58%, #fff 75%);
  background: linear-gradient(180deg, #fff 18.84%, rgba(217, 173, 237, 0.36) 40.53%, rgba(254, 193, 139, 0.39) 55.44%, #fff 75.96%);
}
footer svg {
  max-width: 100%;
  height: auto;
}
.purple-map {
  top: -9%;
  width: 65vw;
  height: auto;
}

.svg-plus {
  cursor: pointer;
}

.map-tooltip {
  position: fixed;
  background: #35002c;
  color: #fff;
  font-family: "OnsiteExtended", sans-serif;
  font-size: 12px;
  letter-spacing: 0.05em;
  padding: 8px 14px;
  pointer-events: none;
  white-space: nowrap;
  opacity: 0;
  transform: translateY(4px);
  transition: opacity 0.2s ease, transform 0.2s ease;
  z-index: 200;
}

.map-tooltip.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.pl-9p {
  padding-left: 9%;
}

.body-1 {
  font-size: var(--fs-body-1);
  line-height: 1.5;
}

.pb-445 {
  padding-bottom: var(--sp-445);
}

.body-2 {
  font-size: var(--fs-body-2);
  line-height: 1.51;
}

.onsite-s {
  font-family: "OnsiteStandard", sans-serif;
  font-weight: 300;
  font-size: var(--fs-onsite-s);
  line-height: 1.3;
}

.onsite-ext {
  font-family: "OnsiteExtended", sans-serif;
  font-weight: 400;
  font-size: var(--fs-onsite-ext);
  line-height: 1;
}

.arizona-20 {
  font-family: "ABCArizonaFlare", serif;
  font-weight: 300;
  font-size: var(--fs-arizona-20);
  line-height: 1.3;
}

.onsite-96 {
  font-family: "OnsiteStandard", sans-serif;
  font-weight: 400;
  font-size: var(--fs-onsite-96);
  line-height: 1.05;
}

.arizona-42 {
  font-family: "ABCArizonaFlare", serif;
  font-weight: 300;
  font-size: var(--fs-arizona-42);
  line-height: 1.35;
}

.onsite-24 {
  font-family: "OnsiteStandard", sans-serif;
  font-weight: 300;
  font-size: var(--fs-onsite-24);
  line-height: 1.4;
}

.button {
  padding: 22px 86px 21px 26px;
  display: inline-block;
  background-repeat: no-repeat;
  text-decoration: none;
  background-size: contain;
  font-size: var(--fs-onsite-ext);
  background-position: center;
  font-family: "OnsiteExtended";
  background-image: url("data:image/svg+xml,%3Csvg width='233' height='60' viewBox='0 0 233 60' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M165.512 54.0043C164.239 57.598 160.84 60 157.028 60H9C4.02944 60 0 55.9706 0 51V9C0 4.02944 4.02944 0 9 0H171.901C178.115 0 182.459 6.14709 180.385 12.0043L165.512 54.0043ZM232.338 51C232.338 55.9706 228.308 60 223.338 60H182.489C176.275 60 171.931 53.8529 174.005 47.9957L188.878 5.99575C190.15 2.40203 193.549 0 197.362 0H223.338C228.308 0 232.338 4.02944 232.338 9V51Z' fill='%23F4E4DB'/%3E%3Cpath d='M232.339 51C232.339 55.9706 228.31 60 223.339 60H182.489C176.275 60 171.931 53.8529 174.005 47.9957L188.878 5.99575C190.151 2.40203 193.55 0 197.362 0H223.339C228.31 0 232.339 4.02944 232.339 9V51Z' fill='%23F4E4DB'/%3E%3Cpath d='M206.036 35.4395V31.8715H202.42V30.4635H206.036V26.9115H207.508V30.4635H210.868V31.8715H207.508V35.4395H206.036Z' fill='%2335002C'/%3E%3C/svg%3E%0A");
  transition: 0.6s ease-in-out;
}

.button:hover {
  background-image: url("data:image/svg+xml,%3Csvg width='233' height='60' viewBox='0 0 233 60' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M165.512 54.0043C164.239 57.598 160.84 60 157.028 60H9C4.02944 60 0 55.9706 0 51V9C0 4.02944 4.02944 0 9 0H171.901C178.115 0 182.459 6.14709 180.385 12.0043L165.512 54.0043ZM232.338 51C232.338 55.9706 228.308 60 223.338 60H182.489C176.275 60 171.931 53.8529 174.005 47.9957L188.878 5.99575C190.15 2.40203 193.549 0 197.362 0H223.338C228.308 0 232.338 4.02944 232.338 9V51Z' fill='%23F4E4DB'/%3E%3Cpath d='M232.339 51C232.339 55.9706 228.31 60 223.339 60H182.489C176.275 60 171.931 53.8529 174.005 47.9957L188.878 5.99575C190.151 2.40203 193.55 0 197.362 0H223.339C228.31 0 232.339 4.02944 232.339 9V51Z' fill='%23D9ADED'/%3E%3Cpath d='M206.036 35.4395V31.8715H202.42V30.4635H206.036V26.9115H207.508V30.4635H210.868V31.8715H207.508V35.4395H206.036Z' fill='%2335002C'/%3E%3C/svg%3E%0A");
}

.find-out-btn {
  padding: 20px 80px 20px 18px;
  display: inline-block;
  background-repeat: no-repeat;
  text-decoration: none;
  font-size: var(--fs-onsite-ext);
  background-size: contain;
  background-position: center;
  font-family: "OnsiteExtended";
  transition: 0.6s ease-in-out;
  background-image: url("data:image/svg+xml,%3Csvg width='262' height='61' viewBox='0 0 262 61' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M192.896 54.0716C191.624 57.6653 188.225 60.0673 184.413 60.0673L9 60.0673C4.02944 60.0673 0 56.0378 0 51.0673V9.06628C0 4.09572 4.02944 0.0662842 9 0.0662842H199.286C205.5 0.0662842 209.844 6.21344 207.77 12.0706L192.896 54.0716Z' fill='white'/%3E%3Cpath d='M261.879 51.001C261.879 55.9715 257.85 60.001 252.879 60.001H212.029C205.815 60.001 201.471 53.8539 203.545 47.9968L218.418 5.99579C219.691 2.40205 223.09 0 226.902 0H252.879C257.85 0 261.879 4.02944 261.879 9V51.001Z' fill='white'/%3E%3Cpath d='M235.272 35.5058V31.9378H231.656V30.5298H235.272V26.9778H236.744V30.5298H240.104V31.9378H236.744V35.5058H235.272Z' fill='%2335002C'/%3E%3C/svg%3E%0A");
}

.find-out-btn:hover {
  background-image: url("data:image/svg+xml,%3Csvg width='262' height='61' viewBox='0 0 262 61' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M192.896 54.0716C191.624 57.6653 188.225 60.0673 184.413 60.0673L9 60.0673C4.02944 60.0673 0 56.0378 0 51.0673V9.06628C0 4.09572 4.02944 0.0662842 9 0.0662842H199.286C205.5 0.0662842 209.844 6.21344 207.77 12.0706L192.896 54.0716Z' fill='white'/%3E%3Cpath d='M261.879 51.001C261.879 55.9715 257.85 60.001 252.879 60.001H212.029C205.815 60.001 201.471 53.8539 203.545 47.9968L218.418 5.99579C219.691 2.40205 223.09 0 226.902 0H252.879C257.85 0 261.879 4.02944 261.879 9V51.001Z' fill='%23D9ADED'/%3E%3Cpath d='M235.272 35.5058V31.9378H231.656V30.5298H235.272V26.9778H236.744V30.5298H240.104V31.9378H236.744V35.5058H235.272Z' fill='%2335002C'/%3E%3C/svg%3E%0A");
}

@media screen and (min-width: 1400px) {
  .container {
    max-width: 1580px;
  }
}

.px-9p {
  padding-left: 9%;
  padding-right: 9%;
}

.fs-64 {
  font-size: var(--fs-64);
}

.fs-38 {
  font-size: var(--fs-38);
  line-height: 1.4;
  font-family: "ABCArizonaFlare";
}

.button,
.find-out-btn {
  position: relative;
}
/* 
.button::after,
.find-out-btn::after {
  content: "";
  position: absolute;
  bottom: 18px;
  left: 18px;
  width: calc(100% - 98px);
  height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.6s ease;
}

.button:hover::after,
.find-out-btn:hover::after {
  transform: scaleX(1);
} */

.topbar {
  background: linear-gradient(90deg, rgba(217, 173, 237, 0.57) 0%, rgba(255, 192, 139, 0.54) 49.52%, rgba(254, 240, 146, 0.26) 100%);
  font-size: var(--fs-onsite-18);
  text-align: center;
  padding: 11px 0;
}

.fs-18 {
  font-size: var(--fs-onsite-18);
}

a {
  color: inherit;
}
.screen-reader-text {
  visibility: hidden;
  opacity: 0;
  position: absolute;
}

a {
  text-decoration: none;
}
.topbar a {
  text-decoration: underline;
}
ul li {
  list-style-type: none;
}

ul {
  margin: 0;
  padding: 0;
}

.main-menu {
  padding: 25px 0 50px;
}

.main-menu ul {
  display: flex;
  gap: 60px;
}

.container,
.container-fluid {
  --bs-gutter-x: 3rem;
}

.video-banner {
  position: relative;
  min-height: 80vh;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  overflow: hidden;
  border-radius: 12px;
  margin: 0 25px;
  isolation: isolate;
}

.video-banner__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
  will-change: transform;
}

.video-banner__overlay {
  position: absolute;
  inset: 0;
  border-radius: 12px;
  background: linear-gradient(105deg, rgba(217, 173, 237, 0.38) 12.57%, rgba(227, 191, 212, 0.38) 41.81%, rgba(235, 206, 192, 0.38) 48.75%, var(--Calm-Orange) 73.72%, rgba(254, 240, 146, 0.32) 86.79%);
  mix-blend-mode: multiply;
  z-index: 1;
}

.video-banner__content {
  position: relative;
  z-index: 2;
}

.plus-block {
  position: relative;
}

.left-top-plus {
  position: absolute;
  left: 0;
  top: 0;
}

.plus-in-word {
  position: absolute;
  margin-left: -30px;
  margin-top: -5px;
}

img {
  max-width: 100%;
  height: auto;
}

.rolling-slider {
  overflow: hidden;
  padding: 40px 0;
}

.rolling-slider__track {
  display: flex;
  width: max-content;
  animation: marquee 22s linear infinite;
}

.rolling-slider__track:hover {
  animation-play-state: paused;
}
/* Word-by-word scroll reveal */
.word-reveal__word {
  display: inline-block;
}

.word-reveal__inner {
  display: inline-block;
  opacity: 0.3;
  transition: opacity 0.25s ease;
}

.word-reveal__inner.is-visible {
  opacity: 1;
}

@keyframes marquee {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}
h4.link {
  transition: 0.6s;
  cursor: pointer;
}
h4.link:hover {
  opacity: 1 !important;
}

.rolling-slider__list {
  display: flex;
  align-items: center;
  gap: 60px;
  padding: 0 60px;
  margin: 0;
  list-style: none;
  white-space: nowrap;
}

.rolling-slider__item {
  font-family: "ABCArizonaFlare", serif;
  font-weight: 300;
  font-size: var(--fs-h5);
  line-height: 1;
  color: #35002c;
}

.rolling-slider__sep {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.yellow-gradient {
  background: linear-gradient(180deg, #fff 14.82%, rgba(254, 240, 146, 0.46) 55.14%, #fff 97.35%);
}

.fs-22 {
  font-size: var(--fs-22);
  font-weight: 300;
}
.fs-30 {
  font-size: var(--fs-30);
  font-weight: 300;
}

/* =========================================
   Blog post cards / slider
   ========================================= */

.blog-posts-slider {
  padding: 0 20px;
}

.blog-posts-slider .swiper-slide:first-child {
  margin-left: 9%;
}

.blog-posts-slider .swiper-wrapper {
  align-items: stretch;
}

.blog-posts-slider .swiper-slide {
  width: calc(35% - 30px);
  min-width: 280px;
  height: auto;
}

.blog-posts-slider .swiper-scrollbar {
  height: 9px;
  background: rgba(53, 0, 44, 0.16);
  border-radius: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  margin-top: var(--sp-90);
  display: block;
  position: relative;
  border-radius: 200px;
  max-width: 80vw;
}

.blog-posts-slider .swiper-scrollbar-drag {
  background: rgba(53, 0, 44, 0.2);
  border-radius: 200px;
}

.blog-card {
  height: 100%;
  box-shadow: 3px 10px 24px rgba(0, 0, 0, 0.04);
  display: flex;
  flex-direction: column;
  border-radius: 12px;
}
.blog-card {
  background: #ffffff url(/wp-content/uploads/2026/04/edge2.png);
  background-position: right bottom;
  background-size: 100px;
  background-repeat: no-repeat;
  cursor: pointer;
  transition: 0.6s ease-in-out;
}

.blog-card:hover {
  background-image: url(/wp-content/uploads/2026/04/edge-3.png);
}

.blog-card__img img {
  width: 100%;
  aspect-ratio: 1/1;
  object-fit: cover;
  display: block;
  border-radius: 12px;
}

.blog-card__body {
  padding: 40px 40px 100px;
  flex: 1;
}

.blog-card__img {
  padding: 40px 40px 0;
}

.blog-card__body p {
  margin: 0;
}

.blog-card__footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 30px 40px;
}

.blog-card__plus {
  width: 52px;
  height: 52px;
  background: #f4e4db;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  color: #35002c;
  text-decoration: none;
  flex-shrink: 0;
}
footer {
  background: url("/wp-content/uploads/2026/04/Footer.jpg") center center no-repeat;
  background-size: cover;
}

.img-accordion {
  display: flex;
  height: 640px;
  max-height: 70vh;
  background: white;
}

.img-accordion__panel {
  flex: 1;
  position: relative;
  cursor: pointer;
  transition: flex 0.55s cubic-bezier(0.4, 0, 0.2, 1);
  margin-right: -55px;
}

.img-accordion__panel:last-child {
  margin-right: 0;
}

/* Right panels sit on top so they cover the left panel's overlap area */
.img-accordion__panel:nth-child(1) {
  z-index: 1;
}

.img-accordion__panel:nth-child(2) {
  z-index: 2;
}

.img-accordion__panel:nth-child(3) {
  z-index: 3;
}

.img-accordion__panel:nth-child(4) {
  z-index: 4;
}

/* Diagonal clip-paths — 8px inset, "\" direction, 16px white gap */
.img-accordion__panel:first-child {
  clip-path: polygon(0 0, calc(100% - 63px) 0, calc(100% - 8px) 100%, 0 100%);
}

.img-accordion__panel:not(:first-child):not(:last-child) {
  clip-path: polygon(8px 0, calc(100% - 63px) 0, calc(100% - 8px) 100%, 63px 100%);
}

.img-accordion__panel:last-child {
  clip-path: polygon(8px 0, 100% 0, 100% 100%, 63px 100%);
}

/* Image wrapper handles overflow for the scale effect */
.img-accordion__img {
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.img-accordion__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: transform 0.55s cubic-bezier(0.4, 0, 0.2, 1);
}

/* "+" pill — centered, always visible on collapsed panels */
.img-accordion__plus {
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(255, 255, 255, 0.95);
  border: none;
  border-radius: 6px;
  width: 36px;
  height: 36px;
  font-size: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: #222;
  z-index: 1;
  transition:
    opacity 0.25s ease,
    transform 0.25s ease;
}

/* Label row — fades in on active */
.img-accordion__label {
  position: absolute;
  bottom: 20px;
  left: 20px;
  right: 20px;
  display: flex;
  align-items: center;
  justify-content: end;
  gap: 10px;
  z-index: 1;
  opacity: 0;
  transform: translateY(6px);
  transition:
    opacity 0.3s ease 0.15s,
    transform 0.3s ease 0.15s;
  pointer-events: none;
}

.img-accordion__label span {
  background: rgba(255, 255, 255, 0.95);
  border-radius: 6px;
  padding: 8px 16px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #222;
  white-space: nowrap;
}

.img-accordion__label button {
  flex-shrink: 0;
  background: rgba(255, 255, 255, 0.95);
  border: none;
  border-radius: 6px;
  width: 36px;
  height: 36px;
  font-size: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: #222;
}

/* Nav click states */
.accordion-nav span {
  cursor: pointer;
  transition: opacity 0.25s ease;
}

.accordion-nav.has-active span {
  opacity: 0.4;
}

.accordion-nav.has-active span.is-active {
  opacity: 1;
}

/* Active panel mirrors hover behaviour */
.img-accordion.has-active .img-accordion__panel {
  flex: 0.5;
}

.img-accordion.has-active .img-accordion__panel.is-active {
  flex: 1;
}

.img-accordion__panel.is-active .img-accordion__img img {
  transform: scale(1.05);
}

.img-accordion__panel.is-active .img-accordion__plus {
  opacity: 0;
  transform: translateX(-50%) scale(0.6);
  pointer-events: none;
}

.img-accordion__panel.is-active .img-accordion__label {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

@media screen and (max-width: 1750px) {
  :root {
    --fs-h1: 81px;

    --fs-h2: 65px;
    --fs-h3: 50px;
    --fs-h4: 36px;
    --fs-h5: 32px;
    --fs-subhead: 14px;
    --fs-body-1: 22px;
    --fs-body-2: 18px;
    --fs-onsite-s: 18px;
    --fs-onsite-ext: 14px;
    --fs-arizona-20: 18px;
    --fs-onsite-96: 86px;
    --fs-arizona-42: 38px;
    --fs-onsite-24: 22px;
    --fs-onsite-18: 16px;
    --Calm-Orange: rgba(255, 192, 139, 0.38);
    --fs-38: 34px;
    --fs-22: 20px;
    --fs-64: 58px;
    --fs-30: 27px;
    --sp-60: 54px;
    --sp-80: 72px;
    --sp-90: 81px;
    --sp-120: 108px;
    --sp-160: 144px;
    --sp-240: 216px;
    --sp-445: 401px;
  }

  .px-9p {
    padding-left: 8.1%;
    padding-right: 8.1%;
  }
  .blog-posts-slider .swiper-slide:first-child {
    margin-left: 8.1%;
  }
  .rolling-slider {
    padding: 36px 0;
  }
  .find-out-btn {
    padding: 18px 72px 18px 16px;
  }
  .img-accordion {
    height: 576px;
  }
  .button {
    padding: 20px 77px 19px 23px;
  }
  .main-menu {
    padding: 23px 0 45px;
  }
  .main-menu ul {
    gap: 54px;
  }
  .topbar {
    padding: 10px 0;
  }

  .logo svg {
    max-width: 80%;
    height: auto;
  }
  .blog-card__img {
    padding: 36px 36px 0;
  }
  .blog-card__body {
    padding: 36px 36px 90px;
  }

  .blog-card {
    background-size: 90px;
  }

  .plus-in-word svg {
max-width: 11px;
height: auto;
  }
}

@media screen and (max-width: 1550px) {
  :root {
    --fs-h1: 72px;
    --fs-h2: 58px;
    --fs-h3: 45px;
    --fs-h4: 32px;
    --fs-h5: 29px;
    --fs-subhead: 13px;
    --fs-body-1: 19px;
    --fs-body-2: 16px;
    --fs-onsite-s: 16px;
    --fs-onsite-ext: 13px;
    --fs-arizona-20: 16px;
    --fs-onsite-96: 77px;
    --fs-arizona-42: 34px;
    --fs-onsite-24: 19px;
    --fs-onsite-18: 14px;
    --Calm-Orange: rgba(255, 192, 139, 0.38);
    --fs-38: 30px;
    --fs-22: 18px;
    --fs-64: 51px;
    --fs-30: 24px;
    --sp-60: 48px;
    --sp-80: 64px;
    --sp-90: 72px;
    --sp-120: 96px;
    --sp-160: 128px;
    --sp-240: 192px;
    --sp-445: 356px;
  }

  .px-9p {
    padding-left: 7%;
    padding-right: 7%;
  }
  .blog-posts-slider .swiper-slide:first-child {
    margin-left: 6%;
  }
  .rolling-slider {
    padding: 30px 0;
  }
  .find-out-btn {
    padding: 16px 64px 16px 15px;
  }
  .img-accordion {
    height: 530px;
  }
  .button {
    padding: 18px 70px 17px 21px;
  }
  .main-menu {
    padding: 20px 0 40px;
  }
  .main-menu ul {
    gap: 48px;
  }
  .topbar {
    padding: 9px 0;
  }

  .logo svg {
    max-width: 80%;
    height: auto;
  }
  .blog-card__img {
    padding: 32px 32px 0;
  }
    .plus-in-word svg {
max-width: 10px;
height: auto;
  }
  .blog-card__body {
    padding: 32px 32px 80px;
  }
    .blog-card {
    background-size: 80px;
  }
}



@media screen and (max-width: 1400px) {
  :root {
    --fs-h1: 65px;
    --fs-h2: 52px;
    --fs-h3: 41px;
    --fs-h4: 29px;
    --fs-h5: 26px;
    --fs-subhead: 12px;
    --fs-body-1: 17px;
    --fs-body-2: 14px;
    --fs-onsite-s: 14px;
    --fs-onsite-ext: 12px;
    --fs-arizona-20: 14px;
    --fs-onsite-96: 69px;
    --fs-arizona-42: 31px;
    --fs-onsite-24: 17px;
    --fs-onsite-18: 13px;
    --Calm-Orange: rgba(255, 192, 139, 0.38);
    --fs-38: 27px;
    --fs-22: 16px;
    --fs-64: 46px;
    --fs-30: 22px;
    --sp-60: 43px;
    --sp-80: 58px;
    --sp-90: 65px;
    --sp-120: 86px;
    --sp-160: 115px;
    --sp-240: 173px;
    --sp-445: 320px;
  }

  .px-9p {
    padding-left: 6.3%;
    padding-right: 6.3%;
  }
  .blog-posts-slider .swiper-slide:first-child {
    margin-left: 5.4%;
  }
  .rolling-slider {
    padding: 27px 0;
  }
  .find-out-btn {
    padding: 14px 58px 14px 14px;
  }
  .img-accordion {
    height: 477px;
  }
  .button {
    padding: 16px 63px 15px 19px;
  }
  .main-menu {
    padding: 18px 0 36px;
  }
  .main-menu ul {
    gap: 43px;
  }
  .topbar {
    padding: 8px 0;
  }

  .logo svg {
    max-width: 72%;
    height: auto;
  }
  .blog-card__img {
    padding: 29px 29px 0;
  }
  .blog-card__body {
    padding: 29px 29px 72px;
  }
    .blog-card {
    background-size: 70px;
  }
}