
#app {
  background: var(--color-background);
}
.container {
  max-width: 1400px;
  margin: 0 auto;
  padding: var(--padding-container-main);
  @media (max-width: 560px) {
    padding: var(--padding-container-mobile);
  }
}
.home {
  position: relative;
}
div img {
  width: 100%;
  overflow: hidden;
}
h1, h2, h3, h4 {
  hyphens: auto;
}
.home-page :is(h1, h2, h3, h4, h5, h6) {
  line-height: 1;
}
.hero-form,
.final-form {
  padding: 18px;
  border-radius: 8px;
  box-shadow: var(--shadow-soft);
  background: var(--gradient-surface);
  background-size: cover, cover;
  background-position: center, center;
}
.form-card {
  background: var(--surface-card);
  color: var(--text-strong);
  border: 1px solid var(--border-subtle);
}

.form-card h3,
.form-card .form-title {
  color: var(--text-strong);
}

.form-card p,
.form-card .form-sub {
  color: var(--text-muted);
}

.form-card label {
  color: var(--text-muted);
  font-weight: 600;
}

.form-card input {
  background: var(--input-bg);
  color: var(--text-strong);
  border: 1px solid var(--input-border);
}

.form-card input::placeholder {
  color: var(--text-muted);
}

.form-card input:focus {
  outline: none;
  box-shadow: 0 0 0 4px var(--focus-ring);
  border-color: transparent;
}

.footer-disclaimers {
  width: 100%;
  text-align: center;
}

.footer-disclaimers .footer-disclaimer-bottom {
  margin-top: 8px;
}

/* Hovarn homepage palette and section treatments from the supplied design. */
.home-page {
  --color-main: #f0efe8;
  --color-background: #171a19;
  --color-background-second: #758f79;
  --color-text: #f0efe8;
  --color-text-second: #c7e8b4;
  --color-accent: #c7e8b4;
  --btn-text: #353b36;
  --border-color: #758f79;
  --gradient-main: #353b36;
  --gradient-second: #c7e8b4;
  --form-background: rgb(240 239 232 / 70%);
  --intro-color-text: #f0efe8;
  --btn-border-radius: 8px;
  --h1-size-main: clamp(36px, 5vw, 68px);
  --color-highlight: #fcfb7d;
  background: var(--color-background);
}

.home-page .header {
  background: rgb(23 26 25 / 94%);
  border-color: #353b36;
}

.home-page .logo-text {
  display: block;
  background: none;
  color: var(--color-main);
  -webkit-text-fill-color: currentColor;
  text-transform: uppercase;
}

