/*
 Theme Name:   Meade Child
 Theme URI:    https://generatepress.com
 Description:  Child theme for GeneratePress. Each site's own CSS, PHP and block patterns go here, so GeneratePress itself can update safely.
 Author:       Kerry Meade
 Template:     generatepress
 Version:      1.3.0
 Requires PHP: 8.3
 Text Domain:  generatepress-child
*/

/* Site-specific CSS goes below. Prefer GeneratePress Customizer settings and GenerateBlocks global styles first. */

/* Header: sticky on every page, so the name MEADE stays at the top while scrolling (Kerry, 2026-10-18).
   It sits below the WordPress admin bar when signed in. On phones GeneratePress centers it (its default at 768px and below). */
.site-header {
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0px);
	z-index: 100;
}
@media (max-width: 600px) {
	.admin-bar .site-header { top: 0; } /* the admin bar scrolls away on phones */
}

/* Home page on larger screens: the header floats see-through over the full-screen photo, with the name in white,
   as on the meade.io site this replaces. On phones it stays a white bar above the photo (as live). */
@media (min-width: 769px) {
	.home .site-header {
		position: fixed;
		left: 0;
		right: 0;
		background: transparent;
	}
	.home .main-title a,
	.home .main-title a:hover { color: var(--base-3); }
}

/* Home photo: the quote is at most 700px wide on larger screens (Kerry, 2026-10-18; was 1280px as on meade.io),
   with 20px gutters on narrow screens; the Cover block's own side padding is removed.
   Set here because WordPress's content-width control isn't available in GeneratePress (no theme.json). */
.meade-hero.wp-block-cover { padding-left: 0; padding-right: 0; }
.meade-hero .wp-block-cover__inner-container {
	max-width: 700px;
	padding: 0 20px;
}
/* Even out the quote's line lengths so no word sits alone on the last line (Kerry, 2026-10-18).
   Browsers without support wrap normally. */
.meade-hero h2 { text-wrap: balance; }

/* Keyboard focus ring. */
a:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }

/* Footer link: no underline at rest, underline on hover/focus (as Codified Ventures). */
.site-info a { text-decoration: none; }
.site-info a:hover, .site-info a:focus { text-decoration: underline; }

/* Home quote: after the full quote shows 2 s, "BEFORE WHICH DIFFICULTIES DISAPPEAR AND OBSTACLES VANISH." dissolves
   word by word (2 s each, 0.4 s apart), leaving "PATIENCE AND PERSEVERANCE HAVE A MAGICAL EFFECT" alone for 2 s;
   then all the words return together over 2 s. Cycle 10.4 s. Chosen by Kerry from a preview, 2026-10-18.
   One keyframe set per word, because they leave at different times but return at the same moment.
   The words stay in the page for screen readers and search engines. */
.meade-vanish {
	display: inline-block;
	animation: 10.4s ease-in-out infinite;
}
.meade-vanish-0 { animation-name: meade-vanish-0; }
@keyframes meade-vanish-0 { 0%, 19.23% { opacity: 1; filter: blur(0); } 38.46%, 80.77% { opacity: 0; filter: blur(8px); } 100% { opacity: 1; filter: blur(0); } }
.meade-vanish-1 { animation-name: meade-vanish-1; }
@keyframes meade-vanish-1 { 0%, 23.08% { opacity: 1; filter: blur(0); } 42.31%, 80.77% { opacity: 0; filter: blur(8px); } 100% { opacity: 1; filter: blur(0); } }
.meade-vanish-2 { animation-name: meade-vanish-2; }
@keyframes meade-vanish-2 { 0%, 26.92% { opacity: 1; filter: blur(0); } 46.15%, 80.77% { opacity: 0; filter: blur(8px); } 100% { opacity: 1; filter: blur(0); } }
.meade-vanish-3 { animation-name: meade-vanish-3; }
@keyframes meade-vanish-3 { 0%, 30.77% { opacity: 1; filter: blur(0); } 50.00%, 80.77% { opacity: 0; filter: blur(8px); } 100% { opacity: 1; filter: blur(0); } }
.meade-vanish-4 { animation-name: meade-vanish-4; }
@keyframes meade-vanish-4 { 0%, 34.62% { opacity: 1; filter: blur(0); } 53.85%, 80.77% { opacity: 0; filter: blur(8px); } 100% { opacity: 1; filter: blur(0); } }
.meade-vanish-5 { animation-name: meade-vanish-5; }
@keyframes meade-vanish-5 { 0%, 38.46% { opacity: 1; filter: blur(0); } 57.69%, 80.77% { opacity: 0; filter: blur(8px); } 100% { opacity: 1; filter: blur(0); } }
.meade-vanish-6 { animation-name: meade-vanish-6; }
@keyframes meade-vanish-6 { 0%, 42.31% { opacity: 1; filter: blur(0); } 61.54%, 80.77% { opacity: 0; filter: blur(8px); } 100% { opacity: 1; filter: blur(0); } }
@media (prefers-reduced-motion: reduce) {
	.meade-vanish { animation: none; }
}