/* starter.scss */
/* Styles specific to the starter header/footer template. */
/* utils/_variables.scss */
/* Single source of truth: Tailwind themes.css defines --vars, SCSS references them */
/* utils/_functions.scss */
/* utils/_mixins.scss */
.header-search {
  display: inline-block;
  position: relative;
}
.header-search .frm-container {
  display: flex;
  align-items: center;
  position: relative;
  border: 1px solid var(--color-gray-200);
  border-radius: var(--radius-lg);
  background-color: var(--color-gray-50);
  padding: 4px;
}
:where(.dark, .dark *) .header-search .frm-container {
  border-color: var(--color-gray-700);
  background-color: var(--color-gray-900);
}
.header-search .frm-container input {
  flex: 1;
  border: none;
  background: transparent;
  padding: 6px 12px;
  font-size: 14px;
  outline: none;
  color: var(--color-gray-900);
}
:where(.dark, .dark *) .header-search .frm-container input {
  color: var(--color-white);
}
.header-search .frm-container input::placeholder {
  color: var(--color-gray-400);
}
.header-search .frm-container input:focus {
  box-shadow: none;
}
.header-search .frm-container .btn-s {
  background: transparent;
  border: none;
  cursor: pointer;
  color: var(--color-gray-500);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px;
  border-radius: var(--radius-md);
  transition: color 0.2s, background-color 0.2s;
}
:where(.dark, .dark *) .header-search .frm-container .btn-s {
  color: var(--color-gray-400);
}
.header-search .frm-container .btn-s:hover {
  color: var(--color-gray-900);
  background-color: var(--color-gray-100);
}
:where(.dark, .dark *) .header-search .frm-container .btn-s:hover {
  color: var(--color-white);
  background-color: var(--color-gray-800);
}
.header-search .frm-container .btn-s span {
  display: none;
}
.header-search .frm-container .btn-s svg {
  width: 18px;
  height: 18px;
}

.breadcrumbs {
  list-style: none;
  padding: 0;
  margin: 0;
}
.breadcrumbs li {
  display: inline-flex;
  align-items: center;
}
.breadcrumbs li::after {
  content: "/";
  margin-left: 12px;
  margin-right: 12px;
  color: var(--color-gray-300);
  font-weight: normal;
}
:where(.dark, .dark *) .breadcrumbs li::after {
  color: var(--color-gray-700);
}
.breadcrumbs li:last-child::after {
  display: none;
}
.breadcrumbs li a {
  color: var(--color-gray-500);
  text-decoration: none;
  transition: color 0.2s;
}
:where(.dark, .dark *) .breadcrumbs li a {
  color: var(--color-gray-400);
}
.breadcrumbs li a:hover {
  color: var(--color-primary, #fe5242);
}
:where(.dark, .dark *) .breadcrumbs li a:hover {
  color: var(--color-teal-400);
}
.breadcrumbs li.current {
  color: var(--color-gray-900);
  font-weight: 600;
}
:where(.dark, .dark *) .breadcrumbs li.current {
  color: var(--color-white);
}

.suggestion-list ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.suggestion-list li {
  position: relative;
  padding-left: 20px;
}
.suggestion-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 8px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background-color: var(--color-gray-400);
}
:where(.dark, .dark *) .suggestion-list li::before {
  background-color: var(--color-gray-600);
}
.suggestion-list li a.title {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--color-gray-700);
  text-decoration: none;
  transition: color 0.2s;
  line-clamp: 2;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
:where(.dark, .dark *) .suggestion-list li a.title {
  color: var(--color-gray-300);
}
.suggestion-list li a.title:hover {
  color: var(--color-primary, #fe5242);
}
:where(.dark, .dark *) .suggestion-list li a.title:hover {
  color: var(--color-teal-400);
}

.hero-slider .swiper-slide {
  width: 100%;
  flex: 0 0 100%;
}

.news-slider .news-slide {
  height: auto;
  width: calc(76.9230769231% - 0.2307692308rem);
}
@media only screen and (min-width: 48rem) {
  .news-slider .news-slide {
    width: calc(50% - 0.5rem);
  }
}
@media only screen and (min-width: 64rem) {
  .news-slider .news-slide {
    width: calc(33.3333333333% - 0.6666666667rem);
  }
}
.news-slider .swiper-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
}
.news-slider .swiper-pagination {
  position: relative;
  bottom: 0;
  margin: 0 8px;
}

