/*
Theme Name: Oechsli Child Theme
Theme URI: https://oechsli.com
Description: Child theme for the Oechsli block theme framework.
Author: Oechsli
Author URI: https://oechsli.com/
Template: oechsli
Version: 2026.03.21
Text Domain: oechsli-child
Requires at least: 6.0
Requires PHP: 7.4
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/

/* Add site-specific CSS overrides below this line. */

/* * * * ALL SITE CSS * * * */
body {
  /* For Webkit browsers (Chrome, Safari, Edge) */
  -webkit-font-smoothing: antialiased;

  /* For Firefox on macOS */
  -moz-osx-font-smoothing: grayscale;
}
h1, h2, h3 {
  text-rendering: optimizeLegibility;
}
/* Optional wrapper padding (the original .rainbow class) */
.rainbow {
  padding: 10px 0;
}

/* The animated gradient text effect */
.rainbow-text-animated {
  background: linear-gradient(
    to right,
    rgb(38, 153, 193),
    rgb(33, 55, 124),
    rgb(33, 55, 126),
    rgb(70, 127, 247),
    rgb(0, 0, 0)
  );
/* #2699C1	,#21377C, #21377E,#467FF7, #000000 */
  background-size: 400% 100%;
  background-position: 0 0;
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  animation: rainbow_animation 6s ease-in-out infinite;
}
.rainbow-line-gradient {
	background-color: transparent;
    background-image: linear-gradient(90deg, #91DADA 0%, #382A8F 57%);
}
.has-drop-cap:not(:focus)::first-letter {
    background: linear-gradient(90deg, #91DADA 0%, #382A8F 57%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
	font-weight: 300;
    color: transparent; /* Fallback for browsers without mask support */
}
.wp-block-button__link:hover {
    color: var(--wp--preset--color--palette-7);
/*     border: 2px solid white !important; */
}
.rotate-313 {
	    transform: scaleY(-1) rotate(313deg);
}

/* Site form styling */
.gform_wrapper form input {
    box-shadow: unset !important;
}
/* Subscribe form */
#signupCTA form#gform_2 {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
	align-items: flex-end;
}
#signupCTA input#gform_submit_button_2 {
    padding: 3px 35px !important;
    max-height: 36px;
}

/* * * * HEADER * * * */
/* menu spacing fix */
header nav ul.wp-block-navigation__container {
    gap: 2vw !important;
}
/* Change breakpoint on offcanvas menu icon after framework update that's breaking 1/23/26 */
.visibility-mobile .hamburger-menu-button { 
	display:block;
}
/* ------------------------------------------------------------------
 * Header & logo shrink on scroll
 * Uses the parent theme's body.header-shrink + body.scrolling contract.
 * Animations are GPU-friendly (max-height, padding) and respect motion prefs.
 * ------------------------------------------------------------------ */
body.header-shrink .oi-site-header {
  transition: padding 0.3s ease;
  will-change: padding;
}

body.header-shrink .oi-site-logo .oi-logo__img {
  transition: width 0.3s ease, height 0.3s ease !important;
  will-change: width;
}

body.header-shrink.is-scrolled .oi-site-header {
  padding-block: 6px;
}

body.header-shrink.is-scrolled .oi-site-logo .oi-logo__img {
  width: 70px !important;
  height: auto !important;
  max-width: 70px !important;
}

@media (prefers-reduced-motion: reduce) {
  body.header-shrink .oi-site-header,
  body.header-shrink .oi-site-logo .oi-logo__img {
    transition: none !important;
  }
}

/* Copy the swipe-variant hover state for an active page link.
 * Selectors and properties match the parent theme's existing rules
 * so the look, color token, and timing stay identical. */

.oi-nav--hover-underline-swipe .wp-block-navigation__container > .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content,
.oi-nav--hover-underline-swipe .wp-block-navigation__container > .wp-block-navigation-item.current-menu-ancestor > .wp-block-navigation-item__content,
.oi-nav--hover-underline-swipe .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content:focus-visible {
  color: var(--oi-nav-hover-text, var(--wp--preset--color--palette-1));
}

.oi-nav--hover-underline-swipe .wp-block-navigation__container > .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content::after,
.oi-nav--hover-underline-swipe .wp-block-navigation__container > .wp-block-navigation-item.current-menu-ancestor > .wp-block-navigation-item__content::after,
.oi-nav--hover-underline-swipe .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content:focus-visible::after {
  width: 100%;
}

