/*
Theme Name: Slate Standard
Theme URI: https://slatestandard.com
Author: Slate Standard Esthetics
Description: A fresh, light block theme for Slate Standard Esthetics in champagne, cream, tan, white and black, with no gold. Colors, fonts, sizes and spacing live in theme.json and can be changed in the Site Editor under Styles. Sections are reusable patterns.
Version: 2.9.5
Requires at least: 6.4
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: slate-standard
*/

/*
 * Only what theme.json cannot express lives here: layout helpers, section classes, phone rules.
 * Every color and font comes from a theme.json preset. Sizes for the site-wide type scale live in
 * theme.json too; the fixed sizes below belong to one component each. !important appears only where
 * it must beat core's own !important or a block's inline style, and each one says so.
 */

/* ---------- Base ---------- */

p { max-width: 62ch; }
.has-text-align-center { margin-left: auto; margin-right: auto; }
h1, h2, h3 { text-wrap: balance; }
.ss-center { text-align: center; }
.ss-sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Sections ---------- */

.ss-band { padding: clamp(3rem, 6vw, 5.5rem) var(--wp--preset--spacing--40); }
/* Full-width bands touch each other and the footer; core's block gap would leave a cream seam. */
.wp-block-post-content > .alignfull, .wp-site-blocks > main, .wp-site-blocks > footer { margin-block-start: 0; }
.ss-quote-band { padding-top: var(--wp--preset--spacing--60); padding-bottom: var(--wp--preset--spacing--60); }
.ss-trust { padding-top: 1.4rem; padding-bottom: 1.4rem; }
.ss-trust p { margin: 0; font-size: 0.9rem; font-weight: 600; letter-spacing: 0.02em; text-transform: none; text-align: center; }

.ss-eyebrow { font-family: var(--wp--preset--font-family--sans); font-size: 0.9rem; font-weight: 600; letter-spacing: 0.02em; text-transform: none; margin-bottom: 1rem; }
.ss-meta { font-size: 0.9rem; font-weight: 600; letter-spacing: 0.02em; text-transform: none; color: var(--wp--preset--color--gold-deep); margin: 0; }
.ss-underlined::after { content: ""; display: block; width: 44px; height: 1px; background: var(--wp--preset--color--gold); margin-top: 1.4rem; }
.has-text-align-center.ss-underlined::after { margin-left: auto; margin-right: auto; }

/* ---------- Hero ---------- */

/* One screen tall on the home page, short on inner pages. */
.ss-hero { min-height: min(calc(100svh - 84px), 760px); display: flex; flex-direction: column; justify-content: center; padding-top: 2.5rem; padding-bottom: 2.5rem; text-align: center; }
.ss-hero.ss-hero-short { min-height: 0; padding-top: clamp(3.5rem, 7vw, 6rem); padding-bottom: clamp(3.5rem, 7vw, 6rem); }
.ss-hero > * { width: 100%; }
.ss-hero h1 { max-width: 20ch; margin-left: auto; margin-right: auto; font-size: clamp(2.2rem, 5.4vw, 3.9rem); font-weight: 400; letter-spacing: -0.015em; }
.ss-hero h1 em { font-style: italic; color: var(--wp--preset--color--gold-deep); }
.ss-hero p { max-width: 38rem; margin-left: auto; margin-right: auto; }
.ss-hero p.has-large-font-size { max-width: 34rem; font-size: clamp(1.05rem, 1.8vw, 1.3rem); line-height: 1.75; opacity: 0.94; }
.ss-hero p.has-lead-font-size { line-height: 1.6; }
.ss-hero .wp-block-buttons { justify-content: center; margin-top: 1.6rem; }
.ss-hero-proof { margin-top: 1.6rem; font-size: 0.82rem; letter-spacing: 0.02em; text-transform: none; opacity: 0.8; }

/* Split hero: words on the left, Amber's studio reel in an arch on the right. Sized to its content, not the screen. */
.ss-hero.ss-hero-split { min-height: 0; text-align: left; padding-top: clamp(2.5rem, 5vw, 4.5rem); padding-bottom: clamp(3rem, 6vw, 5.5rem); }
.ss-hero-split .wp-block-columns { gap: clamp(2rem, 5vw, 5rem); }
.ss-hero-split h1 { max-width: 12ch; margin-left: 0; font-size: clamp(2.6rem, 5.4vw, 4.6rem); line-height: 1.02; }
.ss-hero-split p { margin-left: 0; }
.ss-hero-split p.has-lead-font-size { max-width: 30rem; }
.ss-hero-split .wp-block-buttons { justify-content: flex-start; margin-top: 2rem; }
.ss-hero-split .ss-hero-proof { margin-top: 1.8rem; }

