/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://generatepress.com
 Description:  Default GeneratePress child theme
 Author:       Tom Usborne
 Author URI:   https://tomusborne.com
 Template:     generatepress
 Version:      0.1
*/

body {
    padding: 0px;
    margin: 0px;
    font-size: 18px;
    overflow-x: hidden;  /* Prevents horizontal scrolling */
}

h3, h4, h2, p {
	margin-bottom: 0;
}

html {
  scroll-behavior: smooth;
}

/* Global scroll offset for all anchors */
[id] {
  scroll-margin-top: 120px; /* adjust based on your header height */
}

/* Center Header Menu*/
@media (min-width: 1025px) {
    .site-header .inside-header nav#site-navigation {
        margin-left: 17%;
        flex-grow: 1;
    }

    .site-header .inside-header nav#site-navigation div#primary-menu {
        width: 100%;
    }

    .site-header .inside-header nav#site-navigation ul.menu > li:last-child {
    margin-left: auto;
}

    .site-header .inside-header nav#sticky-navigation #menu-primary-menu {
        margin-left: 17%;
        flex-grow: 1;
    }
    
    .site-header .inside-header nav#sticky-navigation div#primary-menu {
        width: 90%;
    }

    .site-header .inside-header nav#sticky-navigation ul.menu > li:last-child {
        margin-left: auto;
    }
}

/* Desktop nav - no wrap */
.main-navigation .inside-navigation {
  flex-wrap: nowrap;
}

/* Slideout nav - allow wrap */
.slideout-navigation .inside-navigation {
  flex-wrap: wrap;
}

/* Primary Menu style */
#menu-primary-menu a {
		font-weight: 600 !important;
}

#menu-item-24 {
	background: rgba(0, 18, 66, 1);
	border-radius: 50px;
}

#menu-item-24 a{
	color: white;
}

#menu-item-24 a{
	color: white;
}

#menu-item-24 a::before {
    content: "";
    display: inline-block;
    width: 17px;
    height: 17px;
    background-image: url('https://vhwaterproofingsolutions.sg/wp-content/uploads/2025/09/phone-icon.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin: 0 10px 3px 0;
    vertical-align: middle;
}

ul#menu-item-18-sub-menu {
    background-color: rgba(255, 255, 255, 1);
    box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
    border-radius: 5px;
    padding: 10px 0 10px 0;
}

ul#menu-item-18-sub-menu a{
	font-weight: 400 !important;
}

#menu-item-24 a {
    color: white;
    height: 45px;
	position: relative;
    top: -7px;
}

.site-header .inside-header nav#sticky-navigation #menu-primary-menu #menu-item-24{
        height: 45px;
    }

.site-header .inside-header nav#sticky-navigation #menu-primary-menu #menu-item-24 a{
            position: relative;
    top: -28px;
    }

.main-navigation .navigation-stick .inside-navigation {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
}

@media (min-width: 768px) and (max-width: 1024px) {
  .main-navigation.navigation-stick.has-sticky-branding .inside-navigation.grid-container {
    padding: 10px 40px;
  }
}


/* Footer style */
.gb-element-4a4843f9 {
    position: relative;
}

.gb-element-4a4843f9::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url(https://vhwaterproofingsolutions.sg/wp-content/uploads/2025/09/vh-waterproofing-footer-bg.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    opacity: 0.1; /* 10% opacity */
    z-index: -1;
}

.footer a {
    text-decoration: none;
}

/* Remove the original background */
.gb-element-4a4843f9 {
    background-image: none !important;
}

/* Homepage */
.gb-text-b1e4eb2c .gb-shape svg, 
.gb-text-5c9c3e6a .gb-shape svg, 
.gb-text-f8829928 .gb-shape svg {
    width: 2.1em !important;
    height: 2.1em !important; 
}

.gb-accordion__item {
    border: 1px solid transparent;
    transition: border-color 300ms ease-in-out;
}

.gb-accordion__item-open {
    border: 1px solid rgba(206, 206, 206, 1);
}

.gb-accordion__content {
    max-height: 0;
    opacity: 0;
    transition: 
        max-height 400ms cubic-bezier(0.4, 0, 0.2, 1),
        opacity 400ms ease-in-out,
        padding 400ms ease-in-out;
    overflow: hidden;
}

