/*
Theme Name: Carol Schwartz AO 2026 Theme
Theme URI: 
Author: Studio Sometimes
Author URI: 
Description: Block theme for Carol Schwartz AO's website.
Requires at least: 6.9
Tested up to: 6.9
Requires PHP: 7.2
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: carol-schwartz-ao-2026-theme
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, style-variations, accessibility-ready, blog, portfolio, news

/*
 * Smooth scrolling for anchor links
 */

/*
 * Smooth scrolling for anchor links
 */
html {
	scroll-behavior: smooth;
}

/*
 * Header fade-in and drop-down animation
 */
@keyframes headerDropIn {
	from {
		opacity: 0;
		transform: translateY(-30px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

header {
	width: 100%;
	position: absolute;
	z-index: 1000;
	margin-bottom: -100px;
	background: linear-gradient(180deg,rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 100%);
}

header .wp-block-site-logo {
	animation: headerDropIn 0.6s ease-out forwards;
}


/*
 * Link styles
 * https://github.com/WordPress/gutenberg/issues/42319
 */
a {
	text-decoration-thickness: 1px !important;
	text-underline-offset: .1em;
}



/* Focus styles */
:where(.wp-site-blocks *:focus) {
	outline-width: 2px;
	outline-style: solid;
}

/* Increase the bottom margin on submenus, so that the outline is visible. */
.wp-block-navigation .wp-block-navigation-submenu .wp-block-navigation-item:not(:last-child) {
	margin-bottom: 3px;
}

/* Increase the outline offset on the parent menu items, so that the outline does not touch the text. */
.wp-block-navigation .wp-block-navigation-item .wp-block-navigation-item__content {
	outline-offset: 4px;
}

/* Remove outline offset from the submenus, otherwise the outline is visible outside the submenu container. */
.wp-block-navigation .wp-block-navigation-item ul.wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	outline-offset: 0;
}

/*
 * Progressive enhancement to reduce widows and orphans
 * https://github.com/WordPress/gutenberg/issues/55190
 */
h1, h2, h3, h4, h5, h6, blockquote, caption, figcaption, p {
	text-wrap: pretty;
}

/*
 * Change the position of the more block on the front, by making it a block level element.
 * https://github.com/WordPress/gutenberg/issues/65934
*/
.more-link {
	display: block;
}


/* GutSlider Overrides */

.wp-block-gutsliders-any-content .gutslider-content-inner {
	padding: 0;
}

.gutslider-content-inner {
	display: flex;
	flex-direction: column;

	height: 100%;
}



/* Any child tagged fill-height will take the full height */
.gutslider-content-inner .stretch-to-fill-height {
	flex: 1 1 auto;
	flex-direction: column;
	justify-content: flex-start;
	margin-top: 10px;
}

.gutslider-content-inner .stretch-to-fill-height .link-arrow {
	margin-top: auto;
}

.swiper-slide {
    height: auto !important;
}

/* Force 2.5 slides per view for GutSlider */
/* Override Swiper's width calculation to accommodate forced slide widths */
.wp-block-gutsliders-any-content .swiper {
	width: 100% !important;
	max-width: 100% !important;
}

.wp-block-gutsliders-any-content .swiper-wrapper {
	width: 100% !important;
}

.wp-block-gutsliders-any-content .swiper-slide {
	/* For 2.5 slides: each slide = (100% - total gaps) / 2.5 */
	/* With spaceBetween 4px: 2 gaps = 8px total */
	width: calc((100% - 8px) / 2.5) !important;
	flex-shrink: 0;
}

/* Mobile: Show 1.3 slides per view */
@media (max-width: 768px) {
	.wp-block-gutsliders-any-content .swiper-slide {
		/* With spaceBetween 2px: 1 gap = 2px total */
		width: calc((100% - 2px) / 1.3) !important;
	}
}

.swiper-container-outer .wp-block-heading {
	transition: color 0.2s ease-out;
}

.swiper-container-outer:hover .wp-block-heading {
	color: var(--wp--preset--color--primary)!important;
}

.gutslider-nav {
	padding-right: var(--wp--style--root--padding-right);
    padding-left: var(--wp--style--root--padding-left);
}

/* Forces GutSlider to be full width when full width is enabled */
 .has-global-padding > .alignfull.wp-block-gutsliders-any-content {
	margin-right: calc(var(--wp--style--root--padding-right) * -1);
    margin-left: calc(var(--wp--style--root--padding-left) * -1);
 }

/* Cover with Bottom Gradient Overlay and Logo */
.wp-block-cover.has-gradient-overlay-bottom {
	position: relative;
}

/* Gradient overlay that fades from dark at bottom to transparent at top */
.wp-block-cover.has-gradient-overlay-bottom::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.5) 30%, rgba(0, 0, 0, 0.2) 60%, transparent 100%);
	pointer-events: none;
	z-index: 1;
}