/* ---------- Photos and video ---------- */

/* Arch: a full half-circle top (999px clamps to half the width), with a thin gold arch set off behind it. */
.ss-arch { position: relative; max-width: 440px; margin: 0 0 0 auto; }
.ss-arch video { position: relative; z-index: 1; display: block; width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 999px 999px 0 0; background: var(--wp--preset--color--tan); }
.ss-arch::before { content: ""; position: absolute; inset: -1rem 1rem 1rem -1rem; border: 1px solid var(--wp--preset--color--gold); border-radius: 999px 999px 0 0; }

/* Reel: Amber's vertical clips shown whole (9:16) so her burned-in captions stay intact. -sm for a secondary clip. */
.ss-reel { max-width: 380px; }
.ss-reel video { aspect-ratio: 9 / 16; }
.ss-reel-sm { max-width: 300px; }

/* Offset arch: the photo sits on a tan arch shifted down and right. */
.ss-frame { position: relative; max-width: 460px; margin: 0 1.4rem 1.4rem auto; }
.ss-frame img { position: relative; z-index: 1; display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 999px 999px 0 0; }
.ss-frame::before { content: ""; position: absolute; inset: 1.4rem -1.4rem -1.4rem 1.4rem; background: var(--wp--preset--color--tan); border-radius: 999px 999px 0 0; }

/* Soft frame: a gold hairline offset around a plain photo. */
.ss-frame-soft { position: relative; max-width: 500px; margin: 1rem 0 0 auto; }
.ss-frame-soft img, .ss-frame-soft video { position: relative; z-index: 1; display: block; width: 100%; aspect-ratio: 9 / 8; object-fit: cover; }
.ss-frame-soft::before { content: ""; position: absolute; inset: -1rem 1rem 1rem -1rem; border: 1px solid var(--wp--preset--color--gold-deep); }

/* Full-bleed photo band with a pull quote. The photo drifts in very slowly. */
.ss-photo-band { overflow: hidden; padding: var(--wp--preset--spacing--70) var(--wp--preset--spacing--40); }
.ss-photo-band .wp-block-cover__image-background { animation: ss-drift 36s ease-in-out infinite alternate; }
.ss-photo-band .ss-quote { max-width: 18ch; text-wrap: balance; font-size: clamp(2.2rem, 5vw, 4rem); line-height: 1.2; text-shadow: 0 1px 24px var(--wp--preset--color--black); }
.ss-photo-band .ss-eyebrow { margin-top: 1.6rem; }
@keyframes ss-drift { from { transform: scale(1); } to { transform: scale(1.12); } }

/* Read first, treat second: a short ruled list. */
.ss-steps { list-style: none; padding: 0; margin-top: 1.8rem; }
.ss-steps li { padding: 0.9rem 0; border-top: 1px solid var(--wp--preset--color--gold-soft); }
.ss-steps li:last-child { border-bottom: 1px solid var(--wp--preset--color--gold-soft); }
.ss-steps strong { font-family: var(--wp--preset--font-family--serif); font-size: 1.3rem; font-weight: 500; color: var(--wp--preset--color--gold-deep); margin-right: 0.4rem; }

.ss-split { gap: clamp(2rem, 6vw, 6rem); }

/* Photos alternate sides down the page. .ss-flip puts the photo column on the left on desktop only;
   the source keeps text first, so phones still read text, then photo. The offset arch mirrors to stay on the outside. */
@media (min-width: 782px) {
	.ss-flip { flex-direction: row-reverse; }
	.ss-flip .ss-frame { margin: 0 auto 1.4rem 1.4rem; }
	.ss-flip .ss-frame::before { inset: 1.4rem 1.4rem -1.4rem -1.4rem; }
	.ss-flip .ss-arch { margin: 0 auto 0 1rem; }
}

/* ---------- Texture and motion ---------- */

/* Paper grain on warm bands: an inline SVG noise tile (no image request), a few percent dark over the band's own color. */
.ss-grain { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .14 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }

