/*
  Theme Name: DCB Heating & A/C
  Author: Whetham Solutions
  Author URI: https://whethamsolutions.com
  Description: Wordpress theme for DCB Heating & A/C. Use of this theme outside of this company's website is strictly prohibited.
  Template: ion
  Text Domain: dcb
*/

.why-choose ul {
  justify-content: center;
  display: flex;
}

.why-choose ul li {
  margin: 0;
  display: flex;
  align-items: center;
}

.hero {
    height: auto !important;
    padding-top: clamp(150px, 10.416666666666666vw, 200px) !important;
}

.fancy-list ul {
  padding: 0;
  list-style: none;
}

.fancy-list ul li {
  margin: 0 0 clamp(10px, 0.78125vw, 15px);
  padding: 0 0 0 clamp(23.333333333333332px, 1.8229166666666667vw, 35px);
  position: relative;
}

.fancy-list ul li:before {
  content: '';
  display: block;
  width: clamp(16px, 1.3541666666666667vw, 26px);
  height: clamp(16px, 1.3541666666666667vw, 26px);
  position: absolute;
  top: 1px;
  left: 0;
  background-image: url(i/icons/icon-fancylist.svg);
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: center;
}

.fancy-list ul li:last-of-type {
  margin: 0;
}

#priceContainer, #wcuContainer > .elementor-element {
  margin: clamp(33.333333333333336px, 2.6041666666666665vw, 50px) 0 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  grid-gap: 30px;
}

#priceContainer .price-card,
#wcuContainer .wcu-card {
  width: calc(25% - 25px);
}

#priceContainer .price-card {
  background: #080912;
  box-shadow: 0 0 clamp(23.333333333333px, 1.8229166666667vw, 35px) rgba(33, 162, 255, .5);
  border-radius: clamp(6.6666666666667px, .52083333333333vw, 10px);
  border: solid #fff;
  padding: clamp(20px, 1.5625vw, 30px);
  text-align: center;
  background-image: url(i/flame-bg.svg);
  background-repeat: no-repeat;
  background-position: bottom right;
  background-size: clamp(66.66666666666667px, 5.208333333333333vw, 100px);
}

#priceContainer .price-card > .elementor-element,
#priceContainer .price-card > .elementor-element > .elementor-widget-container {
  height: 100%;
}

#priceContainer .price-card > .elementor-element > .elementor-widget-container {
  display: flex;
  flex-direction: column;
}

#priceContainer .price-card h3 {
  font-size: clamp(23.333333333333332px, 1.8229166666666667vw, 35px);
  margin: 0 0 10px;
}

#priceContainer .price-card h3 + p:not(:last-child) {
  font-size: 15px;
}

#priceContainer p:last-child {
  margin-top: auto;
}

#priceContainer p strong {
  font-size: clamp(26.666666666666668px, 2.0833333333333335vw, 40px);
}

#priceContainer p strong em {
  font-size: clamp(10px, 0.78125vw, 15px);
}

#wcuContainer .wcu-card .elementor-icon {
  background-color: #0e1020;
  display: flex;
  width: clamp(100px, 7.8125vw, 150px);
  height: clamp(100px, 7.8125vw, 150px);
  margin: 0 auto clamp(16.666666666666668px, 1.3020833333333333vw, 25px);
  align-items: center;
  justify-content: center;
  border-radius: 100%;
}

#wcuContainer .wcu-card .elementor-icon svg {
  display: block;
  width: clamp(50px, 3.90625vw, 75px);
  height: clamp(50px, 3.90625vw, 75px);
}

.service-title h1+p {
  color: #FFF;
}

#radon.service-title {
  padding: clamp(85px, 11.979166666666666vw, 230px) 30px clamp(30px, 6.25vw, 120px);
  background-image: url(i/radon-bg.jpg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

#radon.service-title h1 {
  margin-top: 0;
}

#radon .service-title-image {
  overflow: hidden;
  opacity: 0;
}

#radon .service-title-image img {
  display: block;
  border-radius: 100% !important;
  margin: 0 auto;
}

#radon .service-title-image .elementor-widget-container:after {
  content: none;
}

#header .navigation ul li:first-child {
  margin-right: clamp(5px,.52083333333333vw,10px) !important;
}

#header .navigation ul li:not(:first-child,.nav-phone) {
  padding: 0 clamp(3px, 0.78125vw, 15px) !important;
}

#header .navigation ul li a {
  font-size: clamp(12px, 0.9375vw, 18px) !important;
}

#header .navigation ul li#menu-item-102 a svg {
  width: clamp(12px, 1.5104166666666667vw, 29px);
  height: clamp(12px, 1.5104166666666667vw, 29px);
}

#header .navigation ul li a em {
  font-style: normal;
  display: none;
}

.service-outro ul {
  grid-gap: 25px !important;
}

.service-outro li, .service-outro li:not(:first-child, :nth-child(2)) {
  margin: 0 !important;
}

.service-outro ul li a {
  color: #585858;
}

.service-outro ul li a:hover,
.service-outro ul li a:focus {
  color: var(--primary);
}

@media (max-width: 1600px) {
  .fancy-list ul li:before {
    top: 3px;
  }
}

@media (max-width: 1024px) {
  #priceContainer .price-card,
  #wcuContainer .wcu-card {
    width: calc(50% - 25px);
  }
}

@media (max-width: 991px) {
  #header .navigation ul #menu-item-99 a span {
    display: none;
  }
  #header .navigation ul li a em {
    display: block;
  }
  #header .navigation ul li:not(:first-child,.nav-phone) {
    padding: 0 3px !important;
  }
  .service-outro ul {
    grid-gap: 0 !important;
  }
  .service-outro ul li a {
    justify-content: flex-start !important;
    align-items: flex-start !important;
  }
}

@media (max-width: 767px) {
  .hero,.service-title {
    height: auto !important;
    padding-top: 50px !important;
  }
  .pg-title {
    padding: 50px 30px !important;
  }
  .hero,.pg-title,.service-title {
    margin: 77px 0 0 !important;
  }
  .admin-bar .hero,.admin-bar .pg-title,.admin-bar .service-title {
    margin: calc(77px - 46px) 0 0 !important;
  }
  .why-choose ul {
    flex-direction: column;
  }
  .why-choose ul li {
    justify-content: center;
  }
  #priceContainer .price-card,
  #wcuContainer .wcu-card {
    width: 100%;
  }
  #wcuContainer .wcu-card .elementor-icon {
    width: clamp(60px, 7.8125vw, 150px);
    height: clamp(60px, 7.8125vw, 150px);
  }
  #wcuContainer .wcu-card .elementor-icon svg {
    width: clamp(30px, 3.90625vw, 75px);
    height: clamp(30px, 3.90625vw, 75px);
  }
  #radon.service-title {
    background-image: unset;
    background-repeat: unset;
    background-position: unset;
    background-size: unset;
    background-color: var(--dark);
  }
  #radon.service-title h1 {
    margin-top: 0;
  }
  #radon .service-title-image {
    opacity: 1;
  }
  #radon .service-title-image {
    order: -1;
  }
  #radon .service-title-image img {
    margin: 0 auto 40px !important;
  }
  #header .navigation ul li a {
    font-size: 15px !important;
  }
}

@media (max-width: 500px) {
  #pricing .elementor-button-wrapper {
    justify-content: center !important;
  }
}