/*
Theme Name: Plumber Base
Theme URI: https://stenwebcreatives.com
Author: Sten Web Creatives
Author URI: https://stenwebcreatives.com
Description: Master block theme for local plumber websites. One-pager front page composed of locked, client-editable block patterns. Built for speed: no page builders, no jQuery, no icon fonts, two self-hosted WOFF2 files.
Version: 1.0.1
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: plumber-base
Tags: block-theme, full-site-editing, one-column
*/

/*
Barlow font © Jeremy Tribby, licensed under the SIL Open Font License 1.1
https://github.com/jpt/barlow
All other styling lives in theme.json — keep this file to header + tiny
progressive-enhancement rules that theme.json cannot express.
*/

/* Smooth-scroll for the one-pager anchor nav; respects motion preferences. */
@media (prefers-reduced-motion: no-preference) {
	html {
		scroll-behavior: smooth;
	}
}

/* Anchor targets land below the sticky header instead of underneath it. */
:target {
	scroll-margin-top: 6rem;
}

/* FAQ accordion (core/details) — native disclosure, no JS. */
.wp-block-details {
	border-bottom: 1px solid var(--wp--preset--color--surface-alt);
	padding: 1rem 0;
}

.wp-block-details summary {
	cursor: pointer;
	font-weight: 700;
	font-size: var(--wp--preset--font-size--lg);
}

.wp-block-details summary:hover {
	color: var(--wp--preset--color--brand);
}

.wp-block-details[open] summary {
	margin-bottom: 0.5rem;
}

/* Buttons stay at 20px bold at every viewport — WCAG "large text", so white
   on the accent orange (3.27:1) passes AA. Set here, not theme.json, because
   global fluid typography would shrink a raw theme.json value on mobile. */
.wp-element-button {
	font-size: 1.25rem;
}

/* Universal focus ring: white inner + brand outer stays visible on any
   background (white sections, navy hero, orange CTA band). */
.wp-element-button:focus-visible,
.wp-block-navigation a:focus-visible {
	outline: 2px solid transparent;
	box-shadow: 0 0 0 2px var(--wp--preset--color--base), 0 0 0 5px var(--wp--preset--color--brand);
}