/* Ensure the inner container and content are above the gradient */
.wp-block-cover.has-gradient-overlay-bottom .wp-block-cover__inner-container {
	position: relative;
	z-index: 2;
	height: 100%;
	display: flex;
	align-items: flex-end;
}

/* Cover block with bottom fade wash overlay */
.wp-block-cover.bottom-fade-wash {
	position: relative;
}


/* Gradient wash overlay that fades in from the bottom */
.wp-block-cover.bottom-fade-wash::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.4) 40%, rgba(0, 0, 0, 0.1) 70%, transparent 100%);
	pointer-events: none;
	z-index: 1;
}

/* Ensure the inner container and content are above the wash overlay */
.wp-block-cover.bottom-fade-wash .wp-block-cover__inner-container {
	position: relative;
	z-index: 2;
}

/* Logo container styling */
.cover-logo-container {
	position: relative;
	z-index: 3;
}

.cover-logo-container svg {
	display: block;
	max-width: 100%;
	height: auto;
}

/* Responsive adjustments */
@media (max-width: 768px) {
	.cover-logo-container svg {
		width: 100%;
		max-width: 350px;
	}
}

footer.wp-block-template-part {
	margin: 0;
}

/* WPForms Overrides for footer contact form */
.footer-contact-form .wpforms-field-label {
	display:none!important;
}


.footer-contact-form .wpforms-field-medium,
.footer-contact-form .wpforms-field-large {
border-top:0!important;
border-left:0!important;
border-right:0!important;
padding:0!important;
}

.footer-contact-form .wpforms-field-medium:focus,
.footer-contact-form .wpforms-field-large:focus,
.footer-contact-form input:focus,
.footer-contact-form textarea:focus {
	outline: none !important;
	border-bottom-color: inherit !important;
	box-shadow: none !important;
}

.footer-contact-form textarea {
	resize: none !important;
	field-sizing: content;
	min-height: 1.5em;
	overflow: hidden;
}

.footer-contact-form input::placeholder,
.footer-contact-form textarea::placeholder {
	color: white !important;
	opacity: 1;
}

.footer-contact-form input::-webkit-input-placeholder,
.footer-contact-form textarea::-webkit-input-placeholder {
	color: white !important;
	opacity: 1;
}

.footer-contact-form input::-moz-placeholder,
.footer-contact-form textarea::-moz-placeholder {
	color: white !important;
	opacity: 1;
}

.footer-contact-form input:-ms-input-placeholder,
.footer-contact-form textarea:-ms-input-placeholder {
	color: white !important;
	opacity: 1;
}

.footer-contact-form .wpforms-submit {
	width: 80px!important;
    height: 80px!important;
}

/* Philanthropy Grid Layout - Internal borders only */
.philanthropy-grid-container {
	@media (max-width: 768px) {
		grid-template-columns: repeat(1, 1fr)!important;
	}
}
.philanthropy-grid-container > .wp-block-group,
.philanthropy-grid-container > .wp-block-tiptip-hyperlink-group-block {
	transition: all 0.3s ease-out;
}

.philanthropy-grid-container > .wp-block-group:hover,
.philanthropy-grid-container > .wp-block-tiptip-hyperlink-group-block:hover {
	background-color: var(--wp--preset--color--primary-light)!important;
	color: white!important;
}

.philanthropy-grid-container > .wp-block-group:hover h6,
.philanthropy-grid-container > .wp-block-tiptip-hyperlink-group-block:hover h6 {
	color: white!important;
}


/* News Grid Layout - Internal borders only */
.news-grid-container {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0;
}


.news-grid-container > .wp-block-group,
.news-grid-container > .wp-block-tiptip-hyperlink-group-block {
	border-right: 1px solid var(--wp--preset--color--primary-light);
	border-bottom: 1px solid var(--wp--preset--color--primary-light);
	padding: 60px 50px;
	transition: background-color 0.3s ease;
}

