/* Purple Frog Signs — public website */
:root {
    --purple: #271330;
    --purple-dark: #271330;
    --purple-deep: #271330;
    --magenta: #a3165e;
    --magenta-dark: #7d1448;
    --ink: #1e1d22;
    --ink-soft: #4f4a50;
    --paper: #fbfaf7;
    --white: #ffffff;
    --mist: #eeeae6;
    --blush: #eeeae6;
    --line: rgba(39, 19, 48, 0.16);
    --line-dark: rgba(255, 255, 255, 0.2);
    --success: #156b4b;
    --danger: #a2203a;
    --focus: #ffd33d;
    --shadow-sm: 0 10px 35px rgba(39, 19, 48, 0.1);
    --shadow-lg: 0 30px 80px rgba(39, 19, 48, 0.2);
    --color-aubergine: #271330;
    --color-accent: #a3165e;
    --color-accent-hover: #7d1448;
    --color-warm-white: #fbfaf7;
    --color-stone: #eeeae6;
    --color-charcoal: #1e1d22;
    --color-white: #ffffff;
    --color-text-muted: rgba(30, 29, 34, 0.76);
    --color-line: rgba(39, 19, 48, 0.16);
    --radius-sm: 0.45rem;
    --radius: 1rem;
    --radius-lg: 2rem;
    --shell: 76rem;
    --gutter: clamp(1.15rem, 4vw, 3rem);
    --space-section: clamp(4.5rem, 9vw, 8.5rem);
    --font-sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
    --font-display: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 5.75rem; }
body {
    margin: 0;
    background: var(--paper);
    color: var(--ink);
    font-family: var(--font-sans);
    font-size: 1rem;
    line-height: 1.65;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}
body.menu-open { overflow: hidden; }
img, svg { display: block; max-width: 100%; }
img { height: auto; }
button, input, textarea, select { color: inherit; font: inherit; }
button { cursor: pointer; }
a { color: var(--purple); text-decoration-thickness: 0.08em; text-underline-offset: 0.18em; }
a:hover { color: var(--magenta-dark); }
p, ul, ol, dl, figure, blockquote { margin-block: 0 1.35em; }
h1, h2, h3, h4 {
    margin: 0 0 0.55em;
    color: var(--ink);
    font-family: var(--font-display);
    font-weight: 700;
    letter-spacing: -0.035em;
    line-height: 1.06;
    text-wrap: balance;
}
h1 { font-size: clamp(2.7rem, 6.4vw, 5.7rem); }
h2 { font-size: clamp(2rem, 4vw, 3.65rem); }
h3 { font-size: clamp(1.2rem, 2vw, 1.65rem); letter-spacing: -0.02em; line-height: 1.2; }
::selection { background: var(--color-accent); color: var(--color-white); }
:focus-visible { outline: none; box-shadow: 0 0 0 2px var(--color-white), 0 0 0 5px var(--color-aubergine); }
[hidden] { display: none !important; }

.shell { width: min(100% - (2 * var(--gutter)), var(--shell)); margin-inline: auto; }
.no-break { white-space: nowrap; }
.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}
.skip-link {
    position: fixed;
    z-index: 10000;
    top: 0.75rem;
    left: 0.75rem;
    padding: 0.8rem 1.1rem;
    background: var(--color-accent);
    color: var(--color-white);
    font-weight: 800;
    transform: translateY(-180%);
    transition: transform 150ms ease;
}
.skip-link:focus { transform: translateY(0); }
.eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.7rem;
    margin-bottom: 1.15rem;
    color: var(--purple);
    font-size: 0.875rem;
    font-weight: 800;
    letter-spacing: 0.15em;
    line-height: 1.3;
    text-transform: uppercase;
}
.eyebrow::before { width: 1.6rem; height: 2px; background: var(--magenta); content: ""; }
.eyebrow--light { color: var(--white); }
.button-row { display: flex; flex-wrap: wrap; gap: 0.8rem; align-items: center; margin-top: 2rem; }
.button {
    display: inline-flex;
    min-height: 3.25rem;
    align-items: center;
    justify-content: center;
    padding: 0.8rem 1.45rem;
    border: 2px solid var(--color-accent);
    border-radius: .45rem;
    background: var(--color-accent);
    color: var(--color-white);
    font-size: 0.88rem;
    font-weight: 800;
    letter-spacing: 0.025em;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    transition: background 180ms ease, border-color 180ms ease, color 180ms ease, transform 180ms ease;
}
.button:hover { border-color: var(--color-accent-hover); background: var(--color-accent-hover); color: var(--color-white); transform: translateY(-2px); }
.button:active { border-color: var(--color-accent-hover); background: var(--color-accent-hover); color: var(--color-white); transform: none; }
.button--small { min-height: 2.75rem; padding: 0.65rem 1.15rem; font-size: 0.875rem; }
.button--outline { border-color: var(--color-aubergine); background: transparent; color: var(--color-aubergine); }
.button--outline:hover { border-color: var(--color-accent); background: var(--color-stone); color: var(--color-accent-hover); }
.button--outline:active { border-color: var(--color-aubergine); background: var(--color-aubergine); color: var(--color-white); }
.button--light { border-color: var(--color-white); background: var(--color-white); color: var(--color-aubergine); }
.button--light:hover { border-color: var(--color-stone); background: var(--color-stone); color: var(--color-accent-hover); }
.button--light:active { border-color: var(--color-stone); background: var(--color-stone); color: var(--color-aubergine); }
.button--ghost-light { border-color: rgba(255,255,255,.65); background: transparent; color: var(--white); }
.button--ghost-light:hover { border-color: var(--white); background: var(--white); color: var(--purple-deep); }
.text-link {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    color: var(--color-accent);
    font-weight: 800;
    text-decoration: none;
}
.text-link span { transition: transform 180ms ease; }
.text-link:hover { color: var(--color-accent-hover); }
.text-link:hover span { transform: translateX(0.3rem); }
.text-link--light { color: var(--white); }
.text-link--light:hover { color: var(--white); text-decoration: underline; }
.link-button, .text-button {
    padding: 0;
    border: 0;
    background: none;
    color: inherit;
    text-align: left;
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

/* Header and navigation */
.site-strip { position: relative; z-index: 110; background: var(--purple-deep); color: var(--white); font-size: 0.78rem; }
.site-strip__inner { display: flex; min-height: 1.65rem; align-items: center; justify-content: space-between; gap: 1rem; }
.site-strip a { color: var(--white); font-weight: 700; text-decoration: none; }
.site-header { position: sticky; z-index: 100; top: 0; border-bottom: 1px solid rgba(39,19,48,.08); background: var(--white); box-shadow: none; transition: background 180ms ease, border-color 180ms ease, box-shadow 180ms ease; }
.site-header.is-scrolled { border-color: rgba(39,19,48,.14); background: rgba(255,255,255,.92); box-shadow: 0 8px 28px rgba(39,19,48,.07); backdrop-filter: blur(12px); }
.site-header__inner { position: relative; display: flex; min-height: 5.125rem; align-items: center; gap: clamp(.55rem, 1vw, .9rem); }
.brand { flex: 0 0 auto; line-height: 0; }
.brand img { display: block; width: auto; height: 3rem; max-width: none; object-fit: contain; object-position: left center; }
.desktop-navigation { flex: 1 1 auto; margin-left: .35rem; }
.desktop-navigation__list { display: flex; align-items: center; justify-content: center; gap: clamp(0.25rem, .75vw, .7rem); padding: 0; margin: 0; list-style: none; }
.desktop-navigation__list > li > a,
.nav-disclosure > summary {
    display: flex;
    min-height: 2.8rem;
    align-items: center;
    padding: 0.45rem 0.3rem;
    border: 0;
    color: var(--ink);
    font-size: 0.875rem;
    font-weight: 750;
    text-decoration: none;
    white-space: nowrap;
}
.desktop-navigation__list > li > a:hover,
.desktop-navigation__list > li > a[aria-current="page"],
.nav-disclosure > summary:hover,
.nav-disclosure > summary[aria-current="page"] { color: var(--purple); text-decoration: underline; text-decoration-color: var(--color-accent); text-decoration-thickness: .16em; text-underline-offset: .45em; }
.desktop-navigation__list > li > a[aria-current="page"] { text-decoration: underline; text-decoration-thickness: .16em; text-underline-offset: .45em; }
.nav-disclosure > summary { gap: 0.35rem; cursor: pointer; list-style: none; }
.nav-disclosure > summary::-webkit-details-marker { display: none; }
.nav-disclosure > summary::after { width: 0.4rem; height: 0.4rem; border-right: 1.5px solid; border-bottom: 1.5px solid; content: ""; transform: translateY(-0.12rem) rotate(45deg); transition: transform 160ms ease; }
.nav-disclosure[open] > summary::after { transform: translateY(0.12rem) rotate(225deg); }
.nav-disclosure[open] > summary { color: var(--purple); }
.mega-menu {
    position: absolute;
    z-index: 120;
    top: calc(100% - .2rem);
    left: 50%;
    display: grid;
    width: min(calc(100vw - 2 * var(--gutter)), 74rem);
    gap: 1rem;
    padding: 1.75rem;
    border: 1px solid var(--color-line);
    border-radius: .75rem;
    background: var(--color-white);
    box-shadow: 0 30px 80px rgba(39, 19, 48, .2);
    transform: translateX(-50%);
}
.mega-menu--groups-2 { grid-template-columns: minmax(15rem, 1.1fr) repeat(2, minmax(0, 1fr)); }
.mega-menu--groups-3 { grid-template-columns: minmax(15rem, 1.1fr) repeat(3, minmax(0, 1fr)); }
.mega-menu ul { padding: 0; margin: .75rem 0 0; list-style: none; }
.mega-menu__intro { padding: 1.25rem; border-radius: 0.75rem; background: var(--purple-deep); color: var(--white); }
.mega-menu__intro .eyebrow { color: var(--white); }
.mega-menu__intro strong { display: block; margin-bottom: 2.25rem; font-size: 1.4rem; line-height: 1.2; }
.mega-menu__intro a { display: inline-flex; align-items: center; gap: .55rem; color: var(--white); font-size: 0.875rem; font-weight: 800; text-decoration: none; }
.mega-menu__intro a:hover { color: var(--white); text-decoration: underline; }
.mega-menu__group { padding: 1rem 0.5rem; }
.mega-menu__heading { display: block; padding-inline: 0.7rem; color: var(--purple); font-size: 0.875rem; font-weight: 850; letter-spacing: 0.08em; text-transform: uppercase; }
.mega-menu__group li a { display: block; padding: .5rem .7rem; border-radius: .35rem; color: var(--ink); font-size: .88rem; line-height: 1.35; text-decoration: none; }
.mega-menu__group li a:hover,
.mega-menu__group li a:focus-visible { background: var(--mist); color: var(--purple); }
.mega-menu a[aria-current="page"] { background: var(--mist); color: var(--purple); font-weight: 850; text-decoration: underline; text-decoration-thickness: .14em; text-underline-offset: .25em; }
.site-header__actions { flex: 0 0 auto; display: flex; flex-direction: row; align-items: center; justify-content: flex-end; gap: .8rem; }
.site-header__phone { display: inline-flex; align-items: center; width: auto; color: var(--purple); font-size: 1rem; font-weight: 900; line-height: 1.1; text-align: left; text-decoration: none; white-space: nowrap; }
.site-header__phone:hover { color: var(--magenta); }
.site-header__cta { flex: 0 0 auto; min-height: 2.5rem; padding: .62rem 1rem; border-radius: .4rem; font-size: .84rem; }

.site-header .site-header__cta { border-color: var(--magenta); background: var(--magenta); color: var(--white); }
.mobile-navigation__contact .button { border-color: var(--purple); background: var(--purple); color: var(--white); }
.site-header .site-header__cta:hover { border-color: var(--purple); background: var(--purple); color: var(--white); }
.mobile-navigation__contact .button:hover { border-color: var(--magenta); background: var(--magenta); color: var(--white); }
.mobile-navigation__contact .button { border-radius: 100vmax; }
.menu-toggle { display: none; min-width: 3.25rem; min-height: 3.25rem; align-items: center; gap: 0.6rem; padding: 0.5rem; border: 0; background: transparent; color: var(--ink); font-size: 0.875rem; font-weight: 800; }
.menu-toggle__icon { display: grid; width: 1.45rem; gap: 0.28rem; }
.menu-toggle__icon span { display: block; width: 100%; height: 2px; background: currentColor; }
.mobile-navigation { position: fixed; z-index: 1001; top: 0; right: 0; display: none; width: min(94vw, 35rem); height: 100dvh; padding: 1.4rem clamp(1.25rem, 5vw, 2.5rem) 2rem; overflow-y: auto; background: var(--paper); box-shadow: -20px 0 60px rgba(39,19,48,.25); }
.mobile-navigation__top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1rem; }
.icon-button { display: grid; width: 3rem; height: 3rem; place-items: center; border: 1px solid var(--line); border-radius: 50%; background: var(--white); font-size: 2rem; line-height: 1; }
.mobile-navigation ul { padding: 0; margin: 0; list-style: none; }
.mobile-navigation__primary > li { border-bottom: 1px solid var(--line); }
.mobile-navigation__primary > li > a, .mobile-navigation details > summary { display: flex; width: 100%; min-height: 3.9rem; align-items: center; justify-content: space-between; color: var(--ink); font-size: 1.15rem; font-weight: 800; list-style: none; text-decoration: none; }
.mobile-navigation details > summary::-webkit-details-marker { display: none; }
.mobile-navigation details > summary::after { content: "+"; font-size: 1.35rem; font-weight: 400; }
.mobile-navigation details[open] > summary::after { content: "−"; }
.mobile-navigation details ul { padding: 0.25rem 0 1rem 1rem; }
.mobile-navigation details li a { display: block; padding: 0.45rem 0; color: var(--ink-soft); font-size: 0.9rem; text-decoration: none; }
.mobile-navigation__overview { display: inline-block; margin: 0 0 0.65rem 1rem; color: var(--purple); font-weight: 800; }
.mobile-navigation__group { display: block; margin: 0.9rem 0 0.1rem 1rem; color: var(--purple); font-size: 0.875rem; font-weight: 850; letter-spacing: 0.08em; text-transform: uppercase; }
.mobile-navigation [aria-current="page"] { text-decoration: underline; text-decoration-thickness: .16em; text-underline-offset: .35em; }
.mobile-navigation__contact { display: grid; gap: 0.8rem; padding-top: 2rem; }
.mobile-navigation__contact > a:not(.button) { color: var(--ink); font-weight: 700; }
.menu-scrim { position: fixed; z-index: 1000; inset: 0; width: 100%; height: 100%; border: 0; background: rgba(29, 29, 27, 0.6); backdrop-filter: blur(3px); }

