/*
Theme Name: Computer Tutor VB 2026
Theme URI: https://computertutorvb.com/
Author: Computer Tutor VB
Description: Block theme for Computer Tutor VB, concierge IT for homes and businesses in Hampton Roads. Large readable type, email contact up front.
Version: 1.0.0
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: computertutorvb-2026
*/

/* Most styling lives in theme.json. This file holds what theme.json cannot express. */

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* Anchor targets (#services, #about, #contact) clear the sticky header */
[id] { scroll-margin-top: 96px; }

::selection { background: var(--wp--preset--color--accent); color: #fff; }
:where(a, button, summary, input):focus-visible {
	outline: 3px solid var(--wp--preset--color--accent);
	outline-offset: 3px;
	border-radius: 4px;
}
a { text-underline-offset: 0.18em; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
.wp-element-button, .wp-block-button__link { transition: background-color 160ms cubic-bezier(.2,.7,.2,1); min-height: 56px; display: inline-flex; align-items: center; gap: 0.625rem; }

/* Header */
.ctvb-header { position: sticky; top: 0; z-index: 20; border-bottom: 1px solid var(--wp--preset--color--line); }
.admin-bar .ctvb-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .ctvb-header { top: 0; } }
.ctvb-brand { gap: 0.75rem !important; }
.ctvb-brand img { display: block; }
.ctvb-header .wp-block-navigation a { padding: 0.5rem 0.25rem; }
.ctvb-header .wp-block-navigation .current-menu-item > a,
.ctvb-header .wp-block-navigation a[aria-current="page"] { text-decoration: underline; text-underline-offset: 0.35em; }
.ctvb-call .wp-block-button__link { min-height: 48px; padding: 0.625rem 1.125rem; font-size: 1.125rem; }
.ctvb-header .wp-block-site-title, .ctvb-call .wp-block-button__link { white-space: nowrap; }
.ctvb-header .wp-block-navigation__responsive-container-open { padding: 10px; margin: -10px 0; }
.ctvb-header .wp-block-navigation__responsive-container-open svg { width: 28px; height: 28px; }
@media (max-width: 599px) {
	.ctvb-header .wp-block-site-title { font-size: 1.125rem !important; }
	.ctvb-header > .wp-block-group > .wp-block-group:last-child { gap: 0.5rem !important; }
	.ctvb-brand { gap: 0.5rem !important; }
	.ctvb-hide-sm { display: none; }
	.ctvb-quote-row { flex-wrap: wrap !important; }
	.ctvb-brand img { height: 32px; width: 16px; }
	.ctvb-call .wp-block-button__link { padding: 0.5rem 0.875rem; gap: 0.5rem; }
}

/* Inline icons inherit text colour */
.ctvb-icon { width: 1.25em; height: 1.25em; flex: none; display: inline-block; vertical-align: -0.2em; }
.ctvb-icon-lg { width: 40px; height: 40px; }


/* Hero */
.ctvb-hero h1 { text-wrap: balance; max-width: 15ch; }
.ctvb-hero .ctvb-lede { max-width: 34ch; }
.ctvb-hero-art img { aspect-ratio: 16 / 11; object-fit: cover; width: 100%; box-shadow: 0 1px 2px rgba(29,36,48,.06), 0 12px 32px -12px rgba(29,36,48,.22); }

/* Services list: one row per service, hairlines between rows */
.ctvb-services-list { border-top: 1px solid var(--wp--preset--color--line); }
.ctvb-service { border-bottom: 1px solid var(--wp--preset--color--line); padding-block: 1.5rem !important; align-items: flex-start !important; }
.ctvb-service h3 { margin: 0; }
.ctvb-service p { margin: 0.25rem 0 0; color: var(--wp--preset--color--ink-2); }
.ctvb-service figure { margin: 0.125rem 0 0 !important; flex: none; }

/* About + quote */
.ctvb-portrait img { border-radius: 50%; aspect-ratio: 1; object-fit: cover; object-position: 50% 30%; }
.ctvb-quote { margin: 0; padding: 0; }
.ctvb-quote p { text-wrap: pretty; }

/* Contact band */
.ctvb-contact a:not(.wp-element-button) { color: var(--wp--preset--color--on-ink); }
.ctvb-email { overflow-wrap: anywhere; }
.ctvb-email a { color: inherit; }
.ctvb-contact-row { gap: 0.75rem !important; align-items: center; }

/* Footer */
.ctvb-footer a { color: var(--wp--preset--color--ink-2); }
.ctvb-contact .wp-block-columns { align-items: flex-end; }
.ctvb-contact-list p { margin: 0; display: flex; align-items: center; gap: 0.75rem; }
.ctvb-quote-row .ctvb-portrait { flex: none; margin: 0; }
p { text-wrap: pretty; }
.ctvb-footer .wp-block-site-title { font-size: 1.25rem; }
.wp-site-blocks > * + * { margin-block-start: 0; }