.gb-accordion__item-open .gb-accordion__content {
    max-height: 500px;
    opacity: 1;
}

/* Create a wrapper around your element */
.gradient-border-wrapper {
    background: linear-gradient(180deg, #2659FF 0%, rgba(38, 89, 255, 0) 94.71%);
    border-radius: 21px;
    padding: 1px;
	display: flex;
}

.gb-element-101ed6ec, .gb-element-3fb93a50, .gb-element-ac0baf84 {
    column-gap: 25px;
    display: flex;
    flex-direction: column;
    row-gap: 25px;
    border-radius: 19px; /* Slightly smaller than wrapper */
    padding: 15px;
    background: white;
    margin: 0; /* Remove any default margins */
}

.number-border {
  color: #fff; /* white fill */
  -webkit-text-stroke: 0.5px rgba(52, 100, 176, 1); /* very slim border */
  text-shadow:
    -0.5px -0.5px 0 rgba(52, 100, 176, 1),
     0.5px -0.5px 0 rgba(52, 100, 176, 1),
    -0.5px  0.5px 0 rgba(52, 100, 176, 1),
     0.5px  0.5px 0 rgba(52, 100, 176, 1); /* fallback for Firefox */
}

.learn-more-hover-effect {
    background: white;
}

.learn-more-hover-effect:hover {
    border: 2px solid transparent;
    background: 
        linear-gradient(white, white) padding-box,
        linear-gradient(90deg, #162A4A 0%, #FFFFFF 50%, #162A4A 100%) border-box;
    background-size: 200% 100%;
    animation: borderSlide 1.2s linear infinite;
    animation-delay: 1ms;
}

@keyframes borderSlide {
    0% {
        background-position: 100% 0;
    }
    100% {
        background-position: -100% 0;
    }
}

/* Off-canvas Menu */
.slideout-navigation.main-navigation {
    background-color: #F5F6FF !important;
}

.slideout-navigation.main-navigation .main-nav ul li a {
    color: black !important;
}

.slideout-navigation .gp-icon svg {
    fill: black !important;
}

#generate-slideout-menu .slideout-menu > li:last-child > a {
  display: inline-block;
  width: 197px;
  height: 45px;
  border-radius: 50px;
  background: var(--Primary-Blue, rgba(0, 18, 66, 1));
  color: #fff !important;
  font-weight: 600;
  text-align: center;
  text-decoration: none;
  opacity: 1;
  transition: background 0.3s ease, opacity 0.3s ease;
	    display: flex;
    align-items: center;
    justify-content: center;
	margin-left: 15px;
}

#generate-slideout-menu .slideout-menu > li:last-child > a:hover {
  opacity: 0.85; /* hover effect */
}


/* Other Waterproofing Services page */

.gb-element-a0e83a4f > .waterproofing-services-for-every-need {
  grid-column: span 2;
}

/* Case Studies page */
span.page-numbers.current {
    background-color: rgba(52, 100, 176, 1);
    border: 2px solid rgba(35, 55, 114, 1) !important;
	color: white;
}

.gb-query-page-numbers-4b6ad9d8 .page-numbers {
    font-size: 16px !important;
    border: 2px solid rgba(35, 55, 114, 1) !important;
    padding: 10px 12px !important;
}

.gb-text-c452f0eb, .gb-text-caf8e38f {
    font-size: 16px !important;
	padding: 10px !important;
	border: none !important;
}

