/* 
Theme Name: Summit Global
Theme URI: https://oechsli.com
Description: Oechsli is a hybrid theme with block and elementor support 
Author: Oechsli
Author URI: https://oechsli.com/
Template: oechsli
Version: 2025.07.18
Text Domain: summit-global
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

.hide-me {display: none !important;}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}




.d-flex { display:flex; }



.wp-block-button[class*=has-icon__] .wp-block-button__link span { line-height:1; }

/* Right-leaning parallelogram card */
.card-slanted {
  --skew: -10deg; /* negative = right lean, positive = left lean */
  --bg: var(--wp--preset--color--base, #fff);
  --border: #dbdbdb;

  position: relative;
  background: transparent; /* background handled by ::before */
  z-index: 0;
}

.card-slanted::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--bg);
  border: 1px solid var(--border);  /* TRUE border */
  border-radius: 4px;               /* optional */
  transform: skewX(var(--skew));
  transform-origin: center;
  z-index: -1;

  /* Box shadow follows the skew */
  box-shadow: 0 4px 10px rgba(0,0,0,0.15);
}

/* Left-leaning variant */
.card-slanted.slant-left { --skew: 10deg; }




.section-skew {
  transform: skew(-10deg);
  overflow: hidden;
}

.card-skew {
  transform: skew(-10deg);
  overflow: hidden;
}

.card-skew .card-content {
  transform: skew(10deg); /* Counteract the parent skew */
}


@media screen and (min-width: 1025px) {
  .featured-diagonal {
    mask: url(/wp-content/themes/summit-global/images/summit-simple-frame.svg);
    -webkit-mask: url(/wp-content/themes/summit-global/images/summit-simple-frame.svg);
    mask-type: alpha;
    -webkit-mask-type: alpha;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 101%;
    -webkit-mask-position: center;
    mask-position: center;
  }
}






.featured-diagonal-container:before {  
content: "";
  position: absolute;
  inset: 0;                      /* top/right/bottom/left: 0 */
  display: block;
  z-index: 0;
  background-image: url(/wp-content/themes/summit-global/images/diagonal-multi-color-graphic.svg);
  background-repeat: no-repeat;
  background-position: center;   /* centers the SVG */
  background-size: cover;        /* or 'contain' if you prefer full visibility */
}


