/* Word of Life Australia — theme styles beyond theme.json. */

:root {
	--wol-radius: 20px;
	--wol-radius-sm: 14px;
	--wol-line: #D8E3E8;
	--wol-grade: saturate(0.9) contrast(1.04) hue-rotate(-4deg);
}

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { transition: none !important; animation: none !important; }
}

body { -webkit-font-smoothing: antialiased; overflow-x: hidden; }
img { max-width: 100%; height: auto; }

:where(a, button, input, select, textarea, summary):focus-visible {
	outline: 3px solid var(--wp--preset--color--sky);
	outline-offset: 3px;
	border-radius: 4px;
}
.has-deep-teal-background-color :focus-visible,
.has-teal-background-color :focus-visible { outline-color: #fff; }

.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px,1px,1px,1px); white-space: nowrap; }

/* ---------- Section rhythm: full-width bands butt together, no stray gaps ---------- */
.wp-site-blocks > * { margin-block-start: 0 !important; }
.wp-block-post-content > .alignfull, .wp-block-post-content > .alignfull + * { margin-block-start: 0 !important; }
.wp-block-post-content > .alignfull:last-child { margin-block-end: 0; }
.wol-main { margin-block-start: 0 !important; }

/* ---------- Header ---------- */
.wol-site-header { position: sticky; top: 0; z-index: 50; }
.admin-bar .wol-site-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .wol-site-header { top: 0; position: relative; } }
.wol-header { box-shadow: 0 1px 0 var(--wol-line), 0 8px 24px rgba(1,55,70,0.06); }
.wol-logo { display: flex; align-items: center; min-height: 44px; line-height: 0; flex-shrink: 0; }
.wol-nav .wp-block-navigation__submenu-icon { width: 24px; height: 24px; padding: 10px; margin-left: 0; box-sizing: content-box; }
.wol-logo img { width: clamp(150px, 18vw, 232px); height: auto; }
.wol-header__nav { gap: 1.25rem; }
.wol-nav a { text-decoration: none; color: var(--wp--preset--color--ink); }
.wol-nav .wp-block-navigation-item__content { padding-block: 0.5rem; }
.wol-nav > .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content:hover,
.wol-nav .current-menu-item > a { color: var(--wp--preset--color--teal); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 6px; }
.wol-nav-external > a::after { content: " ↗"; font-size: 0.85em; }
.wol-nav .wp-block-navigation__submenu-container {
	border: 0 !important; border-radius: var(--wol-radius-sm); padding: 0.6rem !important;
	box-shadow: 0 18px 40px rgba(1,55,70,0.16); min-width: 250px !important;
}
.wol-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content { padding: 0.55rem 0.8rem !important; border-radius: 10px; }
.wol-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover { background: var(--wp--preset--color--mist); }
.wol-header__give .wp-block-button__link { padding: 0.7rem 1.4rem; }
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close { min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }
.wp-block-navigation__responsive-container-open svg { width: 30px; height: 30px; }
/* Mobile overlay */
.wol-nav .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--wp--preset--color--deep-teal) !important; color: #fff !important; padding: 1.25rem 1.5rem 2rem;
}
.wol-nav .is-menu-open a { color: #fff !important; font-size: 1.2rem; }
.wol-nav .is-menu-open .wp-block-navigation__submenu-container { background: transparent !important; box-shadow: none; padding: 0.25rem 0 0.5rem 1rem !important; }
.wol-nav .is-menu-open .wp-block-navigation__submenu-container a { font-size: 1.02rem; opacity: 0.9; }
.wol-nav .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover { background: rgba(255,255,255,0.08); }
.wol-nav .is-menu-open .wp-block-navigation__responsive-container-content { gap: 0.6rem; align-items: flex-start; padding-top: 1.5rem; }
/* The header nav is right-justified; inside the open overlay everything reads left to right. */
.wol-nav .is-menu-open .wp-block-navigation__responsive-container-content,
.wol-nav .is-menu-open .wp-block-navigation__container,
.wol-nav .is-menu-open .wp-block-navigation-item,
.wol-nav .is-menu-open .wp-block-navigation__submenu-container { align-items: flex-start !important; justify-content: flex-start !important; text-align: left !important; }
.wol-nav .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content { font-family: var(--wp--preset--font-family--abril); font-size: 1.6rem !important; }
@media (max-width: 599px) { .wol-header__give .wp-block-button__link { padding: 0.6rem 1.1rem; } .wol-header__nav { gap: 0.4rem; } }
.wol-header__give .wp-block-button__link { white-space: nowrap; }
/* A Give link inside the overlay (the header button is hidden behind it); never shown in the inline menu. */
.wol-nav .wp-block-navigation__container > .wol-nav-give { display: none; }
.wol-nav .is-menu-open .wp-block-navigation__container > .wol-nav-give { display: flex; margin-top: 1rem; }
.wol-nav .is-menu-open .wol-nav-give > a { background: var(--wp--preset--color--sky); color: var(--wp--preset--color--deep-teal) !important; border-radius: 999px; padding: 0.6rem 1.6rem !important; font-family: var(--wp--preset--font-family--work-sans) !important; font-weight: 700; font-size: 1.1rem !important; }
/* The full menu needs ~1180px; below that use the overlay menu (core only switches below 600px). */
@media (min-width: 600px) and (max-width: 1180px) {
	.wol-nav .wp-block-navigation__responsive-container-open:not(.always-shown) { display: inline-flex !important; }
	.wol-nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none !important; }
	.wol-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close { display: inline-flex !important; }
	.wol-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { flex-direction: column; align-items: flex-start; }
	.wol-nav .is-menu-open .wp-block-navigation__submenu-container { position: static !important; opacity: 1 !important; visibility: visible !important; width: auto !important; height: auto !important; min-width: 0 !important; }
	.wol-nav .is-menu-open .wp-block-navigation__submenu-icon { display: none; }
}

