/**
Theme Name: Klatch
Author: Klatch
Author URI: https://klatch.co.uk/
Description: A lightweight child theme developed by Klatch for Astra-based Elementor websites. Provides a stable foundation for custom styling, performance optimisation, and scalable client builds.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: klatch
Template: astra
*/


/* =========================================================
   Klatch Base Utilities (Astra + Elementor)
   Keep styles minimal and reusable across client sites.
   Prefer Astra Global Colors/Fonts in Elementor where possible.
========================================================= */


/* Avoid hiding overflow globally — fix the actual element causing overflow instead. */
/* html, body { overflow-x: hidden; }  <-- don’t do this unless absolutely necessary */

a { text-decoration: none; }

/* Cookie banner font sizing (only if you still use CookieConsent style classes) */
.cc-revoke, .cc-window { font-size: 13px; }

/* Grey Scale Image */
.img-grey-scale { filter: grayscale(100%); }
.img-grey-scale:hover { filter: none; }

/* Float column on hover */
.float-column-hover { transition: transform .3s ease-out; }
.float-column-hover:hover { transform: translateY(-8px); }

/* Remove underline line inside specific Elementor widgets */
.remove-underline-line .elementor-heading-title a,
.remove-underline-line .elementor-icon-box-title a {
  text-decoration: none;
}

/* Grow column on hover (desktop only) */
@media (min-width: 1024px){
  .grow-column .elementor-widget-wrap{
    overflow: hidden;
    transition: transform 1s ease;
  }
  .grow-column .elementor-widget-wrap:hover{
    transform: scale(1.1);
  }
}

/* Equal height cards using flex grow (title grows) */
.row-flex-direction .elementor-widget-wrap{
  flex-direction: column;
}
.row-flex-direction .elementor-widget-wrap .elementor-widget-heading{
  flex-grow: 2;
}

/* Equal height cards using flex grow (description grows) */
.row-flex-direction-description .elementor-widget-wrap{
  flex-direction: column;
}
.row-flex-direction-description .elementor-widget-wrap .elementor-widget-text-editor{
  flex-grow: 2;
}

/* Full width button on mobile */
@media (max-width:767px){
  .fullwidth-button-mobile a.elementor-button-link{
    width: 100% !important;
  }
}

/* Pulse animation helpers (use sparingly) */
@keyframes klatch-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(0,0,0,.2); }
  100% { box-shadow: 0 0 0 20px rgba(0,0,0,0); }
}
.pulse-btn-hover a.elementor-button-link:hover{
  animation: klatch-pulse 2s infinite;
}
.pulse-btn-not-hover a.elementor-button-link{
  animation: klatch-pulse 2s infinite;
}
.icononly-pulse-effect .elementor-icon{
  animation: klatch-pulse 2s infinite;
}
.icon-with-text-description-pulse-effect .elementor-icon-box-icon .elementor-icon{
  animation: klatch-pulse 2s infinite;
}

/* Fixed height helper for very large screens (apply class to the hero section) */
@media (min-width: 1921px){
  .fixed-height-on-4k-screen-resolution .elementor-container{
    min-height: 1000px !important;
  }
}
@media (min-height:1081px) and (min-width: 1920px){
  .fixed-height-on-4k-screen-resolution .elementor-container{
    min-height: 1000px !important;
  }
  .autoheight-container .elementor-container{
    min-height: auto !important;
  }
}
@media (max-width:320px){
  .fixed-height-on-4k-screen-resolution .elementor-container{
    min-height: 700px !important;
  }
  .elementor-button-link{
    padding-right: 15px !important;
    padding-left: 15px !important;
  }
}

/* Map greyscale (change selector to your map container if needed) */
#mapembed { filter: grayscale(1); }

/* Background image zoom in on hover (requires Elementor motion effects bg) */
.zoom-in-hover-effect:hover .elementor-motion-effects-layer{
  transform: scale(1.3) !important;
}

/* Remove focus box shadow of inputs */
.elementor-field-group .elementor-field-textual:focus{
  box-shadow: none;
}

/* Astra menu button full width on mobile */
@media (max-width:767px){
  .ast-builder-button-wrap{
    width: 100% !important;
    text-align: center !important;
  }
}

/* Elementor popup full-width section fix on mobile */
@media (max-width:1023px){
  #ast-mobile-popup .ast-flex{
    display: block !important;
  }
}