/*
  Theme Name: IBW Child Theme 2025
  Description: Custom Theme for Turf Tint
  Author: Infinity Business Web
  Author URI: https://www.infinitybusinessweb.com
  Version: 2.25
 	License: GPL-2.0+
	License URI: http://www.opensource.org/licenses/gpl-license.php
*/

@font-face {
  font-family: 'Bemock';
  src: url('fonts/Bemock.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
	--color-green: #2e7d3d;
  --color-gold: #d1b133;
  --color-blue: #1f4b88;
  --color-gray: #f7f7f7;
  --text-color:#222;
  --body-font:'Poppins', sans-serif;
  --heading-font:'Poppins', sans-serif;
  --header-height:200px;
}

body {
    background-color:#fff;
    color:var(--text-color);
	  font-size:1.6rem;
    line-height: 1.88;
    font-family:var(--body-font);
    /* overflow: visible; */
}

section {
	line-height: 1;
  position: relative;
}

h1, h2, h3, h4, h5, p, ul {
	margin-top: 0;
  font-family:var(--heading-font);
}

h1 {
  font-size:4.8rem;
  line-height:1.1;
}

h2 {
  color:var(--color-green);
  font-size:clamp(3rem, 1.786vw + 2.429rem, 5rem);
  line-height:1.2;
}

p {
	margin: 0 0 3.1rem;
  line-height:1.6;
}

p:last-child {
  margin-bottom:0;
}

figcaption{
  text-align: center;
}

.page-heading {
  font-size:4rem;
  line-height:1.38;
  font-family:var(--heading-font);
}



/*
* Base CSS for Search Functionality
* Last Update: 2022-11-11
*/


/* Search icon - color and position as needed */
.search-icon {
  display: block;
  position: absolute;
  right: 45px;
  top: 60px;
  transform:translateY(-50%);
  z-index: 2;
  transition:.4s ease-in all;
}

.stuck .search-icon {}

.search-icon {
  color:#222;
  cursor: pointer;
}

.search-icon i {
  font-size:22px;
}

.search-icon svg {
  width:50px!important;
  height:50px;
}


/* Search overlay - color as needed */
.search-overlay {
  position:fixed;
  top: 0;
  bottom:0;
  left:0;
  right:0;
  z-index: 9999999999990;
  background: rgba(255,255,255,.9);
  width:100%;
  height:0;
  display:flex;
  overflow: hidden;
  justify-content: center;
  align-items: center;
  transition:.4s ease-in all;
  opacity: 0;
  
}

.search-overlay.active {
  height:100%;
  opacity:1;
}

.search-close {
  position: absolute;
  right:3.3rem;
  top:5.2rem;
  color:#222;
  font-size:36px;
  font-weight:bold;
  cursor: pointer;
}


/* Search overlay form - color as needed */
.search-overlay > form {
  display:flex;
  width:100%;
  max-width:640px;
  justify-content: space-between;
  align-items: stretch;
}

.search-overlay > form > input {
  width:100%;
  background:transparent;
  border:none;
  border-bottom:1px solid #222;
  font-size:24px;
  color:#222;
  padding:20px;
}

.search-overlay > form > button {
  width:200px;
  margin-left:20px;
  font-size:20px;
  font-weight:700;
  letter-spacing:2px;
  text-transform: uppercase;
  background:#222;
  color:#fff;
  border:none;
  border-radius:6px;
  cursor: pointer;
}

.search-overlay > form > button:hover {
  background:#fff;
  color:#222;
}


/* Mobile search form - style and color as needed */
.mobile-search-form {
  display:flex;
  width:100%;
  max-width:100%;
  justify-content: space-between;
  align-items: stretch;
}

.mobile-search-form > input {
  width:100%;
  background:rgba(255,255,255,.2);
  border:1px solid #eee;
  font-size:18px;
  color:#fff;
  padding:8px;
  font-weight:400;
}

.mobile-search-form > button {
  width:120px;
  margin-left:20px;
  font-size:18px;
  font-weight:400;
  letter-spacing:2px;
  text-transform: uppercase;
  color:#fff;
  border:none;
  border-radius:3px;
  cursor: pointer;
}

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: var(--text-color);
  opacity: .7; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: var(--text-color);
  opacity: .7;
}