.news-grid-container a.wp-block-tiptip-hyperlink-group-block {
	text-decoration: none;
}

.news-grid-container > .wp-block-group a,
.news-grid-container > .wp-block-tiptip-hyperlink-group-block a {
	text-decoration: none;
}

.news-grid-container > .wp-block-group:hover,
.news-grid-container > .wp-block-tiptip-hyperlink-group-block:hover {
	background-color: var(--wp--preset--color--primary-light);
	color: white!important;
}

.news-grid-container > .wp-block-group:hover h6,
.news-grid-container > .wp-block-tiptip-hyperlink-group-block:hover h6 {
	color: white!important;
}

/* Remove right border from last column of each row */
.news-grid-container > .wp-block-group:nth-child(3n),
.news-grid-container > .wp-block-tiptip-hyperlink-group-block:nth-child(3n) {
	border-right: none;
}

/* Remove right border from last column of each row */
.news-grid-container > .wp-block-group:nth-child(3n),
.news-grid-container > .wp-block-tiptip-hyperlink-group-block:nth-child(3n) {
	border-right: none;
}

/* Remove bottom border from items in last row (handled by JS class) */
.news-grid-container > .wp-block-group.grid-last-row-item,
.news-grid-container > .wp-block-tiptip-hyperlink-group-block.grid-last-row-item {
	border-bottom: none;
}

/* Last item spans full width (single item in last row) */
.news-grid-container > .wp-block-group.grid-last-span,
.news-grid-container > .wp-block-tiptip-hyperlink-group-block.grid-last-span {
	grid-column: 1 / -1;
	border-right: none;
	border-top: 1px solid var(--wp--preset--color--primary-light);
	border-bottom: none;
}

/* Two items in last row - first spans 2 columns, second spans 1 (2:1 ratio) */
.news-grid-container > .wp-block-group.grid-last-span-two-first,
.news-grid-container > .wp-block-tiptip-hyperlink-group-block.grid-last-span-two-first {
	grid-column: span 2;
	border-top: 1px solid var(--wp--preset--color--primary-light);
	border-bottom: none;
}

.news-grid-container > .wp-block-group.grid-last-span-two-second,
.news-grid-container > .wp-block-tiptip-hyperlink-group-block.grid-last-span-two-second {
	grid-column: span 1;
	border-top: 1px solid var(--wp--preset--color--primary-light);
	border-bottom: none;
	border-right: none;
}

/* Mobile: Stack grid items vertically */
@media (max-width: 768px) {
	.news-grid-container {
		grid-template-columns: 1fr;
	}
	
	/* Remove all right borders on mobile (everything stacks) */
	.news-grid-container > .wp-block-group,
	.news-grid-container > .wp-block-tiptip-hyperlink-group-block {
		border-right: none;
		border-bottom: 1px solid var(--wp--preset--color--primary-light)!important;
	}
	.news-grid-container .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
		margin-left:0!important;
		margin-right:0!important;
	}

	.news-grid-container > .wp-block-tiptip-hyperlink-group-block .wp-block-spacer {
		height: 0px!important;
	}

	/* Adjust padding for mobile */
	.news-grid-container > .wp-block-group,
	.news-grid-container > .wp-block-tiptip-hyperlink-group-block {
		padding: 40px 40px;
	}
}

/* Overlay Menu System */
.overlay-menu-wrapper {
	position: relative;
}

/* Toggle button - circular, fixed top right */
.overlay-menu-toggle {
	position: fixed;
	top: 30px;
	right: 30px;
	width: 60px;
	height: 60px;
	border-radius: 50%;
	background-color: var(--wp--preset--color--primary-light);
	color: white;
	border: none;
	cursor: pointer;
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0;
	line-height: 1;
	transition: transform 0.3s ease, background-color 0.3s ease;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
	padding: 0;
	margin: 0;
}

.overlay-menu-toggle:hover {
	background-color: var(--wp--preset--color--primary);
	transform: scale(1.05);
}

.overlay-menu-toggle:focus {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 2px;
}

.overlay-menu-icon {
	font-size: 28px;
	font-weight: 300;
	line-height: 1;
	display: block;
	transition: transform 0.3s ease;
}