/* Fade-up as sections enter the screen. Only when the visitor allows motion (functions.php sets .ss-motion). */
.ss-motion .ss-reveal { opacity: 0; transform: translateY(24px); transition: opacity 0.9s ease, transform 0.9s cubic-bezier(0.2, 0.7, 0.2, 1); }
.ss-motion .ss-reveal.is-in { opacity: 1; transform: none; }
.ss-motion .wp-block-column.ss-reveal + .wp-block-column.ss-reveal { transition-delay: 0.12s; }

@media (prefers-reduced-motion: reduce) {
	.ss-photo-band .wp-block-cover__image-background { animation: none; }
	.ss-header, .ss-logo img, .ss-header-cta { transition: none; }
}

/* ---------- Cards and panels ---------- */

.ss-card, .ss-panel, .ss-panel-light { box-shadow: inset 0 0 0 1px var(--wp--preset--color--gold-soft); box-sizing: border-box; }
.ss-card { background: var(--wp--preset--color--white); padding: 2rem; height: 100%; }
.ss-card-dark { border: 1px solid var(--wp--preset--color--gold); padding: 2rem; height: 100%; box-sizing: border-box; }
.ss-panel, .ss-panel-light { padding: 2.5rem; }
.ss-card h3, .ss-card-dark h3, .ss-panel h3, .ss-panel-light h3 { margin-top: 0; overflow-wrap: normal; word-break: normal; hyphens: none; }
.ss-card h3, .ss-panel h3 { font-weight: 500; }
.ss-card .wp-block-buttons { margin-top: 1.4rem; }
.ss-panel h3 { margin-bottom: 0.25rem; }
.ss-panel p { margin-top: 0; margin-bottom: 1.6rem; }
.ss-panel p:last-child { margin-bottom: 0; }

/* Home service cards: a mocha bar on top, the note set apart with a hairline. */
.ss-svc-grid { gap: 1.4rem; }
.ss-svc { border-top: 3px solid var(--wp--preset--color--gold-deep); display: flex; flex-direction: column; }
.ss-svc .ss-price { font-size: 2rem; margin: 0.2rem 0 1rem; }
.ss-svc-note { margin-top: auto; padding-top: 1rem; border-top: 1px solid var(--wp--preset--color--gold-soft); color: var(--wp--preset--color--gold-deep); }
.ss-includes .ss-list li { border-color: var(--wp--preset--color--gold); }

.ss-num { font-family: var(--wp--preset--font-family--serif); font-size: 2.4rem; font-weight: 400; line-height: 1; color: var(--wp--preset--color--gold-deep); margin: 0; }
.ss-price { font-family: var(--wp--preset--font-family--serif); font-size: 2.6rem; line-height: 1; color: var(--wp--preset--color--black); margin: 0.6rem 0 0.2rem; }
.ss-price small { font-family: var(--wp--preset--font-family--sans); font-size: 0.9rem; letter-spacing: 0.04em; color: var(--wp--preset--color--gold-deep); }

.ss-quote { font-family: var(--wp--preset--font-family--serif); font-size: clamp(1.9rem, 4.2vw, 3rem); font-style: italic; font-weight: 300; line-height: 1.4; max-width: 24ch; margin-left: auto; margin-right: auto; }
.ss-photo img { width: 100%; height: auto; }
.ss-list li { margin-bottom: 0.6rem; }
.ss-btn-row { margin-top: 2rem; }

/* ---------- FAQ ---------- */

.wp-block-details { border-bottom: 1px solid var(--wp--preset--color--gold-soft); padding: 1.1rem 0; }
.wp-block-details summary { font-family: var(--wp--preset--font-family--serif); font-size: 1.3rem; font-weight: 500; color: var(--wp--preset--color--black); cursor: pointer; }
.wp-block-details p { margin-top: 0.8rem; }
.ss-faq-group + .ss-faq-group { margin-top: 2.6rem; }
.ss-faq-group h2 { font-size: clamp(1.5rem, 3vw, 2rem); }

/* ---------- Buttons ---------- */

.wp-block-button.is-style-outline .wp-block-button__link { background: transparent; border: 1px solid currentColor; }
.wp-block-button.is-style-outline .wp-block-button__link:hover { background: var(--wp--preset--color--black); border-color: var(--wp--preset--color--black); color: var(--wp--preset--color--cream); }