::-ms-input-placeholder { /* Microsoft Edge */
  color: var(--text-color);
  opacity: .7;
}

.icon-color {
  fill:var(--text-color);
}

#menu-footer li a {
  font-size: 11px;
  font-weight: 200;
}

.row {
  display:flex;
  gap:3rem;
}

.container {
  display:flex;
  justify-content: center;
}

.col {
  flex-direction:column;
  align-items:center;
}

.col p, .col h2 {
  text-align:center;
}

.button {
  display:inline-block;
  color:#fff;
  font-weight:600;
  font-size:1.6rem;
  background:var(--color-gold);
  border-radius:4px;
  text-align:center;
  padding:1.2rem 3rem;
  text-decoration:none;
  margin:0;
  transition:.5s ease all;
}

.button:hover {
  background:var(--color-green);
  transition:.5s ease all;
}

/*------------------------- Custom styles ----------------------------------*/
header {
  height:var(--header-height);
  display: flex;
  background-color: #fff;
  transition: all 0.6s ease;
  margin: auto;
  z-index:10;
  /* position: sticky;
  top: 0; */
}
/* header.stuck {
  position: sticky;
} */
.header-container {
  position:relative;
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  padding-inline: 3rem;
  max-width: 1400px;
  margin-inline: auto;
  transition: all 0.6s ease;
  column-gap: 2rem;
}

.nav-area {
  display:flex;
}

.nav-primary {
  position:relative;
  transform:none;
  top:auto;
  margin:0 1rem;
}

/* .nav-area {
  position:absolute;
  top:50%;
  right:6rem;
  transform:translateY(-50%);
} */

.logo {
  width:100%;
  max-width:215px;
  display: block;
  position: relative;
  top: auto;
  right: auto;
  left: auto;
  transform: none;
  /* line-height: 1; */
  transition: all 0.6s ease;
}
.logo img {
  display: block;
}

.hero, .hero.innerpage {
  /* height:calc(100vh - var(--header-height)); */
  display: grid;
  min-height: 500px;
  position: relative;
}
.hero::before, .hero.innerpage::before {
  content: "";
  background-color: rgba(0, 0, 0, 0.15);
  grid-area: 1 / 1;
  z-index: 1;
}
.hero.innerpage::before {
  background-color: transparent;
}
.hero img, .hero.innerpage img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.hero .container, .hero.innerpage .container {
  justify-content: center;
  align-items: center;
  grid-area: 1 / 1;
  z-index: 2;
  padding: 4rem;
}

.hero-content {
  color:#fff;
  text-align: center;
}
.hero-content h1 {
  font-size: 4rem;
}
.hero-content p {
  font-size:2rem;
  max-width: 65ch;
  line-height: 1.5;
  margin-bottom: 2rem;
}

.hero-buttons {
  text-align:center;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.hero-buttons p {
  font-size:1.8rem;
  margin-bottom:2.4rem;
}

.hero-buttons a {
  text-transform:uppercase;
  font-weight:500;
  letter-spacing:.4px;
  font-size:2rem;
  width: fit-content;
  padding-block: 2rem;
}

.hero-buttons-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 2rem;
}

.home-form {
  border-radius:2rem;
  background:rgba(255,255,255,.78);
  padding:3rem;
}

/* .hero.innerpage {
  height:auto;
} */

.hero.innerpage h1 {
  color:#fff;
  text-align: center;
}

.card-container {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.card-container a {
  width: fit-content;
}

footer {
  background:var(--color-green);
  padding:6rem 0 1.6rem;
}

footer .container {
  color:#fff;
  gap:6rem;
  align-items:center;
  justify-content: center;
}

.col-3 {
  width:100%;
  max-width:33.3%;
}

footer .footer-logo {
  max-width:280px;
  margin-bottom:2rem;
}
.footer-form {
  color:var(--color-green);
}

.footer-form textarea {
  height:100px!important;
}

footer h3 {
  font-size:2.6rem;
  text-transform:uppercase;
  font-weight:600;
}

.footer-form h3 {
  text-align:center;
}

#menu-footer-menu {
  margin:0;
  padding:0;
  list-style:none;
  color:#fff;
}

