/*
Theme Name: IDv4
Theme URI: 
Author: AnnMarie DeVito - Green Closet Creative
Author URI: 
Description: A custom curated block theme built by Green Closet Creative.
Requires at least: 6.8
Tested up to: 6.8
Requires PHP: 5.7
Version:  4.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: idv4
Tags: 
*/


body, html { overflow-x: hidden; }


/* Header Styles ---------------------------------------------------------- */
.wp-site-blocks { position: relative; }
/* transparent header - add class to header .transparent-header */
header.transparent-header {
    position: absolute;
    z-index: 99;
    width: 100%;
}
header.transparent-header + main #hero {
    padding-top: 175px !important;
}

.wp-block-group.is-position-sticky {
    position: fixed;
    width: 100%;
    box-shadow: 0px 0px 15px 2px rgba(0, 0, 0, 0.2);
}
.wp-block-group.is-position-sticky + main {
    padding-top: 90px !important;
}

@media screen and (max-width: 767px) {
	header .wp-block-group.is-vertical {
		padding-top: 60px !important;
	}
}


/* Hover Styles ---------------------------------------------------------- */
/* .hover-grow - makes image/background scale on hover. Add class to image block */
.hover-grow img {
    transition: transform 0.3s ease-in-out;
}
.hover-grow:hover img {
    transform: scale(1.05);
}