.featured-diagonal-container:before {  
    content: "";
    position: absolute;
    inset: 0;
    display: block;
    z-index: 0;
    background-image: url(/wp-content/themes/summit-global/images/diagonal-multi-color-graphic.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 53%;
}


/*site header*/

.wp-block-button.hamburger-menu-button.site-burger {display: none;}



body.scrolling .site-header { box-shadow:1px 1px 9px #ababab; }

.site-header-row {
    transition: all .3s;
}

body.scrolling .site-header-row {padding-top: 5px !important; padding-bottom: 5px !important; transition: all .3s;}

body.header-transparent-sticky-home.scrolling .site-header,
body.header-transparent-sticky.scrolling .site-header {transition: all .3s;box-shadow: 1px 1px 3px #ababab;}
body.header-transparent-sticky-home .site-header {transition: all .3s;}

body.home:not(.scrolling).header-transparent-sticky-home .site-header {  transition: all .3s;}
body.header-transparent-sticky-home.scrolling .site-header {background-color: var(--wp--preset--color--palette-9) !important; transition: all .3s; }



body.home.header-transparent-sticky-home:not(.scrolling) .wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content,
body.home.header-transparent-home:not(.scrolling) .wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content { color:#fff;  }


body.header-transparent-sticky-home.scrolling .site-header { top:0; }
body.header-transparent-sticky-home.admin-bar.scrolling .site-header { top:32px; }

body.header-transparent-sticky.scrolling .site-logo img { filter:none !important;  }



body.header-transparent-sticky:not(.scrolling)
.wp-block-navigation__container
> .wp-block-navigation-item
> .wp-block-navigation-item__content:not(:hover) {
  color: #fff;
}
/*site navigation*/

.wp-block-navigation .wp-block-navigation-item:hover, .wp-block-navigation .wp-block-navigation-item.current-menu-item { color:var(--wp--preset--color--palette-1) }



/* Container layout */


.advisor-search {
  display: flex;
  gap: 1rem;
  align-items: center;
}

/* Input fields */
.advisor-search input[type="search"],
.advisor-search select {
  padding: 0.75rem 1rem;
  font-size: 1rem;
  border: 1px solid #ccc;
  border-radius: 6px;
  flex: 1 1 250px;
  background-color: #fff;
  transition: border-color 0.2s ease-in-out;
}

.advisor-search input[type="search"]:focus,
.advisor-search select:focus {
  outline: none;
  border-color: #0073aa;
}

/* Button */
.advisor-search button[type="submit"] {
  padding: 0.75rem 1.5rem;
  background-color: #0073aa;
  color: #fff;
  border: none;
  font-weight: 600;
  border-radius: 6px;
  cursor: pointer;
  transition: background-color 0.2s ease-in-out;
}

.advisor-search button[type="submit"]:hover {
  background-color: #005d8a;
}

/*background icons*/

.compass-tilt-right .wp-block-cover__image-background { 
    object-fit: contain;
    width: 68%;
    transform: rotate(23deg);
    top: -437px;
    height: 180%;
    right: -150px;
    left: auto;

  }

.compass-tilt-left .wp-block-cover__image-background { 
    object-fit: contain;
    width: 78%;
    transform: rotate(-23deg);
    top: -289px;
    height: 180%;
    left: -430px;
    right: auto;

  }





.has-tab, .has-small-tab {
  position: relative;
}

.has-tab::before {
    content: "";
    position: absolute;
    top: 0;
    right: 10%;
    height: 100%;
    background-image: url(/wp-content/themes/summit-global/images/diagonal-multi-color-graphic.svg);
    background-size: cover;
    background-repeat: no-repeat;
    z-index: 9;
    width: 30%;
}



.has-small-tab.yellow-tab::before {
        content: "";
    position: absolute;
    top: 0;
    left: 10%;
    height: 140px;
    background-image: url(/wp-content/themes/summit-global/images/yellow-tab.svg);
    background-size: cover;
    background-repeat: no-repeat;
    z-index: 9;
    width: 100px;
}
.has-small-tab.yellow-tab.tab-right::before {
 right: 10%;
 left:unset;


}



/* buttons */
.is-style-fill .wp-block-button__link,  .wp-block-button:not(.is-style-link) .wp-block-button__link { display:flex;align-items:center; }
.xis-style-fill .wp-block-button__link::after, .xwp-block-button:not(.is-style-link) .wp-block-button__link::after  {
  content: "";
    margin-left: 0.5em;
    background-image: url(/wp-content/themes/summit-global/images/btn-arrow.svg);
    background-size: 18px;
    background-repeat: no-repeat;
    background-position: center;
    background-color: var(--wp--preset--color--palette-8);
    border-radius: 400px;
    padding: 0.8em;


}


/*cards*/



.hvr-stack {
  position: relative;
  overflow: hidden;
}

.hvr-stack-description {
  position: relative;
}

/* Paragraph */
.hvr-stack-description .hvr-stack-p {
  transform: translateY(0);
  transition: transform 0.35s ease;
  will-change: transform;
}

/* Buttons: use max-height instead of height:auto */
.hvr-stack-description .wp-block-buttons {
  max-height: 0;                 /* collapsed */
  overflow: hidden;              /* hide while collapsed */
  opacity: 0;
  transform: translateY(8px);
  transition:
    max-height 0.35s ease,
    opacity 0.35s ease,
    transform 0.35s ease;
  margin-top: 0 !important;      /* avoid margin jump */
  gap: 0 !important;             /* Gutenberg can add gaps */
  will-change: transform, opacity;
  pointer-events: none;          /* not clickable while hidden */
}

/* Hover effect */
.hvr-stack{ transition: all .3s;}
.hvr-stack:hover { background: var(--wp--preset--color--palette-4) !important; }
.hvr-stack:hover h3 { color:#fff !important; } 

.hvr-stack:hover .hvr-stack-p {
  transform: translateY(-20px);
  color:#fff;
}

.hvr-stack:hover .hvr-stack-description .wp-block-buttons {
  max-height: 80px;              /* adjust to your button's height */
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;

}

.hvr-stack:hover .hvr-stack-description .wp-block-button a { color:#fff !important; }

/* Optional: smoother font/subpixel rendering during transform */
.hvr-stack * { backface-visibility: hidden; transform: translateZ(0); }

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .hvr-stack-description .hvr-stack-p,
  .hvr-stack-description .wp-block-buttons {
    transition: none;
    transform: none;
  }
  .hvr-stack:hover .hvr-stack-description .wp-block-buttons {
    max-height: 80px;
    opacity: 1;
  }
}



/* Right-leaning parallelogram behind the card */
/* Right-leaning parallelogram card */
.card-slanted {
  --skew: -10deg; /* negative = right lean, positive = left lean */
  --bg: var(--wp--preset--color--base, #fff);
  --border: #dbdbdb;

  position: relative;
  background: transparent; /* background handled by ::before */
  z-index: 0;
}

.card-slanted::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--bg);
  border: 1px solid var(--border);  /* TRUE border */
  border-radius: 4px;               /* optional */
  transform: skewX(var(--skew));
  transform-origin: center;
  z-index: -1;

  /* Box shadow follows the skew */
  box-shadow: 0 4px 10px rgba(0,0,0,0.15);
}

/* Left-leaning variant */
.card-slanted.slant-left { --skew: 10deg; }



.is-style-fill .wp-block-button__link {
  --skew: -10deg; /* negative = right lean, positive = left lean */
  --bg: #cca950;
  --border: #dbdbdb;

  position: relative;
  background: transparent; /* background handled by ::before */
  z-index: 0;
      padding: 15px 20px;
}



.is-style-fill .wp-block-button__link::before {
  content: "";
  position: absolute;
  inset: 0;
  background: #cca950;
  border: 1px solid #cca950;  /* TRUE border */
  border-radius: 4px;               /* optional */
  transform: skewX(var(--skew));
  transform-origin: center;
  z-index: -1;

}





/* shadow layer */
.is-style-fill .wp-block-button__link::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 4px;
  transform: skewX(var(--skew));
  z-index: -2;

  /* start hidden */
  opacity: 0;
  transition: opacity 0.25s ease, transform 0.25s ease;
}

.is-style-fill .wp-block-button__link { transition:all .3s ease-in-out; }
.is-style-fill .wp-block-button__link:hover{
 transform: translatex(5px);

}
/* hover: hard-edged box shadow */
.is-style-fill .wp-block-button__link:hover::after {

  opacity: 1;
  box-shadow: 4px 4px 0 var(--wp--preset--color--palette-2); /* hard shadow, no blur */
  transform: skewX(var(--skew)) translate(2px, 2px);
}


/* ==========================================
   Slanted Card on Top of Background Image
   ========================================== */

   /* ==========================================
   Cover block with slanted mask
   ========================================== */
.thumb-slanted {
  /* The mask image (your custom SVG path) */
  -webkit-mask-image: url('/wp-content/themes/summit-global/images/thumb-mask.svg');
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: cover;

  mask-image: url('/wp-content/themes/summit-global/images/thumb-mask.svg');
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: cover;

  /* Optional background settings for the content area */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

  /* Optional: border & shadow applied to the mask shape */
  border: 1px solid #dbdbdb;
  box-shadow: 0 12px 30px rgba(0,0,0,0.18);

  /* Keep children inside */
  overflow: hidden;
}





/*footer */

ul.footer-navigation {
   display: grid;
  grid-template-columns: repeat(2, 1fr); /* Two equal columns */
  gap: 0.5rem; /* Space between items */
  list-style-position: inside;
  column-gap: 2em;
}




/*button icon */

.wp-block-button__link-icon svg { fill:var(--wp--preset--color--palette-1) !important;height:15px !important;width:20px !important; }


/*diagonl lines bkg*/

.diagonal-10 {
      --line-color: rgb(107 107 107 / 8%);
    --line-width: 1px;
    --gap: 10px;
    background-image: repeating-linear-gradient(-85deg, var(--line-color) 0 var(--line-width), transparent var(--line-width) calc(var(--line-width) + var(--gap)));
}


.oechsli-calendar-button{
  display:inline-block;
  padding:12px 18px;
  border-radius:6px;
  text-decoration:none;
  font-weight:600;
  border:1px solid currentColor;
}



/* * * * * Mobile Responsiveness * * * * */

@media only screen and (max-width: 1260px) {	
	/* FOOTER RESPONSIVE */
	.footer-container {
		padding-left: 45px !important;
		padding-right: 45px !important;
	}	
	/* HOME RESPONSIVE */
	.home-outer-section {
		padding-left: 40px;
		padding-right: 40px;
	}
	#advisory {
		padding-left: 20px;
		padding-right: 20px;
	}
	#familyOffice {
		padding-left: 0px;
		padding-right: 0px;
	}
}
@media only screen and (max-width: 1024px) {
	/* ABOUT US RESPONSIVE */
	#investmentTeam .is-layout-grid {
		max-width: 51vw;
        grid-template-columns: repeat(auto-fill, minmax(min(13rem, 100%), 1fr));
    	container-type: inline-size;
    	gap: var(--wp--preset--spacing--50);
        margin-left: 20px;
	}
	#investmentTeam figure, #investmentTeam img {
		min-width: 100% !important;
	}
}

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

    .wp-block-button.hamburger-menu-button.site-burger {display: block !important;}
	.site-header:not(.scrolling) .hamburger-menu-button .wp-block-button__link {color: #fff !important;}
     body.scrolling .site-header .hamburger-menu-button .wp-block-button__link {color: var(--wp--preset--color--palette-4) !important;}
	.home .wp-block-group.hero-stack {min-height: 550px !important; padding-top: 5em !important;}
	.has-small-tab.yellow-tab::before {height: 100px !important; width: 60px !important;}
	.wp-block-cover.img-cover, .wp-block-group.img-cover-stack {min-height: 250px !important;}
	.wp-block-group.page-hero-stack {min-height: 450px !important; padding-top: 1em !important;}
		
	/* HOME RESPONSIVE */
	.home-outer-section {
		padding-left: 30px;
		padding-right: 30px;
	}
	#advisory {
		padding-left: 10px;
		padding-right: 10px;
	}
	#familyOffice {
		padding-left: 10px;
		padding-right: 10px;
	}
	
	#familyOfficeInner {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
		
	/* ABOUT US RESPONSIVE */
	
	.page-about-us main {
		padding-left: 20px;
		padding-right: 20px;
	}
	#investmentTeam .is-layout-grid {
		max-width: unset;
        margin-left: 0;
	}
	
	
	/* FOOTER RESPONSIVE */
	
	.footer-container {
		padding-left: 35px !important;
		padding-right: 35px !important;
	} 
	
	div#footerImages {
		flex-direction: column;
	}
	div#footerImages img {
		height: auto !important;
	}
	
}

/*  */
@media (max-width: 600px) {
  .advisor-search {
    flex-direction: column;
    align-items: stretch;
  }

  .advisor-search input,
  .advisor-search select,
  .advisor-search button {
    width: 100%;
  }
}