/* ---------- Type helpers ---------- */
.wol-eyebrow-script, .is-style-wol-script {
	font-family: var(--wp--preset--font-family--yesteryear); font-size: clamp(1.6rem, 3vw, 2.25rem);
	line-height: 1; color: var(--wp--preset--color--teal); margin-bottom: 0.35rem !important;
}
.has-deep-teal-background-color .wol-eyebrow-script, .has-teal-background-color .wol-eyebrow-script,
.wp-block-cover .wol-eyebrow-script, .has-deep-teal-background-color .is-style-wol-script,
.has-teal-background-color .is-style-wol-script, .wp-block-cover .is-style-wol-script { color: var(--wp--preset--color--sky); }
.wol-eyebrow, .wol-eyebrow a {
	font-size: 0.8rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
	color: var(--wp--preset--color--teal); text-decoration: none;
}
.wol-lead { font-size: var(--wp--preset--font-size--large); line-height: 1.55; }
.has-deep-teal-background-color h1, .has-deep-teal-background-color h2, .has-deep-teal-background-color h3,
.has-teal-background-color h1, .has-teal-background-color h2, .has-teal-background-color h3 { color: #fff; }
.has-deep-teal-background-color a:not(.wp-element-button), .has-teal-background-color a:not(.wp-element-button) { color: #fff; }

/* ---------- Images: one treatment for everything ---------- */
.wp-block-image img, .wp-block-post-featured-image img, .wol-photo img, .wp-block-media-text__media img, .wp-block-cover__image-background {
	filter: var(--wol-grade);
}
.wp-block-image, .wp-block-post-featured-image, .wol-photo { border-radius: var(--wol-radius); overflow: hidden; }
.wp-block-image img, .wp-block-media-text__media img { border-radius: var(--wol-radius); }
.is-style-wol-photo { position: relative; }
.is-style-wol-photo::after, .wol-photo::after {
	content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
	background: linear-gradient(180deg, rgba(2,79,103,0) 55%, rgba(2,79,103,0.22) 100%); mix-blend-mode: multiply;
}
.wp-block-cover { border-radius: 0; }
.wp-block-cover.is-style-rounded, .wol-rounded { border-radius: var(--wol-radius); overflow: hidden; }
.wp-block-cover .wp-block-cover__inner-container h1, .wp-block-cover .wp-block-cover__inner-container h2 { color: #fff; }

/* ---------- Cards ---------- */
.wol-card, .is-style-wol-card {
	background: #fff; border: 1px solid var(--wol-line); border-radius: var(--wol-radius); overflow: hidden;
	height: 100%; gap: 0 !important; transition: transform .2s ease, box-shadow .2s ease;
}
.wol-card:hover, .is-style-wol-card:hover { transform: translateY(-3px); box-shadow: 0 16px 36px rgba(1,55,70,0.12); }
.wol-card .wp-block-post-featured-image { border-radius: 0; margin: 0; }
.wol-card__body { padding: 1.25rem 1.4rem 1.5rem; gap: 0.5rem !important; }
.wol-card__body .wp-block-post-title a { text-decoration: none; color: var(--wp--preset--color--ink); }
.wol-card__body .wp-block-post-title a:hover { color: var(--wp--preset--color--teal); }
.is-style-wol-card { padding: clamp(1.25rem, 3vw, 2rem); }
.has-sand-background-color .is-style-wol-card, .has-mist-background-color .is-style-wol-card { border-color: transparent; }
.wol-post-grid { gap: 1.5rem !important; }

/* Ministry card grid (core/columns inside .wol-grid or plugin output) */
.wol-tile { position: relative; display: flex; flex-direction: column; border-radius: var(--wol-radius); overflow: hidden; background: #fff; border: 1px solid var(--wol-line); text-decoration: none !important; color: inherit !important; height: 100%; transition: transform .2s ease, box-shadow .2s ease; }
.wol-tile:hover { transform: translateY(-3px); box-shadow: 0 16px 36px rgba(1,55,70,0.12); }
.wol-tile__img { aspect-ratio: 3 / 2; overflow: hidden; position: relative; background: var(--wp--preset--color--mist); }
.wol-tile__img img { width: 100%; height: 100%; object-fit: cover; filter: var(--wol-grade); display: block; }
.wol-tile__img::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(1,55,70,0) 45%, rgba(1,55,70,0.7)); }
.wol-tile__tag { position: absolute; left: 1.1rem; bottom: 0.8rem; z-index: 1; font-family: var(--wp--preset--font-family--yesteryear); font-size: 1.6rem; color: #fff; line-height: 1.1; }
.wol-tile__body { padding: 1.2rem 1.35rem 1.4rem; display: flex; flex-direction: column; gap: 0.45rem; flex-grow: 1; }
.wol-tile__body > * { margin: 0; }
.wol-tile__title { font-family: var(--wp--preset--font-family--abril); font-size: 1.6rem; line-height: 1.1; color: var(--wp--preset--color--ink); }
.wol-tile__text { font-size: 0.975rem; line-height: 1.55; color: var(--wp--preset--color--charcoal); }
.wol-tile__more { margin-top: auto; padding-top: 0.4rem; font-weight: 700; color: var(--wp--preset--color--teal); }
.wol-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17.5rem), 1fr)); gap: 1.5rem; }