#menu-footer-menu li a {
  font-size:2rem;
  color:#fff;
  padding:.4rem 0;
  transition:.5s ease all;
}

#menu-footer-menu li a:hover {
  border-bottom:1px solid #fff;
}

footer p {
  line-height:1.4;
}

footer .copyright {
  color:#fff;
  text-align:center;
  padding:0 3rem;
  margin-top: 6rem;
}

footer .copyright a {
  color:#fff;
  font-weight:600;
  text-decoration:none;
}

footer .copyright a:hover {
  color:var(--color-gold);
}

.extra {
  padding-top: 8rem;
}

.gallery {
  padding:8rem 0;
}

.container.innerpage {
  padding:8rem 6rem;
  gap:6rem;
}
.no-sidebar {
  justify-content: center;
}

.innerpage .content {
  width:100%;
  max-width:66.6%;
}

.innerpage .sidebar {
  width:100%;
  max-width:33.3%;
}

aside.contact, .footer-form {
  padding:3rem;
  border-radius:20px;
  background-color:var(--color-gray);
}

aside h3, .footer-form h3 {
  text-align:center;
  line-height:1.2;
  color:var(--text-color);
  font-size:2.8rem;
}

aside h3 > span, .footer-form h3 > span {
  text-transform:uppercase;
  color:var(--color-green);
}

.footer-form h3 {
  font-size:2.2rem;
}

.gform_button {
  border:none;
}

aside .gform_wrapper.gravity-theme .gfield_required .gfield_required_custom, aside .gform_wrapper.gravity-theme .gfield_required .gfield_required_text {
  font-style:normal;
  opacity:.66
}

.gform_required_legend {
    text-align: center;
    font-size: 1.4rem;
    color: black;
    margin-bottom: 1rem;
    margin-top: -1rem;
}

.explanation, .lawn-prep {
  padding:8rem 0;
  background-color:var(--color-gray);
}

.benefits {
  padding:8rem 0;
}
.benefits ul {
  line-height: 2;
}

img.rounded {
  display:block;
  border-radius:20px;
}

.gap-60 {
  gap:60px;
}

.col-2 {
  align-content: center;
}

footer .container .col-2 {
    max-width: 400px;
    text-align: center;
  }

.col-2 ul {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  line-height: 1.4;
}
.bold {
  font-weight: 600;
}
.residential-header {
    object-position: 50% 65%;
  }

@media screen and (max-width:1150px){
  footer .container {
    /* flex-direction: column; */
    flex-wrap: wrap;
    justify-content: center;
    gap: 3rem;
  }
  .form-container {
    order: -1;
  }
  .links-container {
    order: 1;
    text-align: right;
  }
  .contact-footer-container {
    order: 10;
    text-align: center;
  }
  /* .residential-header {
    object-position: 50% 50%;
  } */

}


@media screen and (max-width:1023px){

  .container.innerpage {
    padding:8rem 4rem;
    gap:4rem;
  }

  .gap-60 {
    gap:40px;
  }

}

@media screen and (max-width:767px){
  .explanation .container, .benefits .container {
    flex-direction: column;
  }
  
  footer .container .col-2 {
    max-width: 100%;
  }
  .links-container {
    text-align: center;
  }
  .container.innerpage {
    padding:6rem 2rem;
    flex-direction:column;
  }

  .innerpage .content, .innerpage .sidebar {
    max-width:100%;
  }

  .hero-buttons-wrapper {
    row-gap: 2rem;
  }

  .hero-buttons a {
    padding-block: 2rem;
  }

  .gap-60 {
    gap:20px;
  }

  .last {
    order:99;
  }

}

@media screen and (max-width:600px) {
  .gallery .row {
    flex-direction: column;
    row-gap: 6rem;
  }
  .gallery .card-container > div {
    max-width: 450px;
  }
}