/* Overlay menu container - white rounded rectangle, slides from behind button */
.overlay-menu {
	position: fixed;
	top: 30px;
	right: 30px;
	width: auto;
	min-width: 300px;
	max-width: 500px;
	background-color: white;
	border-radius: 99px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
	z-index: 9998;
	transform-origin: top right;
	transform: scaleX(0) translateX(0);
	transition: transform 0.3s ease-in-out, opacity 0.2s ease-in-out, visibility 0s 0.3s;
	overflow: hidden;
	padding: 10px 90px 10px 30px;
	visibility: hidden;
	opacity: 0;
	height: 40px;
	display: flex;
	align-items: center;
}

/* When menu is open - slide in from behind button */
.overlay-menu.is-open {
	transform: scaleX(1) translateX(0);
	visibility: visible;
	opacity: 1;
	transition: transform 0.3s ease-in-out, opacity 0.2s ease-in-out 0.1s, visibility 0s 0s;
}

/* Navigation links inside overlay - horizontal layout */
.overlay-menu-nav {
	padding: 0;
}

.overlay-menu-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: row;
	gap: 24px;
	align-items: center;
	justify-content: flex-start;
	flex-wrap: wrap;
}

.overlay-menu-list li {
	margin: 0;
	padding: 0;
}

.overlay-menu-list a {
	color: var(--wp--preset--color--primary);
	text-decoration: none;
	text-transform: uppercase;
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: 0.5px;
	transition: color 0.3s ease;
	display: block;
	padding: 8px 0;
	font-weight: 400;
}

.overlay-menu-list a:hover {
	color: var(--wp--preset--color--primary);
	text-decoration: none;
}

/* Prevent body scroll when menu is open */
/* body.menu-open {
	overflow: hidden;
} */

/* Mobile: Full screen overlay with stacked menu items */
@media (max-width: 768px) {
	.overlay-menu-toggle {
		top: 20px;
		right: 20px;
		width: 50px;
		height: 50px;
	}
	
	.overlay-menu-icon {
		font-size: 24px;
	}
	
	/* Full screen overlay on mobile */
	.overlay-menu {
		top: 0;
		right: 0;
		left: 0;
		bottom: 0;
		width: 100%;
		max-width: 100%;
		height: 100vh;
		border-radius: 0;
		transform-origin: top right;
		transform: translateX(100%);
		padding: 100px 30px 30px;
	}
	
	.overlay-menu.is-open {
		transform: translateX(0);
	}
	
	/* Stack menu items vertically on mobile */
	.overlay-menu-list {
		flex-direction: column;
		align-items: flex-start;
		gap: 20px;
	}
	
	.overlay-menu-list a {
		font-size: var(--wp--preset--font-size--large);
		padding: 12px 0;
	}
}