/* Pattern Styles ---------------------------------------------------------- */
/* Home Page Hero Pattern Styles */
@media screen and (max-width: 1279px) {
    .home-hero-four-images,
    .home-hero-five-images {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .home-hero-four-images > .wp-block-cover:first-child,
    .home-hero-five-images > .wp-block-cover {
        grid-column: span 1;
    }
}
@media screen and (max-width: 1023px) {
    .home-hero-four-images {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .home-hero-four-images > .wp-block-cover {
        grid-column: span 1;
        grid-row: span 1;
    }

    .home-hero-five-images {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }
    .home-hero-five-images > .wp-block-cover {
        grid-column: span 2;
        grid-row: span 1;
    }
    .home-hero-five-images > .wp-block-cover:first-child,
    .home-hero-five-images > .wp-block-cover:nth-child(2) {
        grid-column: span 3;
        grid-row: span 1;
    } 
}

@media screen and (max-width: 781px) {
    .home-hero-two-images,
    .home-hero-three-images,
    .home-hero-four-images,
    .home-hero-five-images {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }
}

/* Scope all heroes */
:where(.home-hero-one-image,
       .home-hero-two-images,
       .home-hero-three-images,
       .home-hero-four-images,
       .home-hero-five-images) .wp-block-cover {
  overflow: hidden; /* so the zoom doesn't spill outside */
}

/* Transition on the actual background image element (img or span pattern) */
:where(.home-hero-one-image,
       .home-hero-two-images,
       .home-hero-three-images,
       .home-hero-four-images,
       .home-hero-five-images)
  .wp-block-cover :is(.wp-block-cover__image-background,
                      .wp-block-cover__image-background img) {
  display: block; /* guards against inline/strange display from plugins */
  transition: transform .3s ease-in-out;
  will-change: transform;
  transform-origin: center center;
}

/* Hover zoom */
:where(.home-hero-one-image,
       .home-hero-two-images,
       .home-hero-three-images,
       .home-hero-four-images,
       .home-hero-five-images)
  .wp-block-cover:hover :is(.wp-block-cover__image-background,
                            .wp-block-cover__image-background img) {
  transform: scale(1.1);
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  :where(.home-hero-one-image,
         .home-hero-two-images,
         .home-hero-three-images,
         .home-hero-four-images,
         .home-hero-five-images)
    .wp-block-cover :is(.wp-block-cover__image-background,
                        .wp-block-cover__image-background img) {
    transition: none;
  }
}


/* alternating loop helper */
.alternating-h-loop > ul > li:nth-child(odd) .is-vertical {
    flex-direction: column-reverse;
}

.alternating-v-loop > ul > li:nth-child(even) .wp-block-columns {
    flex-direction: row-reverse;
}



/* Special Styles ----------------------------------------------------------- */
.wp-block-search { max-width: 400px; margin-left: 0 !important; }

.wp-block-list.list-columns-4 {
    column-count: 4;
}
.wp-block-list.list-columns-3 {
    column-count: 3;
}
.wp-block-list.list-columns-2 {
    column-count: 2;
}

.wp-block-query-pagination-numbers > span,
.wp-block-query-pagination-numbers > a {
	background: var(--wp--preset--color--custom-primary-4);
	color: var(--wp--preset--color--custom-primary-1);
	padding: 4px 12px;
	border-radius: 99px;
	text-decoration: none;
}
.wp-block-query-pagination-numbers > span,
.wp-block-query-pagination-numbers > a:hover {
	background: var(--wp--preset--color--custom-primary-1);
	color: var(--wp--preset--color--custom-primary-4);
}

/* Home Page - Service Tiles */
.service-tiles .wp-block-cover {
    min-height: auto;
}
.service-tiles .wp-block-cover .wp-block-cover__inner-container {
    position: relative;
}
.service-tiles .wp-block-cover .wp-block-cover__background {
    transition: all 0.3s ease;
}
.service-tiles .wp-block-cover:hover .wp-block-cover__background {
    opacity: .8;
}
.service-tiles .wp-block-cover P,
.service-tiles .wp-block-cover .wp-block-buttons {
    opacity: 0;
    position: relative;
    left: 110%;
    transition: all 0.3s ease;
}

.service-tiles .wp-block-cover:hover p,
.service-tiles .wp-block-cover:hover .wp-block-buttons {
    left: 0;
    opacity: 1;
}

.service-tiles .wp-block-cover:after {
    content: "+";
    display: block;
    color: var(--wp--preset--color--custom-primary-3);
    font-size: 4rem;
    position: absolute;
    bottom: 1rem;
    left: 1.5rem;
    transition: all 0.3s ease-in-out;
}
.service-tiles .wp-block-cover:hover:after {
    left: -3rem;
}

.status {
  background: #1e1e1e;
  color: white;
  padding: 12px 24px 12px 16px;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.status:before {
  content: "";
  width: 8px;
  height: 8px;
	margin-right: 12px;
  border-radius: 50%;
  background: #00ff66;
  box-shadow: 0 0 6px #00ff66;
  animation: pulse 2s infinite ease-in-out;
  flex-shrink: 0;
}

@keyframes pulse {
  0%, 100% {
    transform: scale(1);
    box-shadow: 0 0 6px #00ff66;
    opacity: 1;
  }
  50% {
    transform: scale(1.3);
    box-shadow: 0 0 12px #00ff66,
                0 0 20px rgba(0, 255, 102, 0.6);
    opacity: 0.85;
  }
}


/* Form Styles -------------------------------------------------------------- */
.gform_required_legend { margin-bottom: 0; }
.gform_wrapper.gravity-theme .gform_fields { grid-column-gap: .5rem !important; grid-row-gap: 0 !important; }

#hero .form-style-2 .gform_wrapper.gravity-theme form input, 
#hero .form-style-2 .gform_wrapper.gravity-theme form select, 
#hero .form-style-2 .gform_wrapper.gravity-theme form textarea {
    background: #dfe5c8;
}
#hero .form-style-2 .gform_wrapper.gravity-theme .wp-block-buttons .wp-block-button__link {
    background-color: var(--wp--preset--color--custom-primary-1);
    border-color: var(--wp--preset--color--custom-primary-1);
    color: var(--wp--preset--color--custom-primary-4);
}
#hero .form-style-2 .gform_wrapper.gravity-theme .wp-block-buttons .wp-block-button__link:hover {
    background-color: #76b49b;
    border-color: #76b49b;
    color: var(--wp--preset--color--custom-primary-1);
}