.gb-text-c452f0eb::after {
    content: "";
    display: inline-block;
    width: 6px;
    height: 11px;
    margin-left: 6px;
    background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='6' height='11' viewBox='0 0 6 11' fill='none'><path fill-rule='evenodd' clip-rule='evenodd' d='M0.47992 0.960307C0.620545 0.819856 0.811169 0.740967 1.00992 0.740967C1.20867 0.740967 1.39929 0.819856 1.53992 0.960307L5.53992 4.96031C5.68037 5.10093 5.75926 5.29156 5.75926 5.49031C5.75926 5.68906 5.68037 5.87968 5.53992 6.02031L1.53992 10.0203C1.47126 10.094 1.38846 10.1531 1.29646 10.1941C1.20446 10.2351 1.10514 10.2571 1.00444 10.2589C0.903739 10.2607 0.80371 10.2422 0.710322 10.2044C0.616934 10.1667 0.5321 10.1106 0.460882 10.0393C0.389663 9.96813 0.333518 9.88329 0.295797 9.7899C0.258076 9.69652 0.239551 9.59649 0.241328 9.49578C0.243104 9.39508 0.265146 9.29577 0.306138 9.20377C0.34713 9.11177 0.406233 9.02897 0.47992 8.96031L3.94992 5.49031L0.47992 2.02031C0.339469 1.87968 0.260579 1.68906 0.260579 1.49031C0.260579 1.29156 0.339469 1.10093 0.47992 0.960307Z' fill='%23222222'/></svg>") no-repeat center;
    background-size: contain;
    vertical-align: middle;
	    margin-top: 3px;
}

.gb-text-caf8e38f::before {
    content: "";
    display: inline-block;
    width: 6px;
    height: 11px;
    margin-right: 6px;
    background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='6' height='11' viewBox='0 0 6 11' fill='none'><path fill-rule='evenodd' clip-rule='evenodd' d='M0.47992 0.960307C0.620545 0.819856 0.811169 0.740967 1.00992 0.740967C1.20867 0.740967 1.39929 0.819856 1.53992 0.960307L5.53992 4.96031C5.68037 5.10093 5.75926 5.29156 5.75926 5.49031C5.75926 5.68906 5.68037 5.87968 5.53992 6.02031L1.53992 10.0203C1.47126 10.094 1.38846 10.1531 1.29646 10.1941C1.20446 10.2351 1.10514 10.2571 1.00444 10.2589C0.903739 10.2607 0.80371 10.2422 0.710322 10.2044C0.616934 10.1667 0.5321 10.1106 0.460882 10.0393C0.389663 9.96813 0.333518 9.88329 0.295797 9.7899C0.258076 9.69652 0.239551 9.59649 0.241328 9.49578C0.243104 9.39508 0.265146 9.29577 0.306138 9.20377C0.34713 9.11177 0.406233 9.02897 0.47992 8.96031L3.94992 5.49031L0.47992 2.02031C0.339469 1.87968 0.260579 1.68906 0.260579 1.49031C0.260579 1.29156 0.339469 1.10093 0.47992 0.960307Z' fill='%23222222'/></svg>") no-repeat center;
    background-size: contain;
    vertical-align: middle;
    transform: scaleX(-1); /* flips it left */
	margin-top: 3px;
}

/* Desktop: 2x2 grid */
.case-study-gallery-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, 180px);
  gap: 10px;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.case-study-gallery-item {
  overflow: hidden;
}

.case-study-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Desktop rounded corners */
.case-study-gallery-item.item-1 img { border-top-left-radius: 10px; }
.case-study-gallery-item.item-2 img { border-top-right-radius: 10px; }
.case-study-gallery-item.item-3 img { border-bottom-left-radius: 10px; }
.case-study-gallery-item.item-4 img { border-bottom-right-radius: 10px; }

/* Mobile: single column */
@media (max-width: 480px) {
  .case-study-gallery-grid {
    grid-template-columns: 1fr;
    grid-auto-rows: 180px; /* equal height */
    gap: 10px;
  }

  /* Remove all desktop corner rounding */
  .case-study-gallery-item img {
    border-radius: 0 !important; /* force override */
  }

  /* Round only top corners of the first image */
  .case-study-gallery-item:first-child img {
    border-top-left-radius: 10px !important;
    border-top-right-radius: 10px !important;
  }

  /* Round only bottom corners of the last image */
  .case-study-gallery-item:last-child img {
    border-bottom-left-radius: 10px !important;
    border-bottom-right-radius: 10px !important;
  }
}


/* Breadcrumb */
.yoast-breadcrumbs a {
    padding-right: 10px; /* adjust to taste */
}

.breadcrumb_last {
	padding-left: 10px;
}

.yoast-breadcrumbs {
    font-size: 0.9em;
}