@keyframes intro-bounce-slow {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-8px);
  }
}
@keyframes intro-spin-slow {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.animate-bounce-slow {
  animation: intro-bounce-slow 4s ease-in-out infinite;
}

.animate-spin-slow {
  animation: intro-spin-slow 25s linear infinite;
}

.intro-hero-card {
  transition: border-color 0.5s ease, box-shadow 0.5s ease;
}
.intro-hero-card:hover {
  border-color: color-mix(in srgb, var(--color-primary) 30%, transparent);
  box-shadow: 0 20px 50px -12px color-mix(in srgb, var(--color-primary) 15%, transparent);
}
:where(.dark, .dark *) .intro-hero-card:hover {
  border-color: color-mix(in srgb, var(--color-teal-400) 30%, transparent);
  box-shadow: 0 20px 50px -12px color-mix(in srgb, var(--color-teal-400) 25%, transparent);
}

.hde-step-progress__dot--active::before {
  border-color: var(--color-primary, #fe5242) !important;
  background: var(--color-primary, #fe5242) !important;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--color-primary, #fe5242) 20%, transparent) !important;
}
:where(.dark, .dark *) .hde-step-progress__dot--active::before {
  border-color: var(--color-teal-400, #2dd4bf) !important;
  background: var(--color-teal-400, #2dd4bf) !important;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--color-teal-400, #2dd4bf) 20%, transparent) !important;
}
.hde-step-progress__dot--done::before {
  border-color: var(--color-primary, #fe5242) !important;
  background: var(--color-primary, #fe5242) !important;
}
:where(.dark, .dark *) .hde-step-progress__dot--done::before {
  border-color: var(--color-teal-400, #2dd4bf) !important;
  background: var(--color-teal-400, #2dd4bf) !important;
}
.hde-step-progress__dot--done + .hde-step-progress__dot::after {
  background: var(--color-primary, #fe5242) !important;
}
:where(.dark, .dark *) .hde-step-progress__dot--done + .hde-step-progress__dot::after {
  background: var(--color-teal-400, #2dd4bf) !important;
}
.hde-step-progress__dot--active .hde-step-progress__dot__label {
  color: var(--color-primary, #fe5242) !important;
}
:where(.dark, .dark *) .hde-step-progress__dot--active .hde-step-progress__dot__label {
  color: var(--color-teal-400, #2dd4bf) !important;
}

[data-step].hde-step--active {
  animation: starter-fade-in 0.4s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes starter-fade-in {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
[data-dropzone] .hde-dropzone-area {
  border-color: var(--color-gray-200) !important;
  background: var(--color-gray-50) !important;
  transition: border-color 0.25s, background-color 0.25s !important;
}
:where(.dark, .dark *) [data-dropzone] .hde-dropzone-area {
  border-color: var(--color-gray-800) !important;
  background: var(--color-gray-900) !important;
}
[data-dropzone] .hde-dropzone-area:hover {
  border-color: var(--color-primary, #fe5242) !important;
  background: color-mix(in srgb, var(--color-primary, #fe5242) 3%, transparent) !important;
}
:where(.dark, .dark *) [data-dropzone] .hde-dropzone-area:hover {
  border-color: var(--color-teal-400, #2dd4bf) !important;
  background: color-mix(in srgb, var(--color-teal-400, #2dd4bf) 5%, transparent) !important;
}
[data-dropzone] .hde-dropzone-area p {
  color: var(--color-gray-800) !important;
}
:where(.dark, .dark *) [data-dropzone] .hde-dropzone-area p {
  color: var(--color-gray-200) !important;
}
[data-dropzone].hde-dropzone--dragover .hde-dropzone-area {
  border-color: var(--color-primary, #fe5242) !important;
  background: color-mix(in srgb, var(--color-primary, #fe5242) 6%, transparent) !important;
}
:where(.dark, .dark *) [data-dropzone].hde-dropzone--dragover .hde-dropzone-area {
  border-color: var(--color-teal-400, #2dd4bf) !important;
  background: color-mix(in srgb, var(--color-teal-400, #2dd4bf) 10%, transparent) !important;
}
[data-dropzone] .hde-dropzone-file {
  background: var(--color-gray-100) !important;
  color: var(--color-gray-800) !important;
  border: 1px solid var(--color-gray-200) !important;
}
:where(.dark, .dark *) [data-dropzone] .hde-dropzone-file {
  background: var(--color-gray-800) !important;
  color: var(--color-gray-200) !important;
  border-color: var(--color-gray-700) !important;
}
[data-dropzone] .hde-dropzone-file__size {
  color: var(--color-gray-500) !important;
}
:where(.dark, .dark *) [data-dropzone] .hde-dropzone-file__size {
  color: var(--color-gray-400) !important;
}
[data-dropzone] .hde-dropzone-file__remove {
  color: var(--color-red-500, #ef4444) !important;
}
[data-dropzone] .hde-dropzone-file__remove:hover {
  background: color-mix(in srgb, var(--color-red-500, #ef4444) 10%, transparent) !important;
}
[data-dropzone] .hde-dropzone-error {
  background: rgba(239, 68, 68, 0.1) !important;
  color: var(--color-red-500, #ef4444) !important;
  border: 1px solid color-mix(in srgb, var(--color-red-500, #ef4444) 20%, transparent) !important;
  font-weight: 500;
}
:where(.dark, .dark *) [data-dropzone] .hde-dropzone-error {
  background: color-mix(in srgb, var(--color-red-500, #ef4444) 15%, transparent) !important;
}

@media (width >= 768px) {
  .site-footer [data-fx-accordion-item]:not(.is-active) [data-fx-accordion-content] {
    opacity: 1;
    max-height: none;
    overflow: visible;
    display: block;
  }
}