/* Our own tweaks on top of the theme's style.css, which is kept unmodified.
   Hand-maintained — build.sh does not touch this file. Loaded last. */

/* --- Content fade-in, without JavaScript ---------------------------------
   The theme ships #primary and .intro-slogan at opacity 0 and fades them in
   from suidobashi.js on window.load. That makes the entire page blank if the
   script is blocked or fails — and it relied on jQuery's window.load()
   shortcut, which jQuery 3 removed and only jQuery Migrate still patched in.
   Same 500ms delay / 400ms fade, expressed in CSS so it cannot break. */
@keyframes machessa-fade-in {
	from { opacity: 0; }
	to   { opacity: 1; }
}
#primary,
.intro-slogan {
	animation: machessa-fade-in 400ms ease-out 500ms both;
}
@media (prefers-reduced-motion: reduce) {
	#primary,
	.intro-slogan {
		animation: none;
		opacity: 1;
	}
}

/* --- Headline on small screens -------------------------------------------
   The theme renders the x-large headline at a fixed 42px with the body's
   1.69 leading. Below ~768px that wraps to three lines with huge gaps
   between them. Scale it with the viewport and tighten the leading. */
/* Below ~794px the headline no longer fits on one line. */
@media screen and (max-width: 793px) {
	/* The preset rule carries !important, so override the variable it reads. */
	:root {
		--wp--preset--font-size--x-large: clamp(28px, 7.5vw, 42px);
	}
	.entry-content .has-x-large-font-size {
		line-height: 1.25;
	}
}

/* --- Desktop header spacing ----------------------------------------------
   The theme leaves 165px between the site title and the address block on
   desktop, which reads as a hole on a one-screen page. Take ~1.7em off. */
@media screen and (min-width: 1150px) {
	.intro-slogan {
		padding-top: 125px;
	}
}
