.hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 36rem;
  height: 100svh;
  background-color: #142744;
  color: #ffe7e5;
}
.hero__container {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 100px 10px 80px;
  height: 100%;
}
@media screen and (min-width: 768px) {
  .hero__container {
    padding: 100px 37px 120px;
  }
}
@media screen and (min-width: 1024px) {
  .hero__container {
    padding-top: clamp(
      113.7777777778px,
      calc(11.1111111111vw),
      213.3333333333px
    );
    padding-inline: clamp(
      26.3111111111px,
      calc(2.5694444444vw),
      49.3333333333px
    );
    padding-bottom: clamp(
      92.4444444444px,
      calc(9.0277777778vw),
      173.3333333333px
    );
  }
}
.hero__container > div {
  display: flex;
  flex-direction: column;
}
@media screen and (min-width: 480px) {
  .hero__container > div {
    align-items: center;
  }
}
.hero__container > div > h1 {
  color: #fff;
  font-family: "Century Gothic";
  font-size: 100px;
  font-style: normal;
  font-weight: 400;
  line-height: 120%;
}
@media screen and (min-width: 768px) {
  .hero__container > div > h1 {
    text-align: center;
  }
}
@media screen and (min-width: 1024px) {
  .hero__container > div > h1 {
    font-size: clamp(85.3333333333px, calc(8.3333333333vw), 160px);
    line-height: 100%;
  }
}
.hero__container > div > h2 {
  color: #fff;
  font-family: "Century Gothic";
  font-size: 21px;
  font-style: normal;
  font-weight: 400;
  line-height: 133.333%;
  max-width: 260px;
}
@media screen and (min-width: 480px) {
  .hero__container > div > h2 {
    text-align: center;
  }
}
@media screen and (min-width: 1024px) {
  .hero__container > div > h2 {
    font-size: clamp(14.9333333333px, calc(1.4583333333vw), 28px);
    max-width: clamp(184.8888888889px, calc(18.0555555556vw), 346.6666666667px);
  }
}
.hero__container > a {
  margin-top: auto;
  margin-inline: auto;
  padding: 5px;
  padding-left: 15px;
  background: #e9edf5;
  display: flex;
  align-items: center;
  gap: 12px;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (min-width: 1024px) {
  .hero__container > a {
    margin-right: unset;
    margin-left: auto;
    gap: unset;
    padding: clamp(3.5555555556px, calc(0.3472222222vw), 6.6666666667px);
  }
}
.hero__container > a > span:first-child {
  color: #1b222b;
  font-family: "Century Gothic";
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 157.143%;
}
@media screen and (min-width: 1024px) {
  .hero__container > a > span:first-child {
    font-size: clamp(9.9555555556px, calc(0.9722222222vw), 18.6666666667px);
  }
}
.hero__container > a > span:last-child {
  display: flex;
  width: 50px;
  height: 50px;
  justify-content: center;
  align-items: center;
  background: #000;
}
@media screen and (min-width: 1024px) {
  .hero__container > a > span:last-child {
    width: clamp(35.5555555556px, calc(3.4722222222vw), 66.6666666667px);
    height: clamp(35.5555555556px, calc(3.4722222222vw), 66.6666666667px);
  }
}
.hero__container > a > span:last-child > svg {
  width: 24px;
  height: 24px;
  fill: #fff;
}
@media screen and (min-width: 1024px) {
  .hero__container > a > span:last-child > svg {
    width: clamp(17.0666666667px, calc(1.6666666667vw), 32px);
    height: clamp(17.0666666667px, calc(1.6666666667vw), 32px);
  }
}
.hero__background,
.hero__frame {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.hero__background {
  z-index: -1;
}
.hero__frame {
  display: block;
}
.hero__frame > img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: -50vw;
  object-position: -50vw;
}
@media screen and (min-width: 430px) {
  .hero__frame > img {
    -o-object-position: -38vw;
    object-position: -38vw;
  }
}
@media screen and (min-width: 480px) {
  .hero__frame > img {
    -o-object-position: center;
    object-position: center;
  }
}
@media screen and (min-width: 1024px) {
  .hero__frame > img {
    --translateX: clamp(-40px, calc(-2.0833333333vw), -21.3333333333px);
    transform: translateX(var(--translateX));
    scale: 1.1;
  }
}
.hero__frame--light {
  opacity: 0;
  transition: opacity 2.4s ease-in-out;
}
.hero.is-lit .hero__frame--light {
  opacity: 1;
}
.hero.is-lighting-instant .hero__frame--light {
  transition: none;
}
.hero__container {
  position: relative;
  z-index: 1;
}
@media screen and (min-width: 1024px) {
  .hero {
    min-height: 32rem;
    height: auto;
    aspect-ratio: 1921/1072;
  }
}
@media (prefers-reduced-motion: reduce) {
  .hero__frame--light {
    transition: none;
  }
}

.hero__container > .hero__choose {
  text-decoration: none;
  touch-action: manipulation;
}
.hero__container > .hero__choose > .hero__choose-label {
  display: block;
  white-space: nowrap;
}
.hero__container > .hero__choose > .hero__choose-icon {
  flex-shrink: 0;
  min-width: 44px;
  min-height: 44px;
}

@media (prefers-reduced-motion: no-preference) {
  .hero__choose-icon > svg {
    transform-origin: center bottom;
    animation: hero-choose-hint 5s ease-in-out 1.2s infinite;
  }
  .hero__choose:hover > .hero__choose-icon > svg,
  .hero__choose:focus-visible > .hero__choose-icon > svg {
    animation: none;
  }
}
@media (min-width: 1024px) and (hover: hover) and (pointer: fine) {
  .hero__container > .hero__choose {
    gap: 0;
  }
  .hero__container > .hero__choose > .hero__choose-label {
    max-width: 0;
    margin-inline: 0;
    overflow: hidden;
    opacity: 0;
    transform: translateX(8px);
    transition:
      max-width 420ms cubic-bezier(0.22, 1, 0.36, 1),
      margin 420ms cubic-bezier(0.22, 1, 0.36, 1),
      opacity 200ms ease,
      transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
  }
  .hero__container > .hero__choose:hover > .hero__choose-label,
  .hero__container > .hero__choose:focus-visible > .hero__choose-label {
    max-width: 13rem;
    margin-inline: 12px;
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes hero-choose-hint {
  0%,
  60%,
  82%,
  100% {
    transform: scale(1);
  }
  70% {
    transform: scale(1.12);
  }
  90% {
    transform: scale(1.07);
  }
}
.info {
  --info-inset: 10px;
  --info-gap: 16px;
}
@media screen and (min-width: 768px) {
  .info {
    --info-inset: 37px;
  }
}
@media screen and (min-width: 1024px) {
  .info {
    --info-inset: clamp(26.3111111111px, calc(2.5694444444vw), 49.3333333333px);
    --info-gap: clamp(31.2888888889px, calc(3.0555555556vw), 58.6666666667px);
  }
}
.info__container {
  max-width: 1920px;
  margin-inline: auto;
  padding-block: 16px;
  padding-left: max(var(--info-inset), env(safe-area-inset-left));
  padding-right: max(var(--info-inset), env(safe-area-inset-right));
}
@media screen and (min-width: 1024px) {
  .info__container {
    padding-block: clamp(
      22.7555555556px,
      calc(2.2222222222vw),
      42.6666666667px
    );
  }
}
.info__container > div {
  overflow-x: auto;
  scrollbar-width: none;
}
.info__container > div::-webkit-scrollbar {
  display: none;
}
.info__container > div > div {
  display: flex;
  align-items: center;
  gap: var(--info-gap);
  width: -moz-max-content;
  width: max-content;
  margin-inline: auto;
}
.info__container > div > div > ul {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  gap: var(--info-gap);
  width: -moz-max-content;
  width: max-content;
}
.info__container > div > div > ul > li {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  gap: 4px;
  width: -moz-max-content;
  width: max-content;
  max-width: max(260px, 52vw);
  padding-inline: 12px;
}
@media screen and (min-width: 1024px) {
  .info__container > div > div > ul > li {
    gap: clamp(8.5333333333px, calc(0.8333333333vw), 16px);
    padding-inline: clamp(8.5333333333px, calc(0.8333333333vw), 16px);
  }
}
.info__container > div > div > ul > li > div {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  background-image: var(--icon);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
@media screen and (min-width: 1024px) {
  .info__container > div > div > ul > li > div {
    width: clamp(31.2888888889px, calc(3.0555555556vw), 58.6666666667px);
    height: clamp(31.2888888889px, calc(3.0555555556vw), 58.6666666667px);
  }
}
.info__container > div > div > ul > li > span {
  min-width: 0;
  width: -moz-max-content;
  width: max-content;
  color: #1b222b;
  font-family: "Century Gothic";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 162.5%;
  overflow-wrap: anywhere;
}
@media screen and (min-width: 1024px) {
  .info__container > div > div > ul > li > span {
    font-size: clamp(11.3777777778px, calc(1.1111111111vw), 21.3333333333px);
  }
}
.info__container > div[data-info-mode="marquee"] {
  overflow-x: hidden;
  touch-action: pan-y;
}
.info__container > div[data-info-mode="marquee"] > div {
  margin-inline: 0;
  will-change: transform;
}
.info__container > div[data-info-mode="scroll"] > div {
  margin-inline: 0;
}

.why {
  --why-sky: 0;
  --why-travel: 0px;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: #1b222b;
  background: linear-gradient(180deg, #81b1d2 0%, #f6f6f6 100%);
}
.why::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  background: #f6f6f6;
  opacity: var(--why-sky);
  pointer-events: none;
}
.why > [data-why-art] {
  position: absolute;
  z-index: 1;
  inset: calc(-1 * var(--why-travel)) 0;
  pointer-events: none;
}
.why > [data-why-art] picture,
.why > [data-why-art] img {
  display: block;
  width: 100%;
  height: 100%;
}
.why > [data-why-art] img {
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center bottom;
  object-position: center bottom;
}
@media screen and (min-width: 1024px) {
  .why > [data-why-art] img {
    -o-object-position: 60% bottom;
    object-position: 60% bottom;
  }
}
@media screen and (min-width: 1024px) {
  .why {
    --why-travel: clamp(
      56.8888888889px,
      calc(5.5555555556vw),
      106.6666666667px
    );
  }
}
.why__container {
  position: relative;
  z-index: 2;
  max-width: 1920px;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: 180px;
  padding: 100px 10px;
}
@media screen and (min-width: 768px) {
  .why__container {
    padding-inline: 37px;
  }
}
@media screen and (min-width: 1024px) {
  .why__container {
    min-height: clamp(1493.3333333333px, calc(145.8333333333vw), 2800px);
    padding-block: clamp(170.6666666667px, calc(16.6666666667vw), 320px);
    padding-inline: clamp(
      108.0888888889px,
      calc(10.5555555556vw),
      202.6666666667px
    );
    gap: clamp(78.2222222222px, calc(7.6388888889vw), 146.6666666667px);
  }
}
.why__container > h2 {
  max-width: 420px;
  font-family: "Century Gothic";
  font-size: 44px;
  font-weight: 400;
  line-height: 1.14706;
  text-wrap: balance;
  overflow-wrap: anywhere;
}
@media screen and (min-width: 375px) {
  .why__container > h2 {
    font-size: 54.4px;
  }
}
@media screen and (min-width: 1024px) {
  .why__container > h2 {
    font-size: clamp(48.3555555556px, calc(4.7222222222vw), 90.6666666667px);
    max-width: clamp(369.7777777778px, calc(36.1111111111vw), 693.3333333333px);
  }
}
.why__container > ul {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  width: 100%;
  max-width: 340px;
  margin-inline: auto;
}
@media screen and (min-width: 576px) {
  .why__container > ul {
    max-width: 320px;
    margin-inline: 0;
  }
}
@media screen and (min-width: 1024px) {
  .why__container > ul {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: none;
    width: clamp(472.1777777778px, calc(46.1111111111vw), 885.3333333333px);
    -moz-column-gap: clamp(
      28.4444444444px,
      calc(2.7777777778vw),
      53.3333333333px
    );
    column-gap: clamp(28.4444444444px, calc(2.7777777778vw), 53.3333333333px);
    row-gap: clamp(284.4444444444px, calc(27.7777777778vw), 533.3333333333px);
    padding-bottom: clamp(
      227.5555555556px,
      calc(22.2222222222vw),
      426.6666666667px
    );
  }
}
.why__container > ul > li {
  position: relative;
  min-width: 0;
  align-self: start;
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 30px;
  background: #fff;
}
@media screen and (min-width: 1024px) {
  .why__container > ul > li {
    padding: clamp(28.4444444444px, calc(2.7777777778vw), 53.3333333333px);
    gap: clamp(9.9555555556px, calc(0.9722222222vw), 18.6666666667px);
  }
  .why__container > ul > li:nth-child(even) {
    top: clamp(227.5555555556px, calc(22.2222222222vw), 426.6666666667px);
  }
}
.why__container > ul > li > span {
  font-family: "Century Gothic";
  font-size: 54.4px;
  font-weight: 400;
  line-height: 1.14706;
}
@media screen and (min-width: 1024px) {
  .why__container > ul > li > span {
    font-size: clamp(48.3555555556px, calc(4.7222222222vw), 90.6666666667px);
  }
}
.why__container > ul > li > p {
  font-family: "Century Gothic";
  font-size: 16px;
  font-weight: 400;
  line-height: 1.625;
  overflow-wrap: anywhere;
}
@media screen and (min-width: 1024px) {
  .why__container > ul > li > p {
    font-size: clamp(11.3777777778px, calc(1.1111111111vw), 21.3333333333px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .why {
    --why-travel: 0px;
  }
}
.ap-buildings {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
  gap: 10px;
}
@media screen and (min-width: 768px) {
  .ap-buildings {
    max-width: none;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
  }
}
@media screen and (min-width: 1024px) {
  .ap-buildings {
    gap: clamp(5.6888888889px, calc(0.5555555556vw), 10.6666666667px);
  }
}
.ap-building {
  position: relative;
  width: 100%;
  min-width: 0;
  max-width: none;
  height: calc((100vw - 20px) * 391 / 340);
  padding: 0;
  overflow: hidden;
  border: 0;
}
@media screen and (min-width: 768px) {
  .ap-building {
    height: calc((100vw - 88px) * 391 / 680);
  }
}
.ap-building {
  isolation: isolate;
}
@media screen and (min-width: 1024px) {
  .ap-building {
    height: clamp(444.4444444444px, calc(43.4027777778vw), 833.3333333333px);
  }
}
.ap-building img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: fill;
  object-fit: fill;
  -o-object-position: center;
  object-position: center;
}
.ap-building-media {
  display: block;
  height: 100%;
  min-height: 100%;
  max-width: none;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  transform: translate(-50%, -50%);
}
@media screen and (min-width: 1024px) {
  .ap-building-media {
    width: 100%;
    height: 100%;
  }
}
.ap-building-media::after {
  display: none;
}
@media screen and (min-width: 1024px) {
  .ap-building-media::after {
    display: block;
  }
}
.ap-building-media::after {
  position: absolute;
  z-index: 0;
  inset: 0;
  background: linear-gradient(180deg, transparent 45%, rgba(27, 36, 43, 0.64));
  content: "";
  pointer-events: none;
}
.ap-building-overlay {
  position: absolute;
  z-index: 1;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity 0.2s ease;
  pointer-events: none;
}
.ap-building-overlay path {
  stroke: #ffa300;
  stroke-width: 2;
}
.ap-building-content {
  position: absolute;
  z-index: 2;
  top: 40.4%;
  right: 10px;
  left: 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}
@media screen and (min-width: 1024px) {
  .ap-building-content {
    top: 56.86%;
    gap: clamp(17.0666666667px, calc(1.6666666667vw), 32px);
  }
}
.ap-building-name {
  display: block;
  color: #fff;
  font-family: "Century Gothic";
  font-size: 28.8px;
  font-weight: 400;
  line-height: 35.2px;
}
@media screen and (min-width: 1024px) {
  .ap-building-name {
    font-size: clamp(25.6px, calc(2.5vw), 48px);
    line-height: clamp(35.84px, calc(3.5vw), 67.2px);
  }
}
.ap-building-cta {
  display: grid;
  width: 149px;
  height: 60px;
  place-items: center;
  background: #000;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
}
@media screen and (min-width: 1024px) {
  .ap-building-cta {
    display: none;
  }
}
.ap-building:nth-child(2) .ap-building-content {
  top: 42.97%;
}
@media screen and (min-width: 1024px) {
  .ap-building:nth-child(2) .ap-building-content {
    top: 56.86%;
  }
}
.ap-building:is(.ap-tapped, .ap-mouse-hover:hover) .ap-building-overlay,
.ap-building:focus-visible .ap-building-overlay {
  opacity: 1;
}
.ap-building:is(.ap-tapped, .ap-mouse-hover:hover) .ap-building-cta,
.ap-building:focus-visible .ap-building-cta {
  color: #ffa300;
}
.ap-arrow {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  background: #ffa300;
  width: 50px;
  height: 50px;
}
@media screen and (min-width: 1024px) {
  .ap-arrow {
    width: clamp(35.5555555556px, calc(3.4722222222vw), 66.6666666667px);
    height: clamp(35.5555555556px, calc(3.4722222222vw), 66.6666666667px);
  }
}

.planning {
  background: #1b222b;
  color: #fff;
  font-family: "Century Gothic", Arial, sans-serif;
}
.planning__container {
  width: 100%;
  max-width: 1920px;
  margin-inline: auto;
  padding-top: 96px;
}
@media screen and (min-width: 768px) {
  .planning__container {
    padding-bottom: 90px;
  }
}
@media screen and (min-width: 1024px) {
  .planning__container {
    padding-bottom: 0;
    padding-top: clamp(68.2666666667px, calc(6.6666666667vw), 128px);
  }
}
.planning__title {
  max-width: 340px;
  margin: 0 20px 67px;
  color: #fff;
  font: inherit;
  font-size: 40px;
  font-weight: 400;
  line-height: 56px;
}
@media screen and (min-width: 768px) {
  .planning__title {
    margin-inline: 57px;
  }
}
@media screen and (min-width: 1024px) {
  .planning__title {
    max-width: clamp(71.1111111111%, calc(6.9444444444vw), 133.3333333333%);
    margin-left: clamp(
      108.0888888889px,
      calc(10.5555555556vw),
      202.6666666667px
    );
    margin-bottom: clamp(128px, calc(12.5vw), 240px);
    font-size: clamp(48.3555555556px, calc(4.7222222222vw), 90.6666666667px);
    line-height: clamp(55.4666666667px, calc(5.4166666667vw), 104px);
  }
}
@media screen and (min-width: 768px) {
  .planning__cards {
    padding-inline: 37px;
  }
}
@media screen and (min-width: 1024px) {
  .planning__cards {
    display: none;
  }
}
.planning__cards .ap-buildings {
  gap: 4px;
}
@media screen and (min-width: 768px) {
  .planning__cards .ap-buildings {
    gap: 32px;
  }
}
.planning__cards .ap-building {
  display: block;
  height: auto;
  aspect-ratio: 360/414;
  border: 0;
  color: #fff;
  text-decoration: none;
  font: inherit;
}
.planning__cards .ap-building .ap-building-content,
.planning__cards .ap-building:nth-child(2) .ap-building-content {
  top: auto;
  bottom: 50px;
  gap: 24px;
}
.planning__cards .ap-building .ap-building-name {
  font-size: 28.8px;
  line-height: 35.2px;
}
.planning__cards .ap-building .ap-building-cta {
  display: grid;
  color: #ffa300;
}
.planning__cards .ap-building .ap-building-overlay {
  opacity: 1;
}
.planning__cards .ap-building:hover .ap-building-overlay,
.planning__cards .ap-building:focus-visible .ap-building-overlay {
  opacity: 1;
}
.planning__cards .ap-building:hover .ap-arrow svg,
.planning__cards .ap-building:focus-visible .ap-arrow svg {
  transform: translate(3px, -3px);
}
.planning__cards .ap-building svg {
  fill: currentColor;
  transition: transform 0.25s ease;
}
.planning__stage {
  display: none;
}
@media screen and (min-width: 1024px) {
  .planning__stage {
    display: grid;
    place-items: start center;
    box-sizing: border-box;
    height: var(--planning-stage-height, calc(100svh - 96px));
    padding-block: 0;
  }
}
.planning__scene {
  position: relative;
  width: min(
    100%,
    (var(--planning-stage-height, calc(100svh - 96px)) - 32px) * 1.791776
  );
  aspect-ratio: 960/536;
  transform-origin: 50% 0;
  backface-visibility: hidden;
}
.planning__scene:has(.planning__choice--1:focus-visible) .planning__facade--1,
.planning__scene:has(.planning__choice--2:focus-visible) .planning__facade--2 {
  stroke: #ffa300;
  stroke-width: 2px;
  vector-effect: non-scaling-stroke;
  opacity: 1;
}
@media (hover: hover) and (pointer: fine) {
  .planning__scene:has(.planning__choice--1:hover) .planning__facade--1,
  .planning__scene:has(.planning__choice--2:hover) .planning__facade--2 {
    opacity: 1;
  }
}
.planning__facade {
  opacity: 0.55;
  transition: opacity 0.3s ease;
}
.planning__image {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}
.planning__choices {
  position: absolute;
  inset: 0;
}
.planning__choice {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  box-sizing: border-box;
  padding-bottom: var(--planning-controls-bottom, 45px);
  color: #fff;
  text-decoration: none;
}
.planning__choice--1 {
  clip-path: polygon(
    9.9% 78.5%,
    9.9% 58.8%,
    15.1% 10.6%,
    39.1% 22%,
    39.1% 87%,
    9.9% 87%
  );
  --choice-x: 24%;
}
.planning__choice--2 {
  clip-path: polygon(
    43.75% 87.7%,
    44.2% 53.9%,
    71.6% 25.6%,
    88.65% 36.2%,
    88.65% 88.1%
  );
  --choice-x: 66%;
}
@media screen and (min-width: 1024px) and (hover: hover) and (pointer: fine) {
  .planning__choice:hover .planning__arrow svg {
    transform: translate(4px, -4px);
  }
}
.planning__choice:focus-visible {
  outline: none;
}
.planning__highlights {
  pointer-events: none;
}
.planning__choice-content {
  flex: 0 0 auto;
  margin-left: var(--choice-x);
  display: flex;
  flex-direction: column;
  align-items: center;
  transform: translateX(-50%) scale(var(--planning-content-scale, 1));
  transform-origin: 50% 100%;
}
@media screen and (min-width: 1024px) {
  .planning__choice-content {
    gap: clamp(17.0666666667px, calc(1.6666666667vw), 32px);
  }
}
.planning__arrow {
  display: grid;
  place-items: center;
  background: #ffa300;
  color: #000;
}
@media screen and (min-width: 1024px) {
  .planning__arrow {
    width: clamp(35.5555555556px, calc(3.4722222222vw), 66.6666666667px);
    height: clamp(35.5555555556px, calc(3.4722222222vw), 66.6666666667px);
  }
}
.planning__arrow svg {
  fill: currentColor;
  transition: transform 0.25s ease;
}
@media screen and (min-width: 1024px) {
  .planning__arrow svg {
    width: clamp(17.0666666667px, calc(1.6666666667vw), 32px);
    height: clamp(17.0666666667px, calc(1.6666666667vw), 32px);
  }
}
.planning__name {
  white-space: nowrap;
  color: #fff;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.7);
}
@media screen and (min-width: 1024px) {
  .planning__name {
    font-size: clamp(25.6px, calc(2.5vw), 48px);
    line-height: clamp(35.84px, calc(3.5vw), 67.2px);
  }
}
.planning__cta {
  display: grid;
  place-items: center;
  background: #000;
  color: #ffa300;
  font-weight: 700;
  transition: color 0.25s ease;
}
@media screen and (min-width: 1024px) {
  .planning__cta {
    width: clamp(105.9555555556px, calc(10.3472222222vw), 198.6666666667px);
    height: clamp(42.6666666667px, calc(4.1666666667vw), 80px);
    font-size: clamp(9.9555555556px, calc(0.9722222222vw), 18.6666666667px);
  }
}
@media (prefers-reduced-motion: reduce) {
  .planning *,
  .planning *::before,
  .planning *::after {
    transition: none !important;
  }
}

.map {
  --map-popup-max-width: 300px;
  --map-popup-padding: 20px;
  background: #2d3640;
  color: #fff;
}
@media screen and (min-width: 1024px) {
  .map {
    --map-popup-max-width: clamp(
      213.3333333333px,
      calc(20.8333333333vw),
      400px
    );
    --map-popup-padding: clamp(
      14.2222222222px,
      calc(1.3888888889vw),
      26.6666666667px
    );
  }
}
.map__container {
  width: 100%;
  max-width: 1920px;
  margin-inline: auto;
}
.map__container > div:first-child {
  position: relative;
  height: 680px;
  background: #2d3640;
}
@media screen and (min-width: 1024px) {
  .map__container > div:first-child {
    height: 100vh;
    max-height: clamp(
      568.8888888889px,
      calc(55.5555555556vw),
      1066.6666666667px
    );
  }
}
.map__container > div:first-child > div {
  width: 100%;
  height: 100%;
}
.map__container > div:first-child > p {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  margin: 0;
  padding: 24px;
  text-align: center;
  pointer-events: none;
}
@media screen and (min-width: 1024px) {
  .map__container > div:first-child > p {
    padding: clamp(17.0666666667px, calc(1.6666666667vw), 32px);
  }
}
.map__container > div:first-child > p[hidden] {
  display: none;
}
.map__container > div:last-child {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px 24px;
  padding: 18px 24px;
  font-size: 14px;
  line-height: 1.5;
}
@media screen and (min-width: 1024px) {
  .map__container > div:last-child {
    row-gap: clamp(8.5333333333px, calc(0.8333333333vw), 16px);
    -moz-column-gap: clamp(17.0666666667px, calc(1.6666666667vw), 32px);
    column-gap: clamp(17.0666666667px, calc(1.6666666667vw), 32px);
    padding-block: clamp(12.8px, calc(1.25vw), 24px);
    padding-inline: clamp(17.0666666667px, calc(1.6666666667vw), 32px);
    font-size: clamp(11.3777777778px, calc(1.1111111111vw), 21.3333333333px);
  }
}
.map__container > div:last-child > a {
  color: #ffa800;
  text-underline-offset: 4px;
  text-decoration: underline;
}
.map__container > div:last-child > a > span {
  display: inline-block;
  transition: transform 0.3s ease;
}
@media screen and (min-width: 1024px) {
  .map__container > div:last-child > a {
    text-underline-offset: clamp(
      2.8444444444px,
      calc(0.2777777778vw),
      5.3333333333px
    );
  }
  .map__container > div:last-child > a:focus-visible > span {
    transform: translateY(-3px);
  }
}
@media screen and (min-width: 1024px) and (hover: hover) and (pointer: fine) {
  .map__container > div:last-child > a:hover > span {
    transform: translate(3px, -3px);
  }
}
@media (prefers-reduced-motion: reduce) {
  .map__container > div:last-child > a > span {
    transform: none !important;
    transition: none;
  }
}

.map__popup a {
  color: #ffa800;
  text-underline-offset: 4px;
  text-decoration: underline;
}
@media screen and (min-width: 1024px) {
  .map__popup a {
    text-underline-offset: clamp(
      2.8444444444px,
      calc(0.2777777778vw),
      5.3333333333px
    );
  }
}

.map__marker {
  display: grid;
  place-items: center;
  width: 50px;
  height: 50px;
  padding: 12px;
  border: 2px solid #ffa800;
  border-radius: 50%;
  background: #2d3640;
  color: #ffa800;
  cursor: pointer;
  transition: all 0.5s cubic-bezier(0.33, 1, 0.69, 1);
}
@media screen and (min-width: 1024px) {
  .map__marker {
    width: clamp(35.5555555556px, calc(3.4722222222vw), 66.6666666667px);
    height: clamp(35.5555555556px, calc(3.4722222222vw), 66.6666666667px);
    padding: clamp(8.5333333333px, calc(0.8333333333vw), 16px);
    border-width: clamp(1.4222222222px, calc(0.1388888889vw), 2.6666666667px);
  }
  .map__marker:hover,
  .map__marker:focus-visible {
    border-color: #ffa800;
    background: #ffa800;
    color: #2d3640;
  }
}

.map__marker img,
.map__marker svg,
.map__marker-icon {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
}

.map__marker-icon {
  background-color: currentColor;
  -webkit-mask: var(--map-icon) center/contain no-repeat;
  mask: var(--map-icon) center/contain no-repeat;
}

.map__marker-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: currentColor;
}
@media screen and (min-width: 1024px) {
  .map__marker-dot {
    width: clamp(8.5333333333px, calc(0.8333333333vw), 16px);
    height: clamp(8.5333333333px, calc(0.8333333333vw), 16px);
  }
}

.map__marker--main {
  width: 72px;
  height: 72px;
  padding: 4px;
  border-radius: 0;
  background: #ffa800;
}
@media screen and (min-width: 1024px) {
  .map__marker--main {
    width: clamp(51.2px, calc(5vw), 96px);
    height: clamp(51.2px, calc(5vw), 96px);
    padding: clamp(2.8444444444px, calc(0.2777777778vw), 5.3333333333px);
  }
}

.map__marker--main svg {
  filter: brightness(0);
}

.map__marker--korona {
  background: #2d3640;
  color: #ffa800;
  padding: 6px;
}
@media screen and (min-width: 1024px) {
  .map__marker--korona {
    padding: clamp(4.2666666667px, calc(0.4166666667vw), 8px);
  }
}

.map__marker--korona svg {
  filter: none;
}

.map .gm-style-iw-a {
  opacity: 0;
  pointer-events: none;
}

.map__container[data-popup-state="visible"] .gm-style-iw-a {
  opacity: 1;
  pointer-events: auto;
  transition: opacity 360ms cubic-bezier(0.22, 1, 0.36, 1);
}

.map .gm-style-iw-c,
.map .gm-style-iw-tc {
  translate: 0 6px;
}

.map__container[data-popup-state="visible"] .gm-style-iw-c,
.map__container[data-popup-state="visible"] .gm-style-iw-tc {
  translate: 0 0;
  transition: translate 360ms cubic-bezier(0.22, 1, 0.36, 1);
}

.map .gm-style-iw-c,
.map .gm-style-iw-d {
  background: #2d3640;
  color: #fff;
}

.map .gm-style-iw-c {
  box-sizing: border-box;
  width: var(--map-popup-width, auto);
  min-width: var(--map-popup-width, 0px) !important;
  max-width: var(--map-popup-width, var(--map-popup-max-width)) !important;
  padding: var(--map-popup-padding) !important;
}

.map__popup-measure {
  position: fixed;
  top: 0;
  left: -10000px;
  visibility: hidden;
  pointer-events: none;
  width: -moz-max-content;
  width: max-content;
  max-width: var(--map-popup-max-width);
  padding: var(--map-popup-padding);
}

.map__marker[aria-busy="true"] {
  cursor: progress;
}

.map .gm-style-iw-chr {
  height: 0;
  min-height: 0;
}

.map .gm-style-iw-d {
  overflow: auto !important;
  color-scheme: dark;
  scrollbar-color: #60717f #1b232c;
}

.map .gm-style-iw-d::-webkit-scrollbar-track {
  background: #1b232c;
}

.map .gm-style-iw-d::-webkit-scrollbar-thumb {
  background: #60717f;
}

.map .gm-style-iw-tc::after {
  background: #2d3640;
}

.map .gm-style-iw-c .gm-ui-hover-effect {
  position: absolute !important;
  top: 8px;
  right: 8px;
  width: 32px !important;
  height: 32px !important;
  filter: invert(1);
}
@media screen and (min-width: 1024px) {
  .map .gm-style-iw-c .gm-ui-hover-effect {
    top: clamp(5.6888888889px, calc(0.5555555556vw), 10.6666666667px);
    right: clamp(5.6888888889px, calc(0.5555555556vw), 10.6666666667px);
    --width: clamp(22.7555555556px, calc(2.2222222222vw), 42.6666666667px);
    width: var(--width) !important;
    height: var(--width) !important;
  }
}

.map .gm-style-iw-c .gm-ui-hover-effect > span {
  width: 18px !important;
  height: 18px !important;
  margin: 7px !important;
}
@media screen and (min-width: 1024px) {
  .map .gm-style-iw-c .gm-ui-hover-effect > span {
    --width: clamp(12.8px, calc(1.25vw), 24px);
    --margin: clamp(4.9777777778px, calc(0.4861111111vw), 9.3333333333px);
    width: var(--width) !important;
    height: var(--width) !important;
    margin: var(--margin) !important;
  }
}

.map__popup {
  display: grid;
  gap: 10px;
  width: 100%;
  min-width: 0;
  overflow-wrap: anywhere;
  padding: 0;
  font-family: "Century Gothic", system-ui, sans-serif;
  font-size: 14px;
  line-height: 1.5;
}
@media screen and (min-width: 1024px) {
  .map__popup {
    gap: clamp(7.1111111111px, calc(0.6944444444vw), 13.3333333333px);
    font-size: clamp(9.9555555556px, calc(0.9722222222vw), 18.6666666667px);
  }
}

.map__popup strong {
  display: block;
  padding-right: 28px;
  font-size: 16px;
}
@media screen and (min-width: 1024px) {
  .map__popup strong {
    padding-right: clamp(
      19.9111111111px,
      calc(1.9444444444vw),
      37.3333333333px
    );
    font-size: clamp(11.3777777778px, calc(1.1111111111vw), 21.3333333333px);
  }
}

.map__popup p {
  margin: 0;
}

.map__route-warning {
  display: block;
  margin: 0;
  color: #c4ccd2;
  font-size: 11px;
}
@media screen and (min-width: 1024px) {
  .map__route-warning {
    font-size: clamp(7.8222222222px, calc(0.7638888889vw), 14.6666666667px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .map .gm-style-iw-c,
  .map .gm-style-iw-tc {
    translate: none;
  }
  .map__container[data-popup-state="visible"] .gm-style-iw-a,
  .map__container[data-popup-state="visible"] .gm-style-iw-c,
  .map__container[data-popup-state="visible"] .gm-style-iw-tc {
    transition: none;
  }
}
.installment {
  position: relative;
  isolation: isolate;
  background-color: #3e3934;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.installment::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(
    0deg,
    rgba(27, 34, 43, 0.5) 0%,
    rgba(27, 34, 43, 0.5) 100%
  );
}
.installment__container {
  position: relative;
  z-index: 1;
  max-width: 1920px;
  margin-inline: auto;
  padding: 90px 10px;
  display: flex;
  flex-direction: column;
  gap: 60px;
}
@media screen and (min-width: 768px) {
  .installment__container {
    padding-inline: 37px;
  }
}
@media screen and (min-width: 1024px) {
  .installment__container {
    flex-direction: row-reverse;
    align-items: center;
    -moz-column-gap: clamp(64px, calc(6.25vw), 120px);
    column-gap: clamp(64px, calc(6.25vw), 120px);
    padding-block: clamp(85.3333333333px, calc(8.3333333333vw), 160px);
    padding-inline: clamp(
      108.0888888889px,
      calc(10.5555555556vw),
      202.6666666667px
    );
  }
}
.installment__container > div:first-child {
  display: flex;
  flex-direction: column;
  gap: 40px;
}
@media screen and (min-width: 1024px) {
  .installment__container > div:first-child {
    gap: clamp(28.4444444444px, calc(2.7777777778vw), 53.3333333333px);
  }
}
.installment__container > div:first-child > h2 {
  color: #fff;
  text-wrap: balance;
  font-family: "Century Gothic";
  font-size: 38.4px;
  font-style: normal;
  font-weight: 400;
  line-height: 120.833%;
}
@media screen and (min-width: 1024px) {
  .installment__container > div:first-child > h2 {
    font-size: clamp(34.1333333333px, calc(3.3333333333vw), 64px);
  }
}
.installment__container > div:first-child > div {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
@media screen and (min-width: 1024px) {
  .installment__container > div:first-child > div {
    gap: clamp(2.8444444444px, calc(0.2777777778vw), 5.3333333333px);
  }
}
.installment__container > div:first-child > div > p,
.installment__container > div:first-child > div > span {
  color: #fff;
  font-family: "Century Gothic";
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 162.5%;
}
@media screen and (min-width: 1024px) {
  .installment__container > div:first-child > div > p,
  .installment__container > div:first-child > div > span {
    font-size: clamp(11.3777777778px, calc(1.1111111111vw), 21.3333333333px);
  }
}
.installment__container > div:first-child > div > span {
  font-weight: 400;
}
.installment__container > div:last-child.installment__calculator {
  background: #fff;
  color: #1b222b;
  display: flex;
  flex-direction: column;
  gap: 40px;
  padding: 50px 15px;
  min-width: 0;
}
@media screen and (min-width: 768px) {
  .installment__container > div:last-child.installment__calculator {
    padding: 60px 40px;
  }
}
@media screen and (min-width: 1024px) {
  .installment__container > div:last-child.installment__calculator {
    gap: clamp(28.4444444444px, calc(2.7777777778vw), 53.3333333333px);
    padding-block: clamp(42.6666666667px, calc(4.1666666667vw), 80px);
    padding-inline: clamp(42.6666666667px, calc(4.1666666667vw), 80px);
    width: 100%;
  }
}
.installment__container > div:last-child.installment__calculator > h3 {
  color: #1b222b;
  font-family: "Century Gothic";
  font-size: 22.4px;
  font-style: normal;
  font-weight: 400;
  line-height: 128.571%;
}
@media screen and (min-width: 1024px) {
  .installment__container > div:last-child.installment__calculator > h3 {
    font-size: clamp(19.9111111111px, calc(1.9444444444vw), 37.3333333333px);
  }
}
.installment__container
  > div:last-child.installment__calculator
  > div.installment__controls {
  display: flex;
  flex-direction: column;
  gap: 30px;
}
@media screen and (min-width: 1024px) {
  .installment__container
    > div:last-child.installment__calculator
    > div.installment__controls {
    gap: clamp(21.3333333333px, calc(2.0833333333vw), 40px);
  }
}
.installment__container
  > div:last-child.installment__calculator
  > div.installment__controls[hidden] {
  display: none;
}
.installment__container
  > div:last-child.installment__calculator
  > div.installment__controls
  > div.installment__field {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}
@media screen and (min-width: 1024px) {
  .installment__container
    > div:last-child.installment__calculator
    > div.installment__controls
    > div.installment__field {
    gap: clamp(5.6888888889px, calc(0.5555555556vw), 10.6666666667px);
  }
}
.installment__container
  > div:last-child.installment__calculator
  > div.installment__controls
  > div.installment__field
  > label {
  color: #000;
  font-family: "Century Gothic";
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 155.556%;
}
@media screen and (min-width: 1024px) {
  .installment__container
    > div:last-child.installment__calculator
    > div.installment__controls
    > div.installment__field
    > label {
    font-size: clamp(12.8px, calc(1.25vw), 24px);
  }
}
.installment__container
  > div:last-child.installment__calculator
  > div.installment__controls
  > div.installment__field
  > div.installment__range {
  --progress: 0%;
  --position: 0;
  --thumb-size: 30px;
  --track-size: 4px;
  --range-label-space: 28px;
  position: relative;
  min-width: 0;
  padding-top: var(--range-label-space);
}
@media screen and (min-width: 1024px) {
  .installment__container
    > div:last-child.installment__calculator
    > div.installment__controls
    > div.installment__field
    > div.installment__range {
    --thumb-size: clamp(21.3333333333px, calc(2.0833333333vw), 40px);
    --track-size: clamp(2.8444444444px, calc(0.2777777778vw), 5.3333333333px);
    --range-label-space: clamp(
      19.9111111111px,
      calc(1.9444444444vw),
      37.3333333333px
    );
  }
}
.installment__container
  > div:last-child.installment__calculator
  > div.installment__controls
  > div.installment__field
  > div.installment__range
  > output {
  position: absolute;
  top: 0;
  left: calc(
    var(--thumb-size) / 2 + (100% - var(--thumb-size)) * var(--position)
  );
  translate: -50% 0;
  color: #000;
  font-family: "Century Gothic";
  font-size: 21px;
  font-style: normal;
  font-weight: 700;
  line-height: 133.333%;
  white-space: nowrap;
  pointer-events: none;
}
@media screen and (min-width: 1024px) {
  .installment__container
    > div:last-child.installment__calculator
    > div.installment__controls
    > div.installment__field
    > div.installment__range
    > output {
    font-size: clamp(14.9333333333px, calc(1.4583333333vw), 28px);
  }
}
.installment__container
  > div:last-child.installment__calculator
  > div.installment__controls
  > div.installment__field
  > div.installment__range
  > input[type="range"] {
  position: relative;
  z-index: 1;
  display: block;
  -moz-appearance: none;
  appearance: none;
  -webkit-appearance: none;
  width: 100%;
  min-width: 0;
  height: 44px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  cursor: pointer;
  touch-action: pan-y;
}
@media screen and (min-width: 1024px) {
  .installment__container
    > div:last-child.installment__calculator
    > div.installment__controls
    > div.installment__field
    > div.installment__range
    > input[type="range"] {
    height: clamp(31.2888888889px, calc(3.0555555556vw), 58.6666666667px);
  }
}
.installment__container
  > div:last-child.installment__calculator
  > div.installment__controls
  > div.installment__field
  > div.installment__range
  > input[type="range"]:disabled {
  cursor: default;
  opacity: 1;
}
.installment__container
  > div:last-child.installment__calculator
  > div.installment__controls
  > div.installment__field
  > div.installment__range
  > input[type="range"]::-webkit-slider-runnable-track {
  -webkit-transition: all 0.5s cubic-bezier(0.33, 1, 0.69, 1);
  transition: all 0.5s cubic-bezier(0.33, 1, 0.69, 1);
  height: var(--track-size);
  background: linear-gradient(
    to right,
    #ffa800 0 var(--progress),
    #e9edf5 var(--progress) 100%
  );
}
.installment__container
  > div:last-child.installment__calculator
  > div.installment__controls
  > div.installment__field
  > div.installment__range
  > input[type="range"]::-moz-range-track {
  -moz-transition: all 0.5s cubic-bezier(0.33, 1, 0.69, 1);
  transition: all 0.5s cubic-bezier(0.33, 1, 0.69, 1);
  height: var(--track-size);
  background: linear-gradient(
    to right,
    #ffa800 0 var(--progress),
    #e9edf5 var(--progress) 100%
  );
}
.installment__container
  > div:last-child.installment__calculator
  > div.installment__controls
  > div.installment__field
  > div.installment__range
  > input[type="range"]::-webkit-slider-thumb {
  -webkit-transition: all 0.5s cubic-bezier(0.33, 1, 0.69, 1);
  transition: all 0.5s cubic-bezier(0.33, 1, 0.69, 1);
  appearance: none;
  -webkit-appearance: none;
  box-sizing: border-box;
  width: var(--thumb-size);
  height: var(--thumb-size);
  margin-top: calc((var(--track-size) - var(--thumb-size)) / 2);
  border: calc(var(--thumb-size) / 4) solid #ffa800;
  border-radius: 50%;
  background: #1b222b;
}
.installment__container
  > div:last-child.installment__calculator
  > div.installment__controls
  > div.installment__field
  > div.installment__range
  > input[type="range"]::-moz-range-thumb {
  -moz-transition: all 0.5s cubic-bezier(0.33, 1, 0.69, 1);
  transition: all 0.5s cubic-bezier(0.33, 1, 0.69, 1);
  box-sizing: border-box;
  width: var(--thumb-size);
  height: var(--thumb-size);
  border: calc(var(--thumb-size) / 4) solid #ffa800;
  border-radius: 50%;
  background: #1b222b;
}
.installment__container
  > div:last-child.installment__calculator
  > div.installment__controls
  > div.installment__field
  > div.installment__range
  > div.installment__area-options {
  position: absolute;
  inset: 0 calc(var(--thumb-size) / 2);
  pointer-events: none;
  z-index: 2;
}
.installment__container
  > div:last-child.installment__calculator
  > div.installment__controls
  > div.installment__field
  > div.installment__range
  > div.installment__area-options
  > span {
  transition: all 0.5s cubic-bezier(0.33, 1, 0.69, 1);
  position: absolute;
  top: 0;
  left: calc(100% * var(--position));
  translate: -50% 0;
  color: #000;
  font-family: "Century Gothic";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 155.556%;
  white-space: nowrap;
}
@media screen and (min-width: 768px) {
  .installment__container
    > div:last-child.installment__calculator
    > div.installment__controls
    > div.installment__field
    > div.installment__range
    > div.installment__area-options
    > span {
    font-size: 18px;
  }
}
@media screen and (min-width: 1024px) {
  .installment__container
    > div:last-child.installment__calculator
    > div.installment__controls
    > div.installment__field
    > div.installment__range
    > div.installment__area-options
    > span {
    font-size: clamp(12.8px, calc(1.25vw), 24px);
  }
}
@media (max-width: 359px) {
  .installment__container
    > div:last-child.installment__calculator
    > div.installment__controls
    > div.installment__field
    > div.installment__range
    > div.installment__area-options
    > span {
    font-size: 14px;
  }
}
.installment__container
  > div:last-child.installment__calculator
  > div.installment__controls
  > div.installment__field
  > div.installment__range
  > div.installment__area-options
  > span::after {
  transition: all 0.5s cubic-bezier(0.33, 1, 0.69, 1);
  content: "";
  position: absolute;
  top: calc(var(--range-label-space) + 22px - var(--thumb-size) / 2);
  left: 50%;
  translate: -50% 0;
  width: var(--thumb-size);
  height: var(--thumb-size);
  border: calc(var(--thumb-size) / 4) solid #cfd7e4;
  border-radius: 50%;
  background: #1b222b;
}
@media screen and (min-width: 1024px) {
  .installment__container
    > div:last-child.installment__calculator
    > div.installment__controls
    > div.installment__field
    > div.installment__range
    > div.installment__area-options
    > span::after {
    --gap: clamp(15.6444444444px, calc(1.5277777778vw), 29.3333333333px);
    top: calc(var(--range-label-space) + var(--gap) - var(--thumb-size) / 2);
  }
}
.installment__container
  > div:last-child.installment__calculator
  > div.installment__controls
  > div.installment__field
  > div.installment__range
  > div.installment__area-options
  > span.is-selected {
  font-size: 18px;
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .installment__container
    > div:last-child.installment__calculator
    > div.installment__controls
    > div.installment__field
    > div.installment__range
    > div.installment__area-options
    > span.is-selected {
    font-size: 21px;
  }
}
@media screen and (min-width: 1024px) {
  .installment__container
    > div:last-child.installment__calculator
    > div.installment__controls
    > div.installment__field
    > div.installment__range
    > div.installment__area-options
    > span.is-selected {
    font-size: clamp(14.9333333333px, calc(1.4583333333vw), 28px);
  }
}
.installment__container
  > div:last-child.installment__calculator
  > div.installment__controls
  > div.installment__field
  > div.installment__range
  > div.installment__area-options
  > span.is-selected::after {
  border-color: #ffa800;
}
.installment__container
  > div:last-child.installment__calculator
  > div.installment__controls
  > div.installment__payment {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}
@media screen and (min-width: 1024px) {
  .installment__container
    > div:last-child.installment__calculator
    > div.installment__controls
    > div.installment__payment {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: clamp(8.5333333333px, calc(0.8333333333vw), 16px);
  }
}
.installment__container
  > div:last-child.installment__calculator
  > div.installment__controls
  > div.installment__payment
  > span {
  color: #000;
  font-family: "Century Gothic";
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 155.556%;
}
@media screen and (min-width: 1024px) {
  .installment__container
    > div:last-child.installment__calculator
    > div.installment__controls
    > div.installment__payment
    > span {
    font-size: clamp(12.8px, calc(1.25vw), 24px);
  }
}
.installment__container
  > div:last-child.installment__calculator
  > div.installment__controls
  > div.installment__payment
  > output {
  color: #1b222b;
  font-family: "Century Gothic";
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 155.556%;
  white-space: nowrap;
}
@media screen and (min-width: 1024px) {
  .installment__container
    > div:last-child.installment__calculator
    > div.installment__controls
    > div.installment__payment
    > output {
    font-size: clamp(12.8px, calc(1.25vw), 24px);
  }
}
.installment__container
  > div:last-child.installment__calculator
  > div.installment__controls
  > div.installment__payment
  strong {
  color: #1b222b;
  font-family: "Century Gothic";
  font-size: 28px;
  font-style: normal;
  font-weight: 700;
  line-height: 128.571%;
  font-variant-numeric: tabular-nums;
}
@media screen and (min-width: 1024px) {
  .installment__container
    > div:last-child.installment__calculator
    > div.installment__controls
    > div.installment__payment
    strong {
    font-size: clamp(19.9111111111px, calc(1.9444444444vw), 37.3333333333px);
  }
}
.installment__container
  > div:last-child.installment__calculator
  > div.installment__controls
  > div.installment__payment
  i {
  font-style: normal;
}
.installment__container
  > div:last-child.installment__calculator
  > div.installment__controls
  > div.installment__payment
  > small {
  flex-basis: 100%;
  width: 100%;
  font-family: "Century Gothic";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 162.5%;
  color: #59616c;
}
@media screen and (min-width: 1024px) {
  .installment__container
    > div:last-child.installment__calculator
    > div.installment__controls
    > div.installment__payment
    > small {
    font-size: clamp(11.3777777778px, calc(1.1111111111vw), 21.3333333333px);
  }
}
.installment__container
  > div:last-child.installment__calculator
  > div.installment__controls
  > div.installment__payment
  > small
  a {
  text-decoration: underline;
  text-underline-offset: 2px;
  color: #59616c !important;
}
@media screen and (min-width: 1024px) {
  .installment__container
    > div:last-child.installment__calculator
    > div.installment__controls
    > div.installment__payment
    > small
    a {
    text-underline-offset: clamp(
      1.4222222222px,
      calc(0.1388888889vw),
      2.6666666667px
    );
  }
}
.installment__container > div:last-child.installment__calculator > p {
  font-family: "Century Gothic";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 162.5%;
}
@media screen and (min-width: 1024px) {
  .installment__container > div:last-child.installment__calculator > p {
    font-size: clamp(11.3777777778px, calc(1.1111111111vw), 21.3333333333px);
  }
}
.installment__container > div:last-child.installment__calculator > button {
  transition: all 0.5s cubic-bezier(0.33, 1, 0.69, 1);
  padding: 5px;
  padding-left: 15px;
  background: #1b222b;
  display: flex;
  align-items: center;
  gap: 12px;
  width: -moz-fit-content;
  width: fit-content;
  max-width: 100%;
}
@media screen and (min-width: 1024px) {
  .installment__container > div:last-child.installment__calculator > button {
    margin-right: auto;
    margin-left: 0;
    gap: clamp(8.5333333333px, calc(0.8333333333vw), 16px);
    padding: clamp(3.5555555556px, calc(0.3472222222vw), 6.6666666667px);
    padding-left: clamp(10.6666666667px, calc(1.0416666667vw), 20px);
  }
  .installment__container
    > div:last-child.installment__calculator
    > button:hover
    > span:first-child {
    color: #ffa300;
  }
  .installment__container
    > div:last-child.installment__calculator
    > button:hover
    > span:last-child {
    background: #ffa300;
  }
  .installment__container
    > div:last-child.installment__calculator
    > button:hover
    > span:last-child
    > svg {
    transform: translate(-25%, -75%);
  }
}
.installment__container
  > div:last-child.installment__calculator
  > button
  > span {
  transition: all 0.5s cubic-bezier(0.33, 1, 0.69, 1);
}
.installment__container
  > div:last-child.installment__calculator
  > button
  > span:first-child {
  color: #fff;
  font-family: "Century Gothic";
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 157.143%;
}
@media screen and (min-width: 1024px) {
  .installment__container
    > div:last-child.installment__calculator
    > button
    > span:first-child {
    font-size: clamp(9.9555555556px, calc(0.9722222222vw), 18.6666666667px);
  }
}
.installment__container
  > div:last-child.installment__calculator
  > button
  > span:last-child {
  position: relative;
  width: 50px;
  height: 50px;
  background: #fff;
  flex-shrink: 0;
}
@media screen and (min-width: 1024px) {
  .installment__container
    > div:last-child.installment__calculator
    > button
    > span:last-child {
    width: clamp(35.5555555556px, calc(3.4722222222vw), 66.6666666667px);
    height: clamp(35.5555555556px, calc(3.4722222222vw), 66.6666666667px);
  }
}
.installment__container
  > div:last-child.installment__calculator
  > button
  > span:last-child
  > svg {
  transition: all 0.5s cubic-bezier(0.33, 1, 0.69, 1);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 24px;
  height: 24px;
  fill: #1b222b;
}
@media screen and (min-width: 1024px) {
  .installment__container
    > div:last-child.installment__calculator
    > button
    > span:last-child
    > svg {
    width: clamp(17.0666666667px, calc(1.6666666667vw), 32px);
    height: clamp(17.0666666667px, calc(1.6666666667vw), 32px);
  }
}

.developer__container {
  max-width: 1920px;
  margin-inline: auto;
  padding: 90px 10px 45px;
  display: flex;
  flex-direction: column;
  gap: 40px;
}
@media screen and (min-width: 768px) {
  .developer__container {
    padding-inline: 37px;
  }
}
@media screen and (min-width: 1024px) {
  .developer__container {
    gap: clamp(42.6666666667px, calc(4.1666666667vw), 80px);
    padding-top: clamp(128px, calc(12.5vw), 240px);
    padding-bottom: clamp(42.6666666667px, calc(4.1666666667vw), 80px);
    padding-inline: clamp(
      108.0888888889px,
      calc(10.5555555556vw),
      202.6666666667px
    );
  }
}
.developer__container--head {
  display: flex;
  flex-direction: column;
  gap: 40px;
}
@media screen and (min-width: 1024px) {
  .developer__container--head {
    flex-direction: row;
    gap: clamp(85.3333333333px, calc(8.3333333333vw), 160px);
  }
}
.developer__container--head > div {
  display: flex;
  flex-direction: column;
  gap: 40px;
}
@media screen and (min-width: 1024px) {
  .developer__container--head > div {
    gap: clamp(56.8888888889px, calc(5.5555555556vw), 106.6666666667px);
    width: 60%;
  }
}
.developer__container--head > div > span {
  color: #1b222b;
  font-family: "Century Gothic";
  font-size: 54.4px;
  font-style: normal;
  font-weight: 400;
  line-height: 114.706%;
}
@media screen and (min-width: 1024px) {
  .developer__container--head > div > span {
    font-size: clamp(48.3555555556px, calc(4.7222222222vw), 90.6666666667px);
  }
}
.developer__container--head > div > h2 {
  color: #1b222b;
  font-family: "Century Gothic";
  font-size: 28.8px;
  font-style: normal;
  font-weight: 400;
  line-height: 122.222%;
}
@media screen and (min-width: 1024px) {
  .developer__container--head > div > h2 {
    text-wrap: balance;
    font-size: clamp(25.6px, calc(2.5vw), 48px);
  }
}
.developer__container--head > p {
  color: #1b222b;
  font-family: "Century Gothic";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 162.5%;
  text-wrap: balance;
}
@media screen and (min-width: 1024px) {
  .developer__container--head > p {
    font-size: clamp(11.3777777778px, calc(1.1111111111vw), 21.3333333333px);
    width: 40%;
  }
}
.developer__container--body {
  --developer-gap: 16px;
  position: relative;
  min-width: 0;
  width: var(--developer-viewport-width, 100vw);
  height: 278px;
  margin-inline: calc((100% - var(--developer-viewport-width, 100vw)) / 2);
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  overscroll-behavior-x: contain;
}
.developer__container--body::-webkit-scrollbar {
  display: none;
}
@media screen and (min-width: 1024px) {
  .developer__container--body {
    height: clamp(197.6888888889px, calc(19.3055555556vw), 370.6666666667px);
    --developer-gap: clamp(
      11.3777777778px,
      calc(1.1111111111vw),
      21.3333333333px
    );
  }
}
.developer__container--body.is-marquee {
  overflow: hidden;
  cursor: grab;
  touch-action: pan-y pinch-zoom;
  -moz-user-select: none;
  user-select: none;
  -webkit-user-select: none;
}
.developer__container--body.is-dragging {
  cursor: grabbing;
}
.developer__container--foot {
  display: flex;
  flex-direction: column;
  gap: 60px;
  padding-block: 20px;
}
@media screen and (min-width: 1024px) {
  .developer__container--foot {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding-block: unset;
    gap: clamp(42.6666666667px, calc(4.1666666667vw), 80px);
  }
}
.developer__container--foot > p {
  color: #1b222b;
  font-family: "Century Gothic";
  font-size: 22.4px;
  font-style: normal;
  font-weight: 400;
  line-height: 128.571%;
}
@media screen and (min-width: 1024px) {
  .developer__container--foot > p {
    font-size: clamp(19.9111111111px, calc(1.9444444444vw), 37.3333333333px);
  }
}
.developer__container--foot > div {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
@media screen and (min-width: 1024px) {
  .developer__container--foot > div {
    gap: clamp(7.1111111111px, calc(0.6944444444vw), 13.3333333333px);
  }
}
@media screen and (min-width: 1024px) {
  .developer__container--foot > div > a:first-child {
    margin-bottom: clamp(5.6888888889px, calc(0.5555555556vw), 10.6666666667px);
  }
  .developer__container--foot > div > a:first-child:hover > svg {
    fill: #000;
  }
}
.developer__container--foot > div > a:first-child > svg {
  transition: all 0.5s cubic-bezier(0.33, 1, 0.69, 1);
  width: 335px;
  height: 55px;
  fill: #1b222b;
}
@media screen and (min-width: 1024px) {
  .developer__container--foot > div > a:first-child > svg {
    width: clamp(180.6222222222px, calc(17.6388888889vw), 338.6666666667px);
    height: clamp(30.7057777778px, calc(2.9986111111vw), 57.5733333333px);
  }
}
.developer__container--foot > div > a:last-child {
  display: flex;
  align-items: center;
  gap: 8px;
  width: -moz-fit-content;
  width: fit-content;
  color: #ffa300;
  text-decoration: none;
  transition: color 0.3s ease;
}
@media screen and (min-width: 1024px) {
  .developer__container--foot > div > a:last-child {
    gap: clamp(5.6888888889px, calc(0.5555555556vw), 10.6666666667px);
  }
  .developer__container--foot > div > a:last-child:focus-visible {
    color: #1b222b;
  }
}
@media screen and (min-width: 1024px) and (hover: hover) and (pointer: fine) {
  .developer__container--foot > div > a:last-child:hover {
    color: #1b222b;
  }
  .developer__container--foot > div > a:last-child:hover > svg {
    transform: translate(3px, -3px);
  }
}
.developer__container--foot > div > a:last-child > span {
  color: inherit;
  font-family: "Century Gothic";
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 162.5%;
}
@media screen and (min-width: 1024px) {
  .developer__container--foot > div > a:last-child > span {
    font-size: clamp(11.3777777778px, calc(1.1111111111vw), 21.3333333333px);
  }
}
.developer__container--foot > div > a:last-child > svg {
  width: 15.56px;
  height: 15.56px;
  fill: currentColor;
  transition: transform 0.3s ease;
}
@media screen and (min-width: 1024px) {
  .developer__container--foot > div > a:last-child > svg {
    width: clamp(11.0648888889px, calc(1.0805555556vw), 20.7466666667px);
    height: clamp(11.0648888889px, calc(1.0805555556vw), 20.7466666667px);
  }
}
@media (prefers-reduced-motion: reduce) {
  .developer__container--foot > div > a:last-child {
    transition: none;
  }
  .developer__container--foot > div > a:last-child > svg {
    transform: none !important;
    transition: none;
  }
}
.developer__container--foot > div > span {
  color: #1b222b;
  font-family: "Century Gothic";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 157.143%;
}
@media screen and (min-width: 1024px) {
  .developer__container--foot > div > span {
    font-size: clamp(9.9555555556px, calc(0.9722222222vw), 18.6666666667px);
  }
}

.developer__track {
  display: flex;
  width: -moz-max-content;
  width: max-content;
  height: 100%;
}
.is-marquee .developer__track {
  will-change: transform;
}

.developer__group {
  display: flex;
  flex: 0 0 auto;
  gap: var(--developer-gap);
  height: 100%;
  padding-inline-end: var(--developer-gap);
}

.developer__slide {
  flex: 0 0 auto;
  height: 100%;
  aspect-ratio: var(--developer-ratio, 1.6);
  overflow: hidden;
  background: #e9edf5;
}
.developer__slide > picture,
.developer__slide > img,
.developer__slide > picture > img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -webkit-user-drag: none;
}

.developer__gallery-hint {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

.gallery[data-project-gallery] {
  display: block;
  margin-bottom: 0;
}
.gallery__container {
  width: 100%;
  min-width: 0;
  max-width: 1920px;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: 40px;
  padding: 90px 10px;
}
@media screen and (min-width: 768px) {
  .gallery__container {
    padding-inline: 37px;
  }
}
@media screen and (min-width: 1024px) {
  .gallery__container {
    gap: clamp(35.5555555556px, calc(3.4722222222vw), 66.6666666667px);
    padding-block: clamp(85.3333333333px, calc(8.3333333333vw), 160px);
    padding-inline: clamp(
      108.0888888889px,
      calc(10.5555555556vw),
      202.6666666667px
    );
  }
}
.gallery__container > h2 {
  color: #1b222b;
  font-family: "Century Gothic";
  font-size: 54.4px;
  font-weight: 400;
  line-height: 1.14706;
}
@media screen and (min-width: 1024px) {
  .gallery__container > h2 {
    font-size: clamp(48.3555555556px, calc(4.7222222222vw), 90.6666666667px);
  }
}
.gallery__container > div {
  position: relative;
  min-width: 0;
  height: 427px;
  touch-action: pan-y pinch-zoom;
  cursor: grab;
}
@media screen and (min-width: 1024px) {
  .gallery__container > div {
    height: clamp(426.6666666667px, calc(41.6666666667vw), 800px);
  }
}
.gallery__container > div[data-gallery-fits] {
  cursor: auto;
}
.gallery__container > div.is-dragging {
  cursor: grabbing;
}
.gallery__container > div > ul {
  position: relative;
  display: flex;
  width: 100%;
  height: 100%;
  gap: 8px;
  -moz-user-select: none;
  user-select: none;
  -webkit-user-select: none;
}
@media screen and (min-width: 1024px) {
  .gallery__container > div > ul {
    gap: clamp(5.6888888889px, calc(0.5555555556vw), 10.6666666667px);
  }
}
.gallery__container > div > ul > li {
  flex: 0 0 auto;
  height: 100%;
  aspect-ratio: var(--gallery-ratio, 3/4);
  background: #e9edf5;
}
.gallery__container > div > ul > li picture,
.gallery__container > div > ul > li img {
  display: block;
  width: 100%;
  height: 100%;
}
.gallery__container > div > ul > li img {
  -o-object-fit: contain;
  object-fit: contain;
  -webkit-user-drag: none;
}
.gallery__container > div > div {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
@media screen and (min-width: 1024px) {
  .gallery__container > div > div {
    left: clamp(-152px, calc(-7.9166666667vw), -81.0666666667px);
    right: clamp(-50.6666666667px, calc(-2.6388888889vw), -27.0222222222px);
  }
}
.gallery__container > div > div > button {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 60px;
  height: 60px;
  background: #fff;
  color: #1b222b;
  pointer-events: auto;
}
@media screen and (min-width: 1024px) {
  .gallery__container > div > div > button {
    width: clamp(42.6666666667px, calc(4.1666666667vw), 80px);
    height: clamp(42.6666666667px, calc(4.1666666667vw), 80px);
  }
}
.gallery__container > div > div > button[hidden] {
  display: none;
}
.gallery__container > div > div > button > svg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  fill: currentColor;
  width: 24px;
  height: 24px;
  transition: transform 0.35s ease;
}
@media screen and (min-width: 1024px) {
  .gallery__container > div > div > button > svg {
    width: clamp(17.0666666667px, calc(1.6666666667vw), 32px);
    height: clamp(17.0666666667px, calc(1.6666666667vw), 32px);
  }
}
.gallery__container > div > div > button:first-child {
  left: 0;
}
@media screen and (min-width: 1024px) {
  .gallery__container > div > div > button:first-child:hover > svg {
    transform: translate(-75%, -50%);
  }
}
.gallery__container > div > div > button:last-child {
  right: 0;
}
.gallery__container > div > div > button:last-child > svg {
  transform: translate(-50%, -50%) rotate(180deg);
}
@media screen and (min-width: 1024px) {
  .gallery__container > div > div > button:last-child:hover > svg {
    transform: translate(-25%, -50%) rotate(180deg);
  }
}

.progress {
  color: #1b222b;
}
.progress__container {
  max-width: 1920px;
  margin-inline: auto;
  padding: 90px 10px;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  gap: 60px;
}
@media screen and (min-width: 768px) {
  .progress__container {
    padding-inline: 37px;
  }
}
@media screen and (min-width: 1024px) {
  .progress__container {
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
    padding-block: clamp(85.3333333333px, calc(8.3333333333vw), 160px);
    padding-inline: clamp(
      26.3111111111px,
      calc(2.5694444444vw),
      49.3333333333px
    );
    gap: clamp(49.7777777778px, calc(4.8611111111vw), 93.3333333333px);
  }
}
.progress__container[data-progress-no-photos] {
  grid-template-columns: minmax(0, 1fr);
}
.progress__container > div {
  min-width: 0;
}
.progress__container > [data-progress-gallery] {
  position: relative;
  aspect-ratio: 1;
  background: #e9edf5;
  touch-action: pan-y pinch-zoom;
}
.progress__container > [data-progress-gallery] > ul {
  display: grid;
  width: 100%;
  height: 100%;
}
.progress__container > [data-progress-gallery] > ul > li {
  grid-area: 1/1;
  min-width: 0;
  min-height: 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 0;
}
.progress__container > [data-progress-gallery] > ul > li.is-current {
  opacity: 1;
  visibility: visible;
  z-index: 1;
}
.progress__container > [data-progress-gallery] > ul > li.is-entering {
  visibility: visible;
  z-index: 2;
  transition: opacity 700ms cubic-bezier(0.22, 1, 0.36, 1);
}
.progress__container
  > [data-progress-gallery]
  > ul
  > li.is-entering.is-visible {
  opacity: 1;
}
.progress__container > [data-progress-gallery] > ul > li picture,
.progress__container > [data-progress-gallery] > ul > li img {
  display: block;
  width: 100%;
  height: 100%;
}
.progress__container > [data-progress-gallery] > ul > li img {
  -o-object-fit: cover;
  object-fit: cover;
  -webkit-user-drag: none;
}
.progress__container > [data-progress-gallery] > div {
  position: absolute;
  z-index: 3;
  left: 10px;
  bottom: 10px;
  display: flex;
  gap: 4px;
}
@media screen and (min-width: 1024px) {
  .progress__container > [data-progress-gallery] > div {
    left: clamp(7.1111111111px, calc(0.6944444444vw), 13.3333333333px);
    bottom: clamp(7.1111111111px, calc(0.6944444444vw), 13.3333333333px);
    gap: clamp(2.8444444444px, calc(0.2777777778vw), 5.3333333333px);
  }
}
.progress__container > [data-progress-gallery] > div > button {
  position: relative;
  width: 60px;
  height: 60px;
  background: #fff;
  color: #00193c;
}
@media screen and (min-width: 1024px) {
  .progress__container > [data-progress-gallery] > div > button {
    width: clamp(42.6666666667px, calc(4.1666666667vw), 80px);
    height: clamp(42.6666666667px, calc(4.1666666667vw), 80px);
  }
}
.progress__container > [data-progress-gallery] > div > button > svg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 24px;
  height: 24px;
  fill: currentColor;
  transition: transform 0.35s ease;
}
@media screen and (min-width: 1024px) {
  .progress__container > [data-progress-gallery] > div > button > svg {
    width: clamp(17.0666666667px, calc(1.6666666667vw), 32px);
    height: clamp(17.0666666667px, calc(1.6666666667vw), 32px);
  }
}
@media screen and (min-width: 1024px) {
  .progress__container
    > [data-progress-gallery]
    > div
    > button:first-child:hover
    > svg {
    transform: translate(-75%, -50%);
  }
}
.progress__container > [data-progress-gallery] > div > button:last-child > svg {
  transform: translate(-50%, -50%) rotate(180deg);
}
@media screen and (min-width: 1024px) {
  .progress__container
    > [data-progress-gallery]
    > div
    > button:last-child:hover
    > svg {
    transform: translate(-25%, -50%) rotate(180deg);
  }
}
.progress__container > [data-progress-gallery] > p {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  clip-path: inset(50%);
  white-space: nowrap;
}
.progress__container > [data-progress-details] {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
}
@media screen and (min-width: 1024px) {
  .progress__container > [data-progress-details] {
    gap: clamp(28.4444444444px, calc(2.7777777778vw), 53.3333333333px);
    padding-right: clamp(
      49.7777777778px,
      calc(4.8611111111vw),
      93.3333333333px
    );
  }
}
.progress__container > [data-progress-details] > h2 {
  font-size: 38.4px;
  font-weight: 400;
  line-height: 1.21;
  text-wrap: balance;
}
@media screen and (min-width: 1024px) {
  .progress__container > [data-progress-details] > h2 {
    font-size: clamp(34.1333333333px, calc(3.3333333333vw), 64px);
  }
}
.progress__container > [data-progress-details] > ul {
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 100%;
}
@media screen and (min-width: 1024px) {
  .progress__container > [data-progress-details] > ul {
    gap: clamp(17.0666666667px, calc(1.6666666667vw), 32px);
  }
}
.progress__container > [data-progress-details] > ul > li {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
@media screen and (min-width: 1024px) {
  .progress__container > [data-progress-details] > ul > li {
    gap: clamp(5.6888888889px, calc(0.5555555556vw), 10.6666666667px);
  }
}
.progress__container > [data-progress-details] > ul > li > div:first-child {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  font-size: 21px;
  line-height: 1.4;
}
@media screen and (min-width: 1024px) {
  .progress__container > [data-progress-details] > ul > li > div:first-child {
    gap: clamp(8.5333333333px, calc(0.8333333333vw), 16px);
    font-size: clamp(14.9333333333px, calc(1.4583333333vw), 28px);
  }
}
.progress__container
  > [data-progress-details]
  > ul
  > li
  > div:first-child
  > span:last-child {
  flex-shrink: 0;
  font-size: 28px;
  font-variant-numeric: tabular-nums;
}
@media screen and (min-width: 1024px) {
  .progress__container
    > [data-progress-details]
    > ul
    > li
    > div:first-child
    > span:last-child {
    font-size: clamp(19.9111111111px, calc(1.9444444444vw), 37.3333333333px);
  }
}
.progress__container
  > [data-progress-details]
  > ul
  > li
  > div:first-child
  > span:last-child
  > b {
  font-weight: 400;
}
.progress__container > [data-progress-details] > ul > li > div:last-child {
  height: 4px;
  background: #e9edf5;
}
@media screen and (min-width: 1024px) {
  .progress__container > [data-progress-details] > ul > li > div:last-child {
    height: clamp(2.8444444444px, calc(0.2777777778vw), 5.3333333333px);
  }
}
.progress__container
  > [data-progress-details]
  > ul
  > li
  > div:last-child
  > span {
  display: block;
  width: 100%;
  height: 100%;
  background: #00193c;
  transform-origin: left center;
}
.progress__container > [data-progress-details] > span {
  font-size: 18px;
  line-height: 1.55;
}
@media screen and (min-width: 1024px) {
  .progress__container > [data-progress-details] > span {
    font-size: clamp(12.8px, calc(1.25vw), 24px);
  }
}
.progress__container > [data-progress-details] > a {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 5px 5px 5px 15px;
  max-width: 100%;
  background: #1b222b;
}
@media screen and (min-width: 1024px) {
  .progress__container > [data-progress-details] > a {
    gap: clamp(8.5333333333px, calc(0.8333333333vw), 16px);
    padding: clamp(3.5555555556px, calc(0.3472222222vw), 6.6666666667px);
    padding-left: clamp(10.6666666667px, calc(1.0416666667vw), 20px);
  }
  .progress__container > [data-progress-details] > a:hover > span:first-child {
    color: #ffa800;
  }
  .progress__container > [data-progress-details] > a:hover > span:last-child {
    background: #ffa800;
  }
  .progress__container
    > [data-progress-details]
    > a:hover
    > span:last-child
    > svg {
    transform: translate(-25%, -75%);
  }
}
.progress__container > [data-progress-details] > a > span:first-child {
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.57;
  transition: color 0.35s ease;
}
@media screen and (min-width: 1024px) {
  .progress__container > [data-progress-details] > a > span:first-child {
    font-size: clamp(9.9555555556px, calc(0.9722222222vw), 18.6666666667px);
  }
}
.progress__container > [data-progress-details] > a > span:last-child {
  position: relative;
  flex-shrink: 0;
  width: 50px;
  height: 50px;
  background: #fff;
  transition: background-color 0.35s ease;
}
@media screen and (min-width: 1024px) {
  .progress__container > [data-progress-details] > a > span:last-child {
    width: clamp(35.5555555556px, calc(3.4722222222vw), 66.6666666667px);
    height: clamp(35.5555555556px, calc(3.4722222222vw), 66.6666666667px);
  }
}
.progress__container > [data-progress-details] > a > span:last-child > svg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 24px;
  height: 24px;
  fill: #1b222b;
  transition: transform 0.35s ease;
}
@media screen and (min-width: 1024px) {
  .progress__container > [data-progress-details] > a > span:last-child > svg {
    width: clamp(17.0666666667px, calc(1.6666666667vw), 32px);
    height: clamp(17.0666666667px, calc(1.6666666667vw), 32px);
  }
}

.standards {
  background: #1b222b;
}
.planning + .standards {
  box-shadow: 0 -2px 0 #1b222b;
}
.standards__container {
  max-width: 1920px;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: 40px;
  padding: 90px 10px;
}
@media screen and (min-width: 768px) {
  .standards__container {
    padding-inline: 37px;
  }
}
@media screen and (min-width: 1024px) {
  .standards__container {
    flex-direction: row;
    gap: clamp(49.7777777778px, calc(4.8611111111vw), 93.3333333333px);
    padding-block: clamp(85.3333333333px, calc(8.3333333333vw), 160px);
    padding-inline: clamp(
      108.0888888889px,
      calc(10.5555555556vw),
      202.6666666667px
    );
  }
}
.standards__container > div {
  flex: 1 1 0;
  min-width: 0;
}
.standards__container > div:first-child {
  display: flex;
  flex-direction: column;
  gap: 40px;
}
@media screen and (min-width: 1024px) {
  .standards__container > div:first-child {
    justify-content: space-between;
    gap: clamp(56.8888888889px, calc(5.5555555556vw), 106.6666666667px);
  }
}
.standards__container > div:first-child > h2 {
  color: #fff;
  font-family: "Century Gothic";
  font-size: 44px;
  font-style: normal;
  font-weight: 400;
  line-height: 114.706%;
  text-wrap: balance;
}
@media screen and (min-width: 375px) {
  .standards__container > div:first-child > h2 {
    font-size: 54.4px;
  }
}
@media screen and (min-width: 1024px) {
  .standards__container > div:first-child > h2 {
    font-size: clamp(48.3555555556px, calc(4.7222222222vw), 90.6666666667px);
  }
}
.standards__container > div:first-child > [data-standards-image] {
  order: 2;
  flex-shrink: 0;
  width: 100%;
  height: 245px;
}
@media screen and (min-width: 768px) {
  .standards__container > div:first-child > [data-standards-image] {
    height: 500px;
  }
}
@media screen and (min-width: 1024px) {
  .standards__container > div:first-child > [data-standards-image] {
    order: 1;
    height: clamp(273.2003555556px, calc(26.6797222222vw), 512.2506666667px);
  }
}
.standards__container > div:first-child > [data-standards-image] picture,
.standards__container > div:first-child > [data-standards-image] img {
  display: block;
  width: 100%;
  height: 100%;
}
.standards__container > div:first-child > [data-standards-image] img {
  -o-object-fit: cover;
  object-fit: cover;
}
.standards__container > div:first-child > p {
  order: 1;
  color: #fff;
  font-family: "Century Gothic";
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 155.556%;
}
@media screen and (min-width: 1024px) {
  .standards__container > div:first-child > p {
    order: 2;
    font-size: clamp(12.8px, calc(1.25vw), 24px);
  }
}
.standards__container > div:last-child > ul > li {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 20px;
  padding-block: 28px;
  border-bottom: 1px solid #6c7b93;
}
@media screen and (min-width: 1024px) {
  .standards__container > div:last-child > ul > li {
    padding-block: clamp(
      27.0222222222px,
      calc(2.6388888889vw),
      50.6666666667px
    );
    gap: clamp(28.4444444444px, calc(2.7777777778vw), 53.3333333333px);
    border-width: clamp(0.7111111111px, calc(0.0694444444vw), 1.3333333333px);
  }
}
.standards__container > div:last-child > ul > li > div {
  flex-shrink: 0;
  width: 60px;
  height: 60px;
  background: #a7bad7;
  -webkit-mask: var(--icon) center/contain no-repeat;
  mask: var(--icon) center/contain no-repeat;
}
@media screen and (min-width: 1024px) {
  .standards__container > div:last-child > ul > li > div {
    width: clamp(56.8888888889px, calc(5.5555555556vw), 106.6666666667px);
    height: clamp(56.8888888889px, calc(5.5555555556vw), 106.6666666667px);
  }
}
.standards__container > div:last-child > ul > li > p {
  color: #fff;
  font-family: "Century Gothic";
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 155.556%;
}
@media screen and (min-width: 1024px) {
  .standards__container > div:last-child > ul > li > p {
    font-size: clamp(12.8px, calc(1.25vw), 24px);
  }
}

.infrastructure {
  color: #1b222b;
}
.infrastructure__container {
  max-width: 1920px;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: 60px;
  padding: 90px 10px;
}
@media screen and (min-width: 768px) {
  .infrastructure__container {
    padding-inline: 37px;
  }
}
@media screen and (min-width: 1024px) {
  .infrastructure__container {
    padding-block: clamp(85.3333333333px, calc(8.3333333333vw), 160px);
    padding-inline: clamp(
      108.0888888889px,
      calc(10.5555555556vw),
      202.6666666667px
    );
    gap: clamp(85.3333333333px, calc(8.3333333333vw), 160px);
  }
}
.infrastructure__container > div:first-child {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
@media screen and (min-width: 1024px) {
  .infrastructure__container > div:first-child {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: flex-end;
    gap: clamp(5.6888888889px, calc(0.5555555556vw), 10.6666666667px);
  }
}
.infrastructure__container > div:first-child > h2 {
  min-width: 0;
  font-size: 44px;
  font-weight: 400;
  line-height: 1.14706;
  overflow-wrap: anywhere;
  text-wrap: balance;
}
@media screen and (min-width: 375px) {
  .infrastructure__container > div:first-child > h2 {
    font-size: 54.4px;
  }
}
@media screen and (min-width: 1024px) {
  .infrastructure__container > div:first-child > h2 {
    flex: 1 1 0;
    font-size: clamp(48.3555555556px, calc(4.7222222222vw), 90.6666666667px);
  }
}
.infrastructure__container > div:first-child > p {
  font-size: 22.4px;
  line-height: 1.28571;
}
@media screen and (min-width: 1024px) {
  .infrastructure__container > div:first-child > p {
    flex: 1 1 0;
    min-width: 0;
    font-size: clamp(19.9111111111px, calc(1.9444444444vw), 37.3333333333px);
    padding-left: clamp(
      78.2222222222px,
      calc(7.6388888889vw),
      146.6666666667px
    );
  }
}
.infrastructure__container > [data-infrastructure-scene] {
  --infrastructure-cut: 60px;
  --infrastructure-inset: 36px;
  --infrastructure-dot: 8px;
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  gap: 100px;
}
@media screen and (min-width: 768px) {
  .infrastructure__container > [data-infrastructure-scene] {
    --infrastructure-cut: 75px;
    gap: 140px;
  }
}
@media screen and (min-width: 1024px) {
  .infrastructure__container > [data-infrastructure-scene] {
    gap: 0;
    --infrastructure-cut: clamp(
      71.1111111111px,
      calc(6.9444444444vw),
      133.3333333333px
    );
    --infrastructure-inset: clamp(25.6px, calc(2.5vw), 48px);
    --infrastructure-dot: clamp(
      5.6888888889px,
      calc(0.5555555556vw),
      10.6666666667px
    );
  }
}
.infrastructure__container > [data-infrastructure-scene] > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  gap: 40px;
}
@media screen and (min-width: 768px) {
  .infrastructure__container > [data-infrastructure-scene] > div {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    -moz-column-gap: 8px;
    column-gap: 8px;
    row-gap: 0;
  }
}
@media screen and (min-width: 1024px) {
  .infrastructure__container > [data-infrastructure-scene] > div {
    -moz-column-gap: clamp(
      5.6888888889px,
      calc(0.5555555556vw),
      10.6666666667px
    );
    column-gap: clamp(5.6888888889px, calc(0.5555555556vw), 10.6666666667px);
  }
}
.infrastructure__container
  > [data-infrastructure-scene]
  > div
  > [data-infrastructure-image] {
  position: relative;
  min-width: 0;
  width: 100%;
  height: 244px;
  background: #e9edf5;
}
@media screen and (min-width: 1024px) {
  .infrastructure__container
    > [data-infrastructure-scene]
    > div
    > [data-infrastructure-image] {
    height: clamp(288px, calc(28.125vw), 540px);
  }
}
.infrastructure__container
  > [data-infrastructure-scene]
  > div
  > [data-infrastructure-image]
  picture,
.infrastructure__container
  > [data-infrastructure-scene]
  > div
  > [data-infrastructure-image]
  img {
  display: block;
  width: 100%;
  height: 100%;
}
.infrastructure__container
  > [data-infrastructure-scene]
  > div
  > [data-infrastructure-image]
  img {
  -o-object-fit: cover;
  object-fit: cover;
}
.infrastructure__container
  > [data-infrastructure-scene]
  > div
  > [data-infrastructure-image]
  > span {
  position: absolute;
  width: 0;
  height: 0;
  pointer-events: none;
}
.infrastructure__container
  > [data-infrastructure-scene]
  > div
  > [data-infrastructure-copy] {
  position: relative;
  z-index: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 36px;
}
@media screen and (min-width: 768px) {
  .infrastructure__container
    > [data-infrastructure-scene]
    > div
    > [data-infrastructure-copy] {
    gap: 28px;
  }
}
@media screen and (min-width: 1024px) {
  .infrastructure__container
    > [data-infrastructure-scene]
    > div
    > [data-infrastructure-copy] {
    gap: clamp(25.6px, calc(2.5vw), 48px);
  }
}
.infrastructure__container
  > [data-infrastructure-scene]
  > div
  > [data-infrastructure-copy]
  > svg {
  display: block;
  flex-shrink: 0;
  width: 181px;
  height: 54px;
  max-width: 100%;
  fill: #001e49;
}
@media screen and (min-width: 1024px) {
  .infrastructure__container
    > [data-infrastructure-scene]
    > div
    > [data-infrastructure-copy]
    > svg {
    width: clamp(128.7111111111px, calc(12.5694444444vw), 241.3333333333px);
    height: clamp(38.4px, calc(3.75vw), 72px);
  }
}
.infrastructure__container
  > [data-infrastructure-scene]
  > div
  > [data-infrastructure-copy]
  > div {
  width: 100%;
  max-width: 320px;
  font-size: 16px;
  line-height: 1.625;
  overflow-wrap: anywhere;
}
@media screen and (min-width: 768px) {
  .infrastructure__container
    > [data-infrastructure-scene]
    > div
    > [data-infrastructure-copy]
    > div {
    max-width: none;
    font-size: 14px;
    line-height: 1.5;
  }
}
@media screen and (min-width: 1024px) {
  .infrastructure__container
    > [data-infrastructure-scene]
    > div
    > [data-infrastructure-copy]
    > div {
    line-height: 1.625;
    font-size: clamp(11.3777777778px, calc(1.1111111111vw), 21.3333333333px);
  }
}
.infrastructure__container
  > [data-infrastructure-scene]
  > div
  > [data-infrastructure-copy]
  > div
  > *
  + * {
  margin-top: 16px;
}
@media screen and (min-width: 1024px) {
  .infrastructure__container
    > [data-infrastructure-scene]
    > div
    > [data-infrastructure-copy]
    > div
    > *
    + * {
    margin-top: clamp(14.2222222222px, calc(1.3888888889vw), 26.6666666667px);
  }
}
.infrastructure__container
  > [data-infrastructure-scene]
  > div
  > [data-infrastructure-copy]
  > div
  ul,
.infrastructure__container
  > [data-infrastructure-scene]
  > div
  > [data-infrastructure-copy]
  > div
  ol {
  padding-left: 20px;
}
@media screen and (min-width: 1024px) {
  .infrastructure__container
    > [data-infrastructure-scene]
    > div
    > [data-infrastructure-copy]
    > div
    ul,
  .infrastructure__container
    > [data-infrastructure-scene]
    > div
    > [data-infrastructure-copy]
    > div
    ol {
    padding-left: clamp(14.2222222222px, calc(1.3888888889vw), 26.6666666667px);
  }
}
.infrastructure__container
  > [data-infrastructure-scene]
  > div
  > [data-infrastructure-copy]
  > div
  ul {
  list-style: disc;
}
.infrastructure__container
  > [data-infrastructure-scene]
  > div
  > [data-infrastructure-copy]
  > div
  ol {
  list-style: decimal;
}
.infrastructure__container
  > [data-infrastructure-scene]
  > div
  > [data-infrastructure-copy]
  > div
  a {
  color: #001e49;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.infrastructure__container
  > [data-infrastructure-scene]
  > div[data-infrastructure-card="forint"]
  > [data-infrastructure-image] {
  clip-path: polygon(
    0 0,
    100% 0,
    100% calc(100% - var(--infrastructure-cut)),
    calc(100% - var(--infrastructure-cut)) 100%,
    0 100%
  );
}
.infrastructure__container
  > [data-infrastructure-scene]
  > div[data-infrastructure-card="forint"]
  > [data-infrastructure-image]
  > span {
  right: var(--infrastructure-cut);
  bottom: 0;
}
@media screen and (min-width: 1024px) {
  .infrastructure__container
    > [data-infrastructure-scene]
    > div[data-infrastructure-card="forint"]
    > [data-infrastructure-image]
    > span {
    right: 0;
    top: var(--infrastructure-inset);
    bottom: auto;
  }
}
.infrastructure__container
  > [data-infrastructure-scene]
  > div[data-infrastructure-card="forint"]
  > [data-infrastructure-copy] {
  padding-right: 60px;
}
@media screen and (min-width: 768px) {
  .infrastructure__container
    > [data-infrastructure-scene]
    > div[data-infrastructure-card="forint"]
    > [data-infrastructure-copy] {
    padding-inline: 40px 0;
  }
}
@media screen and (min-width: 1024px) {
  .infrastructure__container
    > [data-infrastructure-scene]
    > div[data-infrastructure-card="forint"]
    > [data-infrastructure-copy] {
    padding-left: clamp(
      78.2222222222px,
      calc(7.6388888889vw),
      146.6666666667px
    );
    padding-right: clamp(
      14.2222222222px,
      calc(1.3888888889vw),
      26.6666666667px
    );
  }
}
.infrastructure__container
  > [data-infrastructure-scene]
  > div[data-infrastructure-card="korona"]
  > [data-infrastructure-image] {
  order: 1;
  clip-path: polygon(
    var(--infrastructure-cut) 0,
    100% 0,
    100% 100%,
    0 100%,
    0 var(--infrastructure-cut)
  );
}
.infrastructure__container
  > [data-infrastructure-scene]
  > div[data-infrastructure-card="korona"]
  > [data-infrastructure-image]
  > span {
  left: 0;
  top: var(--infrastructure-cut);
}
@media screen and (min-width: 768px) {
  .infrastructure__container
    > [data-infrastructure-scene]
    > div[data-infrastructure-card="korona"]
    > [data-infrastructure-image]
    > span {
    top: auto;
    bottom: var(--infrastructure-inset);
  }
}
.infrastructure__container
  > [data-infrastructure-scene]
  > div[data-infrastructure-card="korona"]
  > [data-infrastructure-copy] {
  width: min(320px, 100% - 44px);
  margin-left: auto;
}
@media screen and (min-width: 768px) {
  .infrastructure__container
    > [data-infrastructure-scene]
    > div[data-infrastructure-card="korona"]
    > [data-infrastructure-copy] {
    width: auto;
    margin-left: 0;
    padding-inline: 0 100px;
  }
}
@media screen and (min-width: 1024px) {
  .infrastructure__container
    > [data-infrastructure-scene]
    > div[data-infrastructure-card="korona"]
    > [data-infrastructure-copy] {
    padding-left: clamp(
      81.7777777778px,
      calc(7.9861111111vw),
      153.3333333333px
    );
    padding-right: clamp(
      71.1111111111px,
      calc(6.9444444444vw),
      133.3333333333px
    );
  }
}
.infrastructure__container
  > [data-infrastructure-scene]
  > div[data-infrastructure-card="korona"]
  > [data-infrastructure-copy]
  > svg {
  height: 48px;
}
@media screen and (min-width: 1024px) {
  .infrastructure__container
    > [data-infrastructure-scene]
    > div[data-infrastructure-card="korona"]
    > [data-infrastructure-copy]
    > svg {
    height: clamp(34.1333333333px, calc(3.3333333333vw), 64px);
  }
}
.infrastructure__container > [data-infrastructure-scene] > svg {
  position: absolute;
  z-index: 2;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  overflow: visible;
  opacity: 0;
  pointer-events: none;
}
.infrastructure__container > [data-infrastructure-scene] > svg > path {
  stroke: #6c7b93;
  stroke-width: 1px;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
}
@media screen and (min-width: 1024px) {
  .infrastructure__container > [data-infrastructure-scene] > svg > path {
    stroke-width: clamp(0.7111111111px, calc(0.0694444444vw), 1.3333333333px);
  }
}
.infrastructure__container > [data-infrastructure-scene] > svg > g {
  opacity: 0;
  transition: opacity 350ms ease;
}
.infrastructure__container > [data-infrastructure-scene] > svg > g > circle {
  r: var(--infrastructure-dot);
  fill: #001e49;
}
.infrastructure__container
  > [data-infrastructure-scene]
  > svg
  > g
  > [data-infrastructure-ring] {
  transform-box: fill-box;
  transform-origin: center;
  animation: infrastructure-pulse 3.6s ease-out infinite;
  animation-play-state: paused;
  opacity: 0;
}
.infrastructure__container
  > [data-infrastructure-scene]
  > svg
  > g
  > [data-infrastructure-ring="2"] {
  animation-delay: 1.8s;
}
.infrastructure__container
  > [data-infrastructure-scene][data-infrastructure-ready]
  > svg {
  opacity: 1;
}
.infrastructure__container
  > [data-infrastructure-scene][data-line-started]
  > svg
  > [data-infrastructure-point="forint"],
.infrastructure__container
  > [data-infrastructure-scene][data-line-complete]
  > svg
  > [data-infrastructure-point="korona"] {
  opacity: 1;
}
.infrastructure__container
  > [data-infrastructure-scene][data-line-started][data-infrastructure-playing]
  > svg
  > [data-infrastructure-point="forint"]
  > [data-infrastructure-ring],
.infrastructure__container
  > [data-infrastructure-scene][data-line-complete][data-infrastructure-playing]
  > svg
  > [data-infrastructure-point="korona"]
  > [data-infrastructure-ring] {
  animation-play-state: running;
}
.infrastructure__container
  > [data-infrastructure-scene][data-infrastructure-reduced]
  > svg
  > g
  > [data-infrastructure-ring] {
  animation: none;
  opacity: 0.16;
  transform: scale(3);
}
.infrastructure__container
  > [data-infrastructure-scene][data-infrastructure-reduced]
  > svg
  > g
  > [data-infrastructure-ring][data-infrastructure-ring="2"] {
  display: none;
}

@keyframes infrastructure-pulse {
  0% {
    transform: scale(1);
    opacity: 0.24;
  }
  85%,
  100% {
    transform: scale(3.6);
    opacity: 0;
  }
}
.contact {
  --contact-travel: 24px;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #1b222b;
}
.contact::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: -18%;
  pointer-events: none;
  background: radial-gradient(
    ellipse at 63.16% 35.44%,
    #2d507a 0%,
    rgba(45, 80, 122, 0) 76%
  );
  animation: contact-glow-drift 31s ease-in-out infinite;
  animation-play-state: paused;
}
.contact[data-contact-active]::before {
  animation-play-state: running;
}
.contact > [data-contact-art] {
  position: absolute;
  z-index: 1;
  right: -12.5%;
  bottom: calc(-1 * var(--contact-travel));
  width: max(125%, 800px);
  pointer-events: none;
}
.contact > [data-contact-art] picture,
.contact > [data-contact-art] img {
  display: block;
  width: 100%;
  height: auto;
}
@media screen and (min-width: 1024px) {
  .contact {
    --contact-travel: clamp(34.1333333333px, calc(3.3333333333vw), 64px);
  }
}
.contact__container {
  position: relative;
  z-index: 2;
  max-width: 1920px;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: 60px;
  padding: 90px 10px 230px;
}
@media screen and (min-width: 768px) {
  .contact__container {
    gap: 90px;
    padding-inline: 37px;
  }
}
@media screen and (min-width: 1024px) {
  .contact__container {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: start;
    min-height: clamp(
      675.5555555556px,
      calc(65.9722222222vw),
      1266.6666666667px
    );
    gap: clamp(35.5555555556px, calc(3.4722222222vw), 66.6666666667px);
    padding-inline: clamp(
      108.0888888889px,
      calc(10.5555555556vw),
      202.6666666667px
    );
    padding-top: clamp(64px, calc(6.25vw), 120px);
    padding-bottom: clamp(
      35.5555555556px,
      calc(3.4722222222vw),
      66.6666666667px
    );
  }
}
@media screen and (min-width: 1024px) {
  .contact__container > div:first-child {
    grid-column: 2;
    grid-row: 1;
    padding-top: clamp(35.5555555556px, calc(3.4722222222vw), 66.6666666667px);
  }
}
.contact__container > div:first-child > h2 {
  max-width: 310px;
  color: #fff;
  font-family: "Century Gothic";
  font-size: 22.4px;
  font-style: normal;
  font-weight: 400;
  line-height: 128.571%;
}
@media screen and (min-width: 1024px) {
  .contact__container > div:first-child > h2 {
    max-width: clamp(199.8222222222px, calc(19.5138888889vw), 374.6666666667px);
    font-size: clamp(19.9111111111px, calc(1.9444444444vw), 37.3333333333px);
  }
}
.contact__container > div:last-child {
  min-width: 0;
  width: 100%;
  background: #fff;
  display: flex;
  flex-direction: column;
  gap: 25px;
  padding: 40px 20px;
  max-width: 564px;
}
@media screen and (min-width: 768px) {
  .contact__container > div:last-child {
    padding: 60px 50px;
  }
}
@media screen and (min-width: 1024px) {
  .contact__container > div:last-child {
    grid-column: 1;
    grid-row: 1;
    max-width: unset;
    padding: clamp(56.8888888889px, calc(5.5555555556vw), 106.6666666667px);
    gap: clamp(17.7777777778px, calc(1.7361111111vw), 33.3333333333px);
  }
}
.contact__container > div:last-child .site-forms .ap-contact--inline {
  width: 100%;
  max-width: none;
  padding: 0;
  overflow: visible;
}
.contact__container
  > div:last-child
  .site-forms
  .ap-contact--inline
  [data-site-form-content] {
  max-width: none;
  margin: 0;
}
.contact__container
  > div:last-child
  .site-forms
  .ap-contact--inline
  .wpcf7-form {
  margin-top: 0;
}
.contact__container > div:last-child > h3 {
  color: #1b222b;
  font-family: "Century Gothic";
  font-size: 28.8px;
  font-style: normal;
  font-weight: 400;
  line-height: 122.222%;
}
@media screen and (min-width: 1024px) {
  .contact__container > div:last-child > h3 {
    font-size: clamp(25.6px, calc(2.5vw), 48px);
  }
}
.contact__container > div:last-child > p {
  color: #1b222b;
  font-family: "Century Gothic";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 162.5%;
}
@media screen and (min-width: 1024px) {
  .contact__container > div:last-child > p {
    font-size: clamp(11.3777777778px, calc(1.1111111111vw), 21.3333333333px);
  }
}
@media (prefers-reduced-motion: reduce) {
  .contact {
    --contact-travel: 0px;
  }
  .contact::before {
    animation: none;
  }
}

@keyframes contact-glow-drift {
  0%,
  100% {
    transform: translate3d(-4%, -2%, 0) scale(1.04);
    opacity: 0.9;
  }
  23% {
    transform: translate3d(5%, 3%, 0) scale(1.1);
    opacity: 1;
  }
  49% {
    transform: translate3d(-2%, 5%, 0) scale(1.06);
    opacity: 0.92;
  }
  72% {
    transform: translate3d(4%, -4%, 0) scale(1.12);
    opacity: 0.97;
  }
  88% {
    transform: translate3d(-5%, 1%, 0) scale(1.06);
    opacity: 0.86;
  }
}
.instagram__container {
  max-width: 1920px;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: 40px;
  padding: 45px 10px 90px;
}
@media screen and (min-width: 768px) {
  .instagram__container {
    padding: 90px 37px;
  }
}
@media screen and (min-width: 1024px) {
  .instagram__container {
    padding-block: clamp(85.3333333333px, calc(8.3333333333vw), 160px);
    padding-inline: clamp(
      108.0888888889px,
      calc(10.5555555556vw),
      202.6666666667px
    );
    gap: clamp(35.5555555556px, calc(3.4722222222vw), 66.6666666667px);
  }
}
.instagram__container > h2 {
  color: #1b222b;
  font-family: "Century Gothic";
  font-size: 54.4px;
  font-style: normal;
  font-weight: 400;
  line-height: 114.706%;
}
@media screen and (min-width: 1024px) {
  .instagram__container > h2 {
    font-size: clamp(48.3555555556px, calc(4.7222222222vw), 90.6666666667px);
  }
} /*# sourceMappingURL=home.css.map */