/* Shared page structures */
.breadcrumbs { padding-block: 1rem; font-size: 0.875rem; }
.breadcrumbs ol { display: flex; flex-wrap: wrap; gap: 0.4rem; padding: 0; margin: 0; list-style: none; }
.breadcrumbs li { display: flex; gap: 0.4rem; color: var(--ink-soft); }
.breadcrumbs a { color: var(--ink-soft); text-decoration: none; }
.page-hero { position: relative; overflow: hidden; padding: clamp(3rem, 7vw, 6.75rem) 0 clamp(4rem, 8vw, 7rem); border-bottom: 1px solid var(--line); background: linear-gradient(115deg, var(--mist), var(--paper) 62%); }
.page-hero::before { position: absolute; top: 0; right: 8%; width: 7rem; height: .3rem; background: var(--magenta); content: ""; }
.page-hero__grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(18rem, .85fr); align-items: center; gap: clamp(2.5rem, 7vw, 7rem); }
.page-hero__copy { position: relative; z-index: 1; max-width: 50rem; }
.page-hero__copy h1 { font-size: clamp(2.7rem, 5.1vw, 5.2rem); }
.page-hero__copy > p { max-width: 44rem; color: var(--ink-soft); font-size: clamp(1.08rem, 1.8vw, 1.3rem); line-height: 1.6; }
.page-hero__image { position: relative; margin: 0; }
.page-hero__image::before { position: absolute; z-index: -1; inset: .8rem -.8rem -.8rem .8rem; border-radius: .7rem; background: var(--magenta); content: ""; }
.page-hero__image img { width: 100%; aspect-ratio: 4 / 3; border-radius: .7rem; box-shadow: var(--shadow-lg); object-fit: cover; }
.page-hero__image > span { display: none; }
.page-hero__graphic { position: relative; display: grid; min-height: 24rem; place-items: center; border-radius: .7rem; background: linear-gradient(145deg, var(--purple), var(--purple-deep)); color: var(--white); box-shadow: var(--shadow-lg); overflow: hidden; }
.page-hero__graphic::before { position: absolute; inset: 1.25rem; border: 1px solid rgba(255,255,255,.28); border-radius: .35rem; content: ""; }
.page-hero__graphic span { font-size: clamp(6rem, 14vw, 11rem); font-weight: 850; letter-spacing: -.11em; line-height: 1; opacity: .17; }
.page-hero__graphic i { position: absolute; width: .8rem; height: .8rem; border-radius: .12rem; background: var(--magenta); }
.page-hero__graphic i:nth-child(2) { top: 20%; left: 22%; }
.page-hero__graphic i:nth-child(3) { right: 18%; bottom: 28%; width: 1.3rem; height: 1.3rem; }
.page-hero__graphic i:nth-child(4) { right: 32%; top: 22%; width: .45rem; height: .45rem; }
.content-section { padding: var(--space-section) 0; }
.content-section--tint { background: var(--mist); }
.content-section--quote_details { background: var(--purple-deep); color: var(--white); }
.content-section__inner { display: grid; grid-template-columns: minmax(14rem, .7fr) minmax(0, 1.3fr); gap: clamp(2rem, 8vw, 8rem); }
.content-section__heading { position: relative; align-self: start; }
.content-section__heading h2 { font-size: clamp(2rem, 3.6vw, 3.25rem); }
.content-section__heading::after { display: block; width: 4rem; height: .3rem; margin-top: 1.5rem; background: var(--magenta); content: ""; }
.content-section__body { min-width: 0; }
.content-section__body > p { max-width: 48rem; color: var(--ink-soft); font-size: 1.06rem; }
.content-section__body > p:first-child { color: var(--ink); font-size: clamp(1.13rem, 1.8vw, 1.3rem); }
.content-section--quote_details h2, .content-section--quote_details p { color: var(--white); }
.content-section--quote_details .content-section__heading::after { background: var(--magenta); }
.content-items { display: grid; gap: 1rem; margin-top: 2.25rem; }
.content-items--grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.content-card { position: relative; min-height: 100%; padding: 1.6rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--white); }
.content-card h3 { margin-bottom: .65rem; }
.content-card p { margin: 0; color: var(--ink-soft); font-size: .95rem; }
.content-card--link { padding-right: 3.5rem; color: var(--ink); text-decoration: none; transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease; }
.content-card--link:hover { border-color: var(--purple); box-shadow: var(--shadow-sm); color: var(--ink); transform: translateY(-4px); }
.content-card__arrow { position: absolute; top: 1.35rem; right: 1.35rem; display: grid; width: 2rem; height: 2rem; place-items: center; border-radius: 50%; background: var(--mist); color: var(--purple); }
.content-list-item { display: grid; grid-template-columns: 1.1rem 1fr; gap: .8rem; align-items: start; padding: 1rem 0; border-bottom: 1px solid var(--line); }
.content-list-item > span { width: .55rem; height: .55rem; margin-top: .52rem; border: 2px solid var(--magenta); border-radius: 50%; }
.content-list-item p { margin: 0; }
.content-section__actions { display: flex; flex-wrap: wrap; gap: 1.25rem; margin-top: 2rem; }
.faq-section { padding: var(--space-section) 0; background: var(--white); }
.faq-section__grid { display: grid; grid-template-columns: minmax(15rem, .65fr) minmax(0, 1.35fr); gap: clamp(2rem, 8vw, 8rem); }
.faq-section__intro { align-self: start; }
.faq-section__intro h2 { font-size: clamp(2rem, 3.5vw, 3.25rem); }
.faq-section__intro p { color: var(--ink-soft); }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-item:first-child { border-top: 1px solid var(--line); }
.faq-item summary { display: grid; min-height: 4.75rem; grid-template-columns: 1fr 2.25rem; gap: 1rem; align-items: center; padding: 1rem 0; color: var(--ink); cursor: pointer; font-size: 1.08rem; font-weight: 750; list-style: none; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item__icon { position: relative; display: grid; width: 2.1rem; height: 2.1rem; place-items: center; border: 1px solid var(--line); border-radius: 50%; }
.faq-item__icon::before, .faq-item__icon::after { position: absolute; width: .8rem; height: 1.5px; background: var(--purple); content: ""; transition: transform 160ms ease; }
.faq-item__icon::after { transform: rotate(90deg); }
.faq-item[open] .faq-item__icon::after { transform: rotate(0); }
.faq-item__answer { max-width: 47rem; padding: 0 3rem 1.5rem 0; color: var(--ink-soft); }
.related-links { padding: clamp(3.5rem, 7vw, 6rem) 0; background: var(--mist); }
.related-links h2 { font-size: clamp(1.8rem, 3vw, 2.8rem); }
.related-links ul { display: grid; grid-template-columns: repeat(3, 1fr); gap: .8rem; padding: 0; margin: 2rem 0 0; list-style: none; }
.related-links a { display: flex; min-height: 5.2rem; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.1rem 1.25rem; border: 1px solid var(--line); border-radius: .7rem; background: var(--white); color: var(--ink); font-weight: 750; text-decoration: none; }
.related-links a:hover { border-color: var(--purple); color: var(--purple); }
.final-cta { position: relative; overflow: hidden; padding: clamp(4rem, 8vw, 7rem) 0; background: var(--color-accent); color: var(--color-white); }
.final-cta::before, .final-cta::after { content: none; }
.final-cta__inner { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(16rem, .75fr); align-items: center; gap: 3rem; }
.final-cta h2 { max-width: 50rem; color: var(--white); font-size: clamp(2.2rem, 4.8vw, 4.6rem); }
.final-cta p { max-width: 44rem; color: var(--color-white); font-size: 1.05rem; }
.final-cta .eyebrow { color: var(--white); }
.final-cta__actions { display: grid; justify-items: start; gap: 1rem; }
.final-cta__actions a:not(.button) { color: var(--white); font-weight: 750; }
.home-sectors :focus-visible, .final-cta :focus-visible, .site-footer :focus-visible, .content-section--quote_details :focus-visible { outline: none; box-shadow: 0 0 0 2px var(--color-aubergine), 0 0 0 5px var(--color-white); }
.review-notice { padding: var(--space-section) 0; }
.review-notice__inner { max-width: 50rem; padding: clamp(2rem, 5vw, 4rem); border-left: .5rem solid var(--magenta); background: var(--mist); }

/* Homepage */
.home-hero { position: relative; min-height: calc(100svh - 5.125rem); overflow: hidden; overflow: clip; border-bottom: 1px solid rgba(39,19,48,.1); background: var(--white); color: var(--ink); }
.home-hero__inner { display: grid; min-height: calc(100svh - 5.125rem); grid-template-rows: auto minmax(0, 1fr); padding-top: clamp(2.1rem, 4.2vh, 3.5rem); }
.home-hero__copy { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(20rem, .75fr); gap: clamp(2.5rem, 6vw, 6.3rem); align-items: start; }
.home-hero__headline { max-width: 47rem; }
.home-hero .eyebrow { margin-bottom: .9rem; color: var(--purple); font-size: .76rem; letter-spacing: .135em; }
.home-hero h1 { max-width: 11.5em; margin: 0; color: var(--ink); font-size: clamp(3.15rem, 3.5vw, 3.6rem); font-weight: 720; letter-spacing: -.052em; line-height: .99; text-wrap: pretty; }
.home-hero h1 span { display: block; }
.home-hero__details { max-width: 27rem; padding-top: 1.9rem; }
.home-hero__summary { margin: 0; color: var(--ink); font-size: 1.05rem; line-height: 1.55; }
.home-hero__location { margin: .8rem 0 0; color: var(--purple); font-size: .84rem; font-weight: 800; line-height: 1.45; }
.home-hero .button-row { margin-top: 1.3rem; }
.home-hero .button { min-height: 3rem; padding: .72rem 1.2rem; border-radius: .42rem; }
.home-hero .button { border-color: var(--purple); background: var(--purple); color: var(--white); }
.home-hero .button:hover, .home-hero .button:active { border-color: var(--magenta); background: var(--magenta); color: var(--white); }
.home-hero .button--outline { border-color: var(--purple); background: transparent; color: var(--purple); }
.home-hero .button--outline:hover, .home-hero .button--outline:active { border-color: var(--magenta); background: var(--magenta); color: var(--white); }
.home-hero__media { position: relative; min-width: 0; align-self: end; width: min(76vw, 84rem); margin: -2rem 0 0 50%; background: var(--white); transform: translateX(-50%); }
.home-hero__media picture, .home-hero__media img { display: block; width: 100%; }
.home-hero__media img { height: auto; aspect-ratio: 2 / 1; background: var(--white); object-fit: contain; }
.pfs-icon { display: block; width: 3rem; height: 3rem; overflow: visible; }
.pfs-icon path { vector-effect: non-scaling-stroke; }
.home-capabilities { border-bottom: 1px solid rgba(255,255,255,.2); background: var(--color-aubergine); }
.home-capabilities__grid { display: grid; grid-template-columns: repeat(4, 1fr); padding: 0; margin-block: 0; list-style: none; }
.home-capability { min-width: 0; border-right: 1px solid rgba(255,255,255,.2); }
.home-capability:last-child { border-right: 0; }
.home-capability > a { display: grid; min-height: 7.2rem; grid-template-columns: 3rem 1fr auto; gap: .9rem; align-items: center; padding: 1.3rem 1.5rem; color: var(--color-white); text-decoration: none; transition: background 180ms ease; }
.home-capability > a:hover { background: var(--color-accent); color: var(--color-white); }
.home-capability__icon { width: 3rem; height: 3rem; color: var(--color-white); }
.home-capability strong { color: var(--color-white); font-size: 1rem; letter-spacing: .015em; line-height: 1.3; }
.home-capability > a > span { color: rgba(255,255,255,.8); font-size: 1.1rem; }
.home-introduction .eyebrow, .home-services .eyebrow, .home-buzz .eyebrow, .home-why .eyebrow, .home-method .eyebrow, .home-coverage .eyebrow, .page--home .faq-section .eyebrow, .home-work .eyebrow { color: var(--color-accent); }
.home-sectors .eyebrow, .final-cta .eyebrow { color: var(--color-white); }
.home-introduction { padding: clamp(4.5rem, 7vw, 6.5rem) 0; background: var(--color-warm-white); }
.home-introduction__grid { display: grid; grid-template-columns: .9fr 1.1fr; align-items: start; gap: clamp(2.5rem, 7vw, 7rem); }
.home-introduction__statement { max-width: 38rem; margin: 0; font-size: clamp(2.2rem, 3.8vw, 3.65rem); font-weight: 650; letter-spacing: -.04em; line-height: 1.1; }
.home-introduction__copy p { max-width: 44rem; color: var(--color-text-muted); }
.home-introduction__copy p:first-child { color: var(--color-charcoal); font-size: 1.08rem; }
.home-section-heading { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(18rem, .9fr); align-items: end; gap: 3rem; margin-bottom: 2.6rem; }
.home-section-heading h2 { max-width: 48rem; font-size: clamp(2.4rem, 4vw, 3.8rem); }
.home-section-heading > p { max-width: 38rem; margin-bottom: .45rem; color: var(--color-text-muted); }
.home-services { padding: var(--space-section) 0; border-top: 1px solid var(--color-line); background: var(--color-stone); }
.home-services__primary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: 1fr; gap: 1rem; margin-bottom: 2rem; }
.service-feature { position: relative; display: grid; min-width: 0; grid-template-columns: 2.2rem minmax(0, 1fr) 2.2rem; grid-template-rows: auto 1fr; gap: .7rem; align-items: start; padding: .7rem .7rem 1.4rem; border: 1px solid var(--color-line); border-radius: .6rem; background: var(--color-white); color: var(--color-charcoal); text-decoration: none; transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease; }
.service-feature:hover { border-color: var(--color-accent); box-shadow: 0 10px 30px rgba(39,19,48,.1); color: var(--color-charcoal); transform: translateY(-3px); }
.service-feature figure { width: 100%; aspect-ratio: 16 / 8.75; grid-column: 1 / -1; margin: 0 0 .55rem; overflow: hidden; border-radius: .35rem; background: #e8e1e7; }
.service-feature figure > picture { display: block; height: 100%; }
.service-feature img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 450ms cubic-bezier(.2,.7,.2,1); }
.service-feature__media-empty { display: block; width: 100%; height: 100%; background: #e8e1e7; }
.service-feature__media .proofing-placeholder { width: 100%; height: 100%; min-height: 0; }
.service-feature:hover img { transform: scale(1.025); }
.service-feature__number { padding-top: .15rem; color: var(--color-accent); font-size: .78rem; font-weight: 850; }
.service-feature h3 { margin-bottom: .55rem; font-size: 1.25rem; }
.service-feature p { margin: 0; color: var(--color-text-muted); font-size: .9rem; }
.service-feature__arrow { display: grid; width: 2rem; height: 2rem; place-items: center; border: 1px solid var(--color-line); border-radius: .25rem; color: var(--color-accent); }
.home-sectors { padding: var(--space-section) 0; background: var(--color-aubergine); color: var(--color-white); }
.home-sectors__grid { display: grid; grid-template-columns: minmax(18rem, .8fr) minmax(0, 1.2fr); gap: clamp(3rem, 8vw, 8rem); align-items: start; }
.home-sectors h2 { color: var(--color-white); font-size: clamp(2.4rem, 4vw, 3.75rem); }
.home-sectors__intro p { max-width: 37rem; color: rgba(255,255,255,.75); }
.home-sectors__intro .text-link { margin-top: .7rem; }
.home-sectors__list { display: grid; grid-auto-flow: column; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(7, minmax(5.5rem, auto)); gap: 0 2rem; padding: 0; margin: 0; list-style: none; }
.home-sectors__list li { display: grid; min-height: 5.5rem; grid-template-columns: 2.1rem minmax(0, 1fr); gap: .65rem; align-items: center; border-top: 1px solid rgba(255,255,255,.24); }
.home-sectors__list li:nth-child(7), .home-sectors__list li:last-child { border-bottom: 1px solid rgba(255,255,255,.24); }
.home-sectors__list span { color: rgba(255,255,255,.72); font-size: .75rem; font-weight: 850; }
.home-sectors__list a { display: flex; min-height: 5.5rem; align-items: center; color: var(--color-white); text-decoration: none; }
.home-sectors__list a:hover { color: var(--color-white); text-decoration: underline; text-decoration-color: var(--color-accent); text-underline-offset: .25em; }
.home-sectors__list strong { color: var(--color-white); font-size: 1rem; line-height: 1.35; }
.home-buzz { padding: var(--space-section) 0; border-bottom: 1px solid var(--color-line); background: var(--color-white); }
.home-buzz__inner { display: grid; grid-template-columns: minmax(17rem, .76fr) minmax(0, 1.24fr); gap: clamp(2.5rem, 7vw, 7rem); align-items: center; }
.home-buzz__inner--single { grid-template-columns: minmax(0, 46rem); }
.home-buzz__copy h2 { max-width: 38rem; font-size: clamp(2.35rem, 3.8vw, 3.65rem); }
.home-buzz__copy p { max-width: 38rem; color: var(--color-text-muted); }
.home-buzz__copy p:first-of-type { color: var(--color-charcoal); font-size: 1.06rem; }
.home-buzz__media { margin: 0; }
.home-buzz__media img { display: block; width: 100%; aspect-ratio: 16 / 9; border: 1px solid var(--color-line); border-radius: .55rem; object-fit: cover; object-position: center; }
.home-buzz__media figcaption { margin-top: .65rem; color: var(--color-text-muted); font-size: .8rem; }
.home-work { padding: var(--space-section) 0; border-top: 1px solid var(--color-line); background: var(--color-white); color: var(--color-charcoal); }
.home-work__header { display: grid; grid-template-columns: 1.2fr .8fr; align-items: end; gap: 3rem; margin-bottom: 2.5rem; }
.home-work h2 { font-size: clamp(2.4rem, 4vw, 3.8rem); }
.home-work__header > p { color: var(--color-text-muted); }
.home-work__grid { display: grid; grid-template-columns: 1.5fr 1fr; grid-template-rows: repeat(2, minmax(14rem, 1fr)); gap: 1rem; margin-bottom: 2rem; }
.work-tile { position: relative; min-height: 18rem; overflow: hidden; border-radius: .6rem; color: var(--white); }
.work-tile--large { grid-row: 1 / 3; }
.work-tile img { width: 100%; height: 100%; object-fit: cover; transition: transform 500ms cubic-bezier(.2,.7,.2,1); }
.work-tile::after { position: absolute; inset: 30% 0 0; background: linear-gradient(transparent, rgba(29,29,27,.87)); content: ""; }
.work-tile > span { position: absolute; z-index: 1; right: 1.3rem; bottom: 1.2rem; left: 1.3rem; display: grid; grid-template-columns: 1fr auto; align-items: end; font-size: 1.05rem; font-weight: 800; }
.work-tile small { grid-column: 1 / -1; margin-bottom: .25rem; color: rgba(255,255,255,.75); font-size: .875rem; letter-spacing: .1em; text-transform: uppercase; }
.work-tile:hover { color: var(--white); }
.work-tile:hover img { transform: scale(1.04); }
.home-work .home-editorial-grid { margin-bottom: 2rem; }
.home-editorial-card { display: flex; flex-direction: column; }
.home-editorial-card .article-card__body { display: flex; flex: 1; flex-direction: column; }
.home-editorial-card .article-card__body > .text-link { margin-top: auto; }
.home-work .article-card h3 { font-size: 1.45rem; }
.home-work .article-card h3 a { color: var(--color-charcoal); text-decoration: none; }
.home-editorial-more { margin-top: .25rem; }
.home-why { padding: var(--space-section) 0; border-top: 1px solid var(--color-line); background: var(--color-stone); }
.home-why__inner { display: grid; grid-template-columns: minmax(20rem, .78fr) minmax(0, 1.22fr); align-items: start; gap: clamp(3rem, 8vw, 8rem); }
.home-why__inner--single { grid-template-columns: minmax(0, 1fr); }
.home-why figure { margin: 0; }
.home-why figure img { display: block; width: 100%; max-height: 45rem; aspect-ratio: 4 / 5; border-left: .35rem solid var(--color-accent); border-radius: .6rem; object-fit: cover; object-position: center 40%; }
.home-why figcaption { padding: .85rem 0 0 .35rem; color: var(--color-text-muted); font-size: .78rem; font-weight: 750; }
.home-why h2 { max-width: 45rem; font-size: clamp(2.3rem, 3.8vw, 3.6rem); }
.home-why__reasons { margin: 2rem 0 1.8rem; border-bottom: 1px solid var(--color-line); }
.home-why__reasons article { display: grid; grid-template-columns: 3rem 1fr; gap: 1rem; padding: 1.2rem 0; border-top: 1px solid var(--color-line); }
.home-reason__icon { width: 2.5rem; height: 2.5rem; margin-top: .05rem; color: var(--color-accent); }
.home-why__reasons h3 { margin-bottom: .35rem; font-size: 1.05rem; }
.home-why__reasons p { max-width: 40rem; margin: 0; color: var(--color-text-muted); font-size: .9rem; }
.home-method { padding: var(--space-section) 0; background: var(--color-warm-white); }
.home-method__header { display: grid; max-width: 55rem; margin-bottom: 2.7rem; }
.home-method__header h2 { font-size: clamp(2.4rem, 4vw, 3.8rem); }
.home-method__steps { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1rem; padding: 0; margin: 0 0 2rem; list-style: none; }
.home-method__steps li { padding: 1.25rem 1rem 1.4rem; border: 1px solid var(--color-line); border-top: .3rem solid var(--color-aubergine); background: var(--color-white); }
.home-method__step-mark { display: flex; min-height: 2.75rem; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: 1.15rem; }
.home-method__step-mark span { color: var(--color-aubergine); font-size: .75rem; font-weight: 850; }
.home-method__icon { width: 2.5rem; height: 2.5rem; color: var(--color-accent); }
.home-method__steps h3 { min-height: 2.6em; margin-bottom: .7rem; font-size: 1rem; }
.home-method__steps p { margin: 0; color: var(--color-text-muted); font-size: .84rem; }
.home-coverage { padding: clamp(4.5rem, 7vw, 6.5rem) 0; border-top: 1px solid var(--color-line); background: var(--color-white); }
.home-coverage__inner { display: grid; grid-template-columns: minmax(18rem, .8fr) minmax(0, 1.2fr); gap: clamp(2.5rem, 8vw, 8rem); align-items: start; }
.home-coverage h2 { max-width: 41rem; font-size: clamp(2.3rem, 3.7vw, 3.5rem); }
.home-coverage__copy { padding-top: .25rem; }
.home-coverage__copy p { max-width: 47rem; color: var(--color-text-muted); }
.home-coverage__copy p:first-child { color: var(--color-charcoal); font-size: 1.08rem; }
.page--home .faq-section { border-top: 1px solid var(--color-line); background: var(--color-warm-white); }
.page--home .faq-item { border-color: var(--color-line); }
.page--home .faq-item summary { color: var(--color-charcoal); }
.page--home .faq-item__icon { border-color: var(--color-line); }
.page--home .faq-item__icon::before, .page--home .faq-item__icon::after { background: var(--color-accent); }
.page--home .faq-item__answer { color: var(--color-text-muted); }

/* Contact and forms */
.contact-hero { padding: clamp(4rem, 8vw, 7rem) 0; background: var(--purple-deep); color: var(--white); }
.contact-hero__grid { display: grid; grid-template-columns: 1.25fr .75fr; align-items: end; gap: clamp(3rem, 8vw, 8rem); }
.contact-hero h1 { color: var(--white); }
.contact-hero p { max-width: 47rem; color: rgba(255,255,255,.82); font-size: 1.15rem; }
.contact-hero .eyebrow { color: var(--white); }
.contact-hero__details { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin: 0; background: var(--line-dark); }
.contact-hero__details > div { padding: 1.1rem; background: var(--purple-deep); }
.contact-hero__details dt { margin-bottom: .25rem; color: rgba(255,255,255,.72); font-size: .875rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.contact-hero__details dd { margin: 0; color: var(--white); font-size: .9rem; font-weight: 700; }
.contact-hero__details a { color: var(--white); }
.enquiry-section { padding: var(--space-section) 0; }
.enquiry-section__grid { display: grid; grid-template-columns: minmax(17rem, .65fr) minmax(0, 1.35fr); gap: clamp(2.5rem, 7vw, 7rem); align-items: start; }
.enquiry-aside { position: sticky; top: 8rem; }
.enquiry-aside h2 { font-size: clamp(2rem, 3.5vw, 3.15rem); }
.enquiry-aside > p { color: var(--ink-soft); }
.enquiry-aside ol { padding: 0; margin: 2rem 0; list-style: none; }
.enquiry-aside li { display: grid; grid-template-columns: 2.2rem 1fr; gap: .8rem; padding: .75rem 0; border-bottom: 1px solid var(--line); }
.enquiry-aside li span { color: var(--magenta-dark); font-size: .875rem; font-weight: 850; }
.enquiry-aside li p { margin: 0; font-size: .9rem; }
.enquiry-aside__note { padding: 1.2rem; border-radius: var(--radius); background: var(--mist); }
.enquiry-aside__note p { margin: .35rem 0 0; color: var(--ink-soft); font-size: .875rem; }
.form-panel { padding: clamp(1.4rem, 4vw, 3rem); border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--white); box-shadow: var(--shadow-sm); }
.enquiry-form { position: relative; }
.form-grid { display: grid; gap: 1rem; }
.form-grid--two { grid-template-columns: 1fr 1fr; }
.form-field { margin-bottom: 1.25rem; }
.form-field label, .form-field__label-row label { display: block; margin-bottom: .45rem; font-size: .875rem; font-weight: 800; }
.form-field input, .form-field select, .form-field textarea, .search-form input, .compact-search input {
    width: 100%;
    min-height: 3.25rem;
    padding: .75rem .9rem;
    border: 2px solid #756e77;
    border-radius: .45rem;
    background: var(--paper);
    transition: border-color 150ms ease, box-shadow 150ms ease;
}
.form-field textarea { min-height: 12rem; resize: vertical; }
.form-field input:focus, .form-field select:focus, .form-field textarea:focus, .search-form input:focus, .compact-search input:focus { border-color: var(--purple); box-shadow: 0 0 0 3px var(--white), 0 0 0 6px var(--purple-deep); outline: 3px solid var(--focus); outline-offset: 2px; }
.form-field--error input, .form-field--error select, .form-field--error textarea, [aria-invalid="true"] { border-color: var(--danger); }
.field-error { margin: .4rem 0 0; color: var(--danger); font-size: .875rem; font-weight: 750; }
.field-hint { margin: .45rem 0 0; color: var(--ink-soft); font-size: .875rem; }
.form-field__label-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.form-field__label-row > span { color: var(--ink-soft); font-size: .875rem; }
.form-field--trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form-consents { display: grid; gap: .8rem; padding: 1.2rem; border-radius: .75rem; background: var(--mist); }
.check-field { display: grid; grid-template-columns: 1.2rem 1fr; gap: .75rem; align-items: start; font-size: .875rem; }
.check-field input { width: 1.15rem; height: 1.15rem; margin-top: .2rem; accent-color: var(--purple); }
.check-field a { font-weight: 700; }
.form-submit { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; margin-top: 1.5rem; }
.form-submit p { max-width: 22rem; margin: 0; color: var(--ink-soft); font-size: .875rem; }
.alert, .error-summary { padding: 1.25rem; margin-bottom: 1.5rem; border-left: .35rem solid var(--danger); background: #fff2f4; }
.alert h2, .error-summary h2 { margin-bottom: .35rem; font-size: 1.25rem; }
.alert p, .error-summary p { margin-bottom: .6rem; }
.error-summary ul { margin: 0; }

/* Search */
.search-hero { padding: clamp(4rem, 8vw, 7rem) 0; background: var(--mist); }
.search-hero__inner { max-width: 60rem; }
.search-hero p { color: var(--ink-soft); font-size: 1.15rem; }
.search-form { margin-top: 2.2rem; }
.search-form label, .compact-search label { display: block; margin-bottom: .55rem; font-size: .875rem; font-weight: 800; }
.search-form > div, .compact-search > div { display: grid; grid-template-columns: 1fr auto; gap: .65rem; }
.search-form input { min-height: 3.6rem; background: var(--white); font-size: 1.05rem; }
.search-results { min-height: 30rem; padding: var(--space-section) 0; }
.search-results__header { display: flex; align-items: end; justify-content: space-between; gap: 2rem; padding-bottom: 1.5rem; border-bottom: 1px solid var(--line); }
.search-results__header h2 { margin: 0; }
.search-results__header p { margin: 0; color: var(--ink-soft); }
.search-results__list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; padding: 0; margin: 2rem 0 0; list-style: none; }
.search-results__list > li > a { display: block; min-height: 100%; padding: 1.7rem; border: 1px solid var(--line); border-radius: var(--radius); color: var(--ink); text-decoration: none; transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease; }
.search-results__list > li > a:hover { border-color: var(--purple); box-shadow: var(--shadow-sm); transform: translateY(-4px); }
.search-results__list h3 { margin-bottom: .65rem; }
.search-results__list p { color: var(--ink-soft); }
.search-results__list .eyebrow { margin-bottom: .75rem; }
.empty-state { max-width: 50rem; padding: clamp(2rem, 6vw, 5rem); margin-inline: auto; border-radius: var(--radius-lg); background: var(--mist); text-align: center; }
.empty-state__mark { display: grid; width: 5rem; height: 5rem; place-items: center; margin: 0 auto 1.5rem; border-radius: 50%; background: var(--purple); color: var(--white); font-weight: 850; }
.empty-state .button-row { justify-content: center; }
.search-starts h2 { margin-bottom: 1.5rem; }
.search-starts__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.search-starts__grid a { display: grid; min-height: 13rem; align-content: space-between; padding: 1.5rem; border: 1px solid var(--line); border-radius: var(--radius); color: var(--ink); text-decoration: none; }
.search-starts__grid a:hover { border-color: var(--purple); box-shadow: var(--shadow-sm); }
.search-starts__grid span { color: var(--magenta-dark); font-size: .875rem; font-weight: 850; }
.search-starts__grid strong { font-size: 1.35rem; line-height: 1.2; }
.search-starts__grid small { color: var(--ink-soft); }

/* Article archive and article */
.archive-hero { padding: clamp(4rem, 8vw, 7.5rem) 0; background: var(--purple-deep); color: var(--white); }
.archive-hero__inner { max-width: 62rem; }
.archive-hero h1 { color: var(--white); }
.archive-hero p { max-width: 48rem; color: rgba(255,255,255,.8); font-size: 1.2rem; }
.archive-hero .eyebrow { color: var(--white); }
.archive-filters { position: sticky; z-index: 30; top: 5.125rem; border-bottom: 1px solid var(--line); background: rgba(255,253,251,.96); backdrop-filter: blur(12px); }
.archive-filters--legacy { position: static; border-top: 1px solid var(--line); background: var(--mist); backdrop-filter: none; }
.archive-filters__inner { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem 1.5rem; padding-block: .75rem; }
.archive-filters__inner > span { flex: 0 0 auto; color: var(--ink-soft); font-size: .875rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.archive-filters ul { display: flex; flex: 1 1 34rem; flex-wrap: wrap; gap: .25rem; padding: 0; margin: 0; list-style: none; }
.archive-filters a { display: block; padding: .5rem .8rem; border-radius: 100vmax; color: var(--ink); font-size: .875rem; font-weight: 750; text-decoration: none; }
.archive-filters a:hover, .archive-filters a[aria-current="page"] { background: var(--purple); color: var(--white); }
.archive-filters a[aria-current="page"] { text-decoration: underline; text-decoration-thickness: .14em; text-underline-offset: .2em; }
.archive-content { min-height: 30rem; padding: var(--space-section) 0; }
.article-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1rem, 2.5vw, 2rem); padding: 0; margin: 0; list-style: none; }
.article-card { height: 100%; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: var(--white); transition: transform 180ms ease, box-shadow 180ms ease; }
.article-card:hover { box-shadow: var(--shadow-sm); transform: translateY(-5px); }
.article-card__image { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: var(--mist); }
.article-card__image img { width: 100%; height: 100%; object-fit: cover; transition: transform 400ms ease; }
.article-card:hover .article-card__image img { transform: scale(1.035); }
.article-card__placeholder { display: grid; width: 100%; height: 100%; place-items: center; background: radial-gradient(circle at 65% 35%, var(--magenta), transparent 20%), var(--purple); color: var(--white); }
.article-card__placeholder i { font-size: 4rem; font-style: normal; font-weight: 850; letter-spacing: -.1em; opacity: .45; }
.article-card__body { padding: 1.4rem; }
.article-card__meta { display: flex; justify-content: space-between; gap: 1rem; margin-bottom: .8rem; color: var(--ink-soft); font-size: .875rem; font-weight: 750; letter-spacing: .05em; text-transform: uppercase; }
.article-card h2 { font-size: 1.45rem; }
.article-card h2 a { color: var(--ink); text-decoration: none; }
.article-card p { color: var(--ink-soft); font-size: .9rem; }
.article-card .text-link { font-size: .875rem; }
.pagination { display: flex; align-items: center; justify-content: center; gap: 1.5rem; padding-top: 3rem; }
.pagination a { font-weight: 750; }
.pagination span { color: var(--ink-soft); font-size: .875rem; }
.archive-cta { padding: clamp(3.5rem, 7vw, 6rem) 0; background: var(--purple); color: var(--white); }
.archive-cta__inner { display: flex; align-items: center; justify-content: space-between; gap: 3rem; }
.archive-cta h2 { color: var(--white); }
.archive-cta p { margin: 0; color: rgba(255,255,255,.8); }
.archive-cta .eyebrow { color: var(--white); }
.article-hero { padding: clamp(4rem, 8vw, 7rem) 0; background: var(--mist); }
.article-hero__inner { max-width: 66rem; }
.article-hero__meta { display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.article-hero__meta time { color: var(--ink-soft); font-size: .875rem; }
.article-hero h1 { font-size: clamp(2.8rem, 5.9vw, 5.7rem); }
.article-hero__summary { max-width: 52rem; color: var(--ink-soft); font-size: clamp(1.12rem, 2vw, 1.4rem); }
.article-byline { display: flex; flex-wrap: wrap; gap: .65rem 1.5rem; padding-top: 1rem; border-top: 1px solid var(--line); color: var(--ink-soft); font-size: .875rem; }
.article-tags { display: flex; flex-wrap: wrap; align-items: baseline; gap: .45rem .75rem; margin-top: 1rem; color: var(--ink-soft); font-size: .875rem; }
.article-tags > span { font-weight: 800; }
.article-tags ul { display: flex; flex-wrap: wrap; gap: .35rem; padding: 0; margin: 0; list-style: none; }
.article-tags li { padding: .2rem .65rem; border: 1px solid var(--line); border-radius: 100vmax; background: var(--paper); }
.article-feature { margin-top: clamp(-2rem, -3vw, -3.5rem); }
.article-feature img { width: 100%; max-height: 45rem; border-radius: var(--radius-lg); object-fit: cover; box-shadow: var(--shadow-lg); }
.article-feature figcaption, .article-image figcaption, .article-gallery figcaption, .before-after figcaption { margin-top: .6rem; color: var(--ink-soft); font-size: .875rem; }
.article-layout { display: grid; grid-template-columns: 12rem minmax(0, 48rem); justify-content: center; gap: clamp(2rem, 6vw, 6rem); padding-block: var(--space-section); }
.article-aside { position: sticky; top: 8rem; display: grid; align-self: start; gap: .6rem; }
.article-aside a { color: var(--ink-soft); font-size: .875rem; font-weight: 700; text-decoration: none; }
.article-content { min-width: 0; font-size: 1.05rem; }
.article-content > p, .article-content > ul, .article-content > ol { max-width: 45rem; }
.article-content > h2 { margin-top: 2.2em; font-size: clamp(1.8rem, 3vw, 2.8rem); }
.article-content > h3 { margin-top: 1.8em; }
.article-content li { margin-bottom: .55rem; }
.article-lead { font-size: 1.25rem; }
.article-image, .article-gallery, .before-after { margin: 2.5rem 0; }
.article-image img { width: 100%; border-radius: var(--radius); }
.article-gallery { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
.article-gallery--grid { grid-template-columns: repeat(3, 1fr); }
.article-gallery figure, .before-after figure { margin: 0; }
.article-gallery img, .before-after img { width: 100%; height: 100%; max-height: 28rem; border-radius: .7rem; object-fit: cover; }
.before-after { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.before-after figure { position: relative; }
.before-after figure > span { position: absolute; top: .7rem; left: .7rem; z-index: 1; padding: .3rem .65rem; border-radius: 100vmax; background: var(--white); color: var(--ink); font-size: .875rem; font-weight: 850; text-transform: uppercase; }
.article-quote { padding: 2rem 0 2rem 2rem; margin: 2.5rem 0; border-left: .4rem solid var(--magenta); }
.article-quote p { margin: 0; color: var(--purple); font-size: clamp(1.4rem, 2.8vw, 2.15rem); font-weight: 650; letter-spacing: -.025em; line-height: 1.35; }
.article-quote figcaption { margin-top: 1rem; color: var(--ink-soft); font-size: .875rem; }
.project-facts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; margin: 2.5rem 0; background: var(--line); }
.project-facts > div { padding: 1rem; background: var(--mist); }
.project-facts dt { color: var(--ink-soft); font-size: .875rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.project-facts dd { margin: .3rem 0 0; font-weight: 700; }
.article-steps { display: grid; gap: .65rem; margin: 2rem 0; }
.article-steps article { display: grid; grid-template-columns: 2.6rem 1fr; gap: 1rem; padding: 1.2rem; border-radius: .75rem; background: var(--mist); }
.article-steps article > span { color: var(--magenta-dark); font-size: .875rem; font-weight: 850; }
.article-steps h3 { margin-bottom: .35rem; }
.article-steps p { margin: 0; color: var(--ink-soft); font-size: .92rem; }
.article-callout, .article-cta { padding: clamp(1.5rem, 4vw, 2.5rem); margin: 2.5rem 0; border-radius: var(--radius); background: var(--mist); }
.article-callout { border-top: .35rem solid var(--magenta); }
.article-callout h2, .article-cta h2, .article-faq h2, .article-related h2 { font-size: clamp(1.5rem, 2.8vw, 2.25rem); }
.article-cta { background: var(--purple); color: var(--white); }
.article-cta h2, .article-cta p { color: var(--white); }
.article-faq, .article-related, .article-content-media { margin: 3rem 0; }
.article-content-media > h2 { font-size: clamp(1.5rem, 2.8vw, 2.25rem); }
.article-related ul { padding: 0; list-style: none; }
.article-related a { display: flex; justify-content: space-between; padding: .8rem 0; border-bottom: 1px solid var(--line); font-weight: 750; text-decoration: none; }
.article-related--reading a { align-items: center; gap: .75rem; }
.article-related--reading a > span { flex: 1; }
.article-related--reading small { color: var(--ink-soft); font-size: .875rem; font-weight: 700; }

/* Status and error pages */
.status-page { display: grid; min-height: 38rem; place-items: center; padding: var(--space-section) 0; background: linear-gradient(135deg, var(--mist), var(--paper)); }
.status-page__inner { max-width: 52rem; text-align: center; }
.status-page__inner > p { max-width: 42rem; margin-inline: auto; color: var(--ink-soft); font-size: 1.1rem; }
.status-page__inner .button-row { justify-content: center; }
.status-page__icon { display: grid; width: 5.2rem; height: 5.2rem; place-items: center; margin: 0 auto 1.5rem; border: 2px solid var(--purple); border-radius: 50%; color: var(--purple); font-size: 2rem; font-weight: 850; }
.status-page__icon--success { border-color: var(--success); color: var(--success); }
.reference-card { max-width: 27rem; padding: 1.2rem; margin: 2rem auto; border: 1px solid var(--line); border-radius: var(--radius); background: var(--white); }
.reference-card span { display: block; color: var(--ink-soft); font-size: .875rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.reference-card strong { display: block; margin-top: .25rem; color: var(--purple); font-size: 1.5rem; letter-spacing: .04em; }
.error-reference { font-size: .875rem !important; }
.error-page { padding: var(--space-section) 0; }
.error-page__grid { display: grid; grid-template-columns: .75fr 1.25fr; align-items: center; gap: clamp(3rem, 8vw, 8rem); }
.error-page__code { display: flex; align-items: center; justify-content: center; color: var(--purple); font-size: clamp(5rem, 13vw, 11rem); font-weight: 850; letter-spacing: -.08em; }
.error-page__code img { width: clamp(4rem, 9vw, 7rem); }
.error-page p { max-width: 42rem; color: var(--ink-soft); font-size: 1.08rem; }
.compact-search { max-width: 38rem; margin-top: 2rem; }
.error-page__links { display: grid; grid-template-columns: 1fr 1fr; gap: .65rem; padding: 0; margin-top: 2rem; list-style: none; }
.error-page__links a { display: flex; justify-content: space-between; padding: .8rem 0; border-bottom: 1px solid var(--line); font-weight: 750; text-decoration: none; }

/* Footer and consent */
.site-footer { padding-top: clamp(4rem, 8vw, 7rem); background: var(--color-aubergine); color: rgba(255,255,255,.78); }
.site-footer .shell { width: min(100% - (2 * var(--gutter)), 94rem); }
.site-footer__grid { display: grid; grid-template-columns: minmax(15rem, 1.35fr) repeat(4, minmax(0, 1fr)); gap: clamp(1.75rem, 3vw, 3rem); align-items: start; }
.site-footer__logo { position: relative; display: block; width: min(15rem, 100%); margin-bottom: 1.5rem; line-height: 0; }
.site-footer__brand .site-footer__logo img { display: block; width: 100%; margin: 0; }
.site-footer__logo-signs {
    position: absolute;
    inset: 0;
    clip-path: inset(62% 8% 8% 49%);
    background: #A3165E;
    -webkit-mask: url('/assets/images/brand/purple-frog-signs-logo-white.png') center / 100% 100% no-repeat;
    mask: url('/assets/images/brand/purple-frog-signs-logo-white.png') center / 100% 100% no-repeat;
    pointer-events: none;
}
.site-footer__brand > h2 { margin-bottom: .8rem; }
.site-footer__brand > p { max-width: 31rem; }
.site-footer h2 { color: var(--white); font-size: .875rem; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.site-footer ul { padding: 0; margin: 1rem 0; list-style: none; }
.site-footer li { margin-bottom: .55rem; }
.site-footer a, .site-footer .link-button { color: rgba(255,255,255,.88); font-size: .9rem; line-height: 1.45; text-decoration: none; }
.site-footer a:hover, .site-footer .link-button:hover { color: var(--white); text-decoration: underline; }
.site-footer .link-button { position: relative; }
.site-footer .link-button::before {
    position: absolute;
    inset: -.75rem -.5rem;
    content: "";
}
.site-footer__facts { display: grid; gap: .8rem; margin: 1.5rem 0 0; }
.site-footer__facts > div { display: grid; gap: .05rem; }
.site-footer__facts dt { color: rgba(255,255,255,.64); font-size: .8rem; font-weight: 800; letter-spacing: .05em; }
.site-footer__facts dd { margin: 0; color: var(--white); font-size: .9rem; overflow-wrap: anywhere; }
.site-footer__facts a { color: var(--white); font-weight: 750; }
.site-footer__social { display: flex; flex-wrap: wrap; gap: .65rem 1rem; margin-top: 1.5rem; }
.site-footer__social a { font-weight: 800; }
.site-footer__coverage { padding-block: 1.5rem; margin-top: 4rem; margin-bottom: 0; border-top: 1px solid var(--line-dark); border-bottom: 1px solid var(--line-dark); color: var(--white); font-size: 1rem; font-weight: 700; text-align: center; }
.site-footer__bottom { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding-block: 1.5rem; font-size: .875rem; }
.site-footer__bottom p { margin: 0; }
.cookie-preferences-open { overflow: hidden; }
.cookie-banner {
    position: fixed;
    z-index: 2000;
    right: max(1rem, env(safe-area-inset-right));
    bottom: max(1rem, env(safe-area-inset-bottom));
    left: max(1rem, env(safe-area-inset-left));
}
.cookie-banner__body {
    display: grid;
    width: min(100%, 74rem);
    grid-template-columns: minmax(0, 1.35fr) minmax(20rem, .65fr);
    gap: clamp(1.5rem, 4vw, 4rem);
    align-items: end;
    padding: clamp(1.4rem, 3vw, 2.25rem);
    margin-inline: auto;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: .7rem;
    background: var(--color-aubergine);
    color: var(--color-white);
    box-shadow: 0 24px 80px rgba(39,19,48,.34);
}
.cookie-banner .eyebrow { margin-bottom: .7rem; color: var(--color-white); }
.cookie-banner h2 { margin-bottom: .55rem; color: var(--color-white); font-size: clamp(1.65rem, 2.5vw, 2.35rem); }
.cookie-banner p { max-width: 47rem; margin-bottom: 0; color: rgba(255,255,255,.82); font-size: .92rem; line-height: 1.55; }
.cookie-banner__actions { display: grid; min-width: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; }
.cookie-banner__actions .button { width: 100%; min-height: 3.4rem; padding-inline: .9rem; }
.cookie-banner__decision { border-color: var(--color-white); background: var(--color-white); color: var(--color-aubergine); }
.cookie-banner__decision:hover, .cookie-banner__decision:active { border-color: var(--color-accent); background: var(--color-accent); color: var(--color-white); }
.cookie-banner__manage { grid-column: 1 / -1; border-color: rgba(255,255,255,.72); color: var(--color-white); }
.cookie-banner__manage:hover, .cookie-banner__manage:active { border-color: var(--color-white); background: var(--color-white); color: var(--color-aubergine); }

.cookie-modal { position: fixed; z-index: 2100; inset: 0; display: grid; padding: max(1rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) max(1rem, env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left)); place-items: center; }
.cookie-modal__scrim { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; border: 0; background: rgba(39,19,48,.82); cursor: default; }
.cookie-modal__panel { position: relative; width: min(100%, 54rem); max-height: calc(100dvh - 2rem); padding: clamp(1.4rem, 4vw, 2.75rem); overflow-y: auto; border: 1px solid var(--color-line); border-radius: .7rem; background: var(--color-warm-white); box-shadow: 0 30px 90px rgba(30,29,34,.34); }
.cookie-modal__header { display: flex; align-items: flex-start; justify-content: space-between; gap: 2rem; }
.cookie-modal__header .eyebrow { margin-bottom: .65rem; color: var(--color-accent); }
.cookie-modal__header h2 { margin-bottom: .25rem; font-size: clamp(2rem, 4vw, 3.25rem); }
.cookie-modal__close { display: grid; width: 3rem; height: 3rem; flex: 0 0 auto; place-items: center; padding: 0; border: 1px solid var(--color-line); border-radius: 50%; background: var(--color-white); color: var(--color-aubergine); font-size: 1.8rem; line-height: 1; }
.cookie-modal__close:hover { border-color: var(--color-accent); color: var(--color-accent-hover); }
.cookie-modal__intro { max-width: 44rem; color: var(--color-text-muted); }
.cookie-settings { margin-top: 1.5rem; border-top: .25rem solid var(--color-accent); }
.cookie-setting { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1.5rem; align-items: center; padding: 1.25rem 0; border-bottom: 1px solid var(--color-line); }
.cookie-setting strong { display: block; color: var(--color-charcoal); font-size: 1rem; }
.cookie-setting p { max-width: 38rem; margin: .2rem 0 0; color: var(--color-text-muted); font-size: .88rem; line-height: 1.5; }
.cookie-setting__control { display: grid; grid-template-columns: auto 1.5rem; gap: .8rem; align-items: center; color: var(--color-aubergine); font-size: .78rem; font-weight: 850; }
.cookie-setting input { width: 1.5rem; height: 1.5rem; margin: 0; accent-color: var(--color-accent); }
.cookie-setting input:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; box-shadow: none; }
.cookie-setting--necessary .cookie-setting__control { color: var(--color-text-muted); }
.cookie-modal__footer { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding-top: 1.5rem; }
.cookie-modal__footer > a { color: var(--color-aubergine); font-size: .88rem; font-weight: 800; }
.cookie-modal__footer > div { display: flex; flex-wrap: wrap; gap: .7rem; }

.consent-video { margin: 2.5rem 0; }
.consent-video__frame { position: relative; overflow: hidden; border-radius: .6rem; background: var(--color-aubergine); }
.consent-video__placeholder { position: relative; min-height: clamp(20rem, 52vw, 34rem); }
.consent-video__placeholder::after { position: absolute; z-index: 1; inset: 0; background: linear-gradient(90deg, rgba(39,19,48,.9), rgba(39,19,48,.46)); content: ""; }
.consent-video__placeholder img { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; object-fit: cover; }
.consent-video__placeholder--neutral { display: grid; place-items: center; background: var(--color-aubergine); }
.consent-video__mark { color: rgba(255,255,255,.12); font-size: clamp(7rem, 18vw, 13rem); line-height: 1; }
.consent-video__notice { position: absolute; z-index: 2; top: 50%; left: clamp(1.25rem, 6vw, 4rem); width: min(calc(100% - 2.5rem), 34rem); color: var(--color-white); transform: translateY(-50%); }
.consent-video__notice strong { display: block; color: var(--color-white); font-size: clamp(1.4rem, 3vw, 2.4rem); line-height: 1.15; }
.consent-video__notice p { margin: .8rem 0 1.4rem; color: rgba(255,255,255,.82); font-size: .92rem; }
.consent-video__player { width: 100%; aspect-ratio: 16 / 9; }
.consent-video__player iframe { display: block; width: 100%; height: 100%; border: 0; }
.consent-video figcaption { margin-top: .7rem; color: var(--color-text-muted); font-size: .86rem; }

/* Public proof, social and editorial components */
.social-links { display: grid; gap: .7rem; }
.social-links__heading { color: inherit; font-size: .78rem; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.social-links__items { display: flex; flex-wrap: wrap; gap: .55rem; }
.social-links__items a { display: inline-flex; min-width: 2.65rem; min-height: 2.65rem; align-items: center; justify-content: center; gap: .55rem; padding: .55rem .75rem; border: 1px solid currentColor; border-radius: .3rem; color: inherit; font-size: .84rem; font-weight: 800; text-decoration: none; }
.social-links__items a:hover { background: var(--color-accent); border-color: var(--color-accent); color: var(--color-white); text-decoration: none; }
.social-links__icon { width: 1.25rem; height: 1.25rem; }
.social-links--header { flex: 0 0 auto; display: block; }
.social-links--header .social-links__items { flex-wrap: nowrap; gap: .35rem; }
.social-links--header .social-links__items a { min-width: 2.3rem; min-height: 2.3rem; padding: .45rem; border-color: var(--color-line); color: var(--color-aubergine); }
.social-links--mobile-menu { margin-top: 1rem; padding-top: 1.25rem; border-top: 1px solid var(--color-line); color: var(--color-aubergine); }
.social-links--footer { margin-top: 1.75rem; color: var(--color-white); }
.social-links--footer .social-links__heading { color: var(--color-white); }
.social-links--footer .social-links__items a { border-color: rgba(255,255,255,.35); color: var(--color-white); }
.contextual-social { padding-block: 2rem; }
.contextual-social .social-links { display: flex; align-items: center; justify-content: space-between; gap: 1.25rem; padding-block: 1.25rem; border-top: 1px solid var(--color-line); border-bottom: 1px solid var(--color-line); color: var(--color-aubergine); }
.contextual-social--contact { margin-top: 1.5rem; }

.home-proof { padding: clamp(3.5rem, 6vw, 5.5rem) 0; background: var(--color-warm-white); }
.home-proof__inner { display: grid; grid-template-columns: minmax(15rem, .55fr) minmax(0, 1.45fr); gap: clamp(2.5rem, 7vw, 7rem); align-items: start; }
.home-proof__heading h2 { max-width: 28rem; font-size: clamp(2rem, 3vw, 3rem); }
.home-proof ul { display: grid; grid-template-columns: repeat(2, 1fr); padding: 0; margin: 0; border-top: 1px solid var(--color-line); list-style: none; }
.home-proof li { display: grid; min-width: 0; grid-template-columns: 3rem 1fr; gap: .25rem 1rem; padding: 1.35rem 1rem 1.35rem 0; border-bottom: 1px solid var(--color-line); }
.home-proof li:nth-child(odd) { margin-right: 1.25rem; }
.home-proof__icon { grid-row: 1 / 3; width: 2.5rem; height: 2.5rem; color: var(--color-accent); }
.home-proof li strong, .home-proof li span { min-width: 0; }
.home-proof li strong { color: var(--color-aubergine); line-height: 1.3; }
.home-proof li span { color: var(--color-text-muted); font-size: .87rem; line-height: 1.45; }

.client-logos { padding: clamp(2.75rem, 5vw, 4.5rem) 0; border-block: 1px solid var(--color-line); background: var(--color-stone); }
.client-logos__heading { display: flex; align-items: end; justify-content: space-between; gap: 2rem; }
.client-logos__heading h2 { max-width: 46rem; font-size: clamp(1.7rem, 2.8vw, 2.7rem); }
.client-logos__list { display: flex; flex-wrap: wrap; gap: 1px; padding: 0; margin: 2rem 0 0; background: var(--color-line); list-style: none; }
.client-logos__list li { display: grid; min-width: 10rem; min-height: 7rem; flex: 1 1 12rem; place-items: center; padding: 1rem; background: var(--color-warm-white); }
.client-logos__list a { display: grid; width: 100%; min-height: 4.5rem; place-items: center; }
.client-logos__list picture { display: contents; }
.client-logos__list img { width: auto; max-width: 10rem; max-height: 4.5rem; object-fit: contain; filter: grayscale(1); opacity: .82; transition: filter 180ms ease, opacity 180ms ease; }
.client-logos__list a:hover img { filter: none; opacity: 1; }

.testimonials-section { padding: var(--space-section) 0; background: var(--color-aubergine); color: var(--color-white); }
.testimonials-section__inner { display: grid; grid-template-columns: minmax(15rem, .58fr) minmax(0, 1.42fr); gap: clamp(2.5rem, 7vw, 7rem); align-items: start; }
.testimonials-section__heading { position: sticky; top: 7rem; }
.testimonials-section__heading .eyebrow, .testimonials-section__heading h2 { color: var(--color-white); }
.testimonials-section__heading h2 { max-width: 28rem; font-size: clamp(2.2rem, 3.6vw, 3.6rem); }
.testimonials-section__heading p { max-width: 29rem; color: rgba(255,255,255,.78); }
.testimonial { margin: 0; }
.testimonial--featured { grid-column: 2; padding-bottom: clamp(2rem, 4vw, 3.5rem); border-bottom: 1px solid rgba(255,255,255,.25); }
.testimonial__rating { margin-bottom: 1.25rem; color: #ffd56a; letter-spacing: .18em; }
.testimonial blockquote p { margin: 0; color: var(--color-white); }
.testimonial--featured blockquote p { font-size: clamp(1.65rem, 3vw, 3rem); font-weight: 650; letter-spacing: -.035em; line-height: 1.18; }
.testimonial figcaption { display: flex; flex-wrap: wrap; gap: .3rem .7rem; align-items: baseline; margin-top: 1.5rem; color: rgba(255,255,255,.72); font-size: .86rem; }
.testimonial figcaption strong { color: var(--color-white); }
.testimonial figcaption a { color: var(--color-white); font-weight: 800; }
.testimonial__source { flex-basis: 100%; }
.testimonial__source-link { display: inline-flex; flex-basis: 100%; width: fit-content; }
.testimonials-list { grid-column: 2; display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; background: rgba(255,255,255,.22); }
.testimonial--compact { padding: 1.5rem; background: var(--color-aubergine); }
.testimonial--compact blockquote p { font-size: 1rem; line-height: 1.6; }

.project-details { padding: clamp(1.5rem, 4vw, 2.75rem); margin-bottom: 3rem; border-left: .3rem solid var(--color-accent); background: var(--color-stone); }
.project-details h2 { font-size: clamp(1.65rem, 2.8vw, 2.35rem); }
.project-details dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 2rem; margin: 0; }
.project-details dl > div { padding-block: .8rem; border-top: 1px solid var(--color-line); }
.project-details dt { color: var(--color-accent-hover); font-size: .75rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.project-details dd { margin: .2rem 0 0; color: var(--color-charcoal); font-weight: 700; }

/* Motion is a modest enhancement; no content depends on it. */
/* Public content must never depend on IntersectionObserver or animation to be
   readable, printable, searchable or capturable. The reveal hook remains for
   backwards-compatible scripting, but its resting and visible states are both
   fully rendered. */
.js [data-reveal],
.js [data-reveal].is-visible { opacity: 1; transform: none; }

/* Desktop homepage refinement: all composition changes are isolated to 1024px+. */
@media (min-width: 64rem) {
    .home-hero { min-height: 0; }
    .home-hero__inner {
        --hero-grid-gap: clamp(1.5rem, 2.25vw, 2.5rem);
        --hero-header-offset: clamp(0rem, calc(50vw - 41rem), 9rem);
        --hero-copy-width: min(31rem, calc(40vw - 2.5rem));
        --hero-headline-width: min(32.8rem, calc(40vw - 2.5rem));
        --hero-media-shift: clamp(0rem, calc(22.5vw - 18rem), 3rem);
        width: min(100% - (2 * var(--gutter)), 94rem);
        min-height: 0;
        grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
        grid-template-rows: auto;
        gap: var(--hero-grid-gap);
        align-items: center;
        padding-top: clamp(2.5rem, 4vw, 3.75rem);
        padding-bottom: clamp(4.25rem, 4vw, 4.5rem);
    }
    @media (min-width: 73.0625rem) {
        .home-hero__inner { padding-top: clamp(2.75rem, 4vw, 4rem); }
    }
    .home-hero__copy {
        display: block;
        width: var(--hero-copy-width);
        max-width: none;
        min-width: 0;
        margin-left: var(--hero-header-offset);
        align-self: start;
        padding-top: clamp(.8rem, 1.5vw, 1.5rem);
    }
    .home-hero__headline { width: var(--hero-headline-width); max-width: none; }
    .home-hero__details { max-width: 31rem; }
    .home-hero h1 {
        width: var(--hero-headline-width);
        max-width: none;
        font-size: clamp(3.2rem, 4vw, 3.6rem);
        line-height: .98;
    }
    .home-hero .eyebrow { margin-bottom: 1.35rem; }
    .home-hero__details { padding-top: clamp(2rem, 3.2vh, 2.6rem); }
    .home-hero__location { margin-top: 1.15rem; }
    .home-hero .button-row { margin-top: 1.7rem; }
    .home-hero__media {
        width: 100%;
        margin: 0;
        align-self: start;
        transform: translateX(var(--hero-media-shift));
    }
    .home-hero__media img { aspect-ratio: 16 / 9; }
    .home-details__cards { grid-auto-rows: auto; align-items: start; }
    .home-details__cards article { height: auto; min-height: 0; overflow: visible; }
    .home-details__cards h3 {
        height: auto;
        max-height: none;
        overflow: visible;
        line-height: 1.3;
        text-wrap: wrap;
    }
}

@media (max-width: 90rem) {
    .site-header__phone { font-size: .94rem; }
    .social-links--header { display: none; }
}

@media (max-width: 68rem) {
    .desktop-navigation, .site-header__actions { display: none; }
    .site-header__inner { min-height: 4.25rem; justify-content: space-between; }
    .menu-toggle { display: flex; }
    .js .mobile-navigation:not([hidden]) { display: block; }
    .no-js .site-header { position: static; }
    .no-js .menu-toggle { display: none; }
    .no-js .mobile-navigation { position: static; display: block; width: 100%; height: auto; padding: 0 var(--gutter) 1.5rem; box-shadow: none; }
    .no-js .mobile-navigation__top .icon-button { display: none; }
    .brand img { height: 2.5rem; }
    .page-hero__grid { grid-template-columns: 1.15fr .85fr; gap: 3rem; }
    .site-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .site-footer__brand { grid-column: 1 / -1; }
    .site-footer__column:last-child { grid-column: auto; }
    .article-grid { grid-template-columns: repeat(2, 1fr); }
    .home-services__primary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .home-method__steps { grid-template-columns: repeat(3, 1fr); }
    .home-proof__inner, .testimonials-section__inner { grid-template-columns: 1fr; }
    .testimonials-section__heading { position: static; }
    .testimonial--featured, .testimonials-list { grid-column: auto; }
}

@media (max-width: 58rem) {
    .home-section-heading, .home-sectors__grid, .home-buzz__inner, .home-coverage__inner { grid-template-columns: 1fr; }
    .home-section-heading { gap: .75rem; }
    .home-sectors__grid { gap: 3rem; }
    .home-buzz__inner, .home-coverage__inner { gap: 2.5rem; }
}

@media (max-width: 50rem) {
    :root { --space-section: 4.5rem; }
    html { scroll-padding-top: 4.75rem; }
    .page-hero__grid, .content-section__inner, .faq-section__grid, .final-cta__inner, .contact-hero__grid, .enquiry-section__grid, .error-page__grid { grid-template-columns: 1fr; }
    .page-hero { padding-top: 2.5rem; }
    .page-hero__image { width: min(85%, 28rem); margin-inline: auto; }
    .page-hero__graphic { min-height: 18rem; }
    .content-section__inner, .faq-section__grid { gap: 2.25rem; }
    .content-items--grid, .related-links ul { grid-template-columns: 1fr; }
    .final-cta__actions { justify-self: start; }
    .home-hero { min-height: 0; }
    .home-hero__inner { min-height: 0; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto; padding-top: 1.65rem; }
    .home-hero__copy { grid-template-columns: 1fr; gap: .85rem; }
    .home-hero__headline, .home-hero__details { max-width: none; }
    .home-hero .eyebrow { gap: .6rem; margin-bottom: .7rem; font-size: .64rem; letter-spacing: .1em; }
    .home-hero .eyebrow::before { width: 1.1rem; }
    .home-hero h1 { font-size: clamp(2.55rem, 10.8vw, 2.9rem); line-height: 1; }
    .home-hero h1 span { display: inline; }
    .home-hero__details { padding-top: 0; }
    .home-hero__summary { max-width: 29rem; font-size: .98rem; line-height: 1.48; }
    .home-hero__location { max-width: 27rem; margin-top: .65rem; }
    .home-hero .button-row { flex-wrap: nowrap; gap: .6rem; margin-top: 1.15rem; }
    .home-hero .button { min-width: 0; flex: 1 1 9rem; padding: .72rem .8rem; }
    .home-hero__media { width: calc(100% + (2 * var(--gutter))); max-width: none; margin-top: .8rem; }
    .home-hero__media img { aspect-ratio: 3 / 2; }
    .home-capabilities__grid { grid-template-columns: 1fr 1fr; }
    .home-capability { border-bottom: 1px solid rgba(255,255,255,.2); }
    .home-capability > a { min-height: 6.2rem; padding: 1rem; }
    .home-capability__icon,
    .home-reason__icon,
    .home-method__icon,
    .home-proof__icon { width: 2.25rem; height: 2.25rem; }
    .home-capability:nth-child(even) { border-right: 0; }
    .home-capability:nth-last-child(-n + 2) { border-bottom: 0; }
    .home-introduction__grid, .home-work__header, .home-why__inner { grid-template-columns: 1fr; }
    .home-introduction__grid { gap: 2rem; }
    .home-work__grid { grid-template-columns: 1fr; grid-template-rows: none; }
    .work-tile--large { grid-row: auto; }
    .work-tile { min-height: 18rem; }
    .home-why__inner { gap: 2.5rem; }
    .home-why figure { width: min(100%, 30rem); }
    .home-method__steps { grid-template-columns: repeat(2, 1fr); }
    .contact-hero__grid { gap: 2.5rem; }
    .enquiry-aside { position: static; }
    .search-results__list, .search-starts__grid, .article-grid { grid-template-columns: 1fr; }
    .archive-filters { top: 4.25rem; }
    .archive-cta__inner { align-items: flex-start; flex-direction: column; }
    .article-layout { grid-template-columns: 1fr; }
    .article-aside { position: static; display: none; }
    .article-gallery--grid { grid-template-columns: repeat(2, 1fr); }
    .home-proof ul, .testimonials-list { grid-template-columns: 1fr 1fr; }
    .client-logos__heading, .contextual-social .social-links { align-items: flex-start; flex-direction: column; }
    .site-footer__grid { grid-template-columns: 1fr 1fr; }
    .site-footer__brand { grid-column: 1 / -1; }
    .site-footer__column:last-child { grid-column: auto; }
    .cookie-banner__body { grid-template-columns: 1fr; gap: 1.25rem; }
    .cookie-banner__actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 36rem) {
    :root { --gutter: 1rem; }
    .home-services__primary { grid-template-columns: 1fr; }
    h1 { font-size: clamp(2.55rem, 13vw, 3.7rem); }
    .menu-toggle__label { display: none; }
    .button-row, .form-submit, .site-footer__bottom { align-items: stretch; flex-direction: column; }
    .button-row .button { width: 100%; }
    .home-hero .button-row { align-items: center; flex-direction: row; }
    .home-hero .button-row .button { width: auto; }
    .home-capability > a { grid-template-columns: 2rem minmax(0, 1fr) auto; gap: .5rem; padding-inline: .7rem; }
    .home-capability__icon { width: 2rem; height: 2rem; }
    .home-sectors__list, .home-method__steps, .contact-hero__details, .form-grid--two, .error-page__links, .article-gallery, .before-after, .project-facts { grid-template-columns: 1fr; }
    .home-sectors__list { grid-auto-flow: row; grid-template-rows: none; }
    .home-sectors__list li:nth-child(7), .home-sectors__list li:nth-last-child(-n + 2) { border-bottom: 0; }
    .home-sectors__list li:last-child { border-bottom: 1px solid rgba(255,255,255,.24); }
    .home-method__steps h3 { min-height: 0; }
    .content-card { padding: 1.25rem; }
    .search-form > div, .compact-search > div { grid-template-columns: 1fr; }
    .search-results__header { align-items: flex-start; flex-direction: column; gap: .4rem; }
    .article-hero__meta { align-items: flex-start; flex-direction: column; gap: .5rem; }
    .article-gallery--grid { grid-template-columns: 1fr; }
    .home-proof ul, .testimonials-list, .project-details dl { grid-template-columns: 1fr; }
    .home-proof li:nth-child(odd) { margin-right: 0; }
    .client-logos__list li { flex-basis: 9rem; min-width: 8rem; }
    .archive-filters__inner > span { flex-basis: 100%; }
    .archive-filters ul { flex-basis: 100%; }
    .site-footer__grid { grid-template-columns: 1fr; }
    .site-footer__brand { grid-column: auto; }
    .site-footer__column:last-child { grid-column: auto; }
    .cookie-banner { right: max(.5rem, env(safe-area-inset-right)); bottom: max(.5rem, env(safe-area-inset-bottom)); left: max(.5rem, env(safe-area-inset-left)); }
    .cookie-banner__body { max-height: calc(100dvh - max(1rem, env(safe-area-inset-top)) - max(1rem, env(safe-area-inset-bottom))); grid-template-columns: 1fr; gap: 1.1rem; padding: 1.2rem; overflow-y: auto; }
    .cookie-banner .eyebrow { font-size: .72rem; }
    .cookie-banner h2 { font-size: 1.65rem; }
    .cookie-banner__actions { grid-template-columns: 1fr; }
    .cookie-banner__manage { grid-column: auto; }
    .cookie-modal { padding: max(.5rem, env(safe-area-inset-top)) max(.5rem, env(safe-area-inset-right)) max(.5rem, env(safe-area-inset-bottom)) max(.5rem, env(safe-area-inset-left)); }
    .cookie-modal__panel { max-height: calc(100dvh - max(1rem, env(safe-area-inset-top)) - max(1rem, env(safe-area-inset-bottom))); padding: 1.2rem; }
    .cookie-modal__header { gap: 1rem; }
    .cookie-setting { grid-template-columns: 1fr; gap: .8rem; align-items: start; }
    .cookie-setting__control { width: 100%; justify-content: space-between; }
    .cookie-modal__footer { align-items: stretch; flex-direction: column; }
    .cookie-modal__footer > div { display: grid; grid-template-columns: 1fr; }
    .cookie-modal__footer .button { width: 100%; }
    .consent-video__placeholder { min-height: 25rem; }
    .consent-video__placeholder::after { background: rgba(39,19,48,.78); }
    .consent-video__notice { top: auto; bottom: 1.25rem; left: 1.25rem; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
    .js [data-reveal] { opacity: 1; transform: none; }
}

@media (forced-colors: active) {
    .button, .content-card, .article-card, .page-hero__image img, .form-panel, .cookie-banner__body, .cookie-modal__panel, .consent-video__frame { border: 2px solid ButtonText; }
    .eyebrow::before, .content-section__heading::after, .content-list-item > span { background: CanvasText; }
    .page-hero__graphic, .article-card__placeholder, .status-page__icon, .empty-state__mark { forced-color-adjust: none; }
    .menu-scrim, .cookie-modal__scrim { background: CanvasText; opacity: .65; }
}

@media print {
    .site-strip, .site-header, .site-footer, .cookie-banner, .cookie-modal, .final-cta, .related-links, .archive-filters, .button-row, .article-aside { display: none !important; }
    body { background: #fff; color: #000; font-size: 11pt; }
    .shell { width: 100%; }
    a { color: #000; text-decoration: underline; }
    .page-hero, .article-hero, .contact-hero, .archive-hero { padding: 1.5rem 0; background: #fff; color: #000; }
    .page-hero h1, .article-hero h1, .contact-hero h1, .archive-hero h1 { color: #000; }
    .content-section, .faq-section, .article-layout { padding: 1rem 0; }
}

/* PFS BACK TO TOP v1 — START */
.back-to-top {
    position: fixed;
    z-index: 950;
    right: max(1rem, env(safe-area-inset-right));
    bottom: max(1rem, env(safe-area-inset-bottom));
    display: grid;
    width: 3.1rem;
    height: 3.1rem;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(255,255,255,.78);
    border-radius: 50%;
    background: var(--color-accent);
    color: var(--color-white);
    box-shadow: 0 10px 30px rgba(39,19,48,.24);
    line-height: 1;
    transition: background 180ms ease, border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}
.back-to-top[hidden] { display: none !important; }
.back-to-top:hover {
    border-color: var(--color-white);
    background: var(--color-accent-hover);
    color: var(--color-white);
    transform: translateY(-2px);
}
.back-to-top:active { transform: translateY(0); }
.back-to-top svg {
    width: 1.35rem;
    height: 1.35rem;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2.2;
}
@media (max-width: 40rem) {
    .back-to-top {
        right: max(.85rem, env(safe-area-inset-right));
        bottom: max(.85rem, env(safe-area-inset-bottom));
        width: 3rem;
        height: 3rem;
    }
}
@media (prefers-reduced-motion: reduce) {
    .back-to-top { transition: none; }
}
@media (forced-colors: active) {
    .back-to-top {
        border: 2px solid ButtonText;
        background: ButtonFace;
        color: ButtonText;
        box-shadow: none;
    }
}
@media print {
    .back-to-top { display: none !important; }
}
/* PFS BACK TO TOP v1 — END */


/* Pavement-sign product examples */
.inner-section__product-image {
    margin: 2rem 0 0;
}

.inner-section__product-image picture,
.inner-section__product-image img {
    display: block;
    width: 100%;
}

.inner-section__product-image img {
    aspect-ratio: 4 / 3;
    object-fit: cover;
    border-radius: 18px;
}

.inner-section__product-image figcaption {
    margin-top: 0.75rem;
    max-width: 46rem;
    font-size: 0.9rem;
    line-height: 1.5;
}

@media (min-width: 900px) {
    .page--product-detail .inner-section__product-image {
        max-width: 760px;
    }
}

/* PAVEMENT SIGNS — VISUAL SECTION BLOCKS */

/*
 * The pavement-sign page contains several closely related product
 * explanations. Give each section a distinct visual field and remove
 * the oversized vertical gaps used by some generic inner-page layouts.
 */
.inner-flow--pavement-signs > .inner-section {
    min-height: 0;
    margin: 0;
    padding-top: clamp(3.5rem, 6vw, 5.5rem);
    padding-bottom: clamp(3.5rem, 6vw, 5.5rem);
    border-top: 1px solid rgba(38, 25, 45, 0.08);
}

/* Soft alternating editorial bands. */
.inner-flow--pavement-signs > .inner-section:nth-of-type(2n) {
    background: #f7f2f8;
}

.inner-flow--pavement-signs > .inner-section:nth-of-type(2n + 1) {
    background: #ffffff;
}

/*
 * Keep the text comfortably readable rather than allowing long lines
 * to stretch across the complete content column.
 */
.inner-flow--pavement-signs .inner-section__content > p {
    max-width: 58rem;
}

/*
 * Product photographs sit clearly within their associated section
 * once an image has been selected through Website Images.
 */
.inner-flow--pavement-signs .inner-section__product-image {
    margin-top: 2.25rem;
    max-width: 44rem;
    overflow: hidden;
}

/* Mobile: retain separation without excessive vertical depth. */
@media (max-width: 767px) {
    .inner-flow--pavement-signs > .inner-section {
        padding-top: 2.75rem;
        padding-bottom: 2.75rem;
    }

    .inner-flow--pavement-signs .inner-section__product-image {
        margin-top: 1.5rem;
    }
}


/* PAVEMENT SIGNS — BRAND COLOUR OVERRIDES */
.inner-flow--pavement-signs > .inner-section {
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.inner-flow--pavement-signs > .inner-section:nth-of-type(2n + 1) {
    background: linear-gradient(135deg, #22002f 0%, #2d083d 100%);
    color: #ffffff;
}

.inner-flow--pavement-signs > .inner-section:nth-of-type(2n) {
    background: linear-gradient(135deg, #8d0b5c 0%, #c21873 100%);
    color: #ffffff;
}

.inner-flow--pavement-signs > .inner-section h1,
.inner-flow--pavement-signs > .inner-section h2,
.inner-flow--pavement-signs > .inner-section h3,
.inner-flow--pavement-signs > .inner-section h4,
.inner-flow--pavement-signs > .inner-section .inner-section__heading,
.inner-flow--pavement-signs > .inner-section .inner-section__title {
    color: #ffffff;
}

.inner-flow--pavement-signs > .inner-section p,
.inner-flow--pavement-signs > .inner-section li,
.inner-flow--pavement-signs > .inner-section .inner-section__content,
.inner-flow--pavement-signs > .inner-section .inner-section__eyebrow,
.inner-flow--pavement-signs > .inner-section .section-index {
    color: rgba(255, 255, 255, 0.92);
}

.inner-flow--pavement-signs > .inner-section a {
    color: #ffffff;
}

.inner-flow--pavement-signs > .inner-section .inner-section__product-image figcaption {
    color: rgba(255, 255, 255, 0.85);
}

/* PAVEMENT SIGNS — FINAL WHITE / PURPLE / MAGENTA STRUCTURE */

/* Default all pavement sections back to white. */
.inner-flow--pavement-signs > .inner-section {
    background: #ffffff;
    color: #211d24;
    border-top: 1px solid rgba(35, 20, 45, 0.10);
}

/* Dark-purple feature sections: intro + choosing guide. */
.inner-flow--pavement-signs > .inner-section:nth-of-type(1),
.inner-flow--pavement-signs > .inner-section:nth-of-type(6) {
    background: #24152f;
    color: #ffffff;
}

/* Magenta feature sections: swing boards + quote section. */
.inner-flow--pavement-signs > .inner-section:nth-of-type(3),
.inner-flow--pavement-signs > .inner-section:nth-of-type(8) {
    background: #b30b63;
    color: #ffffff;
}

/* Explicit white sections. */
.inner-flow--pavement-signs > .inner-section:nth-of-type(2),
.inner-flow--pavement-signs > .inner-section:nth-of-type(4),
.inner-flow--pavement-signs > .inner-section:nth-of-type(5),
.inner-flow--pavement-signs > .inner-section:nth-of-type(7) {
    background: #ffffff;
    color: #211d24;
}

/* White-section typography. */
.inner-flow--pavement-signs > .inner-section:nth-of-type(2) h2,
.inner-flow--pavement-signs > .inner-section:nth-of-type(4) h2,
.inner-flow--pavement-signs > .inner-section:nth-of-type(5) h2,
.inner-flow--pavement-signs > .inner-section:nth-of-type(7) h2,
.inner-flow--pavement-signs > .inner-section:nth-of-type(2) p,
.inner-flow--pavement-signs > .inner-section:nth-of-type(4) p,
.inner-flow--pavement-signs > .inner-section:nth-of-type(5) p,
.inner-flow--pavement-signs > .inner-section:nth-of-type(7) p,
.inner-flow--pavement-signs > .inner-section:nth-of-type(2) li,
.inner-flow--pavement-signs > .inner-section:nth-of-type(4) li,
.inner-flow--pavement-signs > .inner-section:nth-of-type(5) li,
.inner-flow--pavement-signs > .inner-section:nth-of-type(7) li {
    color: #211d24;
}

/* Coloured-section typography. */
.inner-flow--pavement-signs > .inner-section:nth-of-type(1) h2,
.inner-flow--pavement-signs > .inner-section:nth-of-type(3) h2,
.inner-flow--pavement-signs > .inner-section:nth-of-type(6) h2,
.inner-flow--pavement-signs > .inner-section:nth-of-type(8) h2,
.inner-flow--pavement-signs > .inner-section:nth-of-type(1) p,
.inner-flow--pavement-signs > .inner-section:nth-of-type(3) p,
.inner-flow--pavement-signs > .inner-section:nth-of-type(6) p,
.inner-flow--pavement-signs > .inner-section:nth-of-type(8) p {
    color: #ffffff;
}

/* Materials and Ideal-for remain clean white linked-list blocks. */
.inner-flow--pavement-signs > .inner-section:nth-of-type(5) .inner-items,
.inner-flow--pavement-signs > .inner-section:nth-of-type(7) .inner-items {
    background: #ffffff;
}

/* Visible product-image spaces until real CMS images are selected. */
.inner-flow--pavement-signs .inner-section__product-image--placeholder {
    margin-top: 2rem;
    max-width: 44rem;
}

.inner-flow--pavement-signs .inner-section__product-image-placeholder {
    display: grid;
    place-items: center;
    width: 100%;
    aspect-ratio: 4 / 3;
    border: 2px dashed rgba(36, 21, 47, 0.24);
    border-radius: 18px;
    background: #f7f4f8;
    color: #6c6370;
    font-size: 0.95rem;
    text-align: center;
    padding: 2rem;
}

/* Swing-board placeholder on magenta. */
.inner-flow--pavement-signs
> .inner-section:nth-of-type(3)
.inner-section__product-image-placeholder {
    border-color: rgba(255, 255, 255, 0.55);
    background: rgba(255, 255, 255, 0.10);
    color: #ffffff;
}

/* Keep sections comfortably compact. */
.inner-flow--pavement-signs > .inner-section {
    min-height: 0;
    margin: 0;
    padding-top: clamp(3.5rem, 6vw, 5.5rem);
    padding-bottom: clamp(3.5rem, 6vw, 5.5rem);
}

@media (max-width: 767px) {
    .inner-flow--pavement-signs > .inner-section {
        padding-top: 2.75rem;
        padding-bottom: 2.75rem;
    }
}

/* PAVEMENT SIGNS — SECTION 04 WARM CREAM */
.inner-flow--pavement-signs > .inner-section:nth-of-type(4) {
    background: var(--color-warm-white);
    color: #211d24;
}

.inner-flow--pavement-signs > .inner-section:nth-of-type(4) h2,
.inner-flow--pavement-signs > .inner-section:nth-of-type(4) p,
.inner-flow--pavement-signs > .inner-section:nth-of-type(4) li {
    color: #211d24;
}

/* PAVEMENT SIGNS — SECTION 04 DARKER CREAM */
.inner-flow--pavement-signs > .inner-section:nth-of-type(4) {
    background: #f1eadf;
    color: #211d24;
}

.inner-flow--pavement-signs > .inner-section:nth-of-type(4) h2,
.inner-flow--pavement-signs > .inner-section:nth-of-type(4) p,
.inner-flow--pavement-signs > .inner-section:nth-of-type(4) li {
    color: #211d24;
}

/* PAVEMENT SIGNS — SECTION 04 COOL STONE OVERRIDE */
.inner-flow--pavement-signs > .inner-section:nth-of-type(4) {
    background: #e6e1d8;
    color: #211d24;
}

.inner-flow--pavement-signs > .inner-section:nth-of-type(4) h2,
.inner-flow--pavement-signs > .inner-section:nth-of-type(4) p,
.inner-flow--pavement-signs > .inner-section:nth-of-type(4) li {
    color: #211d24;
}

.inner-flow--pavement-signs
> .inner-section:nth-of-type(4)
.inner-section__product-image-placeholder {
    background: #f5f3ee;
    border-color: rgba(36, 21, 47, 0.18);
    color: #5f5962;
}

/* PAVEMENT SIGNS — SECTION 04 COOL GREY-STONE */
.inner-flow--pavement-signs > .inner-section:nth-of-type(4) {
    background: #dedcd6;
    color: #211d24;
}

.inner-flow--pavement-signs
> .inner-section:nth-of-type(4)
.inner-section__product-image-placeholder {
    background: #f3f2ee;
    border-color: rgba(36, 21, 47, 0.18);
    color: #5f5962;
}

/* VEHICLE & FLEET GRAPHICS — FEATURE IMAGE */
.product-family__feature-image {
    margin: clamp(2rem, 4vw, 3.5rem) 0;
}

.product-family__feature-image picture,
.product-family__feature-image img {
    display: block;
    width: 100%;
}

.product-family__feature-image img {
    width: 100%;
    max-height: 42rem;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: 18px;
}

.product-family__feature-image figcaption {
    margin-top: 0.75rem;
    font-size: 0.9rem;
    line-height: 1.5;
    color: var(--color-muted, #666);
}

/* VEHICLE & FLEET GRAPHICS — REFINED FEATURE IMAGE SIZE */
.product-family__feature-image {
    width: min(100%, 900px);
    margin: clamp(2rem, 4vw, 3rem) auto;
}

.product-family__feature-image picture {
    display: block;
    width: 100%;
}

.product-family__feature-image img {
    display: block;
    width: 100%;
    height: auto;
    max-height: none;
    aspect-ratio: auto;
    object-fit: contain;
    border-radius: 16px;
}