/* If you ever switch the block-style variant to "underline-center", mirror it there too. */
.oi-nav--hover-underline-center .wp-block-navigation__container > .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content,
.oi-nav--hover-underline-center .wp-block-navigation__container > .wp-block-navigation-item.current-menu-ancestor > .wp-block-navigation-item__content,
.oi-nav--hover-underline-center .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content:focus-visible {
  color: var(--oi-nav-hover-text, var(--wp--preset--color--palette-1));
}
.oi-nav--hover-underline-center .wp-block-navigation__container > .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content::after,
.oi-nav--hover-underline-center .wp-block-navigation__container > .wp-block-navigation-item.current-menu-ancestor > .wp-block-navigation-item__content::after,
.oi-nav--hover-underline-center .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content:focus-visible::after {
  left: 0;
  width: 100%;
}
/* * * * FOOTER * * * */
footer .wp-block-latest-posts li {
    padding-bottom: 8px;
}
footer .wp-block-latest-posts li a{
    text-decoration:none !important;
}
.oi-disclosure {
   font-size: var(--wp--preset--font-size--xsmall, 0.875rem);
    min-width: 1350px;
    font-weight: 300 !important;
}
footer a.wp-block-navigation-item__content:hover {
    opacity: .8;
    text-decoration: underline;
}

/* * * * HOME PAGE * * * */
.fp-query {
    display: grid;
    min-height: 100%;
}
.read-more-btn {
    padding: 3px 8px;
    background-color: var(--wp--preset--color--palette-1);
    border-radius: 3em;
    color: var(--wp--preset--color--palette-6) !important;
}
.fp-post-card:hover .read-more-btn  {
    background-color: var(--wp--preset--color--palette-6);
    border-radius: 3em;
    color: var(--wp--preset--color--palette-1) !important;
}
.fp-post-card:hover {
   background-color: var(--wp--preset--color--palette-10) !important;
} 


.rainbow-animated-card {
	background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
    background-size: 400% 400%;
    animation: gradient 9s ease infinite;
}
/* for buttons */
.rainbow-animated-background a {
	background: linear-gradient(
    to right,
    rgb(38, 153, 193),
    rgb(33, 55, 124),
    rgb(33, 55, 126),
    rgb(70, 127, 247),
    rgb(0, 0, 0)
  );
    background-size: 400% 400%;
    animation: gradient 17s ease infinite;
	color: white;
}
.rainbow-animated-background a:hover {
	background: linear-gradient(
    to right,
    #B8862C,
    rgb(38, 153, 193)
  );
}
/* CHRIS'S PROFILE Move the team banner figure to the left on desktop */
.single-oi_team .wp-block-cover__image-background {
  object-position: 75% 25%;
}

@keyframes rainbow_animation {
  0%, 100% { background-position: 0 0; }
  50%      { background-position: 100% 0; }
}
	
	
@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}

/* Respect users who prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
  .rainbow-text,
  .rainbow-text h1,
  .rainbow-text h2,
  .rainbow-text h3,
  .rainbow-text h4,
  .rainbow-text h5 {
    animation: none;
    background-position: 0 0;
  }
}
/* * * * * * MEDIA QUERIES * * * * * * * */

/* * * LARGER THAN * * * */
@media (min-width: 763px) {
	.visibility-mobile .hamburger-menu-button {
		display: none !important;
	}
	.sticky-outer {
		position: relative !important;		
		}
	.sticky-col {
		top: calc(100px + var(--wp-admin--admin-bar--position-offset, 100px));
		position:sticky !important;
	}
/* These items must already by marked position sticky in the block editor	 */
	.sticky-list-item {
		top: calc(160px + var(--wp-admin--admin-bar--position-offset, 160px)) !important;
	}
}

/* * * SMALLER THAN * * * */
@media screen and (max-width: 1260px) {
	#wrapAtMobile {
		flex-wrap: wrap !important;
	}
	/* newsletter subscribe form	 */
	div#signupCTA {
		flex-wrap: nowrap;
	}
	#signupCTA div#gform_wrapper_2, #signupCTA .gform-body.gform_body {
		min-width: 100%;
	}
	#signupCTA form#gform_2 {
		flex-direction: column;
		align-items: flex-start;
	}
	#signupCTA div#gform_fields_2 {
		flex-direction: column;
		display: flex;
		gap: 10px;
	}
}

@media screen and (max-width: 700px) {
	/* 	Newsletter form */
	div#signupCTA {
		flex-wrap: wrap;
	}
	div#signup1 {
		min-width: 94%;
	}
	/* Profile page - Center the figure on mobile */
	 .single-oi_team .wp-block-cover__image-background {
    object-position: 40% 25%;
  }
}
@media screen and (max-width: 600px) {
	img.oi-logo__img, body.header-shrink.scrolling .oi-site-logo .oi-logo__img {
		max-width: 70px !important;
	}
	p {
		font-size: 16px;
	}
	.hide-at-mobile {
		display: none !important;
	}
	.remove-min-height {
		min-height: unset !important;
	}
	#heroDownArrow {
		padding-bottom: 0px !important;
	}
	#pagesDownArrow {
		padding-top: 0 !important;
	}
	/* * * home page * * * */
	#resources .wp-block-spacer {
		height: 0 !important;
	}
	#resourcesHeading {
		border-bottom: 1px solid navy;
		padding-bottom: 23px;
	}
	#articleSectionCol {
		margin-top: 150px;
		margin-bottom: 56px;

		border-top: 1px solid navy;
		padding-top: 30px;
	}
	.page-services figure.wp-block-image {
		max-width: 75%;
	}

}