/*
  Homepage heading colours and sizes.
  Change the values in the body.home block. This file loads only on the homepage.
  Sizes can be px, vw, dvw, or clamp().
*/

body.home {
  /* Hero slide titles */
  --home-hero-title-size: 70px;
  --home-hero-title-color: #fff;

  /* Explore: "EXPLORE OUR" */
  --home-explore-title-size: clamp(36px, 100px, 15dvw);
  --home-explore-kicker-color: #EFEBE3;

  --home-title-size: clamp(18px, 6dvw, 36px);
  --home-title-color: #7B7A6F;

  --home-subtitle-size: clamp(48px, 6dvw, 72px);
  --home-subtitle-color: #7B7A6F;

  /* Designed for Country Living */
  --home-edit-title-color: #fff;
  --home-edit-subtitle-color: #fff;
  --home-gifts-heading-color: #fff;
  --home-instagram-title-color: #000;
}

@media (max-width: 1704px) {
  body.home {
    --home-hero-title-size: 8vw;
  }
}

@media (max-width: 992px) {
  body.home {
    --home-hero-title-size: 12vw;
  }
}

body.home .slider-hero-block .content .container .top h1 {
  font-size: var(--home-hero-title-size) !important;
  color: var(--home-hero-title-color) !important;
}

body.home section.explore .content h2 {
  color: var(--home-explore-kicker-color);
}

body.home section.explore .content h3 {
  font-size: var(--home-explore-title-size);
  color: var(--home-title-color);
}

body.home .inspired-by .content h3 {
  font-size: var(--home-title-size);
  color: var(--home-title-color);
}

body.home .inspired-by .content h4 {
  font-size: var(--home-subtitle-size);
  color: var(--home-subtitle-color);
}

body.home .home-all-products h2 {
  font-size: var(--home-title-size);
  color: var(--home-subtitle-color);
}

body.home .home-all-products h3 {
  font-size: var(--home-title-size);
  color: var(--home-title-color);
}

body.home .edit-home h2 {
  color: var(--home-edit-title-color);
}

body.home .edit-home h3,
body.home .edit-home h4 {
  color: var(--home-edit-subtitle-color);
}

body.home section.gifts-finder .content :is(h2, h3, h4) {
  color: var(--home-gifts-heading-color);
}

body.home .wp-block-heading {
  color: var(--home-instagram-title-color);
}