@font-face {
    font-family: "Playhigh Regular";
    src: url("../fonts/Playhigh-Regular.woff2") format("woff2");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "Playhigh Regular";
    src: url("../fonts/Playhigh-Italic.woff2") format("woff2");
    font-style: italic;
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "Playhigh SemiCondensed";
    src: url("../fonts/Playhigh-SemiCondensed.woff2") format("woff2");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "Playhigh Condensed";
    src: url("../fonts/Playhigh-Condensed.woff2") format("woff2");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "Playhigh Condensed";
    src: url("../fonts/Playhigh-CondensedItalic.woff2") format("woff2");
    font-style: italic;
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "Playhigh SemiCondensed";
    src: url("../fonts/Playhigh-SemiCondensedItalic.woff2") format("woff2");
    font-style: italic;
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "Playhigh Expanded";
    src: url("../fonts/Playhigh-Expanded.woff2") format("woff2");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "Playhigh Expanded";
    src: url("../fonts/Playhigh-ExpandedItalic.woff2") format("woff2");
    font-style: italic;
    font-weight: 400;
    font-display: swap;
}

/* SPRT Marketing public experience — isolated, mobile-first, no theme dependency. */
:root {
    --sprt-primary: #7900f3;
    --sprt-secondary: #19af2d;
    --sprt-accent: var(--sprt-primary);
    --sprt-accent-strong: #b875ff;
    --sprt-accent-action: #6100c2;
    --sprt-ink: #0d001b;
    --sprt-paper: #f6f5f2;
    --sprt-bg: #0d001b;
    --sprt-bg-elevated: #17002e;
    --sprt-surface: #1d003b;
    --sprt-surface-2: #270050;
    --sprt-text: #f8f7f4;
    --sprt-text-soft: #bcbab5;
    --sprt-line: rgba(255, 255, 255, 0.14);
    --sprt-line-strong: rgba(255, 255, 255, 0.28);
    --sprt-shadow: 0 24px 80px rgba(0, 0, 0, 0.34);
    --sprt-header-bg: rgba(13, 0, 27, 0.92);
    --sprt-success: var(--sprt-secondary);
    --sprt-error: #ff6b64;
    --sprt-warning: var(--sprt-secondary);
    --sprt-font: "Playhigh Regular";
    --sprt-display: "Playhigh SemiCondensed";
    --sprt-headline: "Playhigh Condensed";
    --sprt-expanded: "Playhigh Expanded";
    --sprt-condensed: "Playhigh Condensed";
    --sprt-mono: "Playhigh SemiCondensed";
    --sprt-container: 1240px;
    --sprt-gutter: clamp(1rem, 4vw, 2.5rem);
    --sprt-section: clamp(5rem, 10vw, 9rem);
    --sprt-radius: 3px;
    --sprt-ease: cubic-bezier(0.22, 1, 0.36, 1);
    --sprt-noise: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.24'/%3E%3C/svg%3E");
    color-scheme: dark;
}

html[data-sprt-theme="light"] {
    --sprt-accent: var(--sprt-primary);
    --sprt-accent-strong: #5f00bf;
    --sprt-accent-action: #5f00bf;
    --sprt-bg: #f6f5f2;
    --sprt-bg-elevated: #ffffff;
    --sprt-surface: #eceae5;
    --sprt-surface-2: #e2dfd9;
    --sprt-text: #111111;
    --sprt-text-soft: #5f5d58;
    --sprt-line: rgba(9, 9, 9, 0.15);
    --sprt-line-strong: rgba(9, 9, 9, 0.3);
    --sprt-shadow: 0 24px 70px rgba(27, 20, 14, 0.12);
    --sprt-header-bg: rgba(246, 245, 242, 0.92);
    --sprt-success: #087719;
    --sprt-error: #a60d08;
    --sprt-warning: #087719;
    color-scheme: light;
}

html[data-sprt-theme="light"] .sprt-wordmark > i {
    background: var(--sprt-red);
    color: var(--sprt-red);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--sprt-red), transparent 78%);
}

html[data-sprt-theme="light"] .sprt-page-hero__index span,
html[data-sprt-theme="light"] .sprt-not-found__score i {
    color: var(--sprt-red);
}

html[data-sprt-theme="light"] .sprt-footer .sprt-wordmark > i {
    background: var(--sprt-yellow);
    color: var(--sprt-yellow);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--sprt-yellow), transparent 78%);
}

html[data-sprt-theme="dark"] {
    color-scheme: dark;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: 8rem;
}