/* Contact form (Fluent Forms): its blue rounded button and gray fields take the theme's button and field look.
   The extra classes outrank Fluent's own .fluentform .ff-btn-submit rules without !important. */
.fluentform .ff-btn.ff-btn-submit.ff_btn_style { background: var(--wp--preset--color--black); color: var(--wp--preset--color--cream); border: 0; border-radius: 0; font-family: var(--wp--preset--font-family--sans); font-size: 0.9rem; font-weight: 600; letter-spacing: 0.02em; text-transform: none; padding: 1.1rem 2.3rem; }
.fluentform .ff-btn.ff-btn-submit.ff_btn_style:hover { background: var(--wp--preset--color--champagne); color: var(--wp--preset--color--black); opacity: 1; }
.fluentform .ff-el-group .ff-el-form-control { border-color: var(--wp--preset--color--tan); border-radius: 0; background: var(--wp--preset--color--white); font-family: var(--wp--preset--font-family--sans); }
.fluentform .ff-el-group .ff-el-input--label label { font-family: var(--wp--preset--font-family--sans); font-weight: 600; }

/* Keyboard focus: a clear brand ring instead of the browser's thin default. */
:where(a, button, summary, input, select, textarea):focus-visible { outline: 2px solid var(--wp--preset--color--gold-deep); outline-offset: 3px; }

/* ---------- Header and menu ---------- */

.wp-site-blocks > header { position: sticky; top: 0; z-index: 30; }
.admin-bar .wp-site-blocks > header { top: var(--wp-admin--admin-bar--height, 0px); } /* signed in: sit below the WP toolbar */
.ss-header { gap: 2rem; padding-top: 0.6rem; padding-bottom: 0.6rem; border-bottom: 1px solid var(--wp--preset--color--gold-soft); transition: padding 0.3s ease, box-shadow 0.3s ease; }
body.ss-scrolled .ss-header { padding-top: 0.35rem; padding-bottom: 0.35rem; box-shadow: 0 6px 24px -18px var(--wp--preset--color--gold-deep); }

/* The logo is a WP Site Logo, so a new logo is only a media change. Core writes its width inline on the img, hence !important on the shrink. */
.ss-logo { flex: 0 0 auto; margin: 0; }
.ss-logo img { display: block; height: auto; transition: width 0.3s ease; }
body.ss-scrolled .ss-logo img { width: 220px !important; }

/* Desktop menu (core swaps to the phone overlay below 600px): small letterspaced capitals with a thin gold rule that draws in on hover and stays under the current page. */
.ss-nav { flex: 0 0 auto; }
@media (min-width: 600px) {
	.ss-nav { flex: 1 1 auto; }
	.ss-nav .wp-block-navigation__container { gap: clamp(1.4rem, 2.6vw, 2.6rem); }
	.ss-nav .wp-block-navigation-item__content { position: relative; padding: 0.5rem 0; font-size: 0.9rem; font-weight: 600; letter-spacing: 0.02em; text-transform: none; text-decoration: none; color: var(--wp--preset--color--black); }
	.ss-nav .wp-block-navigation-item__content::after { content: ""; position: absolute; left: 0; right: 0.22em; bottom: 0.15rem; height: 1px; background: var(--wp--preset--color--gold); transform: scaleX(0); transform-origin: left; transition: transform 0.3s ease; }
	.ss-nav .wp-block-navigation-item__content:hover { color: var(--wp--preset--color--gold-deep); }
	.ss-nav .wp-block-navigation-item__content:hover::after,
	.ss-nav .current-menu-item > .wp-block-navigation-item__content::after,
	.ss-nav .wp-block-navigation-item__content[aria-current="page"]::after { transform: scaleX(1); }
}

/* Header booking button steps aside while the hero's own button is on screen (see functions.php). */
.ss-header-cta { flex: 0 0 auto; transition: opacity 0.25s ease, visibility 0.25s; }
/* Client login sits just left of the button, and stays at the right edge when the button is hidden. */
.ss-header .ss-login { margin: 0 0 0 auto; flex: 0 0 auto; font-size: 0.95rem; white-space: nowrap; }
.ss-header .ss-login a { text-decoration: none; border-bottom: 1px solid var(--wp--preset--color--gold-soft); padding-bottom: 2px; }
.ss-header .ss-login a:hover { border-color: var(--wp--preset--color--gold-deep); }
body:has(.ss-hero .wp-block-buttons):not(.ss-cta-show) .ss-header-cta { opacity: 0; visibility: hidden; }