.home-page .nav-link { color: var(--color-main); }
.home-page .nav-link:hover { color: var(--color-accent); }
.home-page .burger-btn span { background: var(--color-main); }
.home-page .lang-menu, .home-page .burger-menu { background: #353b36; }
.home-page .burger-menu a:hover { background: rgb(199 232 180 / 12%); }

.home-page .intro {
  padding: 60px 0 30px;
  border-radius: 0;
  background: #171a19 url('../img/Rectangle%2034625371.webp') center / cover no-repeat;
}

.home-page:not(.about-page):not(.contact-page) .intro:not(.intro--final) {
  background-image: linear-gradient(rgb(23 26 25 / 60%), rgb(23 26 25 / 60%)), url('../img/Rectangle%2034625371.webp');
}

.home-page .intro--final {
  background-image: url('../img/Rectangle%2034625373.webp');
  padding-bottom: 60px;
}

.home-page .intro_content { max-width: 800px; }
.home-page .intro_title { letter-spacing: -1.5px; }
.home-page .intro_title span { color: var(--color-accent); }
.home-page .intro_description { opacity: .65; }
.home-page .intro_features svg { flex-shrink: 0; }
.home-page .intro_features img { width: 24px; height: 24px; flex-shrink: 0; object-fit: contain; }
.home-page .intro_form { width: 100%; flex: 0 0 480px; }

.home-page .form_card {
  color: #353b36;
  border: 1px solid rgb(117 143 121 / 55%);
  backdrop-filter: blur(10px);
}

.home-page .form_title, .home-page .form_group label,
.home-page .form_privacy { color: #353b36; }
.home-page .form_group input { background: #f0efe8; color: #353b36; }
.home-page .form_group input::placeholder { color: #758f79; }
.home-page .form_group input:focus { border-color: #758f79; box-shadow: 0 0 0 3px rgb(199 232 180 / 35%); }
.home-page .btn_submit { opacity: 1; }
.home-page .btn_submit:hover { background: #fcfb7d; box-shadow: 0 4px 12px rgb(199 232 180 / 25%); }
.home-page .btn-register:hover { background: #fcfb7d; }

.home-page .calc-section {
  margin-top: 0;
  padding: 48px 0 24px;
  background: linear-gradient(180deg, #171a19, #758f79 58%, #c7e8b4);
}

.home-page .calc-section::before { display: none; }
.home-page .calc-section__container > p { color: #f0efe8; opacity: .75; }
.home-page .calc-form, .home-page .calc-results__profit {
  background: #f0efe8;
  color: #353b36;
  --color-text: #353b36;
  --calc-label-color: #353b36;
  --calc-profit-title: #353b36;
  --calc-percent-color: #758f79;
}

.home-page .calc-results__final {
  background: linear-gradient(120deg, #353b36, #758f79);
  color: #f0efe8;
}

.home-page .calc-results__icon { color: #fcfb7d; }
.home-page .calc-results__profit-icon-wrap { background: #758f79; }
.home-page .calc-results__profit-icon { color: #fcfb7d; }
.home-page .calc-slider__background,
.home-page .calc-results__profit-bar-track { background: #353b36; }
.home-page .calc-slider__progress,
.home-page .calc-results__profit-bar-fill { background: #758f79; box-shadow: none; }
.home-page .calc-disclaimer { padding-bottom: 0; }
.home-page .calc-disclaimer__text { color: #353b36; }
.home-page .calc-disclaimer__icon { color: #353b36; }

.home-page .textimg {
  background: #f0efe8;
  --color-text: #171a19;
  padding: 48px 0 40px;
}

.home-page .textimg_image {
  position: relative;
  aspect-ratio: 1200 / 577;
  overflow: hidden;
  border-radius: 8px;
}
.home-page .textimg_image img {
  position: absolute;
  top: -6.9324%;
  left: -4%;
  width: 108%;
  max-width: none;
  height: auto;
  box-shadow: none;
}
.home-page .textimg_wrapper { display: grid; grid-template-columns: 1fr 1fr; gap: 24px 40px; }
.home-page .textimg_content { display: contents; }
.home-page .textimg_title { grid-column: 1 / -1; max-width: 900px; margin-bottom: 0; }
.home-page .textimg_text { grid-column: 1; }
.home-page .textimg_image { grid-column: 2; }
.home-page .textimg_text { color: #353b36; opacity: .75; }
.home-page:not(.about-page) .textimg_title {
  width: 100%;
  max-width: none;
  text-align: center;
}
.home-page:not(.about-page) .textimg_image {
  width: 100%;
  max-width: none;
  align-self: center;
  justify-self: stretch;
}
.home-page .cards_wrapper { padding-top: 48px; }
.home-page .cards_subtitle { margin-bottom: 30px; font-size: 18px; font-weight: 400; }
.home-page .cards_block { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.home-page .card {
  width: 100%;
  background: #f0efe8;
  --color-text: #353b36;
}

.home-page .card_img { background: none; border-radius: 0; }
.home-page .card_img img { width: 100%; height: 100%; object-fit: contain; }
.home-page .cols {
  margin: 0;
  padding: 40px 0 20px;
  border-radius: 0;
  background: linear-gradient(180deg, #171a19, #758f79);
}

.home-page .cols_subtitle { text-align: center; margin-bottom: 30px; }
.home-page .cols_block_element { background: #f0efe8; --color-text: #353b36; border-width: 1px; }
.home-page .list-block {
  padding-top: 60px;
  background: #171a19 url('../img/Background.webp') center top / cover no-repeat;
}

.home-page .list-block_subtitle { text-align: center; margin-bottom: 30px; }
.home-page .list-block_list { width: 100%; }
.home-page .list-block_item { background: #758f79; border-radius: 12px; }
.home-page .list-block_number { color: #353b36; }
.home-page .numbre { padding-top: 48px; }
.home-page .numbre_grid { color: #353b36; gap: 24px 0; background: #C7E8B4; }
.home-page .numbre_item { color: #353b36; width: 33.333%; }
.home-page .numbre_item:last-child { width: 100%; }
.home-page .slider-container { padding: 40px 0 0; }
.home-page .slider-container > p { text-align: center; margin-bottom: 30px; }
.home-page .styles_carouselReviewCard__YIr6O {
  background: #f0efe8;
  color: #353b36;
  border: 1px solid #758f79;
  border-radius: 12px;
  height: 100%;
  --CDS-color-semantic-surface-foreground-default: #353b36;
  --CDS-color-semantic-surface-default: #f0efe8;
}

.home-page .swiper-wrapper { align-items: stretch; }
.home-page .swiper-slide { height: auto; }
.home-page .swiper-pagination-bullet { background: #758f79 !important; }
.home-page .swiper-pagination-bullet-active { background: #c7e8b4 !important; }
.home-page .review-expand-button { color: #353b36 !important; }
.home-page .faq {
  padding: 48px 0 24px;
  background: linear-gradient(180deg, #f0efe8, #c7e8b4);
  --color-text: #171a19;
}

.home-page .faq_item { background: #f0efe8; border-color: #758f79; }
.home-page .faq_question { color: #353b36; }
.home-page .faq_item.is-open { border-color: #758f79; }
.home-page .faq_answer-content { color: #353b36; }
.home-page .footer { margin-top: 0; border-top: 0; background: linear-gradient(180deg, #171a19, #353b36); }
.home-page .modal-content { background: #f0efe8; color: #353b36; }
.home-page .modal-button { background: #c7e8b4; color: #353b36; }

@media (max-width: 1024px) {
  .home-page .intro_form { flex: auto; max-width: 480px; }
  .home-page .intro_content { max-width: 100%; }
  .home-page .cards_block { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-page .textimg_wrapper { grid-template-columns: 1fr; }
  .home-page .textimg_image { grid-column: 1; }
}

@media (max-width: 640px) {
  .home-page .intro { padding: 40px 0; background-position: 60% center; }
  .home-page .intro_title { letter-spacing: -.5px; }
  .home-page .calc-section { padding: 24px 0; }
  .home-page .cards_block { grid-template-columns: 1fr; }
  .home-page .card_img { min-width: 40px; max-width: 40px; }
  .home-page .numbre_item, .home-page .numbre_item:last-child { width: 50%; }
  .home-page .numbre_grid { gap: 16px 0; }
  .home-page .list-block_item { flex-direction: row; }
}

/* About page sections. */
.about-page {
  --h1-size-main: clamp(36px, 4.3vw, 64px);
}

.about-page .intro {
  background-image: linear-gradient(rgb(23 26 25 / 60%), rgb(23 26 25 / 60%)), url('../img/nano-banana-2_Create_a_bold_mixed-media_advertising_visual_combining_realistic_portrait_photog-0%201.webp');
  padding-bottom: 36px;
}

.about-page .intro_description { opacity: .65; }
.about-page .intro--final {
  background-image: linear-gradient(rgb(23 26 25 / 60%), rgb(23 26 25 / 60%)), url('../img/Rectangle%2034625374.webp');
  padding: 80px 0 60px;
}

.about-page .textimg {
  background: linear-gradient(160deg, #f0efe8, #c7e8b4);
  padding-block: 40px;
}

.about-page .textimg_title {
  color: #171a19;
  width: 100%;
  max-width: none;
  text-align: center;
}
.about-page .textimg_image {
  align-self: start;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}
.about-page .list-block { background: #171a19; padding-top: 60px; }
.about-page .list-block_item { background: #c7e8b4; border-color: #758f79; }
.about-page .list-block_item-title,
.about-page .list-block_item-desc { color: #353b36; }
.about-page .list-block_item-title { font-weight: 500; }
.about-page .list-block_number { background: #758f79; color: #f0efe8; }
.about-page .cols { padding-top: 40px; }
.about-page .cols_title { color: #f0efe8; }
.about-page .cols_block_element { border: 2px solid #353b36; }
.about-page .cols_block_element_head { font-weight: 500; }

@media (max-width: 640px) {
  .about-page .intro { padding: 40px 0; }
  .about-page .intro--final { background-position: 65% center; }
  .about-page .textimg { padding-block: 32px; }
  .about-page .list-block { padding-top: 40px; }
}

/* Contact page section treatments from the supplied design. */
.contact-page .intro {
  background-image: linear-gradient(rgb(23 26 25 / 60%), rgb(23 26 25 / 60%)), url('../img/nano-banana-2_Create_a_bold_mixed-media_advertising_visual_combining_realistic_portrait_photog-0%202.webp');
  padding-bottom: 36px;
}


.contact-page .cards_wrapper { padding-top: 48px; }
.contact-page .cards_block { gap: 16px 48px; }
.contact-page .card_text_head { font-weight: 500; }
.contact-page .cols {
  padding-top: 48px;
  background: linear-gradient(180deg, #171a19, #758f79 65%, #c7e8b4);
}

.contact-page .cols_title { color: #f0efe8; }
.contact-page .cols_block_element { border: 2px solid #758f79; }
.contact-page .cols_block_element_head { font-weight: 500; }

@media (max-width: 1024px) {
  .contact-page .cards_block { gap: 16px; }
}

@media (max-width: 640px) {
  .contact-page .intro { padding: 40px 0; }
}

/* Registration consent uses the form's dark green text and pale green accent. */
.home-page .cg-consent {
  display: flex;
  align-items: flex-start;
  gap: .6rem;
  color: #353b36;
  font-size: .9rem;
  line-height: 1.45;
  cursor: pointer;
}
.home-page .cg-consent a {
  color: #353b36;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.home-page .cg-consent a:hover { color: #171a19; }
.home-page .cg-consent input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  flex: 0 0 auto;
  width: 1.15rem;
  height: 1.15rem;
  margin: .12em 0 0;
  padding: 0;
  border: 1.5px solid #758f79;
  border-radius: .35rem;
  background: #f0efe8;
  cursor: pointer;
  display: grid;
  place-content: center;
}
.home-page .cg-consent input[type="checkbox"]::before {
  content: "";
  width: .65rem;
  height: .65rem;
  transform: scale(0);
  transition: transform .12s ease;
  background: #353b36;
  clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
}
.home-page .cg-consent input[type="checkbox"]:checked {
  border-color: #758f79;
  background: var(--color-accent);
}
.home-page .cg-consent input[type="checkbox"]:checked::before { transform: scale(1); }
.home-page .cg-consent input[type="checkbox"]:focus-visible {
  outline: 2px solid #353b36;
  outline-offset: 3px;
}
.home-page [data-gate-submit]:disabled,
.home-page [data-gate-submit].is-disabled {
  opacity: .5;
  cursor: not-allowed;
  pointer-events: none;
}
.home-page [data-gate-error="true"] .cg-consent input[type="checkbox"]:not(:checked) {
  border-color: #dc2626;
  box-shadow: 0 0 0 3px rgb(220 38 38 / 15%);
}
@media (prefers-reduced-motion: reduce) {
  .home-page .cg-consent input[type="checkbox"]::before { transition: none; }
}

/* Shared spacing, following the semvic-multy landing pages. */
.home-page {
  --section-space: 60px;
  --heading-space: 24px;
  --content-space: 32px;
  --layout-gap: 24px;
}

.home-page > :is(.intro, .calc-section, .textimg, .cards, .cols, .list-block, .numbre, .faq, .footer) {
  padding: var(--section-space) 0;
  margin: 0;
}

.home-page :is(.cards_wrapper, .slider-container) { padding: 0; }
.home-page :is(.cards_title, .cols_title, .list-block_title) {
  margin: 0 0 var(--heading-space);
}
.home-page :is(.numbre_title, .faq_title, .cards_subtitle, .cols_subtitle, .list-block_subtitle) {
  margin: 0 0 var(--content-space);
}
.home-page .intro_title { margin-bottom: var(--heading-space); }
.home-page .intro_description { margin-bottom: var(--content-space); }

/* The title occupies its own grid row, so row-gap supplies its spacing. */
.home-page .textimg_wrapper { gap: var(--heading-space) var(--layout-gap); }
.home-page .textimg_title { margin: 0; }
.home-page .calc-section__container > h2 { margin: 0 0 var(--heading-space); }
.home-page .calc-section__container > p { margin: 0 0 var(--content-space); }
.home-page .calc-section__grid { gap: var(--layout-gap); margin-top: 0; }
.home-page .cards_block { gap: var(--layout-gap); }
.home-page .cols_block {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--layout-gap);
}
.home-page .cols_block_element { width: auto; }
.home-page .list-block_list { max-width: none; gap: var(--layout-gap); }
.home-page .swiper-wrapper { padding-bottom: var(--content-space); }
.home-page .footer-grid { gap: var(--layout-gap); margin-bottom: var(--content-space); }

/* Statistics and reviews share the same background and one vertical gap. */
.home-page > .numbre + .cards { padding-top: 0; }

@media (max-width: 768px) {
  .home-page {
    --section-space: 40px;
    --heading-space: 20px;
    --content-space: 24px;
    --layout-gap: 16px;
  }
  .home-page .cards_block { grid-template-columns: 1fr; }
}

@media (max-width: 660px) {
  .home-page .cols_block { grid-template-columns: 1fr; }
}