body.sprt-page,
body.sprt-site {
    margin: 0;
    overflow-x: hidden;
    background: var(--sprt-bg);
    color: var(--sprt-text);
    font-family: var(--sprt-font);
    font-size: 16px;
    line-height: 1.65;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

body.sprt-modal-open,
body.sprt-menu-open {
    overflow: hidden;
}

[data-sprt-site],
[data-sprt-site] *,
[data-sprt-site] *::before,
[data-sprt-site] *::after {
    box-sizing: border-box;
}

[data-sprt-site] {
    min-width: 0;
    background: var(--sprt-bg);
    color: var(--sprt-text);
}

[data-sprt-site] h1,
[data-sprt-site] h2,
[data-sprt-site] h3 {
    overflow-wrap: anywhere;
    hyphens: auto;
}

.sprt-main {
    min-width: 0;
    overflow-x: clip;
}

[data-sprt-site] [hidden] {
    display: none !important;
}

[data-sprt-site] img,
[data-sprt-site] video,
[data-sprt-site] iframe {
    display: block;
    max-width: 100%;
}

[data-sprt-site] img {
    height: auto;
}

[data-sprt-site] a {
    color: inherit;
    text-decoration-thickness: 0.08em;
    text-underline-offset: 0.2em;
}

[data-sprt-site] button,
[data-sprt-site] input,
[data-sprt-site] select,
[data-sprt-site] textarea {
    font: inherit;
}

[data-sprt-site] button,
[data-sprt-site] a {
    -webkit-tap-highlight-color: transparent;
}

[data-sprt-site] :focus-visible {
    outline: 3px solid var(--sprt-accent-strong);
    outline-offset: 4px;
}

.sprt-container {
    width: min(100% - (2 * var(--sprt-gutter)), var(--sprt-container));
    margin-inline: auto;
}

.sprt-main {
    min-height: 70vh;
}

.sprt-sr-only,
.sprt-live-region {
    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;
}

.sprt-skip-link {
    position: fixed;
    z-index: 10000;
    top: 0.75rem;
    left: 0.75rem;
    padding: 0.75rem 1rem;
    transform: translateY(-160%);
    background: var(--sprt-paper);
    color: var(--sprt-ink);
    font-weight: 800;
    transition: transform 180ms ease;
}

.sprt-skip-link:focus {
    transform: translateY(0);
}

.sprt-kicker,
.sprt-score-label {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    color: var(--sprt-accent-strong);
    font-family: var(--sprt-mono);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.11em;
    line-height: 1.3;
    text-transform: uppercase;
}

.sprt-kicker::before {
    width: 1.5rem;
    height: 2px;
    background: currentColor;
    content: "";
}

.sprt-section {
    position: relative;
    padding-block: var(--sprt-section);
}

.sprt-section--muted {
    background: var(--sprt-bg-elevated);
    border-block: 1px solid var(--sprt-line);
}

.sprt-section--red {
    overflow: hidden;
    background: var(--sprt-accent);
    color: #fff;
}

.sprt-section--red .sprt-kicker {
    color: #fff;
}

.sprt-section--red::after {
    position: absolute;
    right: -12vw;
    bottom: -50%;
    width: 60vw;
    aspect-ratio: 1;
    border: min(10vw, 9rem) solid rgba(0, 0, 0, 0.12);
    border-radius: 50%;
    content: "";
}

.sprt-section-heading {
    display: grid;
    gap: 1.5rem;
    align-items: end;
    margin-bottom: clamp(2rem, 6vw, 4.5rem);
}

.sprt-section-heading h2,
.sprt-contact-band h2,
.sprt-footer__lead h2,
.sprt-trial-teaser h2,
.sprt-about-teaser h2,
.sprt-faq-section h2,
.sprt-pricing-note blockquote {
    max-width: 18ch;
    margin: 0.75rem 0 0;
    font-family: var(--sprt-display);
    font-size: clamp(2.15rem, 6.5vw, 5rem);
    font-stretch: condensed;
    font-weight: 900;
    letter-spacing: -0.035em;
    line-height: 0.95;
    text-transform: uppercase;
}

.sprt-section-heading > p,
.sprt-trial-teaser p,
.sprt-about-teaser p,
.sprt-contact-band p {
    max-width: 38rem;
    margin: 0;
    color: var(--sprt-text-soft);
    font-size: clamp(1rem, 1.8vw, 1.15rem);
}

[data-sprt-reveal] {
    opacity: 1;
    transform: none;
    filter: none;
    transition:
        opacity 850ms var(--sprt-ease) var(--sprt-reveal-delay, 0ms),
        transform 850ms var(--sprt-ease) var(--sprt-reveal-delay, 0ms),
        filter 650ms ease var(--sprt-reveal-delay, 0ms);
}

.sprt-js [data-sprt-reveal]:not(.is-visible) {
    opacity: 0;
    transform: translate3d(-2.75rem, 0.35rem, 0);
    filter: blur(1px);
}

.sprt-js [data-sprt-reveal]:focus-within {
    opacity: 1;
    transform: none;
    filter: none;
    transition: none;
}

[data-sprt-reveal].is-visible,
.sprt-no-js [data-sprt-reveal] {
    opacity: 1;
    transform: none;
    filter: none;
}

/* Header and navigation */
.sprt-header {
    position: sticky;
    z-index: 500;
    top: 0;
    border-bottom: 1px solid var(--sprt-line);
    background: var(--sprt-header-bg);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
}

.admin-bar .sprt-header {
    top: 32px;
}

.sprt-capacity {
    border-bottom: 1px solid rgba(255, 255, 255, 0.18);
    background: var(--sprt-accent);
    color: #fff;
    font-family: var(--sprt-mono);
    font-size: 0.69rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.sprt-capacity__inner {
    display: flex;
    min-height: 2.15rem;
    align-items: center;
    gap: 0.55rem;
}

.sprt-capacity__inner > span:nth-child(2) {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sprt-capacity a {
    margin-left: auto;
    white-space: nowrap;
}

.sprt-live-dot {
    flex: 0 0 auto;
    width: 0.46rem;
    height: 0.46rem;
    border: 2px solid #fff;
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.15);
}

.sprt-header__bar {
    display: flex;
    min-height: 4.6rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.sprt-brand {
    position: relative;
    z-index: 3;
    display: inline-flex;
    min-width: 8rem;
    align-items: center;
    text-decoration: none;
}

.sprt-wordmark {
    display: inline-grid;
    grid-template-columns: auto 0.55rem;
    grid-template-rows: auto auto;
    align-items: center;
    column-gap: 0.38rem;
    font-family: var(--sprt-display);
    font-weight: 900;
    letter-spacing: -0.05em;
    line-height: 0.8;
    text-transform: uppercase;
}

.sprt-wordmark > span {
    font-size: 1.75rem;
}

.sprt-wordmark > i {
    width: 0.5rem;
    height: 0.5rem;
    align-self: start;
    margin-top: 0.1rem;
    border-radius: 50%;
    background: var(--sprt-accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--sprt-accent), transparent 75%);
}

.sprt-wordmark > small {
    grid-column: 1 / -1;
    margin-top: 0.38rem;
    font-family: var(--sprt-mono);
    font-size: 0.48rem;
    letter-spacing: 0.31em;
    line-height: 1;
}

.sprt-brand__image {
    display: none;
    width: auto;
    max-width: 11rem;
    max-height: 2.8rem;
    object-fit: contain;
}

.sprt-brand__image--default {
    display: block;
}

html[data-sprt-theme="dark"] .sprt-brand__image--dark,
html[data-sprt-theme="light"] .sprt-brand__image--light {
    display: block;
}

html[data-sprt-theme="dark"] .sprt-brand__image--dark ~ .sprt-brand__image--default,
html[data-sprt-theme="light"] .sprt-brand__image--light ~ .sprt-brand__image--default {
    display: none;
}

.sprt-header__actions {
    position: relative;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 0.45rem;
}

.sprt-icon-button,
.sprt-menu-button {
    display: inline-flex;
    min-width: 2.8rem;
    min-height: 2.8rem;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--sprt-line);
    border-radius: var(--sprt-radius);
    background: transparent;
    color: var(--sprt-text);
    cursor: pointer;
}

.sprt-icon-button:hover,
.sprt-menu-button:hover {
    border-color: var(--sprt-accent);
    color: var(--sprt-accent-strong);
}

.sprt-theme-icon {
    position: relative;
    width: 1rem;
    height: 1rem;
    border: 2px solid currentColor;
    border-radius: 50%;
}

.sprt-theme-icon::after {
    position: absolute;
    inset: 2px 2px 2px 50%;
    background: currentColor;
    content: "";
}

.sprt-theme-picker {
    position: relative;
}

.sprt-theme-menu {
    position: absolute;
    z-index: 20;
    top: calc(100% + 0.65rem);
    right: 0;
    width: 10rem;
    padding: 0.4rem;
    border: 1px solid var(--sprt-line-strong);
    background: var(--sprt-bg-elevated);
    box-shadow: var(--sprt-shadow);
}

.sprt-theme-menu button {
    display: flex;
    width: 100%;
    min-height: 2.7rem;
    align-items: center;
    border: 0;
    background: transparent;
    color: var(--sprt-text);
    cursor: pointer;
    font-size: 0.84rem;
    font-weight: 700;
    text-align: left;
}

.sprt-theme-menu button::before {
    width: 0.5rem;
    height: 0.5rem;
    margin-inline: 0.5rem 0.7rem;
    border: 1px solid currentColor;
    border-radius: 50%;
    content: "";
}

.sprt-theme-menu button[aria-checked="true"] {
    background: var(--sprt-surface);
    color: var(--sprt-accent-strong);
}

.sprt-theme-menu button[aria-checked="true"]::before {
    background: currentColor;
}

.sprt-menu-button {
    gap: 0.55rem;
    padding-inline: 0.75rem;
    font-family: var(--sprt-mono);
    font-size: 0.7rem;
    font-weight: 800;
    text-transform: uppercase;
}

.sprt-menu-button__lines {
    display: grid;
    width: 1rem;
    gap: 0.28rem;
}

.sprt-menu-button__lines i {
    display: block;
    width: 100%;
    height: 2px;
    background: currentColor;
    transition: transform 240ms ease;
}

.sprt-menu-button[aria-expanded="true"] i:first-child {
    transform: translateY(3px) rotate(45deg);
}

.sprt-menu-button[aria-expanded="true"] i:last-child {
    transform: translateY(-3px) rotate(-45deg);
}

.sprt-nav {
    position: fixed;
    z-index: 2;
    inset: 0 0 auto;
    display: flex;
    width: 100%;
    height: 100dvh;
    min-height: 100vh;
    flex-direction: column;
    overflow-y: auto;
    padding: clamp(7rem, 20vh, 10rem) var(--sprt-gutter) 2rem;
    clip-path: inset(0 0 0 100%);
    opacity: 0;
    background:
        linear-gradient(135deg, transparent 55%, rgba(225, 6, 0, 0.22) 55.2%, transparent 76%),
        var(--sprt-bg);
    visibility: hidden;
    transition: clip-path 440ms var(--sprt-ease), opacity 220ms ease, visibility 440ms;
}

.sprt-nav:not(.is-open) {
    pointer-events: none;
}

.sprt-nav.is-open {
    clip-path: inset(0);
    opacity: 1;
    visibility: visible;
}

.sprt-no-js .sprt-header__bar {
    flex-wrap: wrap;
}

.sprt-no-js .sprt-theme-picker,
.sprt-no-js .sprt-menu-button,
.sprt-no-js .sprt-nav__rail {
    display: none;
}

.sprt-no-js .sprt-nav {
    position: static;
    order: 4;
    width: 100%;
    height: auto;
    min-height: 0;
    overflow: visible;
    padding: 0 0 1rem;
    clip-path: none;
    opacity: 1;
    background: transparent;
    visibility: visible;
    transition: none;
    pointer-events: auto;
}

.sprt-no-js .sprt-nav ul {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 1rem;
    padding-bottom: 0.5rem;
}

.sprt-no-js .sprt-nav li {
    border: 0;
}

.sprt-no-js .sprt-nav li a {
    min-height: 2.75rem;
    font-family: var(--sprt-font);
    font-size: 0.78rem;
    letter-spacing: 0.03em;
}

.sprt-no-js .sprt-nav li a::after {
    display: none;
}

.sprt-no-js .sprt-nav__cta {
    align-self: flex-start;
    margin-top: 0;
}

.sprt-nav__rail {
    display: flex;
    justify-content: space-between;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--sprt-line);
    color: var(--sprt-text-soft);
    font-family: var(--sprt-mono);
    font-size: 0.65rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.sprt-nav ul {
    display: grid;
    margin: 0;
    padding: 1.2rem 0 2rem;
    list-style: none;
}

.sprt-nav li {
    border-bottom: 1px solid var(--sprt-line);
}

.sprt-nav li a {
    display: flex;
    min-height: 4rem;
    align-items: center;
    justify-content: space-between;
    font-family: var(--sprt-display);
    font-size: clamp(1.8rem, 8vw, 3rem);
    font-weight: 900;
    letter-spacing: -0.02em;
    line-height: 1;
    text-decoration: none;
    text-transform: uppercase;
}

.sprt-nav li a::after {
    color: var(--sprt-accent-strong);
    content: "↗";
    font-family: var(--sprt-font);
    font-size: 1rem;
}

.sprt-nav li a[aria-current="page"] {
    color: var(--sprt-accent-strong);
}

.sprt-nav__cta {
    margin-top: auto;
}

/* Buttons and links */
.sprt-button {
    display: inline-flex;
    min-height: 3rem;
    align-items: center;
    justify-content: center;
    gap: 0.7rem;
    padding: 0.72rem 1.1rem;
    border: 1px solid transparent;
    border-radius: var(--sprt-radius);
    cursor: pointer;
    font-size: 0.78rem;
    font-weight: 850;
    letter-spacing: 0.045em;
    line-height: 1.2;
    text-align: center;
    text-decoration: none !important;
    text-transform: uppercase;
    transition: background 200ms ease, border-color 200ms ease, color 200ms ease, transform 200ms var(--sprt-ease);
}

.sprt-button:hover {
    transform: translateY(-2px);
}

.sprt-button--large {
    min-height: 3.55rem;
    padding-inline: 1.4rem;
}

.sprt-button--primary {
    border-color: var(--sprt-accent);
    background: var(--sprt-accent);
    color: #fff;
}

.sprt-button--primary:hover {
    border-color: var(--sprt-accent-action);
    background: var(--sprt-accent-action);
}

.sprt-button--secondary {
    border-color: var(--sprt-blue);
    background: var(--sprt-blue);
    color: #ffffff;
}

.sprt-button--secondary:hover {
    border-color: color-mix(in srgb, var(--sprt-blue), #000000 18%);
    background: color-mix(in srgb, var(--sprt-blue), #000000 18%);
}

.sprt-button--ghost {
    border-color: var(--sprt-line-strong);
    background: transparent;
    color: var(--sprt-text);
}

.sprt-button--ghost:hover {
    border-color: var(--sprt-accent);
    color: var(--sprt-accent-strong);
}

.sprt-button[disabled],
.sprt-button.is-loading {
    opacity: 0.58;
    cursor: wait;
    transform: none;
}

.sprt-button-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
}

.sprt-arrow-link {
    display: inline-flex;
    min-height: 2.75rem;
    align-items: center;
    gap: 0.6rem;
    color: var(--sprt-text);
    font-size: 0.8rem;
    font-weight: 850;
    letter-spacing: 0.05em;
    text-decoration: none !important;
    text-transform: uppercase;
}

.sprt-arrow-link:hover {
    color: var(--sprt-accent-strong);
}

.sprt-text-button {
    min-height: 2.75rem;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    font-size: 0.77rem;
    font-weight: 750;
    text-decoration: underline;
    text-underline-offset: 0.25rem;
}

.sprt-text-button:disabled {
    opacity: 0.45;
    cursor: default;
}

/* Home hero */
.sprt-hero {
    position: relative;
    isolation: isolate;
    display: grid;
    min-height: min(850px, calc(100svh - 5rem));
    align-items: center;
    overflow: hidden;
    background:
        radial-gradient(circle at 78% 30%, rgba(225, 6, 0, 0.2), transparent 30%),
        linear-gradient(110deg, var(--sprt-bg) 0 45%, color-mix(in srgb, var(--sprt-bg), #35110f 22%) 100%);
}

.sprt-hero::before {
    position: absolute;
    z-index: -1;
    inset: 0;
    background-image: linear-gradient(var(--sprt-line) 1px, transparent 1px), linear-gradient(90deg, var(--sprt-line) 1px, transparent 1px);
    background-size: clamp(3rem, 8vw, 7rem) clamp(3rem, 8vw, 7rem);
    content: "";
    mask-image: linear-gradient(to right, transparent, #000 55%, transparent);
    opacity: 0.35;
}

.sprt-hero__grid {
    display: grid;
    gap: clamp(3rem, 8vw, 6rem);
    padding-block: clamp(4rem, 10vh, 8rem);
}

.sprt-hero__copy h1 {
    max-width: 12ch;
    margin: 1rem 0 1.35rem;
    font-family: var(--sprt-display);
    font-size: clamp(3.1rem, 11vw, 8.8rem);
    font-weight: 900;
    letter-spacing: -0.055em;
    line-height: 0.82;
    text-transform: uppercase;
}

.sprt-hero__copy h1::first-line {
    color: var(--sprt-text);
}

.sprt-hero__copy > p {
    max-width: 42rem;
    margin: 0 0 2rem;
    color: var(--sprt-text-soft);
    font-size: clamp(1rem, 2vw, 1.23rem);
}

.sprt-hero__board {
    position: relative;
    align-self: center;
    padding: clamp(1rem, 4vw, 2rem);
    border: 1px solid var(--sprt-line-strong);
    background: color-mix(in srgb, var(--sprt-bg-elevated), transparent 8%);
    box-shadow: var(--sprt-shadow);
}

.sprt-hero__board::before {
    position: absolute;
    top: -1px;
    left: -1px;
    width: 38%;
    height: 4px;
    background: var(--sprt-accent);
    content: "";
}

.sprt-hero__board > :not(.sprt-hero__media) {
    position: relative;
    z-index: 1;
}

.sprt-hero__media {
    position: absolute;
    z-index: 0;
    inset: 0;
    overflow: hidden;
    opacity: 0.18;
}

.sprt-hero__media::after {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(9, 9, 9, 0.1), rgba(9, 9, 9, 0.94));
    content: "";
}

.sprt-hero__media img,
.sprt-hero__media video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.sprt-board__top,
.sprt-board__ticker {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    color: var(--sprt-text-soft);
    font-family: var(--sprt-mono);
    font-size: 0.63rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.sprt-board__top strong {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    color: var(--sprt-accent-strong);
}

.sprt-board__top strong::before {
    width: 0.45rem;
    height: 0.45rem;
    border-radius: 50%;
    background: currentColor;
    content: "";
    animation: sprt-pulse 1.7s ease-in-out infinite;
}

.sprt-board__score {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    margin-block: 2rem;
    font-family: var(--sprt-display);
    font-size: clamp(2.3rem, 10vw, 5rem);
    font-weight: 900;
    letter-spacing: -0.04em;
    line-height: 0.9;
    text-align: center;
    text-transform: uppercase;
}

.sprt-board__score b {
    color: var(--sprt-accent-strong);
}

.sprt-board__message {
    padding-block: 1rem;
    border-block: 1px solid var(--sprt-line);
    font-size: 0.83rem;
    font-weight: 750;
    text-align: center;
    text-transform: uppercase;
}

.sprt-board__ticker {
    margin-top: 1.15rem;
}

.sprt-orbit {
    position: absolute;
    z-index: -1;
    right: -2.4rem;
    bottom: -2.4rem;
    width: 7rem;
    aspect-ratio: 1;
    border: 1px solid var(--sprt-line-strong);
    border-radius: 50%;
    animation: sprt-spin 16s linear infinite;
}

.sprt-orbit i {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0.55rem;
    height: 0.55rem;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: var(--sprt-accent);
}

.sprt-orbit i:nth-child(2) { transform: translate(-50%, -50%) translateX(3.45rem); }
.sprt-orbit i:nth-child(3) { transform: translate(-50%, -50%) translateX(-3.45rem); }

.sprt-scroll-cue {
    position: absolute;
    right: var(--sprt-gutter);
    bottom: 1.2rem;
    display: flex;
    align-items: center;
    gap: 0.7rem;
    color: var(--sprt-text-soft) !important;
    font-family: var(--sprt-mono);
    font-size: 0.63rem;
    letter-spacing: 0.12em;
    text-decoration: none !important;
    text-transform: uppercase;
}

.sprt-scroll-cue i {
    display: block;
    width: 1px;
    height: 2.4rem;
    background: linear-gradient(var(--sprt-accent) 50%, var(--sprt-line) 50%);
    animation: sprt-scroll 1.8s ease-in-out infinite;
}

@keyframes sprt-pulse { 50% { opacity: 0.3; transform: scale(0.78); } }
@keyframes sprt-spin { to { transform: rotate(360deg); } }
@keyframes sprt-scroll { 50% { transform: translateY(0.5rem); } }

/* Score strip and home content */
.sprt-score-strip {
    border-block: 1px solid var(--sprt-line);
    background: var(--sprt-bg-elevated);
}

.sprt-score-strip__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}

.sprt-score-strip__grid > div {
    min-width: 0;
    padding: 1.5rem 0.9rem;
    border-right: 1px solid var(--sprt-line);
    border-bottom: 1px solid var(--sprt-line);
}

.sprt-score-strip__grid > div:nth-child(even) { border-right: 0; }

.sprt-score-strip strong {
    display: block;
    color: var(--sprt-accent-strong);
    font-family: var(--sprt-display);
    font-size: clamp(2.4rem, 8vw, 5rem);
    font-weight: 900;
    letter-spacing: -0.04em;
    line-height: 0.8;
}

.sprt-score-strip span {
    display: block;
    max-width: 14rem;
    margin-top: 0.7rem;
    color: var(--sprt-text-soft);
    font-size: 0.73rem;
    font-weight: 700;
    line-height: 1.35;
    text-transform: uppercase;
}

.sprt-case-teaser__grid,
.sprt-trial-teaser__grid,
.sprt-about-teaser__grid,
.sprt-contact-band__grid,
.sprt-faq-section__grid,
.sprt-modules-grid,
.sprt-about-profile__grid,
.sprt-form-section__grid,
.sprt-boundary-grid,
.sprt-legal__grid,
.sprt-case-content,
.sprt-single-work__grid {
    display: grid;
    gap: clamp(2rem, 7vw, 6rem);
    align-items: center;
}

.sprt-case-teaser__visual {
    position: relative;
    display: grid;
    min-height: clamp(18rem, 60vw, 32rem);
    place-items: center;
    overflow: hidden;
    border: 1px solid var(--sprt-line-strong);
    background:
        linear-gradient(125deg, transparent 0 43%, rgba(225, 6, 0, 0.9) 43.2% 56%, transparent 56.2%),
        repeating-linear-gradient(90deg, transparent 0 4rem, var(--sprt-line) 4rem calc(4rem + 1px)),
        var(--sprt-surface);
}

.sprt-case-teaser__visual > div {
    display: grid;
    text-align: center;
}

.sprt-case-teaser__visual span,
.sprt-case-teaser__visual small {
    font-family: var(--sprt-mono);
    font-size: 0.65rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
}

.sprt-case-teaser__visual strong {
    font-family: var(--sprt-display);
    font-size: clamp(5rem, 20vw, 10rem);
    line-height: 0.8;
}

.sprt-case-teaser__visual small {
    position: absolute;
    right: 1rem;
    bottom: 1rem;
    padding: 0.4rem 0.55rem;
    background: var(--sprt-bg);
}

.sprt-case-teaser h2,
.sprt-modules-grid h2,
.sprt-trial-overview h2,
.sprt-form-section h2,
.sprt-about-profile h2 {
    margin: 0.9rem 0 1.3rem;
    font-family: var(--sprt-display);
    font-size: clamp(2.4rem, 7vw, 5.2rem);
    font-weight: 900;
    letter-spacing: -0.04em;
    line-height: 0.92;
    text-transform: uppercase;
}

.sprt-case-teaser p,
.sprt-modules-grid p,
.sprt-trial-overview p,
.sprt-form-section > .sprt-container > div > p,
.sprt-about-profile p {
    color: var(--sprt-text-soft);
}

.sprt-problem-grid,
.sprt-service-grid,
.sprt-competency-grid,
.sprt-contact-expectations {
    display: grid;
    gap: 1px;
    border: 1px solid var(--sprt-line);
    background: var(--sprt-line);
}

.sprt-problem-grid article,
.sprt-service-grid article,
.sprt-competency-grid article,
.sprt-contact-expectations article {
    position: relative;
    min-height: 15rem;
    padding: clamp(1.35rem, 4vw, 2.2rem);
    background: var(--sprt-bg-elevated);
}

.sprt-service-grid article {
    background: var(--sprt-bg);
}

.sprt-problem-grid article > span,
.sprt-service-grid article > span,
.sprt-competency-grid article > span,
.sprt-contact-expectations article > span {
    color: var(--sprt-accent-strong);
    font-family: var(--sprt-mono);
    font-size: 0.7rem;
}

.sprt-problem-grid h3,
.sprt-service-grid h3,
.sprt-competency-grid h3,
.sprt-contact-expectations h3 {
    max-width: 15ch;
    margin: 3rem 0 0.8rem;
    font-family: var(--sprt-display);
    font-size: clamp(1.65rem, 4vw, 2.35rem);
    font-weight: 900;
    letter-spacing: -0.02em;
    line-height: 0.95;
    text-transform: uppercase;
}

.sprt-problem-grid p,
.sprt-service-grid p,
.sprt-competency-grid p,
.sprt-contact-expectations p {
    margin: 0;
    color: var(--sprt-text-soft);
    font-size: 0.9rem;
}

/* Portfolio cards */
.sprt-portfolio-preview {
    background:
        linear-gradient(135deg, transparent 70%, color-mix(in srgb, var(--sprt-accent), transparent 90%) 70.2%),
        var(--sprt-bg);
}

.sprt-work-grid {
    display: grid;
    gap: clamp(1rem, 3vw, 1.75rem);
}

.sprt-work-card {
    position: relative;
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--sprt-line);
    background: var(--sprt-bg-elevated);
    box-shadow: 0 0 0 transparent;
    transition: border-color 250ms ease, box-shadow 250ms ease, transform 250ms var(--sprt-ease);
}

.sprt-work-card:hover,
.sprt-work-card:focus-within {
    z-index: 2;
    transform: translateY(-4px);
    border-color: var(--sprt-accent);
    box-shadow: var(--sprt-shadow);
}

.sprt-work-card__open {
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    text-decoration: none;
    text-align: left;
}

.sprt-work-card__media {
    position: relative;
    overflow: hidden;
    aspect-ratio: 4 / 3;
    background: var(--sprt-surface);
}

.sprt-work-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 650ms var(--sprt-ease), filter 300ms ease;
}

.sprt-work-card:hover .sprt-work-card__media img {
    transform: scale(1.035);
}

.sprt-media-placeholder {
    position: relative;
    display: grid;
    width: 100%;
    height: 100%;
    min-height: 12rem;
    place-content: center;
    overflow: hidden;
    background:
        linear-gradient(135deg, transparent 0 49%, var(--sprt-accent) 49.5% 55%, transparent 55.5%),
        repeating-linear-gradient(90deg, transparent 0 4rem, var(--sprt-line) 4rem calc(4rem + 1px)),
        var(--sprt-surface);
    text-align: center;
}

.sprt-media-placeholder span,
.sprt-media-placeholder b {
    font-family: var(--sprt-display);
    font-size: clamp(2.8rem, 10vw, 5.5rem);
    font-weight: 900;
    letter-spacing: -0.04em;
    line-height: 0.8;
}

.sprt-media-placeholder small {
    margin-top: 0.7rem;
    font-family: var(--sprt-mono);
    font-size: 0.62rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.sprt-work-card__type,
.sprt-work-card__featured {
    position: absolute;
    top: 0.8rem;
    left: 0.8rem;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.4rem 0.55rem;
    background: rgba(9, 9, 9, 0.88);
    color: #fff;
    font-family: var(--sprt-mono);
    font-size: 0.61rem;
    font-weight: 750;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.sprt-work-card__featured {
    right: 0.8rem;
    left: auto;
    background: var(--sprt-accent);
}

.sprt-work-card__body {
    padding: clamp(1.15rem, 4vw, 1.7rem);
}

.sprt-work-card__eyebrow {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    color: var(--sprt-text-soft);
    font-family: var(--sprt-mono);
    font-size: 0.63rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.sprt-work-card__eyebrow > span:first-child {
    color: var(--sprt-accent-strong);
}

.sprt-work-card h3 {
    margin: 1.2rem 0 0.55rem;
    font-family: var(--sprt-display);
    font-size: clamp(1.65rem, 5vw, 2.45rem);
    font-weight: 900;
    letter-spacing: -0.025em;
    line-height: 0.96;
    text-transform: uppercase;
}

.sprt-work-card__club {
    color: var(--sprt-accent-strong) !important;
    font-family: var(--sprt-mono);
    font-size: 0.67rem !important;
    font-weight: 750;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.sprt-work-card__body > p {
    display: -webkit-box;
    overflow: hidden;
    margin: 0 0 1rem;
    color: var(--sprt-text-soft);
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    font-size: 0.88rem;
}

.sprt-role-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-block: 1rem;
}

.sprt-role-list > span {
    display: inline-flex;
    min-height: 1.65rem;
    align-items: center;
    padding: 0.25rem 0.45rem;
    border: 1px solid var(--sprt-line);
    color: var(--sprt-text-soft);
    font-family: var(--sprt-mono);
    font-size: 0.58rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.sprt-metrics {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    margin: 1.2rem 0 0;
    border-block: 1px solid var(--sprt-line);
}

.sprt-metrics > div {
    min-width: 0;
    padding: 0.75rem 0.45rem 0.7rem 0;
    border-right: 1px solid var(--sprt-line);
}

.sprt-metrics > div + div { padding-left: 0.6rem; }
.sprt-metrics > div:last-child { border-right: 0; }

.sprt-metrics dt {
    overflow: hidden;
    color: var(--sprt-text-soft);
    font-family: var(--sprt-mono);
    font-size: 0.52rem;
    letter-spacing: 0.04em;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.sprt-metrics dd {
    margin: 0.2rem 0 0;
    font-family: var(--sprt-display);
    font-size: 1.3rem;
    font-weight: 900;
    line-height: 1;
}

.sprt-work-card__more {
    display: flex;
    min-height: 2.8rem;
    align-items: end;
    justify-content: space-between;
    color: var(--sprt-accent-strong);
    font-size: 0.7rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.sprt-work-card__more i {
    font-size: 1.1rem;
    font-style: normal;
}

.sprt-section-action,
.sprt-load-more {
    display: flex;
    justify-content: center;
    margin-top: clamp(2rem, 5vw, 3.5rem);
}

/* Process, trial, profile, FAQ */
.sprt-process {
    position: relative;
    z-index: 1;
    display: grid;
    margin: 0;
    padding: 0;
    list-style: none;
}

.sprt-process li {
    min-height: 15rem;
    padding: 1.5rem;
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-bottom: 0;
}

.sprt-process li:last-child { border-bottom: 1px solid rgba(255, 255, 255, 0.35); }
.sprt-process li > span { font-family: var(--sprt-mono); font-size: 0.7rem; }
.sprt-process h3 { margin: 3.2rem 0 0.7rem; font-family: var(--sprt-display); font-size: 2rem; line-height: 0.95; text-transform: uppercase; }
.sprt-process p { margin: 0; font-size: 0.86rem; opacity: 1; }
.sprt-process--dark li { border-color: var(--sprt-line); }

.sprt-trial-teaser__grid,
.sprt-about-teaser__grid {
    align-items: stretch;
}

.sprt-check-list {
    display: grid;
    align-content: center;
    margin: 0;
    padding: clamp(1.5rem, 5vw, 3rem);
    border: 1px solid var(--sprt-line-strong);
    background: var(--sprt-bg-elevated);
    list-style: none;
}

.sprt-check-list li {
    position: relative;
    padding: 1rem 0 1rem 2.2rem;
    border-bottom: 1px solid var(--sprt-line);
    font-weight: 700;
}

.sprt-check-list li::before {
    position: absolute;
    top: 1.1rem;
    left: 0;
    display: grid;
    width: 1.25rem;
    height: 1.25rem;
    place-content: center;
    border-radius: 50%;
    background: var(--sprt-accent);
    color: #fff;
    content: "✓";
    font-size: 0.68rem;
}

.sprt-portrait-placeholder {
    position: relative;
    overflow: hidden;
    min-height: clamp(22rem, 80vw, 40rem);
    background: var(--sprt-surface);
}

.sprt-portrait-placeholder > img {
    width: 100%;
    height: 100%;
    min-height: inherit;
    object-fit: cover;
}

.sprt-portrait-placeholder > div {
    display: grid;
    min-height: inherit;
    place-content: center;
    background:
        linear-gradient(145deg, transparent 0 45%, rgba(225, 6, 0, 0.86) 45.2% 57%, transparent 57.2%),
        repeating-linear-gradient(90deg, transparent 0 5rem, var(--sprt-line) 5rem calc(5rem + 1px));
    text-align: center;
}

.sprt-portrait-placeholder span {
    font-family: var(--sprt-display);
    font-size: clamp(4rem, 18vw, 9rem);
    font-weight: 900;
    letter-spacing: -0.05em;
    line-height: 0.8;
}

.sprt-portrait-placeholder small {
    margin-top: 1rem;
    font-family: var(--sprt-mono);
    font-size: 0.65rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.sprt-testimonial-grid {
    display: grid;
    gap: 1rem;
}

.sprt-testimonial-grid figure {
    margin: 0;
    padding: clamp(1.5rem, 5vw, 2.5rem);
    border: 1px solid var(--sprt-line);
    background: var(--sprt-bg);
}

.sprt-testimonial-grid blockquote {
    margin: 0 0 2rem;
    font-size: clamp(1.2rem, 3vw, 1.55rem);
}

.sprt-testimonial-grid figcaption {
    color: var(--sprt-accent-strong);
    font-family: var(--sprt-mono);
    font-size: 0.7rem;
    font-weight: 750;
    text-transform: uppercase;
}

.sprt-faq-section__grid { align-items: start; }
.sprt-accordion { border-top: 1px solid var(--sprt-line); }
.sprt-accordion details { border-bottom: 1px solid var(--sprt-line); }
.sprt-accordion summary { display: flex; min-height: 4.5rem; align-items: center; justify-content: space-between; gap: 1rem; cursor: pointer; font-weight: 800; list-style: none; }
.sprt-accordion summary::-webkit-details-marker { display: none; }
.sprt-accordion summary span { position: relative; flex: 0 0 auto; width: 1.5rem; height: 1.5rem; }
.sprt-accordion summary span::before,
.sprt-accordion summary span::after { position: absolute; top: 50%; left: 50%; width: 0.9rem; height: 2px; transform: translate(-50%, -50%); background: var(--sprt-accent); content: ""; }
.sprt-accordion summary span::after { transform: translate(-50%, -50%) rotate(90deg); transition: transform 180ms ease; }
.sprt-accordion details[open] summary span::after { transform: translate(-50%, -50%) rotate(0); }
.sprt-accordion details > div { padding: 0 2.5rem 1.5rem 0; color: var(--sprt-text-soft); }

.sprt-contact-band {
    border-top: 1px solid var(--sprt-line);
    background:
        linear-gradient(115deg, transparent 0 68%, color-mix(in srgb, var(--sprt-accent), transparent 22%) 68.2% 80%, transparent 80.2%),
        var(--sprt-bg-elevated);
}

/* Footer */
.sprt-footer {
    border-top: 1px solid var(--sprt-line);
    background: #070707;
    color: #f8f7f4;
}

.sprt-footer .sprt-kicker,
.sprt-footer .sprt-score-label {
    color: #ff6b64;
}

.sprt-footer__lead {
    display: grid;
    gap: 2rem;
    align-items: end;
    padding-block: clamp(3.5rem, 8vw, 6rem);
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}

.sprt-footer__lead h2 { color: #fff; }
.sprt-footer__grid { display: grid; gap: 2.5rem; padding-block: 3.5rem; }
.sprt-footer__grid > div > p { max-width: 24rem; color: #9f9d98; font-size: 0.85rem; }
.sprt-brand--footer { color: #fff; }
.sprt-footer__grid nav,
.sprt-footer__grid > div { display: flex; flex-direction: column; align-items: flex-start; gap: 0.6rem; }
.sprt-footer__grid strong { margin-bottom: 0.55rem; color: #fff; font-family: var(--sprt-mono); font-size: 0.67rem; letter-spacing: 0.1em; text-transform: uppercase; }
.sprt-footer__grid nav a { color: #aaa8a3; font-size: 0.82rem; text-decoration: none; }
.sprt-footer__grid nav a:hover { color: #fff; }
.sprt-footer__email { color: #fff; font-size: clamp(1rem, 3vw, 1.35rem); font-weight: 800; }
.sprt-footer__bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.8rem 1.5rem; padding-block: 1.2rem; border-top: 1px solid rgba(255, 255, 255, 0.15); color: #92908b; font-size: 0.68rem; }
.sprt-footer__bottom p { margin: 0; }
.sprt-footer__bottom a { text-decoration: none; }

/* Internal page hero */
.sprt-page-hero {
    position: relative;
    overflow: hidden;
    padding-block: clamp(5rem, 12vw, 9rem);
    border-bottom: 1px solid var(--sprt-line);
    background:
        radial-gradient(circle at 80% 20%, color-mix(in srgb, var(--sprt-accent), transparent 82%), transparent 28%),
        repeating-linear-gradient(90deg, transparent 0 6rem, var(--sprt-line) 6rem calc(6rem + 1px));
}

.sprt-page-hero::after {
    position: absolute;
    right: -10%;
    bottom: -65%;
    width: min(65vw, 45rem);
    aspect-ratio: 1;
    border: clamp(2rem, 7vw, 6rem) solid color-mix(in srgb, var(--sprt-accent), transparent 86%);
    border-radius: 50%;
    content: "";
}

.sprt-page-hero__grid {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 2rem;
    align-items: end;
}

.sprt-page-hero h1 {
    max-width: 13ch;
    margin: 1rem 0 1.3rem;
    font-family: var(--sprt-display);
    font-size: clamp(3rem, 10.5vw, 8.5rem);
    font-weight: 900;
    letter-spacing: -0.055em;
    line-height: 0.84;
    text-transform: uppercase;
}

.sprt-page-hero h1 em { color: var(--sprt-accent-strong); font-style: normal; }
.sprt-page-hero p { max-width: 44rem; margin: 0 0 1.7rem; color: var(--sprt-text-soft); font-size: clamp(1rem, 2.2vw, 1.2rem); }
.sprt-page-hero__index { color: color-mix(in srgb, var(--sprt-text), transparent 82%); font-family: var(--sprt-display); font-size: clamp(6rem, 25vw, 16rem); font-weight: 900; letter-spacing: -0.08em; line-height: 0.65; text-align: right; }
.sprt-page-hero__index span { color: var(--sprt-accent); font-size: 0.5em; }

/* Portfolio filters */
.sprt-filters {
    padding: clamp(1rem, 4vw, 2rem);
    border: 1px solid var(--sprt-line);
    background: var(--sprt-bg-elevated);
}

.sprt-filters__top { display: grid; gap: 1.5rem; align-items: end; }
.sprt-filters h2 { margin: 0.5rem 0 0; font-family: var(--sprt-display); font-size: clamp(2rem, 5vw, 3.5rem); line-height: 0.95; text-transform: uppercase; }
.sprt-filters__grid { display: grid; gap: 0.9rem; margin-top: 1.7rem; }
.sprt-filters__footer { display: flex; flex-wrap: wrap; align-items: center; gap: 0.7rem 1.2rem; margin-top: 1.25rem; padding-top: 1.25rem; border-top: 1px solid var(--sprt-line); }
.sprt-filters__footer > span { margin-left: auto; color: var(--sprt-text-soft); font-family: var(--sprt-mono); font-size: 0.65rem; }

.sprt-field { display: grid; gap: 0.4rem; min-width: 0; }
.sprt-field > span,
.sprt-field > label,
.sprt-field > label:first-child { color: var(--sprt-text-soft); font-family: var(--sprt-mono); font-size: 0.64rem; font-weight: 750; letter-spacing: 0.05em; text-transform: uppercase; }
.sprt-field input,
.sprt-field select,
.sprt-field textarea {
    width: 100%;
    min-height: 3.2rem;
    padding: 0.7rem 0.85rem;
    border: 1px solid var(--sprt-line-strong);
    border-radius: 0;
    background: var(--sprt-bg);
    color: var(--sprt-text);
    transition: border-color 160ms ease, box-shadow 160ms ease;
}
.sprt-field textarea { min-height: 8rem; resize: vertical; }
.sprt-field input:hover,
.sprt-field select:hover,
.sprt-field textarea:hover { border-color: var(--sprt-text-soft); }
.sprt-field input:focus,
.sprt-field select:focus,
.sprt-field textarea:focus { border-color: var(--sprt-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--sprt-accent), transparent 78%); outline: 0; }
.sprt-field [aria-invalid="true"] { border-color: var(--sprt-error); }
.sprt-field--search > div { display: grid; grid-template-columns: 1fr 3.2rem; }
.sprt-field--search button { border: 1px solid var(--sprt-accent); background: var(--sprt-accent); color: #fff; cursor: pointer; }
.sprt-field__error { color: var(--sprt-error); font-size: 0.75rem; }

.sprt-results-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.5rem 1rem; margin-block: 2rem 1rem; padding-bottom: 0.85rem; border-bottom: 1px solid var(--sprt-line); }
.sprt-results-bar p { margin: 0; font-weight: 800; }
.sprt-results-bar span { color: var(--sprt-text-soft); font-size: 0.7rem; }
.sprt-load-more { position: relative; }
.sprt-load-sentinel { position: absolute; bottom: -1rem; width: 1px; height: 1px; }

.sprt-empty-state {
    grid-column: 1 / -1;
    width: 100%;
    padding: clamp(2.5rem, 8vw, 6rem) clamp(1.25rem, 5vw, 3rem);
    border: 1px dashed var(--sprt-line-strong);
    background: var(--sprt-bg-elevated);
    text-align: center;
}
.sprt-empty-state > span { color: var(--sprt-accent-strong); font-family: var(--sprt-mono); font-size: 0.65rem; }
.sprt-empty-state h2,
.sprt-empty-state h3 { max-width: 22ch; margin: 1rem auto; font-family: var(--sprt-display); font-size: clamp(2rem, 6vw, 4rem); line-height: 0.95; text-transform: uppercase; }
.sprt-empty-state p { max-width: 38rem; margin: 0 auto 1.5rem; color: var(--sprt-text-soft); }

/* Modal */
.sprt-modal {
    position: fixed;
    z-index: 2000;
    inset: 0;
    display: grid;
    place-items: center;
    padding: max(0.75rem, env(safe-area-inset-top)) max(0.75rem, env(safe-area-inset-right)) max(0.75rem, env(safe-area-inset-bottom)) max(0.75rem, env(safe-area-inset-left));
}

.sprt-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.82);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}

.sprt-modal__dialog {
    position: relative;
    display: grid;
    width: min(100%, 69rem);
    max-height: min(92svh, 58rem);
    grid-template-rows: auto minmax(0, 1fr) auto;
    overflow: hidden;
    border: 1px solid var(--sprt-line-strong);
    background: var(--sprt-bg-elevated);
    box-shadow: var(--sprt-shadow);
}

.sprt-modal__header,
.sprt-modal__footer {
    display: flex;
    min-height: 3.8rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.65rem 0.9rem;
    border-bottom: 1px solid var(--sprt-line);
}
.sprt-modal__footer { border-top: 1px solid var(--sprt-line); border-bottom: 0; }
.sprt-modal__footer > span { color: var(--sprt-text-soft); font-family: var(--sprt-mono); font-size: 0.63rem; }
.sprt-modal__close span,
.sprt-consent-modal .sprt-icon-button span { font-size: 1.65rem; font-weight: 300; line-height: 1; }
.sprt-modal__scroll { overflow: auto; overscroll-behavior: contain; }
.sprt-modal__media { position: relative; min-height: 12rem; background: var(--sprt-surface); }
.sprt-modal__media img { width: 100%; max-height: 65svh; object-fit: contain; background: #060606; }
.sprt-modal__media iframe { width: 100%; min-height: min(60svh, 38rem); border: 0; }
.sprt-modal__content { padding: clamp(1.2rem, 5vw, 3rem); }
.sprt-modal__content h2 { margin: 0.7rem 0 1.3rem; font-family: var(--sprt-display); font-size: clamp(2rem, 7vw, 4.6rem); line-height: 0.9; text-transform: uppercase; }
.sprt-modal__copy { color: var(--sprt-text-soft); }
.sprt-modal__copy > :first-child { margin-top: 0; }
.sprt-modal__snapshot { color: var(--sprt-text-soft); font-family: var(--sprt-mono); font-size: 0.65rem; }
.sprt-modal__external { margin-top: 1.4rem; padding: 1rem; border: 1px solid var(--sprt-line); background: var(--sprt-bg); }
.sprt-modal__external p { margin-top: 0; color: var(--sprt-text-soft); font-size: 0.82rem; }
.sprt-metrics--modal { grid-template-columns: repeat(2, 1fr); }

/* Forms */
.sprt-form {
    padding: clamp(1.15rem, 4vw, 2rem);
    border: 1px solid var(--sprt-line-strong);
    background: var(--sprt-bg-elevated);
}
.sprt-form__grid { display: grid; gap: 1rem; }
.sprt-form__status { margin-bottom: 1rem; }
.sprt-form__status:empty { display: none; }
.sprt-form__status.is-success { padding: 1rem; border: 1px solid var(--sprt-success); background: color-mix(in srgb, var(--sprt-success), transparent 88%); color: var(--sprt-text); }
.sprt-form__status.is-error { padding: 1rem; border: 1px solid var(--sprt-error); background: color-mix(in srgb, var(--sprt-error), transparent 90%); }
.sprt-form__status ul { margin-bottom: 0; padding-left: 1.3rem; }
.sprt-form > .sprt-button { width: 100%; margin-top: 1.3rem; }
.sprt-field--wide { grid-column: 1 / -1; }
.sprt-check { display: grid; min-height: 2.75rem; grid-template-columns: auto 1fr; align-items: center; gap: 0.75rem; cursor: pointer; color: var(--sprt-text-soft); font-size: 0.8rem; }
.sprt-check input { width: 1.25rem; height: 1.25rem; margin-top: 0.15rem; accent-color: var(--sprt-accent); }
.sprt-hp { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.sprt-form-note { margin-top: 2rem; padding: 1rem; border-left: 3px solid var(--sprt-accent); background: var(--sprt-bg-elevated); }
.sprt-form-note strong { font-family: var(--sprt-mono); font-size: 0.7rem; text-transform: uppercase; }
.sprt-form-note p { margin: 0.3rem 0 0; color: var(--sprt-text-soft); font-size: 0.83rem; }
.sprt-contact-details { margin-block: 2rem; border-top: 1px solid var(--sprt-line); }
.sprt-contact-details > div { display: grid; gap: 0.4rem; padding-block: 0.9rem; border-bottom: 1px solid var(--sprt-line); }
.sprt-contact-details dt { color: var(--sprt-text-soft); font-family: var(--sprt-mono); font-size: 0.62rem; text-transform: uppercase; }
.sprt-contact-details dd { margin: 0; font-weight: 750; }

/* Services and trial details */
.sprt-service-list { border-top: 1px solid var(--sprt-line); }
.sprt-service-list article { display: grid; gap: 1rem; padding-block: 1.5rem; border-bottom: 1px solid var(--sprt-line); transition: background 200ms ease, padding 200ms ease; }
.sprt-service-list article:hover { padding-inline: 1rem; background: var(--sprt-bg-elevated); }
.sprt-service-list__index { color: var(--sprt-accent-strong); font-family: var(--sprt-mono); font-size: 0.68rem; }
.sprt-service-list h3 { margin: 0; font-family: var(--sprt-display); font-size: clamp(1.8rem, 5vw, 3rem); line-height: 0.95; text-transform: uppercase; }
.sprt-service-list p { margin: 0.55rem 0 0; color: var(--sprt-text-soft); }
.sprt-service-list__content { color: var(--sprt-text-soft); font-size: 0.87rem; }
.sprt-service-list__content:empty { display: none; }
.sprt-service-list article > span { color: var(--sprt-accent-strong); }
.sprt-module-list { margin: 0; padding: 0; border-top: 1px solid var(--sprt-line); list-style: none; }
.sprt-module-list li { display: grid; grid-template-columns: 2.4rem 1fr; gap: 0.8rem; padding-block: 1rem; border-bottom: 1px solid var(--sprt-line); font-weight: 750; }
.sprt-module-list li span { color: var(--sprt-accent-strong); font-family: var(--sprt-mono); font-size: 0.65rem; }
.sprt-pricing-note { text-align: center; }
.sprt-pricing-note blockquote { max-width: 23ch; margin: 1.5rem auto; }
.sprt-pricing-note p { max-width: 39rem; margin-inline: auto; color: var(--sprt-text-soft); }
.sprt-trial-deliverables { margin: 0; padding: 0; border-top: 1px solid var(--sprt-line); list-style: none; }
.sprt-trial-deliverables li { display: grid; grid-template-columns: 2.3rem 1fr; gap: 1rem; padding-block: 1rem; border-bottom: 1px solid var(--sprt-line); }
.sprt-trial-deliverables li > span { color: var(--sprt-accent-strong); font-family: var(--sprt-mono); font-size: 0.65rem; }
.sprt-trial-deliverables strong { display: block; font-family: var(--sprt-display); font-size: 1.35rem; line-height: 1; text-transform: uppercase; }
.sprt-trial-deliverables p { margin: 0.35rem 0 0; font-size: 0.82rem; }
.sprt-boundary-grid article { min-height: 18rem; padding: clamp(1.5rem, 5vw, 3rem); border: 1px solid var(--sprt-line); background: var(--sprt-bg-elevated); }
.sprt-boundary-grid h3 { margin: 3rem 0 0.8rem; font-family: var(--sprt-display); font-size: clamp(2rem, 6vw, 3.4rem); line-height: 0.95; text-transform: uppercase; }
.sprt-boundary-grid p { color: var(--sprt-text-soft); }
.sprt-status-chip { display: inline-flex; min-height: 1.8rem; align-items: center; padding: 0.25rem 0.55rem; border: 1px solid var(--sprt-warning); color: var(--sprt-warning); font-family: var(--sprt-mono); font-size: 0.59rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.sprt-status-chip--yes { border-color: var(--sprt-success); color: var(--sprt-success); }

/* CV, legal, blog and articles */
.sprt-cv__toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 2rem; padding: 1rem; border: 1px solid var(--sprt-line); background: var(--sprt-bg-elevated); }
.sprt-cv__toolbar p { margin: 0; color: var(--sprt-text-soft); font-size: 0.82rem; }
.sprt-cv-sheet {
    --sprt-accent: var(--sprt-primary);
    --sprt-accent-strong: #5f00bf;
    --sprt-accent-action: #5f00bf;
    --sprt-success: #176b3a;
    --sprt-error: #a60d08;
    --sprt-warning: #775000;
    max-width: 62rem;
    margin-inline: auto;
    padding: clamp(1.3rem, 6vw, 4.5rem);
    background: #f7f6f2;
    color: #151515;
    box-shadow: var(--sprt-shadow);
}
.sprt-cv-sheet__header { display: grid; gap: 1.5rem; padding-bottom: 2rem; border-bottom: 3px solid var(--sprt-primary); }
.sprt-cv-sheet__header h2 { margin: 0.4rem 0; font-family: var(--sprt-display); font-size: clamp(2.8rem, 9vw, 6rem); line-height: 0.82; text-transform: uppercase; }
.sprt-cv-sheet__header p { margin: 0; color: #56534d; }
.sprt-cv-sheet__header > div:last-child { display: flex; flex-direction: column; align-items: flex-start; gap: 0.3rem; font-size: 0.78rem; }
.sprt-cv-sheet__content { padding-block: 2.5rem; }
.sprt-cv-placeholder { margin-block: 2rem; padding: 2rem; border: 1px dashed #8d8981; }
.sprt-cv-placeholder h2 { font-family: var(--sprt-display); font-size: 2rem; line-height: 1; text-transform: uppercase; }
.sprt-cv-sheet__grid { display: grid; gap: 2rem; padding-top: 2rem; border-top: 1px solid #c5c1b8; }
.sprt-cv-sheet__grid h2 { font-family: var(--sprt-display); font-size: 1.55rem; text-transform: uppercase; }
.sprt-cv-sheet__grid ul { padding-left: 1.2rem; }

.sprt-prose { min-width: 0; font-size: clamp(1rem, 1.6vw, 1.08rem); }
.sprt-prose > :first-child { margin-top: 0; }
.sprt-prose > :last-child { margin-bottom: 0; }
.sprt-prose h2,
.sprt-prose h3 { margin: 2em 0 0.65em; font-family: var(--sprt-display); font-weight: 900; letter-spacing: -0.02em; line-height: 1; text-transform: uppercase; }
.sprt-prose h2 { font-size: clamp(2rem, 5vw, 3.5rem); }
.sprt-prose h3 { font-size: clamp(1.5rem, 4vw, 2.2rem); }
.sprt-prose p,
.sprt-prose li { color: color-mix(in srgb, currentColor, transparent 18%); }
.sprt-prose a { color: var(--sprt-accent-strong); }
.sprt-prose blockquote { margin: 2rem 0; padding: 1.2rem 0 1.2rem 1.5rem; border-left: 4px solid var(--sprt-accent); font-size: 1.25em; }
.sprt-prose table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; }
.sprt-prose th,
.sprt-prose td { padding: 0.7rem; border: 1px solid var(--sprt-line); text-align: left; }

.sprt-legal__grid { align-items: start; }
.sprt-legal aside { position: sticky; top: 9rem; padding: 1.2rem; border: 1px solid var(--sprt-warning); background: color-mix(in srgb, var(--sprt-warning), transparent 93%); }
.sprt-legal aside p { color: var(--sprt-text-soft); font-size: 0.82rem; }
.sprt-legal__updated { margin-top: 3rem !important; padding-top: 1rem; border-top: 1px solid var(--sprt-line); font-family: var(--sprt-mono); font-size: 0.65rem; }

.sprt-post-grid { display: grid; gap: 1.25rem; }
.sprt-post-card { overflow: hidden; border: 1px solid var(--sprt-line); background: var(--sprt-bg-elevated); }
.sprt-post-card__media { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: var(--sprt-surface); text-decoration: none; }
.sprt-post-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 550ms var(--sprt-ease); }
.sprt-post-card:hover .sprt-post-card__media img { transform: scale(1.035); }
.sprt-post-card__body { padding: clamp(1.2rem, 4vw, 1.8rem); }
.sprt-post-card h3 { margin: 1.2rem 0 0.8rem; font-family: var(--sprt-display); font-size: clamp(1.8rem, 5vw, 2.7rem); line-height: 0.95; text-transform: uppercase; }
.sprt-post-card h3 a { text-decoration: none; }
.sprt-post-card p { color: var(--sprt-text-soft); }
.sprt-pagination { margin-top: 3rem; }
.sprt-pagination ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.45rem; margin: 0; padding: 0; list-style: none; }
.sprt-pagination a,
.sprt-pagination span { display: grid; min-width: 2.8rem; min-height: 2.8rem; place-items: center; border: 1px solid var(--sprt-line); text-decoration: none; }
.sprt-pagination .current { border-color: var(--sprt-accent); background: var(--sprt-accent); color: #fff; }

.sprt-article__header { padding-block: clamp(4rem, 10vw, 8rem); border-bottom: 1px solid var(--sprt-line); background: var(--sprt-bg-elevated); }
.sprt-article__header-grid { display: grid; gap: 2rem; align-items: end; }
.sprt-article__header h1 { max-width: 15ch; margin: 1rem 0 1.4rem; font-family: var(--sprt-display); font-size: clamp(3rem, 9vw, 7rem); line-height: 0.86; text-transform: uppercase; }
.sprt-article__meta { display: flex; flex-wrap: wrap; gap: 1rem; color: var(--sprt-text-soft); font-family: var(--sprt-mono); font-size: 0.65rem; text-transform: uppercase; }
.sprt-article__image { margin-top: clamp(1.5rem, 5vw, 4rem); }
.sprt-article__image img { width: 100%; max-height: 70vh; object-fit: cover; }
.sprt-article__layout { display: grid; gap: 2rem; padding-block: var(--sprt-section); align-items: start; }
.sprt-article__layout aside { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-bottom: 1rem; border-bottom: 1px solid var(--sprt-line); font-size: 0.75rem; }
.sprt-article__content { max-width: 48rem; }

.sprt-case-cover,
.sprt-single-work__media { margin-top: clamp(1.5rem, 5vw, 4rem); }
.sprt-case-cover img,
.sprt-single-work__media img { width: 100%; max-height: 75vh; object-fit: cover; }
.sprt-case-content,
.sprt-single-work__grid { align-items: start; }
.sprt-case-content aside,
.sprt-single-work__grid aside { padding: 1rem; border: 1px solid var(--sprt-line); background: var(--sprt-bg-elevated); }
.sprt-case-content aside p,
.sprt-single-work__grid aside p { color: var(--sprt-text-soft); font-size: 0.76rem; }
.sprt-metrics--vertical { grid-template-columns: 1fr; }
.sprt-metrics--vertical > div { border-right: 0; border-bottom: 1px solid var(--sprt-line); }
.sprt-metrics--vertical > div + div { padding-left: 0; }
.sprt-unavailable { min-height: 65vh; display: grid; align-items: center; }
.sprt-preview-notice { position: relative; z-index: 4; padding: 0.75rem var(--sprt-gutter); border-bottom: 1px solid #f1b84b; background: #f1b84b; color: #111; font-size: 0.78rem; font-weight: 800; text-align: center; }

.sprt-not-found { display: grid; min-height: 78vh; align-items: center; padding-block: 5rem; background: radial-gradient(circle at 75%, rgba(225, 6, 0, 0.18), transparent 32%); }
.sprt-not-found__grid { display: grid; gap: 3rem; align-items: center; }
.sprt-not-found h1 { max-width: 11ch; margin: 1rem 0; font-family: var(--sprt-display); font-size: clamp(3rem, 10vw, 7rem); line-height: 0.85; text-transform: uppercase; }
.sprt-not-found p { max-width: 35rem; color: var(--sprt-text-soft); }
.sprt-not-found__score { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; font-family: var(--sprt-display); font-size: clamp(7rem, 28vw, 16rem); font-weight: 900; letter-spacing: -0.08em; line-height: 0.7; text-align: center; }
.sprt-not-found__score i { color: var(--sprt-accent); font-style: normal; }
.sprt-not-found__score small { grid-column: 1 / -1; margin-top: 2rem; font-family: var(--sprt-mono); font-size: 0.7rem; letter-spacing: 0.2em; }

/* Consent */
.sprt-consent {
    position: fixed;
    z-index: 1800;
    right: max(0.75rem, env(safe-area-inset-right));
    bottom: max(0.75rem, env(safe-area-inset-bottom));
    left: max(0.75rem, env(safe-area-inset-left));
    display: grid;
    gap: 1.2rem;
    max-width: 62rem;
    margin-inline: auto;
    padding: clamp(1.1rem, 4vw, 1.8rem);
    border: 1px solid var(--sprt-line-strong);
    background: var(--sprt-bg-elevated);
    box-shadow: var(--sprt-shadow);
}
.sprt-consent h2 { margin: 0.5rem 0; font-family: var(--sprt-display); font-size: clamp(1.7rem, 5vw, 2.6rem); line-height: 0.95; text-transform: uppercase; }
.sprt-consent p { margin: 0; color: var(--sprt-text-soft); font-size: 0.8rem; }
.sprt-consent__actions { display: flex; flex-wrap: wrap; gap: 0.6rem; align-items: center; }
.sprt-consent-modal__dialog { width: min(100%, 44rem); padding-bottom: 1rem; }
.sprt-consent-modal { z-index: 2200; }
.sprt-consent-modal__dialog .sprt-modal__header h2 { margin: 0.3rem 0 0; font-family: var(--sprt-display); font-size: 1.8rem; text-transform: uppercase; }
.sprt-consent-modal form { overflow: auto; padding: 0 1rem; }
.sprt-consent-option { display: grid; grid-template-columns: 1fr auto; gap: 1rem; align-items: center; padding-block: 1rem; border-bottom: 1px solid var(--sprt-line); cursor: pointer; }
.sprt-consent-option p,
.sprt-consent-option small { display: block; margin: 0.2rem 0 0; color: var(--sprt-text-soft); font-size: 0.75rem; }
.sprt-consent-option input { width: 2.6rem; height: 1.4rem; accent-color: var(--sprt-accent); }
.sprt-consent-modal__actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; padding-top: 1rem; }
.sprt-consent-modal__actions a { font-size: 0.75rem; }

/* Breakpoints */
@media (min-width: 40rem) {
    .sprt-score-strip__grid { grid-template-columns: repeat(4, 1fr); }
    .sprt-score-strip__grid > div { padding: 2rem 1.2rem; border-bottom: 0; }
    .sprt-score-strip__grid > div:nth-child(even) { border-right: 1px solid var(--sprt-line); }
    .sprt-score-strip__grid > div:last-child { border-right: 0; }
    .sprt-problem-grid,
    .sprt-service-grid,
    .sprt-competency-grid,
    .sprt-contact-expectations { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sprt-work-grid,
    .sprt-post-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sprt-process { grid-template-columns: repeat(2, 1fr); }
    .sprt-process li { border-bottom: 1px solid rgba(255, 255, 255, 0.35); }
    .sprt-form__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sprt-filters__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sprt-cv-sheet__header,
    .sprt-cv-sheet__grid { grid-template-columns: 1.5fr 1fr; }
    .sprt-cv-sheet__header > div:last-child { align-items: flex-end; text-align: right; }
    .sprt-metrics--modal { grid-template-columns: repeat(4, 1fr); }
}

@media (min-width: 48rem) {
    .sprt-section-heading { grid-template-columns: minmax(0, 1.45fr) minmax(16rem, 0.7fr); }
    .sprt-hero__grid,
    .sprt-page-hero__grid,
    .sprt-article__header-grid { grid-template-columns: minmax(0, 1.35fr) minmax(18rem, 0.75fr); }
    .sprt-case-teaser__grid,
    .sprt-trial-teaser__grid,
    .sprt-about-teaser__grid,
    .sprt-about-profile__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sprt-faq-section__grid,
    .sprt-form-section__grid,
    .sprt-modules-grid { grid-template-columns: minmax(15rem, 0.75fr) minmax(0, 1.25fr); }
    .sprt-contact-band__grid { grid-template-columns: 1.15fr 0.85fr; }
    .sprt-boundary-grid { grid-template-columns: repeat(2, 1fr); }
    .sprt-footer__lead { grid-template-columns: 1fr auto; }
    .sprt-footer__grid { grid-template-columns: 1.25fr repeat(3, 0.75fr); }
    .sprt-filters__top { grid-template-columns: 1fr minmax(18rem, 0.6fr); }
    .sprt-legal__grid,
    .sprt-case-content,
    .sprt-single-work__grid,
    .sprt-article__layout { grid-template-columns: minmax(13rem, 0.35fr) minmax(0, 1fr); }
    .sprt-not-found__grid { grid-template-columns: 1fr 0.8fr; }
    .sprt-consent { grid-template-columns: 1fr auto; align-items: end; }
    .sprt-board__score { font-size: clamp(2.2rem, 5vw, 4rem); }
}

@media (min-width: 64rem) {
    .sprt-work-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .sprt-post-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .sprt-process { grid-template-columns: repeat(4, 1fr); }
    .sprt-problem-grid,
    .sprt-service-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .sprt-competency-grid,
    .sprt-contact-expectations { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .sprt-contact-expectations { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .sprt-filters__grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .sprt-service-list article { grid-template-columns: 3rem minmax(15rem, 0.75fr) minmax(16rem, 1fr) 2rem; align-items: start; }
}

@media (min-width: 68.75rem) {
    .sprt-header__bar { min-height: 5.1rem; }
    .sprt-menu-button,
    .sprt-nav__rail { display: none; }
    .sprt-nav {
        position: static;
        display: flex;
        flex-direction: row;
        width: auto;
        height: auto;
        min-height: 0;
        align-items: center;
        overflow: visible;
        margin-left: auto;
        padding: 0;
        clip-path: none;
        opacity: 1;
        background: transparent;
        visibility: visible;
        transition: none;
        pointer-events: auto;
    }
    .sprt-nav ul { display: flex; align-items: center; gap: clamp(0.7rem, 1.5vw, 1.6rem); padding: 0; }
    .sprt-nav li { border: 0; }
    .sprt-nav li a { position: relative; min-height: 3rem; font-family: var(--sprt-font); font-size: 0.69rem; font-weight: 800; letter-spacing: 0.045em; }
    .sprt-nav li a::after { position: absolute; right: 0; bottom: 0.25rem; left: 0; width: 0; height: 2px; background: var(--sprt-accent); content: ""; transition: width 200ms ease; }
    .sprt-nav li a:hover::after,
    .sprt-nav li a[aria-current="page"]::after { width: 100%; }
    .sprt-nav__cta { margin: 0 0 0 clamp(0.5rem, 1vw, 1rem); }
    .sprt-header__actions { order: 3; }
    .sprt-hero__grid { grid-template-columns: minmax(0, 1.25fr) minmax(24rem, 0.75fr); }
}

@media (max-width: 48rem) {
    .admin-bar .sprt-header { top: 46px; }
    .sprt-capacity a span { display: none; }
    .sprt-modal__footer .sprt-button { min-width: 2.8rem; padding-inline: 0.6rem; font-size: 0; }
    .sprt-modal__footer .sprt-button span { font-size: 1rem; }
    .sprt-legal aside { position: static; }
}

@media (max-width: 32rem) {
    .sprt-brand--has-mobile-logo .sprt-brand__image:not(.sprt-brand__image--mobile) { display: none !important; }
    .sprt-brand--has-mobile-logo .sprt-brand__image--mobile { display: block; }
    .sprt-header__actions .sprt-menu-button > span:last-child { display: none; }
    .sprt-capacity__inner > span:nth-child(2) { font-size: 0.75rem; }
    .sprt-capacity a { font-size: 0; }
    .sprt-capacity a span { display: inline; font-size: 0.8rem; }
    .sprt-board__ticker { gap: 0.25rem; font-size: 0.54rem; }
    .sprt-filters__footer > span { width: 100%; margin-left: 0; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    [data-sprt-site] *,
    [data-sprt-site] *::before,
    [data-sprt-site] *::after { scroll-behavior: auto !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
    [data-sprt-reveal] { opacity: 1 !important; transform: none !important; filter: none !important; transition: none !important; }
    .sprt-work-card:hover,
    .sprt-button:hover { transform: none; }
}

@media (forced-colors: active) {
    .sprt-button,
    .sprt-work-card,
    .sprt-modal__dialog,
    .sprt-form { forced-color-adjust: auto; }
    .sprt-kicker::before,
    .sprt-live-dot { background: CanvasText; }
}

.sprt-article-source {
    margin-top: clamp(2.5rem, 6vw, 4.5rem);
    padding: clamp(1.25rem, 3vw, 2rem);
    border: 1px solid color-mix(in srgb, var(--sprt-primary), transparent 62%);
    border-left: 0.36rem solid var(--sprt-secondary);
    border-radius: 0.9rem;
    background: linear-gradient(115deg, color-mix(in srgb, var(--sprt-primary), transparent 93%), color-mix(in srgb, var(--sprt-secondary), transparent 95%));
}

.sprt-article-source > span {
    color: var(--sprt-accent-strong);
    font-family: var(--sprt-display);
    font-size: 0.78rem;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.sprt-article-source p {
    max-width: 58ch;
    margin: 0.7rem 0 1rem;
}

.sprt-article-source a {
    display: inline-flex;
    min-height: 2.75rem;
    align-items: center;
    padding: 0.65rem 1rem;
    border-radius: 0.55rem;
    background: var(--sprt-primary);
    color: #fff;
    font-family: var(--sprt-display);
    line-height: 1.15;
    text-decoration: none;
}

.sprt-article-source a:hover,
.sprt-article-source a:focus-visible {
    background: var(--sprt-secondary);
    color: #07120a;
}

@media print {
    @page { size: A4; margin: 14mm; }
    body.sprt-page { background: #fff !important; color: #111 !important; font-size: 10pt; }
    .sprt-header,
    .sprt-footer,
    .sprt-page-hero,
    .sprt-cv__toolbar,
    .sprt-consent,
    .sprt-consent-modal,
    .sprt-modal { display: none !important; }
    .sprt-section,
    .sprt-cv { padding: 0 !important; }
    .sprt-container { width: 100% !important; max-width: none !important; }
    .sprt-cv-sheet { max-width: none; padding: 0; box-shadow: none; }
    .sprt-cv-sheet__header h2 { font-size: 34pt; }
    .sprt-cv-sheet a { color: #111 !important; text-decoration: none; }
    .sprt-cv-sheet a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 8pt; }
    .sprt-cv-sheet section { break-inside: avoid; }
}

/*
 * SPRT Design System 2026
 * The layer below deliberately re-composes the existing, accessible component
 * markup into a distinct SPRT interface. It uses the owner-supplied Playhigh
 * display faces and original CSS artwork; no third-party
 * club identity or protected club visual asset is copied.
 */
:root {
    --sprt-primary: #7900f3;
    --sprt-secondary: #19af2d;
    --sprt-navy: #1d003b;
    --sprt-deep: #0d001b;
    --sprt-blue: #117b20;
    --sprt-red: var(--sprt-primary);
    --sprt-yellow: var(--sprt-secondary);
    --sprt-neutral-900: #222222;
    --sprt-muted: #727272;
    --sprt-border: #efefef;
    --sprt-focus: var(--sprt-primary);
    --sprt-focus-visible: #ae6cff;
    --sprt-accent: var(--sprt-red);
    --sprt-accent-strong: #b875ff;
    --sprt-accent-action: #6100c2;
    --sprt-ink: var(--sprt-neutral-900);
    --sprt-paper: #ffffff;
    --sprt-bg: var(--sprt-deep);
    --sprt-bg-elevated: #17002e;
    --sprt-surface: var(--sprt-navy);
    --sprt-surface-2: #270050;
    --sprt-text: #ffffff;
    --sprt-text-soft: #c9c8dc;
    --sprt-line: rgba(255, 255, 255, 0.14);
    --sprt-line-strong: rgba(255, 255, 255, 0.28);
    --sprt-header-bg: rgba(13, 0, 27, 0.94);
    --sprt-success: #42dd58;
    --sprt-error: #ff7f8f;
    --sprt-warning: var(--sprt-yellow);
    --sprt-info: #63e775;
    --sprt-font: "Playhigh Regular";
    --sprt-display: "Playhigh SemiCondensed";
    --sprt-expanded: "Playhigh Expanded";
    --sprt-condensed: "Playhigh Condensed";
    --sprt-mono: "Playhigh Regular";
    --sprt-container: 80rem;
    --sprt-gutter: 1rem;
    --sprt-section: clamp(3.5rem, 8vw, 6.5rem);
    --sprt-space-1: 0.25rem;
    --sprt-space-2: 0.5rem;
    --sprt-space-3: 0.75rem;
    --sprt-space-4: 1rem;
    --sprt-space-5: 1.25rem;
    --sprt-space-6: 1.5rem;
    --sprt-space-8: 2rem;
    --sprt-space-10: 2.5rem;
    --sprt-space-12: 3rem;
    --sprt-space-14: 3.5rem;
    --sprt-space-16: 4rem;
    --sprt-radius-sm: 0.25rem;
    --sprt-radius: 0.5rem;
    --sprt-radius-lg: 0.75rem;
    --sprt-radius-pill: 999px;
    --sprt-shadow: 0 1.5rem 4rem rgba(0, 0, 0, 0.28);
    --sprt-fast: 140ms;
    --sprt-normal: 220ms;
    --sprt-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
    color-scheme: dark;
}

html[data-sprt-theme="light"] {
    --sprt-accent: var(--sprt-primary);
    --sprt-accent-strong: #5f00bf;
    --sprt-accent-action: #5f00bf;
    --sprt-bg: #ffffff;
    --sprt-bg-elevated: #f7f7fa;
    --sprt-surface: #f0f1f6;
    --sprt-surface-2: #e5e7ef;
    --sprt-text: var(--sprt-neutral-900);
    --sprt-text-soft: #595968;
    --sprt-line: #e2e2ea;
    --sprt-line-strong: #b9bac8;
    --sprt-header-bg: rgba(255, 255, 255, 0.95);
    --sprt-success: #087719;
    --sprt-error: #9f1025;
    --sprt-warning: #087719;
    --sprt-info: #087719;
    --sprt-focus-visible: var(--sprt-focus);
    --sprt-shadow: 0 1rem 3rem rgba(13, 0, 27, 0.12);
    color-scheme: light;
}

html {
    scroll-padding-top: 7rem;
}

body.sprt-page,
body.sprt-site {
    font-size: 1rem;
    line-height: 1.5;
}

[data-sprt-site] {
    background:
        radial-gradient(circle at 100% 0, color-mix(in srgb, var(--sprt-blue), transparent 78%), transparent 28rem),
        var(--sprt-bg);
}

[data-sprt-site] :where(p, li) {
    overflow-wrap: break-word;
}

[data-sprt-site] :focus-visible {
    outline: 3px solid var(--sprt-focus-visible);
    outline-offset: 3px;
}

.sprt-container {
    width: min(calc(100% - (2 * var(--sprt-gutter))), var(--sprt-container));
}

.sprt-kicker,
.sprt-score-label {
    gap: var(--sprt-space-2);
    color: var(--sprt-accent-strong);
    font-size: 0.75rem;
    line-height: 1.3;
}

.sprt-kicker::before {
    width: 1rem;
}

.sprt-section-heading {
    gap: var(--sprt-space-6);
    margin-bottom: clamp(2rem, 5vw, 3.5rem);
}

.sprt-section-heading h2,
.sprt-contact-band h2,
.sprt-footer__lead h2,
.sprt-trial-teaser h2,
.sprt-about-teaser h2,
.sprt-faq-section h2,
.sprt-pricing-note blockquote {
    max-width: 20ch;
    margin-top: var(--sprt-space-3);
    font-size: clamp(2rem, 4vw, 3rem);
    letter-spacing: -0.035em;
    line-height: 1.05;
    text-wrap: balance;
    text-transform: none;
}

.sprt-hero__copy h1::first-line {
    color: inherit;
}

.sprt-section-heading > p,
.sprt-trial-teaser p,
.sprt-about-teaser p,
.sprt-contact-band p {
    max-width: 45rem;
    font-size: clamp(1rem, 1.4vw, 1.125rem);
    line-height: 1.55;
}

.sprt-section--muted {
    background: color-mix(in srgb, var(--sprt-bg-elevated), var(--sprt-blue) 5%);
}

.sprt-section--red {
    background:
        linear-gradient(115deg, rgba(13, 0, 27, 0.16), transparent 55%),
        var(--sprt-red);
}

.sprt-section--red::after {
    right: -8rem;
    bottom: -11rem;
    width: min(32rem, 70vw);
    border-width: clamp(2rem, 7vw, 5rem);
}

/* Header: 64px application bar, with an optional 32px availability rail. */
.sprt-header {
    border-color: var(--sprt-line);
    background: var(--sprt-header-bg);
    -webkit-backdrop-filter: blur(14px) saturate(135%);
    backdrop-filter: blur(14px) saturate(135%);
}

.sprt-capacity {
    position: relative;
    border-color: rgba(255, 255, 255, 0.22);
    background: var(--sprt-red);
    font-family: var(--sprt-font);
    font-size: 0.75rem;
    letter-spacing: 0;
}

.sprt-capacity__inner {
    min-height: 2rem;
    padding-right: 2.75rem;
}

.sprt-capacity a {
    display: inline-flex;
    min-width: 2.75rem;
    min-height: 2.75rem;
    align-items: center;
    justify-content: center;
    padding-inline: var(--sprt-space-2);
}

.sprt-capacity__dismiss {
    position: absolute;
    top: 50%;
    right: max(0.25rem, env(safe-area-inset-right));
    display: grid;
    width: 2.75rem;
    height: 2.75rem;
    transform: translateY(-50%);
    place-items: center;
    border: 0;
    border-radius: var(--sprt-radius-pill);
    background: transparent;
    color: #ffffff;
    cursor: pointer;
}

.sprt-capacity__dismiss:hover {
    background: rgba(255, 255, 255, 0.16);
}

.sprt-header__bar {
    min-height: 4rem;
    gap: var(--sprt-space-3);
}

.sprt-brand {
    min-width: 6.75rem;
}

.sprt-header .sprt-brand__image {
    width: auto;
    max-width: 11rem;
    height: 3rem;
    max-height: 3rem;
    object-fit: contain;
}

.sprt-header .sprt-brand__image--bundled,
.sprt-footer .sprt-brand__image--footer {
    aspect-ratio: 313 / 272.98;
}

html[data-sprt-theme="light"] .sprt-header .sprt-brand__image--bundled {
    filter: brightness(0) saturate(100%) invert(11%) sepia(28%) saturate(1528%) hue-rotate(207deg) brightness(88%) contrast(96%);
}

.sprt-footer .sprt-brand__image--footer {
    display: block;
    width: auto;
    max-width: none;
    height: 6rem;
    max-height: 6rem;
    object-fit: contain;
}

.sprt-wordmark > span {
    font-size: 1.625rem;
}

.sprt-wordmark > i {
    border-radius: var(--sprt-radius-sm);
    background: var(--sprt-yellow);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--sprt-yellow), transparent 78%);
}

.sprt-icon-button,
.sprt-menu-button {
    min-width: 2.75rem;
    min-height: 2.75rem;
    border-radius: var(--sprt-radius);
    transition: border-color var(--sprt-fast) ease, background var(--sprt-fast) ease, color var(--sprt-fast) ease;
}

.sprt-icon-button:hover,
.sprt-menu-button:hover {
    border-color: var(--sprt-blue);
    background: color-mix(in srgb, var(--sprt-blue), transparent 84%);
    color: var(--sprt-text);
}

.sprt-theme-menu {
    overflow: hidden;
    border-radius: var(--sprt-radius);
}

.sprt-theme-menu button {
    min-height: 2.75rem;
    border-radius: var(--sprt-radius-sm);
}

.sprt-theme-menu button[aria-checked="true"] {
    color: var(--sprt-accent-strong);
}

.sprt-nav {
    padding: clamp(6rem, 18vh, 8rem) var(--sprt-gutter) max(2rem, env(safe-area-inset-bottom));
    background:
        linear-gradient(150deg, transparent 48%, color-mix(in srgb, var(--sprt-blue), transparent 62%) 48.2% 70%, transparent 70.2%),
        var(--sprt-deep);
    color: #ffffff;
}

.sprt-nav li a {
    min-height: 4rem;
    font-size: clamp(1.75rem, 8vw, 3rem);
    line-height: 1.05;
    text-transform: none;
}

.sprt-nav li a[aria-current="page"] {
    color: #ffffff;
}

.sprt-nav li a[aria-current="page"]::before {
    width: 0.625rem;
    height: 0.625rem;
    flex: 0 0 auto;
    margin-right: var(--sprt-space-3);
    border-radius: 50%;
    background: var(--sprt-yellow);
    content: "";
}

/* Buttons and links */
.sprt-button {
    min-height: 3rem;
    padding: 0.75rem 1.25rem;
    border-radius: var(--sprt-radius);
    font-size: 0.9375rem;
    letter-spacing: 0.02em;
    text-transform: none;
    transition: background var(--sprt-fast) ease, border-color var(--sprt-fast) ease, color var(--sprt-fast) ease, transform var(--sprt-normal) var(--sprt-ease);
}

.sprt-button--large {
    min-height: 3rem;
    padding-inline: 1.5rem;
}

.sprt-button--primary {
    border-color: var(--sprt-red);
    background: var(--sprt-red);
    color: #ffffff;
}

.sprt-button--primary:hover {
    border-color: var(--sprt-accent-action);
    background: var(--sprt-accent-action);
}

.sprt-button--ghost {
    border-color: var(--sprt-line-strong);
    background: color-mix(in srgb, var(--sprt-bg-elevated), transparent 28%);
}

.sprt-button--ghost:hover {
    border-color: var(--sprt-blue);
    background: color-mix(in srgb, var(--sprt-blue), transparent 84%);
    color: var(--sprt-text);
}

.sprt-button[disabled],
.sprt-button.is-loading {
    opacity: 0.52;
}

.sprt-button.is-loading::before {
    width: 1rem;
    height: 1rem;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    content: "";
    animation: sprt-spin 800ms linear infinite;
}

.sprt-arrow-link,
.sprt-text-button,
.sprt-pagination a,
.sprt-pagination span {
    min-height: 2.75rem;
}

.sprt-arrow-link {
    font-size: 0.9375rem;
    letter-spacing: 0.02em;
    text-transform: none;
}

/* Editorial hero with an original SPRT pitch-board motif. */
.sprt-hero {
    min-height: 0;
    background:
        linear-gradient(130deg, rgba(13, 0, 27, 0.96) 0 46%, rgba(121, 0, 243, 0.82) 100%),
        var(--sprt-deep);
    color: #ffffff;
}

.sprt-hero::before {
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.075) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.075) 1px, transparent 1px);
    background-size: clamp(3rem, 9vw, 7rem) clamp(3rem, 9vw, 7rem);
    opacity: 0.55;
}

.sprt-hero::after {
    position: absolute;
    z-index: -1;
    right: -12rem;
    bottom: -17rem;
    width: min(36rem, 90vw);
    aspect-ratio: 1;
    border: clamp(3rem, 10vw, 6rem) solid rgba(25, 175, 45, 0.12);
    border-radius: 50%;
    content: "";
}

.sprt-hero__grid {
    min-height: max(42rem, calc(100svh - 6rem));
    align-items: center;
    gap: clamp(2rem, 6vw, 5rem);
    padding-block: clamp(3rem, 9vh, 6rem);
}

.sprt-hero__copy h1 {
    max-width: 13ch;
    margin: var(--sprt-space-4) 0 var(--sprt-space-5);
    color: #ffffff;
    font-size: clamp(3rem, 7vw, 5.5rem);
    letter-spacing: -0.05em;
    line-height: 0.95;
    text-wrap: balance;
    text-transform: none;
}

.sprt-hero__copy > p {
    max-width: 43rem;
    margin-bottom: var(--sprt-space-8);
    color: #deddec;
    font-size: clamp(1rem, 1.5vw, 1.125rem);
    line-height: 1.55;
}

.sprt-hero__board {
    isolation: isolate;
    aspect-ratio: 4 / 5;
    display: flex;
    max-height: 36rem;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
    padding: clamp(1.25rem, 4vw, 2rem);
    border-color: rgba(255, 255, 255, 0.3);
    border-radius: var(--sprt-radius-lg);
    background:
        linear-gradient(165deg, rgba(29, 0, 59, 0.5), rgba(13, 0, 27, 0.88)),
        var(--sprt-navy);
}

.sprt-hero__board::before {
    width: 42%;
    height: 0.375rem;
    background: linear-gradient(90deg, var(--sprt-red) 0 62%, var(--sprt-yellow) 62%);
}

.sprt-hero__media {
    opacity: 0.44;
}

.sprt-hero__media::after {
    background: linear-gradient(to bottom, rgba(13, 0, 27, 0.12), rgba(13, 0, 27, 0.92));
}

.sprt-board__top,
.sprt-board__ticker {
    color: #d8d7e8;
    font-size: 0.75rem;
}

.sprt-board__top strong,
.sprt-board__score b {
    color: var(--sprt-yellow);
}

.sprt-board__score {
    margin-block: var(--sprt-space-8);
    font-size: clamp(2.5rem, 10vw, 4.25rem);
}

.sprt-board__message {
    font-size: 0.875rem;
    line-height: 1.45;
    text-transform: none;
}

.sprt-orbit {
    border-color: rgba(25, 175, 45, 0.52);
}

.sprt-orbit i {
    background: var(--sprt-yellow);
}

.sprt-scroll-cue {
    min-height: 2.75rem;
    color: #deddec !important;
}

/* Data and modular content */
.sprt-score-strip {
    background: var(--sprt-navy);
    color: #ffffff;
}

.sprt-score-strip strong {
    color: var(--sprt-yellow);
    font-size: clamp(2.5rem, 6vw, 4rem);
}

.sprt-score-strip span {
    color: #d1d0e1;
    font-size: 0.75rem;
    text-transform: none;
}

.sprt-case-teaser__grid,
.sprt-trial-teaser__grid,
.sprt-about-teaser__grid,
.sprt-contact-band__grid,
.sprt-faq-section__grid,
.sprt-modules-grid,
.sprt-about-profile__grid,
.sprt-form-section__grid,
.sprt-boundary-grid,
.sprt-legal__grid,
.sprt-case-content,
.sprt-single-work__grid {
    gap: clamp(2rem, 5vw, 4rem);
}

.sprt-case-teaser__visual {
    min-height: 22rem;
    aspect-ratio: 4 / 3;
    border-radius: var(--sprt-radius-lg);
    background:
        linear-gradient(130deg, transparent 0 42%, color-mix(in srgb, var(--sprt-red), transparent 8%) 42.2% 55%, transparent 55.2%),
        repeating-linear-gradient(90deg, transparent 0 4rem, var(--sprt-line) 4rem calc(4rem + 1px)),
        linear-gradient(150deg, var(--sprt-navy), var(--sprt-blue));
    color: #ffffff;
}

.sprt-case-teaser__visual small {
    border-radius: var(--sprt-radius-sm);
    background: var(--sprt-deep);
}

.sprt-case-teaser h2,
.sprt-modules-grid h2,
.sprt-trial-overview h2,
.sprt-form-section h2,
.sprt-about-profile h2 {
    margin: var(--sprt-space-3) 0 var(--sprt-space-5);
    font-size: clamp(2rem, 4vw, 3rem);
    line-height: 1.05;
    text-wrap: balance;
    text-transform: none;
}

.sprt-problem-grid,
.sprt-service-grid,
.sprt-competency-grid,
.sprt-contact-expectations {
    gap: var(--sprt-space-4);
    border: 0;
    background: transparent;
}

.sprt-problem-grid article,
.sprt-service-grid article,
.sprt-competency-grid article,
.sprt-contact-expectations article {
    min-height: 0;
    padding: clamp(1.25rem, 3vw, 1.5rem);
    border: 1px solid var(--sprt-line);
    border-radius: var(--sprt-radius);
    background: var(--sprt-bg-elevated);
}

.sprt-problem-grid h3,
.sprt-service-grid h3,
.sprt-competency-grid h3,
.sprt-contact-expectations h3 {
    max-width: 18ch;
    margin: var(--sprt-space-8) 0 var(--sprt-space-3);
    font-size: clamp(1.25rem, 2vw, 1.5rem);
    line-height: 1.2;
    text-transform: none;
}

.sprt-problem-grid p,
.sprt-service-grid p,
.sprt-competency-grid p,
.sprt-contact-expectations p {
    font-size: 0.875rem;
    line-height: 1.45;
}

/* One shared card grammar for work and editorial content. */
.sprt-work-grid,
.sprt-post-grid {
    gap: clamp(1rem, 2.5vw, 1.5rem);
}

.sprt-work-card,
.sprt-post-card {
    container-type: inline-size;
    overflow: hidden;
    border: 1px solid var(--sprt-line);
    border-radius: var(--sprt-radius);
    background: var(--sprt-bg-elevated);
    box-shadow: none;
    transition: border-color var(--sprt-fast) ease, transform var(--sprt-normal) var(--sprt-ease);
}

.sprt-work-card:hover,
.sprt-work-card:focus-within,
.sprt-post-card:hover,
.sprt-post-card:focus-within {
    transform: translateY(-0.25rem);
    border-color: var(--sprt-blue);
    box-shadow: none;
}

.sprt-work-card__open {
    min-height: 100%;
    border-radius: inherit;
}

.sprt-post-card__open {
    display: flex;
    min-height: 100%;
    flex-direction: column;
    border-radius: inherit;
    color: inherit;
    text-decoration: none;
}

.sprt-work-card__media {
    aspect-ratio: 4 / 5;
}

.sprt-post-card__media {
    aspect-ratio: 16 / 10;
}

.sprt-work-card__media,
.sprt-post-card__media {
    background: linear-gradient(145deg, var(--sprt-navy), var(--sprt-blue));
}

.sprt-media-placeholder {
    min-height: 8rem;
    background:
        linear-gradient(135deg, transparent 0 48%, var(--sprt-red) 48.5% 55%, transparent 55.5%),
        repeating-linear-gradient(90deg, transparent 0 4rem, rgba(255, 255, 255, 0.12) 4rem calc(4rem + 1px)),
        linear-gradient(145deg, var(--sprt-navy), var(--sprt-blue));
    color: #ffffff;
}

.sprt-work-card__type,
.sprt-work-card__featured {
    border-radius: var(--sprt-radius-sm);
    background: rgba(13, 0, 27, 0.92);
    font-size: 0.75rem;
}

.sprt-work-card__featured {
    background: var(--sprt-red);
}

.sprt-work-card__body,
.sprt-post-card__body {
    padding: clamp(1rem, 4cqw, 1.5rem);
}

.sprt-work-card h3,
.sprt-post-card h3 {
    margin: var(--sprt-space-4) 0 var(--sprt-space-2);
    font-size: clamp(1.25rem, 7cqw, 1.5rem);
    line-height: 1.25;
    text-transform: none;
}

.sprt-work-card__eyebrow,
.sprt-work-card__club {
    font-size: 0.75rem !important;
}

.sprt-work-card__body > p,
.sprt-post-card p {
    font-size: 0.875rem;
    line-height: 1.45;
}

.sprt-role-list > span {
    min-height: 1.75rem;
    border-radius: var(--sprt-radius-pill);
    font-size: 0.6875rem;
}

.sprt-metrics dt {
    font-size: 0.6875rem;
}

.sprt-metrics dd {
    font-size: 1.25rem;
}

.sprt-work-card__more {
    min-height: 2.75rem;
    align-items: center;
    color: var(--sprt-accent-strong);
    font-size: 0.75rem;
    text-transform: none;
}

@container (max-width: 15rem) {
    .sprt-work-card__open {
        display: grid;
        grid-template-columns: 7rem minmax(0, 1fr);
        align-items: stretch;
    }

    .sprt-work-card__media {
        height: 100%;
        min-height: 10rem;
        aspect-ratio: auto;
    }

    .sprt-work-card__type,
    .sprt-work-card__featured {
        top: 0.5rem;
        left: 0.5rem;
        max-width: calc(100% - 1rem);
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .sprt-work-card__featured {
        top: auto;
        right: auto;
        bottom: 0.5rem;
    }

    .sprt-work-card__body {
        align-self: center;
        padding: 1rem;
    }

    .sprt-work-card h3 {
        font-size: 1.125rem;
    }

    .sprt-work-card__body > p,
    .sprt-role-list,
    .sprt-metrics {
        display: none;
    }

    .sprt-work-card__more {
        min-height: 2.75rem;
    }

    .sprt-media-placeholder span,
    .sprt-media-placeholder b {
        font-size: 1.5rem;
    }

    .sprt-media-placeholder small {
        font-size: 0.5625rem;
        letter-spacing: 0.08em;
    }

}

/* Process, states and supporting panels */
.sprt-process {
    gap: var(--sprt-space-4);
}

.sprt-process li,
.sprt-process li:last-child {
    min-height: 0;
    padding: var(--sprt-space-6);
    border: 1px solid rgba(255, 255, 255, 0.36);
    border-radius: var(--sprt-radius);
}

.sprt-process h3 {
    margin: var(--sprt-space-8) 0 var(--sprt-space-3);
    font-size: 1.5rem;
    line-height: 1.2;
    text-transform: none;
}

.sprt-process p {
    font-size: 0.875rem;
    line-height: 1.45;
}

.sprt-process--dark li {
    background: var(--sprt-bg-elevated);
}

.sprt-check-list,
.sprt-testimonial-grid figure,
.sprt-boundary-grid article,
.sprt-form,
.sprt-filters,
.sprt-empty-state,
.sprt-modal__dialog,
.sprt-consent {
    border-radius: var(--sprt-radius);
}

.sprt-check-list {
    padding: clamp(1.25rem, 5vw, 2rem);
}

.sprt-check-list li {
    min-height: 3.25rem;
    padding-block: var(--sprt-space-4);
}

.sprt-check-list li::before {
    top: 1.125rem;
    background: var(--sprt-blue);
}

.sprt-portrait-placeholder {
    min-height: 28rem;
    border-radius: var(--sprt-radius-lg);
    background: linear-gradient(145deg, var(--sprt-navy), var(--sprt-blue));
}

.sprt-portrait-placeholder > div {
    background:
        linear-gradient(145deg, transparent 0 44%, var(--sprt-red) 44.2% 56%, transparent 56.2%),
        repeating-linear-gradient(90deg, transparent 0 5rem, rgba(255, 255, 255, 0.12) 5rem calc(5rem + 1px)),
        linear-gradient(145deg, var(--sprt-navy), var(--sprt-blue));
    color: #ffffff;
}

.sprt-accordion summary {
    min-height: 4rem;
    padding-block: var(--sprt-space-2);
    font-size: 1rem;
}

.sprt-accordion summary span {
    width: 2.75rem;
    height: 2.75rem;
    border: 1px solid var(--sprt-line);
    border-radius: 50%;
}

.sprt-contact-band {
    background:
        linear-gradient(115deg, transparent 0 68%, color-mix(in srgb, var(--sprt-blue), transparent 30%) 68.2% 84%, transparent 84.2%),
        var(--sprt-bg-elevated);
}

/* Explicit asynchronous UI states; icon plus text avoids color-only meaning. */
.sprt-async-boundary {
    grid-column: 1 / -1;
    display: grid;
    width: 100%;
    min-height: 6rem;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-content: center;
    align-items: center;
    gap: var(--sprt-space-4);
    padding: clamp(1.25rem, 5vw, 2rem);
    border: 1px solid var(--sprt-line-strong);
    border-radius: var(--sprt-radius);
    background: var(--sprt-bg-elevated);
}

.sprt-async-boundary__icon {
    display: grid;
    width: 2.75rem;
    height: 2.75rem;
    place-items: center;
    border: 2px solid currentColor;
    border-radius: 50%;
    color: var(--sprt-info);
    font-weight: 900;
}

.sprt-async-boundary__copy {
    min-width: 0;
    max-width: 42rem;
}

.sprt-async-boundary__copy > :first-child {
    margin-top: 0;
}

.sprt-async-boundary__copy > :last-child {
    margin-bottom: 0;
}

.sprt-async-boundary--loading .sprt-async-boundary__icon {
    border-right-color: transparent;
    animation: sprt-spin 800ms linear infinite;
}

.sprt-async-boundary--error {
    border-color: var(--sprt-error);
}

.sprt-async-boundary--error .sprt-async-boundary__icon {
    color: var(--sprt-error);
}

.sprt-async-boundary--success {
    border-color: var(--sprt-success);
}

.sprt-async-boundary--success .sprt-async-boundary__icon {
    color: var(--sprt-success);
}

.sprt-async-boundary--offline {
    border-style: dashed;
    border-color: var(--sprt-warning);
}

.sprt-async-boundary--offline .sprt-async-boundary__icon {
    color: var(--sprt-warning);
}

.sprt-async-boundary--unauthorized {
    border-color: var(--sprt-warning);
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--sprt-warning), transparent 92%), transparent 35%),
        var(--sprt-bg-elevated);
}

.sprt-async-boundary--unauthorized .sprt-async-boundary__icon {
    color: var(--sprt-warning);
}

.sprt-skeleton-card {
    overflow: hidden;
    border: 1px solid var(--sprt-line);
    border-radius: var(--sprt-radius);
    background: var(--sprt-bg-elevated);
}

.sprt-skeleton-card__media {
    aspect-ratio: 4 / 3;
}

.sprt-skeleton-card__body {
    display: grid;
    gap: var(--sprt-space-3);
    padding: var(--sprt-space-6);
}

.sprt-skeleton-card__media,
.sprt-skeleton-card__line,
.sprt-skeleton-card [class*="sprt-skeleton-card__line"] {
    position: relative;
    overflow: hidden;
    min-height: 0.875rem;
    border-radius: var(--sprt-radius-sm);
    background: var(--sprt-surface-2);
}

.sprt-skeleton-card__line:last-child {
    width: 68%;
}

.sprt-skeleton-card__media::after,
.sprt-skeleton-card__line::after {
    position: absolute;
    inset: 0;
    transform: translateX(-100%);
    background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--sprt-text), transparent 90%), transparent);
    content: "";
    animation: sprt-skeleton 1.25s ease-in-out infinite;
}

@keyframes sprt-skeleton {
    to { transform: translateX(100%); }
}

/* Footer and internal-page framing */
.sprt-footer {
    background: var(--sprt-deep);
    color: #ffffff;
}

.sprt-footer .sprt-kicker,
.sprt-footer .sprt-score-label {
    color: var(--sprt-yellow);
}

.sprt-footer__lead {
    padding-block: clamp(3rem, 7vw, 5rem);
}

.sprt-footer__grid {
    gap: var(--sprt-space-8);
    padding-block: var(--sprt-space-12);
}

.sprt-footer__grid nav a,
.sprt-footer__grid > div > p,
.sprt-footer__bottom {
    color: #c9c8dc;
}

.sprt-footer__grid nav a,
.sprt-footer__email,
.sprt-footer__bottom a,
.sprt-footer__bottom button {
    min-height: 2.75rem;
    align-items: center;
}

.sprt-footer__grid nav a,
.sprt-footer__email,
.sprt-footer__bottom a {
    display: inline-flex;
}

.sprt-page-hero {
    padding-block: clamp(3.5rem, 8vw, 6.5rem);
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--sprt-blue), transparent 72%), transparent 58%),
        repeating-linear-gradient(90deg, transparent 0 6rem, var(--sprt-line) 6rem calc(6rem + 1px)),
        var(--sprt-bg-elevated);
}

.sprt-page-hero::after {
    border-color: color-mix(in srgb, var(--sprt-yellow), transparent 86%);
}

.sprt-page-hero h1,
.sprt-article__header h1,
.sprt-not-found h1 {
    max-width: 16ch;
    font-size: clamp(2.5rem, 6vw, 4rem);
    letter-spacing: -0.045em;
    line-height: 1;
    text-wrap: balance;
    text-transform: none;
}

.sprt-page-hero__index {
    color: color-mix(in srgb, var(--sprt-text), transparent 88%);
    font-size: clamp(5rem, 18vw, 11rem);
}

.sprt-page-hero__index span {
    color: var(--sprt-yellow);
}

.sprt-filters,
.sprt-form {
    padding: clamp(1rem, 4vw, 1.5rem);
}

.sprt-filters h2,
.sprt-empty-state h2,
.sprt-empty-state h3,
.sprt-modal__content h2 {
    font-size: clamp(1.75rem, 4vw, 2.5rem);
    line-height: 1.1;
    text-transform: none;
}

.sprt-field > span,
.sprt-field > label,
.sprt-field > label:first-child {
    font-size: 0.75rem;
}

.sprt-field input,
.sprt-field select,
.sprt-field textarea {
    min-height: 3rem;
    border-radius: var(--sprt-radius);
    background: var(--sprt-bg);
}

.sprt-field input:focus,
.sprt-field select:focus,
.sprt-field textarea:focus {
    border-color: var(--sprt-focus-visible);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--sprt-focus-visible), transparent 74%);
}

.sprt-field--search > div {
    grid-template-columns: minmax(0, 1fr) 3rem;
}

.sprt-field--search button {
    min-width: 3rem;
    border-radius: 0 var(--sprt-radius) var(--sprt-radius) 0;
}

.sprt-status-chip {
    min-height: 2rem;
    border-radius: var(--sprt-radius-pill);
    font-size: 0.6875rem;
}

.sprt-service-list article {
    padding: var(--sprt-space-6);
    border: 1px solid var(--sprt-line);
    border-radius: var(--sprt-radius);
}

.sprt-service-list {
    display: grid;
    gap: var(--sprt-space-4);
    border-top: 0;
}

.sprt-service-list article:hover {
    padding-inline: var(--sprt-space-6);
    border-color: var(--sprt-blue);
}

.sprt-service-list h3,
.sprt-boundary-grid h3,
.sprt-trial-deliverables strong,
.sprt-prose h2,
.sprt-prose h3,
.sprt-cv-placeholder h2,
.sprt-cv-sheet__grid h2 {
    line-height: 1.15;
    text-transform: none;
}

.sprt-prose {
    max-width: 45rem;
    font-size: clamp(1rem, 1.4vw, 1.125rem);
    line-height: 1.55;
}

.sprt-prose h2 {
    font-size: clamp(1.75rem, 4vw, 2.5rem);
}

.sprt-prose h3 {
    font-size: clamp(1.375rem, 3vw, 1.75rem);
}

.sprt-article__content {
    max-width: 45rem;
}

.sprt-article__image img,
.sprt-case-cover img,
.sprt-single-work__media img {
    border-radius: var(--sprt-radius-lg);
}

.sprt-modal__header,
.sprt-modal__footer {
    min-height: 4rem;
}

.sprt-modal__close,
.sprt-modal__footer .sprt-button {
    min-width: 2.75rem;
    min-height: 2.75rem;
}

.sprt-consent {
    gap: var(--sprt-space-4);
}

.sprt-consent__actions {
    gap: var(--sprt-space-2);
}

.sprt-consent-reopen {
    min-width: 2.75rem;
    min-height: 2.75rem;
}

.sprt-not-found {
    background: radial-gradient(circle at 75%, color-mix(in srgb, var(--sprt-blue), transparent 72%), transparent 34%);
}

.sprt-not-found__score i {
    color: var(--sprt-yellow);
}

.sprt-not-found__score {
    font-size: clamp(4.5rem, 24vw, 12rem);
}

/* Every public role uses a width/style from the single owner-supplied Playhigh family. */
[data-sprt-site] :is(h1, h2, h3),
.sprt-pricing-note blockquote,
.sprt-trial-deliverables strong {
    font-family: var(--sprt-display);
    font-style: normal;
    font-weight: 400;
    font-synthesis: none;
}

[data-sprt-site] :is(h1, h2, h3) em,
.sprt-page-hero h1 em,
.sprt-pricing-note blockquote em,
.sprt-trial-deliverables strong em {
    font-family: var(--sprt-display);
    font-style: italic;
    font-weight: 400;
    font-synthesis: none;
}

.sprt-wordmark,
.sprt-board__score,
.sprt-score-strip strong,
.sprt-page-hero__index,
.sprt-case-teaser__visual strong,
.sprt-media-placeholder span,
.sprt-media-placeholder b,
.sprt-portrait-placeholder span,
.sprt-metrics dd,
.sprt-not-found__score {
    font-family: var(--sprt-expanded);
    font-style: normal;
    font-weight: 400;
    font-synthesis: none;
}

.sprt-wordmark em,
.sprt-board__score em,
.sprt-score-strip strong em,
.sprt-page-hero__index em,
.sprt-not-found__score em {
    font-family: var(--sprt-expanded);
    font-style: italic;
    font-weight: 400;
    font-synthesis: none;
}

.sprt-nav li a {
    font-weight: 400;
    font-synthesis: none;
}

body.sprt-page,
body.sprt-site,
[data-sprt-site] :is(button, input, select, textarea) {
    font-family: var(--sprt-font);
    font-synthesis: none;
}

body.sprt-page,
body.sprt-site {
    letter-spacing: 0.012em;
    line-height: 1.6;
}

[data-sprt-site] h1 {
    letter-spacing: -0.01em;
    line-height: 1.08;
}

[data-sprt-site] :is(h1, h2, h3) {
    overflow-wrap: normal;
    hyphens: none;
    word-break: normal;
}

[data-sprt-site] :is(h2, h3) {
    letter-spacing: 0;
    line-height: 1.15;
}

.sprt-hero__copy h1 {
    max-width: 100%;
}

/* 480 / 768 / 1024 / 1280 layout steps from the audit. */
@media (min-width: 30rem) {
    :root { --sprt-gutter: 1.25rem; }
}

@media (min-width: 48rem) {
    :root { --sprt-gutter: 2rem; }

    .sprt-section-heading {
        grid-template-columns: minmax(0, 1.35fr) minmax(16rem, 0.65fr);
    }

    .sprt-footer__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 64rem) {
    :root { --sprt-gutter: 2.5rem; }

    .sprt-hero__grid {
        min-height: min(50rem, calc(100svh - 6rem));
        grid-template-columns: minmax(0, 1.05fr) minmax(24rem, 0.95fr);
    }

    .sprt-hero__board {
        width: 100%;
        max-height: none;
        aspect-ratio: 16 / 9;
    }

    .sprt-hero__copy h1 {
        max-width: 100%;
        font-size: clamp(3.5rem, 5.5vw, 4.75rem);
    }

    .sprt-work-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .sprt-post-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .sprt-footer__grid {
        grid-template-columns: 1.25fr repeat(3, 0.75fr);
    }
}

@media (min-width: 90rem) {
    .sprt-post-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (min-width: 68.75rem) {
    .sprt-header__bar {
        min-height: 4.5rem;
    }

    .sprt-header .sprt-brand__image {
        height: 3.25rem;
        max-height: 3.25rem;
    }

    .sprt-nav {
        position: static;
        display: flex;
        width: auto;
        height: auto;
        min-height: 0;
        flex-direction: row;
        align-items: center;
        overflow: visible;
        margin-left: auto;
        padding: 0;
        clip-path: none;
        opacity: 1;
        background: transparent;
        color: var(--sprt-text);
        visibility: visible;
        pointer-events: auto;
    }

    .sprt-nav ul {
        display: flex;
        align-items: center;
        gap: clamp(0.7rem, 1.5vw, 1.6rem);
        padding: 0;
    }

    .sprt-nav li {
        border: 0;
    }

    .sprt-nav__cta {
        margin: 0 0 0 clamp(0.5rem, 1vw, 1rem);
    }

    .sprt-nav li a {
        min-height: 2.75rem;
        font-family: var(--sprt-font);
        font-size: 0.8125rem;
        letter-spacing: 0;
        text-transform: none;
    }

    .sprt-nav li a::after {
        bottom: 0.125rem;
        height: 0.1875rem;
        background: var(--sprt-red);
    }

    .sprt-nav li a[aria-current="page"] {
        color: var(--sprt-text);
        font-weight: 850;
    }

    .sprt-nav li a[aria-current="page"]::before {
        width: 0.375rem;
        height: 0.375rem;
        margin-right: 0.375rem;
        background: var(--sprt-red);
    }
}

@media (max-width: 47.999rem) {
    .sprt-love-button__label {
        display: none;
    }

    .sprt-love-button {
        min-height: 2.65rem;
        padding: 0.4rem 0.72rem 0.4rem 0.48rem;
    }

    .sprt-page-hero__index {
        display: none;
    }

    .sprt-footer__lead .sprt-button {
        width: 100%;
    }

    .sprt-consent__actions .sprt-button {
        flex: 1 1 10rem;
    }
}

/* News-only advertising slots stay neutral and visually separate from copy. */
.sprt-adsense {
    position: relative;
    width: 100%;
    margin: clamp(1.5rem, 4vw, 3.5rem) 0;
    padding: 1.75rem 0.75rem 0.75rem;
    border-block: 1px solid var(--sprt-line);
    background: #fff;
    color: var(--sprt-ink);
    text-align: center;
}

.sprt-adsense[hidden] {
    display: none !important;
}

.sprt-adsense__label {
    position: absolute;
    top: 0.4rem;
    left: 50%;
    transform: translateX(-50%);
    color: var(--sprt-text-soft);
    font-family: var(--sprt-body);
    font-size: 0.66rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.sprt-adsense .adsbygoogle {
    width: 100%;
    min-height: 5.625rem;
}

.sprt-adsense.is-preview {
    min-height: 7rem;
    display: grid;
    place-items: center;
    border: 1px dashed #a6a8b3;
    background: #f7f8fb;
}

.sprt-adsense.is-preview .adsbygoogle {
    display: none !important;
}

.sprt-adsense__preview {
    margin: 0;
    color: #545563;
    font-size: 0.78rem;
}

/* Portfolio hierarchy: primary categories first, detailed facets second. */
.sprt-portfolio > .sprt-container,
.sprt-score-strip > .sprt-container {
    width: min(calc(100% - (2 * var(--sprt-gutter))), 106rem);
    max-width: none;
}

.sprt-work-categories {
    display: grid;
    gap: 0.7rem;
    margin-top: 1.35rem;
    padding-top: 1.2rem;
    border-top: 1px solid var(--sprt-line);
}

.sprt-work-categories__label {
    color: var(--sprt-text-soft);
    font-family: var(--sprt-display);
    font-size: 0.75rem;
    letter-spacing: 0.055em;
    line-height: 1.35;
    text-transform: uppercase;
}

.sprt-work-categories__rail {
    display: flex;
    gap: 0.55rem;
    overflow-x: auto;
    padding: 0.1rem 0 0.55rem;
    scrollbar-color: var(--sprt-accent) transparent;
    scrollbar-width: thin;
}

.sprt-work-categories__rail a {
    display: inline-flex;
    min-height: 2.65rem;
    flex: 0 0 auto;
    align-items: center;
    padding: 0.58rem 0.85rem;
    border: 1px solid var(--sprt-line-strong);
    border-radius: 0.45rem;
    background: var(--sprt-bg);
    color: var(--sprt-text);
    font-family: var(--sprt-display);
    font-size: 0.82rem;
    letter-spacing: 0.025em;
    line-height: 1.25;
    text-decoration: none;
    transition: transform 180ms var(--sprt-ease), border-color 180ms ease, background 180ms ease, color 180ms ease;
}

.sprt-work-categories__rail a:hover,
.sprt-work-categories__rail a:focus-visible {
    transform: translateY(-0.12rem);
    border-color: var(--sprt-secondary);
    background: color-mix(in srgb, var(--sprt-secondary), var(--sprt-bg) 88%);
}

.sprt-work-categories__rail a[aria-current="page"] {
    border-color: transparent;
    background: linear-gradient(115deg, var(--sprt-secondary), var(--sprt-primary));
    color: #ffffff;
    box-shadow: 0 0.55rem 1.3rem color-mix(in srgb, var(--sprt-primary), transparent 78%);
}

.sprt-work-card__open {
    display: grid;
    height: 100%;
    grid-template-rows: auto 1fr;
}

.sprt-work-card__body {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.sprt-work-card__body > .sprt-metrics {
    margin-top: auto;
    padding-top: 1rem;
}

@media (min-width: 80rem) {
    .sprt-portfolio .sprt-work-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

/* Playhigh is one family with deliberately assigned voices, not one repeated cut. */
[data-sprt-site] :is(
    .sprt-hero__copy h1,
    .sprt-page-hero h1,
    .sprt-article__header h1,
    .sprt-instagram-cta h2,
    .sprt-not-found h1,
    .sprt-cv-sheet__header h2
) {
    font-family: var(--sprt-headline);
    font-style: normal;
    font-weight: 400;
    font-synthesis: none;
    letter-spacing: 0.012em;
    line-height: 1.01;
    text-wrap: balance;
}

[data-sprt-site] :is(
    .sprt-section-heading h2,
    .sprt-work-card h3,
    .sprt-post-card h3,
    .sprt-service-grid h3,
    .sprt-problem-grid h3,
    .sprt-process h3,
    .sprt-modal__content h2
) {
    font-family: var(--sprt-display);
    font-style: normal;
    font-weight: 400;
    font-synthesis: none;
    letter-spacing: 0.006em;
    line-height: 1.08;
}

[data-sprt-site] :is(
    .sprt-kicker,
    .sprt-score-label,
    .sprt-work-card__type,
    .sprt-work-card__featured,
    .sprt-work-card__eyebrow,
    .sprt-article__meta,
    .sprt-field > span,
    .sprt-results-bar span
) {
    font-family: var(--sprt-display);
    font-style: normal;
    font-weight: 400;
    font-synthesis: none;
    letter-spacing: 0.055em;
    line-height: 1.35;
}

[data-sprt-site] :is(em, blockquote em, h1 em, h2 em, h3 em) {
    font-style: italic;
    font-synthesis: none;
}

@media (max-width: 29.999rem) {
    .sprt-capacity__inner > span:nth-child(2) {
        white-space: normal;
    }

    .sprt-capacity__inner {
        min-height: 2.75rem;
    }

    .sprt-hero__grid {
        min-height: 0;
        padding-block: var(--sprt-space-12);
    }

    .sprt-hero__copy h1 {
        font-size: clamp(3rem, 14vw, 4rem);
    }

    .sprt-hero__board {
        width: 100%;
        max-height: none;
    }

    .sprt-portrait-placeholder span {
        font-size: clamp(3rem, 15vw, 5rem);
    }

    .sprt-button-row .sprt-button {
        width: 100%;
    }

    .sprt-score-strip__grid > div {
        padding: var(--sprt-space-5) var(--sprt-space-3);
    }

    .sprt-async-boundary {
        grid-template-columns: 1fr;
    }

    .sprt-post-card__open {
        display: grid;
        grid-template-columns: 7rem minmax(0, 1fr);
    }

    .sprt-post-card__media {
        height: 100%;
        min-height: 9rem;
        aspect-ratio: auto;
    }

    .sprt-post-card h3 {
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    .sprt-post-card p {
        display: none;
    }

    .sprt-footer__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: var(--sprt-space-8) var(--sprt-space-4);
    }

    .sprt-footer__grid > :first-child {
        grid-column: 1 / -1;
    }

    .sprt-footer__bottom {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* Readability floor: essential labels stay at 13px and supporting copy at 15px. */
.sprt-nav__rail,
.sprt-board__top,
.sprt-board__ticker,
.sprt-scroll-cue,
.sprt-score-strip span,
.sprt-case-teaser__visual span,
.sprt-case-teaser__visual small,
.sprt-problem-grid article > span,
.sprt-service-grid article > span,
.sprt-competency-grid article > span,
.sprt-contact-expectations article > span,
.sprt-media-placeholder small,
.sprt-work-card__type,
.sprt-work-card__featured,
.sprt-work-card__eyebrow,
.sprt-work-card__club,
.sprt-role-list > span,
.sprt-metrics dt,
.sprt-work-card__more,
.sprt-process li > span,
.sprt-testimonial-grid figcaption,
.sprt-portrait-placeholder small,
.sprt-footer__grid strong,
.sprt-footer__bottom,
.sprt-filters__footer > span,
.sprt-field > span,
.sprt-field > label,
.sprt-field > label:first-child,
.sprt-results-bar span,
.sprt-empty-state > span,
.sprt-modal__footer > span,
.sprt-modal__snapshot,
.sprt-contact-details dt,
.sprt-service-list__index,
.sprt-module-list li span,
.sprt-trial-deliverables li > span,
.sprt-status-chip,
.sprt-legal__updated,
.sprt-article__meta,
.sprt-not-found__score small,
.sprt-form-note strong {
    font-size: 0.8125rem !important;
}

.sprt-process p,
.sprt-footer__grid > div > p,
.sprt-footer__grid nav a,
.sprt-modal__external p,
.sprt-check,
.sprt-form-note p,
.sprt-service-list__content,
.sprt-trial-deliverables p,
.sprt-cv__toolbar p,
.sprt-legal aside p,
.sprt-case-content aside p,
.sprt-single-work__grid aside p,
.sprt-consent p,
.sprt-consent-option p,
.sprt-consent-option small {
    font-size: 0.9375rem;
    line-height: 1.55;
}

/* Home editorial masthead: a dense sports-news hierarchy using only SPRT assets. */
.sprt-header::after {
    display: none;
}

.sprt-hero--editorial {
    position: relative;
    display: block;
    min-height: 0;
    overflow: hidden;
    background:
        radial-gradient(circle at 50% 22%, rgba(121, 0, 243, 0.72), transparent 46%),
        linear-gradient(145deg, #080010 0 34%, #1d003b 68%, #0d001b 100%);
    color: #ffffff;
}

.sprt-hero--editorial::before {
    z-index: 1;
    background:
        linear-gradient(to bottom, rgba(13, 0, 27, 0.24) 0, rgba(13, 0, 27, 0.3) 32%, rgba(13, 0, 27, 0.88) 82%, #0d001b 100%),
        linear-gradient(90deg, rgba(25, 175, 45, 0.2), transparent 50%, rgba(121, 0, 243, 0.18));
    mask-image: none;
    opacity: 1;
    pointer-events: none;
}

.sprt-hero--editorial::after {
    display: none;
}

.sprt-hero--editorial .sprt-hero__media {
    position: absolute;
    z-index: 0;
    inset: 0;
    opacity: 1;
}

.sprt-hero--editorial .sprt-hero__media::after {
    display: none;
}

.sprt-hero--editorial .sprt-hero__media img,
.sprt-hero--editorial .sprt-hero__media video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.sprt-hero__stage {
    position: relative;
    z-index: 2;
    display: grid;
    min-height: min(54rem, calc(100svh - 4rem));
    grid-template-rows: minmax(24rem, 1fr) auto;
    align-items: center;
    gap: clamp(2.25rem, 5vh, 4rem);
    padding-block: clamp(3.5rem, 8vh, 6rem) clamp(1.25rem, 3vh, 2rem);
}

.sprt-hero--editorial .sprt-hero__copy {
    width: 100%;
    max-width: 72rem;
    align-self: center;
    justify-self: center;
    text-align: center;
}

.sprt-hero--editorial .sprt-kicker {
    color: var(--sprt-yellow);
    font-size: 0.8125rem;
    letter-spacing: 0.05em;
}

.sprt-hero--editorial .sprt-hero__copy h1 {
    max-width: 22ch;
    margin: var(--sprt-space-4) auto var(--sprt-space-5);
    color: #ffffff;
    font-size: clamp(3.4rem, 6vw, 6.5rem);
    letter-spacing: -0.018em;
    line-height: 0.96;
    text-align: center;
    text-shadow: 0 0.22rem 1.8rem rgba(0, 0, 0, 0.58);
    text-transform: none;
}

.sprt-hero--editorial .sprt-hero__copy h1::first-line {
    color: inherit;
}

.sprt-hero--editorial .sprt-hero__copy > p {
    max-width: 48rem;
    margin: 0 auto var(--sprt-space-6);
    color: rgba(255, 255, 255, 0.88);
    font-size: clamp(1rem, 1.5vw, 1.125rem);
    line-height: 1.5;
    text-shadow: 0 0.1rem 0.7rem rgba(0, 0, 0, 0.7);
}

.sprt-hero--editorial .sprt-button-row {
    justify-content: center;
}

.sprt-hero--editorial .sprt-button--ghost {
    border-color: rgba(255, 255, 255, 0.54);
    background: rgba(13, 0, 27, 0.46);
    color: #ffffff;
}

.sprt-hero--editorial .sprt-button--ghost:hover {
    border-color: #ffffff;
    background: rgba(255, 255, 255, 0.14);
    color: #ffffff;
}

.sprt-hero-stories {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(0.75rem, 1.5vw, 1.25rem);
}

.sprt-hero-story {
    min-width: 0;
}

.sprt-hero-story > a {
    position: relative;
    isolation: isolate;
    display: grid;
    min-height: clamp(12.5rem, 17vw, 15rem);
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: var(--sprt-radius);
    background: var(--sprt-navy);
    color: #ffffff;
    box-shadow: 0 1rem 2.4rem rgba(0, 0, 0, 0.3);
    text-decoration: none;
    transition: border-color var(--sprt-normal) ease, transform var(--sprt-normal) var(--sprt-ease);
}

.sprt-hero-story > a:hover,
.sprt-hero-story > a:focus-visible {
    border-color: var(--sprt-yellow);
    color: #ffffff;
    transform: translateY(-0.35rem);
}

.sprt-hero-story__media,
.sprt-hero-story__media::after {
    position: absolute;
    inset: 0;
}

.sprt-hero-story__media::after {
    background: linear-gradient(to bottom, rgba(13, 0, 27, 0.03) 12%, rgba(13, 0, 27, 0.32) 45%, rgba(13, 0, 27, 0.98) 100%);
    content: "";
}

.sprt-hero-story__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 600ms var(--sprt-ease);
}

.sprt-hero-story > a:hover .sprt-hero-story__media img,
.sprt-hero-story > a:focus-visible .sprt-hero-story__media img {
    transform: scale(1.04);
}

.sprt-hero-story__placeholder {
    position: absolute;
    inset: 0;
    overflow: hidden;
    background:
        linear-gradient(115deg, transparent 0 48%, rgba(255, 255, 255, 0.09) 48.2% 49.2%, transparent 49.4%),
        linear-gradient(135deg, var(--sprt-blue) 0 52%, var(--sprt-red) 52% 100%);
}

.sprt-hero-story__placeholder > span {
    position: absolute;
    top: 44%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: rgba(255, 255, 255, 0.24);
    font-family: var(--sprt-expanded);
    font-size: clamp(4rem, 8vw, 7rem);
    line-height: 0.8;
}

.sprt-hero-story__placeholder > i {
    display: none;
}

.sprt-hero-story__placeholder > small {
    position: absolute;
    top: 1rem;
    left: 1rem;
    color: rgba(255, 255, 255, 0.78);
    font-size: 0.75rem;
}

.sprt-hero-story__body {
    position: relative;
    z-index: 1;
    display: flex;
    min-height: 100%;
    flex-direction: column;
    justify-content: flex-end;
    padding: clamp(1rem, 2vw, 1.35rem);
}

.sprt-hero-story__body > span {
    margin-bottom: var(--sprt-space-2);
    color: var(--sprt-yellow);
    font-size: 0.75rem;
    letter-spacing: 0.025em;
}

.sprt-hero-story__body h3 {
    display: -webkit-box;
    overflow: hidden;
    margin: 0;
    -webkit-box-orient: vertical;
    color: #ffffff;
    font-size: clamp(1.35rem, 2vw, 1.8rem);
    line-height: 1.06;
    -webkit-line-clamp: 2;
}

.sprt-hero-story__body small {
    display: flex;
    min-height: 2.75rem;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--sprt-space-3);
    color: rgba(255, 255, 255, 0.82);
    font-size: 0.75rem;
}

.sprt-hero-story__body small b {
    color: var(--sprt-yellow);
    font-family: var(--sprt-font);
    font-size: 1.15rem;
}

.sprt-hero--editorial + .sprt-score-strip {
    border-top: 0;
    background:
        linear-gradient(112deg, rgba(17, 123, 32, 0.98) 0 50%, rgba(121, 0, 243, 0.96) 50% 100%),
        var(--sprt-navy);
}

.sprt-hero--editorial + .sprt-score-strip .sprt-score-strip__grid > div {
    border-color: rgba(255, 255, 255, 0.2);
}

body.sprt-home .sprt-capacity {
    background: linear-gradient(90deg, var(--sprt-navy), var(--sprt-blue));
}

body.sprt-home .sprt-live-dot {
    border-color: var(--sprt-yellow);
    box-shadow: 0 0 0 4px rgba(25, 175, 45, 0.2);
}

body.sprt-home .sprt-main {
    background: #e9eaf0 !important;
}

body.sprt-home .sprt-main > .sprt-section {
    width: min(calc(100% - 2rem), 80rem);
    margin: 1rem auto;
    overflow: hidden;
    border-radius: var(--sprt-radius-lg);
    background-color: #ffffff;
}

body.sprt-home .sprt-main > .sprt-section--muted {
    background-color: #f6f7fa;
}

body.sprt-home .sprt-main > .sprt-section--red {
    background-color: var(--sprt-red);
}

body.sprt-home .sprt-main > .sprt-section:not(.sprt-section--red) {
    --sprt-bg: #ffffff;
    --sprt-bg-elevated: #ffffff;
    --sprt-surface: #f3f4f8;
    --sprt-surface-2: #e7e9f0;
    --sprt-text: #1a1026;
    --sprt-text-soft: #595163;
    --sprt-line: #e2dfe8;
    --sprt-line-strong: #b9b1c5;
    color: var(--sprt-text);
    color-scheme: light;
}

.sprt-story-rail {
    color: var(--sprt-text);
}

body.sprt-home .sprt-main > .sprt-story-rail {
    width: min(calc(100% - 1rem), 96rem);
}

.sprt-story-rail > .sprt-container {
    width: calc(100% - (2 * var(--sprt-gutter)));
    max-width: none;
}

.sprt-story-rail__heading {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: var(--sprt-space-6);
    margin-bottom: var(--sprt-space-8);
    text-align: center;
}

.sprt-story-rail__heading h2 {
    max-width: 22ch;
    margin: var(--sprt-space-3) auto 0;
    font-size: clamp(2rem, 4vw, 3.25rem);
    line-height: 1.05;
}

.sprt-story-rail__controls {
    position: absolute;
    right: 0;
    bottom: 0;
    display: flex;
    gap: var(--sprt-space-2);
}

.sprt-story-rail__controls button {
    display: grid;
    width: 3rem;
    height: 3rem;
    place-items: center;
    border: 1px solid var(--sprt-line-strong);
    border-radius: 50%;
    background: var(--sprt-bg-elevated);
    color: var(--sprt-text);
    cursor: pointer;
    font-family: var(--sprt-font);
    font-size: 1.25rem;
    transition: border-color var(--sprt-fast) ease, background var(--sprt-fast) ease, color var(--sprt-fast) ease;
}

.sprt-story-rail__controls button:hover:not(:disabled),
.sprt-story-rail__controls button:focus-visible {
    border-color: var(--sprt-red);
    background: var(--sprt-red);
    color: #ffffff;
}

.sprt-story-rail__controls button:disabled {
    opacity: 0.36;
    cursor: default;
}

.sprt-story-rail__track {
    display: grid;
    grid-auto-columns: clamp(10.5rem, 17vw, 14rem);
    grid-auto-flow: column;
    gap: var(--sprt-space-4);
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    padding: var(--sprt-space-2) var(--sprt-space-2) var(--sprt-space-5);
    scroll-padding-inline: var(--sprt-space-2);
    scroll-snap-type: inline mandatory;
    scrollbar-width: thin;
}

.sprt-story-tile {
    position: relative;
    display: flex;
    min-width: 0;
    min-height: 2.75rem;
    flex-direction: column;
    color: var(--sprt-text);
    scroll-snap-align: start;
    text-decoration: none;
}

.sprt-story-tile__media {
    position: relative;
    display: grid;
    width: 100%;
    aspect-ratio: 4 / 5;
    margin-bottom: var(--sprt-space-3);
    place-items: center;
    overflow: hidden;
    border: 0.2rem solid transparent;
    border-radius: var(--sprt-radius-lg);
    background:
        linear-gradient(135deg, transparent 0 46%, rgba(255, 255, 255, 0.1) 46.3% 47%, transparent 47.3%),
        linear-gradient(145deg, var(--sprt-blue) 0 52%, var(--sprt-red) 52% 100%);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.16);
    transition: border-color var(--sprt-fast) ease, transform var(--sprt-normal) var(--sprt-ease);
}

.sprt-story-tile:hover .sprt-story-tile__media,
.sprt-story-tile:focus-visible .sprt-story-tile__media {
    transform: translateY(-0.25rem);
    border-color: var(--sprt-yellow);
}

.sprt-story-tile__media > b {
    color: rgba(255, 255, 255, 0.2);
    font-family: var(--sprt-expanded);
    font-size: clamp(3.8rem, 7vw, 6rem);
    font-weight: 400;
    line-height: 0.8;
}

.sprt-story-tile__media > i {
    display: none;
}

.sprt-story-tile__media > small {
    position: absolute;
    bottom: var(--sprt-space-3);
    left: var(--sprt-space-3);
    color: rgba(255, 255, 255, 0.82);
    font-size: 0.75rem;
}

.sprt-story-tile > strong {
    font-family: var(--sprt-display);
    font-size: 1.25rem;
    font-weight: 400;
    line-height: 1.05;
}

.sprt-story-tile > small {
    color: var(--sprt-text-soft);
    font-size: 0.75rem;
}

.sprt-story-tile > em {
    position: absolute;
    top: var(--sprt-space-3);
    left: var(--sprt-space-3);
    padding: 0.25rem 0.45rem;
    border-radius: var(--sprt-radius-pill);
    background: var(--sprt-yellow);
    color: var(--sprt-deep);
    font-size: 0.75rem;
    font-style: normal;
}

body.sprt-home #szolgaltatasok .sprt-section-heading,
body.sprt-home .sprt-portfolio-preview .sprt-section-heading {
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
}

body.sprt-home #szolgaltatasok .sprt-section-heading h2,
body.sprt-home .sprt-portfolio-preview .sprt-section-heading h2 {
    max-width: 21ch;
}

body.sprt-home #szolgaltatasok .sprt-service-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--sprt-space-4);
}

body.sprt-home #szolgaltatasok .sprt-service-grid article {
    isolation: isolate;
    display: flex;
    min-height: clamp(18rem, 34vw, 24rem);
    flex-direction: column;
    justify-content: flex-end;
    overflow: hidden;
    border-color: var(--sprt-line);
    background:
        linear-gradient(to bottom, transparent 0 50%, var(--sprt-bg-elevated) 50% 100%),
        linear-gradient(140deg, var(--sprt-blue) 0 56%, var(--sprt-red) 56% 100%);
    color: var(--sprt-text);
}

body.sprt-home #szolgaltatasok .sprt-service-grid article:nth-child(3n + 2) {
    background:
        linear-gradient(to bottom, transparent 0 50%, var(--sprt-bg-elevated) 50% 100%),
        linear-gradient(150deg, var(--sprt-navy), var(--sprt-blue));
}

body.sprt-home #szolgaltatasok .sprt-service-grid article:nth-child(3n) {
    background:
        linear-gradient(to bottom, transparent 0 50%, var(--sprt-bg-elevated) 50% 100%),
        linear-gradient(145deg, var(--sprt-red), #3b006f);
}

body.sprt-home #szolgaltatasok .sprt-service-grid article::before {
    position: absolute;
    z-index: -1;
    top: 43%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: rgba(255, 255, 255, 0.1);
    font-family: var(--sprt-expanded);
    font-size: clamp(5rem, 12vw, 9rem);
    line-height: 0.8;
    content: "SPRT";
}

body.sprt-home #szolgaltatasok .sprt-service-grid article > span {
    position: absolute;
    top: var(--sprt-space-5);
    left: var(--sprt-space-5);
    color: var(--sprt-yellow);
}

body.sprt-home #szolgaltatasok .sprt-service-grid article h3 {
    max-width: 14ch;
    margin: 0 0 var(--sprt-space-3);
    color: var(--sprt-text);
    font-size: clamp(1.5rem, 2.4vw, 2.1rem);
}

body.sprt-home #szolgaltatasok .sprt-service-grid article p {
    color: var(--sprt-text-soft);
}

body.sprt-home .sprt-portfolio-preview .sprt-facebook-grid {
    width: 100%;
}

.sprt-facebook-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: clamp(1rem, 2.4vw, 1.5rem);
}

.sprt-facebook-card {
    position: relative;
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(13, 0, 27, 0.15);
    border-radius: var(--sprt-radius-lg);
    background: #ffffff;
    color: #0d001b;
    box-shadow: 0 0.5rem 1.5rem rgba(13, 0, 27, 0.07);
    transition:
        border-color var(--sprt-normal) ease,
        box-shadow var(--sprt-normal) ease,
        transform var(--sprt-normal) var(--sprt-ease);
}

.sprt-facebook-card:hover,
.sprt-facebook-card:focus-within {
    z-index: 2;
    transform: translateY(-0.5rem);
    border-color: #19af2d;
    box-shadow: 0 1.5rem 3rem rgba(13, 0, 27, 0.18);
}

.sprt-facebook-card > a {
    display: flex;
    min-height: 100%;
    flex-direction: column;
    color: inherit;
    text-decoration: none;
}

.sprt-facebook-card__media {
    position: relative;
    display: grid;
    aspect-ratio: 4 / 3;
    place-items: center;
    overflow: hidden;
    isolation: isolate;
    background: linear-gradient(142deg, #7900f3 0 63%, #19af2d 63.2% 100%);
    color: #ffffff;
}

.sprt-facebook-card__media::before {
    display: none;
}

.sprt-facebook-card__media::after {
    position: absolute;
    inset: -50% auto -50% -65%;
    width: 38%;
    transform: rotate(18deg);
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.26), transparent);
    content: "";
    transition: left 600ms var(--sprt-ease);
}

.sprt-facebook-card:hover .sprt-facebook-card__media::after,
.sprt-facebook-card:focus-within .sprt-facebook-card__media::after {
    left: 125%;
}

.sprt-facebook-card__media > span,
.sprt-facebook-card__media > b,
.sprt-facebook-card__media > small {
    position: absolute;
    z-index: 2;
}

.sprt-facebook-card__media > span {
    top: var(--sprt-space-4);
    left: var(--sprt-space-4);
    padding: 0.35rem 0.55rem;
    border: 1px solid rgba(255, 255, 255, 0.72);
    border-radius: var(--sprt-radius-pill);
    background: rgba(13, 0, 27, 0.46);
    color: #ffffff;
    font-family: var(--sprt-expanded);
    font-size: 0.875rem;
    line-height: 1;
    transition: transform var(--sprt-normal) var(--sprt-ease);
}

.sprt-facebook-card:hover .sprt-facebook-card__media > span,
.sprt-facebook-card:focus-within .sprt-facebook-card__media > span {
    transform: rotate(-5deg) scale(1.08);
}

.sprt-facebook-card__media > b {
    top: var(--sprt-space-4);
    right: var(--sprt-space-4);
    padding: 0.35rem 0.55rem;
    border-radius: var(--sprt-radius-pill);
    background: #ffffff;
    color: #5f00bf;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1;
    transition: background var(--sprt-fast) ease, color var(--sprt-fast) ease, transform var(--sprt-normal) var(--sprt-ease);
}

.sprt-facebook-card:hover .sprt-facebook-card__media > b,
.sprt-facebook-card:focus-within .sprt-facebook-card__media > b {
    transform: scale(1.06);
    background: #19af2d;
    color: #0d001b;
}

.sprt-facebook-card__media > strong {
    color: rgba(255, 255, 255, 0.84);
    font-family: var(--sprt-expanded);
    font-size: clamp(3.75rem, 8vw, 6.5rem);
    font-weight: 400;
    line-height: 0.8;
    transition: letter-spacing 500ms var(--sprt-ease), transform 500ms var(--sprt-ease);
}

.sprt-facebook-card:hover .sprt-facebook-card__media > strong,
.sprt-facebook-card:focus-within .sprt-facebook-card__media > strong {
    transform: scale(1.07);
    letter-spacing: 0.04em;
}

.sprt-facebook-card__media > small {
    right: var(--sprt-space-4);
    bottom: var(--sprt-space-4);
    padding: 0.3rem 0.5rem;
    border-radius: var(--sprt-radius-pill);
    background: rgba(13, 0, 27, 0.82);
    color: #ffffff;
    font-size: 0.875rem;
}

.sprt-facebook-card__body {
    display: flex;
    min-height: 17rem;
    flex: 1;
    flex-direction: column;
    padding: clamp(1rem, 2.5vw, 1.35rem);
    background: #ffffff;
}

.sprt-facebook-card__body > small {
    color: #5f5a65;
    font-size: 0.875rem;
}

.sprt-facebook-card__body h3 {
    margin: var(--sprt-space-3) 0 var(--sprt-space-5);
    color: #0d001b;
    font-family: var(--sprt-display);
    font-size: clamp(1.5rem, 2.3vw, 1.85rem);
    font-weight: 400;
    line-height: 1.08;
    text-transform: none;
}

.sprt-facebook-card__body dl {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--sprt-space-2);
    margin: auto 0 var(--sprt-space-5);
}

.sprt-facebook-card__body dl > div {
    min-width: 0;
    padding-top: var(--sprt-space-3);
    border-top: 1px solid rgba(13, 0, 27, 0.16);
}

.sprt-facebook-card__body dt {
    overflow: hidden;
    color: #5f5a65;
    font-size: 0.8125rem;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sprt-facebook-card__body dd {
    margin: 0.2rem 0 0;
    color: #5f00bf;
    font-family: var(--sprt-expanded);
    font-size: 1.15rem;
    line-height: 1;
    transition: color var(--sprt-fast) ease;
}

.sprt-facebook-card:hover .sprt-facebook-card__body dd,
.sprt-facebook-card:focus-within .sprt-facebook-card__body dd {
    color: #087719;
}

.sprt-facebook-card__link {
    display: flex;
    min-height: 2.75rem;
    align-items: center;
    justify-content: space-between;
    gap: var(--sprt-space-3);
    padding-top: var(--sprt-space-4);
    border-top: 1px solid rgba(13, 0, 27, 0.16);
    color: #5f00bf;
    font-size: 0.95rem;
}

.sprt-facebook-card__link i {
    display: grid;
    width: 2rem;
    aspect-ratio: 1;
    place-items: center;
    border-radius: 50%;
    background: #7900f3;
    color: #ffffff;
    font-style: normal;
    transition: background var(--sprt-fast) ease, transform var(--sprt-normal) var(--sprt-ease);
}

.sprt-facebook-card:hover .sprt-facebook-card__link i,
.sprt-facebook-card:focus-within .sprt-facebook-card__link i {
    transform: translate(0.2rem, -0.2rem) rotate(8deg);
    background: #19af2d;
    color: #0d001b;
}

@media (min-width: 40rem) {
    .sprt-facebook-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 48rem) {
    body.sprt-home #szolgaltatasok .sprt-service-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 64rem) {
    .sprt-facebook-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 90rem) {
    body.sprt-home .sprt-portfolio-preview .sprt-facebook-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 63.999rem) {
    .sprt-hero__stage {
        min-height: 0;
        grid-template-rows: auto auto;
        padding-top: clamp(3.5rem, 8vw, 5rem);
    }

    .sprt-hero--editorial .sprt-hero__copy h1 {
        max-width: 18ch;
        font-size: clamp(3.25rem, 9vw, 6rem);
    }
}

@media (max-width: 47.999rem) {
    body.sprt-home .sprt-main > .sprt-section {
        width: 100%;
        margin-block: 0.5rem;
        border-radius: 0;
    }

    body.sprt-home .sprt-main > .sprt-story-rail {
        width: 100%;
    }

    .sprt-story-rail__heading {
        align-items: center;
        justify-content: space-between;
        text-align: left;
    }

    .sprt-story-rail__heading h2 {
        margin-inline: 0;
    }

    .sprt-story-rail__controls {
        position: static;
        flex: 0 0 auto;
    }

    .sprt-hero__stage {
        gap: var(--sprt-space-8);
        padding-top: var(--sprt-space-10);
        padding-bottom: var(--sprt-space-5);
    }

    .sprt-hero--editorial .sprt-hero__copy h1 {
        max-width: 100%;
        margin-block: var(--sprt-space-3) var(--sprt-space-4);
        font-size: clamp(2.65rem, 13vw, 4.2rem);
        line-height: 1.02;
    }

    .sprt-hero--editorial .sprt-hero__copy > p {
        font-size: 0.9375rem;
    }

    .sprt-hero-stories {
        width: calc(100% + var(--sprt-gutter));
        grid-auto-columns: minmax(16.5rem, 78vw);
        grid-template-columns: none;
        grid-auto-flow: column;
        gap: var(--sprt-space-3);
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        padding: 0 var(--sprt-gutter) var(--sprt-space-3) 0;
        scroll-padding-inline: var(--sprt-gutter);
        scroll-snap-type: inline mandatory;
        scrollbar-width: thin;
    }

    .sprt-hero-story {
        scroll-snap-align: start;
    }

    .sprt-hero-story > a {
        min-height: 13.5rem;
    }

}

@media (max-width: 29.999rem) {
    body.sprt-home #szolgaltatasok .sprt-service-grid {
        grid-template-columns: 1fr;
    }

    .sprt-hero--editorial .sprt-button-row {
        gap: var(--sprt-space-2);
    }

    .sprt-hero--editorial .sprt-hero__copy h1 {
        font-size: clamp(2.65rem, 13vw, 3.6rem);
    }
}

/* Laptop readability: Playhigh reads visually smaller than a typical UI face. */
@media (min-width: 64rem) and (max-width: 100rem) {
    body.sprt-page,
    body.sprt-site {
        font-size: 1.0625rem;
        line-height: 1.6;
    }

    .sprt-button,
    .sprt-arrow-link,
    .sprt-text-button,
    .sprt-pagination a,
    .sprt-pagination span {
        font-size: 1rem;
    }

    .sprt-kicker,
    .sprt-score-label,
    .sprt-capacity,
    .sprt-score-strip span,
    .sprt-hero-story__body > span,
    .sprt-hero-story__body > small,
    .sprt-story-tile__media > small,
    .sprt-story-tile > small,
    .sprt-story-tile > em,
    .sprt-work-card__type,
    .sprt-work-card__featured,
    .sprt-work-card__eyebrow,
    .sprt-work-card__club,
    .sprt-facebook-card__body dt,
    .sprt-role-list > span,
    .sprt-metrics dt,
    .sprt-work-card__more,
    .sprt-field > span,
    .sprt-field > label,
    .sprt-field > label:first-child,
    .sprt-article__meta {
        font-size: 0.875rem !important;
    }

    .sprt-work-card__body > p,
    .sprt-post-card p,
    .sprt-process p,
    .sprt-problem-grid p,
    .sprt-service-grid p,
    .sprt-competency-grid p,
    .sprt-contact-expectations p,
    .sprt-footer__grid > div > p,
    .sprt-footer__grid nav a,
    .sprt-form-note p,
    .sprt-check,
    .sprt-service-list__content,
    .sprt-trial-deliverables p,
    .sprt-consent p {
        font-size: 1rem;
        line-height: 1.55;
    }

    .sprt-work-card h3,
    .sprt-post-card h3 {
        font-size: clamp(1.5rem, 6cqw, 1.75rem);
    }

    .sprt-story-tile > strong {
        font-size: 1.5rem;
        line-height: 1.12;
    }
}

@media (min-width: 68.75rem) and (max-width: 100rem) {
    .sprt-nav ul {
        gap: clamp(0.55rem, 1vw, 1rem);
    }

    .sprt-nav li a {
        font-size: 1rem;
    }
}

/* 1.1 release polish: gallery, search, editorial filters and visual showcases. */
.sprt-site {
    letter-spacing: 0.018em;
}

.sprt-site h1,
.sprt-site h2,
.sprt-site h3 {
    letter-spacing: 0.008em;
}

.sprt-hero--editorial .sprt-hero__copy h1 {
    letter-spacing: 0.004em;
}

.sprt-nav li a {
    letter-spacing: 0.012em;
}

.sprt-header .sprt-nav__cta,
.sprt-header .sprt-nav__cta:hover,
.sprt-header .sprt-nav__cta:focus-visible {
    color: #ffffff !important;
}

/* Header article search. */
.sprt-article-search {
    position: relative;
}

.sprt-search-icon {
    position: relative;
    display: block;
    width: 1.15rem;
    height: 1.15rem;
    border: 0.13rem solid currentColor;
    border-radius: 50%;
}

.sprt-search-icon::after {
    position: absolute;
    right: -0.38rem;
    bottom: -0.24rem;
    width: 0.52rem;
    height: 0.13rem;
    transform: rotate(45deg);
    transform-origin: left center;
    border-radius: 999px;
    background: currentColor;
    content: "";
}

.sprt-article-search__toggle:hover,
.sprt-article-search__toggle:focus-visible,
.sprt-article-search__toggle[aria-expanded="true"] {
    transform: translateY(-0.12rem);
    border-color: #7900f3;
    background: #7900f3;
    color: #ffffff;
    box-shadow: 0 0.8rem 1.8rem rgba(121, 0, 243, 0.2);
}

.sprt-article-search__panel {
    position: absolute;
    z-index: 60;
    top: calc(100% + 1rem);
    right: 0;
    width: min(44rem, calc(100vw - 2rem));
    padding: clamp(1.25rem, 3vw, 2rem);
    border: 1px solid rgba(13, 0, 27, 0.14);
    border-radius: 1rem;
    background:
        linear-gradient(135deg, rgba(121, 0, 243, 0.06), transparent 42%),
        #ffffff;
    color: #0d001b;
    box-shadow: 0 2rem 5rem rgba(13, 0, 27, 0.24);
}

.sprt-article-search__panel[hidden] {
    display: none;
}

.sprt-article-search__heading,
.sprt-article-search__panel form,
.sprt-article-search__quick {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.sprt-article-search__heading {
    justify-content: space-between;
    margin-bottom: 1.25rem;
}

.sprt-article-search__heading div {
    display: grid;
    gap: 0.2rem;
}

.sprt-article-search__heading span,
.sprt-article-search__quick > span {
    color: #7900f3;
    font-size: 0.8rem;
    text-transform: uppercase;
}

.sprt-article-search__heading strong {
    font-family: var(--sprt-display);
    font-size: clamp(1.8rem, 4vw, 2.7rem);
    font-weight: 400;
    line-height: 1;
}

.sprt-article-search__heading > button {
    display: grid;
    width: 2.75rem;
    height: 2.75rem;
    place-items: center;
    border: 1px solid rgba(13, 0, 27, 0.18);
    border-radius: 50%;
    background: transparent;
    color: #0d001b;
    cursor: pointer;
    font-family: var(--sprt-font);
    font-size: 1.5rem;
}

.sprt-article-search__heading > button:hover,
.sprt-article-search__heading > button:focus-visible {
    transform: rotate(8deg);
    background: #19af2d;
}

.sprt-article-search__panel form {
    padding: 0.35rem;
    border: 2px solid #0d001b;
    border-radius: 0.75rem;
    background: #ffffff;
}

.sprt-article-search__panel input {
    min-width: 0;
    min-height: 3.25rem;
    flex: 1;
    border: 0;
    outline: 0;
    background: transparent;
    color: #0d001b;
    font-family: var(--sprt-font);
    font-size: 1.05rem;
}

.sprt-article-search__panel form > button {
    display: inline-flex;
    min-height: 3rem;
    align-items: center;
    gap: 0.7rem;
    padding-inline: 1.1rem;
    border: 0;
    border-radius: 0.55rem;
    background: #7900f3;
    color: #ffffff;
    cursor: pointer;
    font-family: var(--sprt-font);
}

.sprt-article-search__panel form .sprt-search-icon {
    width: 0.9rem;
    height: 0.9rem;
}

.sprt-article-search__quick {
    flex-wrap: wrap;
    margin-top: 1.25rem;
}

.sprt-article-search__quick a {
    padding: 0.45rem 0.7rem;
    border: 1px solid rgba(13, 0, 27, 0.16);
    border-radius: 999px;
    color: #0d001b;
    font-size: 0.85rem;
    text-decoration: none;
}

.sprt-article-search__quick a:hover,
.sprt-article-search__quick a:focus-visible {
    transform: translateY(-0.12rem);
    border-color: #19af2d;
    background: #19af2d;
}

/* Header-bottom article or full-page progress. */
.sprt-reading-progress {
    position: absolute;
    right: 0;
    bottom: -0.3rem;
    left: 0;
    height: 0.3rem;
    overflow: hidden;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(25, 175, 45, 0.2), rgba(121, 0, 243, 0.2));
}

.sprt-reading-progress > span {
    display: block;
    width: 100%;
    height: 100%;
    transform: scaleX(0);
    transform-origin: left center;
    background: linear-gradient(90deg, #19af2d 0%, #56c965 34%, #9a36ef 68%, #7900f3 100%);
    box-shadow: 0 0 1rem rgba(121, 0, 243, 0.45);
    transition: transform 100ms linear;
}

.sprt-no-js .sprt-reading-progress {
    display: none;
}

/* Smooth hero background gallery and fixed purple contrast overlay. */
.sprt-hero--editorial::before {
    background:
        var(--sprt-noise),
        linear-gradient(90deg, rgba(13, 0, 27, 0.62), rgba(82, 0, 164, 0.36) 52%, rgba(13, 0, 27, 0.42)),
        linear-gradient(to bottom, rgba(121, 0, 243, 0.12), rgba(13, 0, 27, 0.7));
    background-size: 180px 180px, auto, auto;
    background-blend-mode: soft-light, normal, normal;
}

.sprt-hero-gallery {
    --sprt-gallery-transition: 3000ms;
    --sprt-gallery-zoom: 12000ms;
    overflow: hidden;
}

.sprt-hero-gallery__slide {
    position: absolute;
    z-index: 0;
    inset: 0;
    overflow: hidden;
    opacity: 0;
}

.sprt-hero-gallery.is-ready .sprt-hero-gallery__slide {
    transition: opacity var(--sprt-gallery-transition) cubic-bezier(0.4, 0, 0.2, 1);
}

.sprt-hero-gallery__slide.is-active {
    z-index: 1;
    opacity: 1;
}

.sprt-hero-gallery__slide.is-leaving {
    z-index: 2;
    opacity: 0;
}

.sprt-hero-gallery__image {
    transform: scale(1.08);
    object-position: center 62%;
    filter: saturate(1.04) contrast(1.03) brightness(1.04);
}

.sprt-hero-gallery__slide:is(.is-active, .is-leaving) .sprt-hero-gallery__image {
    animation: sprt-hero-zoom-out var(--sprt-gallery-zoom) linear both;
}

.sprt-hero-gallery.is-paused .sprt-hero-gallery__image {
    animation-play-state: paused;
}

.sprt-hero-gallery.is-static .sprt-hero-gallery__slide {
    transition: none;
}

.sprt-hero-gallery.is-static .sprt-hero-gallery__image {
    animation: none;
    transform: none;
}

@keyframes sprt-hero-zoom-out {
    from { transform: scale(1.08); }
    to { transform: scale(1); }
}

.sprt-hero-gallery__controls {
    position: absolute;
    z-index: 4;
    top: clamp(1rem, 2.5vw, 2rem);
    right: max(var(--sprt-gutter), calc((100vw - 80rem) / 2));
    display: flex;
    align-items: center;
    gap: 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: #ffffff;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}

.sprt-hero-gallery__count {
    min-width: 3.35rem;
    font-family: var(--sprt-expanded);
    font-size: 0.78rem;
    letter-spacing: 0.08em;
}

.sprt-hero-gallery__dots {
    display: flex;
    gap: 0.3rem;
}

.sprt-hero-gallery__dots button {
    width: 1.45rem;
    height: 0.3rem;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.38);
    cursor: pointer;
    transition: width 300ms ease, background 300ms ease, transform 300ms ease;
}

.sprt-hero-gallery__dots button:hover,
.sprt-hero-gallery__dots button:focus-visible {
    transform: scaleY(1.8);
    background: #ffffff;
}

.sprt-hero-gallery__dots button[aria-pressed="true"] {
    width: 2.2rem;
    background: #19af2d;
}

.sprt-hero-gallery__toggle {
    display: grid;
    width: 2.35rem;
    height: 2.35rem;
    place-items: center;
    border: 0;
    border-radius: 50%;
    background: #7900f3;
    color: #ffffff;
    cursor: pointer;
}

.sprt-hero-gallery__toggle:hover,
.sprt-hero-gallery__toggle:focus-visible {
    transform: rotate(7deg) scale(1.06);
    background: #19af2d;
    color: #0d001b;
}

.sprt-hero-gallery__toggle-icon {
    display: flex;
    gap: 0.22rem;
}

.sprt-hero-gallery__toggle-icon i {
    display: block;
    width: 0.15rem;
    height: 0.8rem;
    border-radius: 999px;
    background: currentColor;
}

.sprt-hero-gallery__toggle[aria-pressed="true"] .sprt-hero-gallery__toggle-icon {
    width: 0;
    height: 0;
    border-top: 0.42rem solid transparent;
    border-bottom: 0.42rem solid transparent;
    border-left: 0.7rem solid currentColor;
}

.sprt-hero-gallery__toggle[aria-pressed="true"] .sprt-hero-gallery__toggle-icon i {
    display: none;
}

/* Stronger metrics. */
.sprt-score-strip strong {
    color: #ffffff;
    font-size: clamp(2.3rem, 4vw, 4rem);
    letter-spacing: 0.01em;
    text-shadow: 0 0.15rem 1rem rgba(13, 0, 27, 0.24);
}

.sprt-score-strip span {
    max-width: 15ch;
    font-size: 1rem;
    line-height: 1.35;
}

/* Visual problem bento: bright shell, alternating high-contrast cards. */
body.sprt-home .sprt-main > .sprt-section.sprt-problems {
    position: relative;
    width: min(calc(100% - 1rem), 96rem);
    padding-block: clamp(3rem, 5.5vw, 5rem);
    background: #ffffff;
}

.sprt-problems::before {
    position: absolute;
    top: 2rem;
    right: 3%;
    color: rgba(121, 0, 243, 0.045);
    font-family: var(--sprt-expanded);
    font-size: clamp(10rem, 24vw, 24rem);
    line-height: 0.7;
    content: "04";
    pointer-events: none;
}

.sprt-problems .sprt-section-heading {
    position: relative;
    z-index: 1;
    align-items: end;
    margin-bottom: clamp(1.5rem, 3vw, 2.75rem);
}

.sprt-problems .sprt-section-heading h2 {
    max-width: 17ch;
    font-size: clamp(2.75rem, 5vw, 4.9rem);
    line-height: 0.98;
}

.sprt-problems .sprt-section-heading > p {
    max-width: 34rem;
    padding: 1.25rem 0 1.25rem 1.5rem;
    border-left: 0.35rem solid #19af2d;
    color: #3d3149;
    font-size: clamp(1rem, 1.5vw, 1.2rem);
}

.sprt-problems__hint {
    display: none;
}

.sprt-problems .sprt-problem-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: clamp(0.85rem, 1.6vw, 1.4rem);
    border: 0;
    background: transparent;
}

.sprt-problems .sprt-problem-grid article {
    isolation: isolate;
    display: flex;
    min-height: clamp(18rem, 24vw, 23rem);
    flex-direction: column;
    justify-content: flex-end;
    overflow: hidden;
    grid-column: span 6;
    padding: clamp(1.5rem, 3vw, 2.5rem);
    border: 1px solid rgba(13, 0, 27, 0.12);
    border-radius: 1.25rem;
    background: #ffffff;
    box-shadow: 0 0.8rem 2.2rem rgba(13, 0, 27, 0.08);
    transition: transform 500ms var(--sprt-ease), border-color 350ms ease, box-shadow 500ms ease;
}

.sprt-problems .sprt-problem-grid article:nth-child(4n + 1) {
    grid-column: span 7;
    background: linear-gradient(145deg, #18002f, #5d00ba);
    color: #ffffff;
}

.sprt-problems .sprt-problem-grid article:nth-child(4n + 2) {
    grid-column: span 5;
    border-top: 0.55rem solid #7900f3;
}

.sprt-problems .sprt-problem-grid article:nth-child(4n + 3) {
    grid-column: span 5;
    background: linear-gradient(145deg, #19af2d, #68dc77);
    color: #0d001b;
}

.sprt-problems .sprt-problem-grid article:nth-child(4n) {
    grid-column: span 7;
    background: linear-gradient(145deg, #0d001b, #201c48);
    color: #ffffff;
}

.sprt-problems .sprt-problem-grid article::before {
    display: none;
}

.sprt-problems .sprt-problem-grid article > span {
    position: absolute;
    top: clamp(1.2rem, 3vw, 2rem);
    left: clamp(1.5rem, 3vw, 2.5rem);
    color: currentColor;
    font-family: var(--sprt-expanded);
    font-size: clamp(4.5rem, 10vw, 8rem) !important;
    line-height: 0.75;
    opacity: 0.14;
    transition: opacity 400ms ease, transform 500ms var(--sprt-ease);
}

.sprt-problems .sprt-problem-grid h3 {
    position: relative;
    z-index: 1;
    max-width: 18ch;
    margin: 0 0 1rem;
    color: currentColor;
    font-size: clamp(1.85rem, 3.2vw, 3.1rem);
    line-height: 1.02;
}

.sprt-problems .sprt-problem-grid p {
    position: relative;
    z-index: 1;
    max-width: 39rem;
    color: currentColor;
    font-size: 1.05rem;
    opacity: 0.82;
}

@media (hover: hover) and (pointer: fine) {
    .sprt-problems .sprt-problem-grid article:hover {
        transform: translateY(-0.65rem) rotate(-0.25deg);
        border-color: #19af2d;
        box-shadow: 0 1.8rem 3.5rem rgba(13, 0, 27, 0.18);
    }

    .sprt-problems .sprt-problem-grid article:nth-child(even):hover {
        transform: translateY(-0.65rem) rotate(0.25deg);
    }

    .sprt-problems .sprt-problem-grid article:hover > span {
        transform: translateX(0.4rem) scale(1.04);
        opacity: 0.24;
    }
}

/* More dynamic 4:5 service cards. */
body.sprt-home .sprt-main > .sprt-section.sprt-services-showcase {
    width: min(calc(100% - 1rem), 96rem);
    background:
        linear-gradient(135deg, rgba(25, 175, 45, 0.06), transparent 36%),
        #ffffff;
}

body.sprt-home #szolgaltatasok.sprt-services-showcase .sprt-service-grid {
    grid-template-columns: 1fr;
    gap: clamp(1rem, 2vw, 1.5rem);
}

body.sprt-home #szolgaltatasok.sprt-services-showcase .sprt-service-grid article {
    isolation: isolate;
    min-height: 0;
    aspect-ratio: 4 / 5;
    padding: clamp(1.4rem, 3vw, 2rem);
    border: 1px solid rgba(13, 0, 27, 0.14);
    border-radius: 1rem;
    background:
        linear-gradient(to bottom, transparent 0 55%, #ffffff 55% 100%),
        linear-gradient(140deg, #117b20 0 55%, #7900f3 55% 100%);
    box-shadow: 0 0.8rem 2rem rgba(13, 0, 27, 0.08);
    transition: transform 500ms var(--sprt-ease), border-color 350ms ease, box-shadow 500ms ease;
}

body.sprt-home #szolgaltatasok.sprt-services-showcase .sprt-service-grid article:nth-child(3n + 2) {
    background:
        linear-gradient(to bottom, transparent 0 55%, #ffffff 55% 100%),
        linear-gradient(145deg, #0d001b, #0b5230);
}

body.sprt-home #szolgaltatasok.sprt-services-showcase .sprt-service-grid article:nth-child(3n) {
    background:
        linear-gradient(to bottom, transparent 0 55%, #ffffff 55% 100%),
        linear-gradient(145deg, #7900f3, #440087);
}

body.sprt-home #szolgaltatasok.sprt-services-showcase .sprt-service-grid article::before {
    z-index: 0;
    top: 32%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: rgba(255, 255, 255, 0.15);
    font-size: clamp(5.5rem, 13vw, 10rem);
    transition: transform 750ms var(--sprt-ease), opacity 450ms ease;
}

body.sprt-home #szolgaltatasok.sprt-services-showcase .sprt-service-grid article::after {
    display: none;
}

body.sprt-home #szolgaltatasok.sprt-services-showcase .sprt-service-grid article > span {
    z-index: 2;
    top: 1.5rem;
    left: 1.5rem;
    color: #19af2d;
    font-size: 0.95rem !important;
}

body.sprt-home #szolgaltatasok.sprt-services-showcase .sprt-service-grid article h3,
body.sprt-home #szolgaltatasok.sprt-services-showcase .sprt-service-grid article p {
    position: relative;
    z-index: 2;
}

body.sprt-home #szolgaltatasok.sprt-services-showcase .sprt-service-grid article h3 {
    max-width: 15ch;
    margin-bottom: 0.9rem;
    color: #0d001b;
    font-size: clamp(1.75rem, 2.5vw, 2.5rem);
    line-height: 1.05;
}

body.sprt-home #szolgaltatasok.sprt-services-showcase .sprt-service-grid article p {
    color: #51455c;
    font-size: 1rem;
}

@media (hover: hover) and (pointer: fine) {
    body.sprt-home #szolgaltatasok.sprt-services-showcase .sprt-service-grid article:hover {
        transform: translateY(-0.65rem);
        border-color: #19af2d;
        box-shadow: 0 1.8rem 3.5rem rgba(13, 0, 27, 0.17);
    }

    body.sprt-home #szolgaltatasok.sprt-services-showcase .sprt-service-grid article:hover::before {
        transform: translate(-48%, -50%) scale(1.1) rotate(-2deg);
        opacity: 1;
    }

}