/* Phone menu overlay: left-aligned serif links. Core centers these with !important, so ours must match it. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { width: 100%; box-sizing: border-box; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { align-items: flex-start !important; justify-content: flex-start !important; padding: 4rem 1.5rem 2rem !important; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { width: 100%; gap: 1.25rem; text-align: left; align-items: flex-start !important; justify-content: flex-start !important; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { width: 100%; justify-content: flex-start; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-family: var(--wp--preset--font-family--serif); font-size: 1.6rem; text-decoration: none; background: transparent; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover { color: var(--wp--preset--color--gold-deep); }
.wp-block-navigation__responsive-container.is-menu-open a:focus { outline: 1px solid var(--wp--preset--color--gold-soft); outline-offset: 4px; background: transparent; }
.wp-block-navigation__responsive-container-close { top: 1rem; right: 1.25rem; }

/* Phone bar with the booking button. Hidden on larger screens, and on phones until the hero's own button scrolls away (see functions.php). */
.ss-sticky-cta { display: none; }

/* ---------- Footer ---------- */

.ss-footer a { color: var(--wp--preset--color--gold-soft); }
.ss-footer a:hover { color: var(--wp--preset--color--white); }
.ss-footer h2.wp-block-heading { font-family: var(--wp--preset--font-family--sans); font-size: 1rem; letter-spacing: 0.02em; text-transform: none; color: var(--wp--preset--color--gold-soft); }
.ss-footer-bar { padding-top: 1rem; padding-bottom: 1rem; border-top: 1px solid var(--wp--preset--color--gold); }
.ss-footer-bar p { margin: 0; font-size: 0.875rem; text-align: center; }
.ss-footer-bar a { color: inherit; }

/* ---------- Tablet ---------- */

/* Tablet menu: tighter spacing so "Services & prices" and the rest stay on one line between core's phone overlay (600px) and desktop. */
@media (min-width: 600px) and (max-width: 1023px) {
	.ss-nav .wp-block-navigation__container { gap: 0.8rem; flex-wrap: nowrap; }
	.ss-nav .wp-block-navigation-item__content { font-size: 0.66rem; letter-spacing: 0.1em; white-space: nowrap; }
	.ss-logo img { max-width: 150px; } /* max-width caps core's inline width and the scrolled width alike */
}

/* Four-up columns become two by two. Core sets column wrapping and widths with !important and inline styles. */
@media (max-width: 1100px) {
	.ss-cols-4 { flex-wrap: wrap !important; }
	.ss-cols-4 > .wp-block-column { flex-basis: calc(50% - 1rem) !important; flex-grow: 1; }
}

/* ---------- Phone ---------- */

/* Below 600px WordPress's admin bar scrolls away, but core still offsets sticky headers by its height,
   leaving a see-through strip above the header for signed-in users. Core sets that offset with an admin-bar rule, hence the !important. */
@media (max-width: 600px) {
	.admin-bar .wp-site-blocks > header { top: 0 !important; }
}

