/*
Theme Name: WindWorks
Theme URI: https://windworks.com.sg
Author: Jeremy Lim
Description: Block theme for WindWorks, the wind instrument repair atelier in Geylang. Carries the preview site's colours, fonts and layout as theme.json tokens. Every page section is a pattern made of core blocks, so pages stay editable in the block editor.
Version: 1.0.2
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: windworks
Tags: block-theme, full-site-editing, custom-colors, editor-style
*/

/* ---------- Base ---------- */
:root { --ww-line: #ddd; --ww-ink: #111; --ww-blue: #1f5aa6; }
h1, h2, h3 { text-wrap: balance; }
p { text-wrap: pretty; }
img { display: block; }
.wp-site-blocks > * { margin-block-start: 0; }
.ww-page > * + * { margin-block-start: 0; }
@media (max-width: 600px) {
	:root { --wp--style--root--padding-left: 20px; --wp--style--root--padding-right: 20px; }
}

/* Labels: the typewriter-style captions used throughout */
.ww-kicker, .ww-label {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: .03em;
	text-transform: uppercase;
	line-height: 1.4;
}
.ww-kicker { color: var(--ww-blue); margin-block-end: 0; }
.ww-kicker + * { margin-block-start: 16px !important; }
.ww-label { color: #555; }
.ww-label.has-text-color { color: inherit; }
.ww-label.has-accent-color { color: var(--ww-blue); }
.ww-label.has-accent-light-color { color: #9fb8db; }
.ww-label.is-plain { letter-spacing: 0; text-transform: none; font-size: 12px; }
.ww-rule-top { border-top: 1px solid rgba(242, 242, 243, .5); padding-top: 12px; margin-top: 22px !important; }
.ww-rule-bottom { border-bottom: 1px solid var(--ww-ink); padding-bottom: 8px; color: var(--ww-ink); margin-bottom: 0 !important; }

.ww-page-title { margin-block-end: 18px; }
.ww-max-18 { max-width: 18ch; }
.ww-measure { max-width: 42ch; line-height: 1.6; }
.ww-measure-wide { max-width: 64ch; }
.ww-intro { margin-block-end: 44px !important; }
.ww-h-32 { font-size: 32px !important; letter-spacing: -.02em; margin-bottom: 6px; }
.ww-h-38 { font-size: 38px !important; line-height: 1 !important; margin: 8px 0 14px !important; }
.ww-center { align-items: center; }
/* Measured text stays left-aligned inside constrained (centred) layouts */
.ww-measure, .ww-measure-wide, .ww-notes, .ww-max-18 { margin-left: 0 !important; margin-right: auto !important; }

/* ---------- Buttons ---------- */
.wp-block-button__link { white-space: nowrap; }
.wp-block-button.is-style-outline > .wp-block-button__link { background: transparent; color: var(--ww-ink); border-color: var(--ww-ink); padding: 12px 20px; }
.wp-block-button.is-style-outline > .wp-block-button__link:hover { background: var(--ww-ink); color: #fff; }
.wp-block-button.ww-btn-light > .wp-block-button__link { color: #fff; border-color: #fff; }
.wp-block-button.ww-btn-light > .wp-block-button__link:hover { background: #fff; color: var(--ww-ink); }
.wp-block-buttons { gap: 12px; }

/* ---------- Header ---------- */
.ww-site-header { position: sticky; top: var(--wp-admin--admin-bar--height, 0px); z-index: 20; background: #fff; border-bottom: 1px solid var(--ww-line); }
.ww-header__bar { padding-block: 10px; gap: 20px; flex-wrap: nowrap !important; }
.ww-header__bar > * { margin: 0 !important; }
.ww-header__nav { flex-wrap: nowrap !important; }
.ww-logo img { height: 52px !important; width: auto !important; mix-blend-mode: multiply; }
.ww-header__nav { gap: 26px; }
.ww-nav a { color: var(--ww-ink); text-decoration: none; padding: 4px 0; border-bottom: 2px solid transparent; white-space: nowrap; }
.ww-nav a:hover, .ww-nav .current-menu-item > a, .ww-nav a[aria-current="page"] { border-bottom-color: var(--ww-blue); color: var(--ww-ink); }
.ww-header__nav .wp-block-button__link { font-size: 15px; padding: 11px 18px; }
.ww-status { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; font-family: var(--wp--preset--font-family--mono); font-size: 12px; padding: 4px 8px; border: 1px solid var(--ww-ink); line-height: 1.4; }
.ww-status i { width: 7px; height: 7px; background: #999; display: inline-block; }
.ww-status[data-state="open"] i { background: #2e7d54; }
.ww-status[data-state="lunch"] i { background: #b8862e; }
@media (max-width: 780px) {
	.ww-header__nav { gap: 12px; }
	.ww-logo img { height: 44px !important; }
	.ww-header__nav .wp-block-button__link { font-size: 14px; padding: 9px 12px; }
}
@media (max-width: 480px) {
	.ww-status { display: none; }
}
/* Mobile menu overlay */
.ww-nav .wp-block-navigation__responsive-container.is-menu-open { padding: 20px 24px; --navigation-layout-justification-setting: flex-start; --navigation-layout-justify: flex-start; --navigation-layout-align: flex-start; }
.ww-nav .is-menu-open .wp-block-navigation-item { justify-content: flex-start !important; align-items: flex-start !important; text-align: left; }
.ww-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { align-items: flex-start; padding-top: 56px; }
.ww-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { align-items: flex-start; gap: 4px; width: 100%; }
.ww-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { width: 100%; border-bottom: 1px solid var(--ww-line); }
.ww-nav .wp-block-navigation__responsive-container.is-menu-open a { font-size: 28px; font-weight: 600; letter-spacing: -.02em; padding: 14px 0; border-bottom: 0; display: block; }

/* ---------- Hero covers ---------- */
.ww-hero { min-height: min(86vh, 780px) !important; }
.ww-hero--team { min-height: min(64vh, 560px) !important; }
.ww-hero .wp-block-cover__inner-container { color: #fff; }
.ww-hero__grid { align-items: end; }
.ww-hero__lead { font-size: 21px; line-height: 1.45; margin-bottom: 24px; }

/* ---------- Facts strip ---------- */
.ww-facts-band { border-bottom: 1px solid var(--ww-ink); }
.ww-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.ww-facts > * { margin: 0 !important; }
.ww-fact { padding: 22px 24px; border-right: 1px solid var(--ww-line); }
.ww-fact:first-child { padding-left: 0; }
.ww-fact > * { margin: 0 !important; }
.ww-fact .ww-label { margin-bottom: 4px !important; }
.ww-fact__value { font-weight: 600; font-size: 32px; line-height: 1.2; letter-spacing: -.01em; }
.ww-fact--link { border-right: 0; }
.ww-fact--link .ww-label { color: #fff; }
.ww-fact--link a { color: #fff; text-decoration: none; }
.ww-fact--link a::after { content: ""; position: absolute; inset: 0; }
.ww-fact--link { position: relative; }
.ww-fact--link:hover { background: var(--ww-ink) !important; }
@media (max-width: 600px) {
	.ww-fact { padding: 16px 0; border-right: 0; border-bottom: 1px solid var(--ww-line); }
	.ww-fact--link { padding: 16px 20px; border-bottom: 0; }
	.ww-fact__value { font-size: 26px; }
}

/* ---------- Framed photos ---------- */
.ww-framed img { border: 1px solid var(--ww-line); width: 100%; }
.ww-framed--blue img { border-color: var(--ww-blue); }
.wp-block-image figcaption.wp-element-caption { margin-top: 12px; margin-bottom: 0; text-align: left; }
.ww-dark figcaption.wp-element-caption { color: #bbb; }

/* ---------- Photo feature (home 01) ---------- */
.ww-feature__text { display: flex; flex-direction: column; justify-content: space-between; gap: 36px; }
.ww-feature__text > * { margin: 0 !important; }
.ww-feature h2 { margin-bottom: 20px; }
.ww-linklist { border-top: 1px solid var(--ww-ink); }
.ww-linklist > p { margin: 0 !important; border-bottom: 1px solid var(--ww-line); }
.ww-linklist > p:last-child { border-bottom: 0; }
.ww-linklist a { display: flex; justify-content: space-between; gap: 16px; padding: 16px 0; font-size: 19px; color: var(--ww-ink); text-decoration: none; }
.ww-linklist a::after { content: "→"; color: var(--ww-blue); }
.ww-linklist a:hover { color: var(--ww-blue); }
.ww-linklist .is-strong a { font-weight: 600; }

/* ---------- Dark team band ---------- */
.ww-dark h2 { margin-bottom: 20px; }
.ww-dark p { font-size: 18px; line-height: 1.65; }
.ww-dark .ww-kicker { font-size: var(--wp--preset--font-size--x-small); }

/* ---------- Before / after pairs ---------- */
.ww-section-head { align-items: flex-end !important; }
.ww-case > * { margin: 0; }
.ww-case h3 { margin: 14px 0 4px; }
.ww-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; background: var(--ww-blue); border: 1px solid var(--ww-line); aspect-ratio: 3 / 2; }
.ww-pair--16-10 { aspect-ratio: 16 / 10; }
.ww-pair > * { margin: 0 !important; min-height: 0; position: relative; background: #fff; }
.ww-pair .wp-block-image img { width: 100%; height: 100%; object-fit: cover; border: 0; }
.ww-slot { display: grid; place-items: center; background: #f4f5f7 !important; color: #888; }
.ww-slot p { margin: 0; font-family: var(--wp--preset--font-family--mono); font-size: 12px; letter-spacing: .03em; text-transform: uppercase; }
.ww-slot--portrait { aspect-ratio: 4 / 5; margin-bottom: 14px !important; }
.ww-case-list > * { margin: 0 !important; }
.ww-case-row { padding: 40px 0; border-top: 1px solid var(--ww-ink); align-items: center; }

/* ---------- Bordered bands ---------- */
.ww-rule-band { border-top: 1px solid var(--ww-ink); border-bottom: 1px solid var(--ww-ink); }
.ww-cta-row { margin-top: 40px !important; padding: 28px 0; }

/* ---------- Cell grids (services, team) ---------- */
.ww-cells { display: grid; border-top: 1px solid var(--ww-ink); border-left: 1px solid var(--ww-line); margin-bottom: 72px !important; }
.ww-cells--300 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.ww-cells--260 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); margin-bottom: 64px !important; }
.ww-cells > * { margin: 0 !important; }
.ww-cell { padding: 22px; border-right: 1px solid var(--ww-line); border-bottom: 1px solid var(--ww-line); }
.ww-cells--260 .ww-cell { padding: 20px; }
.ww-cell > * { margin: 0; }
.ww-cell h3 { margin: 6px 0 8px; }
.ww-cells--260 .ww-cell h3 { margin: 0; }
.ww-cells--260 .ww-cell h3 + p { margin-top: 2px; }

/* ---------- Price list ---------- */
.ww-price-head { gap: 16px; margin-bottom: 24px !important; }
.ww-badge { display: inline-block; font-family: var(--wp--preset--font-family--mono); font-size: 12px; padding: 4px 8px; background: #e6eef8; color: var(--ww-blue); margin: 0; }
.ww-card { padding: 22px; border: 1px solid var(--ww-line); }
.ww-card > * { margin: 0 !important; }
.ww-card > .wp-block-group { margin-bottom: 8px !important; gap: 12px; align-items: baseline !important; }
.ww-price-table { margin: 0; }
.ww-price-table table, .ww-hours table { border-collapse: collapse; width: 100%; }
.ww-price-table td, .ww-hours td { border: 0; padding: 10px 0; font-size: 15.5px; }
.ww-price-table td:last-child { text-align: right; white-space: nowrap; color: var(--ww-blue); }
.ww-notes { margin-top: 24px !important; max-width: 80ch; line-height: 1.6; }

/* ---------- Team page ---------- */
.ww-quote { font-weight: 600; font-size: clamp(28px, 3vw, 40px); line-height: 1.15; letter-spacing: -.02em; }

/* ---------- FAQ ---------- */
.ww-narrow { max-width: 880px; margin-inline: auto; }
.ww-faq { border-top: 1px solid var(--ww-ink); margin-top: 36px !important; }
.ww-faq > * { margin: 0 !important; }
.ww-faq summary { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 20px 0; font-weight: 600; font-size: 22px; line-height: 1.25; list-style: none; cursor: pointer; }
.ww-faq summary::-webkit-details-marker { display: none; }
.ww-faq summary::after { content: "+"; font-size: 26px; font-weight: 400; color: var(--ww-blue); transition: transform .2s; }
.ww-faq details[open] summary::after { transform: rotate(45deg); }
.ww-faq details > p { margin: 0 0 22px; line-height: 1.65; max-width: 66ch; }

/* ---------- Book a repair ---------- */
.ww-book { display: grid; grid-template-columns: minmax(0, 2fr) minmax(260px, 1fr); gap: 40px; align-items: start; }
.ww-book > * { margin: 0 !important; min-width: 0; }
@media (max-width: 860px) { .ww-book { grid-template-columns: 1fr; } }
.ww-book__aside > * + * { margin-top: 24px !important; }
.ww-book__aside .wp-block-image, .ww-book__aside .wp-block-image img { width: 100%; height: auto; }
.ww-talk { border-top: 1px solid var(--ww-ink); padding-top: 16px; }
.ww-talk > * { margin: 0 0 10px !important; }
.ww-stack { flex-direction: column; align-items: stretch !important; gap: 10px; }
.ww-stack .wp-block-button, .ww-stack .wp-block-button__link { width: 100%; text-align: center; }
.ww-stack .wp-block-button__link { padding: 11px 18px; }

/* ---------- Visit ---------- */
.ww-address { font-size: 20px; line-height: 1.6; margin-bottom: 16px; }
.ww-contact { line-height: 1.7; margin-bottom: 32px !important; }
.ww-hours { margin: 0; }
.ww-hours tr { border-bottom: 1px solid var(--ww-line); }
.ww-hours td { padding: 12px 0; font-size: 16.5px; }
.ww-hours td:last-child { text-align: right; }

/* ---------- Footer ---------- */
.ww-footer { font-size: 15px; line-height: 1.65; }
.ww-footer p { margin: 0; }
.ww-footer .ww-label { margin-bottom: 6px; }
.ww-footer a { color: #fff; }
.ww-footer a:hover { color: #9fb8db; }
.ww-logo-chip { display: inline-block; background: #fff; padding: 6px 8px; margin: 0 0 10px !important; }
.ww-logo-chip img { height: 48px !important; width: auto !important; }

/* Opening-hours day bar inside the status pill: open hours as blocks, lunch as the gap, a tick for now. */
.ww-day { position: relative; display: inline-block; width: 46px; height: 8px; background: #e3e6ea; flex: none; }
.ww-day s { position: absolute; top: 0; bottom: 0; background: #2e7d54; text-decoration: none; }
.ww-status[data-state="closed"] .ww-day s { background: #9aa3ad; }
.ww-day u { position: absolute; top: -3px; bottom: -3px; width: 2px; margin-left: -1px; background: var(--ww-ink, #111); text-decoration: none; }

/* Facts band: keep each value on one line on wider screens */
@media (min-width: 900px) {
	.ww-fact__value { white-space: nowrap; font-size: clamp(22px, 2.1vw, 32px); }
}

/* ==========================================================================
   Page sections. These were inline <style> blocks on the preview pages;
   on WordPress they live here, scoped by the className set on each block.
   ========================================================================== */

/* ---------- Home: hero (core/cover) ---------- */
.ww-hb { min-height: min(86vh, 780px) !important; text-align: center; color: #fff; }
.ww-hb .wp-block-cover__background { opacity: .85 !important; }
.ww-hb .wp-block-cover__inner-container { display: flex; flex-direction: column; align-items: center; padding: 72px 0; }
.ww-hb .wp-block-cover__inner-container > * { margin-block: 0; }
.ww-hb .ww-hb__chip { background: #fff; border-radius: 50%; width: 150px; height: 150px; display: grid; place-items: center; margin: 0 auto 26px !important; }
.ww-hb .ww-hb__chip img { width: 104px; height: auto; }
.ww-hb .ww-hb__title { font-size: clamp(48px, 8vw, 96px); letter-spacing: -.03em; line-height: 1; margin: 0 auto 12px !important; color: #fff; }
.ww-hb .ww-hb__lead { font-size: 20px; line-height: 1.45; margin: 0 auto 28px !important; max-width: 34ch; }
.ww-hb .ww-hb__btns { justify-content: center; }
.ww-hb .ww-hb__btns .wp-block-button__link { padding: 14px 22px; font-size: 15px; }
.ww-hb .ww-hb__btns .is-style-outline > .wp-block-button__link { border-width: 1.5px; }
@media (max-width: 520px) {
	.ww-hb .ww-hb__chip { width: 116px; height: 116px; }
	.ww-hb .ww-hb__chip img { width: 80px; }
	.ww-hb .ww-hb__lead { font-size: 18px; }
}

/* ---------- Home: certified brands ---------- */
.ww-brands { background: #fff; border-bottom: 1px solid #dfe3e8; padding-top: 30px; padding-bottom: 26px; text-align: center; }
.ww-brands .ww-brands__k { display: block; font-family: var(--wp--preset--font-family--mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: #666; margin: 0 auto 20px !important; }
.ww-brands .ww-brands__m { gap: 26px 60px; max-width: 1180px; align-items: center; margin-top: 0 !important; }
.ww-brands .wp-block-image { margin: 0; }
.ww-brands .ww-brands__m img { display: block; width: auto; max-width: 240px; }
.ww-brands .ww-brands__d { gap: 12px; margin-top: 22px !important; color: #555; font-size: 14.5px; }
.ww-brands .ww-brands__d p { margin: 0; }
@media (max-width: 600px) {
	.ww-brands .ww-brands__m { gap: 14px 26px; }
	.ww-brands .ww-brands__m img { max-width: 150px; transform: scale(.8); }
	.ww-brands .ww-brands__d { flex-wrap: wrap !important; }
}

/* ---------- Home: facts strip ---------- */
.ww-fact .ww-fact__sub { margin: 6px 0 0 !important; font-size: 15px; color: #555; }

/* ---------- Home: before / after tap ---------- */
.ww-cheer-wrap > * { margin-block-start: 0; }
.ww-cheer { position: relative; width: 100%; max-width: 560px; aspect-ratio: 4 / 3; overflow: hidden; background: #e6eef8; cursor: pointer; margin: 0 !important; }
.ww-cheer > .wp-block-image { position: absolute; inset: 0; margin: 0 !important; }
.ww-cheer .wp-block-image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ww-cheer .ww-cheer-after { opacity: 0; transition: opacity .6s; }
.ww-cheer[aria-pressed="true"] .ww-cheer-after { opacity: 1; }
.ww-cheer .ww-cheer-pill { position: absolute; right: 12px; bottom: 12px; margin: 0 !important; background: #fffe; color: #111; border-radius: 20px; padding: 4px 16px; font-size: 15px; transition: transform .4s; }
.ww-cheer[aria-pressed="true"] .ww-cheer-pill { transform: rotate(-3deg) scale(1.06); }
.ww-cheer:focus-visible { outline: 3px solid #1f5aa6; outline-offset: 3px; }
.ww-cheer-wrap .ww-feat-cap { margin: 12px 0 0 !important; max-width: 560px; }
.ww-cheer-wrap:not(.is-cheered) .ww-cheer-pill--after,
.ww-cheer-wrap:not(.is-cheered) .ww-cheer-cap--after,
.ww-cheer-wrap.is-cheered .ww-cheer-pill--before,
.ww-cheer-wrap.is-cheered .ww-cheer-cap--before { display: none; }
@media (prefers-reduced-motion: reduce) {
	.ww-cheer .ww-cheer-after, .ww-cheer .ww-cheer-pill { transition: none; }
}
/* In the editor show both photos side by side and every text, so all of it can be edited. */
.editor-styles-wrapper .ww-cheer .ww-cheer-before { right: 50%; }
.editor-styles-wrapper .ww-cheer .ww-cheer-after { opacity: 1; left: 50%; }
.editor-styles-wrapper .ww-cheer-wrap .ww-cheer-pill--after { display: block; bottom: 52px; }
.editor-styles-wrapper .ww-cheer-wrap .ww-cheer-cap--after { display: block; }

/* ---------- Repairs: services rail ---------- */
.ww-rail-wrap { position: relative; margin: 28px 0 8px !important; }
.ww-rail-wrap > * { margin: 0; }
.ww-rail { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(250px, 290px); gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 2px 2px 14px; scrollbar-width: thin; }
.ww-rail > * { margin: 0 !important; }
.ww-svc { scroll-snap-align: start; background: #fff; border: 1px solid #dfe3e8; display: flex; flex-direction: column; }
.ww-svc .wp-block-image { margin: 0; }
.ww-svc .wp-block-image img { display: block; width: 100%; background: #d8dde4; }
.ww-svc .ww-svc__body { padding: 16px; margin: 0; }
.ww-svc .ww-svc__body > * { margin: 0; }
.ww-svc .ww-svc__k { font-family: var(--wp--preset--font-family--mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: #1f5aa6; }
.ww-svc .ww-svc__t { font-size: 20px; line-height: 1.2; letter-spacing: 0; margin: 5px 0 6px; }
.ww-svc .ww-svc__d { color: #555; font-size: 15.5px; line-height: 1.45; }
.ww-rail-nav { display: flex; gap: 8px; justify-content: flex-end; margin-top: 4px !important; }
.ww-rail-nav button { width: 46px; height: 46px; border: 1.5px solid #111; background: #fff; color: #111; font-size: 20px; cursor: pointer; }
.ww-rail-nav button:hover { background: #111; color: #fff; }
@media (max-width: 600px) { .ww-rail { grid-auto-columns: 78%; } }

/* ---------- Repairs: price list (core/details + core/table) ---------- */
.ww-price-head .ww-fams-hint { margin: 6px 0 0; }
.ww-fams { margin: 8px 0 24px !important; border-top: 2px solid #111; }
.ww-fams > * { margin: 0 !important; }
.ww-fams .ww-fam { border-bottom: 1px solid #dfe3e8; }
.ww-fam > summary { list-style: none; cursor: pointer; position: relative; padding: 18px 44px 18px 2px; font-size: 24px; font-weight: 700; line-height: 1.25; }
.ww-fam > summary::-webkit-details-marker { display: none; }
.ww-fam > summary::after { content: "+"; position: absolute; right: 6px; top: 50%; transform: translateY(-50%); font-size: 30px; font-weight: 300; color: #1f5aa6; line-height: 1; }
.ww-fam[open] > summary::after { content: "\2013"; }
.ww-fam > summary:hover { color: #1f5aa6; }
.ww-fam .ww-fam__i { font-family: var(--wp--preset--font-family--mono); font-size: 12.5px; letter-spacing: .03em; color: #555; margin: -6px 2px 10px; }
.wp-block-table.ww-price-table { margin: 0 2px 22px; max-width: 760px; }
.wp-block-table.ww-price-table table { border-collapse: collapse; width: 100%; }
.wp-block-table.ww-price-table td { border: 0; border-bottom: 2px dotted #c4c8ce; padding: 8px 0; font-size: 17px; vertical-align: bottom; }
.wp-block-table.ww-price-table td:last-child { text-align: right; white-space: nowrap; font-weight: 600; color: #1f5aa6; padding-left: 16px; }

/* ---------- Visit: table borders win over core table styles ---------- */
.wp-block-table.ww-hours td { border: 0; }
.wp-block-table.ww-hours tr { border-bottom: 1px solid var(--ww-line); }

/* ---------- Team ---------- */
.ww-cell .ww-portrait { margin: 0 0 14px; }
.ww-cell .ww-portrait img { width: 100%; display: block; }

/* ---------- Gallery ---------- */
.ww-albums { margin-top: 32px !important; }
.ww-albumcard { position: relative; }
.ww-albumcard > * { margin: 0; }
.ww-albumcard .wp-block-image { margin: 0; background: #e6eef8; }
.ww-albumcard .wp-block-image img { width: 100%; display: block; }
.ww-albumcard .ww-albumcard__t { margin-top: 10px; font-size: 18px; font-weight: 700; }
.ww-albumcard .ww-albumcard__t a { color: inherit; text-decoration: none; }
.ww-albumcard .ww-albumcard__t a::after { content: ""; position: absolute; inset: 0; }
.ww-albumcard .ww-albumcard__n { font-size: 14px; }
.ww-sentin { margin-top: 32px !important; }
.ww-sentin .wp-block-image { margin: 0; overflow: hidden; background: #e6eef8; border-radius: 4px; }
.ww-sentin .wp-block-image img { width: 100%; display: block; }
.ww-back { margin-top: 8px !important; }
.ww-mas { columns: 4 220px; column-gap: 8px; margin-top: 32px !important; }
.ww-mas > * { margin: 0 0 8px !important; break-inside: avoid; background: #e6eef8; }
.ww-mas .wp-block-image img { display: block; width: 100%; height: auto; }

/* ---------- Visit: map and address grid ---------- */
.ww-visit-grid { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr) !important; gap: 48px !important; align-items: start; }
@media (max-width: 760px) { .ww-visit-grid { grid-template-columns: 1fr !important; gap: 28px !important; } }
.ww-map { border: 1px solid var(--ww-line); }
.ww-map > * { margin: 0 !important; }
.ww-map .wp-block-image img { display: block; width: 100%; }
.ww-map .wp-block-buttons { display: block; }
.ww-map .ww-map__btn .wp-block-button__link { display: block; width: 100%; text-align: center; padding: 14px; border: 0; }

/* ---------- Book a repair: contact card (stands in for the inquiry form) ---------- */
.ww-book__card { border-top: 2px solid var(--ww-ink); padding-top: 20px; }
.ww-book__card > * { margin: 0 0 18px !important; }
.ww-book__card > :last-child { margin-bottom: 0 !important; }
.ww-book__bar p { margin: 0; font-family: var(--wp--preset--font-family--mono); font-size: 12px; letter-spacing: .03em; text-transform: uppercase; color: #555; }
.ww-book__bar p:first-child { color: var(--ww-ink); }
.ww-book__card .wp-block-button__link { white-space: normal; }

/* ---------- Blog fallback (index template) ---------- */
.ww-post { border-top: 1px solid var(--ww-line); }
.ww-post > * { margin-block: 0 8px; }

/* ---------- Small screens: nothing may push the page sideways ---------- */
@media (max-width: 480px) {
	.ww-header__bar .ww-logo img { height: 40px !important; }
	.wp-block-button__link { white-space: normal; }
}

/* Opening hours: tap for the full week (header pill on wide screens, slim bar under the header on phones). */
.ww-status { position: relative; cursor: pointer; }
.ww-hours-pop { position: absolute; top: calc(100% + 8px); right: 0; z-index: 60; display: block; background: #fff; color: var(--ww-ink, #111); border: 1px solid var(--ww-ink, #111); padding: 10px 12px; font-size: 13px; line-height: 1.7; white-space: nowrap; text-align: left; box-shadow: 0 6px 18px rgba(0,0,0,.12); cursor: default; }
.ww-hours-pop a { color: inherit; text-decoration: underline; }
.ww-hours-bar { display: none; }
@media (max-width: 480px) {
	.ww-hours-bar { display: flex; justify-content: center; padding: 6px 16px 8px; border-top: 1px solid var(--ww-line, #e3e6ea); }
	.ww-hours-bar .ww-status { display: inline-flex; }
	.ww-hours-bar .ww-hours-pop { left: 50%; right: auto; transform: translateX(-50%); }
}
