/* SRS - one stylesheet. Sections are plain blocks; "srs-*" classes (set in the block's Advanced > Additional CSS class) give them their look. */

@font-face { font-family: "YFF Rare"; src: url("../fonts/yff-rare-power-black.otf") format("opentype"); font-weight: 400 900; font-display: swap; }
@font-face { font-family: "Tussilago"; src: url("../fonts/tussilago-light.otf") format("opentype"); font-weight: 300 400; font-display: swap; }

:root {
	--srs-slate: #344c62;
	--srs-sage: #a8c1bc;
	--srs-sage-lt: #b8ccc9;
	--srs-steel: #607384;
	--srs-mist: #e6eaf0;
	--srs-ink: #10161b;
	--srs-display: "YFF Rare", "Arial Black", Impact, sans-serif;
	--srs-body: "Tussilago", system-ui, -apple-system, "Segoe UI", sans-serif;
	--srs-ui: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
	--srs-gutter: clamp(1.25rem, 4vw, 3rem);
	--srs-max: 1240px;
	--srs-pad: clamp(3rem, 7vw, 6rem);
}

/* ---------- Base ---------- */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { transition: none !important; animation: none !important; } }
body { font-family: var(--srs-body); font-size: clamp(1rem, .95rem + .25vw, 1.125rem); line-height: 1.7; color: var(--srs-slate); background: #fff; }
h1, h2 { font-family: var(--srs-display); font-weight: 400; text-transform: uppercase; color: var(--srs-slate); line-height: 1.1; letter-spacing: .01em; overflow-wrap: break-word; }
h1 { font-size: clamp(1.55rem, 3.2vw + .3rem, 3.6rem); }
h2 { font-size: clamp(1.5rem, 2.2vw + .6rem, 2.6rem); }
h3, h4 { font-family: var(--srs-body); font-weight: 400; color: var(--srs-slate); line-height: 1.3; }
h3 { font-size: clamp(1.2rem, 1.2vw + .8rem, 1.75rem); }
.has-sage-color { color: var(--srs-sage); }
a { text-underline-offset: .2em; }
:focus-visible { outline: 3px solid var(--srs-steel); outline-offset: 3px; }
.entry-content > *, .srs-section p { margin-block-end: 1.1em; }
body.home .site-content, body.home .inside-article, body.home .entry-content, body.home .grid-container { padding: 0; margin: 0; max-width: none; }
body.home .entry-header { display: none; }

/* Buttons (all block buttons) */
.wp-block-button__link, .wpforms-submit {
	background: var(--srs-ink); color: #fff; border-radius: 999px; padding: .85em 2.2em;
	font-family: var(--srs-ui); font-weight: 700; font-size: .95rem; text-transform: uppercase; letter-spacing: .02em; text-decoration: none; border: 0; transition: background .2s;
}
.wp-block-button__link:hover, .wp-block-button__link:focus, .wpforms-submit:hover { background: var(--srs-steel); color: #fff; }

/* ---------- Header (GeneratePress) ---------- */
.site-header { position: sticky; top: 0; z-index: 50; }
body.admin-bar .site-header { top: 32px; }
.site-header .site-logo img, .site-header .header-image { height: clamp(2.75rem, 5.5vw, 4.75rem); width: auto; }
.site-header .inside-header { padding: .75rem var(--srs-gutter) !important; align-items: center; max-width: var(--srs-max); margin-inline: auto; box-sizing: border-box; }
.main-navigation .main-nav ul li a, .main-navigation .menu-toggle { color: #fff; }
.main-navigation .main-nav ul li:hover > a, .main-navigation .main-nav ul li:focus-within > a { background: var(--srs-sage); color: var(--srs-ink); }
/* All menu items are same-page anchors, so WordPress marks every one as "current"; keep them looking identical. */
.main-navigation .main-nav ul li[class*="current-menu-"] > a { background: transparent; color: #fff; }
.main-navigation .main-nav ul li[class*="current-menu-"]:hover > a { background: var(--srs-sage); color: var(--srs-ink); }
.main-navigation .main-nav ul li a { font-family: var(--srs-ui); font-weight: 700; text-transform: uppercase; font-size: .8rem; letter-spacing: .04em; }

/* ---------- Layout helpers ---------- */
.srs-inner { max-width: var(--srs-max); margin-inline: auto; padding-inline: var(--srs-gutter); box-sizing: border-box; }
.srs-section { position: relative; overflow: hidden; padding-block: var(--srs-pad); margin-block: 0; }
.srs-bg { position: absolute; inset: 0; margin: 0 !important; z-index: 0; }
.srs-bg img { width: 100%; height: 100%; object-fit: cover; display: block; }
.srs-section > .wp-block-group__inner-container > :not(.srs-bg) { position: relative; z-index: 2; }
.srs-dots { background-color: #fff; background-image: radial-gradient(circle, rgba(168,193,188,.45) 1.6px, transparent 1.8px); background-size: 16px 16px; }

/* Slanted stripe divider (3 bars). Add "srs-stripes" to an empty-ish group, or to the top of a section. */
.srs-stripes::before, .srs-stripes--right::before {
	content: ""; position: absolute; top: 0; left: 0; height: clamp(1rem, 2vw, 1.6rem); width: clamp(10rem, 28vw, 17rem); z-index: 2;
	background: linear-gradient(90deg, var(--srs-slate) 0 55%, transparent 55% 58%, var(--srs-slate) 58% 68%, transparent 68% 71%, var(--srs-sage) 71% 82%, transparent 82% 85%, var(--srs-slate) 85% 100%);
	transform: skewX(-38deg); transform-origin: top left; margin-left: -1rem;
}
.srs-stripes--right::before { left: auto; right: 0; width: 65%; margin: 0; transform-origin: top right;
	background: linear-gradient(90deg, transparent 0 8%, var(--srs-slate) 8% 14%, transparent 14% 17%, var(--srs-sage) 17% 24%, transparent 24% 27%, var(--srs-slate) 27% 34%, transparent 34% 37%, var(--srs-slate) 37% 100%); }

/* ---------- Hero ---------- */
.srs-hero { padding: 0; min-height: clamp(26rem, 50vw, 38rem); display: flex; align-items: center; background: #fff; }
.srs-hero .srs-bg img { object-position: 70% center; }
.srs-hero::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, #fff 0%, rgba(255,255,255,.95) 38%, rgba(255,255,255,0) 68%); }
@media (min-width: 782px) { .srs-hero .srs-bg { left: 16%; } }
.srs-hero > .wp-block-group__inner-container { width: 100%; }
.srs-hero__content { padding-block: 3rem; }
.srs-hero__content > .wp-block-group__inner-container > * { max-width: 46rem; }
.srs-hero__content > .wp-block-group__inner-container > p { max-width: 60rem; }
.srs-hero__content p { font-size: clamp(1.15rem, 1.5vw + .8rem, 2rem); margin: .5rem 0 1.8rem; color: var(--srs-ink); }
@media (max-width: 781px) {
	.srs-hero::after { background: linear-gradient(180deg, rgba(255,255,255,.88), rgba(255,255,255,.7)); }
	.srs-hero .srs-bg img { object-position: 78% center; }
}

/* ---------- About ---------- */
.srs-training__media { display: flex; }
.srs-training__media figure { margin: 0; flex: 1; display: flex; }
.srs-training__media img { flex: 1; width: 100%; height: auto; min-height: 16rem; object-fit: cover; display: block; }
@media (min-width: 782px) {
}
.srs-stats { gap: 1rem; margin-top: 2rem; flex-wrap: nowrap !important; }
.srs-stats .wp-block-column { flex: 1 1 0 !important; text-align: center; }
.srs-stats img { width: clamp(3.5rem, 7vw, 5rem); height: auto; margin-inline: auto; display: block; }
.srs-stats p { font-family: var(--srs-ui); font-size: clamp(.7rem, .6rem + .3vw, .85rem); text-transform: uppercase; margin: .5rem 0 0; line-height: 1.3; }

/* ---------- Design ---------- */

/* ---------- Scope of supply ---------- */
.srs-scope { padding-top: calc(var(--srs-pad) + 1.5rem); }
.srs-cards { gap: clamp(1rem, 2vw, 1.75rem); margin-top: 2.5rem; }
.srs-card { margin: 0 !important; padding: 1.5rem 1.75rem; border-radius: 1.75rem; background: var(--srs-sage-lt); color: var(--srs-slate); transform: skewX(-5deg); text-align: center; display: flex; flex-direction: column; justify-content: center; min-height: 12rem; }
.srs-card > .wp-block-group__inner-container { transform: skewX(5deg); }
.srs-card > .wp-block-group__inner-container > * { margin: 0 !important; }
.srs-card:nth-child(3n+2) { background: var(--srs-steel); color: #eef2f5; }
.srs-card:nth-child(3n+2) .srs-card__num { color: #e6eaf0; }
.srs-card__num { font-family: var(--srs-display); font-size: clamp(2.5rem, 4vw, 3.5rem); line-height: 1; color: var(--srs-slate); margin-bottom: .5rem !important; }

/* ---------- What we offer (GenerateBlocks Pro Tabs) ---------- */
.srs-offer .gb-tabs { display: grid; grid-template-columns: minmax(13rem, 20rem) minmax(0, 1fr); gap: clamp(1rem, 3vw, 3rem); margin-top: 1.5rem; }
.srs-offer .gb-tabs__menu { display: flex; flex-direction: column; }
.srs-offer .gb-tabs__menu-item { cursor: pointer; padding: .75rem 1.1rem; text-align: left; transition: background .2s; }
.srs-offer .gb-tabs__menu-item p { margin: 0; font-family: var(--srs-ui); font-size: .95rem; text-transform: uppercase; letter-spacing: .03em; line-height: 1.3; color: var(--srs-ink); }
.srs-offer .gb-tabs__menu-item:hover, .srs-offer .gb-tabs__menu-item.gb-block-is-current { background: var(--srs-sage); }
.srs-offer .gb-tabs__items { background: var(--srs-mist); padding: clamp(1rem, 3vw, 2rem); text-align: center; }
.srs-offer .gb-tabs__item figure { margin: 0 0 1.25rem; }
.srs-offer .gb-tabs__item img { width: 100%; height: auto; max-height: 26rem; object-fit: cover; border-radius: 1.5rem; display: block; }
.srs-offer .gb-tabs__item p { margin: 0 0 .75rem; color: var(--srs-ink); }
@media (max-width: 781px) {
	.srs-offer .gb-tabs { grid-template-columns: minmax(0, 1fr); }
	.srs-offer .gb-tabs__menu { flex-direction: row; overflow-x: auto; gap: .25rem; padding-bottom: .5rem; -webkit-overflow-scrolling: touch; }
	.srs-offer .gb-tabs__menu-item { flex: 0 0 auto; white-space: nowrap; background: var(--srs-mist); border-radius: 999px; }
}

/* ---------- Maintenance ---------- */
.srs-maint { background: var(--srs-slate); color: #fff; }
.srs-maint::after { content: ""; position: absolute; inset: 0; z-index: 1; background: rgba(52,76,98,.84); }
.srs-maint .srs-bg img { object-position: 20% center; }
.srs-maint .srs-maint__content { margin-left: auto; max-width: 46rem; }
.srs-maint h2 { color: var(--srs-sage-lt); }
.srs-maint h3, .srs-maint p { color: #fff; }

/* ---------- Training ---------- */
.srs-training { padding: 0; background: var(--srs-mist); }
.srs-training .wp-block-columns { gap: 0; margin: 0; flex-wrap: wrap; }
.srs-training__text { flex-basis: 100%; padding: var(--srs-pad) var(--srs-gutter); }
.srs-training__media { flex-basis: 100%; margin: 0; }
@media (min-width: 782px) {
	.srs-training .wp-block-columns { flex-wrap: nowrap; }
	.srs-training__text { flex: 1 1 50%; padding-left: max(var(--srs-gutter), calc((100vw - var(--srs-max)) / 2 + var(--srs-gutter))); box-sizing: border-box; }
	.srs-training__media { flex: 1 1 50%; }
}

/* ---------- Contact ---------- */
.srs-contact .wp-block-columns { gap: clamp(1.5rem, 5vw, 5rem); align-items: center; }
.srs-contact__row { margin: 1.5rem 0 !important; }
.srs-contact__row > .wp-block-group__inner-container { display: flex; align-items: center; gap: 1rem; }
.srs-contact__row figure { margin: 0; flex: 0 0 3.25rem; }
.srs-contact__row img { width: 3.25rem; height: 3.25rem; display: block; }
.srs-contact__row p { margin: 0; }
.srs-contact__row a { color: inherit; text-decoration: none; }
.srs-contact__row a:hover { text-decoration: underline; }
.srs-form-panel { background: var(--srs-sage); border-radius: 2rem; padding: clamp(1.25rem, 4vw, 2.5rem); }
.srs-form-panel .wpforms-container { margin: 0; }
.srs-form-panel .wpforms-field { padding: 0 0 1rem; }
.srs-form-panel .wpforms-field-label { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.srs-form-panel div.wpforms-container-full .wpforms-form input[type=text], .srs-form-panel div.wpforms-container-full .wpforms-form input[type=email], .srs-form-panel div.wpforms-container-full .wpforms-form textarea {
	width: 100% !important; max-width: 100% !important; border: 0 !important; border-radius: 1.25rem !important; padding: 1rem 1.5rem !important; font-family: var(--srs-body) !important; font-size: 1rem !important; background: #fff !important; color: var(--srs-ink) !important; box-sizing: border-box !important; height: auto !important; box-shadow: none !important;
}
.srs-form-panel div.wpforms-container-full .wpforms-form textarea { min-height: 9rem; }
.srs-form-panel div.wpforms-container-full .wpforms-form button[type=submit].wpforms-submit { background: var(--srs-ink) !important; color: #fff !important; border-radius: 999px !important; padding: .85em 2.2em !important; height: auto !important; border: 0 !important; }
.srs-form-panel div.wpforms-container-full .wpforms-form button[type=submit].wpforms-submit:hover { background: var(--srs-steel) !important; }
.srs-form-panel .wpforms-submit-container { text-align: right; padding: 0; }

/* ---------- Footer (GP Element) ---------- */
.srs-footer { background: var(--srs-slate); color: #fff; padding: 2.5rem var(--srs-gutter); }
.srs-footer .wp-block-columns { max-width: var(--srs-max); margin: 0 auto; align-items: center; gap: 1.5rem; }
.srs-footer img { height: clamp(2.5rem, 5vw, 3.75rem); width: auto; }
.srs-footer p, .srs-footer a { color: #fff; font-family: var(--srs-ui); font-size: .72rem; text-transform: uppercase; margin: 0; letter-spacing: .02em; }
.srs-footer a { text-decoration: none; } .srs-footer a:hover { text-decoration: underline; }
.srs-footer__copy { text-align: right; font-size: .85rem !important; }
@media (max-width: 781px) { .srs-footer__copy { text-align: left; } }


/* =====================================================================
   Polish pass (spacing, tap targets, readability, responsive tuning)
   ===================================================================== */
html { scroll-padding-top: 6.5rem; -webkit-text-size-adjust: 100%; }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
::selection { background: var(--srs-sage); color: var(--srs-ink); }
h1, h2, h3 { text-wrap: balance; }
p, li { text-wrap: pretty; }
h2 { margin-bottom: .6em; }
h3 { margin-top: 0; margin-bottom: .75em; }
.srs-offer .gb-tabs__item p { margin-inline: auto; max-width: 54ch; }

/* Buttons: comfortable hit area + visible focus */
.wp-block-button__link { min-height: 3rem; display: inline-flex; align-items: center; justify-content: center; }
.wp-block-button__link:focus-visible, .wpforms-submit:focus-visible { outline: 3px solid var(--srs-sage); outline-offset: 3px; }

/* Header + navigation */
.main-navigation .main-nav ul li a { padding-inline: clamp(.75rem, 1.2vw, 1.25rem); }
.main-navigation a:focus-visible, .main-navigation .menu-toggle:focus-visible { outline: 3px solid #fff; outline-offset: -3px; }
.main-navigation .menu-toggle { min-width: 3rem; min-height: 3rem; }
.main-navigation.toggled .main-nav ul li a { line-height: 3rem; min-height: 3rem; padding-inline: var(--srs-gutter); border-top: 1px solid rgba(255,255,255,.14); }
.main-navigation.toggled .main-nav > ul { padding-bottom: .5rem; }

/* Hero */
.srs-hero { min-height: clamp(24rem, 62svh, 40rem); }
.srs-hero::after { background: linear-gradient(90deg, #fff 0%, rgba(255,255,255,.96) 42%, rgba(255,255,255,0) 72%); }
@media (max-width: 781px) {
	.srs-hero { min-height: 30rem; }
	.srs-hero::after { background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.78)); }
}

/* About */
.srs-stats { gap: clamp(.5rem, 2vw, 1.5rem); margin-top: 2.25rem; }
.srs-stats p { font-size: clamp(.78rem, .7rem + .3vw, .9rem); letter-spacing: .02em; }

/* Design */

/* Scope of supply */
.srs-card { min-height: 11rem; }
.srs-card p:not(.srs-card__num) { font-size: clamp(.98rem, .9rem + .3vw, 1.1rem); line-height: 1.5; }
@media (max-width: 781px) {
	.srs-card { transform: skewX(-3deg); min-height: 0; padding: 1.25rem 1.5rem; }
	.srs-card > .wp-block-group__inner-container { transform: skewX(3deg); }
	.srs-card__num { font-size: 2.25rem; }
}

/* What we offer */
.srs-offer .gb-tabs__menu-item { min-height: 3rem; display: flex; align-items: center; }
.srs-offer .gb-tabs__menu-item:focus-visible { outline: 3px solid var(--srs-slate); outline-offset: -3px; }
.srs-offer .gb-tabs__items { border-radius: 1.5rem; }
@media (max-width: 781px) {
	.srs-offer .gb-tabs__menu { margin-inline: calc(var(--srs-gutter) * -1); padding-inline: var(--srs-gutter); scroll-snap-type: x proximity; scrollbar-width: none; }
	.srs-offer .gb-tabs__menu::-webkit-scrollbar { display: none; }
	.srs-offer .gb-tabs__menu-item { scroll-snap-align: start; padding-inline: 1.25rem; }
}

/* Maintenance + training */
.srs-maint::after { background: rgba(52,76,98,.87); }
.srs-maint p { line-height: 1.75; }
@media (max-width: 781px) { .srs-training__media img { aspect-ratio: 16 / 10; min-height: 0; } }

/* Contact */
.srs-contact__row a { display: inline-block; padding-block: .6rem; }
.srs-contact__row figure { flex-basis: 3rem; }
.srs-contact__row img { width: 3rem; height: 3rem; }
.srs-form-panel div.wpforms-container-full .wpforms-form input::placeholder, .srs-form-panel div.wpforms-container-full .wpforms-form textarea::placeholder { color: #566675; opacity: 1; }
.srs-form-panel div.wpforms-container-full .wpforms-form input[type=text]:focus, .srs-form-panel div.wpforms-container-full .wpforms-form input[type=email]:focus, .srs-form-panel div.wpforms-container-full .wpforms-form textarea:focus { outline: 0 !important; box-shadow: 0 0 0 3px var(--srs-slate) !important; }
.srs-form-panel div.wpforms-container-full .wpforms-form .wpforms-error { color: #7a1f1f; font-size: .9rem; margin-top: .35rem; }
@media (max-width: 781px) {
	.srs-form-panel div.wpforms-container-full .wpforms-form button[type=submit].wpforms-submit { width: 100%; }
	.srs-form-panel .wpforms-submit-container { text-align: center; }
}

/* Footer */
.srs-footer a { display: inline-block; padding: .85rem .3rem; font-size: .78rem; }
.srs-footer p { font-size: .78rem; line-height: 1.4; }
.srs-footer__copy { font-size: .85rem !important; }
@media (max-width: 781px) { .srs-footer .wp-block-columns { gap: .75rem; } .srs-footer img { height: 3rem; } }

/* Hero: on wide screens push the photo right so the headline and subtitle sit on clean white */
@media (min-width: 1000px) {
	.srs-hero .srs-bg { left: 30%; }
	.srs-hero::after { background: linear-gradient(90deg, #fff 0%, #fff 38%, rgba(255,255,255,0) 66%); }
}
/* Footer: give the links column room so the five links don't stack in a narrow strip */
@media (min-width: 782px) {
	.srs-footer .wp-block-columns { flex-wrap: nowrap; }
	.srs-footer .wp-block-column:nth-child(1) { flex: 0 0 22%; }
	.srs-footer .wp-block-column:nth-child(2) { flex: 1 1 auto; }
	.srs-footer .wp-block-column:nth-child(3) { flex: 0 0 24%; }
}


/* =====================================================================
   Rev 3: smaller headings + body, roomier hero, rebuilt Design section
   ===================================================================== */
body { font-size: clamp(.95rem, .9rem + .15vw, 1.03rem); }
h1 { font-size: clamp(1.45rem, 1.1vw + 1.35rem, 3rem); }
h2 { font-size: clamp(1.35rem, .9vw + 1.1rem, 2.1rem); }
h3 { font-size: clamp(1.1rem, .6vw + .95rem, 1.5rem); }
h1, h2 { overflow-wrap: normal; }

/* Hero: taller, more padding, text sits comfortably left of the photo */
.srs-hero { min-height: clamp(30rem, 78svh, 46rem); }
.srs-hero__content { padding-block: clamp(4rem, 9vw, 7rem); }
.srs-hero__content > .wp-block-group__inner-container > * { max-width: 40rem; }
.srs-hero__content > .wp-block-group__inner-container > p { max-width: 40rem; }
.srs-hero__content p { font-size: clamp(1.05rem, .5vw + .95rem, 1.5rem); margin: .85rem 0 2.25rem; line-height: 1.5; }
@media (max-width: 781px) { .srs-hero { min-height: 32rem; } }

/* Design: title + subhead, a wide "drawing board" panel for the 3-D render, then the three points side by side.
   Phones: everything stacks in reading order. */
.srs-design { background: #fff; }
.srs-design__layout > .wp-block-group__inner-container {
	display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; gap: clamp(1.25rem, 3vw, 2rem);
	grid-template-areas: "title" "sub" "media" "points" "cta";
}
.srs-design__layout > h2 { grid-area: title; margin: 0; }
.srs-design__sub { grid-area: sub; margin: 0; max-width: 34ch; }
.srs-design__render { grid-area: media; margin: 0; padding: clamp(1rem, 4vw, 3rem); border-radius: 1.75rem; background-color: var(--srs-mist);
	background-image: radial-gradient(circle, rgba(52,76,98,.18) 1.4px, transparent 1.6px); background-size: 18px 18px; }
.srs-design__render img { width: 100%; height: auto; display: block; }
.srs-design__points { grid-area: points; }
.srs-design__points > .wp-block-group__inner-container { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem clamp(1.5rem, 3vw, 3rem); }
.srs-design__points p { margin: 0; padding-top: 1rem; border-top: 1px solid rgba(52,76,98,.22); max-width: 52ch; }
.srs-design__layout > .wp-block-buttons { grid-area: cta; margin: .5rem 0 0; }
@media (min-width: 900px) {
	.srs-design__layout > .wp-block-group__inner-container { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); grid-template-areas: "title sub" "media media" "points points" "cta cta"; column-gap: clamp(2rem, 5vw, 5rem); row-gap: clamp(1.5rem, 3vw, 2.5rem); }
	.srs-design__layout > h2 { align-self: center; }
	.srs-design__points > .wp-block-group__inner-container { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* =====================================================================
   Services: tabs become a row of pills above one wide card
   (name + description on the left, image gallery on the right)
   ===================================================================== */
.srs-offer .gb-tabs { grid-template-columns: minmax(0, 1fr); gap: clamp(1.25rem, 3vw, 2rem); }
.srs-offer .gb-tabs__menu { flex-direction: row; flex-wrap: wrap; gap: .5rem; }
.srs-offer .gb-tabs__menu-item { background: var(--srs-mist); border-radius: 999px; padding: .5rem 1.25rem; }
.srs-offer .gb-tabs__menu-item:hover { background: var(--srs-sage); }
.srs-offer .gb-tabs__menu-item.gb-block-is-current { background: var(--srs-slate); }
.srs-offer .gb-tabs__menu-item.gb-block-is-current p { color: #fff; }
.srs-offer .gb-tabs__items { text-align: left; padding: clamp(.75rem, 2vw, 1.25rem); }
.srs-offer .gb-tabs__item p { margin-inline: 0; max-width: none; }

.srs-svc { display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(.75rem, 2vw, 1.25rem); }
.srs-svc__text { background: var(--srs-slate); border-radius: 1.25rem; padding: clamp(1.25rem, 3vw, 2rem); }
.srs-offer .srs-svc__title { color: #fff; font-size: clamp(1.1rem, .6vw + 1rem, 1.5rem); text-transform: uppercase; letter-spacing: .03em; margin: 0 0 1.1rem; padding-bottom: 1rem; border-bottom: 1px solid rgba(255,255,255,.55); }
.srs-offer .srs-svc__desc p { color: #fff; margin: 0 0 1em; max-width: 58ch; font-size: .98rem; line-height: 1.7; }
.srs-offer .srs-svc__desc p:last-child { margin-bottom: 0; }
.srs-svc__gallery { min-width: 0; }
.srs-svc__main { border-radius: 1.25rem; overflow: hidden; aspect-ratio: 16 / 10; background: #cfd6de; }
.srs-offer .srs-svc__main img { width: 100%; height: 100%; max-height: none; object-fit: cover; border-radius: 0; display: block; }
.srs-svc__thumbs { list-style: none; margin: .75rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; }
.srs-svc__thumb { display: block; width: 100%; padding: 0; border: 0; border-radius: .75rem; overflow: hidden; aspect-ratio: 1; background: #cfd6de; cursor: pointer; opacity: .72; outline: 3px solid transparent; outline-offset: 2px; transition: opacity .2s, outline-color .2s; }
.srs-svc__thumb:hover, .srs-svc__thumb:focus-visible, .srs-svc__thumb.is-active { opacity: 1; }
.srs-svc__thumb.is-active { outline-color: var(--srs-slate); }
.srs-offer .srs-svc__thumb img { width: 100%; height: 100%; max-height: none; object-fit: cover; border-radius: 0; display: block; }
.srs-svc--no-gallery { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { .srs-svc:not(.srs-svc--no-gallery) { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); } }
@media (max-width: 781px) { .srs-offer .gb-tabs__menu { flex-wrap: nowrap; } .srs-svc__thumbs { gap: .5rem; } }

/* Radius scale used across the site: buttons/pills 999px, large panels 1.75rem, inner panels and inputs 1.25rem, small tiles .75rem */
.srs-offer .gb-tabs__items { border-radius: 1.75rem; }
.srs-offer .gb-tabs__menu-item, .srs-offer .gb-tabs__menu-item:hover, .srs-offer .gb-tabs__menu-item.gb-block-is-current { border-radius: 999px; }



/* =====================================================================
   About (23-10): text on top, story timeline, then the building photo as a wide banner
   ===================================================================== */
.srs-about { padding-block: calc(var(--srs-pad) + 1rem) var(--srs-pad); }
.srs-about__top { gap: clamp(1.25rem, 4vw, 4rem); margin: 0; }
.srs-about__head > h2, .srs-about__sub > h3 { margin-top: 0; margin-bottom: 0; }
@media (min-width: 782px) { .srs-about__head { flex: 0 0 38% !important; } .srs-about__sub { flex: 1 1 0 !important; align-self: center; } }
.srs-about__banner { margin: clamp(2.25rem, 5vw, 4rem) 0 0; }
.srs-about__banner img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; object-position: 50% 85%; border-radius: 1.75rem; }
@media (min-width: 782px) { .srs-about__banner img { aspect-ratio: 2.6 / 1; object-position: 50% 94%; } }

/* Timeline */
.srs-timeline { margin-top: clamp(2.5rem, 5vw, 4rem); }
.srs-timeline__heading { margin: 0 0 1.25rem; }
.srs-timeline__list { list-style: none; margin: 0; padding: 0; }
.srs-timeline__node { font: 700 1rem/1 var(--srs-ui); letter-spacing: .02em; color: var(--srs-slate); background: #fff; border: 2px solid var(--srs-slate); border-radius: 999px; padding: .8rem 1.4rem; min-height: 3rem; min-width: 5.5rem; cursor: pointer; transition: background .2s, color .2s; position: relative; z-index: 1; }
.srs-timeline__node:hover, .srs-timeline__item.is-active .srs-timeline__node { background: var(--srs-slate); color: #fff; }
.srs-timeline__node:focus-visible { outline: 3px solid var(--srs-sage); outline-offset: 3px; }
.srs-timeline__card { background: var(--srs-mist); border-radius: 1.25rem; padding: clamp(1.1rem, 2.5vw, 1.75rem); }
.srs-timeline__title { margin: 0 0 .5rem; font-family: var(--srs-body); font-weight: 400; font-size: clamp(1.1rem, .5vw + 1rem, 1.35rem); color: var(--srs-slate); }
.srs-timeline__card p { margin: 0; max-width: 62ch; }
.srs-timeline__card p + p { margin-top: .75em; }

@media (min-width: 782px) {
	/* Horizontal: year nodes on a line, one detail card below that swaps (all cards share one cell so the height never jumps). */
	.srs-timeline__list { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); grid-template-rows: auto auto; row-gap: 1.5rem; position: relative; }
	.srs-timeline__list::before { content: ""; grid-row: 1; grid-column: 1 / -1; align-self: center; height: 2px; background: var(--srs-slate); }
	.srs-timeline__item { display: contents; }
	.srs-timeline__node { grid-row: 1; grid-column: var(--i); justify-self: center; }
	.srs-timeline__card { grid-row: 2; grid-column: 1 / -1; visibility: hidden; opacity: 0; transition: opacity .2s; max-width: 52rem; width: 100%; justify-self: center; box-sizing: border-box; }
	.srs-timeline__item.is-active .srs-timeline__card { visibility: visible; opacity: 1; }
}
@media (max-width: 781px) {
	/* Vertical: line down the left, tap a year to expand it */
	.srs-timeline__list { position: relative; padding-left: 0; }
	.srs-timeline__list::before { content: ""; position: absolute; left: 2.75rem; top: .5rem; bottom: .5rem; width: 2px; background: var(--srs-slate); }
	.srs-timeline__item { padding: .25rem 0; }
	.srs-timeline__node { display: block; margin: 0 0 .5rem; }
	.srs-timeline__card { display: none; margin: 0 0 .75rem 5rem; }
	.srs-timeline__item.is-active .srs-timeline__card { display: block; }
}

/* Timeline (14 events): fluid year pills so ~12 points fit on one line from 782px up, name-change highlight, multi-entry cards */
.srs-timeline__node { min-width: 0; padding: .7rem clamp(.5rem, 1vw, 1.1rem); font-size: clamp(.78rem, .5vw + .62rem, 1rem); }
.srs-timeline__item.has-tag .srs-timeline__node { background: var(--srs-sage-lt); }
.srs-timeline__item.has-tag.is-active .srs-timeline__node, .srs-timeline__item.has-tag .srs-timeline__node:hover { background: var(--srs-slate); }
.srs-timeline__entry + .srs-timeline__entry { margin-top: 1.1rem; padding-top: 1.1rem; border-top: 1px solid rgba(52,76,98,.2); }
.srs-timeline__tag { display: inline-block; background: var(--srs-sage); color: var(--srs-ink); font: 700 .72rem/1 var(--srs-ui); letter-spacing: .03em; text-transform: uppercase; border-radius: 999px; padding: .4rem .75rem; margin-bottom: .6rem; }
@media (max-width: 781px) {
	/* Mobile timeline: line runs through the centre of the year pills, details use the full width */
	.srs-timeline__node { min-width: 4rem; }
	.srs-timeline__list::before { left: 2rem; }
	.srs-timeline__card { margin: 0 0 .75rem 0; position: relative; z-index: 1; }
}

/* About (29-10 order): title row, photo, timeline, text in columns, highlights across the full width */
.srs-about__banner { margin-top: clamp(1.5rem, 3vw, 2.5rem); }
.srs-about__body { margin-top: clamp(2.25rem, 5vw, 4rem); }
.srs-about__body > .wp-block-group__inner-container { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); gap: 1.25rem clamp(1.5rem, 3vw, 3rem); }
.srs-about__body p { margin: 0; padding-top: 1rem; border-top: 1px solid rgba(52,76,98,.22); max-width: 60ch; }
.srs-about .srs-stats { margin-top: clamp(2rem, 4vw, 3rem); max-width: none; gap: clamp(1rem, 3vw, 3rem); }
.srs-about .srs-stats .wp-block-column { text-align: left; }
.srs-about .srs-stats img { margin-inline: 0; width: clamp(3.5rem, 6vw, 5rem); }
.srs-about .srs-stats p { font-size: clamp(.78rem, .7rem + .3vw, .95rem); }

.srs-svc__thumbs { grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr)); }
@media (max-width: 781px) { .srs-svc__thumbs { grid-template-columns: repeat(min(var(--cols, 4), 4), minmax(0, 1fr)); } }

/* Timeline (desktop): only the open card takes up space, so its height follows its own content */
@media (min-width: 782px) {
	.srs-timeline__card { display: none; visibility: visible; opacity: 1; }
	.srs-timeline__item.is-active .srs-timeline__card { display: block; animation: srs-tl-in .2s ease; }
}
@keyframes srs-tl-in { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .srs-timeline__item.is-active .srs-timeline__card { animation: none; } }

/* =====================================================================
   Social icons (header menu + footer), edited under Site Content -> Social links
   ===================================================================== */
.srs-social { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: .6rem; }
.srs-social li { margin: 0; padding: 0; }
.main-navigation .main-nav ul li .srs-social li { display: block; }
.srs-social a, .main-navigation .main-nav ul li .srs-social a {
	width: 2.5rem; height: 2.5rem; min-height: 0; padding: 0; line-height: 1; border-radius: 50%;
	background: #fff; color: var(--srs-slate); display: grid; place-items: center; text-decoration: none; transition: background .2s;
}
.srs-social a:hover, .srs-social a:focus-visible, .main-navigation .main-nav ul li .srs-social a:hover { background: var(--srs-sage); color: var(--srs-ink); }
.srs-social a:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.srs-social svg { width: 1.25rem; height: 1.25rem; display: block; }

/* header: sits at the end of the menu */
.main-navigation .main-nav ul li.srs-social-item { display: flex; align-items: center; padding-left: clamp(.5rem, 1vw, 1rem); }
.main-navigation .main-nav ul li.srs-social-item:hover > a, .main-navigation .main-nav ul li.srs-social-item > a { background: transparent; }
.main-navigation.toggled .main-nav ul li.srs-social-item { padding: .85rem var(--srs-gutter) 1.1rem; border-top: 1px solid rgba(255,255,255,.14); }

/* footer */
.srs-footer__right .srs-social { justify-content: flex-end; margin-bottom: .9rem; }
.srs-footer .srs-social a { width: 2.5rem; height: 2.5rem; padding: 0; font-size: 0; background: #fff; color: var(--srs-slate); }
.srs-footer .srs-social a:hover { background: var(--srs-sage); }
@media (max-width: 781px) { .srs-footer__right .srs-social { justify-content: flex-start; } }

/* Footer credit link: inline, underlined, no extra tap padding */
.srs-footer__copy a { display: inline; padding: 0; font-size: inherit; text-decoration: underline; text-underline-offset: .2em; }
.srs-footer__copy a:hover { text-decoration-thickness: 2px; }