/* Staggered Fade-in Animation for Images */
@keyframes fadeIn {
	from {
		opacity: 0;
		transform: translateY(20px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* Base class for fade-in images - starts hidden */
.fade-in-image {
	opacity: 0;
	animation: fadeIn 0.6s ease-out forwards;
}

/* Staggered delays - apply these classes to images */
.fade-in-image.delay-1 {
	animation-delay: 0.8s;
}

.fade-in-image.delay-2 {
	animation-delay: 1s;
}

.fade-in-image.delay-3 {
	animation-delay: 0.3s;
}

.fade-in-image.delay-4 {
	animation-delay: 0.4s;
}

.fade-in-image.delay-5 {
	animation-delay: 0.5s;
}

.fade-in-image.delay-6 {
	animation-delay: 0.6s;
}

/* Alternative: Auto-stagger for images in a container */
.fade-in-container,
.fade-in-container .wp-block-image {
	opacity: 0;
	animation: fadeIn 0.6s ease-out forwards;
}

.fade-in-container:nth-child(1),
.fade-in-container .wp-block-image:nth-child(1) {
	animation-delay: 0.4s;
}

.fade-in-container:nth-child(2),
.fade-in-container .wp-block-image:nth-child(2) {
	animation-delay: 1s;
}

/* Responsive Visibility Utilities */
/* Hide on mobile and smaller viewports (up to 768px) */
@media (max-width: 768px) {
	.hide-mobile,
	.hide-on-mobile {
		display: none !important;
	}
}

/* Show only on mobile (hidden on desktop) */
.show-mobile-only {
	display: none !important;
}

@media (max-width: 768px) {
	.show-mobile-only {
		display: block !important;
	}
}

/* Hide on tablet and smaller (up to 1024px) */
@media (max-width: 1024px) {
	.hide-tablet,
	.hide-on-tablet {
		display: none !important;
	}
}

/* Show only on desktop (hidden on mobile and tablet) */
.show-desktop-only {
	display: block !important;
}

@media (max-width: 1024px) {
	.show-desktop-only {
		display: none !important;
	}
}

/* Cap width on large screens */
@media (min-width: 1400px) {
	.cap-width-on-large-screens {
		max-width: 1400px;
		margin-left: auto!important;
		margin-right: auto!important;
	}
}


.wp-block-cover.align-self-end > .wp-block-cover__inner-container {
	align-self: flex-end;
}

a.wp-block-tiptip-hyperlink-group-block {
	text-decoration: none;
	cursor: pointer!important;
}

/* Link arrow hover expansion effect */
a .link-arrow {
	transition: transform 0.2s ease-out, background 0.2s ease-out, border 0.2s ease-out;
	display: inline-block!important;
	text-align: center;
    border-radius: 99px;
	height: 30px!important;
    width: 30px!important;
	background: none;
	border: 1px solid var(--wp--preset--color--primary);
}

a .link-arrow img {
	vertical-align: top;
    height: 20px;
	padding-left: 4px;
	padding-top: 4px;
	transition: filter 0.2s ease-out;
}

a:hover .link-arrow {
	transform: rotate(45deg);
	border: 1px solid white;
}

a .hyperlink-in-card {
	text-decoration-color: var(--wp--preset--color--primary)!important;
	text-decoration: underline;
	cursor: pointer;
}

a:hover .hyperlink-in-card {
	text-decoration-color: white!important;
	text-decoration-thickness: 1px !important;
	text-underline-offset: .3em;
text-decoration: underline;
transition: all 0.2s ease-out;
}

/* Image zoom on hover for hyperlink group blocks */
.wp-block-tiptip-hyperlink-group-block .wp-block-image:hover {
}



/* Turn SVG white on hover (for img tags) */
.hover-turn-svg-white img {
	transition: filter 0.3s ease-out;
}

.hover-turn-svg-white:hover img {
	filter: brightness(0) invert(1);
}

h5.is-style-text-subtitle {
	text-transform: uppercase;
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: 0.7px;
	font-weight: 500;
	color: var(--wp--preset--color--primary);
}

@media (max-width: 500px) {
	.hero-h1 {
		font-size: 1.5rem!important;
	}
}

.w-100 {
	width: 100%!important;
}

.h-100-force {
	height: 100%!important;
}
.h-100-force img {
	height: 100%!important;
	object-fit: cover!important;
}

@media (max-width: 500px) {

	.hero-header .wp-block-columns {
		gap: 0!important;
	}

	
}

.site-logo-header img {
	width: 150px;
	transition: width 0.3s ease-in-out;
	@media (max-width: 900px) {	
		width: 130px;
	}
	@media (max-width: 500px) {	
		width: 110px;
	}
}

.site-header-group {
	padding-top:20px!important;
	padding-bottom:30px!important;

}


ul {
	padding-left: 20px;
}

/* Changes checkmark to a right facing chevron  */
ul.is-style-checkmark-list {
    list-style-type: "\276F";
}

@media (max-width: 900px) {	

h1.chair-header {
	font-size: 2.5rem!important;
}
}

/* Above-fold container: flex layout to fill 100vh */
.above-fold {
	display: flex;
	flex-direction: column;
	height: 100vh;
	min-height: 100vh;
	min-height: 600px!important;
}

@media (min-width: 1500px) {
	.above-fold {
min-height: 900px!important;
	}
}

/* First child (cover image group) - takes remaining space */
.above-fold > .wp-block-group:first-child {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	min-height: 0; /* Allows flex child to shrink below content size */
}

/* Cover block inside first group - fills available space */
.above-fold > .wp-block-group:first-child .wp-block-cover {
	flex: 1 1 auto;
	height: 100%;
	min-height: 0;
}

/* Second child (text group) - only as tall as content */
.above-fold > .wp-block-group:last-child {
	flex: 0 0 auto;
}