@media (max-width: 781px) {
	body { font-size: 1rem; line-height: 1.6; }
	p { margin-bottom: 0.9rem; }
	h2 { font-size: clamp(1.8rem, 7vw, 2.3rem); }
	h3 { font-size: 1.35rem; margin-bottom: 0.4rem; }
	.wp-block-columns { gap: 1rem; }
	.wp-block-group.alignfull > * + * { margin-block-start: 0.8rem; }
	.wp-block-group.alignfull .wp-block-columns > * + * { margin-block-start: 0; }
	.ss-hide-mobile { display: none !important; } /* a utility must win over any block's own display */
	.ss-cols-4 > .wp-block-column { flex-basis: 100% !important; }

	.ss-band { padding-top: 2.6rem; padding-bottom: 2.6rem; }
	.ss-hero { min-height: calc(100svh - 78px); padding-top: 1.5rem; padding-bottom: 5rem; }
	.ss-hero .wp-block-buttons { flex-direction: column; align-items: stretch; width: 100%; }
	.ss-hero .wp-block-button, .ss-hero .wp-block-button__link { width: 100%; text-align: center; }
	.ss-hero-proof { font-size: 0.8rem; letter-spacing: 0.08em; }
	.ss-eyebrow { letter-spacing: 0.18em; }
	.ss-hero .ss-eyebrow { font-size: 0.8rem; }
	.ss-hero h1 { font-size: clamp(2.5rem, 11vw, 3.2rem); line-height: 1.05; }
	/* Phone hero: less empty space, one solid button, and the second choice as a quiet text link instead of a second big box. */
	.ss-hero.ss-hero-short { padding-top: 2.2rem; padding-bottom: 2.4rem; }
	.ss-hero .wp-block-button.is-style-outline .wp-block-button__link { border: 0; background: transparent; padding: 0.5rem; text-decoration: underline; text-underline-offset: 4px; letter-spacing: 0.12em; }
	.ss-hero .wp-block-buttons { gap: 0.4rem; }
	h2.wp-block-heading { font-size: clamp(1.9rem, 8vw, 2.3rem); }
	.ss-hero.ss-hero-split { min-height: 0; padding-top: 2rem; padding-bottom: 3rem; }
	.ss-hero-split .wp-block-columns { gap: 2.4rem; }
	.ss-arch { max-width: 260px; margin: 0.6rem auto 0; }
	.ss-reel-sm { max-width: 220px; }
	.ss-frame { max-width: 270px; margin: 1.2rem auto 1.4rem; }
	.wp-block-column > .ss-frame-soft { max-width: 340px; margin: 2.4rem 0 0 1rem; } /* the column prefix outranks core's "body .is-layout-flow > :first-child" margin reset */
	.ss-frame-soft img, .ss-frame-soft video { aspect-ratio: 4 / 3; }
	.ss-photo-band { min-height: 380px !important; padding-top: var(--wp--preset--spacing--60); padding-bottom: var(--wp--preset--spacing--60); } /* beats the cover block's inline min-height */
	.ss-steps strong { font-size: 1.15rem; }
	.ss-underlined::after { margin-top: 0.8rem; }

	.wp-block-button__link { font-size: 0.875rem; letter-spacing: 0.08em; padding: 0.9rem 1.2rem; white-space: normal; }
	.ss-card, .ss-panel-light { padding: 1.1rem; }
	.ss-card-dark { padding: 1.4rem; }
	.ss-panel { padding: 1.6rem; }
	.ss-num { font-size: 1.7rem; }
	.ss-list li { margin-bottom: 0.3rem; }
	.ss-btn-row { margin-top: 1.2rem; }

	.wp-block-details { padding: 0.8rem 0; }
	.wp-block-details summary { font-size: 1.12rem; padding: 0.4rem 0; } /* a finger-sized row */
	.home .ss-band .wp-block-details:nth-of-type(n+6) { display: none; }

	.ss-logo img, body.ss-scrolled .ss-logo img { width: 168px !important; } /* beats core's inline width */
	.ss-header > .wp-block-buttons.wp-block-buttons { display: none; } /* beats core's .wp-block-buttons.is-layout-flex on specificity, not load order */
	.ss-sticky-cta { display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; padding: 0.6rem 0.9rem calc(0.6rem + env(safe-area-inset-bottom)); background: var(--wp--preset--color--cream); border-top: 1px solid var(--wp--preset--color--gold-soft); transition: transform 0.25s ease; }
	.ss-sticky-cta .wp-block-buttons { margin: 0; }
	body:has(.ss-hero .wp-block-buttons):not(.ss-cta-show) .ss-sticky-cta { transform: translateY(110%); }
	/* Not on pages that are already a step of their own: booking, paying, consent, managing a visit. */
	body:has(#si-service, #si-pay, #si-consent, #si-manage) .ss-sticky-cta { display: none; }
	body { padding-bottom: 4.4rem; }
	body:has(#si-service, #si-pay, #si-consent, #si-manage) { padding-bottom: 0; } /* no bar there, so no room for one under the footer */

	.ss-footer.ss-band { padding-top: 2rem; padding-bottom: 1.5rem; }
	.ss-footer p { line-height: 2.4; } /* footer links get finger-sized rows on a phone */
	/* Taller tap areas for small links without moving anything: the padding grows the target, the negative margin gives the space back. */
	.ss-footer p a, .ss-logo a { display: inline-block; padding: 0.6rem 0; margin: -0.6rem 0; line-height: 1.6; }
}