/* ---------- Buttons ---------- */
.wp-block-button.is-style-outline > .wp-block-button__link {
	border: 2px solid currentColor; background: transparent; color: var(--wp--preset--color--teal); padding: calc(0.85rem - 2px) calc(1.6rem - 2px);
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover { background: var(--wp--preset--color--teal); color: #fff; border-color: var(--wp--preset--color--teal); }
.has-deep-teal-background-color .wp-block-button.is-style-outline > .wp-block-button__link,
.has-teal-background-color .wp-block-button.is-style-outline > .wp-block-button__link,
.wp-block-cover .wp-block-button.is-style-outline > .wp-block-button__link { color: #fff; }
.wp-block-button.is-style-sky > .wp-block-button__link, .wol-btn-sky .wp-block-button__link { background: var(--wp--preset--color--sky); color: var(--wp--preset--color--deep-teal); }
.wp-element-button, .wp-block-button__link { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; text-align: center; }
.wol-external::after, .wol-events-link .wp-block-button__link::after { content: " ↗"; }

/* ---------- FAQ (core/details) ---------- */
.wp-block-details summary { cursor: pointer; font-weight: 600; font-size: 1.05rem; color: var(--wp--preset--color--ink); list-style: none; display: flex; justify-content: space-between; gap: 1rem; min-height: 44px; align-items: center; }
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after { content: "+"; font-size: 1.5rem; line-height: 1; color: var(--wp--preset--color--teal); flex-shrink: 0; }
.wp-block-details[open] summary::after { content: "–"; }
.wp-block-details > :not(summary) { margin-top: 0.6rem; }

/* ---------- Quotes / testimonies ---------- */
.wp-block-quote cite { display: block; margin-top: 0.75rem; font-size: 0.95rem; font-style: normal; font-weight: 600; color: var(--wp--preset--color--teal); }
.wol-testimony { background: var(--wp--preset--color--mist); border-radius: var(--wol-radius); padding: clamp(1.25rem, 3vw, 2rem); border: 0 !important; }

/* ---------- Page head / breadcrumbs ---------- */
.wol-page-head .wp-block-post-title { margin-top: 0.4rem; }
.wol-breadcrumbs { font-size: 0.9rem; }
.wol-breadcrumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.35rem; }
.wol-breadcrumbs li + li::before { content: "›"; margin-right: 0.35rem; color: var(--wp--preset--color--charcoal); }
.wol-breadcrumbs a { color: var(--wp--preset--color--teal); }
.wol-byline { gap: 0.75rem; font-size: 0.95rem; color: var(--wp--preset--color--charcoal); }
.wol-byline > * + *::before { content: "·"; margin-right: 0.75rem; }

/* ---------- Footer ---------- */
.wol-footer { font-size: 0.975rem; }
.wol-footer a { color: #fff; text-decoration: none; }
.wol-footer a:hover { text-decoration: underline; }
.wol-footer__logo { display: inline-block; background: #fff; padding: 0.8rem 1rem; border-radius: var(--wol-radius-sm); line-height: 0; }
.wol-footer__logo img { width: 210px; }
.wol-footer__contact { font-style: normal; display: flex; flex-direction: column; gap: 0.35rem; }
.wol-footer__h { font-family: var(--wp--preset--font-family--work-sans) !important; font-size: 0.8rem !important; font-weight: 700 !important; letter-spacing: 0.14em; text-transform: uppercase; color: var(--wp--preset--color--sky) !important; }
.wol-footer__list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 0.2rem; }
.wol-footer__list a { display: inline-flex; min-height: 36px; align-items: center; }
.wol-footer__base { border-top: 1px solid rgba(255,255,255,0.18); margin-top: var(--wp--preset--spacing--50) !important; padding-top: 1.25rem; opacity: 0.9; }

/* ---------- Heroes ---------- */
/* Full-width covers keep their text on the 1240px grid, with the site gutter on small screens. */
.wp-block-cover.alignfull {
	padding-inline: max(clamp(1rem, 4vw, 2.5rem), calc((100vw - 1240px) / 2));
	padding-block: clamp(2.5rem, 6vw, 4.5rem);
}
.wp-block-cover.alignfull > .wp-block-cover__inner-container { width: 100%; max-width: 1240px; padding-inline: 0 !important; }
.wp-block-cover .wp-block-cover__inner-container > * { max-width: 44rem; margin-left: 0 !important; }
.wp-block-cover .wp-block-cover__inner-container > .wp-block-buttons { max-width: none; }
.wol-hero .wol-hero-title { font-size: var(--wp--preset--font-size--display); }
.wp-block-cover .wol-lead { color: #EAF6FB; }
.wp-block-cover .wol-breadcrumbs a, .wp-block-cover .wol-breadcrumbs span { color: #CFEFFC; }
@media (max-width: 600px) { .wp-block-cover { min-height: 460px !important; } }

/* ---------- Hero background video (see assets/js/hero-video.js) ---------- */
.wol-hero-video__frame { position: absolute; inset: 0; overflow: hidden; z-index: 0; opacity: 0; transition: opacity 1.2s ease; pointer-events: none; }
.wol-hero-video.is-video-playing .wol-hero-video__frame { opacity: 1; }
.wol-hero-video__frame iframe { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); border: 0; filter: var(--wol-grade); }
.wol-hero-video__toggle {
	position: absolute; right: clamp(1rem, 3vw, 2rem); bottom: clamp(1rem, 3vw, 1.5rem); z-index: 2;
	display: inline-flex; align-items: center; gap: 0.5rem; min-height: 44px; padding: 0 1rem;
	border-radius: 999px; border: 1.5px solid rgba(255,255,255,0.6); background: rgba(1,55,70,0.55);
	color: #fff; font: 600 0.875rem var(--wp--preset--font-family--work-sans); cursor: pointer; backdrop-filter: blur(4px);
}
.wol-hero-video__toggle:hover { background: rgba(1,55,70,0.8); }
.wol-hero-video__toggle[hidden] { display: none; }
.wol-hero-video__icon { width: 12px; height: 12px; display: inline-block; background: linear-gradient(90deg, #fff 0 35%, transparent 35% 65%, #fff 65% 100%); }
.wol-hero-video.is-video-paused .wol-hero-video__icon { background: none; width: 0; height: 0; border-left: 11px solid #fff; border-top: 7px solid transparent; border-bottom: 7px solid transparent; }
@media (prefers-reduced-motion: reduce) { .wol-hero-video__frame { display: none; } }
/* Small screens: the hero text and buttons fill the width, so the control becomes a 44px icon in the top corner. */
@media (max-width: 782px) {
	.wol-hero-video__toggle { top: 0.75rem; right: 0.75rem; bottom: auto; width: 44px; height: 44px; padding: 0; justify-content: center; }
	.wol-hero-video__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(1px,1px,1px,1px); white-space: nowrap; }
}

/* Small photo strip at the top of Give-page fund cards */
.wol-fund-img { margin: 0 0 1rem !important; border-radius: var(--wol-radius-sm); }
.wol-fund-img img { border-radius: var(--wol-radius-sm); max-height: 190px; width: 100%; }

/* ---------- Social list ---------- */
.wol-social-list { list-style: none; padding: 0; margin: 1.5rem 0 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr)); gap: 0.9rem; }
.wol-social-list a { display: flex; flex-direction: column; gap: 0.2rem; padding: 1rem 1.2rem; border-radius: var(--wol-radius-sm); background: var(--wp--preset--color--mist); text-decoration: none; color: var(--wp--preset--color--ink); min-height: 44px; }
.wol-social-list a strong { color: var(--wp--preset--color--teal); font-size: 1.05rem; }
.wol-social-list a span { font-size: 0.925rem; color: var(--wp--preset--color--charcoal); }
.wol-social-list a:hover { background: var(--wp--preset--color--teal); }
.wol-social-list a:hover strong, .wol-social-list a:hover span { color: #fff; }

/* ---------- Quotes without the card ---------- */
.wp-block-quote.wol-plain-quote { border-left-color: var(--wp--preset--color--teal); padding-left: 1.25rem; font-size: 1.05rem; }

/* ---------- Utility ---------- */
.wol-stat { font-family: var(--wp--preset--font-family--abril); font-size: clamp(2.5rem, 6vw, 4rem); line-height: 1; color: var(--wp--preset--color--teal); }
.has-deep-teal-background-color .wol-stat, .has-teal-background-color .wol-stat { color: var(--wp--preset--color--sky); }
.wol-note { font-size: 0.95rem; background: var(--wp--preset--color--mist); border-radius: var(--wol-radius-sm); padding: 1rem 1.25rem; }
.wol-resource-list { list-style: none; padding: 0; display: grid; gap: 0.75rem; }
.wol-resource-list a { display: flex; justify-content: space-between; gap: 1rem; align-items: center; padding: 0.9rem 1.1rem; border: 1px solid var(--wol-line); border-radius: var(--wol-radius-sm); text-decoration: none; font-weight: 600; min-height: 44px; }
.wol-resource-list a:hover { background: var(--wp--preset--color--mist); }
.wol-resource-list a::after { content: "↓"; color: var(--wp--preset--color--teal); }
.wp-block-columns { gap: clamp(1.25rem, 3vw, 2.5rem); }
@media (max-width: 781px) { .wp-block-columns.wol-reverse-mobile { flex-direction: column-reverse; } }