/* Instagram community CTA with generated demo athlete. */
body.sprt-home .sprt-main > .sprt-section.sprt-instagram-cta {
    width: min(calc(100% - 1rem), 96rem);
    padding-block: 0;
    background-image:
        var(--sprt-noise),
        linear-gradient(125deg, #0d001b 0 38%, #7900f3 76%, #4b0096 100%);
    background-size: 180px 180px, auto;
    background-blend-mode: soft-light, normal;
    color: #ffffff;
}

.sprt-instagram-cta__grid {
    display: grid;
    min-height: clamp(34rem, 52vw, 46rem);
    grid-template-columns: minmax(0, 1.1fr) minmax(20rem, 0.9fr);
    align-items: center;
    gap: clamp(1rem, 4vw, 4rem);
}

.sprt-instagram-cta__copy {
    position: relative;
    z-index: 2;
    padding-block: clamp(3rem, 8vw, 6rem);
}

.sprt-instagram-cta .sprt-kicker {
    color: #19af2d;
}

.sprt-instagram-cta h2 {
    max-width: 12ch;
    margin: 1rem 0 1.4rem;
    color: #ffffff;
    font-size: clamp(3.2rem, 6.5vw, 7rem);
    font-weight: 400;
    line-height: 0.94;
    text-shadow: 0 0.3rem 1.8rem rgba(13, 0, 27, 0.35);
}

.sprt-instagram-cta p {
    max-width: 43rem;
    margin-bottom: 2rem;
    color: rgba(255, 255, 255, 0.84);
    font-size: clamp(1.05rem, 1.5vw, 1.25rem);
}

.sprt-button--instagram {
    border-color: #ffffff;
    background: #ffffff;
    color: #0d001b !important;
}

.sprt-button--instagram:link,
.sprt-button--instagram:visited,
.sprt-button--instagram span {
    color: #0d001b !important;
    opacity: 1;
    visibility: visible;
}

.sprt-button--instagram:hover,
.sprt-button--instagram:focus-visible {
    transform: translateY(-0.25rem) rotate(-0.4deg);
    border-color: #19af2d;
    background: #19af2d;
    color: #0d001b;
    box-shadow: 0 1.2rem 2.5rem rgba(13, 0, 27, 0.28);
}

.sprt-button--instagram:hover span,
.sprt-button--instagram:focus-visible span {
    color: #0d001b !important;
}

.sprt-instagram-cta__visual {
    position: relative;
    z-index: 1;
    align-self: stretch;
    min-height: 32rem;
}

.sprt-instagram-cta__visual::before {
    display: none;
}

.sprt-instagram-cta__visual img {
    position: absolute;
    z-index: 2;
    right: -12%;
    bottom: 0;
    width: clamp(38rem, 52vw, 58rem);
    max-width: none;
    height: auto;
    max-height: 96%;
    object-fit: contain;
    object-position: bottom center;
    filter: drop-shadow(-1.5rem 1.4rem 2rem rgba(13, 0, 27, 0.4));
    transition: transform 700ms var(--sprt-ease), filter 500ms ease;
}

.sprt-instagram-cta:hover .sprt-instagram-cta__visual img {
    transform: translateX(-0.75rem) scale(1.015);
    filter: drop-shadow(-2rem 1.8rem 2.5rem rgba(13, 0, 27, 0.5));
}

.sprt-instagram-cta__badge {
    position: absolute;
    z-index: 3;
    top: 2rem;
    right: 0;
    padding: 0.45rem 0.65rem;
    border-radius: 999px;
    background: #19af2d;
    color: #0d001b;
    font-size: 0.75rem;
}

/* High-contrast collaboration steps without decorative rings. */
body.sprt-home .sprt-main > .sprt-section--red {
    background-image:
        var(--sprt-noise),
        linear-gradient(135deg, #4a0095 0%, #7900f3 58%, #5f00bf 100%);
    background-size: 180px 180px, auto;
    background-blend-mode: soft-light, normal;
    color: #ffffff;
}

body.sprt-home .sprt-main > .sprt-section--red::after {
    display: none;
}

body.sprt-home .sprt-main > .sprt-section--red .sprt-section-heading h2 {
    color: #ffffff;
    text-shadow: 0 0.2rem 1rem rgba(13, 0, 27, 0.24);
}

body.sprt-home .sprt-main > .sprt-section--red .sprt-kicker {
    color: #d9ffde;
}

body.sprt-home .sprt-main > .sprt-section--red .sprt-process li,
body.sprt-home .sprt-main > .sprt-section--red .sprt-process li:last-child {
    border: 1px solid rgba(255, 255, 255, 0.58);
    background: #17002e;
    color: #ffffff;
    box-shadow: 0 0.75rem 1.8rem rgba(13, 0, 27, 0.18);
}

body.sprt-home .sprt-main > .sprt-section--red .sprt-process li:nth-child(even) {
    border-color: #ffffff;
    background: #ffffff;
    color: #0d001b;
}

body.sprt-home .sprt-main > .sprt-section--red .sprt-process li > span {
    color: #56df68;
}

body.sprt-home .sprt-main > .sprt-section--red .sprt-process li:nth-child(even) > span {
    color: #5f00bf;
}

body.sprt-home .sprt-main > .sprt-section--red .sprt-process h3,
body.sprt-home .sprt-main > .sprt-section--red .sprt-process p {
    color: currentColor;
    opacity: 1;
}

/* The footer CTA should feel like a closing band, not a second hero. */
.sprt-footer__lead {
    gap: clamp(1rem, 2vw, 1.75rem);
    align-items: center;
    padding-block: clamp(1.75rem, 4vw, 3rem);
}

.sprt-footer__lead h2 {
    max-width: 20ch;
    margin-top: 0.45rem;
    font-size: clamp(2rem, 3.7vw, 3.6rem);
    line-height: 1;
}

/* Small repeatable personal reaction dock. */
.sprt-love-dock {
    position: fixed;
    z-index: 92;
    bottom: max(0.7rem, env(safe-area-inset-bottom));
    left: 50%;
    transform: translateX(-50%);
    transition: opacity 180ms ease, transform 280ms var(--sprt-ease);
}

.sprt-love-button {
    position: relative;
    isolation: isolate;
    display: inline-flex;
    min-height: 2.8rem;
    align-items: center;
    gap: 0.48rem;
    overflow: visible;
    padding: 0.48rem 0.8rem 0.48rem 0.55rem;
    border: 1px solid rgba(255, 255, 255, 0.7);
    border-radius: 999px;
    background: rgba(13, 0, 27, 0.94);
    color: #ffffff;
    box-shadow: 0 0.65rem 1.8rem rgba(13, 0, 27, 0.3);
    -webkit-backdrop-filter: blur(12px) saturate(145%);
    backdrop-filter: blur(12px) saturate(145%);
    cursor: pointer;
    line-height: 1;
    transition: border-color 180ms ease, background 180ms ease, box-shadow 180ms ease, transform 180ms var(--sprt-ease);
}

.sprt-love-button:hover,
.sprt-love-button:focus-visible,
.sprt-love-button.has-love {
    border-color: #19af2d;
}

.sprt-love-button:hover,
.sprt-love-button:focus-visible {
    transform: translateY(-0.18rem);
    background: #26004c;
    box-shadow: 0 0.9rem 2.2rem rgba(13, 0, 27, 0.38);
}

.sprt-love-button.is-loved {
    animation: sprt-love-pop 400ms var(--sprt-ease);
}

.sprt-love-button__icon {
    display: grid;
    width: 1.75rem;
    height: 1.75rem;
    place-items: center;
    border-radius: 50%;
    background: #7900f3;
    color: #ffffff;
    font-family: var(--sprt-font);
    font-size: 1rem;
    line-height: 1;
    transition: background 180ms ease, transform 220ms var(--sprt-ease);
}

.sprt-love-button:hover .sprt-love-button__icon,
.sprt-love-button:focus-visible .sprt-love-button__icon,
.sprt-love-button.has-love .sprt-love-button__icon {
    background: #19af2d;
    color: #0d001b;
}

.sprt-love-button.is-loved .sprt-love-button__icon {
    transform: scale(1.18) rotate(-7deg);
}

.sprt-love-button__label,
.sprt-love-button__count {
    color: #ffffff;
    font-family: var(--sprt-font);
    font-size: 0.86rem;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.sprt-love-button__count {
    min-width: 2ch;
    color: #83ed91;
    font-variant-numeric: tabular-nums;
}

.sprt-love-button__bursts {
    position: absolute;
    z-index: -1;
    inset: 0;
    pointer-events: none;
}

.sprt-love-button__bursts i {
    position: absolute;
    bottom: 65%;
    left: 50%;
    color: #7900f3;
    font-size: 1rem;
    font-style: normal;
    animation: sprt-love-float 720ms ease-out forwards;
}

body.sprt-modal-open .sprt-love-dock,
body.sprt-menu-open .sprt-love-dock,
body.sprt-search-open .sprt-love-dock {
    opacity: 0;
    transform: translate(-50%, 1rem);
    pointer-events: none;
}

.sprt-no-js .sprt-love-dock {
    display: none;
}

@keyframes sprt-love-pop {
    50% { transform: scale(0.95); }
}

@keyframes sprt-love-float {
    from { opacity: 1; transform: translate(-50%, 0) scale(0.75) rotate(0); }
    to { opacity: 0; transform: translate(calc(-50% + var(--sprt-love-x)), -3.5rem) scale(1.3) rotate(var(--sprt-love-rotate)); }
}

/* Article catalog, filters, reading time and 4:5 graphic cards. */
body.sprt-page .sprt-main > .sprt-section.sprt-article-catalog,
body.sprt-page .sprt-main > .sprt-section.sprt-blog {
    width: min(calc(100% - 1rem), 96rem);
}

.sprt-article-catalog {
    background: #ffffff;
}

.sprt-article-catalog__intro {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(16rem, 0.7fr);
    align-items: end;
    gap: 2rem;
    margin-bottom: 2rem;
}

.sprt-article-catalog__intro h2 {
    max-width: 16ch;
    margin: 0.75rem 0 0;
    font-size: clamp(2.5rem, 5vw, 5rem);
    line-height: 0.98;
}

.sprt-article-catalog__intro > p {
    padding-left: 1.25rem;
    border-left: 0.3rem solid #7900f3;
    color: #51455c;
    font-size: 1.1rem;
}

.sprt-article-search-form {
    margin-bottom: 1.5rem;
}

.sprt-article-search-form > label {
    display: block;
    margin-bottom: 0.55rem;
    color: #7900f3;
    font-size: 0.85rem;
    text-transform: uppercase;
}

.sprt-article-search-form > div {
    display: flex;
    gap: 0.75rem;
}

.sprt-article-search-form input {
    min-width: 0;
    min-height: 3.75rem;
    flex: 1;
    padding-inline: 1.1rem;
    border: 2px solid #0d001b;
    border-radius: 0.75rem;
    background: #ffffff;
    color: #0d001b;
    font-family: var(--sprt-font);
    font-size: 1rem;
}

.sprt-article-search-form input:focus {
    outline: 0.2rem solid rgba(121, 0, 243, 0.24);
    outline-offset: 0.1rem;
    border-color: #7900f3;
}

.sprt-article-category-groups {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.sprt-article-category-groups details {
    overflow: hidden;
    border: 1px solid rgba(13, 0, 27, 0.14);
    border-radius: 0.85rem;
    background: #f8f6fb;
}

.sprt-article-category-groups summary {
    display: flex;
    min-height: 3.5rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.85rem 1rem;
    color: #0d001b;
    cursor: pointer;
    font-size: 1rem;
    list-style: none;
}

.sprt-article-category-groups summary::-webkit-details-marker {
    display: none;
}

.sprt-article-category-groups summary span {
    display: grid;
    min-width: 2rem;
    min-height: 2rem;
    place-items: center;
    border-radius: 50%;
    background: #7900f3;
    color: #ffffff;
}

.sprt-article-category-list {
    display: flex;
    max-height: 20rem;
    flex-wrap: wrap;
    gap: 0.45rem;
    overflow: auto;
    padding: 0 1rem 1rem;
}

.sprt-article-category-list a {
    padding: 0.48rem 0.68rem;
    border: 1px solid rgba(13, 0, 27, 0.14);
    border-radius: 999px;
    background: #ffffff;
    color: #0d001b;
    font-size: 0.86rem;
    text-decoration: none;
    transition: transform 250ms ease, border-color 250ms ease, background 250ms ease, color 250ms ease;
}

.sprt-article-category-list a:hover,
.sprt-article-category-list a:focus-visible,
.sprt-article-category-list a.is-active {
    transform: translateY(-0.12rem);
    border-color: #7900f3;
    background: #7900f3;
    color: #ffffff;
}

.sprt-article-filter-status {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 1.25rem;
    padding: 0.85rem 1rem;
    border-left: 0.35rem solid #19af2d;
    background: #eefaf0;
    color: #0d001b;
}

.sprt-article-filter-status a {
    margin-left: auto;
    color: #7900f3;
}

.sprt-post-card__media,
.sprt-work-card__media {
    aspect-ratio: 4 / 5;
}

.sprt-work-card__open,
.sprt-post-card__open {
    display: flex;
    height: 100%;
    flex-direction: column;
}

.sprt-work-card__body,
.sprt-post-card__body {
    display: flex;
    flex: 1;
    flex-direction: column;
}

.sprt-work-card__more,
.sprt-post-card__body > .sprt-arrow-link {
    margin-top: auto;
    padding-top: 1rem;
}

.sprt-post-card__meta,
.sprt-post-card__categories {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem;
}

.sprt-post-card__meta {
    justify-content: space-between;
    color: #655b70;
    font-size: 0.85rem;
}

.sprt-post-card__categories {
    margin-top: 0.75rem;
}

.sprt-post-card__categories span {
    padding: 0.34rem 0.55rem;
    border-radius: 999px;
    background: #efe4fb;
    color: #5a00b4;
    font-size: 0.78rem;
}

.sprt-work-card__media::after,
.sprt-post-card__media::after {
    position: absolute;
    z-index: 1;
    inset: 0;
    background: linear-gradient(to top, rgba(13, 0, 27, 0.4), transparent 52%);
    content: "";
    opacity: 0;
    pointer-events: none;
    transition: opacity 450ms ease;
}

.sprt-work-card:hover .sprt-work-card__media::after,
.sprt-work-card:focus-within .sprt-work-card__media::after,
.sprt-post-card:hover .sprt-post-card__media::after,
.sprt-post-card:focus-within .sprt-post-card__media::after {
    opacity: 1;
}

.sprt-work-card:hover h3,
.sprt-work-card:focus-within h3,
.sprt-post-card:hover h3,
.sprt-post-card:focus-within h3 {
    color: #7900f3;
}

.sprt-article__meta {
    flex-wrap: wrap;
}

@media (max-width: 49.999rem) {
    body.sprt-home #szolgaltatasok.sprt-services-showcase .sprt-service-grid {
        grid-template-columns: 1fr;
    }

    body.sprt-home #szolgaltatasok.sprt-services-showcase .sprt-service-grid article,
    body.sprt-home #szolgaltatasok.sprt-services-showcase .sprt-service-grid article:nth-child(n) {
        min-height: 30rem;
        aspect-ratio: auto;
    }
}

@media (min-width: 50rem) {
    body.sprt-home #szolgaltatasok.sprt-services-showcase .sprt-service-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 80rem) {
    body.sprt-home #szolgaltatasok.sprt-services-showcase .sprt-service-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 110rem) {
    .sprt-blog .sprt-post-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 63.999rem) {
    .sprt-instagram-cta__grid {
        grid-template-columns: 1fr;
    }

    .sprt-instagram-cta__copy {
        padding-bottom: 0;
    }

    .sprt-instagram-cta__visual {
        min-height: clamp(24rem, 66vw, 34rem);
    }

    .sprt-instagram-cta__visual img {
        right: 50%;
        width: min(52rem, 100vw);
        max-width: 100%;
        height: auto;
        max-height: 100%;
        transform: translateX(50%);
    }

    .sprt-instagram-cta:hover .sprt-instagram-cta__visual img {
        transform: translateX(50%) scale(1.015);
    }
}

@media (max-width: 47.999rem) {
    .sprt-article-search__panel {
        position: fixed;
        top: max(0.75rem, env(safe-area-inset-top));
        right: 0.75rem;
        left: 0.75rem;
        width: auto;
        max-height: calc(100svh - 1.5rem);
        overflow: auto;
    }

    .sprt-article-search__panel form > button span:last-child {
        display: none;
    }

    .sprt-hero-gallery__controls {
        top: 0.75rem;
        right: 0.75rem;
    }

    .sprt-hero-gallery__count {
        display: none;
    }

    .sprt-hero-gallery__dots button {
        width: 1rem;
    }

    .sprt-hero-gallery__dots button[aria-pressed="true"] {
        width: 1.55rem;
    }

    .sprt-problems .sprt-section-heading {
        display: block;
        margin-bottom: 1rem;
    }

    .sprt-problems .sprt-section-heading > p {
        margin-top: 1.25rem;
    }

    .sprt-problems__hint {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin: 0 0 0.75rem;
        color: #7900f3;
        font-size: 0.85rem;
        text-transform: uppercase;
    }

    .sprt-problems .sprt-problem-grid {
        width: calc(100% + (2 * var(--sprt-gutter)));
        grid-auto-columns: minmax(17rem, 84vw);
        grid-auto-flow: column;
        grid-template-columns: none;
        gap: 0.85rem;
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        margin-inline: calc(-1 * var(--sprt-gutter));
        padding: 0.5rem var(--sprt-gutter) 1.5rem;
        scroll-padding-inline: var(--sprt-gutter);
        scroll-snap-type: inline mandatory;
        scrollbar-width: thin;
    }

    .sprt-problems .sprt-problem-grid article,
    .sprt-problems .sprt-problem-grid article:nth-child(n) {
        min-height: 23rem;
        grid-column: auto;
        scroll-snap-align: start;
    }

    .sprt-instagram-cta h2 {
        font-size: clamp(3rem, 14vw, 4.8rem);
    }

    .sprt-instagram-cta__visual {
        min-height: clamp(18rem, 72vw, 25rem);
    }

    .sprt-instagram-cta__visual img {
        width: min(44rem, 110vw);
        max-width: none;
        height: auto;
    }

    .sprt-article-catalog__intro,
    .sprt-article-category-groups {
        grid-template-columns: 1fr;
    }

    .sprt-article-catalog__intro > p {
        padding: 1rem 0 0;
        border-top: 0.3rem solid #7900f3;
        border-left: 0;
    }

    .sprt-article-search-form > div {
        align-items: stretch;
        flex-direction: column;
    }

    .sprt-article-filter-status {
        align-items: flex-start;
        flex-direction: column;
    }

    .sprt-article-filter-status a {
        margin-left: 0;
    }

    .sprt-post-card__open {
        display: flex;
        grid-template-columns: none;
    }

    .sprt-post-card__media {
        height: auto;
        min-height: 0;
        aspect-ratio: 4 / 5;
    }

    .sprt-post-card h3 {
        display: block;
        overflow: visible;
        -webkit-line-clamp: initial;
    }

    .sprt-post-card p {
        display: block;
    }
}


@media (max-width: 47.999rem) {
    .sprt-love-button__label {
        display: none;
    }

    .sprt-love-button {
        min-height: 2.65rem;
        padding: 0.4rem 0.72rem 0.4rem 0.48rem;
    }
}


@media (prefers-reduced-motion: reduce) {
    .sprt-skeleton-card__media::after,
    .sprt-skeleton-card__line::after,
    .sprt-async-boundary--loading .sprt-async-boundary__icon,
    .sprt-button.is-loading::before,
    .sprt-hero-gallery__image,
    .sprt-love-button,
    .sprt-love-button__bursts i {
        animation: none !important;
    }

    .sprt-hero-story > a,
    .sprt-hero-story__media img,
    .sprt-story-tile__media,
    .sprt-facebook-card,
    .sprt-facebook-card__media::before,
    .sprt-facebook-card__media::after,
    .sprt-facebook-card__media > span,
    .sprt-facebook-card__media > b,
    .sprt-facebook-card__media > strong,
    .sprt-facebook-card__body dd,
    .sprt-facebook-card__link i,
    .sprt-hero-gallery__slide,
    .sprt-hero-gallery__dots button,
    .sprt-hero-gallery__toggle,
    .sprt-reading-progress > span,
    .sprt-problems .sprt-problem-grid article,
    .sprt-problems .sprt-problem-grid article::before,
    .sprt-problems .sprt-problem-grid article > span,
    body.sprt-home .sprt-services-showcase .sprt-service-grid article,
    body.sprt-home .sprt-services-showcase .sprt-service-grid article::before,
    body.sprt-home .sprt-services-showcase .sprt-service-grid article::after,
    .sprt-instagram-cta__visual img,
    .sprt-article-category-list a,
    .sprt-work-card__media::after,
    .sprt-post-card__media::after {
        transition: none !important;
    }

    .sprt-hero-gallery__image {
        transform: none !important;
    }
}

@media (forced-colors: active) {
    .sprt-capacity__dismiss,
    .sprt-async-boundary,
    .sprt-skeleton-card,
    .sprt-post-card,
    .sprt-reading-progress {
        forced-color-adjust: auto;
    }
}

/* Light editorial treatment: the live rail may be dark, the reading surface is not. */
.sprt-news-archive {
    background:
        linear-gradient(118deg, rgba(121, 0, 243, 0.055), transparent 32%),
        #f4f2f6;
    color: #0d001b;
}

.sprt-news-toolbar {
    border-bottom-color: rgba(13, 0, 27, 0.16);
    background: #ffffff;
}

.sprt-news-toolbar h1,
.sprt-news-lead h2,
.sprt-news-side-card h3,
.sprt-news-column-card h3,
.sprt-news-index h3,
.sprt-news-section-heading h2,
.sprt-news-index__intro h2 {
    color: #0d001b;
}

.sprt-news-toolbar__top > div > span,
.sprt-news-section-heading > span,
.sprt-news-section-heading > div > span,
.sprt-news-index__intro > span,
.sprt-news-card__category {
    color: #087719;
}

.sprt-news-search input {
    border-color: rgba(13, 0, 27, 0.34);
    background: #f8f6fa;
    color: #0d001b;
}

.sprt-news-search input::placeholder {
    color: #665d70;
}

.sprt-news-categories a {
    border-color: rgba(13, 0, 27, 0.19);
    background: #ffffff;
    color: #0d001b;
}

.sprt-news-categories a:last-child {
    border-right-color: rgba(13, 0, 27, 0.19);
}

.sprt-news-categories a:hover,
.sprt-news-categories a:focus-visible,
.sprt-news-categories a[aria-current="page"] {
    border-color: #7900f3;
    background: #7900f3;
    color: #ffffff;
}

.sprt-news-filter-status {
    border-left-color: #19af2d;
    background: #ffffff;
    color: #0d001b;
    box-shadow: 0 0.85rem 2.5rem rgba(38, 15, 61, 0.07);
}

.sprt-news-filter-status a {
    color: #6500ca;
}

.sprt-news-lead__primary,
.sprt-news-side-card,
.sprt-news-column-card {
    border: 1px solid rgba(13, 0, 27, 0.15);
    background: #ffffff;
    box-shadow: 0 1.2rem 3.25rem rgba(30, 9, 52, 0.065);
}

.sprt-news-lead__primary {
    padding: clamp(0.85rem, 1.6vw, 1.25rem) clamp(0.85rem, 1.6vw, 1.25rem) clamp(1.5rem, 3vw, 2.5rem);
}

.sprt-news-side-card {
    padding: clamp(0.8rem, 1.3vw, 1rem) clamp(0.8rem, 1.3vw, 1rem) 1.4rem;
}

.sprt-news-column-card {
    padding: clamp(0.85rem, 1.8vw, 1.25rem) clamp(0.85rem, 1.8vw, 1.25rem) clamp(1.4rem, 2vw, 1.8rem);
}

.sprt-news-lead__copy > p,
.sprt-news-column-card p {
    color: #574d61;
}

.sprt-news-card__meta {
    color: #655b70;
}

.sprt-news-card__meta > * + *::before {
    background: #19af2d;
}

.sprt-news-section-heading,
.sprt-news-index,
.sprt-news-index ol,
.sprt-news-index li {
    border-color: rgba(13, 0, 27, 0.23);
}

.sprt-news-section-heading--inline > a,
.sprt-news-empty a {
    color: #6500ca;
}

.sprt-news-overlay-card .sprt-news-card__category {
    color: #83ed91;
}

.sprt-news-overlay-card h3 {
    color: #ffffff;
}

.sprt-news-overlay-card .sprt-news-card__meta,
.sprt-news-overlay-card p {
    color: rgba(255, 255, 255, 0.84);
}

.sprt-news-index ol {
    background: #ffffff;
}

.sprt-news-index li > a {
    padding-inline: clamp(0.85rem, 2vw, 1.35rem);
}

.sprt-news-index li > a:hover,
.sprt-news-index li > a:focus-visible {
    background: #f1e7fc;
}

.sprt-news-index li > a > i {
    color: #6500ca;
}

.sprt-news-pagination a,
.sprt-news-pagination span {
    border-color: rgba(13, 0, 27, 0.28) !important;
    background: #ffffff !important;
    color: #0d001b !important;
}

.sprt-news-pagination .current,
.sprt-news-pagination a:hover,
.sprt-news-pagination a:focus-visible {
    background: #7900f3 !important;
    color: #ffffff !important;
}

.sprt-news-empty {
    border-color: rgba(13, 0, 27, 0.16);
    background: linear-gradient(125deg, #ffffff 28%, #eee1fb 100%);
    box-shadow: 0 1.2rem 3.25rem rgba(30, 9, 52, 0.07);
}

.sprt-news-empty > span,
.sprt-news-empty h2 {
    color: #0d001b;
}

.sprt-news-empty p {
    color: #574d61;
}

/* Playhigh needs air: no negative tracking and no compressed display lines. */
.sprt-news-toolbar h1 {
    letter-spacing: 0.02em;
    line-height: 1.06;
}

.sprt-news-lead h2,
.sprt-news-section-heading h2,
.sprt-news-index__intro h2 {
    letter-spacing: 0.015em;
    line-height: 1.09;
}

.sprt-news-side-card h3,
.sprt-news-column-card h3,
.sprt-news-overlay-card h3,
.sprt-news-index h3 {
    letter-spacing: 0.015em;
    line-height: 1.14;
}

@media print {
    body.sprt-page {
        background: #ffffff !important;
        color: #222222 !important;
        font-size: 10pt;
        line-height: 1.45;
    }

    .sprt-async-boundary,
    .sprt-skeleton-card,
    .sprt-capacity__dismiss,
    .sprt-article-search,
    .sprt-reading-progress,
    .sprt-hero-gallery__controls,
    .sprt-instagram-cta__badge {
        display: none !important;
    }

    .sprt-love-dock {
        display: none !important;
    }

    .sprt-adsense {
        display: none !important;
    }

    body.sprt-home .sprt-main,
    body.sprt-home .sprt-main > .sprt-section {
        background: #ffffff !important;
    }

    .sprt-work-card,
    .sprt-hero-story,
    .sprt-post-card,
    .sprt-form,
    .sprt-empty-state {
        break-inside: avoid;
        border: 1px solid #cccccc !important;
        background: #ffffff !important;
        color: #222222 !important;
    }

    .sprt-hero--editorial {
        min-height: 0 !important;
        background: #ffffff !important;
        color: #222222 !important;
    }
}

/* News archive: an SPRT editorial front page, intentionally separate from articles. */
.sprt-news-archive {
    overflow: hidden;
    padding-bottom: clamp(4rem, 9vw, 8rem);
    background:
        linear-gradient(118deg, rgba(121, 0, 243, 0.09), transparent 35%),
        #0b0610;
    color: #ffffff;
    font-family: var(--sprt-font);
}

.sprt-news-archive > .sprt-container,
.sprt-news-toolbar > .sprt-container {
    width: min(calc(100% - (2 * var(--sprt-gutter))), 98rem);
    max-width: none;
}

.sprt-news-standings {
    display: flex;
    min-width: 0;
    min-height: 6.75rem;
    align-items: stretch;
    overflow: hidden;
    border-bottom: 1px solid rgba(255, 255, 255, 0.19);
    background:
        linear-gradient(105deg, rgba(13, 0, 27, 0.08), rgba(13, 0, 27, 0.48)),
        linear-gradient(100deg, #7900f3 0%, #5f00c0 65%, #19af2d 135%);
    color: #ffffff;
}

.sprt-news-standings__label {
    display: flex;
    min-width: 14.5rem;
    flex: 0 0 14.5rem;
    flex-direction: column;
    justify-content: center;
    padding: 1rem clamp(1rem, 2.5vw, 2rem);
    border-right: 1px solid rgba(255, 255, 255, 0.22);
    background: rgba(13, 0, 27, 0.22);
}

.sprt-news-standings__label span,
.sprt-news-section-heading > span,
.sprt-news-section-heading > div > span,
.sprt-news-index__intro > span,
.sprt-news-toolbar__top > div > span {
    color: #72ec81;
    font-family: var(--sprt-font);
    font-size: clamp(0.9rem, 1vw, 1rem);
    letter-spacing: 0.07em;
    line-height: 1.35;
    text-transform: uppercase;
}

.sprt-news-standings__label strong {
    margin-top: 0.18rem;
    font-family: var(--sprt-expanded);
    font-size: clamp(1.2rem, 1.5vw, 1.55rem);
    font-weight: 400;
    letter-spacing: 0.015em;
    line-height: 1.18;
    text-transform: uppercase;
}

.sprt-news-standings__label small {
    margin-top: 0.24rem;
    color: rgba(255, 255, 255, 0.78);
    font-size: 1rem;
    line-height: 1.35;
}

.sprt-news-standings__rail {
    display: flex;
    min-width: 0;
    flex: 1;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    margin: 0;
    padding: 0;
    scroll-snap-type: inline proximity;
    scrollbar-color: rgba(255, 255, 255, 0.48) transparent;
    scrollbar-width: thin;
}

.sprt-news-standings__rail li {
    display: grid;
    min-width: min(17rem, 76vw);
    flex: 1 0 17rem;
    grid-template-columns: auto minmax(7.5rem, 1fr) auto auto;
    align-items: center;
    gap: 0.72rem;
    padding: 1rem 1.15rem;
    border-right: 1px solid rgba(255, 255, 255, 0.18);
    scroll-snap-align: start;
}

.sprt-news-standings__rail li > b {
    color: #72ec81;
    font-family: var(--sprt-expanded);
    font-size: 1.18rem;
    font-weight: 400;
}

.sprt-news-standings__rail li > strong {
    min-width: 0;
    overflow: hidden;
    font-size: clamp(1rem, 1.2vw, 1.14rem);
    font-weight: 400;
    line-height: 1.22;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sprt-news-standings__rail li > span {
    display: grid;
    min-width: 2.3rem;
    gap: 0.1rem;
    font-family: var(--sprt-expanded);
    font-size: 1rem;
    font-variant-numeric: tabular-nums;
    text-align: center;
}

.sprt-news-standings__rail li > span small {
    color: rgba(255, 255, 255, 0.68);
    font-family: var(--sprt-font);
    font-size: 0.76rem;
    line-height: 1;
}

.sprt-news-standings__update,
.sprt-news-standings__fallback {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    padding: 1rem clamp(1rem, 2.5vw, 1.65rem);
    background: rgba(13, 0, 27, 0.35);
    font-size: clamp(0.88rem, 1vw, 1rem);
    line-height: 1.35;
}

.sprt-news-standings__update {
    min-width: 10rem;
    justify-content: center;
    text-align: center;
}

.sprt-news-standings__update > span,
.sprt-news-standings__fallback > span {
    width: 0.65rem;
    height: 0.65rem;
    flex: 0 0 auto;
    border: 2px solid #ffffff;
    background: #19af2d;
}

.sprt-news-standings__fallback {
    min-width: 0;
    flex: 1;
    justify-content: center;
}

.sprt-news-standings__fallback strong,
.sprt-news-standings__fallback small {
    font-size: inherit;
    font-weight: 400;
}

.sprt-news-standings__fallback small {
    color: rgba(255, 255, 255, 0.76);
}

.sprt-news-toolbar {
    padding: clamp(2rem, 4vw, 3.5rem) 0 clamp(1.5rem, 3vw, 2.5rem);
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    background: #0b0610;
}

.sprt-news-toolbar__top {
    display: grid;
    align-items: end;
    gap: 1.5rem;
}

.sprt-news-toolbar h1 {
    margin: 0.2rem 0 0;
    color: #ffffff;
    font-family: var(--sprt-expanded);
    font-size: clamp(3rem, 7vw, 6rem);
    font-weight: 400;
    letter-spacing: 0.015em;
    line-height: 1.03;
    text-transform: uppercase;
}

.sprt-news-search {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.55rem;
}

.sprt-news-search input {
    width: 100%;
    min-width: 0;
    min-height: 3.5rem;
    padding: 0.85rem 1rem;
    border: 1px solid rgba(255, 255, 255, 0.32);
    border-radius: 0;
    background: rgba(255, 255, 255, 0.075);
    color: #ffffff;
    font-family: var(--sprt-font);
    font-size: clamp(1rem, 1.2vw, 1.12rem);
    line-height: 1.35;
}

.sprt-news-search input::placeholder {
    color: rgba(255, 255, 255, 0.62);
}

.sprt-news-search input:focus {
    outline: 3px solid rgba(121, 0, 243, 0.5);
    outline-offset: 2px;
    border-color: #b875ff;
}

.sprt-news-search button {
    display: inline-flex;
    min-height: 3.5rem;
    align-items: center;
    justify-content: center;
    gap: 0.7rem;
    padding: 0.75rem 1.15rem;
    border: 0;
    border-radius: 0;
    background: #19af2d;
    color: #0d001b;
    cursor: pointer;
    font-family: var(--sprt-font);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.2;
    transition: background 220ms ease, color 220ms ease, transform 220ms ease;
}

.sprt-news-search button:hover,
.sprt-news-search button:focus-visible {
    transform: translateY(-2px);
    background: #7900f3;
    color: #ffffff;
}

.sprt-news-categories {
    display: flex;
    gap: 0;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    margin-top: 1.5rem;
    padding-bottom: 0.4rem;
    scrollbar-width: thin;
}

.sprt-news-categories a {
    display: inline-flex;
    min-height: 3rem;
    flex: 0 0 auto;
    align-items: center;
    padding: 0.65rem 1rem;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-right: 0;
    color: #ffffff;
    font-size: clamp(0.9rem, 1vw, 1rem);
    line-height: 1.3;
    text-decoration: none;
    transition: background 220ms ease, color 220ms ease;
}

.sprt-news-categories a:last-child {
    border-right: 1px solid rgba(255, 255, 255, 0.22);
}

.sprt-news-categories a:hover,
.sprt-news-categories a:focus-visible,
.sprt-news-categories a[aria-current="page"] {
    background: #7900f3;
    color: #ffffff;
}

.sprt-news-filter-status {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 1rem;
    padding: 0.9rem 1rem;
    border-left: 0.3rem solid #19af2d;
    background: rgba(255, 255, 255, 0.09);
    color: #ffffff;
    font-size: 1rem;
}

.sprt-news-filter-status a {
    margin-left: auto;
    color: #83ed91;
}

.sprt-news-lead,
.sprt-news-columns,
.sprt-news-overlay,
.sprt-news-index {
    margin-top: clamp(2.5rem, 6vw, 6rem);
}

.sprt-news-lead {
    display: grid;
    gap: clamp(1.5rem, 3vw, 2.5rem);
}

.sprt-news-lead article,
.sprt-news-columns article,
.sprt-news-overlay article {
    min-width: 0;
}

.sprt-news-lead a,
.sprt-news-columns a,
.sprt-news-overlay a,
.sprt-news-index a {
    color: inherit;
    text-decoration: none;
}

.sprt-news-card__media {
    position: relative;
    display: block;
    overflow: hidden;
    margin: 0;
    background: #1b062f;
}

.sprt-news-card__media > img,
.sprt-news-media__placeholder {
    display: block;
    width: 100%;
    height: 100%;
}

.sprt-news-card__media > img {
    object-fit: cover;
    transition: transform 650ms var(--sprt-ease), filter 400ms ease;
}

.sprt-news-lead article:hover .sprt-news-card__media > img,
.sprt-news-lead article:focus-within .sprt-news-card__media > img,
.sprt-news-columns article:hover .sprt-news-card__media > img,
.sprt-news-columns article:focus-within .sprt-news-card__media > img,
.sprt-news-overlay article:hover .sprt-news-card__media > img,
.sprt-news-overlay article:focus-within .sprt-news-card__media > img {
    transform: scale(1.035);
    filter: saturate(1.08);
}

.sprt-news-media__placeholder {
    position: relative;
    min-height: 15rem;
    padding: 1.25rem;
    background:
        var(--sprt-noise),
        linear-gradient(132deg, #19002f 0%, #7900f3 58%, #19af2d 140%);
    background-blend-mode: soft-light, normal;
    color: #ffffff;
}

.sprt-news-media__placeholder::after {
    position: absolute;
    right: -8%;
    bottom: -15%;
    width: 54%;
    height: 65%;
    border: 1px solid rgba(255, 255, 255, 0.2);
    transform: skewX(-15deg);
    content: "";
}

.sprt-news-media__placeholder small {
    position: absolute;
    top: 1.25rem;
    left: 1.25rem;
    font-size: clamp(0.86rem, 1vw, 0.98rem);
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.sprt-news-media__placeholder b {
    position: absolute;
    right: 1rem;
    bottom: -0.08em;
    color: rgba(255, 255, 255, 0.2);
    font-family: var(--sprt-expanded);
    font-size: clamp(4.5rem, 13vw, 11rem);
    font-weight: 400;
    letter-spacing: 0;
    line-height: 0.72;
}

.sprt-news-media__placeholder i {
    position: absolute;
    bottom: 1.25rem;
    left: 1.25rem;
    color: #ffffff;
    font-family: var(--sprt-font);
    font-size: 1rem;
    font-style: normal;
    text-transform: uppercase;
}

.sprt-news-card__demo {
    position: absolute;
    z-index: 2;
    top: 1rem;
    left: 1rem;
    padding: 0.45rem 0.62rem;
    border: 1px solid rgba(255, 255, 255, 0.55);
    background: #0d001b;
    color: #ffffff;
    font-size: 0.82rem;
    letter-spacing: 0.06em;
    line-height: 1;
    text-transform: uppercase;
}

.sprt-news-card__demo--inline {
    position: static;
    display: inline-flex;
    width: max-content;
    margin-bottom: 0.7rem;
}

.sprt-news-card__category {
    display: block;
    color: #72ec81;
    font-size: clamp(0.95rem, 1vw, 1.02rem);
    letter-spacing: 0.075em;
    line-height: 1.35;
    text-transform: uppercase;
}

.sprt-news-card__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.8rem;
    margin-top: 1rem;
    color: rgba(255, 255, 255, 0.73);
    font-size: clamp(1rem, 1.05vw, 1.08rem);
    line-height: 1.45;
}

.sprt-news-card__meta > * + *::before {
    display: inline-block;
    width: 0.35rem;
    height: 0.35rem;
    margin: 0 0.7rem 0.1rem 0;
    background: #19af2d;
    content: "";
}

.sprt-news-lead__primary {
    padding-bottom: clamp(1.5rem, 3vw, 2.5rem);
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.sprt-news-lead__primary .sprt-news-card__media {
    aspect-ratio: 16 / 9;
}

.sprt-news-lead__copy {
    padding-top: clamp(1.25rem, 3vw, 2rem);
}

.sprt-news-lead h2 {
    max-width: 28ch;
    margin: 0.55rem 0 0;
    color: #ffffff;
    font-family: var(--sprt-display);
    font-size: clamp(2.8rem, 4.9vw, 5.4rem);
    font-weight: 400;
    letter-spacing: 0.01em;
    line-height: 1.055;
    text-transform: none;
}

.sprt-news-lead__copy > p {
    max-width: 60ch;
    margin: 1rem 0 0;
    color: rgba(255, 255, 255, 0.76);
    font-size: clamp(1.05rem, 1.4vw, 1.24rem);
    line-height: 1.55;
}

.sprt-news-lead__side {
    display: grid;
    gap: clamp(1.5rem, 3vw, 2.25rem);
}

.sprt-news-side-card {
    padding-bottom: 1.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.sprt-news-side-card .sprt-news-card__media {
    aspect-ratio: 16 / 9;
    margin-bottom: 1.15rem;
}

.sprt-news-side-card h3,
.sprt-news-column-card h3,
.sprt-news-overlay-card h3,
.sprt-news-index h3 {
    margin: 0.48rem 0 0;
    color: #ffffff;
    font-family: var(--sprt-display);
    font-weight: 400;
    letter-spacing: 0.012em;
    text-transform: none;
}

.sprt-news-side-card h3 {
    max-width: 28ch;
    font-size: clamp(2rem, 2.65vw, 2.8rem);
    line-height: 1.11;
}

.sprt-news-ad-slot {
    margin-top: clamp(2rem, 5vw, 4rem);
}

.sprt-news-ad-slot:empty {
    display: none;
}

.sprt-news-section-heading {
    margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
    padding-bottom: 1rem;
    border-bottom: 2px solid rgba(255, 255, 255, 0.84);
}

.sprt-news-section-heading h2,
.sprt-news-index__intro h2 {
    max-width: 17ch;
    margin: 0.28rem 0 0;
    color: #ffffff;
    font-family: var(--sprt-expanded);
    font-size: clamp(2.6rem, 4.6vw, 4.75rem);
    font-weight: 400;
    letter-spacing: 0.01em;
    line-height: 1.06;
    text-transform: none;
}

.sprt-news-section-heading--inline {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1.5rem;
}

.sprt-news-section-heading--inline > a {
    flex: 0 0 auto;
    padding-bottom: 0.45rem;
    color: #83ed91;
    font-size: 1rem;
}

.sprt-news-columns__grid {
    display: grid;
    gap: clamp(2rem, 5vw, 4.5rem) clamp(1.5rem, 3vw, 2.5rem);
}

.sprt-news-column-card .sprt-news-card__media {
    aspect-ratio: 16 / 10;
    margin-bottom: 1.25rem;
}

.sprt-news-column-card h3 {
    max-width: 28ch;
    font-size: clamp(2.1rem, 3.1vw, 3.15rem);
    line-height: 1.1;
}

.sprt-news-column-card p,
.sprt-news-overlay-card p {
    margin: 0.9rem 0 0;
    color: rgba(255, 255, 255, 0.7);
    font-size: clamp(1rem, 1.2vw, 1.14rem);
    line-height: 1.55;
}

.sprt-news-overlay__grid {
    display: grid;
    gap: 1px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.22);
    background: rgba(255, 255, 255, 0.22);
}

.sprt-news-overlay-card {
    position: relative;
    min-height: clamp(30rem, 58vw, 38rem);
    overflow: hidden;
    background: #19002f;
}

.sprt-news-overlay-card > a,
.sprt-news-overlay-card .sprt-news-card__media {
    position: absolute;
    inset: 0;
}

.sprt-news-overlay-card .sprt-news-card__media {
    margin: 0;
}

.sprt-news-overlay-card .sprt-news-card__media::after {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(7, 2, 11, 0.98) 7%, rgba(7, 2, 11, 0.68) 52%, rgba(7, 2, 11, 0.05) 84%);
    content: "";
}

.sprt-news-overlay-card > a > div {
    position: absolute;
    z-index: 2;
    right: 0;
    bottom: 0;
    left: 0;
    padding: clamp(1.25rem, 4vw, 2rem);
}

.sprt-news-overlay-card h3 {
    max-width: 24ch;
    font-size: clamp(2.05rem, 3vw, 3rem);
    line-height: 1.09;
}

.sprt-news-index {
    display: grid;
    gap: clamp(2rem, 5vw, 5rem);
    padding-top: clamp(2.5rem, 5vw, 4rem);
    border-top: 1px solid rgba(255, 255, 255, 0.2);
}

.sprt-news-index__intro h2 {
    max-width: 10ch;
}

.sprt-news-index ol {
    margin: 0;
    padding: 0;
    border-top: 2px solid rgba(255, 255, 255, 0.75);
    list-style: none;
}

.sprt-news-index li {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.sprt-news-index li > a {
    display: grid;
    min-height: 8.5rem;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: clamp(1rem, 2vw, 1.75rem);
    padding: 1.35rem 0;
    transition: background 220ms ease, padding 220ms ease;
}

.sprt-news-index li > a:hover,
.sprt-news-index li > a:focus-visible {
    padding-inline: 1rem;
    background: rgba(121, 0, 243, 0.15);
}

.sprt-news-index li > a > b {
    color: #19af2d;
    font-family: var(--sprt-expanded);
    font-size: clamp(1.45rem, 2.5vw, 2.2rem);
    font-weight: 400;
}

.sprt-news-index h3 {
    max-width: 26ch;
    font-size: clamp(1.85rem, 2.65vw, 2.65rem);
    line-height: 1.11;
}

.sprt-news-index li > a > i {
    color: #83ed91;
    font-size: 1.5rem;
    font-style: normal;
}

.sprt-news-pagination {
    margin-top: clamp(3rem, 7vw, 6rem);
}

.sprt-news-pagination a,
.sprt-news-pagination span {
    border-color: rgba(255, 255, 255, 0.3) !important;
    background: transparent !important;
    color: #ffffff !important;
}

.sprt-news-pagination .current,
.sprt-news-pagination a:hover,
.sprt-news-pagination a:focus-visible {
    background: #7900f3 !important;
}

.sprt-news-empty {
    margin-top: clamp(3rem, 8vw, 7rem);
    padding: clamp(2rem, 5vw, 4rem);
    border: 1px solid rgba(255, 255, 255, 0.24);
    background: linear-gradient(125deg, rgba(121, 0, 243, 0.3), rgba(25, 175, 45, 0.12));
}

.sprt-news-empty > span {
    color: #83ed91;
    font-size: 0.95rem;
}

.sprt-news-empty h2 {
    margin: 0.5rem 0 0;
    color: #ffffff;
    font-size: clamp(2.5rem, 6vw, 5rem);
    line-height: 1;
}

.sprt-news-empty p {
    color: rgba(255, 255, 255, 0.76);
    font-size: 1.08rem;
}

.sprt-news-empty a {
    color: #83ed91;
    font-size: 1.05rem;
}

.sprt-news-archive :is(h1, h2, h3) {
    overflow-wrap: break-word;
    hyphens: none;
    word-break: normal;
}

@media (min-width: 48rem) {
    .sprt-news-toolbar__top {
        grid-template-columns: minmax(0, 0.85fr) minmax(24rem, 1.15fr);
    }

    .sprt-news-lead__side {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .sprt-news-columns__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .sprt-news-index {
        grid-template-columns: minmax(15rem, 0.7fr) minmax(0, 1.3fr);
    }
}

@media (min-width: 64rem) {
    .sprt-news-lead {
        grid-template-columns: minmax(0, 2fr) minmax(20rem, 0.92fr);
    }

    .sprt-news-lead__side {
        grid-template-columns: 1fr;
        align-content: start;
    }

    .sprt-news-overlay__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .sprt-news-overlay-card {
        min-height: clamp(33rem, 42vw, 42rem);
    }
}

@media (max-width: 74.999rem) {
    .sprt-news-standings__update {
        display: none;
    }
}

@media (max-width: 63.999rem) {
    .sprt-news-standings {
        flex-wrap: wrap;
    }

    .sprt-news-standings__label {
        width: 100%;
        min-width: 0;
        flex: 1 0 100%;
        padding-block: 0.85rem;
        border-right: 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    }

    .sprt-news-standings__fallback {
        min-height: 4.6rem;
    }
}

@media (max-width: 47.999rem) {
    .sprt-news-archive {
        letter-spacing: 0.01em;
    }

    .sprt-news-standings__label {
        display: grid;
        grid-template-columns: 1fr auto;
        align-items: center;
        gap: 0.2rem 0.75rem;
    }

    .sprt-news-standings__label span {
        grid-column: 1 / -1;
    }

    .sprt-news-standings__label strong {
        font-size: 1.3rem;
    }

    .sprt-news-standings__label small {
        margin: 0;
        font-size: 0.88rem;
    }

    .sprt-news-standings__rail li {
        min-width: min(18rem, 88vw);
        flex-basis: min(18rem, 88vw);
        gap: 0.6rem;
        padding: 0.9rem 1rem;
    }

    .sprt-news-standings__fallback {
        min-height: 5.5rem;
        flex-wrap: wrap;
        justify-content: flex-start;
        padding: 1rem var(--sprt-gutter);
    }

    .sprt-news-standings__fallback strong {
        flex: 1 1 13rem;
    }

    .sprt-news-standings__fallback small {
        width: 100%;
        padding-left: 1.35rem;
        line-height: 1.45;
    }

    .sprt-news-toolbar {
        padding-top: 1.75rem;
    }

    .sprt-news-toolbar h1 {
        font-size: clamp(3.1rem, 17vw, 4.8rem);
        letter-spacing: 0.015em;
        line-height: 1.04;
    }

    .sprt-news-search {
        grid-template-columns: 1fr;
    }

    .sprt-news-search input,
    .sprt-news-search button {
        min-height: 3.25rem;
        font-size: 1rem;
    }

    .sprt-news-categories {
        width: calc(100% + (2 * var(--sprt-gutter)));
        margin-inline: calc(-1 * var(--sprt-gutter));
        padding-inline: var(--sprt-gutter);
        scroll-padding-inline: var(--sprt-gutter);
    }

    .sprt-news-filter-status {
        align-items: flex-start;
        flex-direction: column;
        line-height: 1.45;
    }

    .sprt-news-filter-status a {
        margin-left: 0;
    }

    .sprt-news-lead h2 {
        max-width: 100%;
        font-size: clamp(2.5rem, 11vw, 3.8rem);
        letter-spacing: 0.01em;
        line-height: 1.075;
    }

    .sprt-news-lead__copy > p,
    .sprt-news-column-card p,
    .sprt-news-overlay-card p {
        font-size: 1.05rem;
        line-height: 1.6;
    }

    .sprt-news-card__meta {
        font-size: 1rem;
        line-height: 1.55;
    }

    .sprt-news-side-card h3,
    .sprt-news-column-card h3,
    .sprt-news-overlay-card h3,
    .sprt-news-index h3 {
        letter-spacing: 0.012em;
        line-height: 1.12;
    }

    .sprt-news-section-heading--inline {
        align-items: flex-start;
        flex-direction: column;
    }

    .sprt-news-overlay-card {
        min-height: 32rem;
    }

    .sprt-news-index li > a {
        min-height: 7.5rem;
        grid-template-columns: auto minmax(0, 1fr);
        align-items: start;
    }

    .sprt-news-index li > a > i {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .sprt-news-card__media > img,
    .sprt-news-search button,
    .sprt-news-index li > a {
        transition: none !important;
    }
}

@media (forced-colors: active) {
    .sprt-news-standings,
    .sprt-news-search input,
    .sprt-news-categories a,
    .sprt-news-lead article,
    .sprt-news-columns article,
    .sprt-news-overlay article,
    .sprt-news-index li {
        forced-color-adjust: auto;
    }
}

@media print {
    .sprt-news-archive {
        overflow: visible;
        background: #ffffff !important;
        color: #222222 !important;
    }

    .sprt-news-standings,
    .sprt-news-search,
    .sprt-news-categories,
    .sprt-news-ad-slot {
        display: none !important;
    }

    .sprt-news-archive :is(h1, h2, h3, p, a, span, time) {
        color: #222222 !important;
    }

    .sprt-news-overlay-card {
        min-height: 0;
    }

    .sprt-news-overlay-card > a,
    .sprt-news-overlay-card .sprt-news-card__media,
    .sprt-news-overlay-card > a > div {
        position: static;
    }
}

/* Final news palette owner: keep the magazine reading surface predominantly light. */
.sprt-news-archive {
    background: linear-gradient(118deg, rgba(121, 0, 243, 0.055), transparent 32%), #f4f2f6;
    color: #0d001b;
}

.sprt-news-toolbar {
    border-bottom-color: rgba(13, 0, 27, 0.16);
    background: #ffffff;
}

.sprt-news-toolbar h1,
.sprt-news-lead h2,
.sprt-news-side-card h3,
.sprt-news-column-card h3,
.sprt-news-index h3,
.sprt-news-section-heading h2,
.sprt-news-index__intro h2 {
    color: #0d001b;
}

.sprt-news-toolbar__top > div > span,
.sprt-news-section-heading > span,
.sprt-news-section-heading > div > span,
.sprt-news-index__intro > span,
.sprt-news-card__category {
    color: #087719;
}

.sprt-news-search input {
    border-color: rgba(13, 0, 27, 0.34);
    background: #f8f6fa;
    color: #0d001b;
}

.sprt-news-search input::placeholder {
    color: #665d70;
}

.sprt-news-categories a {
    border-color: rgba(13, 0, 27, 0.19);
    background: #ffffff;
    color: #0d001b;
}

.sprt-news-categories a:last-child {
    border-right-color: rgba(13, 0, 27, 0.19);
}

.sprt-news-categories a:hover,
.sprt-news-categories a:focus-visible,
.sprt-news-categories a[aria-current="page"] {
    border-color: #7900f3;
    background: #7900f3;
    color: #ffffff;
}

.sprt-news-filter-status {
    border-left-color: #19af2d;
    background: #ffffff;
    color: #0d001b;
    box-shadow: 0 0.85rem 2.5rem rgba(38, 15, 61, 0.07);
}

.sprt-news-filter-status a {
    color: #6500ca;
}

.sprt-news-lead__primary,
.sprt-news-side-card,
.sprt-news-column-card {
    border: 1px solid rgba(13, 0, 27, 0.15);
    background: #ffffff;
    box-shadow: 0 1.2rem 3.25rem rgba(30, 9, 52, 0.065);
}

.sprt-news-lead__primary {
    padding: clamp(0.85rem, 1.6vw, 1.25rem) clamp(0.85rem, 1.6vw, 1.25rem) clamp(1.5rem, 3vw, 2.5rem);
}

.sprt-news-side-card {
    padding: clamp(0.8rem, 1.3vw, 1rem) clamp(0.8rem, 1.3vw, 1rem) 1.4rem;
}

.sprt-news-column-card {
    padding: clamp(0.85rem, 1.8vw, 1.25rem) clamp(0.85rem, 1.8vw, 1.25rem) clamp(1.4rem, 2vw, 1.8rem);
}

.sprt-news-lead__copy > p,
.sprt-news-column-card p {
    color: #574d61;
}

.sprt-news-card__meta {
    color: #655b70;
}

.sprt-news-section-heading,
.sprt-news-index,
.sprt-news-index ol,
.sprt-news-index li {
    border-color: rgba(13, 0, 27, 0.23);
}

.sprt-news-section-heading--inline > a,
.sprt-news-empty a {
    color: #6500ca;
}

.sprt-news-overlay-card .sprt-news-card__category {
    color: #83ed91;
}

.sprt-news-overlay-card h3 {
    color: #ffffff;
}

.sprt-news-overlay-card .sprt-news-card__meta,
.sprt-news-overlay-card p {
    color: rgba(255, 255, 255, 0.84);
}

.sprt-news-index ol {
    background: #ffffff;
}

.sprt-news-index li > a {
    padding-inline: clamp(0.85rem, 2vw, 1.35rem);
}

.sprt-news-index li > a:hover,
.sprt-news-index li > a:focus-visible {
    background: #f1e7fc;
}

.sprt-news-index li > a > i {
    color: #6500ca;
}

.sprt-news-pagination a,
.sprt-news-pagination span {
    border-color: rgba(13, 0, 27, 0.28) !important;
    background: #ffffff !important;
    color: #0d001b !important;
}

.sprt-news-pagination .current,
.sprt-news-pagination a:hover,
.sprt-news-pagination a:focus-visible {
    background: #7900f3 !important;
    color: #ffffff !important;
}

.sprt-news-empty {
    border-color: rgba(13, 0, 27, 0.16);
    background: linear-gradient(125deg, #ffffff 28%, #eee1fb 100%);
    box-shadow: 0 1.2rem 3.25rem rgba(30, 9, 52, 0.07);
}

.sprt-news-empty > span,
.sprt-news-empty h2 {
    color: #0d001b;
}

.sprt-news-empty p {
    color: #574d61;
}

.sprt-news-toolbar h1 {
    letter-spacing: 0.02em;
    line-height: 1.06;
}

.sprt-news-lead h2,
.sprt-news-section-heading h2,
.sprt-news-index__intro h2 {
    letter-spacing: 0.015em;
    line-height: 1.09;
}

.sprt-news-side-card h3,
.sprt-news-column-card h3,
.sprt-news-overlay-card h3,
.sprt-news-index h3 {
    letter-spacing: 0.015em;
    line-height: 1.14;
}

@media print {
    .sprt-news-archive {
        background: #ffffff !important;
        color: #222222 !important;
    }
}

/* Live score inserts: editorial interruptions, never empty placeholders. */
.sprt-news-live-slot {
    margin-top: clamp(2.25rem, 5vw, 4.75rem);
}

.sprt-news-live-match {
    position: relative;
    overflow: hidden;
    padding: clamp(1.25rem, 3vw, 2.35rem);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-left: 0.42rem solid #19af2d;
    background:
        var(--sprt-noise),
        linear-gradient(118deg, #120020 0%, #31005f 58%, #7900f3 132%);
    background-blend-mode: soft-light, normal;
    box-shadow: 0 1.25rem 3.5rem rgba(31, 7, 55, 0.16);
    color: #ffffff;
    font-family: var(--sprt-font);
}

.sprt-news-live-match::after {
    position: absolute;
    z-index: 0;
    top: -45%;
    right: 12%;
    width: 1px;
    height: 190%;
    transform: rotate(27deg);
    background: rgba(255, 255, 255, 0.13);
    box-shadow: 5.5rem 0 0 rgba(25, 175, 45, 0.16);
    content: "";
    pointer-events: none;
}

.sprt-news-live-match > * {
    position: relative;
    z-index: 1;
}

.sprt-news-live-match > header,
.sprt-news-live-match > footer {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.sprt-news-live-match > header > div {
    display: flex;
    min-width: 0;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.35rem 0.75rem;
}

.sprt-news-live-match > header span {
    color: #83ed91;
    font-size: clamp(1rem, 1.15vw, 1.12rem);
    letter-spacing: 0.055em;
    line-height: 1.35;
    text-transform: uppercase;
}

.sprt-news-live-match > header strong {
    min-width: 0;
    font-family: var(--sprt-expanded);
    font-size: clamp(1.15rem, 1.45vw, 1.4rem);
    font-weight: 400;
    letter-spacing: 0.015em;
    line-height: 1.2;
}

.sprt-news-live-match > header > b {
    flex: 0 0 auto;
    padding: 0.48rem 0.72rem;
    border: 1px solid rgba(255, 255, 255, 0.42);
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
    font-size: 1rem;
    font-weight: 400;
    letter-spacing: 0.025em;
    line-height: 1.2;
}

.sprt-news-live-match--live > header > b {
    border-color: #19af2d;
    background: #19af2d;
    color: #08000f;
}

.sprt-news-live-match__scoreboard {
    display: grid;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: clamp(0.85rem, 3vw, 2.8rem);
    margin-top: clamp(1.5rem, 3vw, 2.6rem);
}

.sprt-news-live-match__team {
    display: grid;
    min-width: 0;
    justify-items: center;
    gap: 0.75rem;
    text-align: center;
}

.sprt-news-live-match__mark {
    display: grid;
    width: clamp(3.25rem, 5.5vw, 4.75rem);
    height: clamp(3.25rem, 5.5vw, 4.75rem);
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.35);
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff;
    font-family: var(--sprt-expanded);
    font-size: clamp(1.15rem, 2vw, 1.7rem);
    line-height: 1;
}

.sprt-news-live-match__mark img {
    width: 78%;
    height: 78%;
    object-fit: contain;
}

.sprt-news-live-match__team h3 {
    max-width: 18ch;
    margin: 0;
    color: #ffffff;
    font-family: var(--sprt-display);
    font-size: clamp(1.35rem, 2.35vw, 2.2rem);
    font-weight: 400;
    letter-spacing: 0.015em;
    line-height: 1.14;
    overflow-wrap: break-word;
}

.sprt-news-live-match__score {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(0.35rem, 1vw, 0.75rem);
    color: #ffffff;
    font-family: var(--sprt-expanded);
    font-variant-numeric: tabular-nums;
}

.sprt-news-live-match__score strong {
    min-width: 0.78em;
    font-size: clamp(2.25rem, 6vw, 5rem);
    font-weight: 400;
    letter-spacing: 0.01em;
    line-height: 0.95;
    text-align: center;
}

.sprt-news-live-match__score i {
    color: #83ed91;
    font-size: clamp(1.4rem, 3vw, 2.5rem);
    font-style: normal;
    line-height: 1;
}

.sprt-news-live-match > footer {
    margin-top: clamp(1.4rem, 3vw, 2.35rem);
    padding-top: 1rem;
    border-top: 1px solid rgba(255, 255, 255, 0.23);
    color: rgba(255, 255, 255, 0.78);
    font-size: 1rem;
    line-height: 1.45;
}

.sprt-news-live-match > footer small {
    font-size: inherit;
}

.sprt-news-live-match > footer a {
    color: #83ed91;
    font-size: inherit;
    text-underline-offset: 0.25em;
}

.sprt-news-index li.sprt-news-index__live {
    padding: clamp(1rem, 2.5vw, 1.6rem) 0;
    background: transparent;
}

.sprt-news-index__live .sprt-news-live-match {
    width: 100%;
}

@media (max-width: 47.99rem) {
    .sprt-news-live-match > header,
    .sprt-news-live-match > footer {
        align-items: flex-start;
        flex-direction: column;
    }

    .sprt-news-live-match__scoreboard {
        gap: clamp(0.4rem, 2vw, 0.8rem);
    }

    .sprt-news-live-match__team h3 {
        max-width: 12ch;
        font-size: clamp(1.15rem, 5.5vw, 1.5rem);
        line-height: 1.16;
    }

    .sprt-news-live-match__score strong {
        font-size: clamp(2rem, 11vw, 3.15rem);
    }
}

@media (max-width: 25rem) {
    .sprt-news-live-match {
        padding-inline: 0.9rem;
    }

    .sprt-news-live-match__mark {
        width: 2.8rem;
        height: 2.8rem;
    }

    .sprt-news-live-match__team h3 {
        font-size: 1.08rem;
    }

    .sprt-news-live-match__score strong {
        font-size: 1.9rem;
    }
}

@media print {
    .sprt-news-live-match {
        border-color: #222222;
        background: #ffffff !important;
        color: #222222;
        box-shadow: none;
    }

    .sprt-news-live-match :is(h3, strong, b, span, i, small, a) {
        color: #222222 !important;
    }
}

/* The news page stays predominantly light; live scores are vivid accents, not dark panels. */
.sprt-news-live-match {
    border-color: rgba(13, 0, 27, 0.17);
    border-left-color: #19af2d;
    background:
        var(--sprt-noise),
        linear-gradient(118deg, #ffffff 0%, #f5ecff 62%, #eaf9ed 135%);
    background-blend-mode: soft-light, normal;
    box-shadow: 0 1.25rem 3.5rem rgba(31, 7, 55, 0.09);
    color: #0d001b;
}

.sprt-news-live-match::after {
    background: rgba(121, 0, 243, 0.14);
    box-shadow: 5.5rem 0 0 rgba(25, 175, 45, 0.13);
}

.sprt-news-live-match > header span,
.sprt-news-live-match__score i,
.sprt-news-live-match > footer a {
    color: #087719;
}

.sprt-news-live-match > header strong,
.sprt-news-live-match__team h3,
.sprt-news-live-match__score {
    color: #0d001b;
}

.sprt-news-live-match > header > b {
    border-color: rgba(121, 0, 243, 0.32);
    background: #ffffff;
    color: #5400a8;
}

.sprt-news-live-match--live > header > b {
    border-color: #19af2d;
    background: #19af2d;
    color: #08000f;
}

.sprt-news-live-match__mark {
    border-color: rgba(13, 0, 27, 0.16);
    background: #ffffff;
    color: #5400a8;
    box-shadow: 0 0.55rem 1.6rem rgba(42, 13, 68, 0.08);
}

.sprt-news-live-match > footer {
    border-top-color: rgba(13, 0, 27, 0.17);
    color: #655b70;
}
