/* Source: main.css */
/*
 * NORTHLINE Builders — Front-end styles
 * Consolidated after full desktop/mobile section audit.
 */

:root {
    --px-bg: #070707;
    --px-surface: #101010;
    --px-card: #0b0b0b;
    --px-text: #f4f4f2;
    --px-muted: #9c9c98;
    --px-line: #292929;
    --px-max: 1180px;
    --px-link-hover: #f4c430;
}

* {
    box-sizing: border-box;
}
html {
    scroll-behavior: smooth;
}
body {
    margin: 0;
    overflow-x: hidden;
    background: var(--px-bg);
    color: var(--px-text);
    font-family: "Nunito Sans", sans-serif;
}
img,
video {
    max-width: 100%;
}
button,
input,
textarea,
select {
    font: inherit;
}

.px-wrap {
    width: min(calc(100% - 48px), var(--px-max));
    margin-inline: auto;
}
.px-section {
    padding: 120px 0;
    border-bottom: 1px solid var(--px-line);
}
.px-eyebrow {
    margin: 0 0 18px;
    color: #b7b7b2;
    font-size: calc((11px) + 1px);
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0.22em;
    text-transform: uppercase;
}

/* Unified section titles. */
.px-section h2,
.px-faq-title,
.px-final h2 {
    margin-top: 0;
    color: #efefef;
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((52px) + 1px);
    font-weight: 900;
    line-height: 1.2em;
    letter-spacing: -1.1px;
    overflow-wrap: break-word;
}

/* Unified point/item titles. */
.px-section h3,
.px-faq-list .px-faq-item summary {
    color: #ffffff;
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((22px) + 1px);
    font-weight: 800;
    line-height: 1.2em;
    letter-spacing: 0;
    text-transform: none;
    font-style: normal;
    text-decoration: none;
}

/* Unified explanatory/body copy. */
.px-section .px-lead,
.px-section-head p,
.px-why-grid p,
.px-product-copy p,
.px-testimonial-grid blockquote p,
.px-faq-answer p,
.px-about-intro,
.px-final p {
    color: #e8e8e8;
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((18px) + 1px);
    font-weight: 400;
}

.px-button {
    display: inline-flex;
    align-items: center;
    gap: 26px;
    padding: 13px 17px;
    border: 0;
    background: #f2f2ef;
    color: #090909;
    font-size: calc((13px) + 1px);
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
}

/* Shared link icon. */
.px-link-symbol {
    width: 30px;
    height: 30px;
    display: inline-block;
    flex: 0 0 30px;
    overflow: visible;
    vertical-align: middle;
    fill: none;
    stroke: #fff;
    stroke-width: 2.65;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.px-desktop-header-controls {
    display: none;
}

.px-mobile-header-actions {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
}

.px-mobile-primary-menu {
    width: calc(100% - 44px);
    margin: 0 auto;
    padding: 12px 0 10px;
    list-style: none;
}

.px-mobile-primary-menu li {
    margin: 0;
}

.px-mobile-primary-menu a {
    min-height: 48px;
    padding: 10px 0;
    display: flex;
    align-items: center;
    color: #fff;
    font-size: calc((15px) + 1px);
    text-decoration: none;
}

.px-mobile-primary-menu .sub-menu {
    display: none;
    margin: 0;
    padding: 0 0 0 16px;
    list-style: none;
}

.px-mobile-primary-menu li.submenu-open > .sub-menu {
    display: block;
}

.px-mobile-primary-menu > .menu-item-has-children > a::after {
    content: "";
    width: 7px;
    height: 7px;
    margin-left: auto;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
    transition: transform 0.18s ease;
}

.px-mobile-primary-menu > .menu-item-has-children.submenu-open > a::after {
    transform: rotate(225deg) translate(-1px, -1px);
}

@keyframes pxSearchReveal {
    from {
        opacity: 0;
        transform: translateY(-8px) scale(0.985);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.px-mobile-search-panel {
    position: static;
    width: 100%;
    margin: 6px 0 0;
    padding: 0;
    background: transparent;
    border: 0;
}

.px-mobile-search-panel::before,
.px-mobile-search-panel::after {
    display: none;
}

@media (min-width: 621px) and (max-width: 1180px) {
    .px-header-shell {
        height: 64px;
        padding-inline: 32px;
    }

    .px-brand-image {
        max-width: 105px;
        max-height: 34px;
    }

    .px-brand-text {
        font-size: calc((27px) + 1px);
        font-weight: 700;
    }

    .px-mobile-drawer {
        max-height: calc(100dvh - 64px);
    }

    .px-mobile-primary-menu,
    .px-mobile-menu-search {
        width: calc(100% - 64px);
    }
}

@media (min-width: 1181px) {
    .px-header-shell {
        height: auto;
        padding-left: 24px;
        padding-right: 24px;
        justify-content: flex-start;
        gap: 28px;
    }

    .px-brand-link {
        gap: 12px;
        flex: 0 1 auto;
    }

    .px-brand-image {
        max-width: 120px;
        max-height: 38px;
    }

    .px-brand-text {
        font-size: calc((31px) + 1px);
        font-weight: 700;
    }

    .px-mobile-header-actions,
    .px-mobile-drawer {
        display: none;
    }

    .px-desktop-header-controls {
        min-width: 0;
        height: 100%;
        margin-left: auto;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 18px;
    }

    .px-desktop-header-controls .px-header-whatsapp-cta {
        min-height: 40px;
        padding-inline: 14px;
        column-gap: 7px;
        font-size: calc((13px) + 1px);
    }

    .px-desktop-header-controls .px-header-whatsapp-cta svg {
        width: 17px;
        height: 17px;
        flex-basis: 17px;
    }

    .px-desktop-nav {
        min-width: 0;
        height: 100%;
        display: flex;
        align-items: center;
    }

    .px-primary-menu {
        min-width: 0;
        margin: 0;
        padding: 0;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 24px;
        list-style: none;
    }

    .px-primary-menu li {
        position: relative;
        margin: 0;
    }

    .px-primary-menu a {
        display: flex;
        align-items: center;
        gap: 6px;
        color: #ddd;
        font-size: calc((13px) + 1px);
        line-height: 1.25;
        text-decoration: none;
        white-space: nowrap;
    }

    .px-primary-menu > .menu-item-has-children > a::after {
        content: "";
        width: 6px;
        height: 6px;
        margin-left: 3px;
        border-right: 1.5px solid currentColor;
        border-bottom: 1.5px solid currentColor;
        transform: rotate(45deg) translateY(-2px);
    }

    .px-primary-menu .sub-menu {
        position: absolute;
        z-index: 1200;
        top: calc(100% + 14px);
        left: 0;
        min-width: 220px;
        margin: 0;
        padding: 10px;
        background: #101010;
        border: 1px solid rgba(255, 255, 255, 0.1);
        list-style: none;
        opacity: 0;
        visibility: hidden;
        transform: translateY(8px);
        transition:
            opacity 0.18s ease,
            transform 0.18s ease,
            visibility 0.18s ease;
    }

    .px-primary-menu .sub-menu::before {
        content: "";
        position: absolute;
        top: -15px;
        right: 0;
        left: 0;
        height: 15px;
    }

    .px-primary-menu .sub-menu a {
        padding: 10px 12px;
    }

    .px-primary-menu li:hover > .sub-menu,
    .px-primary-menu li:focus-within > .sub-menu {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    .px-primary-menu .sub-menu .sub-menu {
        top: -11px;
        left: 100%;
    }
}

/* =========================================================
   HERO
   ========================================================= */
.px-hero {
    position: relative;
    isolation: isolate;
    min-height: clamp(680px, 92svh, 980px);
    display: flex;
    align-items: center;
    overflow: hidden;
    border-bottom: 1px solid var(--px-line);
    background: var(--px-bg);
}
.px-hero-media,
.px-hero-video,
.px-hero .px-overlay {
    position: absolute;
    inset: 0;
}

.px-hero-media {
    z-index: 0;
    overflow: hidden;
    background: #050505;
}

.px-hero-video {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center;
}

.px-hero .px-overlay {
    position: absolute;
    inset: 0;
}
.px-hero-slides {
    z-index: 0;
    overflow: hidden;
}
.px-hero-slide {
    opacity: 0;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    transform: scale(1.02);
    transition:
        opacity 1s ease,
        transform 8s ease;
    will-change: opacity, transform;
}
.px-hero .px-overlay {
    z-index: 1;
    pointer-events: none;
    background:
        linear-gradient(0deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.44)),
        radial-gradient(circle at center, rgba(0, 0, 0, 0.12), rgba(0, 0, 0, 0.34));
}
.px-hero-content {
    position: relative;
    z-index: 2;
    width: min(calc(100% - 48px), var(--px-max));
    margin: 0 auto;
    padding-block: clamp(120px, 13svh, 150px);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.px-hero-copy {
    width: min(100%, 970px);
    margin: 0 auto;
    text-align: center;
}
.px-hero-eyebrow {
    margin: 0 0 18px;
    text-align: center;
}
.px-hero h1 {
    max-width: 970px;
    margin: 0 auto;
    color: #efefef;
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((clamp(46px, 6.8vw, 94px)) + 1px);
    font-weight: 900;
    line-height: 0.95;
    letter-spacing: -0.055em;
    overflow-wrap: anywhere;
}

.px-hero-headline-2 {
    display: block;
    white-space: nowrap;
    overflow-wrap: normal;
    word-break: normal;
}

.px-hero-description {
    max-width: 720px;
    margin: 26px auto 0;
    color: #e8e8e8;
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((18px) + 1px);
    font-weight: 400;
    line-height: 1.65;
    text-align: center;
}

.px-hero-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    margin-top: 30px;
    color: #fff;
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((18px) + 1px);
    font-weight: 800;
    line-height: 1.2;
    text-decoration: none;
    border: 1px solid #ffffff;
    padding: 13px 20px;
    transition:
        color 0.2s ease,
        border-color 0.2s ease;
}
.px-hero-link:hover,
.px-hero-link:focus-visible {
    border-color: var(--px-link-hover);
    text-decoration: none;
}
.px-hero-link-icon {
    width: 30px;
    height: 30px;
    stroke-width: 2.65;
}

/* =========================================================
   ABOUT + PERSUASION
   ========================================================= */
.px-about,
.px-persuasion.px-about-style {
    padding: 92px 0;
    background: transparent;
    border-bottom: 1px solid var(--px-line);
}
.px-about .px-about-wrap,
.px-persuasion .px-about-wrap {
    width: min(calc(100% - 48px), var(--px-max));
}
.px-about-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr);
    gap: 72px;
    align-items: center;
}
.px-about-content {
    max-width: 720px;
    min-width: 0;
    text-align: left;
}
.px-about-content .px-eyebrow {
    margin: 0 0 34px;
    text-align: left;
    letter-spacing: 0.42em;
}
.px-about-content h2 {
    max-width: 760px;
    margin: 0 0 34px;
    text-align: left;
}
.px-about-intro {
    max-width: 720px;
    margin: 0;
    line-height: 1.45;
    text-align: left;
}
.px-about-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    margin-top: 48px;
    color: #fff;
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((18px) + 1px);
    font-weight: 800;
    line-height: 1.2;
    text-decoration: none;
}
.px-about-link:hover {
    text-decoration: underline;
    text-underline-offset: 5px;
}
.px-about-link-icon {
    width: 30px;
    height: 30px;
    stroke-width: 2.65;
}
.px-about-photo {
    position: relative;
    width: 100%;
    max-width: 460px;
    justify-self: end;
    padding: 24px 18px 18px;
}
.px-about-polaroid {
    position: relative;
    background: #efefed;
    padding: 24px 18px 52px;
transform: rotate(-0.25deg);
}
.px-about-image {
    aspect-ratio: 1.5/1;
    overflow: hidden;
    background: #d8d8d4;
}
.px-about-image img,
.px-about-image video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: none;
}
.px-about-tape {
    position: absolute;
    z-index: 3;
    top: 5px;
    width: 112px;
    height: 42px;
    background: rgba(238, 238, 232, 0.92);
clip-path: polygon(4% 10%, 96% 0, 100% 88%, 7% 100%, 0 33%);
}
.px-about-tape-left {
    left: -9px;
    transform: rotate(-27deg);
}
.px-about-tape-right {
    right: -8px;
    transform: rotate(27deg) scaleX(-1);
}

/* =========================================================
   WHY US
   ========================================================= */
.px-why {
    background: transparent;
}
.px-why-head {
    max-width: 920px;
    margin: 0 auto 88px;
    text-align: center;
}
.px-why-head .px-eyebrow {
    margin: 0 0 10px;
    letter-spacing: 0.42em;
}
.px-why-head h2 {
    max-width: none;
    margin: 0 auto 4px;
}
.px-why-intro {
    max-width: 760px;
    margin: 0 auto;
    line-height: 1.45;
}
.px-why .px-why-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    border: 0;
}
.px-why-card {
    min-width: 0;
    padding: 0;
    border: 0;
    background: transparent;
}
.px-why-image-link {
    display: block;
    margin-bottom: 34px;
    text-decoration: none;
}
.px-why-image {
    width: 100%;
    aspect-ratio: 1.9/1;
    overflow: hidden;
    background: #e9e9e9;
}
.px-why-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: none;
    transition: transform 0.35s ease;
}
.px-why-card:hover .px-why-image img {
    transform: scale(1.02);
}
.px-why-card h3 {
    margin: 0 0 8px;
}
.px-why-card p {
    margin: 0 0 24px;
    line-height: 1.42;
}
.px-why-link {
    display: inline-block;
    color: #fff;
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((16px) + 1px);
    font-weight: 800;
    font-style: italic;
    line-height: 1.2;
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* =========================================================
   PRODUCTS
   ========================================================= */
.px-section-head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 40px;
    margin-bottom: 45px;
}
.px-section-head h2 {
    max-width: 760px;
    margin: 0;
}
.px-section-head p {
    max-width: 560px;
    margin: 0;
    line-height: 1.5;
}
.px-product-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-top: 1px solid var(--px-line);
    border-left: 1px solid var(--px-line);
}
.px-product-card {
    min-width: 0;
    background: var(--px-card);
    border-right: 1px solid var(--px-line);
    border-bottom: 1px solid var(--px-line);
}
.px-product-card > a {
    display: block;
    height: 100%;
    color: inherit;
    text-decoration: none;
}
.px-product-image {
    aspect-ratio: 16/9;
    overflow: hidden;
    background: #131313;
}
.px-product-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: grayscale(1);
    transition:
        transform 0.5s ease,
        filter 0.5s ease;
}
.px-product-card:hover .px-product-image img {
    transform: scale(1.025);
    filter: grayscale(0.2);
}
.px-product-copy {
    padding: 28px;
}
.px-product-copy h3 {
    margin: 0 0 12px;
}
.px-product-copy p {
    margin: 0;
    line-height: 1.5;
}
.px-price {
    margin: 16px 0;
}
.px-price del {
    color: #777;
}
.px-product-copy .px-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 16px;
    color: #fff;
    font-size: calc((12px) + 1px);
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
.px-product-copy .px-link-icon {
    width: 30px;
    height: 30px;
    stroke-width: 2.65;
}

/* =========================================================
   TESTIMONIALS
   ========================================================= */
.px-testimonial-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 45px;
    border-top: 1px solid var(--px-line);
    border-left: 1px solid var(--px-line);
}
.px-testimonial-grid blockquote {
    min-width: 0;
    min-height: 250px;
    margin: 0;
    padding: 34px;
    border-right: 1px solid var(--px-line);
    border-bottom: 1px solid var(--px-line);
}
.px-testimonial-grid blockquote p {
    margin: 0;
    line-height: 1.45;
}
.px-testimonial-grid blockquote footer {
    margin-top: 55px;
    color: var(--px-muted);
    font-size: calc((12px) + 1px);
}
.px-avatar {
    width: 44px;
    height: 44px;
    margin-bottom: 18px;
    border-radius: 50%;
    object-fit: cover;
    filter: grayscale(1);
}

/* =========================================================
   FAQ
   ========================================================= */
.px-faq-section {
    padding: 26px 0 28px;
    background: transparent;
    border-bottom: 0;
}
.px-faq-section .px-eyebrow {
    margin-bottom: 18px;
}
.px-faq-title {
    max-width: 760px;
    margin: 0 0 45px;
}
.px-faq-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
}
.px-faq-item {
    min-width: 0;
    margin: 0;
    padding: 0;
    overflow: hidden;
    border: 0;
    border-radius: 7px;
    background: #202020;
}
.px-faq-item summary {
    min-height: 73px;
    padding: 0 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    cursor: pointer;
    list-style: none;
}
.px-faq-item summary::-webkit-details-marker {
    display: none;
}
.px-faq-item summary::marker {
    content: "";
}
.px-faq-chevron {
    width: 12px;
    height: 12px;
    flex: 0 0 12px;
    border-right: 1.6px solid #f1f1f1;
    border-bottom: 1.6px solid #f1f1f1;
    transform: rotate(45deg) translateY(-3px);
    transition: transform 0.2s ease;
}
.px-faq-item[open] .px-faq-chevron {
    transform: rotate(225deg) translate(-2px, -2px);
}
.px-faq-answer {
    padding: 0 24px 21px;
}
.px-faq-answer p {
    max-width: none;
    margin: 0;
    line-height: 1.55;
}

/* =========================================================
   FINAL CTA
   ========================================================= */
.px-final {
    padding: 150px 0;
    background: var(--px-bg);
    color: var(--px-text);
    text-align: center;
    border-bottom: 1px solid var(--px-line);
}
.px-final h2 {
    max-width: 760px;
    margin: 0 auto 26px;
}
.px-final p {
    margin: 0 auto;
    line-height: 1.5;
}
.px-final-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: 24px;
    color: #ffffff;
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((18px) + 1px);
    font-weight: 800;
    line-height: 1.2;
    text-decoration: none;
    border: 1px solid #ffffff;
    padding: 14px 22px;
    transition:
        color 0.2s ease,
        border-color 0.2s ease;
}
.px-final-link:hover,
.px-final-link:focus-visible {
    color: var(--px-link-hover);
    border-color: var(--px-link-hover);
}
.px-final-link-icon {
    flex: 0 0 30px;
}

/* =========================================================
   FOOTER + FLOATING UI
   ========================================================= */
.px-footer {
    padding: 80px 0 28px;
    background: #050505;
}
.px-footer-grid {
    display: grid;
    grid-template-columns: 1.3fr 1fr 1fr;
    gap: 70px;
    text-align: center;
}
.px-footer h3,
.px-footer h4 {
    font-family: "Nunito Sans", sans-serif;
}
.px-footer p,
.px-footer a {
    color: #8f8f8b;
    font-size: calc((13px) + 1px);
}
.px-footer a {
    text-decoration: none;
}
.px-footer-links {
    display: grid;
    gap: 10px;
}
.px-socials {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-top: 20px;
}
.px-social-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    color: #efefef;
    text-decoration: none;
    transition:
        color 0.2s ease,
        transform 0.2s ease;
}
.px-social-link svg {
    width: 28px;
    height: 28px;
    display: block;
}
.px-social-link:hover,
.px-social-link:focus-visible {
    color: #f4c430;
    transform: translateY(-2px);
}
.px-social-link:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 3px;
    border-radius: 6px;
}
.px-footer-bottom {
    margin-top: 55px;
    padding-top: 24px;
    border-top: 1px solid var(--px-line);
    color: #777;
    font-size: calc((12px) + 1px);
    text-align: center;
}
.px-whatsapp {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 99999;
    display: block;
    width: 60px;
    height: 60px;
    line-height: 0;
    text-decoration: none;
    transform-origin: center;
    transition: transform 0.25s ease;
}
.px-whatsapp-svg {
    display: block;
    width: 100%;
    height: 100%;
    overflow: visible;
}
.px-whatsapp:hover,
.px-whatsapp:focus-visible {
    transform: scale(1.08);
}
@media (max-width: 480px) {
    .px-whatsapp {
        width: 54px;
        height: 54px;
        right: 16px;
        bottom: 16px;
    }
}
.px-cookie {
    position: fixed;
    z-index: 1200;
    left: 22px;
    bottom: 22px;
    width: min(410px, calc(100% - 44px));
    padding: 24px;
    background: #111;
    border: 1px solid #333;
}
.px-cookie[hidden] {
    display: none;
}
.px-cookie h3 {
    margin: 0 0 8px;
}
.px-cookie p {
    color: #aaa;
    font-size: calc((13px) + 1px);
}
.px-cookie-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.px-cookie button {
    padding: 10px 14px;
    border: 0;
    background: #eee;
    cursor: pointer;
}
.px-cookie-close {
    position: absolute;
    top: 8px;
    right: 12px;
    background: none;
    color: #fff;
    font-size: calc((20px) + 1px);
}

/* Single post/page: give the article body a comfortable visual break from the post header/meta. */
body.single .wp-block-post-content,
body.page:not(.home) .wp-block-post-content {
    margin-top: 36px;
}
.wp-block-post-content > .alignfull {
    margin-block-start: 0;
}

/* =========================================================
   TABLET / MOBILE — SECTION RESPONSIVE RULES
   Header responsive rules live only in the HEADER section above.
   ========================================================= */
@media (max-width: 1180px) {
    .px-hero {
        min-height: max(680px, 88svh);
    }
    .px-hero-content {
        width: min(calc(100% - 30px), var(--px-max));
        padding-block: 116px;
    }
    .px-hero h1 {
        font-size: calc((clamp(44px, 8vw, 74px)) + 1px);
    }
}

@media (max-width: 900px) {
    .px-wrap {
        width: min(calc(100% - 30px), var(--px-max));
    }
    .px-section {
        padding: 80px 0;
    }

    .px-about,
    .px-persuasion.px-about-style {
        padding: 72px 0;
    }
    .px-about-grid {
        grid-template-columns: 1fr;
        gap: 48px;
    }
    .px-about-content {
        max-width: 760px;
        margin: 0;
    }
    .px-about-photo {
        max-width: 560px;
        justify-self: center;
    }
    .px-about-link {
        margin-top: 36px;
    }

    .px-why-head {
        margin-bottom: 58px;
    }
    .px-why .px-why-grid {
        grid-template-columns: 1fr;
        gap: 54px;
    }
    .px-why-image-link {
        margin-bottom: 24px;
    }
    .px-why-image {
        aspect-ratio: 1.8/1;
    }

    .px-product-grid {
        grid-template-columns: 1fr;
    }
    .px-testimonial-grid {
        grid-template-columns: 1fr;
    }
    .px-faq-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .px-faq-title {
        margin-bottom: 32px;
    }

    .px-footer-grid {
        grid-template-columns: 1fr;
        gap: 42px;
    }
}

@media (max-width: 620px) {
    /* Mobile section titles: compact while preserving the desktop hierarchy. */
    .px-section h2,
    .px-faq-title,
    .px-final h2 {
        font-size: calc((40px) + 1px);
        font-weight: 900;
        line-height: 1.2em;
        letter-spacing: -1.1px;
    }
    .px-wrap,
    .px-about .px-about-wrap,
    .px-persuasion .px-about-wrap {
        width: min(calc(100% - 28px), var(--px-max));
    }

    .px-hero {
        min-height: max(620px, 84svh);
    }
    .px-hero-content {
        width: min(calc(100% - 28px), var(--px-max));
        padding-block: 92px;
    }
    .px-hero h1 {
        font-size: calc((clamp(32px, 9.2vw, 46px)) + 1px);
        line-height: 1;
    }

    .px-section {
        padding: 56px 0;
    }
    .px-about,
    .px-persuasion.px-about-style {
        padding: 58px 0 64px;
    }
    .px-about-content .px-eyebrow {
        margin-bottom: 26px;
    }
    .px-about-content h2 {
        margin-bottom: 24px;
    }
    .px-about-link {
        margin-top: 30px;
    }
    .px-about-photo {
        max-width: 100%;
        padding: 20px 12px 12px;
    }
    .px-about-polaroid {
        padding: 16px 14px 42px;
    }
    .px-about-tape {
        width: 86px;
        height: 34px;
    }

    .px-why-head {
        margin-bottom: 44px;
    }
    .px-why .px-why-grid {
        gap: 46px;
    }

    .px-section-head {
        display: block;
    }
    .px-section-head h2 {
        margin-bottom: 18px;
    }
    .px-product-copy {
        padding: 22px;
    }

    .px-faq-section {
        padding: 28px 0 18px;
    }
    .px-faq-list {
        grid-template-columns: 1fr;
    }
    .px-faq-item summary {
        min-height: 66px;
        padding: 0 20px;
    }
    .px-faq-answer {
        padding: 0 20px 18px;
    }

    .px-final {
        padding: 48px 0 18px;
    }
    .px-footer {
        padding-top: 60px;
    }
    .px-cookie {
        left: 14px;
        bottom: 14px;
        width: calc(100% - 28px);
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
    .px-hero-slide {
        transform: none;
        transition: opacity 0.2s linear;
    }
    .px-hero-slide.is-active {
        transform: none;
    }
}

/* =========================================================
   GLOBAL LINK HOVER
   Warm yellow accent shared by text links, navigation and
   link icons. Interactive controls keep their own UI colors.
   ========================================================= */
a {
    transition: color 0.18s ease;
}
a:hover,
a:focus-visible,
.px-primary-menu a:hover,
.px-primary-menu a:focus-visible,
.px-mobile-primary-menu a:hover,
.px-mobile-primary-menu a:focus-visible,
.px-footer a:hover,
.px-footer a:focus-visible,
.px-hero-link:hover,
.px-hero-link:focus-visible,
.px-about-link:hover,
.px-about-link:focus-visible,
.px-why-link:hover,
.px-why-link:focus-visible,
.px-product-card > a:hover .px-link,
.px-product-card > a:focus-visible .px-link,
.px-product-copy .px-link:hover,
.px-product-copy .px-link:focus-visible {
    color: var(--px-link-hover);
}

/* SVG link-chain icons inherit the same hover accent. */
a:hover .px-link-symbol,
a:focus-visible .px-link-symbol,
a:hover .px-link-icon,
a:focus-visible .px-link-icon,
.px-product-card > a:hover .px-link-symbol,
.px-product-card > a:focus-visible .px-link-symbol {
    stroke: var(--px-link-hover);
}

/* Single post & page: comfortable mobile reading gutters. */
@media (max-width: 620px) {
    body.single .wp-block-post-content,
    body.page:not(.home) .wp-block-post-content {
        margin-top: 28px;
    }

    body.single .wp-site-blocks > .wp-block-group,
    body.page:not(.home) .wp-site-blocks > .wp-block-group {
        box-sizing: border-box;
        width: 100%;
        max-width: 100%;
        padding-left: 20px;
        padding-right: 20px;
    }

    body.single .wp-block-post-featured-image.alignwide,
    body.page:not(.home) .wp-block-post-featured-image.alignwide {
        margin-left: 0;
        margin-right: 0;
        width: 100%;
    }
}

/* v1.1.68 — mobile WhatsApp icon/label spacing */
@media (max-width: 1180px) {
    .px-mobile-header-actions .px-header-whatsapp-cta {
        column-gap: 4px;
    }

    .px-mobile-header-actions .px-header-whatsapp-cta > span {
        margin-left: 0;
    }
}

/* v1.1.68 — mobile spacing between WhatsApp CTA and hamburger */
@media (max-width: 1180px) {
    .px-mobile-header-actions {
        gap: 2px;
    }

    .px-mobile-header-actions .px-header-whatsapp-cta {
        padding-left: 0;
        padding-right: 0;
    }
}

/* v1.1.68 — final hero headline color on dark/video background */
.px-hero .px-hero-copy h1,
.px-hero .px-hero-copy .px-hero-headline-2 {
    color: #7cff6b;
}

/* v1.1.68 — robust hero video rendering */
.px-hero-media {
    display: block;
    visibility: visible;
    opacity: 1;
}

.px-hero-video {
    display: block;
    visibility: visible;
    opacity: 1;
    width: 100%;
    height: 100%;
    object-fit: cover;
    background: #000;
}

/* v1.1.68 — navigation font sizes */
@media (min-width: 1181px) {
    .px-desktop-nav .px-primary-menu > li > a,
    .px-desktop-nav .sub-menu a {
        font-size: calc((16px) + 1px);
    }
}

@media (max-width: 1180px) {
    .px-mobile-primary-menu > li > a,
    .px-mobile-primary-menu .sub-menu a {
        font-size: calc((17px) + 1px);
    }
}

/* v1.1.68 — content sections below Hero: comfortable gutters + slightly smaller typography */
body.home main > section:not(.px-hero) .px-wrap {
    width: min(calc(100% - 64px), var(--px-max));
}

body.home main > section:not(.px-hero) h2 {
    font-size: calc((clamp(28px, 3.4vw, 48px)) + 1px);
}

body.home main > section:not(.px-hero) h3 {
    font-size: calc((clamp(20px, 2vw, 28px)) + 1px);
}

body.home main > section:not(.px-hero) p,
body.home main > section:not(.px-hero) li,
body.home main > section:not(.px-hero) a,
body.home main > section:not(.px-hero) button {
    font-size: calc((15px) + 1px);
}

@media (max-width: 900px) {
    body.home main > section:not(.px-hero) .px-wrap {
        width: min(calc(100% - 40px), var(--px-max));
    }

    body.home main > section:not(.px-hero) h2 {
        font-size: calc((clamp(26px, 5vw, 38px)) + 1px);
    }

    body.home main > section:not(.px-hero) h3 {
        font-size: calc((clamp(19px, 3vw, 25px)) + 1px);
    }
}

@media (max-width: 620px) {
    body.home main > section:not(.px-hero) .px-wrap {
        width: min(calc(100% - 32px), var(--px-max));
    }

    body.home main > section:not(.px-hero) h2 {
        font-size: calc((28px) + 1px);
    }

    body.home main > section:not(.px-hero) h3 {
        font-size: calc((20px) + 1px);
    }

    body.home main > section:not(.px-hero) p,
    body.home main > section:not(.px-hero) li,
    body.home main > section:not(.px-hero) a,
    body.home main > section:not(.px-hero) button {
        font-size: calc((14px) + 1px);
    }
}

/* v1.1.68 — full-width photo grid above Testimonials */
.px-photo-grid {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background: #000;
}

.px-photo-grid-row {
    display: grid;
    width: 100%;
    margin: 0;
    padding: 0;
    gap: 0;
}

.px-photo-grid-row-top {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.px-photo-grid-row-bottom {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.px-photo-grid-item {
    position: relative;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background: #111;
}

.px-photo-grid-row-top .px-photo-grid-item {
    aspect-ratio: 2.05 / 1;
}

.px-photo-grid-row-bottom .px-photo-grid-item {
    aspect-ratio: 3.05 / 1;
}

.px-photo-grid-item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    margin: 0;
    padding: 0;
    border: 0;
    opacity: 1;
    filter: none;
    transform: none;
}

/* Explicitly no tint/gradient/overlay on this section. */
.px-photo-grid-item::before,
.px-photo-grid-item::after {
    content: none;
}

@media (max-width: 900px) {
    .px-photo-grid-row-top,
    .px-photo-grid-row-bottom {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .px-photo-grid-row-top .px-photo-grid-item,
    .px-photo-grid-row-bottom .px-photo-grid-item {
        aspect-ratio: 1.55 / 1;
    }

    .px-photo-grid-row-top .px-photo-grid-item:last-child {
        grid-column: 1 / -1;
        aspect-ratio: 2.2 / 1;
    }
}

@media (max-width: 620px) {
    .px-photo-grid-row-top,
    .px-photo-grid-row-bottom {
        grid-template-columns: 1fr;
    }

    .px-photo-grid-row-top .px-photo-grid-item,
    .px-photo-grid-row-bottom .px-photo-grid-item,
    .px-photo-grid-row-top .px-photo-grid-item:last-child {
        grid-column: auto;
        aspect-ratio: 16 / 10;
    }
}

/* v1.1.68 — randomized sequential reveal for Photo Grid */
.px-photo-grid-item {
    opacity: 0;
    transform: translate3d(0, 28px, 0) scale(0.985);
    transition:
        opacity 0.72s cubic-bezier(0.2, 0.75, 0.25, 1),
        transform 0.82s cubic-bezier(0.2, 0.75, 0.25, 1);
    transition-delay: var(--px-photo-delay, 0ms);
    will-change: opacity, transform;
}

.px-photo-grid-item[data-reveal-origin="left"] {
    transform: translate3d(-42px, 0, 0) scale(0.985);
}

.px-photo-grid-item[data-reveal-origin="right"] {
    transform: translate3d(42px, 0, 0) scale(0.985);
}

.px-photo-grid-item[data-reveal-origin="up"] {
    transform: translate3d(0, -34px, 0) scale(0.985);
}

.px-photo-grid-item[data-reveal-origin="down"] {
    transform: translate3d(0, 34px, 0) scale(0.985);
}

.px-photo-grid-item[data-reveal-origin="zoom"] {
    transform: scale(0.94);
}

.px-photo-grid.is-revealed .px-photo-grid-item {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
}

@media (prefers-reduced-motion: reduce) {
    .px-photo-grid-item,
    .px-photo-grid-item[data-reveal-origin] {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

/* v1.1.68 — original kinetic image + typography showcase */
.px-kinetic-showcase {
    width: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background: #050505;
    color: #fff;
}

.px-kinetic-stage {
    position: relative;
    width: 100%;
    height: clamp(620px, 78vw, 900px);
    min-height: 620px;
    overflow: hidden;
    isolation: isolate;
    background:
        radial-gradient(circle at 78% 22%, rgba(62, 91, 255, 0.15), transparent 27%),
        radial-gradient(circle at 18% 78%, rgba(124, 255, 107, 0.1), transparent 28%), #050505;
}

.px-kinetic-photo {
    position: absolute;
    z-index: 2;
    margin: 0;
    overflow: hidden;
    border-radius: 0;
animation: pxKineticPhoto 7.5s cubic-bezier(0.45, 0, 0.2, 1) infinite both;
}

.px-kinetic-photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: none;
    opacity: 1;
}

.px-kinetic-photo-a {
    width: 30vw;
    height: 25vw;
    min-width: 300px;
    min-height: 250px;
    left: 7%;
    top: 12%;
    animation-delay: 0s;
}
.px-kinetic-photo-b {
    width: 26vw;
    height: 34vw;
    min-width: 260px;
    min-height: 340px;
    right: 7%;
    top: 7%;
    animation-delay: -1.9s;
}
.px-kinetic-photo-c {
    width: 34vw;
    height: 21vw;
    min-width: 340px;
    min-height: 210px;
    left: 19%;
    bottom: 7%;
    animation-delay: -3.8s;
}
.px-kinetic-photo-d {
    width: 25vw;
    height: 19vw;
    min-width: 250px;
    min-height: 190px;
    right: 15%;
    bottom: 10%;
    animation-delay: -5.7s;
}

.px-kinetic-word {
    position: absolute;
    z-index: 4;
    margin: 0;
    font-weight: 900;
    line-height: 0.78;
    letter-spacing: -0.075em;
    white-space: nowrap;
    pointer-events: none;
    animation: pxKineticWord 6.2s cubic-bezier(0.45, 0, 0.2, 1) infinite both;
}

.px-kinetic-word-build {
    left: 3%;
    top: 39%;
    color: #fff;
    font-size: calc((clamp(76px, 15vw, 230px)) + 1px);
}

.px-kinetic-word-better {
    right: 2%;
    bottom: 27%;
    color: #7cff6b;
    font-size: calc((clamp(70px, 13vw, 205px)) + 1px);
    animation-delay: -3.1s;
}

.px-kinetic-pill,
.px-kinetic-line {
    position: absolute;
    z-index: 6;
    font-weight: 800;
    letter-spacing: -0.02em;
    white-space: nowrap;
    animation: pxKineticFloat 4.2s ease-in-out infinite alternate;
}

.px-kinetic-pill {
    padding: 10px 16px;
    border-radius: 999px;
    font-size: calc((clamp(12px, 1.15vw, 17px)) + 1px);
    color: #050505;
}

.px-kinetic-pill-green {
    left: 4%;
    top: 7%;
    background: #7cff6b;
}
.px-kinetic-pill-blue {
    right: 34%;
    top: 13%;
    background: #79a7ff;
    animation-delay: -1.1s;
}
.px-kinetic-pill-orange {
    left: 6%;
    bottom: 12%;
    background: #ff9a52;
    animation-delay: -2.2s;
}
.px-kinetic-pill-pink {
    right: 4%;
    bottom: 6%;
    background: #ff8ed8;
    animation-delay: -3.3s;
}

.px-kinetic-line {
    font-size: calc((clamp(15px, 1.9vw, 28px)) + 1px);
    color: #fff;
}

.px-kinetic-line-one {
    left: 39%;
    top: 5%;
}
.px-kinetic-line-two {
    right: 4%;
    top: 55%;
    color: #b8a5ff;
    animation-delay: -1.7s;
}

.px-kinetic-orbit {
    position: absolute;
    z-index: 1;
    width: 44vw;
    height: 44vw;
    min-width: 420px;
    min-height: 420px;
    left: 29%;
    top: 17%;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 50%;
    animation: pxKineticOrbit 10s linear infinite;
}

.px-kinetic-dot {
    position: absolute;
    z-index: 7;
    border-radius: 50%;
    animation: pxKineticPulse 1.6s ease-in-out infinite alternate;
}

.px-kinetic-dot-one {
    width: 22px;
    height: 22px;
    right: 27%;
    top: 8%;
    background: #ffe66d;
}
.px-kinetic-dot-two {
    width: 14px;
    height: 14px;
    left: 13%;
    bottom: 29%;
    background: #7ddcff;
    animation-delay: -0.8s;
}

@keyframes pxKineticPhoto {
    0%,
    100% {
        opacity: 0.18;
        transform: translate3d(-18px, 52px, 0) scale(0.91) rotate(-1.8deg);
    }
    12%,
    34% {
        opacity: 1;
        transform: translate3d(10px, -8px, 0) scale(1.025) rotate(0.8deg);
    }
    46%,
    64% {
        opacity: 0.72;
        transform: translate3d(-12px, 16px, 0) scale(0.985) rotate(-0.6deg);
    }
    76%,
    90% {
        opacity: 0.28;
        transform: translate3d(22px, -30px, 0) scale(0.95) rotate(1.4deg);
    }
}

@keyframes pxKineticWord {
    0%,
    100% {
        opacity: 0.12;
        transform: translate3d(-7vw, 0, 0) scale(0.96);
    }
    15%,
    36% {
        opacity: 1;
        transform: translate3d(1vw, -4px, 0) scale(1.025);
    }
    48%,
    66% {
        opacity: 0.55;
        transform: translate3d(-1vw, 8px, 0) scale(0.99);
    }
    78%,
    92% {
        opacity: 0.18;
        transform: translate3d(7vw, -6px, 0) scale(0.97);
    }
}

@keyframes pxKineticFloat {
    0% {
        transform: translate3d(-14px, -12px, 0) rotate(-2deg) scale(0.98);
    }
    50% {
        transform: translate3d(10px, 6px, 0) rotate(0.8deg) scale(1.03);
    }
    100% {
        transform: translate3d(18px, 14px, 0) rotate(2deg) scale(1);
    }
}

@keyframes pxKineticOrbit {
    to {
        transform: rotate(360deg);
    }
}

@keyframes pxKineticPulse {
    from {
        transform: scale(0.7);
        opacity: 0.45;
    }
    to {
        transform: scale(1.25);
        opacity: 1;
    }
}

@media (max-width: 900px) {
    .px-kinetic-stage {
        height: 760px;
    }
    .px-kinetic-photo-a {
        width: 43vw;
        height: 34vw;
        left: 3%;
        top: 14%;
    }
    .px-kinetic-photo-b {
        width: 38vw;
        height: 48vw;
        right: 3%;
        top: 8%;
    }
    .px-kinetic-photo-c {
        width: 48vw;
        height: 30vw;
        left: 8%;
        bottom: 10%;
    }
    .px-kinetic-photo-d {
        width: 35vw;
        height: 28vw;
        right: 4%;
        bottom: 16%;
    }
    .px-kinetic-word-build {
        top: 43%;
    }
    .px-kinetic-word-better {
        bottom: 29%;
    }
}

@media (max-width: 620px) {
    .px-kinetic-stage {
        height: 680px;
        min-height: 680px;
    }
    .px-kinetic-photo {
        min-width: 0;
        min-height: 0;
    }
    .px-kinetic-photo-a {
        width: 54vw;
        height: 42vw;
        left: 0;
        top: 13%;
    }
    .px-kinetic-photo-b {
        width: 46vw;
        height: 62vw;
        right: 0;
        top: 7%;
    }
    .px-kinetic-photo-c {
        width: 62vw;
        height: 39vw;
        left: 0;
        bottom: 8%;
    }
    .px-kinetic-photo-d {
        width: 42vw;
        height: 35vw;
        right: 0;
        bottom: 17%;
    }
    .px-kinetic-word-build {
        left: 2%;
        top: 42%;
        font-size: calc((20vw) + 1px);
    }
    .px-kinetic-word-better {
        right: 2%;
        bottom: 31%;
        font-size: calc((17vw) + 1px);
    }
    .px-kinetic-pill {
        padding: 8px 11px;
        font-size: calc((10px) + 1px);
    }
    .px-kinetic-pill-blue {
        right: 5%;
        top: 40%;
    }
    .px-kinetic-line-one {
        left: 4%;
        top: 4%;
    }
    .px-kinetic-line-two {
        right: 3%;
        top: 59%;
    }
    .px-kinetic-orbit {
        width: 430px;
        height: 430px;
        min-width: 0;
        min-height: 0;
        left: 4%;
        top: 18%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .px-kinetic-photo,
    .px-kinetic-word,
    .px-kinetic-pill,
    .px-kinetic-line,
    .px-kinetic-orbit,
    .px-kinetic-dot {
        animation: none;
        opacity: 1;
        transform: none;
    }
}

/* v1.1.68 — faster, busier kinetic motion */
.px-kinetic-photo-a {
    animation-name: pxKineticPhotoA;
}
.px-kinetic-photo-b {
    animation-name: pxKineticPhotoB;
}
.px-kinetic-photo-c {
    animation-name: pxKineticPhotoC;
}
.px-kinetic-photo-d {
    animation-name: pxKineticPhotoD;
}

.px-kinetic-pill-green {
    animation: pxKineticDriftA 3.2s ease-in-out infinite alternate;
}
.px-kinetic-pill-blue {
    animation: pxKineticDriftB 3.7s ease-in-out infinite alternate;
}
.px-kinetic-pill-orange {
    animation: pxKineticDriftC 3.4s ease-in-out infinite alternate;
}
.px-kinetic-pill-pink {
    animation: pxKineticDriftD 3.9s ease-in-out infinite alternate;
}

.px-kinetic-line-one {
    animation: pxKineticLineA 4.5s ease-in-out infinite;
}
.px-kinetic-line-two {
    animation: pxKineticLineB 4.9s ease-in-out infinite;
}

.px-kinetic-orbit {
    animation:
        pxKineticOrbit 8s linear infinite,
        pxKineticOrbitPulse 3.2s ease-in-out infinite alternate;
}

.px-kinetic-dot-one {
    animation: pxKineticDotA 2.2s ease-in-out infinite alternate;
}

.px-kinetic-dot-two {
    animation: pxKineticDotB 2.5s ease-in-out infinite alternate;
}

@keyframes pxKineticPhotoA {
    0%,
    100% {
        opacity: 0.2;
        transform: translate3d(-30px, 42px, 0) scale(0.92) rotate(-2deg);
    }
    25% {
        opacity: 1;
        transform: translate3d(18px, -18px, 0) scale(1.03) rotate(1deg);
    }
    55% {
        opacity: 0.82;
        transform: translate3d(-10px, 10px, 0) scale(0.99) rotate(-0.7deg);
    }
    80% {
        opacity: 0.35;
        transform: translate3d(28px, -24px, 0) scale(0.95) rotate(1.6deg);
    }
}
@keyframes pxKineticPhotoB {
    0%,
    100% {
        opacity: 0.22;
        transform: translate3d(28px, -34px, 0) scale(0.93) rotate(1.8deg);
    }
    24% {
        opacity: 1;
        transform: translate3d(-20px, 18px, 0) scale(1.035) rotate(-1.1deg);
    }
    58% {
        opacity: 0.76;
        transform: translate3d(10px, -6px, 0) scale(0.985) rotate(0.5deg);
    }
    82% {
        opacity: 0.32;
        transform: translate3d(-26px, 26px, 0) scale(0.95) rotate(-1.3deg);
    }
}
@keyframes pxKineticPhotoC {
    0%,
    100% {
        opacity: 0.18;
        transform: translate3d(-26px, -28px, 0) scale(0.91) rotate(-1.5deg);
    }
    28% {
        opacity: 1;
        transform: translate3d(24px, 14px, 0) scale(1.025) rotate(0.9deg);
    }
    60% {
        opacity: 0.7;
        transform: translate3d(-12px, -8px, 0) scale(0.99) rotate(-0.4deg);
    }
    84% {
        opacity: 0.3;
        transform: translate3d(18px, 30px, 0) scale(0.95) rotate(1.2deg);
    }
}
@keyframes pxKineticPhotoD {
    0%,
    100% {
        opacity: 0.2;
        transform: translate3d(24px, 36px, 0) scale(0.92) rotate(1.4deg);
    }
    22% {
        opacity: 1;
        transform: translate3d(-18px, -16px, 0) scale(1.03) rotate(-0.8deg);
    }
    54% {
        opacity: 0.8;
        transform: translate3d(8px, 8px, 0) scale(0.985) rotate(0.6deg);
    }
    79% {
        opacity: 0.34;
        transform: translate3d(-24px, -26px, 0) scale(0.95) rotate(-1.4deg);
    }
}

@keyframes pxKineticDriftA {
    from {
        transform: translate3d(-18px, -10px, 0) rotate(-3deg);
    }
    to {
        transform: translate3d(22px, 14px, 0) rotate(2deg);
    }
}
@keyframes pxKineticDriftB {
    from {
        transform: translate3d(16px, -14px, 0) rotate(2deg);
    }
    to {
        transform: translate3d(-20px, 18px, 0) rotate(-2deg);
    }
}
@keyframes pxKineticDriftC {
    from {
        transform: translate3d(-12px, 16px, 0) rotate(2deg);
    }
    to {
        transform: translate3d(20px, -18px, 0) rotate(-2deg);
    }
}
@keyframes pxKineticDriftD {
    from {
        transform: translate3d(14px, 12px, 0) rotate(-2deg);
    }
    to {
        transform: translate3d(-22px, -14px, 0) rotate(2deg);
    }
}

@keyframes pxKineticLineA {
    0%,
    100% {
        opacity: 0.35;
        transform: translate3d(-24px, 0, 0);
    }
    50% {
        opacity: 1;
        transform: translate3d(26px, -8px, 0);
    }
}
@keyframes pxKineticLineB {
    0%,
    100% {
        opacity: 0.35;
        transform: translate3d(24px, 0, 0);
    }
    50% {
        opacity: 1;
        transform: translate3d(-28px, 10px, 0);
    }
}

@keyframes pxKineticOrbitPulse {
    from {
        scale: 0.96;
        opacity: 0.45;
    }
    to {
        scale: 1.04;
        opacity: 0.9;
    }
}

@keyframes pxKineticDotA {
    from {
        transform: translate3d(-18px, -12px, 0) scale(0.7);
        opacity: 0.45;
    }
    to {
        transform: translate3d(18px, 14px, 0) scale(1.4);
        opacity: 1;
    }
}
@keyframes pxKineticDotB {
    from {
        transform: translate3d(14px, 16px, 0) scale(0.75);
        opacity: 0.4;
    }
    to {
        transform: translate3d(-20px, -14px, 0) scale(1.35);
        opacity: 1;
    }
}

/* v1.1.68 — continuous kinetic choreography */
.px-kinetic-word {
    display: flex;
    overflow: visible;
    animation: none;
}
.px-kinetic-word > span {
    display: inline-block;
    opacity: 0;
    will-change: transform, opacity;
}
.px-kinetic-word-build > span {
    animation: pxBuildLetter 6.8s cubic-bezier(0.22, 0.75, 0.22, 1) infinite both;
    animation-delay: calc(var(--i) * 0.14s);
}
.px-kinetic-word-better > span {
    animation: pxBetterLetter 7.2s cubic-bezier(0.22, 0.75, 0.22, 1) infinite both;
    animation-delay: calc(1.15s + var(--i) * 0.13s);
}
@keyframes pxBuildLetter {
    0%,
    5% {
        opacity: 0;
        transform: translate3d(-72vw, -10vh, 0) rotate(-14deg) scale(0.82);
    }
    17%,
    52% {
        opacity: 1;
        transform: none;
    }
    61% {
        opacity: 1;
        transform: translateX(4vw);
    }
    76%,
    100% {
        opacity: 0;
        transform: translate3d(115vw, 5vh, 0) rotate(10deg) scale(0.94);
    }
}
@keyframes pxBetterLetter {
    0%,
    7% {
        opacity: 0;
        transform: translate3d(-115vw, 8vh, 0) rotate(12deg) scale(0.82);
    }
    20%,
    54% {
        opacity: 1;
        transform: none;
    }
    63% {
        opacity: 1;
        transform: translateX(-4vw);
    }
    78%,
    100% {
        opacity: 0;
        transform: translate3d(-115vw, -5vh, 0) rotate(-10deg) scale(0.94);
    }
}
.px-kinetic-photo-a {
    animation: pxSweepA 6.4s cubic-bezier(0.35, 0.7, 0.2, 1) infinite both;
}
.px-kinetic-photo-b {
    animation: pxSweepB 7.1s cubic-bezier(0.35, 0.7, 0.2, 1) -1.7s infinite both;
}
.px-kinetic-photo-c {
    animation: pxSweepC 6.8s cubic-bezier(0.35, 0.7, 0.2, 1) -3.2s infinite both;
}
.px-kinetic-photo-d {
    animation: pxSweepD 7.5s cubic-bezier(0.35, 0.7, 0.2, 1) -4.8s infinite both;
}
@keyframes pxSweepA {
    0%,
    8% {
        opacity: 0;
        transform: translate3d(-120vw, -18vh, 0) rotate(-7deg) scale(0.88);
    }
    24%,
    55% {
        opacity: 1;
        transform: none;
    }
    72%,
    100% {
        opacity: 0;
        transform: translate3d(120vw, 14vh, 0) rotate(7deg) scale(0.94);
    }
}
@keyframes pxSweepB {
    0%,
    8% {
        opacity: 0;
        transform: translate3d(115vw, -12vh, 0) rotate(8deg) scale(0.9);
    }
    23%,
    54% {
        opacity: 1;
        transform: none;
    }
    73%,
    100% {
        opacity: 0;
        transform: translate3d(-115vw, 16vh, 0) rotate(-8deg) scale(0.94);
    }
}
@keyframes pxSweepC {
    0%,
    8% {
        opacity: 0;
        transform: translate3d(-110vw, 20vh, 0) rotate(6deg) scale(0.9);
    }
    25%,
    57% {
        opacity: 1;
        transform: none;
    }
    75%,
    100% {
        opacity: 0;
        transform: translate3d(118vw, -18vh, 0) rotate(-7deg) scale(0.94);
    }
}
@keyframes pxSweepD {
    0%,
    8% {
        opacity: 0;
        transform: translate3d(112vw, 18vh, 0) rotate(-7deg) scale(0.9);
    }
    24%,
    56% {
        opacity: 1;
        transform: none;
    }
    74%,
    100% {
        opacity: 0;
        transform: translate3d(-118vw, -16vh, 0) rotate(7deg) scale(0.94);
    }
}
.px-kinetic-pill-green,
.px-kinetic-line-one {
    animation: pxRunA 4.8s ease-in-out infinite;
}
.px-kinetic-pill-blue,
.px-kinetic-line-two {
    animation: pxRunB 5.1s ease-in-out infinite;
}
.px-kinetic-pill-orange {
    animation: pxRunA 5.3s -1.4s ease-in-out infinite;
}
.px-kinetic-pill-pink {
    animation: pxRunB 5.5s -2.2s ease-in-out infinite;
}
@keyframes pxRunA {
    0%,
    100% {
        transform: translate3d(-9vw, -8px, 0);
        opacity: 0.25;
    }
    50% {
        transform: translate3d(8vw, 10px, 0);
        opacity: 1;
    }
}
@keyframes pxRunB {
    0%,
    100% {
        transform: translate3d(10vw, -9px, 0);
        opacity: 0.25;
    }
    50% {
        transform: translate3d(-9vw, 11px, 0);
        opacity: 1;
    }
}
.px-kinetic-ring-copy {
    position: absolute;
    z-index: 8;
    width: clamp(130px, 15vw, 220px);
    aspect-ratio: 1;
    right: 23%;
    top: 31%;
    pointer-events: none;
    animation: pxRingSpin 7s linear infinite;
}
.px-kinetic-ring-copy svg {
    display: block;
    width: 100%;
    height: 100%;
    overflow: visible;
}
.px-kinetic-ring-copy text {
    fill: #ffe66d;
    font-size: calc((15px) + 1px);
    font-weight: 800;
    letter-spacing: 2.2px;
}
@keyframes pxRingSpin {
    to {
        transform: rotate(360deg);
    }
}
.px-kinetic-marquee {
    position: absolute;
    z-index: 10;
    left: 0;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    pointer-events: none;
    border-top: 1px solid rgba(255, 255, 255, 0.18);
    border-bottom: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(5, 5, 5, 0.72);
}
.px-kinetic-marquee-top {
    top: 0;
}
.px-kinetic-marquee-bottom {
    bottom: 0;
}
.px-kinetic-track {
    display: flex;
    width: max-content;
    will-change: transform;
}
.px-kinetic-track span {
    flex: none;
    padding: 10px 0;
    font-size: calc((clamp(12px, 1.15vw, 16px)) + 1px);
    font-weight: 800;
    letter-spacing: 0.06em;
}
.px-kinetic-marquee-top .px-kinetic-track {
    animation: pxQuoteRight 15s linear infinite;
    color: #fff;
}
.px-kinetic-marquee-bottom .px-kinetic-track {
    animation: pxQuoteLeft 16s linear infinite;
    color: #7cff6b;
}
@keyframes pxQuoteLeft {
    to {
        transform: translateX(-50%);
    }
}
@keyframes pxQuoteRight {
    from {
        transform: translateX(-50%);
    }
    to {
        transform: translateX(0);
    }
}
@media (max-width: 620px) {
    .px-kinetic-ring-copy {
        right: 4%;
        top: 29%;
        width: 120px;
    }
    .px-kinetic-track span {
        padding: 8px 0;
        font-size: calc((10px) + 1px);
    }
}

/* v1.1.68 — refined kinetic timing + fragmented photo transitions */

/* Circular copy is intentionally calm and comfortable. */
.px-kinetic-ring-copy {
    animation-duration: 18s;
}

/* BUILD/BETTER: entrance stays lively; exit is slower and clearly letter-by-letter. */
.px-kinetic-word-build > span {
    animation: pxBuildLetter77 9.4s cubic-bezier(0.22, 0.75, 0.22, 1) infinite both;
    animation-delay: calc(var(--i) * 0.16s);
}
.px-kinetic-word-better > span {
    animation: pxBetterLetter77 9.8s cubic-bezier(0.22, 0.75, 0.22, 1) infinite both;
    animation-delay: calc(0.9s + var(--i) * 0.16s);
}
@keyframes pxBuildLetter77 {
    0%,
    5% {
        opacity: 0;
        transform: translate3d(-72vw, -8vh, 0) rotate(-12deg) scale(0.84);
    }
    16%,
    50% {
        opacity: 1;
        transform: translate3d(0, 0, 0) rotate(0) scale(1);
    }
    58% {
        opacity: 1;
        transform: translate3d(3vw, 0, 0);
    }
    78%,
    100% {
        opacity: 0;
        transform: translate3d(115vw, 4vh, 0) rotate(8deg) scale(0.95);
    }
}
@keyframes pxBetterLetter77 {
    0%,
    6% {
        opacity: 0;
        transform: translate3d(-115vw, 7vh, 0) rotate(10deg) scale(0.84);
    }
    17%,
    51% {
        opacity: 1;
        transform: translate3d(0, 0, 0) rotate(0) scale(1);
    }
    59% {
        opacity: 1;
        transform: translate3d(-3vw, 0, 0);
    }
    79%,
    100% {
        opacity: 0;
        transform: translate3d(-115vw, -4vh, 0) rotate(-8deg) scale(0.95);
    }
}

/* Container remains in place; the image itself is assembled from five pieces. */
.px-kinetic-photo-a,
.px-kinetic-photo-b,
.px-kinetic-photo-c,
.px-kinetic-photo-d {
    animation: none;
    opacity: 1;
    transform: none;
    overflow: visible;
    background: transparent;
}
.px-photo-fragments {
    position: absolute;
    inset: 0;
    overflow: visible;
}
.px-photo-piece {
    position: absolute;
    display: block;
    background-repeat: no-repeat;
    background-size: 100% 500%;
    opacity: 0;
    will-change: transform, opacity, filter, clip-path;
}

/* PHOTO A — five horizontal slices assemble top-to-bottom. */
.px-kinetic-photo-a .px-photo-piece {
    left: 0;
    width: 100%;
    height: 20%;
    top: calc(var(--piece) * 20%);
    background-position: center calc(var(--piece) * 25%);
    animation: pxSliceAssemble 8.4s cubic-bezier(0.25, 0.75, 0.2, 1) infinite both;
    animation-delay: calc(var(--piece) * 0.14s);
}
@keyframes pxSliceAssemble {
    0%,
    7% {
        opacity: 0;
        transform: translate3d(calc((var(--piece) - 2) * 10vw), -32vh, 0)
            rotate(calc((var(--piece) - 2) * 1.5deg));
        filter: blur(7px);
    }
    22%,
    57% {
        opacity: 1;
        transform: none;
        filter: blur(0);
    }
    68% {
        opacity: 0.9;
        transform: scaleX(0.995);
    }
    86%,
    100% {
        opacity: 0;
        transform: translate3d(calc((var(--piece) - 2) * 16vw), 18vh, 0) scale(0.72);
        filter: blur(13px);
    }
}

/* PHOTO B — irregular puzzle-like pieces arrive from four directions. */
.px-kinetic-photo-b .px-photo-piece {
    background-size: 200% 300%;
    animation: pxPuzzleAssemble 9s cubic-bezier(0.3, 0.75, 0.2, 1) infinite both;
    animation-delay: calc(var(--piece) * 0.17s);
}
.px-kinetic-photo-b .px-photo-piece-0 {
    left: 0;
    top: 0;
    width: 52%;
    height: 36%;
    background-position: 0 0;
    clip-path: polygon(0 0, 100% 0, 100% 72%, 82% 72%, 82% 100%, 54% 100%, 54% 82%, 0 82%);
}
.px-kinetic-photo-b .px-photo-piece-1 {
    right: 0;
    top: 0;
    width: 52%;
    height: 52%;
    background-position: 100% 0;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 36% 100%, 36% 78%, 0 78%, 0 44%, 18% 44%, 18% 22%, 0 22%);
}
.px-kinetic-photo-b .px-photo-piece-2 {
    left: 0;
    top: 31%;
    width: 55%;
    height: 42%;
    background-position: 0 50%;
    clip-path: polygon(0 0, 65% 0, 65% 18%, 100% 18%, 100% 78%, 76% 78%, 76% 100%, 0 100%);
}
.px-kinetic-photo-b .px-photo-piece-3 {
    right: 0;
    top: 48%;
    width: 58%;
    height: 52%;
    background-position: 100% 100%;
    clip-path: polygon(22% 0, 100% 0, 100% 100%, 0 100%, 0 35%, 22% 35%);
}
.px-kinetic-photo-b .px-photo-piece-4 {
    left: 0;
    bottom: 0;
    width: 48%;
    height: 32%;
    background-position: 0 100%;
    clip-path: polygon(0 0, 72% 0, 72% 18%, 100% 18%, 100% 100%, 0 100%);
}
@keyframes pxPuzzleAssemble {
    0%,
    6% {
        opacity: 0;
        transform: translate3d(calc((var(--piece) - 2) * 34vw), calc((2 - var(--piece)) * 20vh), 0)
            rotate(calc((var(--piece) - 2) * 7deg)) scale(0.8);
        filter: blur(5px);
    }
    24%,
    59% {
        opacity: 1;
        transform: none;
        filter: blur(0);
    }
    72% {
        opacity: 0.82;
        transform: scale(0.99);
    }
    88%,
    100% {
        opacity: 0;
        transform: translate3d(calc((2 - var(--piece)) * 10vw), calc((var(--piece) - 2) * 10vh), 0)
            scale(0.35);
        filter: blur(16px);
    }
}

/* PHOTO C — five vertical shutters arrive one after another. */
.px-kinetic-photo-c .px-photo-piece {
    top: 0;
    height: 100%;
    width: 20%;
    left: calc(var(--piece) * 20%);
    background-size: 500% 100%;
    background-position: calc(var(--piece) * 25%) center;
    animation: pxShutterAssemble 8.8s cubic-bezier(0.25, 0.75, 0.2, 1) infinite both;
    animation-delay: calc(var(--piece) * 0.13s);
}
@keyframes pxShutterAssemble {
    0%,
    7% {
        opacity: 0;
        transform: translate3d(0, calc((var(--piece) - 2) * 24vh), 0) rotateY(70deg);
    }
    23%,
    58% {
        opacity: 1;
        transform: none;
    }
    72% {
        opacity: 0.85;
    }
    89%,
    100% {
        opacity: 0;
        transform: translate3d(calc((var(--piece) - 2) * 12vw), -12vh, 0) scale(0.45);
        filter: blur(14px);
    }
}

/* PHOTO D — staggered mosaic fragments with a softer dissolve-out. */
.px-kinetic-photo-d .px-photo-piece {
    width: 52%;
    height: 52%;
    background-size: 200% 200%;
    animation: pxMosaicAssemble 9.3s cubic-bezier(0.3, 0.75, 0.2, 1) infinite both;
    animation-delay: calc(var(--piece) * 0.15s);
}
.px-kinetic-photo-d .px-photo-piece-0 {
    left: 0;
    top: 0;
    background-position: 0 0;
}
.px-kinetic-photo-d .px-photo-piece-1 {
    right: 0;
    top: 0;
    background-position: 100% 0;
}
.px-kinetic-photo-d .px-photo-piece-2 {
    left: 24%;
    top: 24%;
    background-position: 50% 50%;
    z-index: 2;
}
.px-kinetic-photo-d .px-photo-piece-3 {
    left: 0;
    bottom: 0;
    background-position: 0 100%;
}
.px-kinetic-photo-d .px-photo-piece-4 {
    right: 0;
    bottom: 0;
    background-position: 100% 100%;
}
@keyframes pxMosaicAssemble {
    0%,
    6% {
        opacity: 0;
        transform: translate3d(calc((var(--piece) - 2) * 26vw), calc((var(--piece) - 2) * -15vh), 0)
            rotate(calc((var(--piece) - 2) * 6deg)) scale(0.72);
    }
    24%,
    60% {
        opacity: 1;
        transform: none;
        filter: blur(0);
    }
    74% {
        opacity: 0.7;
        transform: scale(0.94);
    }
    90%,
    100% {
        opacity: 0;
        transform: translate3d(calc((var(--piece) - 2) * 7vw), calc((var(--piece) - 2) * 6vh), 0) scale(0.18);
        filter: blur(18px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .px-photo-piece {
        animation: none;
        opacity: 1;
        transform: none;
        filter: none;
    }
}

/* v1.1.68 — cinematic fast-cut technology advertisement hero */
.px-tech-ad-hero {
    position: relative;
    min-height: clamp(650px, 92vh, 980px);
    overflow: hidden;
    background: #020202;
    color: #fff;
    isolation: isolate;
}
.px-tech-ad-media,
.px-tech-ad-clip,
.px-tech-ad-flash,
.px-tech-ad-grid {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}
.px-tech-ad-media {
    z-index: 0;
    background: #000;
}
.px-tech-ad-clip {
    object-fit: cover;
    opacity: 0;
    transform: scale(1.08);
    filter: contrast(1.08) saturate(1.04);
    transition:
        opacity 0.22s linear,
        transform 2.2s cubic-bezier(0.2, 0.7, 0.2, 1);
}
.px-tech-ad-clip.is-active {
    opacity: 1;
    transform: scale(1);
}
.px-tech-ad-clip.is-leaving {
    opacity: 0;
    transform: scale(1.05);
}
.px-tech-ad-flash {
    z-index: 2;
    pointer-events: none;
    background: #fff;
    opacity: 0;
    mix-blend-mode: screen;
}
.px-tech-ad-flash.is-flashing {
    animation: pxTechFlash 0.24s ease-out;
}
@keyframes pxTechFlash {
    0% {
        opacity: 0;
    }
    30% {
        opacity: 0.28;
    }
    100% {
        opacity: 0;
    }
}
.px-tech-ad-grid {
    z-index: 3;
    pointer-events: none;
    opacity: 0.13;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.12) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.1) 1px, transparent 1px);
    background-size: 72px 72px;
    mask-image: linear-gradient(to bottom, transparent 0, #000 25%, #000 80%, transparent 100%);
}
.px-tech-ad-hero:after {
    content: "";
    position: absolute;
    z-index: 4;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(90deg, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0.24) 54%, rgba(0, 0, 0, 0.5) 100%),
        linear-gradient(0deg, rgba(0, 0, 0, 0.62), transparent 50%);
}
.px-tech-ad-copy {
    position: absolute;
    z-index: 6;
    left: max(32px, 6vw);
    right: max(32px, 6vw);
    top: 50%;
    transform: translateY(-47%);
    max-width: 1100px;
}
.px-tech-kicker {
    font-size: calc((clamp(11px, 1vw, 14px)) + 1px);
    font-weight: 800;
    letter-spacing: 0.18em;
    margin-bottom: 18px;
    animation: pxTechKicker 5.6s ease-in-out infinite;
}
.px-tech-title {
    display: flex;
    flex-wrap: wrap;
    gap: 0.08em 0.22em;
    font-weight: 900;
    font-size: calc((clamp(60px, 10vw, 150px)) + 1px);
    line-height: 0.79;
    letter-spacing: -0.07em;
    text-transform: uppercase;
}
.px-tech-title > span {
    display: inline-block;
    animation: pxTechTitleIn 5.6s cubic-bezier(0.2, 0.75, 0.2, 1) infinite both;
}
.px-tech-title .px-tech-title-future {
    color: #7cff6b;
    animation-delay: 0.12s;
}
.px-tech-title-alt {
    margin-top: 16px;
    font-size: calc((clamp(46px, 7.6vw, 112px)) + 1px);
}
.px-tech-title-alt > span:first-child {
    animation-delay: 0.3s;
}
.px-tech-title-alt > span:last-child {
    animation-delay: 0.42s;
}
.px-tech-outline {
    color: transparent;
    -webkit-text-stroke: 2px #fff;
    text-stroke: 2px #fff;
}
.px-tech-sub {
    margin: 26px 0 22px;
    font-size: calc((clamp(16px, 1.5vw, 22px)) + 1px);
    font-weight: 700;
    letter-spacing: 0.04em;
    color: #fff;
}
.px-tech-cta {
    display: inline-flex;
    position: relative;
    z-index: 7;
}
@keyframes pxTechTitleIn {
    0%,
    7% {
        opacity: 0;
        transform: translate3d(0, 70px, 0) skewY(5deg);
    }
    17%,
    68% {
        opacity: 1;
        transform: none;
    }
    78%,
    100% {
        opacity: 0;
        transform: translate3d(45px, -24px, 0) skewY(-2deg);
    }
}
@keyframes pxTechKicker {
    0%,
    10% {
        opacity: 0;
        letter-spacing: 0.32em;
    }
    20%,
    75% {
        opacity: 1;
        letter-spacing: 0.18em;
    }
    90%,
    100% {
        opacity: 0;
    }
}
.px-tech-ad-stamp {
    position: absolute;
    z-index: 7;
    right: 4vw;
    top: 17%;
    width: 150px;
    height: 150px;
    border: 1px solid rgba(255, 255, 255, 0.6);
    border-radius: 50%;
    display: grid;
    place-items: center;
    text-align: center;
    font-size: calc((12px) + 1px);
    font-weight: 800;
    letter-spacing: 0.15em;
    animation: pxTechStamp 12s linear infinite;
}
@keyframes pxTechStamp {
    to {
        transform: rotate(360deg);
    }
}
.px-tech-ad-index {
    position: absolute;
    z-index: 7;
    right: 4vw;
    bottom: 5%;
    display: flex;
    gap: 90px;
    font-size: calc((12px) + 1px);
    font-weight: 800;
    letter-spacing: 0.15em;
}
.px-tech-ad-index:before {
    content: "";
    position: absolute;
    left: 30px;
    right: 30px;
    top: 50%;
    height: 1px;
    background: rgba(255, 255, 255, 0.5);
}
@media (max-width: 620px) {
    .px-tech-ad-hero {
        min-height: 720px;
    }
    .px-tech-ad-copy {
        left: 16px;
        right: 16px;
        top: 49%;
    }
    .px-tech-title {
        font-size: calc((clamp(48px, 16vw, 76px)) + 1px);
        line-height: 0.84;
    }
    .px-tech-title-alt {
        font-size: calc((clamp(40px, 13vw, 64px)) + 1px);
    }
    .px-tech-ad-stamp {
        width: 100px;
        height: 100px;
        right: 16px;
        top: 14%;
        font-size: calc((9px) + 1px);
    }
    .px-tech-ad-index {
        right: 16px;
        bottom: 4%;
        gap: 55px;
    }
}
@media (prefers-reduced-motion: reduce) {
    .px-tech-ad-clip,
    .px-tech-title > span,
    .px-tech-kicker,
    .px-tech-ad-stamp {
        animation: none;
        transition: none;
    }
}

/* v1.1.68 — mobile hero headline: one line per headline */
@media (max-width: 620px) {
    .px-tech-ad-copy {
        left: 16px;
        right: 16px;
    }

    .px-tech-title {
        display: flex;
        flex-wrap: nowrap;
        align-items: baseline;
        width: 100%;
        gap: 0.18em;
        white-space: nowrap;
        font-size: calc((clamp(30px, 9.6vw, 44px)) + 1px);
        line-height: 0.9;
        letter-spacing: -0.065em;
    }

    .px-tech-title-alt {
        margin-top: 12px;
        font-size: calc((clamp(29px, 9.2vw, 42px)) + 1px);
    }

    .px-tech-title > span {
        flex: 0 0 auto;
        white-space: nowrap;
    }

    .px-tech-title-build,
    .px-tech-title-future,
    .px-tech-title-alt > span {
        white-space: nowrap;
    }
}

/* v1.1.68 — cinematic About section, visually connected to Hero */
.px-about-cinematic {
    position: relative;
    overflow: hidden;
    background: #050505;
    color: #fff;
    isolation: isolate;
    padding: clamp(80px, 10vw, 150px) 0;
}
.px-about-cinematic:before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 82% 32%, rgba(124, 255, 107, 0.09), transparent 28%),
        linear-gradient(180deg, #050505, #090909);
    z-index: -2;
}
.px-about-tech-grid {
    position: absolute;
    inset: 0;
    z-index: -1;
    opacity: 0.09;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.13) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.13) 1px, transparent 1px);
    background-size: 72px 72px;
    mask-image: linear-gradient(to bottom, transparent, #000 18%, #000 82%, transparent);
}
.px-about-cinematic-wrap {
    position: relative;
}
.px-about-cinematic-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid rgba(255, 255, 255, 0.28);
    padding-top: 14px;
    margin-bottom: clamp(38px, 5vw, 70px);
}
.px-about-cinematic .px-eyebrow {
    color: #7cff6b;
    font-size: calc((12px) + 1px);
    font-weight: 800;
    letter-spacing: 0.18em;
    margin: 0;
}
.px-about-counter {
    font-size: calc((11px) + 1px);
    font-weight: 800;
    letter-spacing: 0.16em;
    color: rgba(255, 255, 255, 0.58);
}
.px-about-cinematic-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(340px, 0.82fr);
    gap: clamp(48px, 8vw, 120px);
    align-items: center;
}
.px-about-cinematic-copy h2 {
    max-width: 760px;
    margin: 0;
    font-size: calc((clamp(46px, 6.2vw, 88px)) + 1px);
    line-height: 0.92;
    letter-spacing: -0.055em;
    color: #fff;
    text-transform: uppercase;
}
.px-about-cinematic .px-about-intro {
    max-width: 660px;
    margin: 30px 0 0;
    font-size: calc((clamp(15px, 1.25vw, 18px)) + 1px);
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.76);
}
.px-about-tech-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 28px;
}
.px-about-tech-tags span {
    border: 1px solid rgba(255, 255, 255, 0.28);
    padding: 7px 11px;
    font-size: calc((10px) + 1px);
    font-weight: 800;
    letter-spacing: 0.12em;
    color: #fff;
}
.px-about-cinematic-link {
    display: inline-flex;
    align-items: center;
    gap: 16px;
    margin-top: 34px;
    color: #7cff6b;
    font-weight: 800;
    text-decoration: none;
    border-bottom: 1px solid rgba(124, 255, 107, 0.55);
    padding-bottom: 8px;
}
.px-about-arrow {
    font-size: calc((21px) + 1px);
    transition: transform 0.25s ease;
}
.px-about-cinematic-link:hover .px-about-arrow {
    transform: translate(5px, -5px);
}
.px-about-cinematic-visual {
    position: relative;
    min-width: 0;
}
.px-about-frame {
    position: relative;
    aspect-ratio: 4/5;
    overflow: hidden;
    background: #111;
    clip-path: polygon(0 0, 92% 0, 100% 8%, 100% 100%, 8% 100%, 0 92%);
}
.px-about-frame img,
.px-about-frame video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: contrast(1.08) saturate(0.82);
    transform: scale(1.04);
    transition: transform 1.4s cubic-bezier(0.2, 0.7, 0.2, 1);
}
.px-about-cinematic.is-motion-visible .px-about-frame img,
.px-about-cinematic.is-motion-visible .px-about-frame video {
    transform: scale(1);
}
.px-about-frame:after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.38));
}
.px-about-scanline {
    position: absolute;
    z-index: 3;
    left: 0;
    right: 0;
    height: 1px;
    top: 10%;
    background: #7cff6b;
opacity: 0.7;
    animation: pxAboutScan 5.5s ease-in-out infinite;
}
@keyframes pxAboutScan {
    0%,
    100% {
        top: 8%;
        opacity: 0.15;
    }
    50% {
        top: 88%;
        opacity: 0.75;
    }
}
.px-about-frame-label {
    position: absolute;
    z-index: 4;
    left: 16px;
    bottom: 15px;
    font-size: calc((10px) + 1px);
    font-weight: 800;
    letter-spacing: 0.16em;
    color: #fff;
}
.px-about-orbit {
    position: absolute;
    right: -48px;
    top: -48px;
    width: 130px;
    height: 130px;
    border: 1px solid rgba(124, 255, 107, 0.55);
    border-radius: 50%;
    display: grid;
    place-items: center;
    color: #7cff6b;
    animation: pxAboutOrbit 16s linear infinite;
}
.px-about-orbit span {
    font-size: calc((9px) + 1px);
    font-weight: 800;
    letter-spacing: 0.12em;
    text-align: center;
    max-width: 86px;
}
@keyframes pxAboutOrbit {
    to {
        transform: rotate(360deg);
    }
}

/* Scroll both directions: elements leave softly and re-enter whenever section comes back into view. */
.px-about-cinematic [data-motion-item] {
    opacity: 0;
    transform: translate3d(0, 42px, 0);
    filter: blur(5px);
    transition:
        opacity 0.72s ease,
        transform 0.85s cubic-bezier(0.2, 0.75, 0.2, 1),
        filter 0.72s ease;
}
.px-about-cinematic .px-about-cinematic-visual[data-motion-item] {
    transform: translate3d(52px, 28px, 0) scale(0.96);
}
.px-about-cinematic.is-motion-visible [data-motion-item] {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    filter: blur(0);
}
.px-about-cinematic.is-motion-visible [data-motion-item]:nth-child(2) {
    transition-delay: 0.08s;
}
.px-about-cinematic.is-motion-visible [data-motion-item]:nth-child(3) {
    transition-delay: 0.16s;
}
.px-about-cinematic.is-motion-visible [data-motion-item]:nth-child(4) {
    transition-delay: 0.24s;
}

@media (max-width: 900px) {
    .px-about-cinematic-grid {
        grid-template-columns: 1fr;
        gap: 52px;
    }
    .px-about-cinematic-copy h2 {
        font-size: calc((clamp(40px, 8vw, 64px)) + 1px);
    }
    .px-about-cinematic-visual {
        width: min(78vw, 520px);
        margin-left: auto;
    }
}
@media (max-width: 620px) {
    .px-about-cinematic {
        padding: 72px 0;
    }
    .px-about-cinematic-head {
        margin-bottom: 34px;
    }
    .px-about-cinematic-grid {
        gap: 42px;
    }
    .px-about-cinematic-copy h2 {
        font-size: calc((clamp(34px, 10.5vw, 48px)) + 1px);
    }
    .px-about-cinematic .px-about-intro {
        margin-top: 22px;
        font-size: calc((14px) + 1px);
    }
    .px-about-cinematic-visual {
        width: 88%;
        margin: 0 0 0 auto;
    }
    .px-about-orbit {
        width: 94px;
        height: 94px;
        right: -22px;
        top: -28px;
    }
}
@media (prefers-reduced-motion: reduce) {
    .px-about-cinematic [data-motion-item] {
        opacity: 1;
        transform: none;
        filter: none;
        transition: none;
    }
    .px-about-scanline,
    .px-about-orbit {
        animation: none;
    }
}

/* v1.1.68 — unified cinematic/digital visual language across homepage sections */
.px-cinematic-section {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    background: #050505;
    color: #fff;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    padding-bottom: 18px;
}
.px-cinematic-section:before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    pointer-events: none;
    background:
        radial-gradient(circle at 84% 18%, rgba(124, 255, 107, 0.055), transparent 28%),
        radial-gradient(circle at 12% 88%, rgba(121, 167, 255, 0.045), transparent 24%), #050505;
}
.px-cinematic-section:after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    opacity: 0.055;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.12) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.12) 1px, transparent 1px);
    background-size: 72px 72px;
    mask-image: linear-gradient(to bottom, transparent, #000 16%, #000 84%, transparent);
}
.px-cinematic-section .px-eyebrow {
    color: #7cff6b;
    font-weight: 800;
    letter-spacing: 0.16em;
}
.px-cinematic-section h2,
.px-cinematic-section h3 {
    color: #fff;
}
.px-cinematic-section p {
    color: rgba(255, 255, 255, 0.72);
}
.px-cinematic-section a {
    transition:
        color 0.25s ease,
        transform 0.25s ease,
        border-color 0.25s ease;
}

/* WHY US — sharp editorial cards */
.px-cinematic-why {
    padding-block: clamp(82px, 9vw, 140px);
    min-height: auto;
    height: auto;
}
.px-cinematic-why .px-why-head {
    border-top: 1px solid rgba(255, 255, 255, 0.26);
    padding-top: 16px;
}
.px-cinematic-why .px-why-grid {
    gap: 1px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.12);
}
.px-cinematic-why .px-why-card {
    background: #080808;
    padding-bottom: 24px;
    overflow: hidden;
}
.px-cinematic-why .px-why-image {
    overflow: hidden;
}
.px-cinematic-why .px-why-image img {
    filter: saturate(0.75) contrast(1.08);
    transition:
        transform 0.8s cubic-bezier(0.2, 0.7, 0.2, 1),
        filter 0.5s ease;
}
.px-cinematic-why .px-why-card:hover .px-why-image img {
    transform: scale(1.045);
    filter: saturate(1) contrast(1.05);
}
.px-cinematic-why .px-why-card h3,
.px-cinematic-why .px-why-card p,
.px-cinematic-why .px-why-card .px-why-link {
    margin-left: 22px;
    margin-right: 22px;
}
.px-cinematic-why .px-why-link {
    color: #7cff6b;
}

/* PRODUCTS — dark tech catalog */
.px-cinematic-products {
    padding-block: clamp(82px, 9vw, 140px);
    min-height: auto;
    height: auto;
}
.px-cinematic-products .px-section-head {
    border-top: 1px solid rgba(255, 255, 255, 0.26);
    padding-top: 16px;
}
.px-cinematic-products .px-product-grid {
    gap: 1px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.12);
}
.px-cinematic-products .px-product-card {
    background: #080808;
}
.px-cinematic-products .px-product-image {
    overflow: hidden;
}
.px-cinematic-products .px-product-image img {
    filter: saturate(0.72) contrast(1.08);
    transition:
        transform 0.75s cubic-bezier(0.2, 0.7, 0.2, 1),
        filter 0.4s ease;
}
.px-cinematic-products .px-product-card:hover img {
    transform: scale(1.05);
    filter: saturate(1);
}
.px-cinematic-products .px-product-copy {
    background: linear-gradient(180deg, rgba(5, 5, 5, 0.25), #080808);
    color: #fff;
}
.px-cinematic-products .px-link {
    color: #7cff6b;
}

/* PERSUASION — retain content but remove the old light/polaroid feeling */
.px-cinematic-persuasion {
    padding-block: clamp(82px, 9vw, 140px);
    min-height: auto;
    height: auto;
}
.px-cinematic-persuasion .px-about-grid {
    border-top: 1px solid rgba(255, 255, 255, 0.26);
    padding-top: clamp(30px, 4vw, 56px);
}
.px-cinematic-persuasion .px-about-polaroid {
    background: #0b0b0b;
    border: 1px solid rgba(255, 255, 255, 0.14);
    padding: 0;
    transform: none;
}
.px-cinematic-persuasion .px-about-tape {
    display: none;
}
.px-cinematic-persuasion .px-about-image {
    clip-path: polygon(0 0, 94% 0, 100% 8%, 100% 100%, 6% 100%, 0 92%);
}
.px-cinematic-persuasion .px-about-image img,
.px-cinematic-persuasion .px-about-image video {
    filter: saturate(0.75) contrast(1.08);
}
.px-cinematic-persuasion .px-about-link {
    color: #7cff6b;
}

/* TESTIMONIALS — premium dark quote panels */
.px-cinematic-testimonials {
    padding-block: clamp(82px, 9vw, 140px);
    min-height: auto;
    height: auto;
}
.px-cinematic-testimonials .px-wrap {
    border-top: 1px solid rgba(255, 255, 255, 0.26);
    padding-top: 16px;
}
.px-cinematic-testimonials .px-testimonial-grid {
    gap: 1px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.12);
}
.px-cinematic-testimonials blockquote {
    margin: 0;
    background: #080808;
    border: 0;
    padding: clamp(24px, 3vw, 42px);
    position: relative;
}
.px-cinematic-testimonials blockquote:before {
    content: "“";
    position: absolute;
    right: 20px;
    top: 4px;
    font-size: calc((72px) + 1px);
    line-height: 1;
    color: rgba(124, 255, 107, 0.18);
    font-weight: 900;
}
.px-cinematic-testimonials blockquote footer {
    color: #7cff6b;
}

/* FAQ — clean technical rows */
.px-cinematic-faq {
    padding-block: clamp(82px, 9vw, 140px);
}
.px-cinematic-faq .px-wrap {
    border-top: 1px solid rgba(255, 255, 255, 0.26);
    padding-top: 16px;
}
.px-cinematic-faq .px-faq-list {
    border-top: 1px solid rgba(255, 255, 255, 0.14);
}
.px-cinematic-faq .px-faq-item {
    background: transparent;
    border: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 0;
}
.px-cinematic-faq .px-faq-item summary {
    color: #fff;
}
.px-cinematic-faq .px-faq-answer p {
    color: rgba(255, 255, 255, 0.7);
}

/* FINAL CTA — closes the page like the end-frame of the Hero */
.px-cinematic-final {
    min-height: clamp(460px, 58vw, 700px);
    display: grid;
    align-items: center;
    background: #050505;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.px-cinematic-final:before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: radial-gradient(circle at 72% 45%, rgba(124, 255, 107, 0.13), transparent 30%), #050505;
}
.px-cinematic-final .px-wrap {
    border-top: 1px solid rgba(255, 255, 255, 0.3);
    padding-top: 18px;
}
.px-cinematic-final h2 {
    color: #fff;
    max-width: 900px;
    letter-spacing: -0.045em;
}
.px-cinematic-final p {
    color: rgba(255, 255, 255, 0.72);
    max-width: 680px;
}
.px-cinematic-final .px-final-link {
    color: #7cff6b;
    border-color: rgba(124, 255, 107, 0.55);
}

/* Reusable bidirectional motion for every converted section. */
.px-cinematic-section [data-motion-item] {
    opacity: 0;
    transform: translate3d(0, 38px, 0);
    filter: blur(4px);
    transition:
        opacity 0.68s ease,
        transform 0.82s cubic-bezier(0.2, 0.75, 0.2, 1),
        filter 0.68s ease;
}
.px-cinematic-section.is-motion-visible [data-motion-item] {
    opacity: 1;
    transform: none;
    filter: blur(0);
}
.px-cinematic-section.is-motion-visible [data-motion-item]:nth-child(2) {
    transition-delay: 0.07s;
}
.px-cinematic-section.is-motion-visible [data-motion-item]:nth-child(3) {
    transition-delay: 0.14s;
}
.px-cinematic-section.is-motion-visible [data-motion-item]:nth-child(4) {
    transition-delay: 0.21s;
}

/* Keep the kinetic showcase as the high-energy interlude, but visually bridge it. */
.px-cinematic-kinetic {
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

@media (max-width: 620px) {
    .px-cinematic-section:after {
        background-size: 48px 48px;
    }
    .px-cinematic-why,
    .px-cinematic-products,
    .px-cinematic-persuasion,
    .px-cinematic-testimonials,
    .px-cinematic-faq {
        padding-block: 72px;
        min-height: auto;
        height: auto;
    }
    .px-cinematic-why .px-why-card h3,
    .px-cinematic-why .px-why-card p,
    .px-cinematic-why .px-why-card .px-why-link {
        margin-left: 16px;
        margin-right: 16px;
    }
    .px-cinematic-final {
        min-height: 520px;
    }
}
@media (prefers-reduced-motion: reduce) {
    .px-cinematic-section [data-motion-item] {
        opacity: 1;
        transform: none;
        filter: none;
        transition: none;
    }
}

/* v1.1.68 — unified UI details + Krafton-inspired Why Us structure */

/* One shared micro-UI language derived from the approved About section. */
.px-card-tech-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin: 18px 22px 0;
}
.px-card-tech-tags span,
.px-final-tech-tags span {
    display: inline-flex;
    border: 1px solid rgba(255, 255, 255, 0.28);
    padding: 6px 9px;
    font-size: calc((9px) + 1px);
    line-height: 1;
    font-weight: 800;
    letter-spacing: 0.12em;
    color: #fff;
}
.px-ui-text-link {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    color: #7cff6b;
    font-weight: 800;
    text-decoration: none;
    border-bottom: 1px solid rgba(124, 255, 107, 0.52);
    padding-bottom: 7px;
    width: max-content;
}
.px-ui-arrow {
    font-size: calc((18px) + 1px);
    line-height: 1;
    transition: transform 0.25s ease;
}
a.px-ui-text-link:hover .px-ui-arrow,
.px-product-card:hover .px-ui-arrow {
    transform: translate(4px, -4px);
}

/* WHY US: editorial, tall, left-aligned cards inspired by the supplied Krafton reference,
   while retaining this theme's own typography, colors, content and motion. */
.px-cinematic-why .px-why-head {
    text-align: left;
    max-width: 900px;
    margin-left: 0;
    margin-right: auto;
}
.px-cinematic-why .px-why-head h2,
.px-cinematic-why .px-why-head p {
    text-align: left;
    margin-left: 0;
}
.px-cinematic-why .px-why-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.18);
    margin-top: clamp(34px, 5vw, 64px);
}
.px-cinematic-why .px-why-card {
    min-height: clamp(540px, 55vw, 720px);
    display: flex;
    flex-direction: column;
    align-items: stretch;
    text-align: left;
    padding: 0 0 30px;
    border-right: 1px solid rgba(255, 255, 255, 0.15);
    background: #080808;
}
.px-cinematic-why .px-why-card:last-child {
    border-right: 0;
}
.px-cinematic-why .px-why-card:nth-child(2) {
    background: #f2f2f0;
    color: #050505;
}
.px-cinematic-why .px-why-card:nth-child(2) h3,
.px-cinematic-why .px-why-card:nth-child(2) p {
    color: #050505;
}
.px-cinematic-why .px-why-card:nth-child(2) .px-card-tech-tags span {
    color: #050505;
    border-color: rgba(5, 5, 5, 0.3);
}
.px-cinematic-why .px-why-image-link {
    display: block;
    width: 100%;
    padding: 0;
    margin: 0;
}
.px-cinematic-why .px-why-image {
    width: 100%;
    height: clamp(270px, 29vw, 400px);
    margin: 0;
    border-radius: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.18);
    background: #0b0b0b;
}
.px-cinematic-why .px-why-card:nth-child(2) .px-why-image {
    border-bottom-color: rgba(5, 5, 5, 0.18);
}
.px-cinematic-why .px-why-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.px-cinematic-why .px-why-card h3 {
    margin: 20px 22px 0;
    font-size: calc((clamp(25px, 2.3vw, 34px)) + 1px);
    line-height: 1.03;
    letter-spacing: -0.035em;
}
.px-cinematic-why .px-why-card p {
    margin: 15px 22px 0;
    line-height: 1.6;
    flex: 1;
}
.px-cinematic-why .px-why-link {
    margin: 24px 22px 0;
}
.px-cinematic-why .px-why-card:nth-child(2) .px-why-link {
    color: #050505;
    border-color: rgba(5, 5, 5, 0.5);
}

/* Products and persuasion now use the same tags + text-arrow CTA family. */
.px-cinematic-products .px-product-copy .px-card-tech-tags {
    margin: 16px 0 0;
}
.px-cinematic-products .px-product-copy .px-ui-text-link {
    margin-top: 18px;
}
.px-cinematic-persuasion .px-about-tech-tags {
    margin-top: 28px;
}
.px-final-tech-tags {
    margin-top: 28px;
}
.px-cinematic-final .px-final-link {
    margin-top: 28px;
}

@media (max-width: 900px) {
    .px-cinematic-why .px-why-grid {
        grid-template-columns: 1fr;
    }
    .px-cinematic-why .px-why-card {
        min-height: 0;
        border-right: 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    }
    .px-cinematic-why .px-why-card:last-child {
        border-bottom: 0;
    }
    .px-cinematic-why .px-why-image {
        height: clamp(280px, 62vw, 500px);
    }
}
@media (max-width: 620px) {
    .px-card-tech-tags {
        margin-left: 16px;
        margin-right: 16px;
    }
    .px-cinematic-why .px-why-card h3,
    .px-cinematic-why .px-why-card p,
    .px-cinematic-why .px-why-link {
        margin-left: 16px;
        margin-right: 16px;
    }
    .px-cinematic-why .px-why-image {
        height: 72vw;
    }
}

/* v1.1.68 — Why Us cleanup + left-aligned final section */
.px-cinematic-why .px-why-card {
    justify-content: flex-start;
}
.px-cinematic-why .px-why-card p {
    flex: 0 0 auto;
    margin-bottom: 28px;
}

/* "MULAI DARI SINI" / final CTA: deliberate left editorial composition */
.px-cinematic-final {
    text-align: left;
    min-height: auto;
    height: auto;
}
.px-cinematic-final .px-wrap {
    width: min(calc(100% - 64px), var(--px-max));
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}
.px-cinematic-final .px-eyebrow,
.px-cinematic-final h2,
.px-cinematic-final p,
.px-cinematic-final .px-final-tech-tags,
.px-cinematic-final .px-final-link {
    margin-left: 0;
    margin-right: 0;
    text-align: left;
}
.px-cinematic-final h2 {
    max-width: 820px;
    line-height: 0.94;
}
.px-cinematic-final p {
    max-width: 620px;
    line-height: 1.7;
}
.px-cinematic-final .px-final-tech-tags {
    display: flex;
    justify-content: flex-start;
}
@media (max-width: 900px) {
    .px-cinematic-final .px-wrap {
        width: min(calc(100% - 40px), var(--px-max));
    }
}
@media (max-width: 620px) {
    .px-cinematic-final .px-wrap {
        width: min(calc(100% - 32px), var(--px-max));
    }
}

/* v1.1.68 — full-width asymmetric portfolio mosaic below About */
.px-portfolio-mosaic {
    position: relative;
    width: 100%;
    overflow: hidden;
    background: #050505;
    color: #fff;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.px-portfolio-mosaic-head {
    min-height: 64px;
    padding: 0 max(16px, 2.2vw);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.13);
    background: #050505;
}
.px-portfolio-mosaic-kicker,
.px-portfolio-mosaic-index {
    font-size: calc((10px) + 1px);
    font-weight: 800;
    letter-spacing: 0.16em;
}
.px-portfolio-mosaic-kicker {
    color: #7cff6b;
}
.px-portfolio-mosaic-index {
    color: rgba(255, 255, 255, 0.52);
}

.px-portfolio-mosaic-grid {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    grid-auto-rows: clamp(90px, 8.5vw, 150px);
    grid-auto-flow: dense;
    gap: 2px;
    background: #050505;
}
.px-portfolio-tile {
    position: relative;
    overflow: hidden;
    background: #111;
    min-height: 0;
}
.px-portfolio-tile img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    filter: saturate(0.72) contrast(1.08);
    transform: scale(1.065);
    transition:
        transform 0.85s cubic-bezier(0.2, 0.75, 0.2, 1),
        filter 0.45s ease;
}
.px-portfolio-tile:hover img {
    transform: scale(1.085);
    filter: saturate(1) contrast(1.05);
}
.px-portfolio-shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.02) 35%, rgba(0, 0, 0, 0.68) 100%);
    transition: background 0.35s ease;
}
.px-portfolio-tile:hover .px-portfolio-shade {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.05) 20%, rgba(0, 0, 0, 0.76) 100%);
}

/* Deliberately irregular editorial mosaic — no equal card rhythm. */
.px-portfolio-tile-1 {
    grid-column: span 5;
    grid-row: span 3;
}
.px-portfolio-tile-2 {
    grid-column: span 3;
    grid-row: span 4;
}
.px-portfolio-tile-3 {
    grid-column: span 4;
    grid-row: span 2;
}
.px-portfolio-tile-4 {
    grid-column: span 4;
    grid-row: span 2;
}
.px-portfolio-tile-5 {
    grid-column: span 5;
    grid-row: span 2;
}
.px-portfolio-tile-6 {
    grid-column: span 3;
    grid-row: span 3;
}
.px-portfolio-tile-7 {
    grid-column: span 4;
    grid-row: span 3;
}
.px-portfolio-tile-8 {
    grid-column: span 5;
    grid-row: span 2;
}
.px-portfolio-tile-9 {
    grid-column: span 3;
    grid-row: span 2;
}
.px-portfolio-tile-10 {
    grid-column: span 4;
    grid-row: span 2;
}

.px-portfolio-label {
    position: absolute;
    z-index: 3;
    left: clamp(14px, 1.5vw, 24px);
    bottom: clamp(14px, 1.5vw, 22px);
    margin: 0;
    width: max-content;
    max-width: calc(100% - 28px);
    font-size: calc((clamp(16px, 1.65vw, 26px)) + 1px);
    line-height: 1;
    letter-spacing: -0.035em;
    text-transform: none;
    transition: transform 0.3s ease;
}
.px-portfolio-tile:hover .px-portfolio-label {
    transform: translateY(-4px);
}
.px-portfolio-label-tag {
    padding: 8px 11px;
    border: 1px solid rgba(255, 255, 255, 0.78);
    color: #fff;
    background: rgba(5, 5, 5, 0.22);
    backdrop-filter: blur(5px);
}
.px-portfolio-label-green {
    padding: 8px 11px;
    background: #7cff6b;
    color: #050505;
}
.px-portfolio-label-white {
    padding: 8px 11px;
    background: #fff;
    color: #050505;
}
.px-portfolio-label-line {
    color: #fff;
    border-bottom: 2px solid #7cff6b;
    padding-bottom: 5px;
}
.px-portfolio-label-blue {
    padding: 8px 11px;
    background: #79a7ff;
    color: #050505;
}

/* Uses the same two-way viewport motion language as About. */
.px-portfolio-mosaic [data-motion-item] {
    opacity: 0;
    transform: translate3d(0, 36px, 0) scale(0.985);
    filter: blur(4px);
    transition:
        opacity 0.62s ease,
        transform 0.78s cubic-bezier(0.2, 0.75, 0.2, 1),
        filter 0.62s ease;
}
.px-portfolio-mosaic.is-motion-visible [data-motion-item] {
    opacity: 1;
    transform: none;
    filter: blur(0);
}
.px-portfolio-mosaic.is-motion-visible .px-portfolio-tile:nth-child(2) {
    transition-delay: 0.04s;
}
.px-portfolio-mosaic.is-motion-visible .px-portfolio-tile:nth-child(3) {
    transition-delay: 0.08s;
}
.px-portfolio-mosaic.is-motion-visible .px-portfolio-tile:nth-child(4) {
    transition-delay: 0.12s;
}
.px-portfolio-mosaic.is-motion-visible .px-portfolio-tile:nth-child(5) {
    transition-delay: 0.16s;
}

@media (max-width: 900px) {
    .px-portfolio-mosaic-grid {
        grid-template-columns: repeat(6, minmax(0, 1fr));
        grid-auto-rows: 110px;
    }
    .px-portfolio-tile-1 {
        grid-column: span 4;
        grid-row: span 3;
    }
    .px-portfolio-tile-2 {
        grid-column: span 2;
        grid-row: span 3;
    }
    .px-portfolio-tile-3 {
        grid-column: span 3;
        grid-row: span 2;
    }
    .px-portfolio-tile-4 {
        grid-column: span 3;
        grid-row: span 2;
    }
    .px-portfolio-tile-5 {
        grid-column: span 4;
        grid-row: span 2;
    }
    .px-portfolio-tile-6 {
        grid-column: span 2;
        grid-row: span 3;
    }
    .px-portfolio-tile-7 {
        grid-column: span 4;
        grid-row: span 3;
    }
    .px-portfolio-tile-8 {
        grid-column: span 3;
        grid-row: span 2;
    }
    .px-portfolio-tile-9 {
        grid-column: span 3;
        grid-row: span 2;
    }
    .px-portfolio-tile-10 {
        grid-column: span 6;
        grid-row: span 2;
    }
}
@media (max-width: 620px) {
    .px-portfolio-mosaic-head {
        min-height: 56px;
    }
    .px-portfolio-mosaic-index {
        display: none;
    }
    .px-portfolio-mosaic-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-auto-rows: 128px;
    }
    .px-portfolio-tile-1 {
        grid-column: span 2;
        grid-row: span 2;
    }
    .px-portfolio-tile-2 {
        grid-column: span 1;
        grid-row: span 2;
    }
    .px-portfolio-tile-3 {
        grid-column: span 1;
        grid-row: span 1;
    }
    .px-portfolio-tile-4 {
        grid-column: span 1;
        grid-row: span 1;
    }
    .px-portfolio-tile-5 {
        grid-column: span 2;
        grid-row: span 2;
    }
    .px-portfolio-tile-6 {
        grid-column: span 1;
        grid-row: span 2;
    }
    .px-portfolio-tile-7 {
        grid-column: span 1;
        grid-row: span 2;
    }
    .px-portfolio-tile-8 {
        grid-column: span 2;
        grid-row: span 1;
    }
    .px-portfolio-tile-9 {
        grid-column: span 1;
        grid-row: span 1;
    }
    .px-portfolio-tile-10 {
        grid-column: span 1;
        grid-row: span 1;
    }
    .px-portfolio-label {
        font-size: calc((15px) + 1px);
    }
}
@media (prefers-reduced-motion: reduce) {
    .px-portfolio-mosaic [data-motion-item] {
        opacity: 1;
        transform: none;
        filter: none;
        transition: none;
    }
}

/* v1.1.68 — About image is intentionally shorter */
.px-about-cinematic .px-about-cinematic-visual {
    align-self: center;
}
.px-about-cinematic .px-about-frame {
    aspect-ratio: auto;
    height: clamp(360px, 38vw, 520px);
}
@media (max-width: 900px) {
    .px-about-cinematic .px-about-frame {
        height: clamp(340px, 58vw, 460px);
    }
}
@media (max-width: 620px) {
    .px-about-cinematic .px-about-frame {
        height: 340px;
    }
}

/* v1.1.68 — Why Us: image-free editorial icon cards */
.px-cinematic-why .px-why-card {
    min-height: 460px;
}
.px-cinematic-why .px-why-icon-stage {
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 34px 28px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.16);
    background: linear-gradient(135deg, rgba(124, 255, 107, 0.05), transparent 48%), #080808;
}
.px-cinematic-why .px-why-icon-stage svg {
    width: 112px;
    height: 112px;
    fill: none;
    stroke: #7cff6b;
    stroke-width: 1.35;
    stroke-linecap: square;
    stroke-linejoin: miter;
}
.px-cinematic-why .px-why-card:nth-child(2) .px-why-icon-stage {
    background: #f2f2f0;
    border-bottom-color: rgba(5, 5, 5, 0.18);
}
.px-cinematic-why .px-why-card:nth-child(2) .px-why-icon-stage svg {
    stroke: #050505;
}
@media (max-width: 620px) {
    .px-cinematic-why .px-why-icon-stage {
        height: 170px;
        padding: 26px 16px;
    }
    .px-cinematic-why .px-why-icon-stage svg {
        width: 88px;
        height: 88px;
    }
}

/* v1.1.68 — center the final portfolio row */
@media (min-width: 901px) {
    .px-portfolio-mosaic-grid {
        grid-auto-flow: row;
    }
    .px-portfolio-tile-9 {
        grid-column: 3 / span 3;
        grid-row: auto;
    }
    .px-portfolio-tile-10 {
        grid-column: 5 / span 4;
        grid-row: auto;
    }
}

/* v1.1.68 — About Us: true full-bleed right visual + compact header rhythm */
.px-about-cinematic .px-about-cinematic-copy h2 {
    margin: 0 0 clamp(18px, 2vw, 28px);
}
.px-about-cinematic .px-about-intro {
    margin-top: 0;
}
.px-about-action-row {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
    margin-top: 34px;
}
.px-about-action-row .px-about-cinematic-link {
    margin-top: 0;
    flex: 0 0 auto;
}
.px-about-copy-orbit {
    flex: 0 0 auto;
    pointer-events: none;
}
.px-about-copy-orbit .px-about-orbit {
    position: relative;
    inset: auto;
}

@media (min-width: 901px) {
    .px-about-cinematic {
        padding: 0;
        min-height: 700px;
        overflow: hidden;
    }
    .px-about-cinematic .px-about-cinematic-wrap {
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 0;
        min-height: 700px;
        position: relative;
    }
    /* Section label sits close to the title and overlays the full-bleed image on the right. */
    .px-about-cinematic .px-about-cinematic-head {
        position: absolute;
        z-index: 8;
        top: 28px;
        left: max(32px, calc((100vw - var(--px-max)) / 2));
        right: max(32px, calc((100vw - var(--px-max)) / 2));
        margin: 0;
        padding-top: 12px;
    }
    .px-about-cinematic .px-about-cinematic-grid {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(420px, 0.92fr);
        gap: clamp(42px, 6vw, 92px);
        align-items: stretch;
        min-height: 700px;
    }
    .px-about-cinematic .px-about-cinematic-copy {
        align-self: center;
        padding: 108px 0 54px max(32px, calc((100vw - var(--px-max)) / 2));
        min-width: 0;
    }
    .px-about-cinematic .px-about-cinematic-visual {
        width: 100%;
        height: 700px;
        min-height: 700px;
        margin: 0;
        align-self: stretch;
    }
    .px-about-cinematic .px-about-frame {
        width: 100%;
        height: 100%;
        min-height: 700px;
        aspect-ratio: auto;
        clip-path: none;
        border: 0;
    }
    .px-about-cinematic .px-about-frame img,
    .px-about-cinematic .px-about-frame video {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    .px-about-frame-label {
        left: 18px;
        bottom: 18px;
    }
    .px-about-action-row {
        max-width: 660px;
    }
    .px-about-copy-orbit .px-about-orbit {
        width: 118px;
        height: 118px;
    }
}

@media (max-width: 900px) {
    .px-about-action-row {
        align-items: flex-end;
    }
    .px-about-copy-orbit .px-about-orbit {
        width: 104px;
        height: 104px;
    }
}
@media (max-width: 620px) {
    .px-about-action-row {
        gap: 18px;
        margin-top: 28px;
    }
    .px-about-copy-orbit .px-about-orbit {
        width: 88px;
        height: 88px;
    }
}

/* v1.1.68 — About Us correction: CTA/orbit up + image reaches exact bottom divider */
@media (min-width: 901px) {
    .px-about-cinematic {
        position: relative;
        min-height: 700px;
        padding: 48px 0 18px;
        min-height: auto;
        height: auto;
    }
    .px-about-cinematic .px-about-cinematic-wrap {
        position: relative;
        min-height: 700px;
    }
    .px-about-cinematic .px-about-cinematic-grid {
        position: relative;
        min-height: 700px;
        grid-template-columns: minmax(0, 54%) minmax(0, 46%);
    }
    .px-about-cinematic .px-about-cinematic-copy {
        grid-column: 1;
        position: relative;
        z-index: 3;
        padding-top: 92px;
        padding-bottom: 42px;
    }
    .px-about-action-row {
        margin-top: 18px;
        align-items: flex-end;
        justify-content: space-between;
    }
    .px-about-action-row .px-about-cinematic-link {
        margin-top: 0;
        align-self: flex-end;
    }
    .px-about-copy-orbit {
        align-self: flex-end;
        margin: 0;
        padding: 0;
    }
    .px-about-copy-orbit .px-about-orbit {
        width: 118px;
        height: 118px;
        margin: 0;
    }
    .px-about-cinematic .px-about-cinematic-visual {
        position: absolute;
        z-index: 1;
        top: 0;
        right: 0;
        bottom: 0;
        width: 46%;
        height: auto;
        min-height: 0;
        margin: 0;
    }
    .px-about-cinematic .px-about-frame {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        min-height: 0;
        margin: 0;
    }
    .px-about-cinematic .px-about-frame img,
    .px-about-cinematic .px-about-frame video {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    .px-about-cinematic .px-about-cinematic-head {
        z-index: 9;
    }
}

/* v1.1.68 — asymmetric 3-card quote grid directly below Hero */
.px-hero-quote-grid {
    width: 100%;
    margin: 0;
    padding: 0;
    background: #050505;
    overflow: hidden;
}
.px-hero-quote-grid-inner {
    display: grid;
    grid-template-columns: minmax(0, 39fr) minmax(0, 61fr);
    grid-template-rows: clamp(250px, 28vw, 430px) clamp(250px, 28vw, 430px);
    width: 100%;
    gap: 0;
}
.px-hero-quote-card {
    position: relative;
    min-width: 0;
    overflow: hidden;
    margin: 0;
    border: 0;
}
.px-hero-quote-card-1 {
    grid-column: 1;
    grid-row: 1;
}
.px-hero-quote-card-2 {
    grid-column: 2;
    grid-row: 1;
}
.px-hero-quote-card-3 {
    grid-column: 1/-1;
    grid-row: 2;
}
.px-hero-quote-card img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.001);
    transition: transform 0.8s cubic-bezier(0.2, 0.7, 0.2, 1);
}
.px-hero-quote-card:hover img {
    transform: scale(1.035);
}
.px-hero-quote-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
}
.px-hero-quote-light .px-hero-quote-overlay {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(0, 0, 0, 0.14));
}
.px-hero-quote-dark .px-hero-quote-overlay {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.12), rgba(0, 0, 0, 0.48));
}
.px-hero-quote-blue .px-hero-quote-overlay {
    background: linear-gradient(90deg, rgba(0, 33, 110, 0.18), rgba(0, 0, 0, 0.22));
}
.px-hero-quote-card p {
    position: absolute;
    z-index: 2;
    left: clamp(20px, 3vw, 52px);
    bottom: clamp(20px, 3vw, 46px);
    max-width: 80%;
    margin: 0;
    color: #fff;
    font-size: calc((clamp(24px, 3.3vw, 54px)) + 1px);
    line-height: 0.92;
    font-weight: 900;
    letter-spacing: -0.055em;
    text-transform: uppercase;
}
.px-hero-quote-light p {
    color: #090909;
}
@media (max-width: 700px) {
    .px-hero-quote-grid-inner {
        grid-template-columns: 42% 58%;
        grid-template-rows: 190px 210px;
    }
    .px-hero-quote-card p {
        left: 14px;
        bottom: 14px;
        max-width: 88%;
        font-size: calc((clamp(17px, 5.2vw, 28px)) + 1px);
    }
}

/* v1.1.68 — Hero standard height + vertically centered content */
.px-tech-ad-hero {
    height: clamp(620px, 78vh, 780px);
    min-height: 620px;
    max-height: 780px;
}

.px-tech-ad-copy {
    top: 50%;
    bottom: auto;
    transform: translateY(-50%);
    margin-top: 0;
    margin-bottom: 0;
}

@media (max-width: 900px) {
    .px-tech-ad-hero {
        height: clamp(560px, 76vh, 700px);
        min-height: 560px;
        max-height: 700px;
    }
    .px-tech-ad-copy {
        top: 50%;
        bottom: auto;
        transform: translateY(-50%);
    }
}

@media (max-width: 620px) {
    .px-tech-ad-hero {
        height: clamp(520px, 72vh, 620px);
        min-height: 520px;
        max-height: 620px;
    }
    .px-tech-ad-copy {
        top: 50%;
        bottom: auto;
        transform: translateY(-50%);
    }
}

body.home main {
    margin-top: 0;
    padding-top: 0;
}

body.home .px-tech-ad-hero {
    margin-top: 0;
    padding-top: 0;
}

@media (min-width: 901px) {
    body.home .px-tech-ad-hero {
        top: 0;
    }
}

@media screen and (max-width: 782px) {
    body.admin-bar .px-site-header,
    body.admin-bar .px-site-header.is-scrolled,
    body.admin-bar.is-scrolled .px-site-header {
        top: 46px;
    }
}

/* Refined label: no long mechanical rule;


/* v1.1.68 — Portfolio Mosaic desktop bottom row: tiles 9 & 10 side by side */
@media (min-width: 901px) {
    .px-portfolio-mosaic-grid {
        grid-template-columns: repeat(12, minmax(0, 1fr));
    }

    .px-portfolio-tile-9 {
        grid-column: 3 / span 4;
        grid-row: auto;
        justify-self: stretch;
        align-self: stretch;
        width: auto;
        margin: 0;
    }

    .px-portfolio-tile-10 {
        grid-column: 7 / span 4;
        grid-row: auto;
        justify-self: stretch;
        align-self: stretch;
        width: auto;
        margin: 0;
    }
}

/* v1.1.68 — floating contact button: double chat-bubble icon */
.px-whatsapp {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #00b04b;
    color: #fff;
text-decoration: none;
    overflow: visible;
    transition:
        transform 0.2s ease,
        background-color 0.2s ease,
        box-shadow 0.2s ease;
}
.px-whatsapp:hover,
.px-whatsapp:focus-visible {
    transform: scale(1.06);
    background: #009941;
    color: #fff;
}
.px-whatsapp .px-floating-chat-icon {
    display: block;
    width: 40px;
    height: 40px;
    color: #fff;
    overflow: visible;
}
@media (max-width: 480px) {
    .px-whatsapp {
        right: 16px;
        bottom: 16px;
        width: 52px;
        height: 52px;
    }
    .px-whatsapp .px-floating-chat-icon {
        width: 34px;
        height: 34px;
    }
}

/* v1.1.68 — guaranteed-visible white double chat icon */
.px-whatsapp .px-floating-chat-icon {
    display: block;
    width: 40px;
    height: 40px;
    overflow: visible;
}
.px-whatsapp .px-floating-chat-icon .px-chat-bubble-back {
    fill: none;
    stroke: #fff;
    stroke-width: 6;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.px-whatsapp .px-floating-chat-icon .px-chat-bubble-front {
    fill: #fff;
    stroke: #fff;
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.px-whatsapp .px-floating-chat-icon .px-chat-line {
    fill: #00b04b;
    stroke: none;
}
@media (max-width: 480px) {
    .px-whatsapp .px-floating-chat-icon {
        width: 34px;
        height: 34px;
    }
}

/* v1.1.68 — floating contact icon rebuilt with pure HTML/CSS */
.px-whatsapp {
    font-size: 0;
    line-height: 0;
}

/* v1.1.68 — floating contact stack: promo badge + online sparkle */
.px-floating-contact-stack {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 99999;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    pointer-events: none;
}

.px-floating-contact-stack .px-whatsapp {
    position: relative;
    right: auto;
    bottom: auto;
    flex: 0 0 auto;
    pointer-events: auto;
}

/* subtle online twinkles */
@keyframes pxOnlineSpark {
    0%,
    100% {
        opacity: 0.18;
        transform: scale(0.68);
    }
    45% {
        opacity: 1;
        transform: scale(1.2);
    }
    62% {
        opacity: 0.55;
        transform: scale(0.92);
    }
}

/* circular promo badge above the chat button */
.px-floating-promo-badge {
    position: relative;
    width: 116px;
    height: 116px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    padding: 18px;
    box-sizing: border-box;
    background: radial-gradient(
        circle at 50% 45%,
        rgba(18, 24, 34, 0.98) 0%,
        rgba(7, 11, 17, 0.99) 72%
    );
pointer-events: none;
    overflow: hidden;
}

/* rotating visual ring; text stays still because only this layer rotates */
.px-floating-promo-spin {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: conic-gradient(
        from 0deg,
        #1c8cff 0deg 42deg,
        transparent 42deg 112deg,
        #7cff6b 112deg 158deg,
        transparent 158deg 240deg,
        #1c8cff 240deg 292deg,
        transparent 292deg 360deg
    );
    animation: pxPromoSpin 7s linear infinite;
}
.px-floating-promo-spin::before {
    content: "";
    position: absolute;
    inset: 3px;
    border-radius: 50%;
    background: #090d13;
}
.px-floating-promo-spin::after {
    content: "";
    position: absolute;
    inset: 8px;
    border-radius: 50%;
    border: 1px dashed rgba(255, 255, 255, 0.16);
}

.px-floating-promo-text {
    position: relative;
    z-index: 2;
    display: block;
    width: 82px;
    color: #fff;
    text-align: center;
    font-size: calc((10px) + 1px);
    line-height: 1.28;
    font-weight: 800;
    letter-spacing: 0.01em;
    text-transform: none;
transform: none;
}

@keyframes pxPromoSpin {
    to {
        transform: rotate(360deg);
    }
}

@media (max-width: 480px) {
    .px-floating-contact-stack {
        right: 16px;
        bottom: 16px;
        gap: 10px;
    }
    .px-floating-promo-badge {
        width: 96px;
        height: 96px;
        padding: 14px;
    }
    .px-floating-promo-text {
        width: 70px;
        font-size: calc((8.5px) + 1px);
        line-height: 1.25;
    }
}

@media (prefers-reduced-motion: reduce) {
    .px-floating-promo-spin {
        animation: none;
    }
}

/* v1.1.68 — refine floating promo badge text centering + contact icon geometry */

/* Keep promo text mathematically centered inside the circular badge */
.px-floating-promo-badge {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.px-floating-promo-text {
    position: absolute;
    z-index: 3;
    top: 50%;
    left: 50%;
    width: 78px;
    margin: 0;
    padding: 0;
    transform: translate(-50%, -50%);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: calc((10px) + 1px);
    line-height: 1.23;
    font-weight: 800;
    letter-spacing: 0;
}

/* Clean up the contact icon proportions */
/* make the online sparkle a little cleaner and less intrusive */
@media (max-width: 480px) {
    .px-floating-promo-text {
        width: 66px;
        font-size: calc((8px) + 1px);
        line-height: 1.22;
    }
}

/* v1.1.68 — online indicator becomes a white petromax-like breathing outer ring */
.px-floating-contact-stack .px-whatsapp {
    position: relative;
    isolation: isolate;
}

/* soft white breathing halo around the outer circle */
.px-floating-contact-stack .px-whatsapp::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: -5px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.88);
opacity: 0.34;
    transform: scale(0.98);
    animation: pxPetromaxGlow 2.35s ease-in-out infinite;
    pointer-events: none;
}

/* a second thin glow layer makes the pulse feel like light, not a blinking dot */
.px-floating-contact-stack .px-whatsapp::after {
    content: "";
    position: absolute;
    z-index: -2;
    inset: -9px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.36);
opacity: 0.12;
    animation: pxPetromaxGlowOuter 2.35s ease-in-out infinite;
    pointer-events: none;
}

@keyframes pxPetromaxGlow {
    0%,
    100% {
        opacity: 0.22;
        transform: scale(0.985);
        border-color: rgba(255, 255, 255, 0.54);
}
    45% {
        opacity: 0.95;
        transform: scale(1.045);
        border-color: rgba(255, 255, 255, 1);
}
    62% {
        opacity: 0.54;
        transform: scale(1.015);
    }
}

@keyframes pxPetromaxGlowOuter {
    0%,
    100% {
        opacity: 0.08;
        transform: scale(0.98);
    }
    45% {
        opacity: 0.34;
        transform: scale(1.06);
    }
    62% {
        opacity: 0.16;
        transform: scale(1.02);
    }
}

@media (prefers-reduced-motion: reduce) {
    .px-floating-contact-stack .px-whatsapp::before,
    .px-floating-contact-stack .px-whatsapp::after {
        animation: none;
        opacity: 0.45;
        transform: none;
    }
}

/* v1.1.68 — high-intensity white petromax pulse on floating contact ring */
.px-floating-contact-stack .px-whatsapp::before {
    inset: -6px;
    border: 2.5px solid #fff;
    opacity: 0.42;
animation: pxPetromaxGlowStrong 1.8s ease-in-out infinite;
}
.px-floating-contact-stack .px-whatsapp::after {
    inset: -11px;
    border: 1.5px solid rgba(255, 255, 255, 0.75);
    opacity: 0.22;
animation: pxPetromaxGlowOuterStrong 1.8s ease-in-out infinite;
}
@keyframes pxPetromaxGlowStrong {
    0%,
    100% {
        opacity: 0.24;
        transform: scale(0.985);
}
    42% {
        opacity: 1;
        transform: scale(1.055);
        border-color: #fff;
}
    55% {
        opacity: 0.9;
        transform: scale(1.04);
    }
    72% {
        opacity: 0.36;
        transform: scale(1);
    }
}
@keyframes pxPetromaxGlowOuterStrong {
    0%,
    100% {
        opacity: 0.08;
        transform: scale(0.97);
    }
    42% {
        opacity: 0.72;
        transform: scale(1.09);
    }
    55% {
        opacity: 0.52;
        transform: scale(1.065);
    }
    72% {
        opacity: 0.14;
        transform: scale(1);
    }
}

/* v1.1.68 — logged-in mobile: header returns to viewport top after admin bar scrolls away */
@media screen and (max-width: 782px) {
    /* Initial page position: stay below the WordPress admin bar */
    body.admin-bar .px-site-header {
        top: 46px;
    }

    /* Once the theme header enters its scrolled/fixed state,
     the mobile WP admin bar has already scrolled out of view. */
    body.admin-bar .px-site-header.is-scrolled,
    body.admin-bar.is-scrolled .px-site-header {
        top: 0;
    }
}

/* WordPress uses the shorter admin bar on wider logged-in screens */
@media screen and (min-width: 783px) {
    body.admin-bar .px-site-header {
        top: 32px;
    }
    body.admin-bar .px-site-header.is-scrolled,
    body.admin-bar.is-scrolled .px-site-header {
        top: 32px;
    }
}

/* keep the floating badge independent of footer layout */
.px-floating-contact-stack {
    max-width: 116px;
}

/* =========================================================
   v1.1.68 — CODE AUDIT / CANONICAL OVERRIDE LAYER
   Purpose: stabilize layout after iterative revisions without
   removing existing settings, renderers, or section features.
   ========================================================= */

/* ---------- Global overflow safety ---------- */
html,
body {
    max-width: 100%;
    overflow-x: hidden;
}
*,
*::before,
*::after {
    box-sizing: border-box;
}
@media screen and (max-width: 782px) {
    body.admin-bar .px-site-header {
        top: 46px;
    }
    body.admin-bar .px-site-header.is-scrolled,
    body.admin-bar.is-scrolled .px-site-header {
        top: 0;
    }
}
@media screen and (min-width: 783px) {
    body.admin-bar .px-site-header,
    body.admin-bar .px-site-header.is-scrolled,
    body.admin-bar.is-scrolled .px-site-header {
        top: 32px;
    }
}

/* ---------- Hero ---------- */
body.home main,
body.home .px-tech-ad-hero {
    margin-top: 0;
    padding-top: 0;
}
.px-tech-ad-hero {
    height: clamp(620px, 78vh, 780px);
    min-height: 620px;
    max-height: 780px;
}
.px-tech-ad-copy {
    top: 50%;
    bottom: auto;
    transform: translateY(-50%);
}
@media (max-width: 900px) {
    .px-tech-ad-hero {
        height: clamp(560px, 76vh, 700px);
        min-height: 560px;
        max-height: 700px;
    }
}
@media (max-width: 620px) {
    .px-tech-ad-hero {
        height: clamp(520px, 72vh, 620px);
        min-height: 520px;
        max-height: 620px;
    }
}

/* ---------- Portfolio final row desktop ---------- */
@media (min-width: 901px) {
    .px-portfolio-mosaic-grid {
        grid-template-columns: repeat(12, minmax(0, 1fr));
        grid-auto-flow: row;
    }
    .px-portfolio-tile-9 {
        grid-column: 3 / span 4;
        grid-row: auto;
        width: auto;
        margin: 0;
    }
    .px-portfolio-tile-10 {
        grid-column: 7 / span 4;
        grid-row: auto;
        width: auto;
        margin: 0;
    }
}

/* ---------- Floating contact stack ---------- */
.px-floating-contact-stack {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 99999;
    width: 116px;
    max-width: 116px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    pointer-events: none;
}
.px-floating-contact-stack .px-whatsapp {
    position: relative;
    right: auto;
    bottom: auto;
    pointer-events: auto;
}
@media (max-width: 480px) {
    .px-floating-contact-stack {
        right: 14px;
        bottom: 16px;
        width: 96px;
        max-width: 96px;
        gap: 10px;
    }
}

@media (min-width: 1181px) {
    .px-header-shell {
        height: 72px;
        padding-left: 24px;
        padding-right: 24px;
        justify-content: flex-start;
        gap: 28px;
    }

    .px-brand-link {
        gap: 12px;
        flex: 0 1 auto;
        margin-left: 0;
    }

    .px-brand-image {
        max-width: 120px;
        max-height: 38px;
    }

    .px-brand-text {
        font-size: calc((31px) + 1px);
        font-weight: 700;
    }

    .px-mobile-header-actions,
    .px-mobile-drawer {
        display: none;
    }

    .px-desktop-header-controls {
        min-width: 0;
        height: 100%;
        margin-left: auto;
        margin-right: 0;
        padding-right: 0;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        flex-wrap: nowrap;
        gap: 18px;
    }

    .px-desktop-nav {
        min-width: 0;
        height: 100%;
        display: flex;
        align-items: center;
    }

    .px-primary-menu {
        min-width: 0;
        margin: 0;
        padding: 0;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 24px;
        list-style: none;
    }

    .px-desktop-header-controls .px-header-whatsapp-cta {
        min-height: 40px;
        padding-inline: 14px;
        column-gap: 7px;
        font-size: calc((13px) + 1px);
    }

    .px-desktop-header-controls .px-header-whatsapp-cta svg {
        width: 17px;
        height: 17px;
        flex-basis: 17px;
    }

    .px-header-language {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        align-self: center;
        width: max-content;
        min-width: 0;
        height: 42px;
        margin: 0 0 0 14px;
        padding: 0;
        gap: 7px;
        white-space: nowrap;
        color: #fff;
        font-size: calc((12px) + 1px);
        font-weight: 800;
        letter-spacing: 0.08em;
        line-height: 1;
        vertical-align: middle;
        flex: 0 0 auto;
    }

    .px-header-language-globe {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        align-self: center;
        width: 18px;
        height: 18px;
        margin: 0;
        padding: 0;
        line-height: 0;
        flex: 0 0 18px;
        transform: none;
        position: static;
        top: auto;
        bottom: auto;
    }

    .px-header-language-globe svg {
        display: block;
        width: 18px;
        height: 18px;
        margin: 0;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.55;
        stroke-linecap: round;
        stroke-linejoin: round;
        transform: none;
    }

    .px-header-language-link,
    .px-header-language-sep {
        display: inline-flex;
        align-items: center;
        height: 18px;
        line-height: 18px;
        margin: 0;
        padding: 0;
    }

    .px-header-language-link {
        color: rgba(255, 255, 255, 0.72);
        text-decoration: none;
        font-size: calc((12px) + 1px);
        font-weight: 800;
        letter-spacing: 0.08em;
        transition: color 0.2s ease;
    }

    .px-header-language-link:hover,
    .px-header-language-link:focus,
    .px-header-language-link.is-active {
        color: #7cff6b;
    }

    .px-header-language-sep {
        color: rgba(255, 255, 255, 0.34);
        font-size: calc((11px) + 1px);
    }
}

/* v1.1.68 — Trusted Businesses / Logo Section
   Left-aligned copy + real multi-logo carousel with visible local examples. */
.px-trusted-strip {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: 620px;
    display: flex;
    align-items: center;
    background:
        radial-gradient(circle at 78% 8%, rgba(120, 145, 180, 0.16), transparent 30%),
        radial-gradient(circle at 52% 120%, rgba(40, 52, 70, 0.13), transparent 42%),
        linear-gradient(180deg, #0a0d12 0%, #07090d 100%);
    color: #fff;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.px-trusted-decor {
    position: absolute;
    pointer-events: none;
    z-index: -1;
}

.px-trusted-decor-lines {
    top: -20px;
    left: -8px;
    width: 170px;
    height: 330px;
    opacity: 0.26;
    background: repeating-linear-gradient(
        45deg,
        transparent 0 11px,
        rgba(255, 255, 255, 0.16) 12px 13px,
        transparent 14px 24px
    );
    clip-path: polygon(0 0, 100% 0, 0 100%);
}

.px-trusted-decor-arc {
    width: 720px;
    height: 720px;
    right: -300px;
    top: -325px;
    border: 1px solid rgba(255, 255, 255, 0.07);
    border-radius: 50%;
}

.px-trusted-strip-inner {
    width: min(calc(100% - 56px), 1320px);
    margin-inline: auto;
    padding: 70px 0 58px;
}

.px-trusted-strip-head {
    max-width: 780px;
    margin: 0 0 56px;
    text-align: left;
}

.px-trusted-strip-label-row {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 16px;
    margin-bottom: 24px;
}

.px-trusted-strip-line {
    width: 48px;
    height: 1px;
    background: rgba(255, 255, 255, 0.34);
}

.px-trusted-strip-label-row .px-trusted-strip-line:last-child {
    display: none;
}

.px-trusted-strip-label {
    display: block;
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: calc((13px) + 1px);
    line-height: 1;
    font-weight: 600;
    letter-spacing: 0.32em;
    text-transform: uppercase;
}

.px-trusted-strip-title {
    display: block;
    margin: 0;
    color: #f8fafc;
    font-size: calc((clamp(40px, 4.5vw, 68px)) + 1px);
    line-height: 1.02;
    font-weight: 750;
    letter-spacing: -0.05em;
    text-align: left;
}

.px-trusted-strip-description {
    display: block;
    max-width: 720px;
    margin: 24px 0 0;
    color: #b7c0ce;
    font-size: calc((18px) + 1px);
    line-height: 1.55;
    font-weight: 400;
    text-align: left;
}

.px-trusted-carousel {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr) 54px;
    align-items: center;
    gap: 18px;
    width: 100%;
}

.px-trusted-arrow {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.015);
    color: #fff;
    cursor: pointer;
    transition:
        background 0.2s ease,
        border-color 0.2s ease,
        transform 0.2s ease;
}

.px-trusted-arrow:hover,
.px-trusted-arrow:focus-visible {
    background: rgba(255, 255, 255, 0.07);
    border-color: rgba(255, 255, 255, 0.58);
    transform: scale(1.04);
}

.px-trusted-arrow span {
    display: block;
    margin-top: -4px;
    font-size: calc((38px) + 1px);
    line-height: 1;
    font-weight: 300;
}

.px-trusted-strip-logos {
    display: flex;
    align-items: center;
    gap: 34px;
    min-width: 0;
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    overscroll-behavior-inline: contain;
}

.px-trusted-strip-logos::-webkit-scrollbar {
    display: none;
}

.px-trusted-strip-item {
    flex: 0 0 calc((100% - 170px) / 6);
    min-width: 145px;
    min-height: 86px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 2px;
    scroll-snap-align: start;
}

.px-trusted-strip-item img {
    display: block;
    width: 100%;
    height: 62px;
    max-width: 172px;
    object-fit: contain;
    object-position: center;
    opacity: 1;
    filter: none;
}

.px-trusted-indicators {
    display: flex;
    justify-content: center;
    gap: 14px;
    margin-top: 44px;
}

.px-trusted-indicators span {
    width: 46px;
    height: 4px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.18);
}

.px-trusted-indicators span.is-active {
    background: #fff;
}

@media (max-width: 1000px) {
    .px-trusted-strip {
        min-height: 560px;
    }

    .px-trusted-strip-inner {
        width: min(calc(100% - 40px), 1180px);
        padding: 60px 0 50px;
    }

    .px-trusted-strip-head {
        margin-bottom: 44px;
    }

    .px-trusted-carousel {
        grid-template-columns: 46px minmax(0, 1fr) 46px;
        gap: 12px;
    }

    .px-trusted-arrow {
        width: 44px;
        height: 44px;
    }

    .px-trusted-strip-item {
        flex-basis: calc((100% - 54px) / 4);
        min-width: 145px;
    }
}

@media (max-width: 620px) {
    .px-trusted-strip {
        min-height: auto;
    }

    .px-trusted-strip-inner {
        width: min(calc(100% - 28px), 1180px);
        padding: 48px 0 42px;
    }

    .px-trusted-strip-head {
        margin-bottom: 36px;
    }

    .px-trusted-strip-label-row {
        gap: 12px;
        margin-bottom: 19px;
    }

    .px-trusted-strip-line {
        width: 34px;
    }

    .px-trusted-strip-label {
        font-size: calc((10px) + 1px);
        letter-spacing: 0.26em;
    }

    .px-trusted-strip-title {
        font-size: calc((38px) + 1px);
    }

    .px-trusted-strip-description {
        margin-top: 18px;
        font-size: calc((14px) + 1px);
        line-height: 1.65;
    }

    .px-trusted-carousel {
        grid-template-columns: 40px minmax(0, 1fr) 40px;
        gap: 8px;
    }

    .px-trusted-arrow {
        width: 38px;
        height: 38px;
    }

    .px-trusted-arrow span {
        font-size: calc((30px) + 1px);
    }

    .px-trusted-strip-item {
        flex-basis: 78%;
        min-width: 145px;
        min-height: 78px;
    }

    .px-trusted-strip-item img {
        height: 54px;
        max-width: 165px;
    }

    .px-trusted-indicators {
        gap: 10px;
        margin-top: 32px;
    }

    .px-trusted-indicators span {
        width: 34px;
        height: 3px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .px-trusted-strip-logos {
        scroll-behavior: auto;
    }
    .px-trusted-arrow {
        transition: none;
    }
}

/* v1.1.68 — Trusted section copy: single-line desktop title + description */
@media (min-width: 1001px) {
    .px-trusted-strip-head {
        max-width: none;
        width: 100%;
    }

    .px-trusted-strip-title {
        white-space: nowrap;
        max-width: none;
    }

    .px-trusted-strip-description {
        white-space: nowrap;
        max-width: none;
    }
}

@media (max-width: 1000px) {
    .px-trusted-strip-title,
    .px-trusted-strip-description {
        white-space: normal;
    }
}

/* v1.1.68 — FOOTER: single source of truth */
.px-footer.px-editorial-footer {
    position: relative;
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background: #050505;
    color: #fff;
    border-top: 1px solid rgba(255, 255, 255, 0.16);
}

.px-editorial-footer,
.px-editorial-footer * {
    box-sizing: border-box;
}

/* ---------- top 3-column area ---------- */
.px-editorial-footer-top {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.55fr) minmax(250px, 0.78fr);
    width: 100%;
    min-width: 0;
    align-items: stretch;
    border-bottom: 1px solid rgba(255, 255, 255, 0.16);
}

.px-editorial-footer-top > div {
    min-width: 0;
    padding: 38px 42px;
    border-right: 1px solid rgba(255, 255, 255, 0.16);
}

.px-editorial-footer-top > div:last-child {
    border-right: 0;
}

.px-editorial-footer-logo {
    display: block;
    max-width: 180px;
    max-height: 56px;
    object-fit: contain;
}

.px-editorial-footer-wordmark {
    display: block;
    font-size: calc((24px) + 1px);
    line-height: 1;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.px-editorial-footer-brand p {
    max-width: 350px;
    margin: 20px 0 0;
    color: rgba(255, 255, 255, 0.62);
    font-size: calc((14px) + 1px);
    line-height: 1.65;
}

.px-editorial-footer-kicker {
    display: block;
    margin: 0;
    color: #7cff6b;
    font-size: calc((10px) + 1px);
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: 0.17em;
}

.px-editorial-footer-message {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.px-editorial-footer-message h2 {
    margin: 34px 0 0;
    color: #fff;
    font-size: calc((clamp(48px, 6.2vw, 94px)) + 1px);
    line-height: 0.86;
    font-weight: 800;
    letter-spacing: -0.065em;
}

.px-editorial-footer-message h2 em {
    color: #7cff6b;
    font-style: normal;
}

.px-editorial-footer-social {
    display: flex;
    flex-direction: column;
    min-width: 0;
    width: 100%;
    overflow: hidden;
}

.px-editorial-social-list {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-width: 0;
    margin-top: 28px;
    border-top: 1px solid rgba(255, 255, 255, 0.16);
}

.px-editorial-social-list > a {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr) 18px;
    align-items: center;
    gap: 12px;
    width: 100%;
    min-width: 0;
    min-height: 54px;
    padding: 10px 0;
    margin: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.16);
    color: #fff;
    text-decoration: none;
}

.px-editorial-social-name {
    display: contents;
}

.px-editorial-social-icon {
    grid-column: 1;
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    line-height: 0;
}

.px-editorial-social-icon svg {
    display: block;
    width: 24px;
    height: 24px;
    max-width: 24px;
    max-height: 24px;
}

.px-editorial-social-icon svg .is-fill {
    fill: currentColor;
    stroke: none;
}

.px-editorial-social-name > span:last-child {
    grid-column: 2;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: calc((13px) + 1px);
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: 0.07em;
}

.px-editorial-social-list > a > span:last-child {
    grid-column: 3;
    width: 18px;
    justify-self: end;
    text-align: center;
}

.px-editorial-social-list > a:hover,
.px-editorial-social-list > a:focus-visible {
    color: #7cff6b;
}

/* ---------- explore links ---------- */
.px-editorial-footer-links {
    display: grid;
    grid-template-columns: minmax(140px, 0.32fr) minmax(0, 1fr);
    gap: 28px;
    align-items: center;
    width: 100%;
    padding: 20px 42px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.16);
}

.px-editorial-footer-link-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px 24px;
    min-width: 0;
}

.px-editorial-footer-link-row a {
    color: rgba(255, 255, 255, 0.76);
    text-decoration: none;
    font-size: calc((12px) + 1px);
    font-weight: 700;
}

.px-editorial-footer-link-row a:hover,
.px-editorial-footer-link-row a:focus-visible {
    color: #7cff6b;
}

/* ---------- legal / copyright row ----------
   Important: vertical spacing is intentionally symmetrical. */
.px-editorial-footer-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-width: 0;
    min-height: 0;
    height: auto;
    margin: 0;
    padding: 28px 42px;
    gap: 28px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.16);
}

.px-editorial-footer-bottom-left,
.px-editorial-footer-bottom-right {
    min-width: 0;
    min-height: 0;
    height: auto;
    margin: 0;
    padding: 0;
}

.px-editorial-footer-bottom-left {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px 18px;
    color: rgba(255, 255, 255, 0.52);
    font-size: calc((11px) + 1px);
    line-height: 1.2;
    letter-spacing: 0.06em;
}

.px-editorial-footer-bottom-left a {
    color: rgba(255, 255, 255, 0.72);
    text-decoration: none;
}

.px-editorial-footer-bottom-right {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 28px;
    flex: 0 0 auto;
}

.px-editorial-footer-legal {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0;
    padding: 0;
}

.px-editorial-footer-legal a {
    color: rgba(255, 255, 255, 0.82);
    font-size: calc((11px) + 1px);
    line-height: 1.2;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

.px-editorial-footer-legal-sep {
    color: rgba(255, 255, 255, 0.34);
    font-size: calc((11px) + 1px);
    line-height: 1;
}

.px-editorial-footer-toplink {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    color: #fff;
    text-decoration: none;
    font-size: calc((11px) + 1px);
    line-height: 1;
    font-weight: 800;
    letter-spacing: 0.12em;
    white-space: nowrap;
}

.px-editorial-footer-toplink span:last-child {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border: 1px solid rgba(255, 255, 255, 0.26);
}

.px-editorial-footer-toplink:hover,
.px-editorial-footer-toplink:focus-visible {
    color: #7cff6b;
}

/* ---------- giant wordmark ----------
   Two-column composition:
   DESIGN = full section height
   BUILD + BETTER = two equal stacked rows */
.px-editorial-footer-type {
    display: grid;
    grid-template-columns: minmax(0, 1.36fr) minmax(0, 1fr);
    width: 100%;
    height: clamp(300px, 25vw, 440px);
    margin: 0;
    padding: 0;
    overflow: hidden;
    background: #050505;
    border-bottom: 1px solid rgba(255, 255, 255, 0.16);
}

.px-editorial-footer-type-design,
.px-editorial-footer-type-stack,
.px-editorial-footer-type-build,
.px-editorial-footer-type-better {
    min-width: 0;
    min-height: 0;
}

.px-editorial-footer-type-design {
    display: flex;
    align-items: center;
    height: 100%;
    padding: 0 0 0 clamp(18px, 2.2vw, 42px);
    overflow: hidden;
    color: #fff;
    font-size: calc((clamp(118px, 17.4vw, 330px)) + 1px);
    line-height: 0.72;
    font-weight: 900;
    letter-spacing: -0.09em;
    white-space: nowrap;
}

.px-editorial-footer-type-stack {
    display: grid;
    grid-template-rows: 1fr 1fr;
    height: 100%;
    overflow: hidden;
}

.px-editorial-footer-type-build,
.px-editorial-footer-type-better {
    display: flex;
    align-items: center;
    height: 100%;
    padding-left: clamp(12px, 1.2vw, 24px);
    overflow: hidden;
    white-space: nowrap;
    font-size: calc((clamp(74px, 9.2vw, 174px)) + 1px);
    line-height: 0.76;
    font-weight: 900;
    letter-spacing: -0.075em;
}

.px-editorial-footer-type-build {
    color: transparent;
    -webkit-text-stroke: 2px #7cff6b;
    text-stroke: 2px #7cff6b;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.px-editorial-footer-type-better {
    color: #fff;
}

/* Optical centering: top and bottom whitespace are intentionally equal. */
.px-editorial-footer-type-design,
.px-editorial-footer-type-build,
.px-editorial-footer-type-better {
    padding-top: 0;
    padding-bottom: 0;
}

/* ---------- responsive ---------- */
@media (max-width: 1180px) {
    .px-editorial-footer-top {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
    }

    .px-editorial-footer-social {
        grid-column: 1 / -1;
        border-top: 1px solid rgba(255, 255, 255, 0.16);
    }

    .px-editorial-social-list {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        border-left: 1px solid rgba(255, 255, 255, 0.16);
    }

    .px-editorial-social-list > a {
        padding: 10px 14px;
        border-right: 1px solid rgba(255, 255, 255, 0.16);
    }

    .px-editorial-footer-bottom {
        padding-inline: 32px;
    }
}

@media (max-width: 760px) {
    .px-editorial-footer-top {
        display: block;
    }

    .px-editorial-footer-top > div {
        width: 100%;
        padding: 32px 20px;
        border-right: 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.16);
    }

    .px-editorial-footer-message h2 {
        margin-top: 28px;
        font-size: calc((clamp(48px, 15vw, 72px)) + 1px);
    }

    .px-editorial-social-list {
        display: block;
        border-left: 0;
    }

    .px-editorial-social-list > a {
        grid-template-columns: 30px minmax(0, 1fr) 18px;
        padding: 10px 0;
        border-right: 0;
    }

    .px-editorial-footer-links {
        grid-template-columns: 1fr;
        padding: 22px 20px;
    }

    .px-editorial-footer-link-row {
        justify-content: flex-start;
    }

    .px-editorial-footer-bottom {
        display: block;
        padding: 24px 20px;
    }

    .px-editorial-footer-bottom-right {
        margin-top: 18px;
        justify-content: space-between;
        gap: 16px;
    }

    .px-editorial-footer-legal {
        justify-content: flex-start;
        flex-wrap: wrap;
    }

    .px-editorial-footer-type {
        grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
        height: 180px;
    }

    .px-editorial-footer-type-design {
        padding-left: 8px;
        font-size: calc((24vw) + 1px);
    }

    .px-editorial-footer-type-build,
    .px-editorial-footer-type-better {
        padding-left: 8px;
        font-size: calc((13vw) + 1px);
        -webkit-text-stroke-width: 1px;
    }
}

/* v1.1.68 — giant footer wordmark responsive tuning */
@media (min-width: 761px) and (max-width: 1180px) {
    .px-editorial-footer-type {
        height: clamp(250px, 28vw, 340px);
    }
    .px-editorial-footer-type-design {
        font-size: calc((18.2vw) + 1px);
    }
    .px-editorial-footer-type-build,
    .px-editorial-footer-type-better {
        font-size: calc((9.7vw) + 1px);
    }
}

/* v1.1.68 — WordPress footer integration boundary only */
body .wp-site-blocks > .four-my-theme-footer-part {
    width: 100%;
    max-width: none;
    min-height: 0;
    height: auto;
    margin: 0;
    padding: 0;
    display: block;
}

/* v1.1.68 — exact user footer widget CSS; single source of truth */
/* Reset & Container Utama Full Width */
.tm-footer-wrapper {
    background-color: #000000;
    color: #ffffff;
    font-family: "Nunito Sans", sans-serif;
    width: 100%;
    margin: 0;
    padding: 18px 40px 24px 40px;
    box-sizing: border-box;
    line-height: 1.5;
    position: relative;
    overflow: hidden;
}

.tm-footer-container {
    max-width: 1400px;
    margin: 0 auto;
    width: 100%;
}

/* --- BAGIAN ATAS (TOP SECTION - 4 KOLOM) --- */
.tm-footer-top {
    display: grid;
    grid-template-columns: 360px 260px 1fr auto;
    align-items: start;
    gap: 30px;
    padding-bottom: 2px;
    position: relative;
}

/* Kolom 1: Brand */
.tm-brand-col {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.tm-logo {
    font-size: calc((32px) + 1px);
    font-weight: 900;
    letter-spacing: 2px;
    color: #ffffff;
    margin: 0;
    line-height: 1;
}

.tm-logo span {
    font-size: calc((14px) + 1px);
    vertical-align: super;
    font-weight: normal;
}

.tm-tagline {
    font-size: calc((11px) + 1px);
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #ffffff;
    margin: 0;
}

.tm-brand-desc {
    font-size: calc((13px) + 1px);
    color: #a0a0a0;
    margin: 0;
    line-height: 1.5;
}

/* Kolom 2: Slogan */
.tm-slogan-col {
    text-align: left;
    padding-left: 25px;
    border-left: 1.5px solid #444444;
}

.tm-number-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: calc((12px) + 1px);
    color: #888888;
    margin-bottom: 6px;
    font-weight: 600;
}

.tm-number-badge::before,
.tm-number-badge::after {
    content: "";
    display: inline-block;
    width: 16px;
    height: 1px;
    background-color: #666666;
}

.tm-slogan-title {
    font-size: calc((20px) + 1px);
    font-weight: 900;
    letter-spacing: 1px;
    margin: 0;
    color: #ffffff;
    text-transform: uppercase;
    line-height: 1.2;
}

.tm-slogan-subtitle {
    font-size: calc((20px) + 1px);
    font-weight: 900;
    letter-spacing: 1px;
    margin: 0;
    color: #666666;
    text-transform: uppercase;
    line-height: 1.2;
}

/* Kolom 3: Motif Orisinal */
.tm-pattern-col {
    display: flex;
    align-items: center;
    justify-content: center;
    height: auto;
    min-height: 0;
    opacity: 0.35;
    padding: 0 10px;
}

.tm-pattern-svg {
    width: 100%;
    max-width: 280px;
    height: 64px;
}

/* Kolom 4: Social Media Icons */
.tm-social-col {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    justify-self: end;
    justify-content: flex-start;
}

.tm-social-icons {
    display: flex;
    align-items: center;
    gap: 10px;
}

.tm-social-link {
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-size: calc((22px) + 1px);
    transition:
        opacity 0.3s,
        transform 0.2s;
}

.tm-social-link i {
    color: #ffffff;
    pointer-events: none;
    display: block;
}

.tm-social-link:hover {
    opacity: 0.8;
    transform: translateY(-2px);
}

.tm-social-text {
    font-size: calc((11px) + 1px);
    letter-spacing: 2px;
    color: #888888;
    text-transform: uppercase;
    font-weight: 600;
    text-align: left;
}

/* --- GARIS PEMBATAS HORIZONTAL --- */
.tm-divider-horizontal {
    width: 100%;
    height: 1px;
    background-color: #333333;
    margin: 4px 0 8px;
}

/* --- BAGIAN BAWAH --- */
.tm-footer-bottom {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.tm-nav-links {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
}

.tm-nav-links a {
    color: #dddddd;
    text-decoration: none;
    font-size: calc((13px) + 1px);
    transition: color 0.3s;
}

.tm-nav-links a:hover {
    color: #ffffff;
}

.tm-nav-separator {
    color: #444444;
    font-size: calc((12px) + 1px);
}

.tm-bottom-right-action {
    display: flex;
    align-items: center;
    gap: 20px;
}

.tm-family-site {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1.5px solid #666666;
    padding: 10px 18px;
    width: 210px;
    color: #ffffff;
    text-decoration: none;
    font-size: calc((12px) + 1px);
    letter-spacing: 1px;
    font-weight: 600;
    transition: border-color 0.3s;
}

.tm-family-site:hover {
    border-color: #ffffff;
}

.tm-triangle-down {
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 7px solid #ffffff;
    display: inline-block;
}

.tm-back-to-top {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #ffffff;
    text-decoration: none;
    font-size: calc((12px) + 1px);
    font-weight: 600;
    cursor: pointer;
}

.tm-back-btn-circle {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    border: 1.5px solid #666666;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s;
}

.tm-back-btn-circle i {
    font-size: calc((14px) + 1px);
    color: #ffffff;
}

.tm-back-to-top:hover .tm-back-btn-circle {
    border-color: #ffffff;
    background-color: #222222;
}

.tm-footer-sub-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 10px;
    font-size: calc((12px) + 1px);
    color: #777777;
}

.tm-sub-slogan {
    letter-spacing: 2px;
    text-transform: uppercase;
    font-size: calc((10px) + 1px);
    font-weight: 600;
    margin-left: auto;
    text-align: right;
}

/* --- RESPONSIVE DESIGN --- */
@media (max-width: 1100px) {
    .tm-footer-top {
        grid-template-columns: 1fr 1fr;
        gap: 35px;
    }
    .tm-pattern-col {
        display: none;
    }
    .tm-social-col {
        justify-self: start;
    }
}

@media (max-width: 768px) {
    .tm-footer-wrapper {
        padding: 40px 20px 30px 20px;
    }

    .tm-footer-top {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .tm-slogan-col {
        border-left: none;
        padding-left: 0;
    }

    .tm-footer-bottom {
        flex-direction: column;
        align-items: flex-start;
    }

    .tm-bottom-right-action {
        width: 100%;
        flex-direction: column;
        align-items: flex-start;
    }

    .tm-family-site {
        width: 100%;
        box-sizing: border-box;
    }

    .tm-footer-sub-bottom {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
}

/* =========================================================
   HOMEPAGE SECTION SYSTEM — v1.1.69
   Single source of truth for section spacing and intro type.
   Keeps special visual layouts intact while making every
   standard label → title → description rhythm consistent.
   ========================================================= */
:root {
    --px-section-space: 72px;
    --px-section-gap: 20px;
    --px-section-label-gap: 16px;
    --px-section-description-gap: 18px;
    --px-section-label-size: 11px;
    --px-section-title-size: 48px;
    --px-section-description-size: 16px;
    --px-section-title-line: 1.08;
    --px-section-description-line: 1.55;
}

/* Equal outer spacing for every homepage section after Hero. */
body.home main > section {
    margin-top: 0;
    margin-bottom: 0;
}
body.home main > .px-hero + section,
body.home main > section:not(.px-hero) + section {
    margin-top: var(--px-section-gap);
}

body.home
    main
    > section:not(.px-hero):not(.px-hero-quote-grid):not(.px-kinetic-showcase):not(.px-portfolio-mosaic) {
    padding-top: var(--px-section-space);
    padding-bottom: var(--px-section-space);
}

/* Standard section label. */
body.home main .px-eyebrow,
body.home main .px-trusted-strip-label {
    margin: 0 0 var(--px-section-label-gap);
    color: rgba(255, 255, 255, 0.78);
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((var(--px-section-label-size)) + 1px);
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0.22em;
    text-transform: uppercase;
}
body.home main .px-trusted-strip-label-row {
    margin-bottom: var(--px-section-label-gap);
}
body.home main .px-trusted-strip-label-row .px-trusted-strip-label {
    margin-bottom: 0;
}

/* Standard section title. */
body.home main .px-section h2,
body.home main .px-about-cinematic h2,
body.home main .px-faq-title,
body.home main .px-final h2,
body.home main .px-trusted-strip-title {
    margin: 0;
    color: #efefef;
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((var(--px-section-title-size)) + 1px);
    font-weight: 900;
    line-height: var(--px-section-title-line);
    letter-spacing: -1px;
    overflow-wrap: break-word;
}

/* Standard section description. */
body.home main .px-section .px-lead,
body.home main .px-section-head > p,
body.home main .px-why-intro,
body.home main .px-about-intro,
body.home main .px-faq-intro,
body.home main .px-final > .px-wrap > p,
body.home main .px-trusted-strip-description {
    max-width: 760px;
    margin-top: var(--px-section-description-gap);
    margin-bottom: 0;
    color: #e8e8e8;
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((var(--px-section-description-size)) + 1px);
    font-weight: 400;
    line-height: var(--px-section-description-line);
}

/* Remove legacy one-off heading margins that caused drift. */
body.home main .px-about-cinematic-copy > h2,
body.home main .px-why-head > h2,
body.home main .px-section-head > h2,
body.home main .px-cinematic-testimonials > .px-wrap > h2,
body.home main .px-faq-title,
body.home main .px-final h2 {
    margin-bottom: 0;
}

/* Products uses the same vertical intro rhythm as every other section. */
body.home main .px-section-head {
    display: block;
    margin-top: 0;
    margin-bottom: 42px;
}
body.home main .px-section-head > h2,
body.home main .px-section-head > p {
    max-width: 760px;
}

/* Keep section-specific alignment, but not section-specific spacing. */
body.home main .px-why-head {
    margin-top: 0;
    margin-bottom: 42px;
}
body.home main .px-about-content .px-eyebrow,
body.home main .px-why-head .px-eyebrow,
body.home main .px-faq-section .px-eyebrow {
    margin-bottom: var(--px-section-label-gap);
    letter-spacing: 0.22em;
}
body.home main .px-testimonial-grid,
body.home main .px-faq-list {
    margin-top: 42px;
}
body.home main .px-faq-title {
    max-width: 760px;
}

/* Trusted section follows the exact same typography and vertical rhythm. */
body.home main .px-trusted-strip-inner {
    padding-top: 0;
    padding-bottom: 0;
}
body.home main .px-trusted-strip-head {
    max-width: 860px;
    margin: 0 0 42px;
}
body.home main .px-trusted-strip-title,
body.home main .px-trusted-strip-description {
    white-space: normal;
}

/* Prevent trailing child margins from creating unequal section bottoms. */
body.home main > section:not(.px-hero) > :last-child,
body.home main > section:not(.px-hero) > .px-wrap > :last-child {
    margin-bottom: 0;
}

@media (max-width: 1024px) {
    :root {
        --px-section-space: 56px;
        --px-section-title-size: 40px;
    }
}

@media (max-width: 767px) {
    :root {
        --px-section-space: 44px;
        --px-section-gap: 16px;
        --px-section-label-gap: 14px;
        --px-section-description-gap: 16px;
        --px-section-label-size: 10px;
        --px-section-title-size: 32px;
        --px-section-description-size: 15px;
    }

    body.home main .px-section-head,
    body.home main .px-why-head,
    body.home main .px-trusted-strip-head {
        margin-bottom: 32px;
    }
    body.home main .px-testimonial-grid,
    body.home main .px-faq-list {
        margin-top: 32px;
    }
}

/* =========================================================
   FOOTER SYSTEM — v1.1.93
   Consolidated footer rules. Replaces the accumulated v1.1.70–v1.1.92
   override stack with one predictable desktop/mobile layout.
   ========================================================= */

/* WordPress template-part boundary: no phantom spacing around footer. */
body .wp-site-blocks > .four-my-theme-footer-part,
.four-my-theme-footer-part,
.four-my-theme-footer-part > .wp-block-shortcode {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
    min-height: 0;
    height: auto;
}

.tm-footer-wrapper {
    --tm-footer-x: 40px;
    --tm-footer-top-y: 18px;
    --tm-footer-text: 15px;
    --tm-footer-muted: #8a8a8a;
    --tm-footer-line: #333333;
    width: 100%;
    margin: 0;
    padding: 0 var(--tm-footer-x) 24px;
    box-sizing: border-box;
    overflow: hidden;
    background: #000;
    color: #fff;
}

.tm-footer-container {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 0;
}

.tm-footer-top {
    display: grid;
    grid-template-columns: 360px 260px minmax(120px, 1fr) auto;
    align-items: start;
    column-gap: 30px;
    row-gap: 0;
    margin: 0;
    padding: var(--tm-footer-top-y) 0 12px;
    min-height: 0;
    height: auto;
    background: #000;
}

.tm-brand-col,
.tm-slogan-col,
.tm-pattern-col,
.tm-social-col {
    min-width: 0;
    min-height: 0;
    height: auto;
    margin: 0;
}

.tm-brand-col {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.tm-logo {
    margin: 0;
    color: #fff;
    font-size: calc((34px) + 1px);
    font-weight: 900;
    line-height: 1;
    letter-spacing: 2px;
}
.tm-logo span {
    font-size: calc((16px) + 1px);
    font-weight: 400;
    vertical-align: super;
}
.tm-tagline {
    margin: 0;
    color: #fff;
    font-size: calc((13px) + 1px);
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: 2px;
    text-transform: uppercase;
}
.tm-brand-desc {
    margin: 0;
    color: #a0a0a0;
    font-size: calc((15px) + 1px);
    line-height: 1.5;
}

.tm-slogan-col {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding-left: 25px;
    border-left: 1.5px solid #444;
}
.tm-number-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 6px;
    color: #888;
    font-size: calc((14px) + 1px);
    font-weight: 600;
}
.tm-number-badge::before,
.tm-number-badge::after {
    content: "";
    width: 16px;
    height: 1px;
    background: #666;
}
.tm-slogan-title,
.tm-slogan-subtitle {
    margin: 0;
    font-size: calc((22px) + 1px);
    font-weight: 900;
    line-height: 1.08;
    letter-spacing: 1px;
    text-transform: uppercase;
}
.tm-slogan-title {
    color: #fff;
}
.tm-slogan-subtitle {
    color: #666;
}

.tm-family-site {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 210px;
    min-height: 44px;
    box-sizing: border-box;
    padding: 10px 18px;
    border: 1.5px solid #666;
    color: #fff;
    font-size: calc((14px) + 1px);
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: 1px;
    text-decoration: none;
    transition: border-color 0.2s ease;
}
.tm-family-site:hover {
    border-color: #fff;
}
.tm-family-site-desktop {
    margin-top: 18px;
}
.tm-family-site-mobile {
    display: none;
}

.tm-pattern-col {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 10px;
    opacity: 0.35;
}
.tm-pattern-svg {
    width: 100%;
    max-width: 280px;
    height: 64px;
}

.tm-social-col {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-self: end;
    gap: 2px;
}
.tm-social-icons {
    display: flex;
    align-items: center;
    gap: 9px;
}
.tm-social-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: calc((22px) + 1px);
    line-height: 1;
    text-decoration: none;
    transition:
        opacity 0.2s ease,
        transform 0.2s ease;
}
.tm-social-link i {
    display: block;
    color: #fff;
    pointer-events: none;
}
.tm-social-link:hover {
    opacity: 0.8;
    transform: translateY(-2px);
}
.tm-social-text {
    margin: -2px 0 0;
    color: #888;
    font-size: calc((13px) + 1px);
    font-weight: 600;
    line-height: 1.1;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.tm-divider-horizontal {
    width: 100%;
    height: 1px;
    margin: 4px 0 8px;
    background: var(--tm-footer-line);
}

.tm-footer-bottom {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    column-gap: 24px;
    margin: 0;
    min-height: 0;
}
.tm-nav-links {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0;
    min-width: 0;
    white-space: nowrap;
}
.tm-nav-links a {
    color: #ddd;
    font-size: calc((15px) + 1px);
    line-height: 1.25;
    text-decoration: none;
    transition: color 0.2s ease;
}
.tm-nav-links a:hover {
    color: #fff;
}
.tm-nav-separator {
    padding: 0 8px;
    color: rgba(255, 255, 255, 0.88);
    font-size: calc((14px) + 1px);
    font-weight: 700;
    line-height: 1;
}

.tm-bottom-right-action {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-left: auto;
}
.tm-back-to-top {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    color: #fff;
    font-size: calc((14px) + 1px);
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
    cursor: pointer;
}
.tm-back-btn-circle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: 1.5px solid #666;
    border-radius: 50%;
    transition:
        border-color 0.2s ease,
        background-color 0.2s ease;
}
.tm-back-btn-circle i {
    color: #fff;
    font-size: calc((14px) + 1px);
}
.tm-back-to-top:hover .tm-back-btn-circle {
    border-color: #fff;
    background: #222;
}

.tm-footer-sub-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: -40px;
    color: #777;
    font-size: calc((14px) + 1px);
    line-height: 1.3;
    pointer-events: none;
}
.tm-sub-slogan {
    margin-left: auto;
    color: #777;
    font-size: calc((12px) + 1px);
    font-weight: 600;
    letter-spacing: 2px;
    text-align: right;
    text-transform: uppercase;
}

.tm-triangle-down {
    display: inline-block;
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 7px solid #fff;
}

@media (max-width: 1100px) and (min-width: 901px) {
    .tm-footer-top {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        row-gap: 24px;
    }
    .tm-pattern-col {
        display: none;
    }
    .tm-social-col {
        justify-self: start;
    }
    .tm-footer-sub-bottom {
        margin-top: 10px;
    }
}

@media (max-width: 900px) {
    .tm-footer-wrapper {
        --tm-footer-x: 18px;
        /* v1.1.97: slightly more breathing room between the top divider and TEMAGUE on mobile. */
        --tm-footer-top-y: 18px;
        padding-bottom: 22px;
    }

    .tm-footer-top {
        grid-template-columns: minmax(0, 1fr);
        grid-auto-rows: max-content;
        row-gap: 18px;
        padding: var(--tm-footer-top-y) 0 16px;
    }

    .tm-brand-col,
    .tm-slogan-col,
    .tm-social-col {
        transform: none;
        margin: 0;
        padding-top: 0;
    }

    .tm-pattern-col {
        display: none;
    }

    .tm-slogan-col {
        padding-left: 0;
        border-left: 0;
    }

    .tm-family-site-desktop {
        display: flex;
        width: 100%;
        margin-top: 18px;
    }
    .tm-family-site-mobile {
        display: none;
    }

    .tm-social-col {
        justify-self: start;
        align-items: flex-start;
    }
    .tm-social-icons {
        gap: 18px;
    }
    .tm-social-text {
        margin-top: 0;
    }

    .tm-divider-horizontal {
        margin: 6px 0 14px;
    }

    .tm-footer-bottom {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 18px;
    }

    .tm-nav-links {
        width: 100%;
        overflow: visible;
    }
    .tm-nav-links a {
        flex: 0 0 auto;
        font-size: calc((18px) + 1px);
        font-weight: 700;
        letter-spacing: -0.55px;
    }
    .tm-nav-separator {
        flex: 0 0 auto;
        padding: 0 8px;
        font-size: calc((19px) + 1px);
    }

    .tm-bottom-right-action {
        width: 100%;
        justify-content: flex-start;
        margin: 0;
    }

    .tm-footer-sub-bottom {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
        margin-top: 18px;
        padding: 0;
        pointer-events: auto;
    }
    .tm-sub-slogan {
        margin: 0;
        text-align: left;
    }
}

@media (max-width: 430px) {
    .tm-footer-wrapper {
        --tm-footer-x: 14px;
    }
    .tm-nav-links a {
        font-size: calc((16px) + 1px);
        letter-spacing: -0.7px;
    }
    .tm-nav-separator {
        padding: 0 5px;
        font-size: calc((17px) + 1px);
    }
}

/* v1.1.94 — mobile footer bottom order
   Legal links -> copyright -> slogan -> Back to top. */
.tm-back-to-top-mobile {
    display: none;
}

@media (max-width: 900px) {
    .tm-footer-bottom .tm-back-to-top {
        display: none;
    }

    .tm-footer-bottom {
        gap: 0;
    }

    .tm-footer-sub-bottom {
        width: 100%;
        align-items: center;
        gap: 8px;
        margin-top: 14px;
        text-align: center;
    }

    .tm-footer-sub-bottom > div:first-child {
        width: 100%;
        text-align: center;
    }

    .tm-footer-sub-bottom .tm-sub-slogan {
        width: 100%;
        margin: 0;
        text-align: center;
    }

    .tm-footer-sub-bottom .tm-back-to-top-mobile {
        display: flex;
        width: max-content;
        margin: 6px auto 0;
        justify-content: center;
    }
}

/* v1.1.95 — mobile footer bottom: compact, left aligned */
@media (max-width: 900px) {
    .tm-footer-bottom {
        align-items: flex-start;
    }

    .tm-footer-sub-bottom {
        width: 100%;
        align-items: flex-start;
        gap: 4px;
        margin-top: 5px;
        padding: 0;
        text-align: left;
    }

    .tm-footer-sub-bottom > div:first-child,
    .tm-footer-sub-bottom .tm-sub-slogan {
        width: auto;
        margin: 0;
        text-align: left;
    }

    .tm-footer-sub-bottom .tm-back-to-top-mobile {
        display: flex;
        width: max-content;
        margin: 2px 0 0;
        justify-content: flex-start;
    }
}

/* v1.1.96 — mobile footer: remove the empty action row between legal links and copyright.
   On mobile both Family Site and desktop Back-to-top are hidden inside
   .tm-bottom-right-action, so the wrapper itself must not participate in layout. */
@media (max-width: 900px) {
    .tm-footer-bottom > .tm-bottom-right-action {
        display: none;
    }

    .tm-footer-bottom {
        gap: 0;
    }

    .tm-footer-sub-bottom {
        margin-top: 6px;
        gap: 4px;
    }
}

/* =========================================================
   AVAILABLE DESIGNS — exclusive ready-made collection
   ========================================================= */
.px-available-designs {
    background: #f2f2ee;
    color: #090909;
    padding: clamp(58px, 6vw, 94px) 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.16);
}
.px-available-wrap {
    width: min(calc(100% - 64px), var(--px-max));
    margin: 0 auto;
}
.px-available-head {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(280px, 0.6fr);
    gap: clamp(36px, 7vw, 110px);
    align-items: end;
    margin-bottom: clamp(38px, 5vw, 72px);
}
.px-available-label {
    margin: 0 0 18px;
    font:
        700 11px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.2em;
    color: #555;
    text-transform: uppercase;
}
.px-available-head h2 {
    margin: 0;
    max-width: 900px;
    font:
        900 clamp(42px, 6vw, 92px)/0.92 "Nunito Sans",
        sans-serif;
    letter-spacing: -0.06em;
    text-transform: uppercase;
}
.px-available-intro {
    margin: 0 0 5px;
    max-width: 500px;
    font:
        400 clamp(14px, 1.1vw, 17px)/1.7 "Nunito Sans",
        sans-serif;
    color: #555;
}
.px-available-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}
.px-available-card {
    min-width: 0;
}
.px-available-media {
    position: relative;
    display: block;
    overflow: hidden;
    aspect-ratio: 4/5;
    background: #111;
    color: #fff;
}
.px-available-media img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition:
        transform 0.7s cubic-bezier(0.2, 0.7, 0.2, 1),
        filter 0.4s ease;
    filter: saturate(0.78) contrast(1.04);
}
.px-available-media:after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.06), transparent 52%, rgba(0, 0, 0, 0.4));
    pointer-events: none;
}
.px-available-media:hover img {
    transform: scale(1.065);
    filter: saturate(1) contrast(1.02);
}
.px-available-status {
    position: absolute;
    z-index: 2;
    top: 18px;
    left: 18px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 11px;
    background: #080808;
    color: #fff;
    font:
        700 10px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.14em;
}
.px-available-status i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #7cff6b;
}
.px-available-open {
    position: absolute;
    z-index: 2;
    right: 18px;
    bottom: 16px;
    font:
        400 28px/1 "Nunito Sans",
        sans-serif;
    color: #7cff6b;
}
.px-available-meta {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: flex-start;
    padding: 18px 2px 4px;
    border-top: 1px solid #111;
}
.px-available-meta p {
    margin: 0 0 6px;
    font:
        700 9px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.16em;
    color: #777;
}
.px-available-meta h3 {
    margin: 0;
    font:
        800 clamp(17px, 1.5vw, 22px)/1.15 "Nunito Sans",
        sans-serif;
    letter-spacing: -0.025em;
}
.px-available-meta strong {
    white-space: nowrap;
    font:
        800 clamp(16px, 1.35vw, 20px)/1.15 Nunito Sans,
        sans-serif;
}
.px-available-bottom {
    margin-top: clamp(34px, 4vw, 58px);
    padding-top: 20px;
    border-top: 1px solid #111;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
}
.px-available-bottom a {
    display: inline-flex;
    align-items: center;
    gap: 16px;
    color: #090909;
    text-decoration: none;
    font:
        800 12px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.12em;
}
.px-available-bottom a span {
    font-size: calc((22px) + 1px);
    color: #7cff6b;
}
.px-available-bottom p {
    margin: 0;
    font:
        700 10px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.16em;
    color: #777;
}
.px-available-bottom p span {
    color: #7cff6b;
    margin: 0 7px;
}
@media (max-width: 900px) {
    .px-available-wrap {
        width: min(calc(100% - 40px), var(--px-max));
    }
    .px-available-head {
        grid-template-columns: 1fr;
    }
    .px-available-intro {
        max-width: 650px;
    }
    .px-available-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .px-available-card:last-child {
        grid-column: 1/-1;
    }
    .px-available-card:last-child .px-available-media {
        aspect-ratio: 16/9;
    }
}
@media (max-width: 640px) {
    .px-available-designs {
        padding: 46px 0;
    }
    .px-available-wrap {
        width: min(calc(100% - 30px), var(--px-max));
    }
    .px-available-head {
        gap: 22px;
        margin-bottom: 34px;
    }
    .px-available-head h2 {
        font-size: calc((clamp(38px, 12vw, 56px)) + 1px);
    }
    .px-available-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    .px-available-card:last-child {
        grid-column: auto;
    }
    .px-available-media,
    .px-available-card:last-child .px-available-media {
        aspect-ratio: 4/5;
    }
    .px-available-bottom {
        align-items: flex-start;
        flex-direction: column;
    }
    .px-available-bottom p {
        line-height: 1.5;
    }
}
nn/* v1.2.02 — bidirectional reveal motion for homepage sections added/updated in the exclusive-design flow. */
.px-scroll-motion [data-motion-item] {
    opacity: 0;
    transform: translate3d(0, 34px, 0) scale(0.985);
    filter: blur(4px);
    transition:
        opacity 0.62s ease,
        transform 0.82s cubic-bezier(0.2, 0.75, 0.2, 1),
        filter 0.62s ease;
    will-change: opacity, transform, filter;
}
.px-scroll-motion.motion-from-above [data-motion-item] {
    transform: translate3d(0, -34px, 0) scale(0.985);
}
.px-scroll-motion.is-motion-visible [data-motion-item] {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    filter: blur(0);
}
@media (prefers-reduced-motion: reduce) {
    .px-scroll-motion [data-motion-item] {
        opacity: 1;
        transform: none;
        filter: none;
        transition: none;
    }
}

/* v1.2.03 — floating contact + hero stamp refinement */
/* Keep only the contact control and use a conventional edge offset. */
.px-floating-contact-stack {
    right: 16px;
    width: auto;
    max-width: none;
    gap: 0;
}
.px-floating-promo-badge,
.px-floating-promo-spin,
.px-floating-promo-text {
    display: none;
}
/* Lower the rotating hero stamp so its centre sits alongside the hero description. */
@media (min-width: 901px) {
    .px-tech-ad-stamp {
        top: calc(50% + 112px);
        transform: translateY(-50%);
        right: 4vw;
    }
}
@media (max-width: 900px) {
    .px-tech-ad-stamp {
        top: calc(50% + 94px);
        transform: translateY(-50%);
    }
}
@media (max-width: 480px) {
    .px-floating-contact-stack {
        right: 10px;
    }
}

/* v1.2.04 — final floating contact + hero stamp alignment */
.px-floating-contact-stack {
    right: 6px;
}
@media (max-width: 480px) {
    .px-floating-contact-stack {
        right: 4px;
    }
}
/* JS aligns the stamp vertically with the hero CTA; keep it anchored on the right. */
@media (min-width: 621px) {
    .px-tech-ad-stamp {
        right: 4vw;
    }
}

/* v1.2.05 — hero CTA points to Available Designs; stamp sits one level above CTA and rotates continuously. */
.px-tech-cta {
    align-items: center;
    gap: 12px;
    scroll-behavior: smooth;
}
.px-tech-cta-arrow {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: square;
    stroke-linejoin: miter;
    transform: rotate(45deg);
    transition: transform 0.25s ease;
}
.px-tech-cta:hover .px-tech-cta-arrow,
.px-tech-cta:focus-visible .px-tech-cta-arrow {
    transform: rotate(45deg) translate(2px, 2px);
}
.px-tech-ad-stamp {
    animation: pxTechStamp 12s linear infinite;
    transform-origin: 50% 50%;
}
@media (prefers-reduced-motion: reduce) {
    .px-tech-ad-stamp {
        animation: none;
    }
}
html {
    scroll-behavior: smooth;
}

/* v1.2.06 — hero stamp horizontal refinement + explicit bidirectional motion for the three post-hero sections. */
@media (min-width: 621px) {
    .px-tech-ad-stamp {
        right: 8vw;
    }
}
.px-exclusive-manifesto.px-scroll-motion [data-motion-item],
.px-available-designs.px-scroll-motion [data-motion-item],
.px-hero-quote-grid.px-scroll-motion [data-motion-item] {
    opacity: 0;
    transform: translate3d(0, 36px, 0) scale(0.985);
    filter: blur(4px);
    transition:
        opacity 0.62s ease,
        transform 0.82s cubic-bezier(0.2, 0.75, 0.2, 1),
        filter 0.62s ease;
}
.px-exclusive-manifesto.px-scroll-motion.motion-from-above [data-motion-item],
.px-available-designs.px-scroll-motion.motion-from-above [data-motion-item],
.px-hero-quote-grid.px-scroll-motion.motion-from-above [data-motion-item] {
    transform: translate3d(0, -36px, 0) scale(0.985);
}
.px-exclusive-manifesto.px-scroll-motion.is-motion-visible [data-motion-item],
.px-available-designs.px-scroll-motion.is-motion-visible [data-motion-item],
.px-hero-quote-grid.px-scroll-motion.is-motion-visible [data-motion-item] {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    filter: blur(0);
}
@media (prefers-reduced-motion: reduce) {
    .px-exclusive-manifesto.px-scroll-motion [data-motion-item],
    .px-available-designs.px-scroll-motion [data-motion-item],
    .px-hero-quote-grid.px-scroll-motion [data-motion-item] {
        opacity: 1;
        transform: none;
        filter: none;
        transition: none;
    }
}

/* v1.2.07 — contact edge position + refined south-east CTA arrow. */
.px-floating-contact-stack {
    right: 0;
}
@media (max-width: 480px) {
    .px-floating-contact-stack {
        right: 0;
    }
}
.px-tech-cta-arrow {
    width: 21px;
    height: 21px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.65;
    stroke-linecap: round;
    stroke-linejoin: round;
    transform: none;
    transition: transform 0.28s cubic-bezier(0.2, 0.75, 0.2, 1);
}
.px-tech-cta:hover .px-tech-cta-arrow,
.px-tech-cta:focus-visible .px-tech-cta-arrow {
    transform: translate(3px, 2px);
}

/* v1.2.08 — hero stamp further left + outlined DESIGN word in section 01. */
@media (min-width: 621px) {
    .px-tech-ad-stamp {
        right: 12vw;
    }
}
.px-exclusive-manifesto .px-exclusive-design-outline {
    color: transparent;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 1.5px #f4f4f2;
    text-stroke: 1.5px #f4f4f2;
    font: inherit;
    letter-spacing: inherit;
}
@media (max-width: 640px) {
    .px-exclusive-manifesto .px-exclusive-design-outline {
        -webkit-text-stroke-width: 1px;
        text-stroke-width: 1px;
    }
}

/* v1.2.10 — footer services dropdown */
.tm-services-menu {
    position: relative;
    cursor: pointer;
}
.tm-services-menu summary {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: 100%;
    padding: 0 22px;
    box-sizing: border-box;
}
.tm-services-menu summary::-webkit-details-marker {
    display: none;
}
.tm-services-dropdown {
    position: absolute;
    left: 0;
    bottom: calc(100% + 8px);
    z-index: 30;
    min-width: 100%;
    background: #000;
    border: 1px solid #666;
    padding: 8px 0;
    box-sizing: border-box;
}
.tm-services-dropdown a {
    display: block;
    padding: 11px 18px;
    color: #fff;
    text-decoration: none;
    white-space: nowrap;
    font-size: calc((12px) + 1px);
    letter-spacing: 0.08em;
}
.tm-services-dropdown a:hover {
    background: #151515;
}
.tm-services-menu[open] .tm-triangle-down {
    transform: rotate(180deg);
}
.tm-copyright-site {
    color: inherit;
    text-decoration: none;
}
.tm-copyright-site:hover {
    color: #fff;
}

/* v1.2.12 — footer services dropdown: prevent clipping by footer wrapper */
.tm-footer-wrapper,
.tm-footer-container,
.tm-footer-top,
.tm-slogan-col {
    overflow: visible;
}
.tm-services-menu {
    overflow: visible;
    z-index: 40;
}
.tm-services-menu[open] {
    z-index: 80;
}
.tm-services-dropdown {
    z-index: 90;
}
@media (max-width: 900px) {
    .tm-footer-wrapper,
    .tm-footer-container,
    .tm-footer-top,
    .tm-slogan-col {
        overflow: visible;
    }
}

/* v1.2.13 — premium editorial motion showcase */
.px-premium-motion {
    position: relative;
    overflow: hidden;
    background: #050505;
    color: #fff;
    border-top: 1px solid rgba(255, 255, 255, 0.14);
    border-bottom: 1px solid rgba(255, 255, 255, 0.14);
}
.px-premium-motion__frame {
    position: relative;
    max-width: 1600px;
    margin: 0 auto;
    padding: clamp(58px, 6.5vw, 104px) clamp(22px, 4vw, 64px) 0;
}
.px-premium-motion__meta {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    padding-bottom: 18px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.18);
    font-size: calc((11px) + 1px);
    font-weight: 800;
    letter-spacing: 0.18em;
    color: #a8a8a8;
}
.px-premium-motion__grid {
    display: grid;
    grid-template-columns: minmax(0, 0.82fr) minmax(520px, 1.18fr);
    gap: clamp(42px, 6vw, 110px);
    align-items: center;
    min-height: clamp(620px, 68vw, 900px);
    padding: clamp(54px, 6vw, 90px) 0;
}
.px-premium-motion__copy {
    position: relative;
    z-index: 5;
    align-self: center;
}
.px-premium-motion__kicker {
    margin: 0 0 26px;
    color: #72ff62;
    font-size: calc((12px) + 1px);
    font-weight: 900;
    letter-spacing: 0.19em;
}
.px-premium-motion__copy h2 {
    margin: 0;
    font-size: calc((clamp(64px, 7.6vw, 128px)) + 1px);
    line-height: 0.78;
    letter-spacing: -0.075em;
    font-weight: 900;
    text-transform: uppercase;
}
.px-premium-motion__copy h2 span {
    display: block;
    white-space: nowrap;
}
.px-premium-motion__copy h2 .is-outline {
    color: transparent;
    -webkit-text-stroke: 1.5px rgba(255, 255, 255, 0.88);
    text-stroke: 1.5px rgba(255, 255, 255, 0.88);
}
.px-premium-motion__copy h2 .is-accent {
    color: #72ff62;
}
.px-premium-motion__lead {
    max-width: 560px;
    margin: 38px 0 0;
    font-size: calc((clamp(16px, 1.45vw, 22px)) + 1px);
    line-height: 1.55;
    color: #aaa;
}
.px-premium-motion__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 34px;
}
.px-premium-motion__tags span {
    padding: 8px 11px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    font-size: calc((9px) + 1px);
    font-weight: 850;
    letter-spacing: 0.14em;
    color: #ddd;
}
.px-premium-motion__visual {
    position: relative;
    height: clamp(520px, 48vw, 720px);
    isolation: isolate;
}
.px-premium-motion__visual:before {
    content: "";
    position: absolute;
    inset: 7% 5% 8% 8%;
    border: 1px solid rgba(114, 255, 98, 0.22);
    z-index: -1;
    transform: rotate(-2deg);
}
.px-premium-motion__image {
    position: absolute;
    margin: 0;
    overflow: hidden;
    background: #111;
    border: 1px solid rgba(255, 255, 255, 0.18);
will-change: transform;
}
.px-premium-motion__image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: saturate(0.72) contrast(1.08);
    transition:
        filter 0.6s ease,
        transform 1.1s cubic-bezier(0.2, 0.75, 0.2, 1);
}
.px-premium-motion__image:hover img {
    filter: saturate(1) contrast(1.03);
    transform: scale(1.025);
}
.px-premium-motion__image figcaption {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 14px;
    background: rgba(0, 0, 0, 0.72);
    backdrop-filter: blur(8px);
    font-size: calc((9px) + 1px);
    font-weight: 850;
    letter-spacing: 0.12em;
}
.px-premium-motion__image--main {
    left: 9%;
    top: 10%;
    width: 66%;
    height: 68%;
    z-index: 2;
    animation: pxPremiumFloatMain 9s ease-in-out infinite alternate;
}
.px-premium-motion__image--top {
    right: 0;
    top: 0;
    width: 36%;
    height: 34%;
    z-index: 4;
    animation: pxPremiumFloatTop 8s ease-in-out infinite alternate;
}
.px-premium-motion__image--bottom {
    right: 3%;
    bottom: 0;
    width: 43%;
    height: 38%;
    z-index: 5;
    animation: pxPremiumFloatBottom 10s ease-in-out infinite alternate;
}
@keyframes pxPremiumFloatMain {
    to {
        transform: translate3d(-8px, 10px, 0);
    }
}
@keyframes pxPremiumFloatTop {
    to {
        transform: translate3d(-12px, 14px, 0) rotate(-1deg);
    }
}
@keyframes pxPremiumFloatBottom {
    to {
        transform: translate3d(10px, -12px, 0) rotate(1deg);
    }
}
.px-premium-motion__orbit {
    position: absolute;
    left: 0;
    bottom: 4%;
    width: 150px;
    height: 150px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 50%;
    z-index: 7;
    animation: pxPremiumSpin 20s linear infinite;
}
.px-premium-motion__orbit:after {
    content: "+";
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: #72ff62;
    font-size: calc((26px) + 1px);
    font-weight: 300;
}
.px-premium-motion__orbit span {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100%;
    height: 100%;
    font-size: calc((8px) + 1px);
    font-weight: 900;
    letter-spacing: 0.13em;
    color: #aaa;
    transform: translate(-50%, -50%);
    display: grid;
    place-items: start center;
    padding-top: 8px;
}
@keyframes pxPremiumSpin {
    to {
        transform: rotate(360deg);
    }
}
.px-premium-motion__ticker {
    margin-inline: calc(clamp(22px, 4vw, 64px) * -1);
    overflow: hidden;
    border-top: 1px solid rgba(255, 255, 255, 0.18);
    height: 58px;
    display: flex;
    align-items: center;
    background: #72ff62;
    color: #050505;
}
.px-premium-motion__ticker > div {
    display: flex;
    align-items: center;
    width: max-content;
    white-space: nowrap;
    animation: pxPremiumTicker 26s linear infinite;
}
.px-premium-motion__ticker span {
    font-size: calc((12px) + 1px);
    font-weight: 950;
    letter-spacing: 0.12em;
    padding: 0 28px;
}
.px-premium-motion__ticker i {
    font-style: normal;
    font-size: calc((13px) + 1px);
}
@keyframes pxPremiumTicker {
    to {
        transform: translateX(-50%);
    }
}
@media (max-width: 900px) {
    .px-premium-motion__grid {
        grid-template-columns: 1fr;
        min-height: 0;
        gap: 50px;
    }
    .px-premium-motion__copy h2 {
        font-size: calc((clamp(58px, 14vw, 104px)) + 1px);
    }
    .px-premium-motion__visual {
        height: min(112vw, 660px);
    }
    .px-premium-motion__image--main {
        left: 0;
        width: 70%;
    }
    .px-premium-motion__image--top {
        width: 39%;
    }
    .px-premium-motion__image--bottom {
        width: 48%;
    }
    .px-premium-motion__orbit {
        width: 116px;
        height: 116px;
        left: 3%;
    }
}
@media (max-width: 560px) {
    .px-premium-motion__frame {
        padding-top: 42px;
    }
    .px-premium-motion__meta {
        font-size: calc((8px) + 1px);
        letter-spacing: 0.12em;
    }
    .px-premium-motion__grid {
        padding: 44px 0 50px;
    }
    .px-premium-motion__copy h2 {
        font-size: calc((17vw) + 1px);
        line-height: 0.82;
    }
    .px-premium-motion__lead {
        margin-top: 28px;
        font-size: calc((15px) + 1px);
    }
    .px-premium-motion__visual {
        height: 125vw;
        max-height: 560px;
    }
    .px-premium-motion__image--main {
        top: 9%;
        width: 78%;
        height: 64%;
    }
    .px-premium-motion__image--top {
        width: 43%;
        height: 31%;
    }
    .px-premium-motion__image--bottom {
        width: 53%;
        height: 35%;
    }
    .px-premium-motion__orbit {
        bottom: 1%;
        width: 92px;
        height: 92px;
    }
    .px-premium-motion__ticker {
        height: 50px;
    }
    .px-premium-motion__ticker span {
        font-size: calc((10px) + 1px);
        padding: 0 20px;
    }
}
@media (prefers-reduced-motion: reduce) {
    .px-premium-motion__image,
    .px-premium-motion__orbit,
    .px-premium-motion__ticker > div {
        animation: none;
    }
}

/* v1.2.14 — kinetic feature lab: a full-motion capability showcase */
.px-feature-lab {
    position: relative;
    overflow: hidden;
    background: #020202;
    color: #fff;
    border-block: 1px solid rgba(255, 255, 255, 0.15);
}
.px-feature-lab__stage {
    position: relative;
    min-height: clamp(720px, 82vw, 1080px);
    overflow: hidden;
    isolation: isolate;
    background: radial-gradient(circle at 50% 50%, rgba(114, 255, 98, 0.08), transparent 28%), #020202;
}
.px-feature-lab__stage:before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px);
    background-size: 72px 72px;
    mask-image: linear-gradient(to bottom, transparent, #000 20%, #000 80%, transparent);
}
.px-feature-lab__topline {
    position: absolute;
    z-index: 20;
    top: 26px;
    left: clamp(20px, 4vw, 64px);
    right: clamp(20px, 4vw, 64px);
    display: flex;
    justify-content: space-between;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.22);
    font-size: calc((9px) + 1px);
    font-weight: 900;
    letter-spacing: 0.2em;
    color: #aaa;
}
.px-feature-lab__word {
    position: absolute;
    left: -8%;
    width: 116%;
    z-index: 1;
    overflow: hidden;
    white-space: nowrap;
    pointer-events: none;
}
.px-feature-lab__word div {
    width: max-content;
    font-size: calc((clamp(76px, 11.5vw, 190px)) + 1px);
    font-weight: 950;
    line-height: 0.8;
    letter-spacing: -0.065em;
    text-transform: uppercase;
}
.px-feature-lab__word--one {
    top: 13%;
    transform: rotate(-3deg);
}
.px-feature-lab__word--one div {
    color: #72ff62;
    animation: pxLabRunLeft 19s linear infinite;
}
.px-feature-lab__word--two {
    bottom: 14%;
    transform: rotate(2.2deg);
    z-index: 7;
}
.px-feature-lab__word--two div {
    color: transparent;
    -webkit-text-stroke: 1.5px rgba(255, 255, 255, 0.88);
    animation: pxLabRunRight 24s linear infinite;
}
@keyframes pxLabRunLeft {
    to {
        transform: translateX(-33.333%);
    }
}
@keyframes pxLabRunRight {
    from {
        transform: translateX(-33.333%);
    }
    to {
        transform: translateX(0);
    }
}
.px-feature-lab__canvas {
    position: absolute;
    inset: 9% clamp(20px, 4vw, 64px) 10%;
    perspective: 1300px;
    transform-style: preserve-3d;
}
.px-feature-lab__card {
    position: absolute;
    margin: 0;
    overflow: hidden;
    background: #111;
    border: 1px solid rgba(255, 255, 255, 0.3);
will-change: transform;
    transform-style: preserve-3d;
}
.px-feature-lab__card img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    filter: saturate(0.7) contrast(1.1);
    animation: pxLabImagePulse 8s ease-in-out infinite alternate;
}
.px-feature-lab__card span {
    position: absolute;
    left: 0;
    bottom: 0;
    padding: 10px 12px;
    background: #050505;
    color: #fff;
    font-size: calc((8px) + 1px);
    font-weight: 900;
    letter-spacing: 0.16em;
}
.px-feature-lab__card--a {
    left: 4%;
    top: 26%;
    width: 29%;
    height: 42%;
    z-index: 4;
    animation: pxLabA 8s ease-in-out infinite alternate;
}
.px-feature-lab__card--b {
    left: 36%;
    top: 13%;
    width: 24%;
    height: 32%;
    z-index: 5;
    animation: pxLabB 7s ease-in-out infinite alternate;
}
.px-feature-lab__card--c {
    right: 7%;
    top: 29%;
    width: 31%;
    height: 43%;
    z-index: 6;
    animation: pxLabC 9s ease-in-out infinite alternate;
}
.px-feature-lab__card--d {
    left: 43%;
    bottom: 5%;
    width: 20%;
    height: 27%;
    z-index: 8;
    animation: pxLabD 6.5s ease-in-out infinite alternate;
}
@keyframes pxLabA {
    to {
        transform: translate3d(16px, -18px, 55px) rotate(-2deg);
    }
}
@keyframes pxLabB {
    to {
        transform: translate3d(-13px, 22px, 90px) rotate(2.5deg);
    }
}
@keyframes pxLabC {
    to {
        transform: translate3d(-20px, -15px, 70px) rotate(1.5deg);
    }
}
@keyframes pxLabD {
    to {
        transform: translate3d(12px, -20px, 120px) rotate(-3deg);
    }
}
@keyframes pxLabImagePulse {
    to {
        transform: scale(1.055);
        filter: saturate(1) contrast(1.05);
    }
}
.px-feature-lab__core {
    position: absolute;
    z-index: 12;
    left: 50%;
    top: 50%;
    width: clamp(130px, 13vw, 210px);
    aspect-ratio: 1;
    transform: translate(-50%, -50%);
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #050505;
    border: 1px solid rgba(114, 255, 98, 0.55);
}
.px-feature-lab__core b {
    font-size: calc((clamp(28px, 3vw, 48px)) + 1px);
    font-weight: 300;
    color: #72ff62;
}
.px-feature-lab__ring {
    position: absolute;
    inset: 8px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 50%;
    animation: pxLabSpin 13s linear infinite;
}
.px-feature-lab__ring span {
    position: absolute;
    top: 6px;
    left: 50%;
    font-size: calc((7px) + 1px);
    font-weight: 900;
    letter-spacing: 0.16em;
    white-space: nowrap;
    transform: translateX(-50%);
}
@keyframes pxLabSpin {
    to {
        transform: rotate(360deg);
    }
}
.px-feature-lab__cross {
    position: absolute;
    z-index: 15;
    font-size: calc((32px) + 1px);
    font-weight: 200;
    color: #72ff62;
    animation: pxLabSpin 9s linear infinite;
}
.px-feature-lab__cross--a {
    left: 15%;
    bottom: 11%;
}
.px-feature-lab__cross--b {
    right: 13%;
    top: 10%;
    animation-direction: reverse;
}
.px-feature-lab__rail {
    position: absolute;
    z-index: 30;
    left: 0;
    right: 0;
    bottom: 0;
    height: 58px;
    overflow: hidden;
    display: flex;
    align-items: center;
    background: #72ff62;
    color: #050505;
    border-top: 1px solid #72ff62;
}
.px-feature-lab__rail > div {
    display: flex;
    align-items: center;
    width: max-content;
    white-space: nowrap;
    animation: pxLabRail 16s linear infinite;
}
.px-feature-lab__rail span {
    padding: 0 28px;
    font-size: calc((11px) + 1px);
    font-weight: 950;
    letter-spacing: 0.15em;
}
.px-feature-lab__rail i {
    font-style: normal;
    font-size: calc((18px) + 1px);
}
@keyframes pxLabRail {
    to {
        transform: translateX(-50%);
    }
}
@media (max-width: 760px) {
    .px-feature-lab__stage {
        min-height: 760px;
    }
    .px-feature-lab__topline {
        top: 20px;
        font-size: calc((7px) + 1px);
    }
    .px-feature-lab__word div {
        font-size: calc((21vw) + 1px);
    }
    .px-feature-lab__word--one {
        top: 14%;
    }
    .px-feature-lab__word--two {
        bottom: 17%;
    }
    .px-feature-lab__canvas {
        inset: 10% 18px 10%;
    }
    .px-feature-lab__card--a {
        left: 0;
        top: 28%;
        width: 54%;
        height: 32%;
    }
    .px-feature-lab__card--b {
        left: auto;
        right: 1%;
        top: 18%;
        width: 42%;
        height: 26%;
    }
    .px-feature-lab__card--c {
        right: 0;
        top: 52%;
        width: 55%;
        height: 31%;
    }
    .px-feature-lab__card--d {
        left: 8%;
        bottom: 7%;
        width: 36%;
        height: 22%;
    }
    .px-feature-lab__core {
        width: 118px;
        left: 51%;
        top: 48%;
    }
    .px-feature-lab__cross--a {
        left: 4%;
        bottom: 16%;
    }
    .px-feature-lab__cross--b {
        right: 4%;
        top: 12%;
    }
    .px-feature-lab__rail {
        height: 50px;
    }
    .px-feature-lab__rail span {
        font-size: calc((9px) + 1px);
        padding: 0 18px;
    }
}
@media (prefers-reduced-motion: reduce) {
    .px-feature-lab * {
        animation: none;
    }
}

/* v1.2.15 — scroll-driven immersive capability showcase */
.px-immersive-showcase {
    --p: 0;
    position: relative;
    height: 330vh;
    background: #020202;
    color: #fff;
}
.px-immersive-showcase__stage {
    position: sticky;
    top: 0;
    height: 100vh;
    min-height: 620px;
    overflow: hidden;
    isolation: isolate;
    background: radial-gradient(circle at 72% 42%, rgba(114, 255, 98, 0.11), transparent 24%), #020202;
}
.px-immersive-showcase__stage:before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px);
    background-size:
        8.333vw 100%,
        100% 25%;
    opacity: 0.6;
    pointer-events: none;
}
.px-immersive-showcase__hud,
.px-immersive-showcase__footer {
    position: absolute;
    z-index: 30;
    left: clamp(20px, 4vw, 64px);
    right: clamp(20px, 4vw, 64px);
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: calc((9px) + 1px);
    font-weight: 900;
    letter-spacing: 0.2em;
}
.px-immersive-showcase__hud {
    top: 26px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.25);
    color: #aaa;
}
.px-immersive-showcase__footer {
    bottom: 24px;
    color: #fff;
}
.px-immersive-showcase__footer span:first-child {
    color: #72ff62;
}
.px-immersive-showcase__scene {
    position: absolute;
    inset: 0;
    perspective: 1400px;
    transform-style: preserve-3d;
}
.px-immersive-showcase__ghost {
    position: absolute;
    z-index: 0;
    left: -2vw;
    top: 50%;
    transform: translateY(-50%);
    font-size: calc((clamp(150px, 28vw, 520px)) + 1px);
    line-height: 0.7;
    font-weight: 950;
    letter-spacing: -0.08em;
    color: transparent;
    -webkit-text-stroke: 1px rgba(255, 255, 255, 0.1);
    white-space: nowrap;
}
.px-immersive-card {
    position: absolute;
    z-index: 5;
    margin: 0;
    overflow: hidden;
    background: #111;
    border: 1px solid rgba(255, 255, 255, 0.32);
will-change: transform, opacity, clip-path;
    transform-style: preserve-3d;
}
.px-immersive-card img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    filter: saturate(0.72) contrast(1.08);
    transform: scale(1.06);
}
.px-immersive-card figcaption {
    position: absolute;
    left: 0;
    bottom: 0;
    padding: 10px 13px;
    background: #050505;
    font-size: calc((8px) + 1px);
    font-weight: 900;
    letter-spacing: 0.17em;
}
.px-immersive-card--1 {
    left: 12%;
    top: 16%;
    width: 48%;
    height: 68%;
}
.px-immersive-card--2 {
    left: 54%;
    top: 22%;
    width: 34%;
    height: 58%;
    opacity: 0;
}
.px-immersive-card--3 {
    left: 22%;
    top: 14%;
    width: 56%;
    height: 72%;
    opacity: 0;
}
.px-immersive-showcase__type {
    position: absolute;
    z-index: 12;
    inset: 0;
    pointer-events: none;
}
.px-immersive-showcase__type span {
    position: absolute;
    font-size: calc((clamp(72px, 11vw, 190px)) + 1px);
    font-weight: 950;
    line-height: 0.8;
    letter-spacing: -0.07em;
    white-space: nowrap;
}
.px-immersive-showcase__type span:nth-child(1) {
    left: 4%;
    top: 39%;
    color: #72ff62;
}
.px-immersive-showcase__type span:nth-child(2) {
    right: 4%;
    top: 39%;
    color: transparent;
    -webkit-text-stroke: 1.5px #fff;
    opacity: 0;
}
.px-immersive-showcase__type span:nth-child(3) {
    left: 50%;
    top: 39%;
    transform: translateX(-50%);
    opacity: 0;
}
.px-immersive-showcase__orb {
    position: absolute;
    z-index: 20;
    right: 7%;
    bottom: 11%;
    width: 132px;
    aspect-ratio: 1;
    border: 1px solid rgba(114, 255, 98, 0.65);
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: rgba(2, 2, 2, 0.82);
    backdrop-filter: blur(10px);
}
.px-immersive-showcase__orb span {
    position: absolute;
    top: 10px;
    font-size: calc((7px) + 1px);
    font-weight: 900;
    letter-spacing: 0.15em;
    animation: pxImmersiveSpin 12s linear infinite;
}
.px-immersive-showcase__orb b {
    color: #72ff62;
    font-size: calc((27px) + 1px);
    font-weight: 300;
}
@keyframes pxImmersiveSpin {
    to {
        transform: rotate(360deg);
    }
}
@media (max-width: 700px) {
    .px-immersive-showcase {
        height: 300vh;
    }
    .px-immersive-showcase__stage {
        min-height: 560px;
    }
    .px-immersive-showcase__hud {
        top: 18px;
        font-size: calc((7px) + 1px);
    }
    .px-immersive-showcase__footer {
        bottom: 18px;
        font-size: calc((7px) + 1px);
    }
    .px-immersive-card--1 {
        left: 8%;
        top: 19%;
        width: 72%;
        height: 58%;
    }
    .px-immersive-card--2 {
        left: 26%;
        top: 23%;
        width: 66%;
        height: 54%;
    }
    .px-immersive-card--3 {
        left: 10%;
        top: 18%;
        width: 80%;
        height: 61%;
    }
    .px-immersive-showcase__type span {
        font-size: calc((20vw) + 1px);
    }
    .px-immersive-showcase__type span:nth-child(1),
    .px-immersive-showcase__type span:nth-child(2),
    .px-immersive-showcase__type span:nth-child(3) {
        top: 43%;
    }
    .px-immersive-showcase__orb {
        width: 92px;
        right: 5%;
        bottom: 10%;
    }
}
@media (prefers-reduced-motion: reduce) {
    .px-immersive-showcase {
        height: auto;
    }
    .px-immersive-showcase__stage {
        position: relative;
        height: 760px;
    }
    .px-immersive-showcase__orb span {
        animation: none;
    }
}

/* v1.2.16 — immersive footer services reveal */
.tm-services-menu {
    isolation: isolate;
}
.tm-services-menu > summary {
    position: relative;
    z-index: 3;
    transition:
        color 0.35s ease,
        background 0.35s ease,
        border-color 0.35s ease;
}
.tm-services-menu > summary .tm-triangle-down {
    transition: transform 0.55s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.tm-services-dropdown {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    width: min(520px, calc(100vw - 40px));
    min-width: 360px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.22);
    background: rgba(4, 4, 4, 0.97);
backdrop-filter: blur(18px);
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(18px) scale(0.965);
    transform-origin: bottom left;
    transition:
        opacity 0.32s ease,
        transform 0.55s cubic-bezier(0.16, 1, 0.3, 1),
        visibility 0.32s ease;
}
.tm-services-menu[open] .tm-services-dropdown {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0) scale(1);
}
.tm-services-dropdown:before {
    content: "SELECT A SERVICE";
    display: block;
    padding: 16px 20px 13px;
    color: #72ff62;
    font-size: calc((9px) + 1px);
    font-weight: 900;
    letter-spacing: 0.22em;
    border-bottom: 1px solid rgba(255, 255, 255, 0.14);
}
.tm-services-dropdown a {
    position: relative;
    display: grid;
    grid-template-columns: 38px 1fr 26px;
    align-items: center;
    min-height: 66px;
    padding: 0 18px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
    color: #fff;
    font-size: calc((clamp(16px, 1.25vw, 20px)) + 1px);
    font-weight: 850;
    letter-spacing: -0.02em;
    white-space: normal;
    overflow: hidden;
    transition:
        color 0.3s ease,
        padding 0.4s cubic-bezier(0.16, 1, 0.3, 1),
        background 0.3s ease;
}
.tm-services-dropdown a:last-child {
    border-bottom: 0;
}
.tm-services-dropdown a:before {
    content: "0" counter(tmService);
    counter-increment: tmService;
    color: #777;
    font-size: calc((9px) + 1px);
    font-weight: 900;
    letter-spacing: 0.12em;
}
.tm-services-dropdown {
    counter-reset: tmService;
}
.tm-services-dropdown a:after {
    content: "↗";
    justify-self: end;
    color: #72ff62;
    font-size: calc((18px) + 1px);
    font-weight: 400;
    transform: translate(-5px, 5px);
    opacity: 0.6;
    transition:
        transform 0.4s cubic-bezier(0.16, 1, 0.3, 1),
        opacity 0.3s ease;
}
.tm-services-dropdown a:hover,
.tm-services-dropdown a:focus-visible {
    background: #72ff62;
    color: #050505;
    padding-left: 26px;
    outline: none;
}
.tm-services-dropdown a:hover:before,
.tm-services-dropdown a:focus-visible:before {
    color: #050505;
}
.tm-services-dropdown a:hover:after,
.tm-services-dropdown a:focus-visible:after {
    color: #050505;
    opacity: 1;
    transform: translate(0, 0);
}
.tm-services-menu[open] > summary {
    background: #72ff62;
    color: #050505;
}
.tm-services-menu[open] > summary .tm-triangle-down {
    transform: rotate(180deg);
}
@media (min-width: 901px) {
    .tm-services-dropdown {
        left: 0;
        bottom: calc(100% + 12px);
    }
}
@media (max-width: 900px) {
    .tm-services-dropdown {
        left: 0;
        bottom: calc(100% + 10px);
        width: min(440px, calc(100vw - 32px));
        min-width: 0;
    }
    .tm-services-dropdown a {
        min-height: 58px;
        font-size: calc((15px) + 1px);
    }
    .tm-services-dropdown:before {
        padding: 13px 16px 11px;
    }
}
@media (prefers-reduced-motion: reduce) {
    .tm-services-dropdown,
    .tm-services-dropdown a,
    .tm-services-dropdown a:after,
    .tm-services-menu > summary .tm-triangle-down {
        transition: none;
    }
}

/* v1.2.17 — creative-development playground + full-screen services experience */
.px-creative-lab {
    --mx: 50%;
    --my: 50%;
    --p: 0;
    position: relative;
    height: 260vh;
    background: #050505;
    color: #fff;
}
.px-creative-lab__sticky {
    position: sticky;
    top: 0;
    height: 100vh;
    min-height: 640px;
    overflow: hidden;
    isolation: isolate;
    background: #050505;
}
.px-creative-lab__sticky:before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(
        circle 260px at var(--mx) var(--my),
        rgba(124, 255, 107, 0.16),
        transparent 70%
    );
    z-index: 2;
}
.px-creative-lab__top,
.px-creative-lab__bottom {
    position: absolute;
    z-index: 30;
    left: 3vw;
    right: 3vw;
    display: flex;
    justify-content: space-between;
    font:
        800 9px/1.2 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.19em;
}
.px-creative-lab__top {
    top: 24px;
    border-bottom: 1px solid #555;
    padding-bottom: 13px;
    color: #aaa;
}
.px-creative-lab__bottom {
    bottom: 20px;
}
.px-creative-lab__bottom span:first-child {
    color: #7cff6b;
}
.px-creative-lab__word {
    position: absolute;
    z-index: 9;
    inset: 0;
    pointer-events: none;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2.2vw;
    font-weight: 950;
    font-size: calc((clamp(90px, 17vw, 300px)) + 1px);
    line-height: 0.72;
    letter-spacing: -0.085em;
    white-space: nowrap;
}
.px-creative-lab__word span {
    display: block;
    will-change: transform;
}
.px-creative-lab__word span:nth-child(2) {
    color: #7cff6b;
}
.px-creative-lab__word span:nth-child(3) {
    color: transparent;
    -webkit-text-stroke: 1.5px #fff;
}
.px-creative-lab__canvas {
    position: absolute;
    inset: 0;
    perspective: 1200px;
}
.px-lab-media {
    position: absolute;
    margin: 0;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.55);
will-change: transform, clip-path;
    transition: filter 0.35s ease;
}
.px-lab-media img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    filter: grayscale(1) contrast(1.15);
    transition:
        filter 0.5s,
        transform 0.7s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.px-lab-media:hover img {
    filter: grayscale(0);
    transform: scale(1.06);
}
.px-lab-media i {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, transparent 55%, rgba(124, 255, 107, 0.25));
    mix-blend-mode: screen;
}
.px-lab-media--a {
    left: 5%;
    top: 18%;
    width: 28vw;
    height: 52vh;
    z-index: 5;
}
.px-lab-media--b {
    right: 5%;
    top: 12%;
    width: 25vw;
    height: 34vh;
    z-index: 11;
}
.px-lab-media--c {
    right: 15%;
    bottom: 9%;
    width: 32vw;
    height: 34vh;
    z-index: 7;
}
.px-lab-lens {
    position: absolute;
    z-index: 25;
    left: var(--mx);
    top: var(--my);
    width: 118px;
    aspect-ratio: 1;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    border: 1px solid #7cff6b;
    background: rgba(5, 5, 5, 0.5);
    backdrop-filter: invert(0.9) grayscale(1);
    pointer-events: none;
    display: grid;
    place-items: center;
    transition: width 0.2s;
}
.px-lab-lens span {
    font-size: calc((8px) + 1px);
    font-weight: 900;
    letter-spacing: 0.18em;
}
.px-lab-lens b {
    position: absolute;
    right: 18px;
    bottom: 15px;
    color: #7cff6b;
    font-size: calc((20px) + 1px);
}
.px-creative-lab:hover .px-lab-lens {
    width: 138px;
}
.px-lab-cross {
    position: absolute;
    z-index: 20;
    font:
        200 44px/1 "Nunito Sans",
        sans-serif;
    color: #7cff6b;
}
.px-lab-cross--1 {
    left: 42%;
    top: 18%;
}
.px-lab-cross--2 {
    right: 8%;
    bottom: 27%;
    transform: rotate(45deg);
}
.px-creative-lab__rail {
    position: absolute;
    z-index: 20;
    left: 0;
    right: 0;
    bottom: 58px;
    border-top: 1px solid rgba(255, 255, 255, 0.25);
    border-bottom: 1px solid rgba(255, 255, 255, 0.25);
    overflow: hidden;
    padding: 8px 0;
    background: #050505;
}
.px-creative-lab__rail div {
    width: max-content;
    font-size: calc((10px) + 1px);
    font-weight: 900;
    letter-spacing: 0.22em;
    animation: pxLabRail 18s linear infinite;
}
@keyframes pxLabRail {
    to {
        transform: translateX(-50%);
    }
}
@media (max-width: 700px) {
    .px-creative-lab {
        height: 220vh;
    }
    .px-creative-lab__sticky {
        min-height: 560px;
    }
    .px-creative-lab__word {
        font-size: calc((22vw) + 1px);
        flex-direction: column;
        gap: 0;
        align-items: flex-start;
        padding-left: 7vw;
    }
    .px-lab-media--a {
        left: 8%;
        top: 17%;
        width: 55vw;
        height: 38vh;
    }
    .px-lab-media--b {
        right: 6%;
        top: 28%;
        width: 42vw;
        height: 25vh;
    }
    .px-lab-media--c {
        right: 8%;
        bottom: 17%;
        width: 58vw;
        height: 28vh;
    }
    .px-lab-lens {
        display: none;
    }
    .px-creative-lab__top span:last-child {
        display: none;
    }
}
@media (prefers-reduced-motion: reduce) {
    .px-creative-lab {
        height: auto;
    }
    .px-creative-lab__sticky {
        position: relative;
        height: 760px;
    }
    .px-creative-lab__rail div {
        animation: none;
    }
}

.tm-services-dropdown {
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100dvh;
    min-width: 0;
    padding: clamp(28px, 4vw, 64px);
    border: 0;
    background: #070707;
    z-index: 99999;
    overflow: auto;
    display: block;
    opacity: 0;
    visibility: hidden;
    transform: translateY(100%);
    transition:
        transform 0.65s cubic-bezier(0.76, 0, 0.24, 1),
        opacity 0.25s,
        visibility 0.65s;
    box-sizing: border-box;
}
.tm-services-menu[open] .tm-services-dropdown {
    opacity: 1;
    visibility: visible;
    transform: none;
}
.tm-services-menu[open] summary {
    position: relative;
    z-index: 100000;
}
.tm-services-close {
    position: absolute;
    right: clamp(24px, 4vw, 64px);
    top: clamp(24px, 4vw, 54px);
    border: 0;
    background: none;
    color: #fff;
    font:
        800 10px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.18em;
    cursor: pointer;
}
.tm-services-close span {
    display: inline-grid;
    place-items: center;
    margin-left: 12px;
    width: 42px;
    height: 42px;
    border: 1px solid #666;
    border-radius: 50%;
    font-size: calc((25px) + 1px);
    font-weight: 300;
    transition: 0.25s;
}
.tm-services-close:hover span {
    background: #7cff6b;
    color: #000;
    border-color: #7cff6b;
    transform: rotate(90deg);
}
.tm-services-kicker {
    margin-top: 5vh;
    color: #7cff6b;
    font:
        900 10px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.22em;
}
.tm-services-list {
    margin-top: clamp(55px, 9vh, 100px);
    border-top: 1px solid #444;
}
.tm-services-list a {
    display: grid;
    grid-template-columns: 70px minmax(0, 1fr) auto;
    align-items: center;
    gap: 20px;
    padding: clamp(18px, 2.3vh, 30px) 0;
    border-bottom: 1px solid #444;
    color: #fff;
    background: none;
    text-decoration: none;
    white-space: normal;
}
.tm-services-list em {
    font:
        800 9px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.16em;
    color: #777;
    font-style: normal;
}
.tm-services-list strong {
    font:
        950 clamp(40px, 7vw, 110px)/0.82 "Nunito Sans",
        sans-serif;
    letter-spacing: -0.065em;
    transition: 0.3s;
}
.tm-services-list span {
    font:
        700 10px/1.2 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.1em;
    color: #999;
    transition: 0.3s;
}
.tm-services-list a:hover strong {
    color: #7cff6b;
    transform: translateX(18px);
}
.tm-services-list a:hover span {
    color: #fff;
}
.tm-services-foot {
    margin-top: 24px;
    text-align: right;
    font:
        900 9px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.2em;
    color: #777;
}
body.tm-services-open {
    overflow: hidden;
}
@media (max-width: 700px) {
    .tm-services-dropdown {
        padding: 24px 20px;
    }
    .tm-services-kicker {
        margin-top: 8vh;
    }
    .tm-services-list {
        margin-top: 55px;
    }
    .tm-services-list a {
        grid-template-columns: 34px 1fr;
        gap: 10px;
        padding: 20px 0;
    }
    .tm-services-list strong {
        font-size: calc((12vw) + 1px);
    }
    .tm-services-list span {
        display: none;
    }
    .tm-services-close {
        right: 20px;
        top: 20px;
    }
    .tm-services-foot {
        text-align: left;
    }
}

/* v1.2.18 — ambient creative-lab motion: alive at rest, theme background inherited */
.px-creative-lab {
    background: transparent;
}
.px-creative-lab__sticky {
    background: transparent;
}
.px-creative-lab__rail {
    background: rgba(0, 0, 0, 0.38);
    backdrop-filter: blur(8px);
}
.px-creative-lab__sticky:after {
    content: "";
    position: absolute;
    z-index: 1;
    inset: -25%;
    pointer-events: none;
    background:
        radial-gradient(circle at 18% 34%, rgba(124, 255, 107, 0.055), transparent 25%),
        radial-gradient(circle at 82% 66%, rgba(255, 255, 255, 0.035), transparent 23%);
    animation: pxLabAmbientField 11s ease-in-out infinite alternate;
    will-change: transform, opacity;
}
.px-lab-media img {
    animation: pxLabImageBreath 9s ease-in-out infinite alternate;
    will-change: transform, filter;
}
.px-lab-media--b img {
    animation-duration: 11.5s;
    animation-direction: alternate-reverse;
}
.px-lab-media--c img {
    animation-duration: 13s;
}
.px-lab-media i {
    animation: pxLabSheen 7s ease-in-out infinite;
    will-change: transform, opacity;
}
.px-lab-media--b i {
    animation-delay: -2.2s;
}
.px-lab-media--c i {
    animation-delay: -4.1s;
}
.px-lab-lens {
    animation: pxLabLensAlive 4.8s ease-in-out infinite;
}
.px-lab-cross {
    animation: pxLabCrossAlive 8s linear infinite;
}
.px-lab-cross--2 {
    animation-duration: 11s;
    animation-direction: reverse;
}
.px-creative-lab__word span {
    animation: pxLabTypePulse 7s ease-in-out infinite alternate;
}
.px-creative-lab__word span:nth-child(2) {
    animation-delay: -2s;
}
.px-creative-lab__word span:nth-child(3) {
    animation-delay: -4s;
}
@keyframes pxLabAmbientField {
    0% {
        transform: translate3d(-2%, -1%, 0) rotate(-1deg) scale(1);
        opacity: 0.7;
    }
    100% {
        transform: translate3d(3%, 2%, 0) rotate(2deg) scale(1.08);
        opacity: 1;
    }
}
@keyframes pxLabImageBreath {
    0% {
        scale: 1;
        filter: grayscale(1) contrast(1.15);
    }
    100% {
        scale: 1.055;
        filter: grayscale(0.82) contrast(1.2);
    }
}
@keyframes pxLabSheen {
    0%,
    25% {
        transform: translate3d(-45%, -45%, 0);
        opacity: 0.15;
    }
    55% {
        opacity: 0.55;
    }
    80%,
    100% {
        transform: translate3d(45%, 45%, 0);
        opacity: 0.12;
    }
}
@keyframes pxLabLensAlive {
    0%,
    100% {
}
    50% {
}
}
@keyframes pxLabCrossAlive {
    to {
        transform: rotate(360deg);
    }
}
@keyframes pxLabTypePulse {
    0% {
        letter-spacing: -0.085em;
        filter: blur(0);
    }
    100% {
        letter-spacing: -0.065em;
        filter: blur(0.15px);
    }
}
@media (prefers-reduced-motion: reduce) {
    .px-creative-lab__sticky:after,
    .px-lab-media img,
    .px-lab-media i,
    .px-lab-lens,
    .px-lab-cross,
    .px-creative-lab__word span {
        animation: none;
    }
}

/* v1.2.19 — motion-graphics choreography: static assets behave like an always-running campaign film */
.px-creative-lab__word {
    animation: pxLabWordStage 12s cubic-bezier(0.65, 0, 0.35, 1) infinite;
}
.px-creative-lab__word span {
    animation: none;
}
.px-creative-lab__word span:nth-child(1) {
    animation: pxLabWordA 6s cubic-bezier(0.7, 0, 0.3, 1) infinite;
}
.px-creative-lab__word span:nth-child(2) {
    animation: pxLabWordB 6s cubic-bezier(0.7, 0, 0.3, 1) infinite;
}
.px-creative-lab__word span:nth-child(3) {
    animation: pxLabWordC 6s cubic-bezier(0.7, 0, 0.3, 1) infinite;
}
@keyframes pxLabWordStage {
    0%,
    100% {
        gap: 2.2vw;
    }
    35% {
        gap: 5vw;
    }
    58% {
        gap: 0.5vw;
    }
    78% {
        gap: 3.5vw;
    }
}
@keyframes pxLabWordA {
    0%,
    100% {
        translate: 0 0;
        rotate: 0deg;
    }
    20% {
        translate: -5vw -3vh;
        rotate: -3deg;
    }
    45% {
        translate: 3vw 4vh;
        rotate: 2deg;
    }
    70% {
        translate: -2vw 1vh;
        rotate: -1deg;
    }
}
@keyframes pxLabWordB {
    0%,
    100% {
        translate: 0 0;
        rotate: 0deg;
    }
    25% {
        translate: 3vw 6vh;
        rotate: 5deg;
    }
    50% {
        translate: -4vw -5vh;
        rotate: -4deg;
    }
    75% {
        translate: 2vw -1vh;
        rotate: 2deg;
    }
}
@keyframes pxLabWordC {
    0%,
    100% {
        translate: 0 0;
        rotate: 0deg;
    }
    18% {
        translate: 5vw -5vh;
        rotate: 3deg;
    }
    48% {
        translate: -2vw 5vh;
        rotate: -2deg;
    }
    76% {
        translate: 4vw 1vh;
        rotate: 4deg;
    }
}
.px-lab-media {
    transition: filter 0.2s ease;
    animation-timing-function: cubic-bezier(0.65, 0, 0.35, 1);
    animation-iteration-count: infinite;
    animation-direction: alternate;
    transform-origin: center;
}
.px-lab-media--a {
    animation-name: pxLabCardA;
    animation-duration: 8s;
}
.px-lab-media--b {
    animation-name: pxLabCardB;
    animation-duration: 9.5s;
}
.px-lab-media--c {
    animation-name: pxLabCardC;
    animation-duration: 11s;
}
@keyframes pxLabCardA {
    0% {
        margin-left: 0;
        margin-top: 0;
        clip-path: inset(0 0 0 0);
    }
    35% {
        margin-left: 7vw;
        margin-top: -4vh;
        clip-path: inset(8% 0 15% 0);
    }
    65% {
        margin-left: -2vw;
        margin-top: 5vh;
        clip-path: inset(0 12% 0 4%);
    }
    100% {
        margin-left: 5vw;
        margin-top: 1vh;
        clip-path: inset(4% 3% 4% 3%);
    }
}
@keyframes pxLabCardB {
    0% {
        margin-right: 0;
        margin-top: 0;
        clip-path: inset(0);
    }
    40% {
        margin-right: 9vw;
        margin-top: 7vh;
        clip-path: inset(0 8% 18% 0);
    }
    72% {
        margin-right: -2vw;
        margin-top: -3vh;
        clip-path: inset(12% 0 0 10%);
    }
    100% {
        margin-right: 4vw;
        margin-top: 4vh;
        clip-path: inset(3%);
    }
}
@keyframes pxLabCardC {
    0% {
        margin-right: 0;
        margin-bottom: 0;
        clip-path: inset(0);
    }
    32% {
        margin-right: -6vw;
        margin-bottom: 7vh;
        clip-path: inset(10% 0 0 14%);
    }
    67% {
        margin-right: 8vw;
        margin-bottom: -2vh;
        clip-path: inset(0 15% 12% 0);
    }
    100% {
        margin-right: 2vw;
        margin-bottom: 5vh;
        clip-path: inset(4%);
    }
}
.px-lab-media img {
    animation: pxLabFilmPan 7s cubic-bezier(0.45, 0, 0.55, 1) infinite alternate;
    transform-origin: center;
}
.px-lab-media--b img {
    animation-delay: -2.1s;
    animation-duration: 8.5s;
}
.px-lab-media--c img {
    animation-delay: -4.4s;
    animation-duration: 10s;
}
@keyframes pxLabFilmPan {
    0% {
        transform: scale(1.03) translate3d(-3%, 0, 0);
        filter: grayscale(1) contrast(1.15);
    }
    45% {
        transform: scale(1.15) translate3d(3%, -2%, 0);
        filter: grayscale(0.6) contrast(1.18);
    }
    100% {
        transform: scale(1.08) translate3d(-1%, 3%, 0);
        filter: grayscale(0.9) contrast(1.2);
    }
}
.px-lab-hud {
    position: absolute;
    z-index: 24;
    color: #fff;
    font-family: "Nunito Sans", sans-serif;
    pointer-events: none;
}
.px-lab-hud small {
    display: block;
    color: #7cff6b;
    font-size: calc((8px) + 1px);
    font-weight: 900;
    letter-spacing: 0.22em;
    margin-bottom: 5px;
}
.px-lab-hud--percent {
    left: 42%;
    top: 14%;
    width: 150px;
}
.px-lab-hud--percent strong {
    font-size: calc((clamp(38px, 5vw, 72px)) + 1px);
    line-height: 0.8;
    letter-spacing: -0.07em;
}
.px-lab-hud--percent > i {
    font-size: calc((14px) + 1px);
    font-style: normal;
    margin-left: 3px;
}
.px-lab-hud--percent > span {
    display: block;
    height: 2px;
    background: #333;
    margin-top: 11px;
    overflow: hidden;
}
.px-lab-hud--percent > span b {
    display: block;
    width: 1%;
    height: 100%;
    background: #7cff6b;
}
.px-lab-hud--odo {
    left: 5%;
    bottom: 16%;
    border: 1px solid #555;
    background: rgba(0, 0, 0, 0.55);
    padding: 10px 12px;
    backdrop-filter: blur(8px);
}
.px-lab-odometer {
    display: flex;
    gap: 2px;
}
.px-lab-odometer b {
    display: grid;
    place-items: center;
    width: 25px;
    height: 34px;
    background: #111;
    border: 1px solid #333;
    font-size: calc((19px) + 1px);
    line-height: 1;
    overflow: hidden;
}
.px-lab-scan {
    position: absolute;
    z-index: 19;
    left: 0;
    right: 0;
    top: 0;
    height: 1px;
    background: #7cff6b;
animation: pxLabScan 4.6s cubic-bezier(0.65, 0, 0.35, 1) infinite;
    opacity: 0.7;
}
.px-lab-scan span {
    position: absolute;
    right: 4vw;
    top: -12px;
    font:
        800 7px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.16em;
    color: #7cff6b;
}
.px-lab-scan span:after {
    content: "SCANNING";
}
@keyframes pxLabScan {
    0% {
        transform: translateY(8vh);
        opacity: 0;
    }
    12% {
        opacity: 0.75;
    }
    88% {
        opacity: 0.55;
    }
    100% {
        transform: translateY(82vh);
        opacity: 0;
    }
}
.px-lab-orbit {
    position: absolute;
    z-index: 23;
    right: 6%;
    top: 52%;
    width: 90px;
    height: 90px;
    border: 1px solid #555;
    border-radius: 50%;
    animation: pxLabOrbitSpin 7s linear infinite;
}
.px-lab-orbit:before,
.px-lab-orbit:after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    background: #555;
    transform: translate(-50%, -50%);
}
.px-lab-orbit:before {
    width: 130%;
    height: 1px;
}
.px-lab-orbit:after {
    height: 130%;
    width: 1px;
}
.px-lab-orbit i {
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #7cff6b;
    left: 50%;
    top: -5px;
}
.px-lab-orbit b {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    font:
        900 8px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.18em;
}
@keyframes pxLabOrbitSpin {
    to {
        transform: rotate(360deg);
    }
}
.px-creative-lab:hover .px-lab-media {
    animation-duration: 3.5s;
}
.px-creative-lab:hover .px-creative-lab__word span {
    animation-duration: 2.8s;
}
.px-creative-lab:hover .px-lab-orbit {
    animation-duration: 2.5s;
}
.px-creative-lab:hover .px-lab-scan {
    animation-duration: 2.2s;
}
@media (max-width: 700px) {
    .px-lab-hud--percent {
        left: auto;
        right: 6%;
        top: 11%;
        width: 105px;
    }
    .px-lab-hud--percent strong {
        font-size: calc((42px) + 1px);
    }
    .px-lab-hud--odo {
        left: 7%;
        bottom: 15%;
    }
    .px-lab-orbit {
        width: 62px;
        height: 62px;
        right: 7%;
        top: 58%;
    }
    .px-lab-media {
        animation-duration: 7s;
    }
    .px-creative-lab__word {
        animation-duration: 9s;
    }
}
@media (prefers-reduced-motion: reduce) {
    .px-creative-lab__word,
    .px-creative-lab__word span,
    .px-lab-media,
    .px-lab-media img,
    .px-lab-scan,
    .px-lab-orbit {
        animation: none;
    }
}

/* v1.2.20 — interactive playground: draggable, throwable media cards */
.px-creative-lab__canvas {
    touch-action: pan-y;
}
.px-lab-media[data-lab-draggable] {
    cursor: grab;
    user-select: none;
    -webkit-user-select: none;
    touch-action: none;
    transform-origin: center;
    transition:
        filter 0.25s ease,
        box-shadow 0.25s ease,
        border-color 0.25s ease;
}
.px-lab-media[data-lab-draggable].is-grabbed {
    cursor: grabbing;
    z-index: 80;
    animation: none;
    border-color: #7cff6b;
filter: saturate(1.12);
}
.px-lab-media[data-lab-draggable].is-grabbed img {
    filter: grayscale(0) contrast(1.08);
    transform: scale(1.045);
}
.px-lab-media[data-lab-draggable].was-played {
    animation: none;
}
.px-lab-media[data-lab-draggable]::after {
    content: "DRAG";
    position: absolute;
    right: 10px;
    top: 10px;
    z-index: 5;
    padding: 5px 7px;
    background: #7cff6b;
    color: #000;
    font:
        900 8px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.14em;
    opacity: 0;
    transform: translateY(-5px);
    transition: 0.2s ease;
}
.px-lab-media[data-lab-draggable]:hover::after,
.px-lab-media[data-lab-draggable].is-grabbed::after {
    opacity: 1;
    transform: none;
}
.px-lab-reset {
    position: absolute;
    z-index: 35;
    right: 3vw;
    bottom: 94px;
    border: 1px solid rgba(255, 255, 255, 0.5);
    background: rgba(0, 0, 0, 0.55);
    color: #fff;
    padding: 9px 12px;
    font:
        800 8px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.16em;
    cursor: pointer;
    backdrop-filter: blur(8px);
    transition: 0.2s ease;
}
.px-lab-reset:hover {
    background: #7cff6b;
    color: #000;
    border-color: #7cff6b;
    transform: translateY(-2px);
}
.px-creative-lab.is-playing .px-creative-lab__top span:last-child {
    color: #7cff6b;
}
@media (max-width: 700px) {
    .px-lab-reset {
        right: 6%;
        bottom: 96px;
    }
    .px-lab-media[data-lab-draggable]::after {
        opacity: 0.8;
    }
}

/* v1.2.21 — playable intruder hunt */
.px-lab-cross {
    display: none;
}
.px-lab-gamehud {
    position: absolute;
    z-index: 72;
    left: 3vw;
    bottom: 92px;
    display: flex;
    align-items: center;
    gap: 10px;
    font:
        900 9px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.15em;
    pointer-events: none;
}
.px-lab-gamehud > span {
    border: 1px solid rgba(255, 255, 255, 0.32);
    background: rgba(0, 0, 0, 0.68);
    backdrop-filter: blur(9px);
    padding: 9px 11px;
}
.px-lab-gamehud b {
    color: #7cff6b;
    font-size: calc((13px) + 1px);
    margin-left: 5px;
}
.px-lab-gamehud .px-game-combo {
    opacity: 0.45;
    transition: 0.2s;
}
.px-lab-gamehud .px-game-combo.is-hot {
    opacity: 1;
    border-color: #7cff6b;
    transform: scale(1.06);
}
.px-lab-enemy-layer {
    position: absolute;
    inset: 0;
    z-index: 65;
    pointer-events: none;
    overflow: hidden;
}
.px-lab-enemy {
    --enemy-rot: 0deg;
    position: absolute;
    width: clamp(58px, 5.8vw, 88px);
    aspect-ratio: 1;
    pointer-events: auto;
    cursor: crosshair;
    border: 0;
    background: transparent;
    padding: 0;
animation:
        pxEnemySpawn 0.28s cubic-bezier(0.2, 1.5, 0.3, 1) both,
        pxEnemyHover 1.25s ease-in-out 0.28s infinite alternate;
    touch-action: manipulation;
}
.px-lab-enemy__body {
    position: absolute;
    inset: 13%;
    background: #7cff6b;
    clip-path: polygon(20% 0, 80% 0, 100% 23%, 88% 76%, 67% 100%, 33% 100%, 12% 76%, 0 23%);
transition: transform 0.1s ease;
}
.px-lab-enemy__body:before {
    content: "";
    position: absolute;
    left: 20%;
    right: 20%;
    top: 31%;
    height: 18%;
    background: #050505;
    clip-path: polygon(0 0, 100% 0, 86% 100%, 14% 100%);
}
.px-lab-enemy__body:after {
    content: "AI";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 18%;
    text-align: center;
    color: #050505;
    font:
        1000 9px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.12em;
}
.px-lab-enemy i,
.px-lab-enemy b {
    position: absolute;
    background: #7cff6b;
}
.px-lab-enemy i {
    left: 0;
    right: 0;
    top: 49%;
    height: 2px;
}
.px-lab-enemy b {
    top: 0;
    bottom: 0;
    left: 49%;
    width: 2px;
}
.px-lab-enemy:hover .px-lab-enemy__body {
    transform: scale(1.14) rotate(8deg);
}
.px-lab-enemy.is-armored .px-lab-enemy__body {
    background: #fff;
}
.px-lab-enemy.is-armored .px-lab-enemy__body:after {
    content: "AI²";
}
.px-lab-enemy.is-hit {
    animation: pxEnemyHit 0.24s ease both;
    pointer-events: none;
}
.px-lab-burst {
    position: absolute;
    z-index: 70;
    width: 8px;
    height: 8px;
    pointer-events: none;
}
.px-lab-burst i {
    position: absolute;
    left: 0;
    top: 0;
    width: 5px;
    height: 5px;
    background: #7cff6b;
    animation: pxBurst 0.55s cubic-bezier(0.1, 0.7, 0.2, 1) forwards;
    transform: rotate(var(--r)) translateX(0);
}
@keyframes pxEnemySpawn {
    from {
        opacity: 0;
        transform: scale(0.15) rotate(-35deg);
    }
    to {
        opacity: 1;
        transform: scale(1) rotate(var(--enemy-rot));
    }
}
@keyframes pxEnemyHover {
    to {
        transform: translateY(-9px) rotate(calc(var(--enemy-rot) + 5deg));
    }
}
@keyframes pxEnemyHit {
    to {
        opacity: 0;
        transform: scale(1.8) rotate(35deg);
        filter: blur(7px);
    }
}
@keyframes pxBurst {
    to {
        opacity: 0;
        transform: rotate(var(--r)) translateX(var(--d)) scale(0.15);
    }
}
@media (max-width: 700px) {
    .px-lab-gamehud {
        left: 6%;
        bottom: 96px;
    }
    .px-lab-enemy {
        width: 58px;
    }
}
@media (prefers-reduced-motion: reduce) {
    .px-lab-enemy {
        animation: none;
    }
    .px-lab-burst i {
        animation-duration: 0.01ms;
    }
}

/* v1.2.22 — playground composition + varied enemy classes + boss encounter */
/* Keep the left half available for gameplay. Render stays top-left; title becomes a right-side stack. */
.px-lab-hud--odo {
    display: none;
}
.px-lab-hud--percent {
    left: 3vw;
    right: auto;
    top: 72px;
    width: clamp(112px, 11vw, 164px);
    z-index: 74;
}
.px-lab-hud--percent strong {
    font-size: calc((clamp(34px, 4.4vw, 66px)) + 1px);
}
.px-creative-lab__word {
    inset: 0 3vw 0 auto;
    width: min(35vw, 520px);
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    gap: 0;
    text-align: right;
    font-size: calc((clamp(74px, 10vw, 178px)) + 1px);
    line-height: 0.72;
    animation: none;
}
.px-creative-lab__word span {
    animation: pxLabRightWord 7.5s cubic-bezier(0.65, 0, 0.35, 1) infinite;
    transform-origin: right center;
}
.px-creative-lab__word span:nth-child(2) {
    animation-delay: -2.5s;
}
.px-creative-lab__word span:nth-child(3) {
    animation-delay: -5s;
}
@keyframes pxLabRightWord {
    0%,
    100% {
        transform: translate3d(0, 0, 0) skewX(0);
        letter-spacing: -0.085em;
    }
    35% {
        transform: translate3d(-1.8vw, -5px, 0) skewX(-3deg);
        letter-spacing: -0.06em;
    }
    68% {
        transform: translate3d(0.8vw, 8px, 0) skewX(2deg);
        letter-spacing: -0.095em;
    }
}

/* Enemy palette and silhouettes. */
.px-lab-enemy {
    --enemy: #7cff6b;
    --enemy-ink: #050505;
    --enemy-glow: rgba(124, 255, 107, 0.48);
    width: clamp(58px, 5.8vw, 88px);
}
.px-lab-enemy.is-size-lg {
    width: clamp(104px, 10vw, 158px);
}
.px-lab-enemy.is-size-xl {
    width: clamp(150px, 15vw, 230px);
}
.px-lab-enemy.is-blue {
    --enemy: #2f7dff;
    --enemy-ink: #020817;
    --enemy-glow: rgba(47, 125, 255, 0.55);
}
.px-lab-enemy.is-red {
    --enemy: #ff354d;
    --enemy-ink: #140104;
    --enemy-glow: rgba(255, 53, 77, 0.55);
}
.px-lab-enemy.is-white {
    --enemy: #f5f5f2;
    --enemy-ink: #050505;
    --enemy-glow: rgba(255, 255, 255, 0.3);
}
.px-lab-enemy.is-black {
    --enemy: #090909;
    --enemy-ink: #e8e8e8;
    --enemy-glow: rgba(47, 125, 255, 0.45);
}
.px-lab-enemy__body {
    background: var(--enemy);
}
.px-lab-enemy__body:before {
    background: var(--enemy-ink);
}
.px-lab-enemy__body:after {
    color: var(--enemy-ink);
}
.px-lab-enemy i,
.px-lab-enemy b {
    background: var(--enemy);
}
.px-lab-enemy.is-black .px-lab-enemy__body {
    border: 1px solid #2f7dff;
}
.px-lab-enemy.is-black .px-lab-enemy__body:after {
    color: #fff;
}
.px-lab-enemy.is-scout .px-lab-enemy__body {
    clip-path: polygon(50% 0, 100% 42%, 72% 100%, 28% 100%, 0 42%);
}
.px-lab-enemy.is-scout .px-lab-enemy__body:after {
    content: "SCOUT";
}
.px-lab-enemy.is-virus .px-lab-enemy__body {
    border-radius: 50%;
    clip-path: polygon(
        50% 0,
        61% 22%,
        82% 9%,
        78% 34%,
        100% 50%,
        77% 60%,
        91% 82%,
        64% 76%,
        50% 100%,
        39% 77%,
        16% 91%,
        23% 63%,
        0 50%,
        22% 39%,
        9% 17%,
        38% 24%
    );
}
.px-lab-enemy.is-virus .px-lab-enemy__body:after {
    content: "VIRUS";
}
.px-lab-enemy.is-glitch .px-lab-enemy__body {
    clip-path: polygon(9% 8%, 88% 0, 100% 28%, 79% 45%, 94% 72%, 64% 100%, 35% 84%, 0 96%, 12% 55%, 0 28%);
}
.px-lab-enemy.is-glitch .px-lab-enemy__body:after {
    content: "GLITCH";
}

/* Boss: deliberately much larger, darker and more threatening than normal enemies. */
.px-lab-enemy.is-boss {
    --enemy: #ff203d;
    --enemy-ink: #050505;
    --enemy-glow: rgba(255, 32, 61, 0.72);
    width: clamp(210px, 24vw, 390px);
    aspect-ratio: 1.12;
    z-index: 90;
animation:
        pxBossSpawn 0.48s cubic-bezier(0.15, 1.35, 0.2, 1) both,
        pxBossBreathe 1.1s ease-in-out 0.5s infinite alternate;
}
.px-lab-enemy.is-boss .px-lab-enemy__body {
    inset: 8%;
    clip-path: polygon(
        50% 0,
        61% 16%,
        78% 4%,
        80% 22%,
        100% 18%,
        88% 40%,
        100% 54%,
        82% 62%,
        90% 88%,
        66% 79%,
        50% 100%,
        34% 79%,
        10% 89%,
        18% 62%,
        0 54%,
        12% 40%,
        0 18%,
        20% 22%,
        22% 4%,
        39% 16%
    );
    background: linear-gradient(135deg, #070707 0 48%, #ff203d 49% 58%, #090909 59% 100%);
    border: 1px solid #ff203d;
}
.px-lab-enemy.is-boss .px-lab-enemy__body:before {
    left: 27%;
    right: 27%;
    top: 35%;
    height: 13%;
    background: #ff203d;
}
.px-lab-enemy.is-boss .px-lab-enemy__body:after {
    content: "NEXUS";
    bottom: 22%;
    color: #fff;
    font-size: calc((clamp(10px, 1.1vw, 16px)) + 1px);
}
.px-lab-enemy.is-boss:after {
    content: "BOSS  ·  5 HITS";
    position: absolute;
    left: 50%;
    top: -22px;
    transform: translateX(-50%);
    white-space: nowrap;
    color: #ff5267;
    font:
        900 9px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.18em;
}
@keyframes pxBossSpawn {
    from {
        opacity: 0;
        transform: scale(0.08) rotate(-20deg);
        filter: blur(14px);
    }
    to {
        opacity: 1;
        transform: scale(1) rotate(var(--enemy-rot));
}
}
@keyframes pxBossBreathe {
    to {
        transform: translateY(-12px) rotate(calc(var(--enemy-rot) + 2deg)) scale(1.035);
    }
}
.px-lab-enemy.is-damaged .px-lab-enemy__body {
    animation: pxEnemyDamage 0.16s linear 1;
}
@keyframes pxEnemyDamage {
    25% {
        filter: brightness(2.2);
    }
    50% {
        transform: translateX(-7px);
    }
    75% {
        transform: translateX(7px);
    }
}
.px-lab-burst i {
    background: var(--burst, #7cff6b);
}

@media (max-width: 700px) {
    .px-lab-hud--percent {
        left: 6%;
        top: 68px;
        width: 105px;
    }
    .px-creative-lab__word {
        right: 5vw;
        width: 46vw;
        font-size: calc((16vw) + 1px);
        align-items: flex-end;
        padding: 0;
    }
    .px-lab-enemy.is-size-lg {
        width: 88px;
    }
    .px-lab-enemy.is-size-xl {
        width: 118px;
    }
    .px-lab-enemy.is-boss {
        width: min(54vw, 240px);
    }
}

/* v1.2.23 — arcade-grade Creative Lab presentation */
.px-creative-lab__sticky {
    background: transparent;
}
.px-lab-enemy-layer {
    cursor: crosshair;
}
.px-lab-enemy {
    transition: none;
    animation:
        pxEnemyEnter 0.32s cubic-bezier(0.16, 0.8, 0.2, 1) both,
        pxEnemyRoam 2.6s ease-in-out 0.32s infinite alternate;
    will-change: transform, filter;
}
.px-lab-enemy:before {
    content: "";
    position: absolute;
    inset: -12px;
    border: 1px solid color-mix(in srgb, var(--enemy-color, #7cff6b) 38%, transparent);
    clip-path: polygon(
        0 0,
        25% 0,
        25% 2px,
        2px 2px,
        2px 25%,
        0 25%,
        0 0,
        100% 0,
        100% 25%,
        calc(100% - 2px) 25%,
        calc(100% - 2px) 2px,
        75% 2px,
        75% 0,
        100% 100%,
        75% 100%,
        75% calc(100% - 2px),
        calc(100% - 2px) calc(100% - 2px),
        calc(100% - 2px) 75%,
        100% 75%,
        0 100%,
        0 75%,
        2px 75%,
        2px calc(100% - 2px),
        25% calc(100% - 2px),
        25% 100%
    );
}
.px-lab-enemy.is-scout {
    --enemy-color: #2f7dff;
}
.px-lab-enemy.is-virus {
    --enemy-color: #ff354d;
}
.px-lab-enemy.is-glitch {
    --enemy-color: #7cff6b;
}
.px-lab-enemy.is-black {
    --enemy-color: #8aa0ff;
}
.px-lab-enemy.is-white {
    --enemy-color: #fff;
}
.px-lab-enemy.is-boss {
    --enemy-color: #ff203d;
}
.px-enemy-hp {
    position: absolute;
    left: 10%;
    right: 10%;
    bottom: -12px;
    height: 3px;
    background: #242424;
    overflow: hidden;
}
.px-enemy-hp u {
    display: block;
    width: 100%;
    height: 100%;
    background: var(--enemy-color);
transition: width 0.18s;
}
@keyframes pxEnemyEnter {
    from {
        opacity: 0;
        transform: scale(0.1) rotate(-25deg);
        filter: blur(10px);
    }
    to {
        opacity: 1;
        transform: scale(1) rotate(var(--enemy-rot));
        filter: none;
    }
}
@keyframes pxEnemyRoam {
    to {
        transform: translate3d(var(--drift-x), var(--drift-y), 0) rotate(calc(var(--enemy-rot) + 7deg));
    }
}
.px-lab-enemy.is-boss {
    animation:
        pxEnemyEnter 0.5s cubic-bezier(0.16, 0.8, 0.2, 1) both,
        pxBossRoam 3.4s ease-in-out 0.5s infinite alternate;
}
@keyframes pxBossRoam {
    to {
        transform: translate3d(var(--drift-x), var(--drift-y), 0) rotate(calc(var(--enemy-rot) + 3deg))
            scale(1.045);
    }
}
.px-lab-enemy.is-escape {
    animation: pxEnemyEscape 0.35s ease-in both;
}
@keyframes pxEnemyEscape {
    to {
        opacity: 0;
        transform: scale(1.8) rotate(30deg);
        filter: blur(10px);
    }
}
.px-lab-burst.is-mega {
    z-index: 80;
}
.px-lab-burst.is-mega:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 20px;
    height: 20px;
    border: 2px solid var(--burst);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    animation: pxShock 0.65s ease-out forwards;
}
@keyframes pxShock {
    to {
        width: 260px;
        height: 260px;
        opacity: 0;
    }
}
.px-lab-gamehud {
    left: 3vw;
    right: auto;
    bottom: 88px;
    display: flex;
    gap: 18px;
    align-items: center;
    padding: 10px 14px;
    background: rgba(0, 0, 0, 0.72);
    border: 1px solid #333;
    backdrop-filter: blur(12px);
    font:
        800 9px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.13em;
}
.px-lab-gamehud span {
    white-space: nowrap;
}
.px-lab-gamehud b {
    color: #fff;
    font-size: calc((13px) + 1px);
}
.px-game-lives b {
    color: #ff354d;
    letter-spacing: 0.08em;
}
.px-game-combo.is-hot {
    color: #7cff6b;
    transform: scale(1.12);
}
.px-game-alert {
    position: absolute;
    z-index: 75;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0.82);
    text-align: center;
    pointer-events: none;
    opacity: 0;
}
.px-game-alert small {
    display: block;
    color: #ff354d;
    font:
        900 8px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.28em;
    margin-bottom: 8px;
}
.px-game-alert strong {
    display: block;
    font:
        950 clamp(42px, 8vw, 118px)/0.75 "Nunito Sans",
        sans-serif;
    letter-spacing: -0.07em;
}
.px-game-alert span {
    display: block;
    margin-top: 13px;
    color: #aaa;
    font:
        800 9px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.22em;
}
.px-game-alert.is-show {
    animation: pxGameAlert 1.2s cubic-bezier(0.16, 0.8, 0.2, 1) both;
}
@keyframes pxGameAlert {
    0% {
        opacity: 0;
        transform: translate(-50%, -50%) scale(0.65);
        filter: blur(12px);
    }
    18%,
    72% {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1);
        filter: none;
    }
    100% {
        opacity: 0;
        transform: translate(-50%, -50%) scale(1.12);
    }
}
.px-game-bossbar {
    position: absolute;
    z-index: 70;
    top: 82px;
    left: 50%;
    width: min(520px, 58vw);
    transform: translateX(-50%) translateY(-25px);
    opacity: 0;
    pointer-events: none;
    text-align: center;
    transition: 0.35s;
}
.px-game-bossbar.is-show {
    opacity: 1;
    transform: translateX(-50%);
}
.px-game-bossbar span {
    display: block;
    color: #ff5267;
    font:
        900 9px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.22em;
    margin-bottom: 8px;
}
.px-game-bossbar i {
    display: block;
    height: 6px;
    border: 1px solid #5a1821;
    padding: 1px;
}
.px-game-bossbar i b {
    display: block;
    width: 100%;
    height: 100%;
    background: #ff203d;
transition: width 0.18s;
}
.px-game-bossbar em {
    display: block;
    margin-top: 6px;
    color: #aaa;
    font:
        800 8px/1 "Nunito Sans",
        sans-serif;
    font-style: normal;
}
.px-game-crosshair {
    position: absolute;
    z-index: 69;
    width: 34px;
    height: 34px;
    border: 1px solid rgba(124, 255, 107, 0.8);
    border-radius: 50%;
    transform: translate(-50%, -50%) scale(0.6);
    opacity: 0;
    pointer-events: none;
    transition:
        opacity 0.15s,
        transform 0.15s;
}
.px-game-crosshair:before,
.px-game-crosshair:after {
    content: "";
    position: absolute;
    background: #7cff6b;
}
.px-game-crosshair:before {
    left: 50%;
    top: -7px;
    width: 1px;
    height: 46px;
}
.px-game-crosshair:after {
    top: 50%;
    left: -7px;
    width: 46px;
    height: 1px;
}
.px-game-crosshair.is-active {
    opacity: 0.8;
    transform: translate(-50%, -50%) scale(1);
}
.px-creative-lab.is-game-damaged .px-creative-lab__sticky {
    animation: pxDamageScreen 0.28s linear 1;
}
@keyframes pxDamageScreen {
    20% {
        transform: translateX(-7px);
        filter: contrast(1.4) saturate(1.5);
    }
    40% {
        transform: translateX(8px);
    }
    60% {
        transform: translateX(-4px);
    }
    100% {
        transform: none;
        filter: none;
    }
}
@media (max-width: 700px) {
    .px-lab-gamehud {
        left: 5vw;
        right: 5vw;
        bottom: 86px;
        gap: 9px;
        justify-content: space-between;
    }
    .px-lab-gamehud span {
        font-size: calc((7px) + 1px);
    }
    .px-lab-gamehud b {
        font-size: calc((10px) + 1px);
    }
    .px-game-bossbar {
        top: 92px;
        width: 72vw;
    }
    .px-game-crosshair {
        display: none;
    }
    .px-game-alert strong {
        font-size: calc((15vw) + 1px);
    }
    .px-lab-enemy-layer {
        cursor: default;
    }
}
@media (prefers-reduced-motion: reduce) {
    .px-lab-enemy,
    .px-lab-enemy.is-boss {
        animation: none;
    }
    .px-game-alert.is-show {
        animation: none;
        opacity: 1;
    }
}

/* v1.2.24 — Pulse Reactor mini-game. Replaces the legacy 260vh showcase and removes its dead scroll space. */
.px-arcade {
    position: relative;
    width: 100%;
    height: auto;
    min-height: 0;
    background: #000;
    color: #fff;
    overflow: hidden;
}
.px-arcade__stage {
    position: relative;
    height: clamp(680px, 88vh, 920px);
    min-height: 680px;
    overflow: hidden;
    isolation: isolate;
    background: radial-gradient(circle at 50% 48%, #111 0, #050505 38%, #000 76%);
    cursor: none;
    touch-action: manipulation;
}
.px-arcade__canvas {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}
.px-arcade__grain {
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    opacity: 0.13;
    background-image: repeating-linear-gradient(0deg, transparent 0 3px, rgba(255, 255, 255, 0.035) 4px);
    mix-blend-mode: screen;
}
.px-arcade__hud {
    position: absolute;
    z-index: 12;
    top: 0;
    left: 0;
    right: 0;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: start;
    padding: 24px 3vw;
    border-bottom: 1px solid rgba(255, 255, 255, 0.16);
    pointer-events: none;
}
.px-arcade__hud > div {
    display: grid;
    gap: 4px;
}
.px-arcade__hud small,
.px-arcade__hud span,
.px-arcade__footer {
    font:
        800 8px/1.1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.2em;
    color: #8d8d8d;
}
.px-arcade__hud strong {
    font:
        950 clamp(22px, 3vw, 44px)/0.85 "Nunito Sans",
        sans-serif;
    letter-spacing: -0.04em;
}
.px-arcade__center {
    width: min(34vw, 360px);
    text-align: center;
}
.px-arcade__center b {
    font:
        900 10px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.22em;
}
.px-arcade__center i {
    display: block;
    height: 4px;
    margin-top: 10px;
    border: 1px solid #333;
    padding: 1px;
}
.px-arcade__center u {
    display: block;
    width: 100%;
    height: 100%;
    background: #78ff67;
transition: width 0.2s;
}
.px-arcade__combo {
    text-align: right;
}
.px-arcade__combo strong {
    color: #78ff67;
}
.px-arcade__intro {
    position: absolute;
    z-index: 15;
    left: 7vw;
    top: 50%;
    transform: translateY(-46%);
    width: min(620px, 76vw);
    transition:
        opacity 0.45s,
        transform 0.65s cubic-bezier(0.16, 1, 0.3, 1),
        visibility 0.45s;
}
.px-arcade__intro.is-hidden {
    opacity: 0;
    visibility: hidden;
    transform: translateY(-42%) scale(0.96);
    pointer-events: none;
}
.px-arcade__intro small {
    font:
        900 8px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.3em;
    color: #78ff67;
}
.px-arcade__intro h2 {
    margin: 16px 0 22px;
    font:
        950 clamp(70px, 11vw, 180px)/0.69 "Nunito Sans",
        sans-serif;
    letter-spacing: -0.085em;
}
.px-arcade__intro h2 em {
    font-style: normal;
    color: transparent;
    -webkit-text-stroke: 1.5px #fff;
}
.px-arcade__intro p {
    max-width: 430px;
    color: #aaa;
    font:
        500 14px/1.55 "Nunito Sans",
        sans-serif;
    margin: 0 0 28px;
}
.px-arcade__intro button {
    display: flex;
    align-items: center;
    gap: 34px;
    border: 1px solid #fff;
    background: #fff;
    color: #000;
    padding: 15px 18px 15px 20px;
    font:
        900 10px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.16em;
    cursor: pointer;
    transition: 0.25s;
}
.px-arcade__intro button:hover {
    background: #78ff67;
    border-color: #78ff67;
    gap: 48px;
}
.px-arcade__intro button b {
    font-size: calc((18px) + 1px);
}
.px-arcade__message {
    position: absolute;
    z-index: 14;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    pointer-events: none;
    opacity: 0;
}
.px-arcade__message strong {
    display: block;
    font:
        950 clamp(52px, 9vw, 140px)/0.72 "Nunito Sans",
        sans-serif;
    letter-spacing: -0.07em;
}
.px-arcade__message span {
    display: block;
    margin-top: 15px;
    color: #78ff67;
    font:
        900 9px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.26em;
}
.px-arcade__message.is-show {
    animation: pxArcadeMessage 1.15s cubic-bezier(0.16, 1, 0.3, 1) both;
}
@keyframes pxArcadeMessage {
    0% {
        opacity: 0;
        transform: translate(-50%, -50%) scale(0.65);
        filter: blur(12px);
    }
    18%,
    68% {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1);
        filter: none;
    }
    100% {
        opacity: 0;
        transform: translate(-50%, -50%) scale(1.15);
    }
}
.px-arcade__cursor {
    position: absolute;
    z-index: 20;
    left: 0;
    top: 0;
    width: 42px;
    height: 42px;
    margin: -21px 0 0 -21px;
    border: 1px solid rgba(120, 255, 103, 0.8);
    border-radius: 50%;
    pointer-events: none;
    transition:
        width 0.12s,
        height 0.12s,
        margin 0.12s;
}
.px-arcade__cursor:before,
.px-arcade__cursor:after {
    content: "";
    position: absolute;
    background: #78ff67;
}
.px-arcade__cursor:before {
    left: 50%;
    top: -7px;
    width: 1px;
    height: 56px;
}
.px-arcade__cursor:after {
    top: 50%;
    left: -7px;
    width: 56px;
    height: 1px;
}
.px-arcade__cursor i {
    position: absolute;
    inset: 13px;
    border: 1px solid #fff;
    border-radius: 50%;
    animation: pxAim 1.2s linear infinite;
}
@keyframes pxAim {
    to {
        transform: rotate(360deg);
    }
}
.px-arcade__footer {
    position: absolute;
    z-index: 12;
    left: 3vw;
    right: 3vw;
    bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid rgba(255, 255, 255, 0.16);
    padding-top: 14px;
    pointer-events: none;
}
.px-arcade__footer button {
    pointer-events: auto;
    border: 0;
    background: none;
    color: #888;
    font:
        900 8px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.2em;
    cursor: pointer;
}
.px-arcade__footer button:hover {
    color: #78ff67;
}
/* neutralise all legacy showcase dimensions if stale markup/styles are cached */
.px-creative-lab {
    height: auto;
    min-height: 0;
}
.px-creative-lab__sticky {
    position: relative;
    height: auto;
    min-height: 0;
}
@media (max-width: 700px) {
    .px-arcade__stage {
        height: 720px;
        min-height: 720px;
        cursor: default;
    }
    .px-arcade__hud {
        padding: 18px 5vw;
        grid-template-columns: 1fr 1fr;
    }
    .px-arcade__center {
        position: absolute;
        left: 5vw;
        right: 5vw;
        top: 70px;
        width: auto;
    }
    .px-arcade__hud strong {
        font-size: calc((24px) + 1px);
    }
    .px-arcade__intro {
        left: 6vw;
        top: 52%;
        width: 88vw;
    }
    .px-arcade__intro h2 {
        font-size: calc((19vw) + 1px);
    }
    .px-arcade__intro p {
        font-size: calc((12px) + 1px);
        max-width: 82vw;
    }
    .px-arcade__cursor {
        display: none;
    }
    .px-arcade__footer {
        left: 5vw;
        right: 5vw;
    }
    .px-arcade__footer span:nth-child(2) {
        display: none;
    }
}
@media (prefers-reduced-motion: reduce) {
    .px-arcade__cursor i,
    .px-arcade__message.is-show {
        animation: none;
    }
}

/* v1.2.25 — clear victory state */
.px-arcade__intro.is-win em {
    color: #78ff67;
}
.px-arcade__intro.is-win button {
}

/* v1.2.29 — arcade-first game controls */
.px-arcade__intro button[data-arcade-start] {
    position: relative;
    isolation: isolate;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 22px;
    min-width: min(430px, 90vw);
    min-height: 92px;
    padding: 22px 34px;
    border: 2px solid #78ff67;
    background: linear-gradient(180deg, #202820 0%, #0a0d0a 52%, #020302 100%);
    color: #fff;
    font:
        950 clamp(22px, 2.7vw, 38px)/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.055em;
    text-transform: uppercase;
    clip-path: polygon(
        18px 0,
        calc(100% - 18px) 0,
        100% 18px,
        100% calc(100% - 18px),
        calc(100% - 18px) 100%,
        18px 100%,
        0 calc(100% - 18px),
        0 18px
    );
cursor: pointer;
    overflow: hidden;
    transition:
        transform 0.16s ease,
        filter 0.2s ease,
        box-shadow 0.2s ease,
        border-color 0.2s ease;
    animation: pxGameButtonIdle 1.9s ease-in-out infinite;
}
.px-arcade__intro button[data-arcade-start]::before {
    content: "PRESS TO PLAY";
    position: absolute;
    top: 8px;
    left: 18px;
    font:
        800 7px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.24em;
    color: #78ff67;
    opacity: 0.8;
}
.px-arcade__intro button[data-arcade-start]::after {
    content: "";
    position: absolute;
    inset: 5px;
    border: 1px solid rgba(255, 255, 255, 0.15);
    clip-path: inherit;
    pointer-events: none;
}
.px-arcade__intro button[data-arcade-start] span {
    position: relative;
    z-index: 2;
    white-space: nowrap;
}
.px-arcade__intro button[data-arcade-start] b {
    position: relative;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 50px;
    height: 50px;
    border: 1px solid rgba(120, 255, 103, 0.8);
    border-radius: 50%;
    font-size: 0;
    background: rgba(120, 255, 103, 0.08);
}
.px-arcade__intro button[data-arcade-start] b::before {
    content: "▶";
    font:
        900 20px/1 "Nunito Sans",
        sans-serif;
    color: #78ff67;
    transform: translateX(2px);
}
.px-arcade__intro button[data-arcade-start]:hover {
    background: linear-gradient(180deg, #2d3a2c 0%, #0d120d 55%, #020302 100%);
    border-color: #fff;
    gap: 22px;
    transform: translateY(-3px) scale(1.025);
    filter: brightness(1.12);
}
.px-arcade__intro button[data-arcade-start]:active {
    transform: translateY(7px) scale(0.99);
}
.px-arcade__intro.is-win button[data-arcade-start] {
    border-color: #78ff67;
    background: linear-gradient(180deg, #233423, #081008 58%, #020302);
    animation: pxGameWinButton 1.25s ease-in-out infinite;
}
.px-arcade__intro.is-win button[data-arcade-start]::before {
    content: "RUN IT BACK";
}
@keyframes pxGameButtonIdle {
    0%,
    100% {
        filter: brightness(1);
}
    50% {
        filter: brightness(1.08);
}
}
@keyframes pxGameWinButton {
    0%,
    100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.025);
    }
}
@media (max-width: 700px) {
    .px-arcade__intro button[data-arcade-start] {
        min-width: min(88vw, 390px);
        min-height: 82px;
        padding: 20px 22px;
        font-size: calc((clamp(20px, 7vw, 30px)) + 1px);
    }
    .px-arcade__intro button[data-arcade-start] b {
        width: 44px;
        height: 44px;
    }
}
@media (prefers-reduced-motion: reduce) {
    .px-arcade__intro button[data-arcade-start] {
        animation: none;
    }
}

/* v1.2.32 — floating contact icon: restore clean rear-bubble geometry.
   Keep the original bubble intact; only refine the small lower-right tail. */

/* v1.2.32 — precise rear chat-bubble tail + pure-black section 01 */
.px-exclusive-manifesto {
    background: #000000;
}
.px-exclusive-manifesto::before {
    background: none;
}

/* v1.2.33 — final micro-adjustment: clean, compact rear chat-bubble tail */

body {
    color-scheme: light;
}

/* Primary page + section surfaces: pure white. */

/* Supporting copy uses dark gray rather than washed-out light gray. */

/* Light-mode cards/panels are also white, separated with subtle lines. */

/* Mobile navigation + search panel must follow the light header. */

/* Footer must be white too — no off-white fallback. */

/* Cookie panel follows the same white/black system. */

/* DARK active: move the white selector to the left. */

/* Explicit LIGHT and SYSTEM-resolved-to-LIGHT states. */

@media (max-width: 1180px) {
}

@media (max-width: 520px) {
}

@media (min-width: 1181px) {
    .px-header-shell {
        padding-right: 24px;
    }

    .px-desktop-header-controls {
        flex-wrap: nowrap;
        gap: 18px;
        overflow: visible;
    }

    .px-desktop-header-controls .px-header-utility {
        gap: 12px;
    }
}

@media (max-width: 1180px) {
    .px-mobile-header-actions {
        flex-wrap: nowrap;
    }

    .px-mobile-header-actions .px-header-utility {
        gap: 6px;
    }
}

@media (max-width: 760px) {
    .px-mobile-header-actions .px-header-whatsapp-cta > span {
        display: none;
    }

    .px-mobile-header-actions .px-header-whatsapp-cta {
        width: 34px;
        min-height: 34px;
        padding: 0;
    }
}

/* =========================================================
   NORTHLINE Builders v1.3.6 — Desktop inline search bar
   The search field is a first-class flex item before navigation.
   It intentionally uses no absolute positioning or popup layer.
   ========================================================= */
@media (min-width: 1181px) {
    .px-desktop-header-controls {
        flex: 1 1 auto;
        min-width: 0;
        margin-left: clamp(28px, 3vw, 64px);
        gap: clamp(14px, 1.35vw, 28px);
    }

    .px-desktop-searchbar {
        min-width: 220px;
        width: clamp(260px, 25vw, 520px);
        max-width: 520px;
        height: 44px;
        margin: 0;
        padding: 0;
        flex: 1 1 420px;
        display: flex;
        align-items: center;
        border: 0;
        border-bottom: 1.5px solid currentColor;
        background: transparent;
        color: #000000;
}

    .px-desktop-searchbar-input {
        min-width: 0;
        width: 100%;
        height: 100%;
        margin: 0;
        padding: 0 16px 0 0;
        flex: 1 1 auto;
        border: 0;
        outline: 0;
        border-radius: 0;
        background: transparent;
        color: inherit;
font-family: "Nunito Sans", sans-serif;
        font-size: calc((17px) + 1px);
        font-weight: 400;
        line-height: 1;
        -webkit-appearance: none;
        appearance: none;
    }

    .px-desktop-searchbar-input::placeholder {
        color: #555555;
        opacity: 1;
    }

    .px-desktop-searchbar-input::-webkit-search-decoration,
    .px-desktop-searchbar-input::-webkit-search-cancel-button,
    .px-desktop-searchbar-input::-webkit-search-results-button,
    .px-desktop-searchbar-input::-webkit-search-results-decoration {
        -webkit-appearance: none;
    }

    .px-desktop-searchbar-submit {
        min-width: max-content;
        height: 100%;
        margin: 0;
        padding: 0;
        flex: 0 0 auto;
        display: inline-flex;
        align-items: center;
        justify-content: flex-end;
        gap: 16px;
        border: 0;
        border-radius: 0;
        background: transparent;
        color: inherit;
font-family: "Nunito Sans", sans-serif;
        font-size: calc((15px) + 1px);
        font-weight: 800;
        line-height: 1;
        letter-spacing: 0.01em;
        cursor: pointer;
        -webkit-appearance: none;
        appearance: none;
    }

    .px-desktop-searchbar-square {
        width: 17px;
        height: 17px;
        flex: 0 0 17px;
        display: block;
        background: currentColor;
    }

    .px-desktop-searchbar:focus-within {
        border-bottom-width: 2px;
    }

    .px-desktop-searchbar-submit:focus-visible {
        outline: 2px solid currentColor;
        outline-offset: 4px;
    }

    .px-desktop-nav,
    .px-header-utility {
        flex: 0 0 auto;
    }

    body .px-desktop-searchbar {
        color: #ffffff;
    }

    body .px-desktop-searchbar-input::placeholder {
        color: #a8a8a8;
    }
}

/* Protect medium desktop widths from control collisions. */
@media (min-width: 1181px) and (max-width: 1500px) {
    .px-desktop-header-controls {
        margin-left: 24px;
        gap: 14px;
    }

    .px-desktop-searchbar {
        min-width: 190px;
        width: clamp(190px, 18vw, 300px);
        flex: 0 1 300px;
    }

    .px-desktop-searchbar-input {
        font-size: calc((15px) + 1px);
    }

    .px-desktop-searchbar-submit {
        gap: 10px;
        font-size: calc((13px) + 1px);
    }

    .px-desktop-searchbar-square {
        width: 14px;
        height: 14px;
        flex-basis: 14px;
    }

    .px-primary-menu {
        gap: 16px;
    }
}

/* =========================================================
   NORTHLINE Builders v1.3.7 — reference-accurate desktop search + compact toggle
   Geometry follows the supplied reference: one uninterrupted baseline,
   light placeholder at left, bold SEARCH + square at right.
   ========================================================= */
@media (min-width: 1181px) {
    .px-desktop-searchbar {
        width: clamp(300px, 31vw, 620px);
        max-width: 620px;
        min-width: 260px;
        height: 46px;
        flex: 1 1 520px;
        align-items: center;
        border: 0;
        border-bottom: 2px solid #707070;
        color: #000;
    }
    .px-desktop-searchbar-input {
        height: 44px;
        padding: 0 18px 0 0;
        font-family: "Nunito Sans", sans-serif;
        font-size: calc((18px) + 1px);
        font-weight: 400;
        line-height: 44px;
    }
    .px-desktop-searchbar-input::placeholder {
        color: #555;
        opacity: 1;
    }
    .px-desktop-searchbar-submit {
        height: 44px;
        padding: 0 1px 0 18px;
        gap: 18px;
        font-family: "Nunito Sans", sans-serif;
        font-size: calc((17px) + 1px);
        font-weight: 800;
        letter-spacing: 0;
        line-height: 1;
    }
    .px-desktop-searchbar-square {
        width: 18px;
        height: 18px;
        flex: 0 0 18px;
        background: #000;
    }
    .px-desktop-searchbar:focus-within {
        border-bottom: 2px solid #707070;
    }
    body .px-desktop-searchbar {
        border-bottom-color: #8d8d8d;
    }
    body .px-desktop-searchbar-square {
        background: #fff;
    }
}

@media (min-width: 1181px) and (max-width: 1500px) {
    .px-desktop-searchbar {
        width: clamp(250px, 25vw, 390px);
        flex: 1 1 360px;
    }
    .px-desktop-searchbar-input {
        font-size: calc((16px) + 1px);
    }
    .px-desktop-searchbar-submit {
        font-size: calc((15px) + 1px);
        gap: 14px;
    }
    .px-desktop-searchbar-square {
        width: 16px;
        height: 16px;
        flex-basis: 16px;
    }
}

/* =========================================================
   NORTHLINE Builders v1.3.8 — split white hero
   Reference layout: brand left, video right, copy below video.
   This component is intentionally isolated from the legacy cinematic hero.
   ========================================================= */
.px-signature-hero {
    width: 100%;
    background: #fff;
    color: #000;
    border-bottom: 1px solid #e8e8e8;
}
.px-signature-hero-inner {
    width: min(calc(100% - 64px), 1880px);
    margin: 0 auto;
    padding: 32px 0 42px;
    display: grid;
    grid-template-columns: minmax(300px, 0.72fr) minmax(0, 1.78fr);
    gap: 42px;
    align-items: center;
}
.px-signature-hero-brand {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 10px;
}
.px-signature-hero-brand-image {
    display: block;
    width: min(100%, 600px);
    max-height: 500px;
    object-fit: contain;
}
.px-signature-hero-brand-fallback {
    width: min(100%, 590px);
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #0757a7;
    text-align: center;
}
.px-signature-mark {
    width: 190px;
    height: 190px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 8px;
    margin-bottom: 18px;
}
.px-signature-mark i {
    display: block;
    width: 48px;
    background: currentColor;
    transform: skewY(-30deg);
}
.px-signature-mark i:nth-child(1) {
    height: 118px;
}
.px-signature-mark i:nth-child(2) {
    height: 150px;
}
.px-signature-mark i:nth-child(3) {
    height: 182px;
}
.px-signature-hero-brand-fallback strong {
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((clamp(48px, 5vw, 94px)) + 1px);
    font-weight: 900;
    line-height: 0.92;
    letter-spacing: -0.055em;
}
.px-signature-hero-brand-fallback > span:last-child {
    margin-top: 14px;
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((clamp(20px, 2vw, 42px)) + 1px);
    font-weight: 700;
    letter-spacing: 0.34em;
    line-height: 1;
}
.px-signature-hero-feature {
    min-width: 0;
}
.px-signature-hero-video-wrap {
    width: 100%;
    aspect-ratio: 16/7.3;
    overflow: hidden;
    border-radius: 14px;
    background: #111;
}
.px-signature-hero-video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    background: #111;
}
.px-signature-hero-video-empty {
    width: 100%;
    height: 100%;
    display: grid;
    place-items: center;
    padding: 30px;
    color: #666;
    background: #f4f4f4;
    font-size: calc((15px) + 1px);
    text-align: center;
}
.px-signature-hero-copy {
    padding: 26px 22px 0;
    text-align: right;
}
.px-signature-hero-copy h1 {
    max-width: none;
    margin: 0;
    color: #0757a7;
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((clamp(27px, 2.45vw, 48px)) + 1px);
    font-weight: 800;
    line-height: 1.12;
    letter-spacing: -0.035em;
    overflow-wrap: normal;
}
.px-signature-hero-copy p {
    margin: 7px 0 0;
    color: #4c5565;
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((clamp(16px, 1.55vw, 29px)) + 1px);
    font-weight: 400;
    line-height: 1.45;
}
.px-signature-hero-accent {
    display: block;
    width: 122px;
    height: 7px;
    margin: 28px 0 0 auto;
    border-radius: 999px;
    background: #0757a7;
}

/* The requested SYSTEM mode resolves to the same white hero as LIGHT. */

body .px-signature-hero {
    background: #000;
    color: #fff;
    border-bottom-color: #242424;
}
body .px-signature-hero-copy h1 {
    color: #fff;
}
body .px-signature-hero-copy p {
    color: #c7c7c7;
}
body .px-signature-hero-accent {
    background: #fff;
}
body .px-signature-hero-brand-fallback {
    color: #fff;
}

@media (max-width: 900px) {
    .px-signature-hero-inner {
        width: min(calc(100% - 32px), 760px);
        padding: 24px 0 34px;
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .px-signature-hero-brand {
        padding: 8px 0 4px;
    }
    .px-signature-hero-brand-image {
        width: min(72vw, 420px);
        max-height: 300px;
    }
    .px-signature-mark {
        width: 120px;
        height: 120px;
        margin-bottom: 12px;
    }
    .px-signature-mark i {
        width: 30px;
    }
    .px-signature-mark i:nth-child(1) {
        height: 74px;
    }
    .px-signature-mark i:nth-child(2) {
        height: 94px;
    }
    .px-signature-mark i:nth-child(3) {
        height: 114px;
    }
    .px-signature-hero-video-wrap {
        aspect-ratio: 16/9;
        border-radius: 10px;
    }
    .px-signature-hero-copy {
        padding: 18px 2px 0;
        text-align: right;
    }
    .px-signature-hero-copy h1 {
        font-size: calc((clamp(24px, 7vw, 38px)) + 1px);
    }
    .px-signature-hero-copy p {
        font-size: calc((16px) + 1px);
    }
    .px-signature-hero-accent {
        width: 82px;
        height: 5px;
        margin-top: 20px;
    }
}

/* =========================================================
   NORTHLINE Builders v1.3.9 — search baseline correction
   The underline belongs ONLY to the input field. The SEARCH
   button and square intentionally have no line beneath them.
   ========================================================= */
@media (min-width: 1181px) {
    .px-desktop-searchbar {
        border: 0;
        border-bottom: 0;
        gap: 36px;
        align-items: center;
    }
    .px-desktop-searchbar:focus-within {
        border: 0;
        border-bottom: 0;
    }
    .px-desktop-searchbar-input {
        align-self: stretch;
        min-width: 0;
        border: 0;
        border-bottom: 2px solid #707070;
        border-radius: 0;
        outline: 0;
        background: transparent;
    }
    .px-desktop-searchbar-input:focus {
        border-bottom-color: #707070;
        outline: 0;
}
    .px-desktop-searchbar-submit {
        flex: 0 0 auto;
        border: 0;
        border-bottom: 0;
        outline: 0;
        background: transparent;
    }
    body .px-desktop-searchbar {
        border: 0;
        border-bottom: 0;
    }
    body .px-desktop-searchbar-input {
        border-bottom-color: #8d8d8d;
    }
}

@media (min-width: 1181px) and (max-width: 1500px) {
    .px-desktop-searchbar {
        gap: 28px;
    }
}

/* =========================================================
   NORTHLINE Builders v1.3.10 — responsive, editable search
   Real input field + independent submit control.
   The baseline belongs only to .px-desktop-searchbar-field.
   ========================================================= */
@media (min-width: 1181px) {
    .px-desktop-searchbar {
        display: flex;
        align-items: center;
        min-width: 0;
        width: clamp(300px, 31vw, 620px);
        max-width: 620px;
        height: 46px;
        flex: 1 1 520px;
        gap: 36px;
        margin: 0;
        padding: 0;
        border: 0;
        background: transparent;
        color: #000;
        overflow: visible;
    }
    .px-desktop-searchbar-field {
        position: relative;
        z-index: 1;
        display: flex;
        align-items: center;
        flex: 1 1 auto;
        min-width: 90px;
        height: 46px;
        border: 0;
        border-bottom: 2px solid #707070;
        background: transparent;
    }
    .px-desktop-searchbar-input {
        position: relative;
        z-index: 2;
        display: block;
        flex: 1 1 auto;
        min-width: 0;
        width: 100%;
        height: 44px;
        margin: 0;
        padding: 0 8px 0 0;
        border: 0;
        border-bottom: 0;
        border-radius: 0;
        outline: 0;
        background: transparent;
        color: inherit;
font-family: "Nunito Sans", sans-serif;
        font-size: calc((18px) + 1px);
        font-weight: 400;
        line-height: 44px;
        cursor: text;
        pointer-events: auto;
        -webkit-appearance: none;
        appearance: none;
    }
    .px-desktop-searchbar-input:focus {
        border: 0;
        outline: 0;
}
    .px-desktop-searchbar-input::placeholder {
        color: #555;
        opacity: 1;
    }
    .px-desktop-searchbar-submit {
        position: relative;
        z-index: 1;
        display: inline-flex;
        align-items: center;
        justify-content: flex-end;
        flex: 0 0 auto;
        width: auto;
        min-width: max-content;
        height: 44px;
        margin: 0;
        padding: 0;
        gap: 18px;
        border: 0;
        border-bottom: 0;
        border-radius: 0;
        outline: 0;
        background: transparent;
        color: inherit;
font-family: "Nunito Sans", sans-serif;
        font-size: calc((17px) + 1px);
        font-weight: 800;
        line-height: 1;
        cursor: pointer;
        white-space: nowrap;
        -webkit-appearance: none;
        appearance: none;
    }
    .px-desktop-searchbar-square {
        display: block;
        width: 18px;
        height: 18px;
        flex: 0 0 18px;
        background: #000;
    }
    .px-desktop-searchbar:focus-within {
        border: 0;
    }
    .px-desktop-searchbar-field:focus-within {
        border-bottom-color: #000;
    }
    body .px-desktop-searchbar {
        color: #fff;
    }
    body .px-desktop-searchbar-field {
        border-bottom-color: #8d8d8d;
    }
    body .px-desktop-searchbar-field:focus-within {
        border-bottom-color: #fff;
    }
    body .px-desktop-searchbar-square {
        background: #fff;
    }
}

/* Desktop widths where the full header has less horizontal room. */
@media (min-width: 1181px) and (max-width: 1500px) {
    .px-desktop-header-controls {
        min-width: 0;
        gap: 12px;
    }
    .px-desktop-searchbar {
        width: auto;
        min-width: 210px;
        max-width: 390px;
        flex: 1 1 330px;
        gap: 22px;
    }
    .px-desktop-searchbar-field {
        min-width: 80px;
    }
    .px-desktop-searchbar-input {
        font-size: calc((15px) + 1px);
    }
    .px-desktop-searchbar-submit {
        font-size: calc((13px) + 1px);
        gap: 10px;
    }
    .px-desktop-searchbar-square {
        width: 14px;
        height: 14px;
        flex-basis: 14px;
    }
}

/* Very tight desktop: preserve a usable text field before compressing controls. */
@media (min-width: 1181px) and (max-width: 1280px) {
    .px-desktop-searchbar {
        min-width: 180px;
        flex-basis: 240px;
        gap: 14px;
    }
    .px-desktop-searchbar-field {
        min-width: 100px;
    }
    .px-desktop-searchbar-submit {
        font-size: calc((12px) + 1px);
        gap: 8px;
    }
    .px-desktop-searchbar-square {
        width: 12px;
        height: 12px;
        flex-basis: 12px;
    }
}

/* =========================================================
   NORTHLINE Builders v1.3.11 — search action + compact toggle + symmetric header
   Native GET search remains fully functional without JavaScript.
   Desktop edge spacing is symmetric: 24px left / 24px right.
   ========================================================= */
@media (min-width: 1181px) {
    .px-header-shell {
        padding-left: 24px;
        padding-right: 24px;
    }

    .px-desktop-header-controls {
        margin-right: 0;
        padding-right: 0;
    }

    .px-desktop-header-controls .px-header-utility {
        margin-right: 0;
        padding-right: 0;
    }

    /* Smaller DARK/LIGHT control, while keeping both labels comfortably clickable. */

    /* Keep the submit control as a real button and above neighbouring flex items. */
    .px-desktop-searchbar-submit {
        pointer-events: auto;
        touch-action: manipulation;
        position: relative;
        z-index: 3;
    }
    .px-desktop-searchbar-input {
        pointer-events: auto;
    }
}

@media (max-width: 1180px) {
}

@media (max-width: 520px) {
}

/* =========================================================
   NORTHLINE Builders v1.3.12
   Keep the split hero below the fixed/absolute header and
   make the DARK/LIGHT control more compact.
   ========================================================= */

/* The canonical header is 60px tall and overlays the page.
   Reserve that exact space in normal hero flow so the video
   can never sit underneath the header. */
body.home .px-signature-hero {
    padding-top: 60px;
}

@media (min-width: 1181px) {
    body.home .px-signature-hero-inner {
        padding-top: 28px;
    }

    /* Compact desktop theme switch. */
}

@media (max-width: 1180px) {
    body.home .px-signature-hero {
        padding-top: 60px;
    }
}

/* WordPress admin bar shifts the header down; WP already offsets page chrome,
   so only the 60px header height itself needs to be reserved for the hero. */

/* =========================================================
   NORTHLINE Builders v1.3.13 — Typography
   Nunito Sans: modern, clean, highly legible. System fallbacks
   keep the site usable if the webfont cannot be reached.
   ========================================================= */
:root {
    --signature-font:
        "Nunito Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Nunito Sans, Helvetica, "Nunito Sans",
        sans-serif;
}
html,
body,
button,
input,
select,
textarea {
    font-family: "Nunito Sans", sans-serif;
}
body {
    font-weight: 400;
    letter-spacing: -0.01em;
}
p,
li,
input,
textarea {
    font-weight: 400;
}

h1,
h2,
h3,
h4,
h5,
h6,
.entry-title,
.wp-block-heading {
    font-family: "Nunito Sans", sans-serif;
    font-weight: 700;
    letter-spacing: -0.035em;
}
.px-signature-hero-copy h1,
.px-signature-hero-brand-fallback strong {
    font-family: "Nunito Sans", sans-serif;
    font-weight: 800;
}
.px-signature-hero-copy p {
    font-family: "Nunito Sans", sans-serif;
    font-weight: 400;
    letter-spacing: -0.015em;
}

/* =========================================================
   NORTHLINE Builders v1.3.27 — canonical hero layout
   Clean replacement for accumulated v1.3.15–v1.3.26 patches.
   No negative margins, no transforms, no,
   no duplicated outer/inner gutters.
   ========================================================= */

/* The header is fixed; reserve exactly its desktop height. */
@media (min-width: 1181px) {
    body.home .px-signature-hero {
        width: 100%;
        padding: 72px 0 0;
        margin: 0;
        box-sizing: border-box;
    }

    /* One horizontal gutter source only: 32px per viewport side.
     Deliberately NOT capped by --px-max (1180px), because a
     1099px video plus the left brand cannot fit inside 1180px. */
    body.home .px-signature-hero-inner {
        width: calc(100% - 64px);
        max-width: none;
        margin: 0 auto;
        padding: 8px 0 14px;
        box-sizing: border-box;

        display: grid;
        grid-template-columns: minmax(300px, 1fr) minmax(0, 1099px);
        column-gap: clamp(28px, 3vw, 52px);
        align-items: center;
    }

    .px-signature-hero-brand {
        min-width: 0;
        width: 100%;
        margin: 0;
        padding: 8px 0;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .px-signature-hero-brand-image {
        display: block;
        width: 100%;
        max-width: 520px;
        max-height: 500px;
        margin: 0 auto;
        object-fit: contain;
    }

    .px-signature-hero-feature {
        min-width: 0;
        width: 100%;
        max-width: 1099px;
        margin: 0;
        padding: 0;
    }

    .px-signature-hero-video-wrap {
        width: 100%;
        max-width: 1099px;
        aspect-ratio: 1099 / 613;
        margin: 0;
        overflow: hidden;
        border-radius: 0;
        background: #111;
    }

    .px-signature-hero-video {
        display: block;
        width: 100%;
        height: 100%;
        margin: 0;
        object-fit: cover;
        border-radius: 0;
    }

    .px-signature-hero-copy {
        width: 100%;
        margin: 0;
        padding: 10px 0 0;
        text-align: right;
    }

    .px-signature-hero-copy h1 {
        margin: 0;
        font-size: calc((clamp(24px, 2vw, 38px)) + 1px);
        line-height: 1.08;
    }

    .px-signature-hero-copy p {
        margin: 3px 0 0;
        font-size: calc((clamp(14px, 1.08vw, 20px)) + 1px);
        line-height: 1.3;
    }

    .px-signature-hero-accent {
        width: 92px;
        height: 5px;
        margin: 10px 0 0 auto;
    }
}

/* Narrow desktop: allow the video column to shrink naturally.
   Nothing is moved outside the grid or viewport. */
@media (min-width: 1181px) and (max-width: 1500px) {
    body.home .px-signature-hero-inner {
        grid-template-columns: minmax(260px, 0.72fr) minmax(0, 1.58fr);
        column-gap: 28px;
    }

    .px-signature-hero-feature,
    .px-signature-hero-video-wrap {
        max-width: 100%;
    }

    .px-signature-hero-brand-image {
        max-width: 420px;
    }
}

/* Tablet/mobile stays in normal document flow. */
@media (max-width: 1180px) {
    body.home .px-signature-hero {
        width: 100%;
        margin: 0;
        padding: 60px 0 0;
        box-sizing: border-box;
    }

    body.home .px-signature-hero-inner {
        width: calc(100% - 32px);
        max-width: 760px;
        margin: 0 auto;
        padding: 18px 0 28px;
        display: grid;
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .px-signature-hero-brand {
        width: 100%;
        margin: 0;
        padding: 0;
    }

    .px-signature-hero-brand-image {
        width: min(72vw, 420px);
        max-height: 300px;
        margin: 0 auto;
    }

    .px-signature-hero-feature,
    .px-signature-hero-video-wrap,
    .px-signature-hero-copy {
        width: 100%;
        max-width: none;
        margin: 0;
    }

    .px-signature-hero-video-wrap {
        aspect-ratio: 16 / 9;
        border-radius: 0;
    }

    .px-signature-hero-video {
        border-radius: 0;
    }
}

/* Retain the approved thin desktop search underline. */
@media (min-width: 1181px) {
    .px-desktop-searchbar-field {
        border-bottom-width: 1px;
    }
}

/* =========================================================
   NORTHLINE Builders v1.3.28
   Align hero OUTER EDGES with the centered section below.
   Same effective gutter as:
   width:min(calc(100% - 64px), var(--px-max)); margin:0 auto;
   while preserving the hero's wider natural two-column layout.
   ========================================================= */
@media (min-width: 1181px) {
    body.home .px-signature-hero-inner {
        width: auto;
        max-width: none;
        margin-left: max(32px, calc((100vw - var(--px-max)) / 2));
        margin-right: max(32px, calc((100vw - var(--px-max)) / 2));
    }
}
.px-announcement-text {
    max-width: calc(100% - 40px);
    margin: 0 auto;
    text-align: center;
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((17px) + 1px);
    font-weight: 500;
    line-height: 1.3;
    letter-spacing: -0.015em;
}
.px-announcement-close {
    position: absolute;
    top: 50%;
    right: 22px;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin: 0;
    padding: 8px 0 8px 8px;
    border: 0;
    background: transparent;
    color: #fff;
    font: inherit;
    font-size: calc((16px) + 1px);
    font-weight: 500;
    line-height: 1;
    cursor: pointer;
}
.px-announcement-close > span:first-child {
    font-size: calc((25px) + 1px);
    font-weight: 300;
    line-height: 0.75;
}
.px-announcement-close:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 3px;
}

/* The canonical header is 72px high. When the bar is present,
   reserve its real 60px height above the hero. When it is closed,
   JS removes px-has-announcement and the hero returns to 72px. */
@media (min-width: 1181px) {
    body.home.px-has-announcement .px-signature-hero {
        padding-top: 132px;
    }
}
@media (max-width: 1180px) {
    .px-announcement-bar {
        min-height: 46px;
        padding: 0 62px 0 18px;
    }
    .px-announcement-text {
        font-size: calc((13px) + 1px);
        line-height: 1.25;
    }
    .px-announcement-close {
        right: 14px;
        gap: 0;
    }
    .px-announcement-close-label {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        white-space: nowrap;
    }
    body.home.px-has-announcement .px-signature-hero {
        padding-top: 106px;
    }
}
.px-announcement-text {
    font-size: calc((15px) + 1px);
}
.px-announcement-close {
    font-size: calc((14px) + 1px);
}
.px-announcement-close > span:first-child {
    font-size: calc((22px) + 1px);
}

/* Alternate sitewide text-link hover accents.
   Existing component-specific button/icon hover rules remain intact. */
body a:not(.button):not(.wp-element-button):not([class*="btn"]):not([class*="button"]):hover {
    color: #0057b8;
}
body
    a:nth-of-type(even):not(.button):not(.wp-element-button):not([class*="btn"]):not(
        [class*="button"]
    ):hover {
    color: #d71920;
}

@media (min-width: 1181px) {
    body.home.px-has-announcement .px-signature-hero {
        padding-top: 120px;
    }
}
@media (max-width: 1180px) {
    .px-announcement-bar {
        min-height: 40px;
    }
    .px-announcement-text {
        font-size: calc((12px) + 1px);
    }
    body.home.px-has-announcement .px-signature-hero {
        padding-top: 100px;
    }
}

/* =========================================================
   NORTHLINE Builders v1.3.31
   Mobile drawer search aligned with desktop + clean Section 1.
   ========================================================= */

/* Mobile hamburger search: same language as desktop search */
@media (max-width: 1180px) {
    .px-mobile-inline-search {
        width: calc(100% - 44px);
        min-width: 0;
        margin: 4px auto 18px;
        padding: 16px 0 0;
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        column-gap: 18px;
        align-items: end;
        border-top: 1px solid rgba(255, 255, 255, 0.1);
        color: #fff;
    }

    .px-mobile-inline-search-field {
        min-width: 0;
        border-bottom: 1px solid currentColor;
    }

    .px-mobile-inline-search-input {
        width: 100%;
        min-width: 0;
        height: 42px;
        margin: 0;
        padding: 0;
        border: 0;
        outline: 0;
        border-radius: 0;
        background: transparent;
        color: inherit;
font-family: "Nunito Sans", sans-serif;
        font-size: calc((15px) + 1px);
        font-weight: 400;
        line-height: 1;
        appearance: none;
        -webkit-appearance: none;
    }

    .px-mobile-inline-search-input::placeholder {
        color: rgba(255, 255, 255, 0.7);
        opacity: 1;
    }

    .px-mobile-inline-search-input::-webkit-search-decoration,
    .px-mobile-inline-search-input::-webkit-search-cancel-button,
    .px-mobile-inline-search-input::-webkit-search-results-button,
    .px-mobile-inline-search-input::-webkit-search-results-decoration {
        display: none;
    }

    .px-mobile-inline-search-submit {
        min-width: max-content;
        height: 42px;
        margin: 0;
        padding: 0;
        display: inline-flex;
        align-items: center;
        justify-content: flex-end;
        gap: 12px;
        border: 0;
        border-radius: 0;
        background: transparent;
        color: inherit;
font-family: "Nunito Sans", sans-serif;
        font-size: calc((13px) + 1px);
        font-weight: 800;
        line-height: 1;
        cursor: pointer;
    }

    .px-mobile-inline-search-square {
        display: block;
        width: 14px;
        height: 14px;
        flex: 0 0 14px;
        background: currentColor;
    }

    .px-mobile-inline-search-submit:hover,
    .px-mobile-inline-search-submit:focus-visible {
        color: #0057b8;
    }
}
.px-announcement-text {
    font-size: calc((14px) + 1px);
}
.px-announcement-close {
    height: 46px;
}

/* Hero reserves the real header stack once; no scroll-dependent size. */
@media (min-width: 1181px) {
    body.home .px-signature-hero {
        padding-top: 72px;
    }
    body.home.px-has-announcement .px-signature-hero {
        padding-top: 118px;
    }
}
@media (max-width: 1180px) {
    .px-announcement-bar {
        min-height: 40px;
        height: 40px;
    }
    .px-announcement-close {
        height: 40px;
    }
    .px-header-shell,
    .px-site-header.is-scrolled .px-header-shell {
        min-height: 0;
        height: auto;
    }
    body.home .px-signature-hero {
        padding-top: 60px;
    }
    body.home.px-has-announcement .px-signature-hero {
        padding-top: 100px;
    }
}

/* =========================================================
   SECTION 1 / EXCLUSIVE — complete redesign
   New markup + new layout. No dependency on legacy manifesto CSS.
   ========================================================= */
.px-exclusive-v2 {
    position: relative;
    overflow: hidden;
    background: #fff;
    color: #000;
    border-top: 1px solid #e8e8e8;
    border-bottom: 1px solid #e8e8e8;
}
.px-exclusive-v2-wrap {
    width: min(calc(100% - 64px), var(--px-max));
    margin: 0 auto;
    padding: 52px 0 40px;
}
.px-exclusive-v2-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    padding-bottom: 22px;
    border-bottom: 1px solid #bdbdbd;
}
.px-exclusive-v2-kicker {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 14px;
    color: #000;
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((11px) + 1px);
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.16em;
}
.px-exclusive-v2-number {
    color: #0057b8;
}
.px-exclusive-v2-rule {
    width: 46px;
    height: 1px;
    background: #000;
}
.px-exclusive-v2-note {
    margin: 0;
    color: #666;
    font-size: calc((13px) + 1px);
    line-height: 1.4;
    text-align: right;
}
.px-exclusive-v2-main {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.65fr);
    column-gap: clamp(48px, 7vw, 112px);
    align-items: end;
    padding: 48px 0 54px;
}
.px-exclusive-v2-title-block {
    min-width: 0;
}
.px-exclusive-v2 h2 {
    margin: 0;
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((clamp(50px, 6.15vw, 96px)) + 1px);
    font-weight: 800;
    line-height: 0.9;
    letter-spacing: -0.065em;
    text-transform: uppercase;
}
.px-exclusive-v2 h2 span {
    display: block;
}
.px-exclusive-v2-accent {
    color: #0057b8;
}
.px-exclusive-v2-copy {
    max-width: 460px;
    padding-bottom: 2px;
}
.px-exclusive-v2-copy p {
    margin: 0;
    color: #676767;
    font-size: calc((15px) + 1px);
    line-height: 1.72;
}
.px-exclusive-v2-copy .px-exclusive-v2-lead {
    margin-bottom: 14px;
    color: #000;
    font-size: calc((clamp(18px, 1.45vw, 22px)) + 1px);
    font-weight: 700;
    line-height: 1.38;
    letter-spacing: -0.025em;
}
.px-exclusive-v2-process {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: stretch;
    gap: 0;
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
}
.px-exclusive-v2-step {
    min-width: 0;
    padding: 24px 22px 22px 0;
}
.px-exclusive-v2-step + .px-exclusive-v2-arrow + .px-exclusive-v2-step {
    padding-left: 22px;
}
.px-exclusive-v2-step-no {
    display: block;
    margin-bottom: 22px;
    color: #9b9b9b;
    font-size: calc((10px) + 1px);
    font-weight: 700;
    letter-spacing: 0.14em;
}
.px-exclusive-v2-step strong {
    display: block;
    margin-bottom: 7px;
    color: #000;
    font-size: calc((14px) + 1px);
    font-weight: 800;
    letter-spacing: 0.1em;
}
.px-exclusive-v2-step p {
    max-width: 270px;
    margin: 0;
    color: #666;
    font-size: calc((13px) + 1px);
    line-height: 1.55;
}
.px-exclusive-v2-arrow {
    align-self: center;
    color: #0057b8;
    font-size: calc((24px) + 1px);
    font-weight: 400;
}

body .px-exclusive-v2 {
    background: #000;
    color: #fff;
    border-color: #2b2b2b;
}
body .px-exclusive-v2-top,
body .px-exclusive-v2-process {
    border-color: #444;
}
body .px-exclusive-v2-rule {
    background: #fff;
}
body .px-exclusive-v2-kicker,
body .px-exclusive-v2-copy .px-exclusive-v2-lead,
body .px-exclusive-v2-step strong {
    color: #fff;
}
body .px-exclusive-v2-note,
body .px-exclusive-v2-copy p,
body .px-exclusive-v2-step p {
    color: #aaa;
}

@media (max-width: 760px) {
    .px-exclusive-v2-wrap {
        width: min(calc(100% - 30px), var(--px-max));
        padding: 34px 0 30px;
    }
    .px-exclusive-v2-top {
        align-items: flex-start;
        flex-direction: column;
        gap: 10px;
        padding-bottom: 16px;
    }
    .px-exclusive-v2-note {
        text-align: left;
    }
    .px-exclusive-v2-main {
        grid-template-columns: 1fr;
        gap: 26px;
        padding: 34px 0 36px;
    }
    .px-exclusive-v2 h2 {
        font-size: calc((clamp(42px, 13vw, 66px)) + 1px);
    }
    .px-exclusive-v2-copy {
        max-width: none;
    }
    .px-exclusive-v2-process {
        grid-template-columns: 1fr;
    }
    .px-exclusive-v2-step {
        padding: 20px 0;
        border-bottom: 1px solid #d8d8d8;
    }
    .px-exclusive-v2-step + .px-exclusive-v2-arrow + .px-exclusive-v2-step {
        padding-left: 0;
    }
    .px-exclusive-v2-arrow {
        display: none;
    }
    .px-exclusive-v2-step:last-child {
        border-bottom: 0;
    }
}

/* NORTHLINE Builders v1.3.36 — symmetric desktop header gutter */
@media (min-width: 1181px) {
    .px-header-shell {
        padding-left: 24px;
        padding-right: 24px;
    }
}

/* NORTHLINE Builders v1.3.37 — desktop search fills available width responsively */
@media (min-width: 1181px) {
    .px-desktop-header-controls {
        flex: 1 1 auto;
        min-width: 0;
    }

    .px-desktop-searchbar {
        width: auto;
        max-width: none;
        min-width: 180px;
        flex: 1 1 auto;
    }

    .px-desktop-searchbar-field {
        min-width: 0;
        flex: 1 1 auto;
    }

    .px-desktop-searchbar-input {
        width: 100%;
        min-width: 0;
    }

    .px-desktop-nav,
    .px-header-utility {
        flex: 0 0 auto;
    }
}

/* NORTHLINE Builders v1.3.38 — independent light/dark header logos */

/* Graceful fallback when only one of the two theme logos has been uploaded. */

/* =========================================================
   NORTHLINE Builders v1.3.39
   SECTION 1 — TOTAL REDESIGN / EDITORIAL OWNERSHIP SYSTEM
   ========================================================= */

.px-exclusive-v3 {
    position: relative;
    width: 100%;
    overflow: hidden;
    background: #fff;
    color: #000;
    border-top: 1px solid #e7e7e7;
    border-bottom: 1px solid #e7e7e7;
}

.px-exclusive-v3-shell {
    display: grid;
    grid-template-columns: 116px minmax(0, 1fr);
    width: 100%;
    min-height: 760px;
}

.px-exclusive-v3-rail {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    padding: 44px 0 36px;
    border-right: 1px solid #d9d9d9;
}

.px-exclusive-v3-index {
    font-size: calc((18px) + 1px);
    font-weight: 800;
    letter-spacing: -0.02em;
}

.px-exclusive-v3-rail-line {
    width: 1px;
    flex: 1;
    margin: 28px 0;
    background: #d9d9d9;
}

.px-exclusive-v3-rail-label {
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    font-size: calc((11px) + 1px);
    line-height: 1;
    font-weight: 800;
    letter-spacing: 0.24em;
}

.px-exclusive-v3-stage {
    display: grid;
    grid-template-columns: minmax(0, 1.42fr) minmax(320px, 0.58fr);
    grid-template-rows: 1fr auto;
    min-width: 0;
}

.px-exclusive-v3-intro {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    padding: 74px clamp(34px, 5.1vw, 88px) 66px;
    border-right: 1px solid #d9d9d9;
}

.px-exclusive-v3-eyebrow {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 44px;
    font-size: calc((11px) + 1px);
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.px-exclusive-v3-dot {
    width: 6px;
    height: 6px;
    flex: 0 0 6px;
    background: #0057b8;
}

.px-exclusive-v3 h2 {
    margin: 0;
    max-width: 100%;
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((clamp(62px, 7.35vw, 132px)) + 1px);
    line-height: 0.79;
    font-weight: 800;
    letter-spacing: -0.075em;
    text-transform: uppercase;
}

.px-exclusive-v3 h2 span {
    display: block;
}

.px-exclusive-v3-line-a {
    padding-left: clamp(0px, 4vw, 74px);
    font-size: calc((0.56em) + 1px);
    letter-spacing: -0.04em;
}

.px-exclusive-v3-line-b {
    color: #0057b8;
}

.px-exclusive-v3-line-c {
    margin-top: 0.1em;
    text-align: right;
    font-size: calc((0.56em) + 1px);
    letter-spacing: -0.045em;
}

.px-exclusive-v3-manifesto {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(220px, 0.9fr);
    gap: clamp(28px, 4vw, 72px);
    align-items: start;
    margin-top: 60px;
    padding-top: 24px;
    border-top: 1px solid #000;
}

.px-exclusive-v3-manifesto p {
    margin: 0;
    font-size: calc((14px) + 1px);
    line-height: 1.65;
    color: #555;
}

.px-exclusive-v3-manifesto .px-exclusive-v3-lead {
    max-width: 600px;
    font-size: calc((clamp(17px, 1.35vw, 22px)) + 1px);
    line-height: 1.45;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #000;
}

.px-exclusive-v3-route {
    display: grid;
    grid-template-rows: repeat(3, 1fr);
    min-width: 0;
}

.px-exclusive-v3-card {
    position: relative;
    display: grid;
    grid-template-columns: 68px minmax(0, 1fr);
    gap: 18px;
    align-items: end;
    min-height: 0;
    padding: 36px 32px 34px;
    border-bottom: 1px solid #d9d9d9;
}

.px-exclusive-v3-card:last-child {
    border-bottom: 0;
}

.px-exclusive-v3-card-no {
    align-self: start;
    font-size: calc((12px) + 1px);
    font-weight: 800;
    letter-spacing: 0.08em;
}

.px-exclusive-v3-card strong {
    display: block;
    margin-bottom: 13px;
    font-size: calc((clamp(27px, 2.2vw, 40px)) + 1px);
    line-height: 0.95;
    font-weight: 800;
    letter-spacing: -0.055em;
}

.px-exclusive-v3-card p {
    max-width: 280px;
    margin: 0;
    font-size: calc((13px) + 1px);
    line-height: 1.55;
    color: #666;
}

.px-exclusive-v3-card-b {
    background: #000;
    color: #fff;
}

.px-exclusive-v3-card-b p {
    color: #aaa;
}

.px-exclusive-v3-card-b .px-exclusive-v3-card-no {
    color: #fff;
}

.px-exclusive-v3-card-c strong {
    color: #0057b8;
}

.px-exclusive-v3-statement {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: auto 1fr auto auto;
    align-items: center;
    gap: 24px;
    min-height: 92px;
    padding: 18px clamp(28px, 4vw, 64px);
    border-top: 1px solid #d9d9d9;
    font-size: calc((clamp(17px, 1.5vw, 24px)) + 1px);
    font-weight: 800;
    letter-spacing: -0.035em;
}

.px-exclusive-v3-statement-mark {
    justify-self: center;
    font-size: calc((22px) + 1px);
    font-weight: 400;
    color: #0057b8;
}

.px-exclusive-v3-statement-arrow {
    justify-self: end;
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border: 1px solid #000;
    font-size: calc((21px) + 1px);
    line-height: 1;
}

body .px-exclusive-v3 {
    background: #000;
    color: #fff;
    border-color: #272727;
}

body .px-exclusive-v3-rail,
body .px-exclusive-v3-intro,
body .px-exclusive-v3-card,
body .px-exclusive-v3-statement {
    border-color: #2d2d2d;
}

body .px-exclusive-v3-rail-line {
    background: #2d2d2d;
}

body .px-exclusive-v3-manifesto {
    border-top-color: #fff;
}

body .px-exclusive-v3-manifesto .px-exclusive-v3-lead {
    color: #fff;
}

body .px-exclusive-v3-manifesto p,
body .px-exclusive-v3-card p {
    color: #aaa;
}

body .px-exclusive-v3-card-b {
    background: #fff;
    color: #000;
}

body .px-exclusive-v3-card-b p {
    color: #555;
}

body .px-exclusive-v3-card-b .px-exclusive-v3-card-no {
    color: #000;
}

body .px-exclusive-v3-statement-arrow {
    border-color: #fff;
}

@media (max-width: 1180px) {
    .px-exclusive-v3-shell {
        grid-template-columns: 82px minmax(0, 1fr);
        min-height: 0;
    }

    .px-exclusive-v3-stage {
        grid-template-columns: 1fr;
    }

    .px-exclusive-v3-intro {
        border-right: 0;
        border-bottom: 1px solid #d9d9d9;
        padding: 58px 34px 52px;
    }

    .px-exclusive-v3-route {
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: auto;
    }

    .px-exclusive-v3-card {
        grid-template-columns: 1fr;
        gap: 30px;
        min-height: 260px;
        border-right: 1px solid #d9d9d9;
        border-bottom: 0;
    }

    .px-exclusive-v3-card:last-child {
        border-right: 0;
    }
}

@media (max-width: 760px) {
    .px-exclusive-v3-shell {
        display: block;
    }

    .px-exclusive-v3-rail {
        height: 48px;
        padding: 0 15px;
        flex-direction: row;
        border-right: 0;
        border-bottom: 1px solid #d9d9d9;
    }

    .px-exclusive-v3-rail-line {
        width: auto;
        height: 1px;
        flex: 1;
        margin: 0 16px;
    }

    .px-exclusive-v3-rail-label {
        writing-mode: horizontal-tb;
        transform: none;
        font-size: calc((10px) + 1px);
    }

    .px-exclusive-v3-intro {
        padding: 40px 15px 38px;
    }

    .px-exclusive-v3-eyebrow {
        gap: 9px;
        margin-bottom: 30px;
        font-size: calc((9px) + 1px);
    }

    .px-exclusive-v3 h2 {
        font-size: calc((clamp(50px, 17vw, 76px)) + 1px);
        line-height: 0.82;
    }

    .px-exclusive-v3-line-a {
        padding-left: 0;
    }

    .px-exclusive-v3-line-c {
        margin-top: 0.18em;
        text-align: left;
    }

    .px-exclusive-v3-manifesto {
        grid-template-columns: 1fr;
        gap: 18px;
        margin-top: 38px;
        padding-top: 18px;
    }

    .px-exclusive-v3-route {
        grid-template-columns: 1fr;
    }

    .px-exclusive-v3-card {
        grid-template-columns: 52px minmax(0, 1fr);
        gap: 12px;
        min-height: auto;
        padding: 28px 15px;
        border-right: 0;
        border-bottom: 1px solid #d9d9d9;
    }

    .px-exclusive-v3-card:last-child {
        border-bottom: 0;
    }

    .px-exclusive-v3-card strong {
        font-size: calc((30px) + 1px);
    }

    .px-exclusive-v3-statement {
        grid-template-columns: 1fr auto;
        gap: 8px 16px;
        min-height: 0;
        padding: 22px 15px;
        font-size: calc((17px) + 1px);
    }

    .px-exclusive-v3-statement-mark {
        display: none;
    }

    .px-exclusive-v3-statement-arrow {
        grid-column: 2;
        grid-row: 1 / span 2;
        width: 42px;
        height: 42px;
    }
}

/* =========================================================
   NORTHLINE Builders v1.3.40
   COMPLETE HOMEPAGE REDESIGN — SECTION 2 AND BELOW
   ========================================================= */

/* SECTION 2 — PROCESS */
.px-process-v4 {
    background: #000;
    color: #fff;
    border-bottom: 1px solid #292929;
}
.px-process-v4-head {
    display: grid;
    grid-template-columns: 140px minmax(0, 1.1fr) minmax(280px, 0.55fr);
    gap: 36px;
    align-items: end;
    padding: 68px 32px 52px;
    border-bottom: 1px solid #292929;
}
.px-process-v4-head > span {
    font-size: calc((11px) + 1px);
    font-weight: 800;
    letter-spacing: 0.15em;
}
.px-process-v4-head h2 {
    margin: 0;
    font-size: calc((clamp(50px, 6vw, 96px)) + 1px);
    line-height: 0.84;
    letter-spacing: -0.065em;
}
.px-process-v4-head p {
    margin: 0;
    color: #aaa;
    font-size: calc((15px) + 1px);
    line-height: 1.7;
}
.px-process-v4-track {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}
.px-process-v4-item {
    display: grid;
    grid-template-rows: minmax(240px, 28vw) auto;
    border-right: 1px solid #292929;
}
.px-process-v4-item:last-child {
    border-right: 0;
}
.px-process-v4-item figure {
    margin: 0;
    overflow: hidden;
}
.px-process-v4-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: grayscale(100%);
    transition:
        filter 0.35s ease,
        transform 0.5s ease;
}
.px-process-v4-item:hover img {
    filter: grayscale(0);
    transform: scale(1.02);
}
.px-process-v4-copy {
    display: grid;
    grid-template-columns: 54px 1fr;
    gap: 16px;
    padding: 28px 24px 32px;
}
.px-process-v4-copy > span {
    font-size: calc((11px) + 1px);
    font-weight: 800;
}
.px-process-v4-copy h3 {
    margin: 0 0 10px;
    font-size: calc((30px) + 1px);
    letter-spacing: -0.05em;
}
.px-process-v4-copy p {
    margin: 0;
    color: #999;
    font-size: calc((13px) + 1px);
    line-height: 1.55;
}

/* SECTION 3 — AVAILABLE DESIGNS */
.px-designs-v4 {
    background: #fff;
    color: #000;
    padding: 0 32px 64px;
}
.px-designs-v4-head {
    display: grid;
    grid-template-columns: 1fr minmax(280px, 0.48fr);
    gap: 48px;
    padding: 70px 0 46px;
    border-bottom: 1px solid #111;
}
.px-designs-v4-head span {
    display: block;
    margin-bottom: 20px;
    font-size: calc((11px) + 1px);
    font-weight: 800;
    letter-spacing: 0.15em;
}
.px-designs-v4-head h2 {
    margin: 0;
    font-size: calc((clamp(46px, 5.3vw, 82px)) + 1px);
    line-height: 0.9;
    letter-spacing: -0.06em;
}
.px-designs-v4-head p {
    align-self: end;
    margin: 0;
    font-size: calc((15px) + 1px);
    line-height: 1.7;
    color: #555;
}
.px-designs-v4-row {
    display: grid;
    grid-template-columns: 64px minmax(210px, 0.75fr) minmax(260px, 1.25fr) 54px;
    align-items: center;
    gap: 26px;
    min-height: 190px;
    padding: 18px 0;
    border-bottom: 1px solid #ddd;
    color: inherit;
    text-decoration: none;
}
.px-designs-v4-no {
    font-size: calc((11px) + 1px);
    font-weight: 800;
}
.px-designs-v4-name strong {
    display: block;
    font-size: calc((clamp(28px, 3vw, 46px)) + 1px);
    line-height: 0.95;
    letter-spacing: -0.05em;
}
.px-designs-v4-name small {
    display: block;
    margin-top: 10px;
    font-size: calc((10px) + 1px);
    letter-spacing: 0.16em;
}
.px-designs-v4-row figure {
    height: 154px;
    margin: 0;
    overflow: hidden;
}
.px-designs-v4-row img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.45s ease;
}
.px-designs-v4-row:hover img {
    transform: scale(1.025);
}
.px-designs-v4-open {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border: 1px solid #111;
    font-size: calc((20px) + 1px);
}
.px-designs-v4-cta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 32px;
    padding: 20px 0;
    border-top: 1px solid #111;
    border-bottom: 1px solid #111;
    color: inherit;
    text-decoration: none;
    font-weight: 800;
}

/* SECTION 4 — ABOUT */
.px-about-v4 {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(380px, 0.9fr);
    min-height: 720px;
    background: #f2f2f2;
    color: #000;
}
.px-about-v4-media {
    min-height: 720px;
    overflow: hidden;
}
.px-about-v4-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.px-about-v4-copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 64px clamp(34px, 5vw, 80px);
}
.px-about-v4-meta {
    display: flex;
    justify-content: space-between;
    padding-bottom: 18px;
    border-bottom: 1px solid #111;
    font-size: calc((11px) + 1px);
    font-weight: 800;
    letter-spacing: 0.12em;
}
.px-about-v4-copy h2 {
    margin: 56px 0 30px;
    font-size: calc((clamp(44px, 4.8vw, 78px)) + 1px);
    line-height: 0.93;
    letter-spacing: -0.06em;
}
.px-about-v4-copy > p {
    max-width: 620px;
    margin: 0;
    color: #555;
    font-size: calc((16px) + 1px);
    line-height: 1.75;
}
.px-about-v4-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 40px;
}
.px-about-v4-tags span {
    padding: 8px 10px;
    border: 1px solid #bbb;
    font-size: calc((9px) + 1px);
    font-weight: 800;
    letter-spacing: 0.12em;
}
.px-about-v4-link {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 46px;
    padding: 18px 0;
    border-top: 1px solid #111;
    border-bottom: 1px solid #111;
    color: inherit;
    text-decoration: none;
    font-weight: 800;
}

/* SECTION 5 — WORK */
.px-work-v4 {
    background: #fff;
    color: #000;
    padding: 72px 32px;
}
.px-work-v4 header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 40px;
    margin-bottom: 48px;
}
.px-work-v4 header span {
    font-size: calc((11px) + 1px);
    font-weight: 800;
    letter-spacing: 0.14em;
}
.px-work-v4 header h2 {
    margin: 0;
    text-align: right;
    font-size: calc((clamp(42px, 5vw, 76px)) + 1px);
    line-height: 0.9;
    letter-spacing: -0.06em;
}
.px-work-v4-grid {
    display: grid;
    grid-template-columns: 1.25fr 0.75fr 1fr;
    grid-auto-rows: 260px;
    gap: 12px;
}
.px-work-v4-card {
    position: relative;
    overflow: hidden;
    background: #111;
}
.px-work-v4-card-1,
.px-work-v4-card-5 {
    grid-row: span 2;
}
.px-work-v4-card-4 {
    grid-column: span 2;
}
.px-work-v4-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}
.px-work-v4-card:hover img {
    transform: scale(1.025);
}
.px-work-v4-card div {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    justify-content: space-between;
    gap: 20px;
    padding: 18px;
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.78));
    color: #fff;
}
.px-work-v4-card div span {
    font-size: calc((10px) + 1px);
    font-weight: 800;
}
.px-work-v4-card div strong {
    font-size: calc((18px) + 1px);
}

/* SECTION 6 — WHY */
.px-why-v4 {
    display: grid;
    grid-template-columns: minmax(300px, 0.7fr) minmax(0, 1.3fr);
    background: #000;
    color: #fff;
}
.px-why-v4-left {
    padding: 72px 42px;
    border-right: 1px solid #292929;
}
.px-why-v4-left > span {
    font-size: calc((11px) + 1px);
    font-weight: 800;
    letter-spacing: 0.14em;
}
.px-why-v4-left h2 {
    margin: 54px 0 30px;
    font-size: calc((clamp(48px, 5vw, 82px)) + 1px);
    line-height: 0.9;
    letter-spacing: -0.06em;
}
.px-why-v4-left p {
    margin: 0;
    max-width: 440px;
    color: #999;
    line-height: 1.7;
}
.px-why-v4-right article {
    position: relative;
    display: grid;
    grid-template-columns: 58px minmax(180px, 0.75fr) 1fr 48px;
    gap: 24px;
    align-items: center;
    min-height: 180px;
    padding: 30px;
    border-bottom: 1px solid #292929;
}
.px-why-v4-right article:last-child {
    border-bottom: 0;
}
.px-why-v4-right article > span {
    font-size: calc((11px) + 1px);
    font-weight: 800;
}
.px-why-v4-right h3 {
    margin: 0;
    font-size: calc((clamp(25px, 2.4vw, 38px)) + 1px);
    letter-spacing: -0.045em;
}
.px-why-v4-right p {
    margin: 0;
    color: #999;
    font-size: calc((13px) + 1px);
    line-height: 1.6;
}
.px-why-v4-right b {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border: 1px solid #555;
    font-size: calc((20px) + 1px);
}

/* SECTION 7 — PRODUCTS */
.px-products-v4 {
    background: #fff;
    color: #000;
    padding: 72px 32px;
}
.px-products-v4-head {
    display: grid;
    grid-template-columns: 150px 1fr minmax(260px, 0.45fr);
    gap: 30px;
    align-items: end;
    margin-bottom: 48px;
}
.px-products-v4-head > span {
    font-size: calc((11px) + 1px);
    font-weight: 800;
    letter-spacing: 0.14em;
}
.px-products-v4-head h2 {
    margin: 0;
    font-size: calc((clamp(46px, 5vw, 78px)) + 1px);
    line-height: 0.9;
    letter-spacing: -0.06em;
}
.px-products-v4-head p {
    margin: 0;
    color: #555;
    line-height: 1.65;
}
.px-products-v4-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    border-top: 1px solid #111;
    border-left: 1px solid #111;
}
.px-products-v4-card {
    border-right: 1px solid #111;
    border-bottom: 1px solid #111;
}
.px-products-v4-card a {
    display: block;
    color: inherit;
    text-decoration: none;
}
.px-products-v4-card figure {
    height: 240px;
    margin: 0;
    overflow: hidden;
}
.px-products-v4-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.45s ease;
}
.px-products-v4-card:hover img {
    transform: scale(1.025);
}
.px-products-v4-copy {
    padding: 22px;
}
.px-products-v4-copy > span {
    font-size: calc((10px) + 1px);
    font-weight: 800;
}
.px-products-v4-copy h3 {
    margin: 24px 0 12px;
    font-size: calc((24px) + 1px);
    letter-spacing: -0.04em;
}
.px-products-v4-copy p {
    margin: 0;
    color: #666;
    font-size: calc((13px) + 1px);
    line-height: 1.55;
}
.px-products-v4-price {
    display: flex;
    gap: 10px;
    margin-top: 20px;
    font-size: calc((13px) + 1px);
}
.px-products-v4-empty {
    grid-column: 1/-1;
    padding: 50px;
}

/* SECTION 8 — STRATEGY */
.px-strategy-v4 {
    display: grid;
    grid-template-columns: minmax(340px, 0.75fr) minmax(0, 1.25fr);
    min-height: 680px;
    background: #0057b8;
    color: #fff;
}
.px-strategy-v4-copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 70px 42px;
}
.px-strategy-v4-copy > span {
    font-size: calc((11px) + 1px);
    font-weight: 800;
    letter-spacing: 0.14em;
}
.px-strategy-v4-copy h2 {
    margin: 56px 0 30px;
    font-size: calc((clamp(46px, 5vw, 80px)) + 1px);
    line-height: 0.9;
    letter-spacing: -0.06em;
}
.px-strategy-v4-copy p {
    margin: 0;
    max-width: 520px;
    color: rgba(255, 255, 255, 0.78);
    line-height: 1.7;
}
.px-strategy-v4-copy a {
    display: flex;
    justify-content: space-between;
    margin-top: 44px;
    padding: 18px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.5);
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
    color: #fff;
    text-decoration: none;
    font-weight: 800;
}
.px-strategy-v4-media {
    position: relative;
    margin: 0;
    overflow: hidden;
}
.px-strategy-v4-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.px-strategy-v4-media figcaption {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    gap: 8px;
    padding: 18px;
    background: rgba(0, 0, 0, 0.65);
}
.px-strategy-v4-media figcaption span {
    padding: 7px 9px;
    border: 1px solid rgba(255, 255, 255, 0.45);
    font-size: calc((9px) + 1px);
    font-weight: 800;
    letter-spacing: 0.11em;
}

/* SECTION 9 — TESTIMONIALS */
.px-testimonials-v4 {
    background: #f3f3f3;
    color: #000;
    padding: 72px 32px;
}
.px-testimonials-v4 > header {
    display: grid;
    grid-template-columns: 150px 1fr minmax(260px, 0.45fr);
    gap: 30px;
    align-items: end;
    margin-bottom: 46px;
}
.px-testimonials-v4 header > span {
    font-size: calc((11px) + 1px);
    font-weight: 800;
    letter-spacing: 0.14em;
}
.px-testimonials-v4 header h2 {
    margin: 0;
    font-size: calc((clamp(46px, 5vw, 78px)) + 1px);
    line-height: 0.9;
    letter-spacing: -0.06em;
}
.px-testimonials-v4 header > p {
    margin: 0;
    color: #666;
    line-height: 1.65;
}
.px-testimonials-v4-list {
    border-top: 1px solid #111;
}
.px-testimonials-v4 blockquote {
    display: grid;
    grid-template-columns: 70px 1fr 240px;
    gap: 28px;
    align-items: center;
    margin: 0;
    padding: 34px 0;
    border-bottom: 1px solid #bbb;
}
.px-testimonials-v4-no {
    font-size: calc((11px) + 1px);
    font-weight: 800;
}
.px-testimonials-v4 blockquote > p {
    margin: 0;
    font-size: calc((clamp(22px, 2.4vw, 36px)) + 1px);
    line-height: 1.2;
    letter-spacing: -0.035em;
}
.px-testimonials-v4 footer {
    display: flex;
    align-items: center;
    gap: 14px;
}
.px-testimonials-v4 footer img {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    object-fit: cover;
}
.px-testimonials-v4 footer strong {
    font-size: calc((13px) + 1px);
}

/* SECTION 10 — FAQ */
.px-faq-v4 {
    display: grid;
    grid-template-columns: minmax(300px, 0.7fr) minmax(0, 1.3fr);
    background: #fff;
    color: #000;
    border-top: 1px solid #ddd;
}
.px-faq-v4 > aside {
    padding: 72px 42px;
    border-right: 1px solid #ddd;
}
.px-faq-v4 aside > span {
    font-size: calc((11px) + 1px);
    font-weight: 800;
    letter-spacing: 0.14em;
}
.px-faq-v4 aside h2 {
    margin: 52px 0 26px;
    font-size: calc((clamp(44px, 4.5vw, 72px)) + 1px);
    line-height: 0.9;
    letter-spacing: -0.06em;
}
.px-faq-v4 aside p {
    margin: 0;
    color: #666;
    line-height: 1.7;
}
.px-faq-v4-list details {
    border-bottom: 1px solid #ddd;
}
.px-faq-v4-list summary {
    display: grid;
    grid-template-columns: 56px 1fr 34px;
    gap: 20px;
    align-items: center;
    padding: 26px 30px;
    cursor: pointer;
    list-style: none;
}
.px-faq-v4-list summary::-webkit-details-marker {
    display: none;
}
.px-faq-v4-list summary span {
    font-size: calc((10px) + 1px);
    font-weight: 800;
}
.px-faq-v4-list summary strong {
    font-size: calc((18px) + 1px);
}
.px-faq-v4-list summary b {
    font-size: calc((24px) + 1px);
    font-weight: 400;
}
.px-faq-v4-list details[open] summary b {
    transform: rotate(45deg);
}
.px-faq-v4-list details > div {
    padding: 0 30px 28px 106px;
}
.px-faq-v4-list details > div p {
    max-width: 720px;
    margin: 0;
    color: #666;
    line-height: 1.7;
}

/* SECTION 11 — FINAL CTA */
.px-final-v4 {
    display: grid;
    grid-template-columns: 120px 1fr;
    min-height: 600px;
    background: #000;
    color: #fff;
    border-top: 1px solid #292929;
}
.px-final-v4-index {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 34px 0 34px 34px;
    border-right: 1px solid #292929;
    font-size: calc((11px) + 1px);
    font-weight: 800;
    letter-spacing: 0.12em;
}
.px-final-v4-index span:last-child {
    writing-mode: vertical-rl;
    transform: rotate(180deg);
}
.px-final-v4-main {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 72px clamp(34px, 6vw, 100px);
}
.px-final-v4-main h2 {
    max-width: 1100px;
    margin: 0;
    font-size: calc((clamp(60px, 8vw, 138px)) + 1px);
    line-height: 0.82;
    letter-spacing: -0.075em;
}
.px-final-v4-main p {
    max-width: 660px;
    margin: 40px 0 0;
    color: #999;
    font-size: calc((16px) + 1px);
    line-height: 1.7;
}
.px-final-v4-main a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 660px;
    margin-top: 50px;
    padding: 18px 0;
    border-top: 1px solid #555;
    border-bottom: 1px solid #555;
    color: #fff;
    text-decoration: none;
    font-weight: 800;
}

body .px-designs-v4,
body .px-work-v4,
body .px-products-v4,
body .px-faq-v4 {
    background: #000;
    color: #fff;
}
body .px-about-v4,
body .px-testimonials-v4 {
    background: #111;
    color: #fff;
}
body .px-designs-v4-head,
body .px-designs-v4-row,
body .px-designs-v4-cta,
body .px-about-v4-meta,
body .px-about-v4-link,
body .px-products-v4-grid,
body .px-products-v4-card,
body .px-testimonials-v4-list,
body .px-testimonials-v4 blockquote,
body .px-faq-v4,
body .px-faq-v4 > aside,
body .px-faq-v4-list details {
    border-color: #333;
}
body .px-designs-v4-head p,
body .px-about-v4-copy > p,
body .px-products-v4-copy p,
body .px-testimonials-v4 header > p,
body .px-faq-v4 aside p,
body .px-faq-v4-list details > div p {
    color: #aaa;
}
body .px-about-v4-tags span {
    border-color: #444;
}
body .px-designs-v4-open {
    border-color: #fff;
}

@media (max-width: 980px) {
    .px-process-v4-head,
    .px-products-v4-head,
    .px-testimonials-v4 > header {
        grid-template-columns: 1fr;
    }
    .px-process-v4-track {
        grid-template-columns: 1fr;
    }
    .px-process-v4-item {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: none;
        border-right: 0;
        border-bottom: 1px solid #292929;
    }
    .px-designs-v4-row {
        grid-template-columns: 48px 1fr 48px;
    }
    .px-designs-v4-row figure {
        grid-column: 1/-1;
        grid-row: 2;
        height: 260px;
    }
    .px-about-v4,
    .px-strategy-v4,
    .px-why-v4,
    .px-faq-v4 {
        grid-template-columns: 1fr;
    }
    .px-about-v4-media {
        min-height: 420px;
    }
    .px-about-v4-copy,
    .px-why-v4-left,
    .px-faq-v4 > aside {
        border-right: 0;
        border-bottom: 1px solid #333;
    }
    .px-work-v4-grid {
        grid-template-columns: 1fr 1fr;
    }
    .px-work-v4-card-4 {
        grid-column: auto;
    }
    .px-products-v4-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 680px) {
    .px-process-v4-head,
    .px-designs-v4,
    .px-work-v4,
    .px-products-v4,
    .px-testimonials-v4 {
        padding-left: 15px;
        padding-right: 15px;
    }
    .px-process-v4-head {
        padding-top: 48px;
        padding-bottom: 34px;
    }
    .px-process-v4-item {
        display: block;
    }
    .px-process-v4-item figure {
        height: 250px;
    }
    .px-designs-v4-head {
        grid-template-columns: 1fr;
        padding-top: 48px;
    }
    .px-designs-v4-row {
        grid-template-columns: 38px 1fr 44px;
        gap: 12px;
    }
    .px-designs-v4-row figure {
        height: 210px;
    }
    .px-about-v4-media {
        min-height: 300px;
    }
    .px-about-v4-copy {
        padding: 44px 15px;
    }
    .px-work-v4 header {
        display: block;
    }
    .px-work-v4 header h2 {
        margin-top: 30px;
        text-align: left;
    }
    .px-work-v4-grid {
        grid-template-columns: 1fr;
        grid-auto-rows: 300px;
    }
    .px-work-v4-card-1,
    .px-work-v4-card-5 {
        grid-row: auto;
    }
    .px-why-v4-left,
    .px-faq-v4 > aside {
        padding: 48px 15px;
    }
    .px-why-v4-right article {
        grid-template-columns: 38px 1fr 40px;
        gap: 12px;
        padding: 24px 15px;
    }
    .px-why-v4-right article p {
        grid-column: 2/-1;
    }
    .px-products-v4-grid {
        grid-template-columns: 1fr;
    }
    .px-strategy-v4-copy {
        padding: 48px 15px;
    }
    .px-strategy-v4-media {
        min-height: 360px;
    }
    .px-testimonials-v4 blockquote {
        grid-template-columns: 38px 1fr;
        padding: 28px 0;
    }
    .px-testimonials-v4 footer {
        grid-column: 2;
    }
    .px-faq-v4-list summary {
        grid-template-columns: 38px 1fr 28px;
        padding: 22px 15px;
    }
    .px-faq-v4-list details > div {
        padding: 0 15px 24px 53px;
    }
    .px-final-v4 {
        grid-template-columns: 1fr;
        min-height: 0;
    }
    .px-final-v4-index {
        flex-direction: row;
        padding: 16px 15px;
        border-right: 0;
        border-bottom: 1px solid #292929;
    }
    .px-final-v4-index span:last-child {
        writing-mode: horizontal-tb;
        transform: none;
    }
    .px-final-v4-main {
        padding: 52px 15px;
    }
    .px-final-v4-main h2 {
        font-size: calc((clamp(54px, 17vw, 86px)) + 1px);
    }
}

/* =========================================================
   NORTHLINE Builders v1.3.41
   GAME REMOVED + FOOTER TOTAL REDESIGN
   ========================================================= */

/* Ensure any legacy game/arcade module is not rendered visually. */
[class*="game-section"],
[class*="mosquito-game"],
[class*="arcade-section"],
.px-game,
.px-arcade,
.px-cyber-game {
    display: none;
}

/* FOOTER V5 */
.px-footer-v5 {
    background: #050505;
    color: #fff;
    border-top: 1px solid #222;
}

.px-footer-v5 a {
    color: inherit;
    text-decoration: none;
}

.px-footer-v5-top {
    display: grid;
    grid-template-columns: minmax(260px, 0.72fr) minmax(280px, 0.62fr) minmax(420px, 1.16fr);
    min-height: 540px;
    border-bottom: 1px solid #262626;
}

.px-footer-v5-brand,
.px-footer-v5-nav,
.px-footer-v5-cta {
    padding: 58px 36px;
}

.px-footer-v5-brand,
.px-footer-v5-nav {
    border-right: 1px solid #262626;
}

.px-footer-v5-brand {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.px-footer-v5-brandmark {
    min-height: 42px;
}

.px-footer-v5-brandmark strong {
    font-size: calc((32px) + 1px);
    letter-spacing: -0.05em;
}

.px-footer-logo {
    display: block;
    width: auto;
    max-width: 220px;
    max-height: 48px;
    object-fit: contain;
}

.px-footer-logo-dark {
    display: block;
}
.px-footer-logo-light {
    display: none;
}

.px-footer-v5-brand p {
    max-width: 360px;
    margin: 40px 0 0;
    color: #8e8e8e;
    font-size: calc((14px) + 1px);
    line-height: 1.75;
}

.px-footer-v5-nav {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 36px;
    align-content: start;
}

.px-footer-v5-nav > div {
    display: flex;
    flex-direction: column;
}

.px-footer-v5-nav span,
.px-footer-v5-cta > span {
    margin-bottom: 28px;
    color: #7f7f7f;
    font-size: calc((10px) + 1px);
    font-weight: 800;
    letter-spacing: 0.16em;
}

.px-footer-v5-nav a {
    width: max-content;
    margin: 0 0 16px;
    font-size: calc((15px) + 1px);
    font-weight: 650;
}

.px-footer-v5-cta {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.px-footer-v5-cta h2 {
    margin: 0;
    max-width: 760px;
    font-size: calc((clamp(46px, 5.2vw, 88px)) + 1px);
    line-height: 0.88;
    letter-spacing: -0.065em;
}

.px-footer-v5-cta > a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 42px;
    padding: 18px 0;
    border-top: 1px solid #3a3a3a;
    border-bottom: 1px solid #3a3a3a;
    font-size: calc((13px) + 1px);
    font-weight: 800;
    letter-spacing: 0.04em;
}

.px-footer-v5-cta > a b {
    font-size: calc((22px) + 1px);
    font-weight: 400;
}

.px-footer-v5-social {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    border-bottom: 1px solid #262626;
}

.px-footer-v5-social a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 76px;
    padding: 0 18px;
    border-right: 1px solid #262626;
    font-size: calc((12px) + 1px);
    font-weight: 700;
}

.px-footer-v5-social a:last-child {
    border-right: 0;
}

.px-footer-v5-social a b {
    font-size: calc((16px) + 1px);
    font-weight: 400;
}

.px-footer-v5-bottom {
    display: grid;
    grid-template-columns: 1fr 1fr auto;
    gap: 24px;
    align-items: center;
    min-height: 72px;
    padding: 0 24px;
    color: #747474;
    font-size: calc((10px) + 1px);
    font-weight: 700;
    letter-spacing: 0.08em;
}

.px-footer-v5-bottom span:nth-child(2) {
    text-align: center;
}

.px-footer-v5-bottom a {
    color: #fff;
}

@media (max-width: 1100px) {
    .px-footer-v5-top {
        grid-template-columns: 1fr 1fr;
    }
    .px-footer-v5-cta {
        grid-column: 1/-1;
        border-top: 1px solid #262626;
    }
    .px-footer-v5-nav {
        border-right: 0;
    }
    .px-footer-v5-social {
        grid-template-columns: repeat(3, 1fr);
    }
    .px-footer-v5-social a:nth-child(3n) {
        border-right: 0;
    }
    .px-footer-v5-social a:nth-child(-n/**/+3) {
        border-bottom: 1px solid #262626;
    }
}

@media (max-width: 700px) {
    .px-footer-v5-top {
        display: block;
        min-height: 0;
    }
    .px-footer-v5-brand,
    .px-footer-v5-nav,
    .px-footer-v5-cta {
        padding: 40px 15px;
        border-right: 0;
        border-bottom: 1px solid #262626;
    }
    .px-footer-v5-brand {
        gap: 38px;
    }
    .px-footer-v5-nav {
        grid-template-columns: 1fr 1fr;
        gap: 24px;
    }
    .px-footer-v5-cta h2 {
        font-size: calc((clamp(42px, 13vw, 66px)) + 1px);
    }
    .px-footer-v5-social {
        grid-template-columns: 1fr 1fr;
    }
    .px-footer-v5-social a {
        min-height: 62px;
    }
    .px-footer-v5-social a:nth-child(n) {
        border-right: 1px solid #262626;
        border-bottom: 1px solid #262626;
    }
    .px-footer-v5-social a:nth-child(2n) {
        border-right: 0;
    }
    .px-footer-v5-bottom {
        grid-template-columns: 1fr;
        gap: 10px;
        padding: 22px 15px;
    }
    .px-footer-v5-bottom span:nth-child(2) {
        text-align: left;
    }
}

/* =========================================================
   NORTHLINE Builders v1.3.43
   FOOTER V6 — CLEAN / SIMPLE / NEW LAYOUT
   ========================================================= */

.px-footer-v5 {
    display: none;
}

.px-footer-v6 {
    background: #0a0a0a;
    color: #fff;
    border-top: 1px solid #222;
}

.px-footer-v6 a {
    color: inherit;
    text-decoration: none;
}

.px-footer-v6-main {
    display: grid;
    grid-template-columns: minmax(260px, 1.2fr) minmax(320px, 0.9fr) minmax(260px, 0.8fr);
    gap: 40px;
    align-items: start;
    padding: 56px 24px 44px;
}

.px-footer-v6-brand {
    max-width: 460px;
}

.px-footer-v6-logo {
    display: inline-flex;
    align-items: center;
    min-height: 42px;
}

.px-footer-v6-logo img {
    display: block;
    width: auto;
    max-width: 210px;
    max-height: 46px;
    object-fit: contain;
}

.px-footer-v6-logo span {
    font-size: calc((30px) + 1px);
    line-height: 1;
    font-weight: 800;
    letter-spacing: -0.045em;
}

.px-footer-v6-logo-dark {
    display: block;
}
.px-footer-v6-logo-light {
    display: none;
}

.px-footer-v6-brand p {
    max-width: 420px;
    margin: 24px 0 0;
    color: #8f8f8f;
    font-size: calc((14px) + 1px);
    line-height: 1.7;
}

.px-footer-v6-links {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 28px;
    padding-top: 4px;
}

.px-footer-v6-links a {
    position: relative;
    width: max-content;
    font-size: calc((14px) + 1px);
    font-weight: 650;
}

.px-footer-v6-links a::after {
    content: "";
    position: absolute;
    left: 0;
    right: 100%;
    bottom: -4px;
    height: 1px;
    background: currentColor;
    transition: right 0.22s ease;
}

.px-footer-v6-links a:hover::after {
    right: 0;
}

.px-footer-v6-contact {
    padding-top: 2px;
}

.px-footer-v6-contact > span {
    display: block;
    margin-bottom: 16px;
    color: #707070;
    font-size: calc((10px) + 1px);
    font-weight: 800;
    letter-spacing: 0.16em;
}

.px-footer-v6-contact > a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    padding: 14px 0;
    border-top: 1px solid #333;
    border-bottom: 1px solid #333;
}

.px-footer-v6-contact strong {
    font-size: calc((22px) + 1px);
    line-height: 1;
    letter-spacing: -0.035em;
}

.px-footer-v6-contact b {
    font-size: calc((18px) + 1px);
    font-weight: 400;
}

.px-footer-v6-social {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 22px;
    padding: 18px 24px;
    border-top: 1px solid #222;
    border-bottom: 1px solid #222;
}

.px-footer-v6-social a {
    color: #aaa;
    font-size: calc((11px) + 1px);
    font-weight: 700;
}

.px-footer-v6-social a:hover {
    color: #fff;
}

.px-footer-v6-bottom {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 24px;
    align-items: center;
    min-height: 62px;
    padding: 0 24px;
    color: #666;
    font-size: calc((10px) + 1px);
    font-weight: 700;
    letter-spacing: 0.05em;
}

.px-footer-v6-bottom span:nth-child(2) {
    text-align: center;
}

.px-footer-v6-bottom a {
    justify-self: end;
    color: #aaa;
}

.px-footer-v6-bottom a:hover {
    color: #fff;
}

@media (max-width: 900px) {
    .px-footer-v6-main {
        grid-template-columns: 1fr 1fr;
    }

    .px-footer-v6-contact {
        grid-column: 1/-1;
    }
}

@media (max-width: 620px) {
    .px-footer-v6-main {
        grid-template-columns: 1fr;
        gap: 34px;
        padding: 38px 15px 30px;
    }

    .px-footer-v6-links {
        grid-template-columns: 1fr 1fr;
        gap: 14px 22px;
    }

    .px-footer-v6-contact {
        grid-column: auto;
    }

    .px-footer-v6-social {
        padding: 16px 15px;
        gap: 12px 18px;
    }

    .px-footer-v6-bottom {
        grid-template-columns: 1fr;
        gap: 8px;
        min-height: 0;
        padding: 18px 15px;
    }

    .px-footer-v6-bottom span:nth-child(2) {
        text-align: left;
    }

    .px-footer-v6-bottom a {
        justify-self: start;
    }
}

/* NORTHLINE Builders v1.3.44 — SEARCH label weight */
.px-desktop-searchbar-submit,
.px-mobile-inline-search-submit {
    font-weight: 700;
}

/* NORTHLINE Builders v1.3.45 — Section 1 simple & clean */
.px-exclusive-v3 {
    display: none;
}
.px-exclusive-v4 {
    width: 100%;
    background: #fff;
    color: #000;
    border-bottom: 1px solid #dedede;
}
.px-exclusive-v4-inner {
    width: 100%;
    padding: 68px 32px 72px;
}
.px-exclusive-v4-label {
    display: flex;
    align-items: center;
    gap: 18px;
    padding-bottom: 18px;
    border-bottom: 1px solid #111;
    font-size: calc((10px) + 1px);
    line-height: 1;
    font-weight: 800;
    letter-spacing: 0.15em;
}
.px-exclusive-v4-label span:first-child {
    color: #0057b8;
}
.px-exclusive-v4-content {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
    gap: clamp(48px, 7vw, 120px);
    align-items: end;
    padding-top: 52px;
}
.px-exclusive-v4 h2 {
    margin: 0;
    max-width: 1000px;
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((clamp(58px, 7.2vw, 118px)) + 1px);
    line-height: 0.88;
    font-weight: 800;
    letter-spacing: -0.07em;
}
.px-exclusive-v4-copy {
    max-width: 440px;
    justify-self: end;
}
.px-exclusive-v4-copy p {
    margin: 0;
    color: #555;
    font-size: calc((15px) + 1px);
    line-height: 1.7;
}
.px-exclusive-v4-copy strong {
    display: block;
    margin-top: 30px;
    color: #0057b8;
    font-size: calc((12px) + 1px);
    font-weight: 800;
    letter-spacing: 0.14em;
}
body .px-exclusive-v4 {
    background: #000;
    color: #fff;
    border-color: #292929;
}
body .px-exclusive-v4-label {
    border-color: #fff;
}
body .px-exclusive-v4-copy p {
    color: #aaa;
}
@media (max-width: 760px) {
    .px-exclusive-v4-inner {
        padding: 44px 15px 48px;
    }
    .px-exclusive-v4-content {
        grid-template-columns: 1fr;
        gap: 32px;
        padding-top: 36px;
    }
    .px-exclusive-v4 h2 {
        font-size: calc((clamp(52px, 15vw, 76px)) + 1px);
        line-height: 0.9;
    }
    .px-exclusive-v4-copy {
        max-width: 520px;
        justify-self: start;
    }
    .px-exclusive-v4-copy strong {
        margin-top: 22px;
    }
}

/* =========================================================
   NORTHLINE Builders v1.3.46
   ANNOUNCEMENT TWO-TEXT SYSTEM + FOOTER V7
   ========================================================= */

/* Announcement: text 1 bold + text 2 regular, still one line */
.px-announcement-content {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.38em;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.px-announcement-text-1 {
    flex: 0 0 auto;
    font-weight: 700;
}

.px-announcement-text-2 {
    min-width: 0;
    font-weight: 400;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 760px) {
    .px-announcement-content {
        justify-content: flex-start;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}

/* Retire previous footer layouts */
.px-footer-v5,
.px-footer-v6 {
    display: none;
}

/* Footer V7 — minimal premium */
.px-footer-v7 {
    background: #070707;
    color: #fff;
    border-top: 1px solid #1d1d1d;
}

.px-footer-v7 a {
    color: inherit;
    text-decoration: none;
}

.px-footer-v7-shell {
    width: 100%;
    padding: 0 24px;
}

.px-footer-v7-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 40px;
    padding: 44px 0 34px;
    border-bottom: 1px solid #242424;
}

.px-footer-v7-logo {
    display: inline-flex;
    align-items: center;
    min-height: 42px;
}

.px-footer-v7-logo img {
    display: block;
    width: auto;
    max-width: 210px;
    max-height: 46px;
    object-fit: contain;
}

.px-footer-v7-logo span {
    font-size: calc((30px) + 1px);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.05em;
}

.px-footer-v7-logo-dark {
    display: block;
}
.px-footer-v7-logo-light {
    display: none;
}

.px-footer-v7-head p {
    max-width: 460px;
    margin: 0;
    color: #8d8d8d;
    font-size: calc((13px) + 1px);
    line-height: 1.7;
    text-align: right;
}

.px-footer-v7-body {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(320px, 0.6fr);
    gap: 64px;
    padding: 64px 0 70px;
    border-bottom: 1px solid #242424;
}

.px-footer-v7-kicker,
.px-footer-v7-label {
    display: block;
    color: #6e6e6e;
    font-size: calc((10px) + 1px);
    font-weight: 800;
    letter-spacing: 0.16em;
}

.px-footer-v7-cta > a {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 28px;
    margin-top: 28px;
    padding-bottom: 20px;
    border-bottom: 1px solid #3a3a3a;
}

.px-footer-v7-cta > a > span {
    max-width: 900px;
    font-size: calc((clamp(48px, 6.5vw, 104px)) + 1px);
    line-height: 0.88;
    font-weight: 700;
    letter-spacing: -0.065em;
}

.px-footer-v7-cta > a > b {
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    width: 52px;
    height: 52px;
    border: 1px solid #3b3b3b;
    border-radius: 50%;
    font-size: calc((20px) + 1px);
    font-weight: 400;
}

.px-footer-v7-links {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-content: end;
}

.px-footer-v7-links > div {
    display: flex;
    flex-direction: column;
    gap: 13px;
}

.px-footer-v7-links .px-footer-v7-label {
    margin-bottom: 11px;
}

.px-footer-v7-links a {
    width: max-content;
    color: #d0d0d0;
    font-size: calc((14px) + 1px);
    font-weight: 500;
}

.px-footer-v7-links a:hover {
    color: #fff;
}

.px-footer-v7-meta {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 30px;
    align-items: center;
    min-height: 68px;
}

.px-footer-v7-socials {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 20px;
}

.px-footer-v7-socials a,
.px-footer-v7-legal {
    color: #777;
    font-size: calc((10px) + 1px);
    font-weight: 700;
    letter-spacing: 0.04em;
}

.px-footer-v7-socials a:hover,
.px-footer-v7-legal a:hover {
    color: #fff;
}

.px-footer-v7-legal {
    display: flex;
    align-items: center;
    gap: 24px;
}

.px-footer-v7-legal a {
    color: #aaa;
}

@media (max-width: 900px) {
    .px-footer-v7-body {
        grid-template-columns: 1fr;
        gap: 48px;
    }

    .px-footer-v7-links {
        max-width: 520px;
    }
}

@media (max-width: 620px) {
    .px-footer-v7-shell {
        padding: 0 15px;
    }

    .px-footer-v7-head {
        display: block;
        padding: 34px 0 28px;
    }

    .px-footer-v7-head p {
        max-width: 420px;
        margin-top: 22px;
        text-align: left;
    }

    .px-footer-v7-body {
        gap: 42px;
        padding: 46px 0 48px;
    }

    .px-footer-v7-cta > a {
        align-items: flex-end;
        margin-top: 22px;
    }

    .px-footer-v7-cta > a > span {
        font-size: calc((clamp(44px, 13.6vw, 68px)) + 1px);
    }

    .px-footer-v7-cta > a > b {
        width: 44px;
        height: 44px;
    }

    .px-footer-v7-links {
        grid-template-columns: 1fr 1fr;
        gap: 28px;
    }

    .px-footer-v7-meta {
        grid-template-columns: 1fr;
        gap: 18px;
        padding: 20px 0;
    }

    .px-footer-v7-legal {
        justify-content: space-between;
        gap: 16px;
    }
}

/* NORTHLINE Builders v1.3.47 — announcement empty-field fix + smaller type */
.px-announcement-content,
.px-announcement-text-1,
.px-announcement-text-2 {
    font-size: calc((11px) + 1px);
}
.px-announcement-text-1 {
    font-weight: 700;
}
.px-announcement-text-2 {
    font-weight: 400;
}
@media (max-width: 760px) {
    .px-announcement-content,
    .px-announcement-text-1,
    .px-announcement-text-2 {
        font-size: calc((10px) + 1px);
    }
}

/* NORTHLINE Builders v1.3.48 — announcement type rebalance */
.px-announcement-content,
.px-announcement-text-1,
.px-announcement-text-2 {
    font-size: calc((13px) + 1px);
}
@media (max-width: 760px) {
    .px-announcement-content,
    .px-announcement-text-1,
    .px-announcement-text-2 {
        font-size: calc((12px) + 1px);
    }
}

/* =========================================================
   NORTHLINE Builders v1.3.50
   Announcement +1px / bullet separator / compact footer
   ========================================================= */

/* Announcement: +1px from v1.3.49 */
.px-announcement-content,
.px-announcement-text-1,
.px-announcement-text-2,
.px-announcement-separator {
    font-size: calc((14px) + 1px);
}

.px-announcement-separator {
    flex: 0 0 auto;
    font-weight: 700;
    line-height: 1;
    opacity: 0.72;
    margin: 0 0.08em;
}

@media (max-width: 760px) {
    .px-announcement-content,
    .px-announcement-text-1,
    .px-announcement-text-2,
    .px-announcement-separator {
        font-size: calc((13px) + 1px);
    }
}

/* Footer V7 — remove oversized empty/CTA space, keep premium + compact */
.px-footer-v7-head {
    padding: 30px 0 24px;
}

.px-footer-v7-body {
    grid-template-columns: minmax(0, 1.15fr) minmax(300px, 0.85fr);
    gap: 44px;
    padding: 34px 0 36px;
    align-items: end;
}

.px-footer-v7-cta > a {
    margin-top: 18px;
    padding-bottom: 14px;
}

.px-footer-v7-cta > a > span {
    max-width: 760px;
    font-size: calc((clamp(34px, 4.2vw, 66px)) + 1px);
    line-height: 0.92;
    letter-spacing: -0.05em;
}

.px-footer-v7-cta > a > b {
    width: 44px;
    height: 44px;
    font-size: calc((17px) + 1px);
}

.px-footer-v7-meta {
    min-height: 54px;
}

@media (max-width: 900px) {
    .px-footer-v7-body {
        gap: 34px;
        padding: 32px 0 34px;
    }
}

@media (max-width: 620px) {
    .px-footer-v7-head {
        padding: 26px 0 22px;
    }

    .px-footer-v7-body {
        gap: 30px;
        padding: 30px 0 32px;
    }

    .px-footer-v7-cta > a {
        margin-top: 16px;
        padding-bottom: 12px;
    }

    .px-footer-v7-cta > a > span {
        font-size: calc((clamp(34px, 10.5vw, 48px)) + 1px);
        line-height: 0.94;
    }

    .px-footer-v7-cta > a > b {
        width: 40px;
        height: 40px;
    }

    .px-footer-v7-meta {
        gap: 14px;
        padding: 16px 0;
    }
}

/* =========================================================
   NORTHLINE Builders v1.3.51
   SECTION 6 — SECTION 8 LANGUAGE, REVERSED
   image left / space / copy right
   ========================================================= */

.px-why-v4 {
    display: none;
}

.px-why-v5 {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    min-height: 620px;
    background: #0057b8;
    color: #fff;
}

.px-why-v5-media {
    position: relative;
    min-width: 0;
    min-height: 620px;
    margin: 0;
    overflow: hidden;
}

.px-why-v5-media img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 620px;
    object-fit: cover;
}

.px-why-v5-media figcaption {
    position: absolute;
    left: 24px;
    right: 24px;
    bottom: 22px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
    color: #fff;
    font-size: calc((10px) + 1px);
    font-weight: 800;
    letter-spacing: 0.12em;
}

.px-why-v5-copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: clamp(64px, 7vw, 118px) clamp(34px, 6vw, 96px);
}

.px-why-v5-copy > span {
    display: block;
    margin-bottom: 30px;
    font-size: calc((10px) + 1px);
    line-height: 1;
    font-weight: 800;
    letter-spacing: 0.16em;
    opacity: 0.72;
}

.px-why-v5-copy h2 {
    max-width: 760px;
    margin: 0;
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((clamp(48px, 5.8vw, 92px)) + 1px);
    line-height: 0.9;
    font-weight: 700;
    letter-spacing: -0.06em;
}

.px-why-v5-copy p {
    max-width: 620px;
    margin: 34px 0 0;
    font-size: calc((15px) + 1px);
    line-height: 1.75;
    opacity: 0.82;
}

body .px-why-v5 {
    background: #06479a;
}

@media (max-width: 900px) {
    .px-why-v5 {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .px-why-v5-media,
    .px-why-v5-media img {
        min-height: 0;
        aspect-ratio: 16/10;
    }

    .px-why-v5-copy {
        padding: 56px 24px 62px;
    }
}

@media (max-width: 620px) {
    .px-why-v5-media,
    .px-why-v5-media img {
        aspect-ratio: 4/3;
    }

    .px-why-v5-media figcaption {
        left: 15px;
        right: 15px;
        bottom: 14px;
        gap: 7px 12px;
        font-size: calc((9px) + 1px);
    }

    .px-why-v5-copy {
        padding: 44px 15px 48px;
    }

    .px-why-v5-copy > span {
        margin-bottom: 22px;
    }

    .px-why-v5-copy h2 {
        font-size: calc((clamp(44px, 13vw, 64px)) + 1px);
    }

    .px-why-v5-copy p {
        margin-top: 24px;
        font-size: calc((14px) + 1px);
    }
}

/* =========================================================
   NORTHLINE Builders v1.3.52
   Testimonials + FAQ removed.
   Section 11 V5 — clean editorial redesign
   ========================================================= */

.px-testimonials-v4,
.px-faq-v4,
.px-final-v4 {
    display: none;
}

.px-final-v5 {
    width: 100%;
    background: #fff;
    color: #000;
    border-top: 1px solid #e5e5e5;
}

.px-final-v5-shell {
    width: 100%;
    padding: 34px 32px 72px;
}

.px-final-v5-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding-bottom: 18px;
    border-bottom: 1px solid #111;
    font-size: calc((10px) + 1px);
    line-height: 1;
    font-weight: 800;
    letter-spacing: 0.15em;
}

.px-final-v5-meta span:first-child {
    color: #0057b8;
}

.px-final-v5-content {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.65fr);
    gap: clamp(52px, 8vw, 140px);
    align-items: end;
    padding-top: 58px;
}

.px-final-v5 h2 {
    max-width: 980px;
    margin: 0;
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((clamp(54px, 7vw, 112px)) + 1px);
    line-height: 0.9;
    font-weight: 700;
    letter-spacing: -0.065em;
}

.px-final-v5-side {
    max-width: 460px;
    justify-self: end;
}

.px-final-v5-side p {
    margin: 0;
    color: #555;
    font-size: calc((15px) + 1px);
    line-height: 1.75;
}

.px-final-v5-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-top: 34px;
    padding: 16px 0;
    border-top: 1px solid #111;
    border-bottom: 1px solid #111;
    color: #000;
    text-decoration: none;
    font-size: calc((13px) + 1px);
    font-weight: 800;
    letter-spacing: 0.03em;
}

.px-final-v5-link b {
    font-size: calc((18px) + 1px);
    font-weight: 400;
}

.px-final-v5-link:hover {
    color: #0057b8;
}

body .px-final-v5 {
    background: #000;
    color: #fff;
    border-color: #242424;
}

body .px-final-v5-meta {
    border-color: #fff;
}

body .px-final-v5-side p {
    color: #aaa;
}

body .px-final-v5-link {
    color: #fff;
    border-color: #fff;
}

body .px-final-v5-link:hover {
    color: #6ca8ff;
}

@media (max-width: 760px) {
    .px-final-v5-shell {
        padding: 28px 15px 46px;
    }

    .px-final-v5-content {
        grid-template-columns: 1fr;
        gap: 34px;
        padding-top: 38px;
    }

    .px-final-v5 h2 {
        font-size: calc((clamp(48px, 14vw, 72px)) + 1px);
        line-height: 0.92;
    }

    .px-final-v5-side {
        max-width: 520px;
        justify-self: start;
    }

    .px-final-v5-link {
        margin-top: 26px;
    }
}

/* =========================================================
   NORTHLINE Builders v1.3.53
   FOOTER V8 — ULTRA MINIMAL
   ========================================================= */
.px-footer-v5,
.px-footer-v6,
.px-footer-v7 {
    display: none;
}

.px-footer-v8 {
    width: 100%;
    background: #070707;
    color: #fff;
    border-top: 1px solid #242424;
}

.px-footer-v8 a {
    color: inherit;
    text-decoration: none;
}

.px-footer-v8-row {
    display: flex;
    align-items: center;
    gap: 30px;
    min-height: 72px;
    padding: 0 24px;
}

.px-footer-v8-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    white-space: nowrap;
}

.px-footer-v8-brand strong {
    font-size: calc((13px) + 1px);
    font-weight: 700;
}

.px-footer-v8-brand span {
    color: #666;
    font-size: calc((10px) + 1px);
    font-weight: 600;
}

.px-footer-v8-socials {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px 18px;
    margin-left: auto;
    margin-right: auto;
}

.px-footer-v8-socials a,
.px-footer-v8-top {
    color: #8d8d8d;
    font-size: calc((10px) + 1px);
    font-weight: 700;
    letter-spacing: 0.05em;
}

.px-footer-v8-socials a:hover,
.px-footer-v8-top:hover {
    color: #fff;
}

.px-footer-v8-top {
    white-space: nowrap;
}

@media (max-width: 700px) {
    .px-footer-v8-row {
        display: block;
        min-height: 0;
        padding: 24px 15px 22px;
    }

    .px-footer-v8-brand {
        justify-content: space-between;
        padding-bottom: 17px;
        border-bottom: 1px solid #242424;
    }

    .px-footer-v8-socials {
        justify-content: flex-start;
        margin: 17px 0 0;
        gap: 10px 16px;
    }

    .px-footer-v8-top {
        display: inline-block;
        margin-top: 20px;
    }
}

/* =========================================================
   NORTHLINE Builders v1.3.54
   FOOTER V9 — MINIMAL, BUT WITH REAL VERTICAL STRUCTURE
   ========================================================= */
.px-footer-v8 {
    display: none;
}

.px-footer-v9 {
    width: 100%;
    background: #070707;
    color: #fff;
    border-top: 1px solid #242424;
}
.px-footer-v9 a {
    color: inherit;
    text-decoration: none;
}
.px-footer-v9-inner {
    padding: 34px 24px 22px;
}

.px-footer-v9-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 40px;
    padding-bottom: 28px;
}
.px-footer-v9-brand strong {
    display: block;
    font-size: calc((18px) + 1px);
    line-height: 1;
    font-weight: 700;
    letter-spacing: -0.02em;
}
.px-footer-v9-brand p {
    max-width: 520px;
    margin: 12px 0 0;
    color: #777;
    font-size: calc((12px) + 1px);
    line-height: 1.55;
}
.px-footer-v9-toplink {
    flex: 0 0 auto;
    color: #8b8b8b;
    font-size: calc((10px) + 1px);
    font-weight: 700;
    letter-spacing: 0.08em;
}
.px-footer-v9-toplink:hover {
    color: #fff;
}

.px-footer-v9-socials {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 22px;
    padding: 20px 0;
    border-top: 1px solid #242424;
    border-bottom: 1px solid #242424;
}
.px-footer-v9-socials a {
    color: #aaa;
    font-size: calc((11px) + 1px);
    font-weight: 700;
}
.px-footer-v9-socials a:hover {
    color: #fff;
}

.px-footer-v9-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding-top: 20px;
    color: #595959;
    font-size: calc((9px) + 1px);
    font-weight: 700;
    letter-spacing: 0.08em;
}

@media (max-width: 620px) {
    .px-footer-v9-inner {
        padding: 28px 15px 20px;
    }
    .px-footer-v9-top {
        display: block;
        padding-bottom: 24px;
    }
    .px-footer-v9-brand p {
        max-width: 360px;
        margin-top: 10px;
    }
    .px-footer-v9-toplink {
        display: inline-block;
        margin-top: 22px;
    }
    .px-footer-v9-socials {
        gap: 12px 18px;
        padding: 18px 0;
    }
    .px-footer-v9-bottom {
        display: block;
        padding-top: 18px;
    }
    .px-footer-v9-bottom span {
        display: block;
    }
    .px-footer-v9-bottom span + span {
        margin-top: 7px;
    }
}

/* =========================================================
   NORTHLINE Builders v1.3.55
   PROCESS — normal paragraph width
   ========================================================= */
.px-process-v4-item p {
    width: auto;
    max-width: 300px;
    min-width: 0;
    white-space: normal;
    word-break: normal;
    overflow-wrap: normal;
    text-wrap: pretty;
}

@media (min-width: 901px) {
    .px-process-v4-item p {
        max-width: 320px;
    }
}

@media (max-width: 900px) {
    .px-process-v4-item p {
        max-width: 460px;
    }
}

/* =========================================================
   NORTHLINE Builders v1.3.58
   PROCESS — structural text placement fix
   ========================================================= */
.px-process-v4-copy {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr);
    grid-template-areas:
        "number title"
        ". description";
    column-gap: 16px;
    row-gap: 14px;
    padding: 28px 24px 32px;
}

.px-process-v4-copy > span {
    grid-area: number;
    align-self: start;
}

.px-process-v4-copy > h3 {
    grid-area: title;
    min-width: 0;
}

.px-process-v4-copy > p {
    grid-area: description;
    width: 100%;
    max-width: 420px;
    min-width: 0;
    margin: 0;
    white-space: normal;
    word-break: normal;
    overflow-wrap: break-word;
}

@media (max-width: 900px) {
    .px-process-v4-copy > p {
        max-width: 560px;
    }
}

@media (max-width: 620px) {
    .px-process-v4-copy {
        grid-template-columns: 42px minmax(0, 1fr);
        column-gap: 12px;
        row-gap: 12px;
        padding: 22px 15px 26px;
    }
}

/* =========================================================
   NORTHLINE Builders v1.3.59
   SECTION 1 + SECTION 3 TITLES MATCH SECTION 2 TYPOGRAPHY
   ========================================================= */

/* Same title writing treatment as Section 2:
   uppercase, compact editorial weight, controlled line-height/spacing. */
.px-exclusive-v4 h2,
.px-process-v4-head h2 {
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((clamp(48px, 6.2vw, 96px)) + 1px);
    line-height: 0.92;
    font-weight: 700;
    letter-spacing: -0.055em;
    text-transform: uppercase;
}

/* Do not force artificial line breaks visually on Section 1/3. */
.px-exclusive-v4 h2 br,
.px-process-v4-head h2 br {
    display: none;
}

@media (max-width: 760px) {
    .px-exclusive-v4 h2,
    .px-process-v4-head h2 {
        font-size: calc((clamp(44px, 13vw, 68px)) + 1px);
        line-height: 0.94;
        letter-spacing: -0.05em;
    }
}

/* =========================================================
   NORTHLINE Builders v1.3.60
   SECTION 1 + 3 TITLES = SECTION 2 TITLE STYLE
   ========================================================= */

.px-exclusive-v4 h2,
.px-process-v4-head h2 {
    margin: 0;
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((clamp(46px, 5.3vw, 82px)) + 1px);
    line-height: 0.9;
    font-weight: inherit;
    letter-spacing: -0.06em;
    text-transform: none;
}

.px-exclusive-v4 h2 br,
.px-process-v4-head h2 br {
    display: none;
}

/* Preserve normal-case typography exactly like Section 2. */
.px-exclusive-v4 h2,
.px-process-v4-head h2 {
    text-transform: none;
}

@media (max-width: 760px) {
    .px-exclusive-v4 h2,
    .px-process-v4-head h2 {
        font-size: calc((clamp(46px, 5.3vw, 82px)) + 1px);
        line-height: 0.9;
        letter-spacing: -0.06em;
    }
}

/* =========================================================
   NORTHLINE Builders v1.3.62
   SECTION 4 TITLE = SECTION 2 TITLE STYLE
   ========================================================= */
.px-work-v4-head h2 {
    margin: 0;
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((clamp(46px, 5.3vw, 82px)) + 1px);
    line-height: 0.9;
    font-weight: inherit;
    letter-spacing: -0.06em;
    text-transform: none;
}

.px-work-v4-head h2 br {
    display: none;
}

@media (max-width: 760px) {
    .px-work-v4-head h2 {
        font-size: calc((clamp(46px, 5.3vw, 82px)) + 1px);
        line-height: 0.9;
        letter-spacing: -0.06em;
    }
}

/* =========================================================
   NORTHLINE Builders v1.3.63
   SECTION 4 TITLE — REAL MARKUP FIX
   ========================================================= */
.px-work-v4 > .px-work-v4-head h2,
.px-work-v4 > header.px-work-v4-head h2 {
    margin: 0;
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((clamp(46px, 5.3vw, 82px)) + 1px);
    line-height: 0.9;
    font-weight: inherit;
    letter-spacing: -0.06em;
    text-transform: none;
}

.px-work-v4 > .px-work-v4-head h2 br {
    display: none;
}

/* =========================================================
   NORTHLINE Builders v1.3.64
   SECTION 4 TITLE — SINGLE LINE ON DESKTOP
   ========================================================= */
@media (min-width: 1181px) {
    .px-work-v4 > .px-work-v4-head h2,
    .px-work-v4 > header.px-work-v4-head h2 {
        width: 100%;
        max-width: none;
        white-space: nowrap;
        font-size: calc((clamp(34px, 4.25vw, 68px)) + 1px);
        line-height: 0.95;
        letter-spacing: -0.06em;
    }
}

/* NORTHLINE Builders v1.3.65 — Section 9 title smaller */
.px-final-v5-content h2 {
    font-size: calc((clamp(42px, 5vw, 76px)) + 1px);
    line-height: 0.94;
}
@media (max-width: 760px) {
    .px-final-v5-content h2 {
        font-size: calc((clamp(38px, 11vw, 58px)) + 1px);
    }
}

/* NORTHLINE Builders v1.3.66 — footer matches announcement bar */

/* NORTHLINE Builders v1.3.67 — Section 6 title smaller */
.px-products-v4 h2,
.px-products-v4-head h2 {
    font-size: calc((clamp(40px, 4.6vw, 72px)) + 1px);
    line-height: 0.94;
}

@media (max-width: 760px) {
    .px-products-v4 h2,
    .px-products-v4-head h2 {
        font-size: calc((clamp(36px, 10vw, 54px)) + 1px);
    }
}

/* =========================================================
   NORTHLINE Builders v1.3.68
   HEADER DESKTOP — SYMMETRIC OUTER INSETS
   One source of truth for the outer desktop geometry.
   ========================================================= */
@media (min-width: 1181px) {
    .px-header-shell {
        box-sizing: border-box;
        width: 100%;
        padding-left: 24px;
        padding-right: 24px;
    }

    .px-desktop-header-controls {
        flex: 1 1 auto;
        min-width: 0;
        margin-left: 24px;
        margin-right: 0;
        padding-right: 0;
    }

    .px-desktop-header-controls > .px-header-utility {
        margin-left: auto;
        margin-right: 0;
        padding-right: 0;
    }
}

.px-footer-v9-copyright a {
    color: inherit;
    text-decoration: none;
}
.px-footer-v9-copyright a:hover,
.px-footer-v9-copyright a:focus-visible {
    color: #fff;
}

.px-whatsapp-official {
    display: block;
    width: 100%;
    height: 100%;
}

/* =========================================================
   NORTHLINE Builders v1.3.72
   HOMEPAGE SECTION LABELS — ONE CONSISTENT SIZE
   ========================================================= */
:root {
    --signature-section-label-size: 11px;
}

.px-exclusive-v4-label,
.px-designs-v4-head > span,
.px-process-v4-head > span,
.px-work-v4 > header > span,
.px-why-v5-copy > span,
.px-products-v4-head > span,
.px-strategy-v4-copy > span,
.px-final-v5-meta > span,
.px-final-v5 > span {
    font-size: var(--signature-section-label-size);
}

/* =========================================================
   NORTHLINE Builders v1.3.72
   DESKTOP HEADER — EXACTLY EQUAL PHYSICAL OUTER INSETS
   Both edges are controlled by the same variable on the same
   header shell. No transform, negative margin, or visual offset.
   ========================================================= */

/* NORTHLINE Builders v1.3.74 — neutral floating chat icon, no colored background */
.px-whatsapp {
    background: transparent;
    border: 0;
border-radius: 0;
    overflow: visible;
}
.px-whatsapp .px-floating-chat-icon {
    display: block;
    width: 100%;
    height: 100%;
    overflow: visible;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    color: currentColor;
}
.px-whatsapp .px-floating-chat-icon circle {
    fill: currentColor;
    stroke: none;
}

body .px-whatsapp {
    color: #fff;
}
.px-whatsapp:hover,
.px-whatsapp:focus-visible {
    background: transparent;
}

/* =========================================================
   NORTHLINE Builders v1.3.75
   FLOATING CONTACT — ICON-SHAPED WHITE GLOW, NO CIRCLE
   ========================================================= */
.px-whatsapp,
.px-whatsapp:hover,
.px-whatsapp:focus,
.px-whatsapp:focus-visible {
    background: transparent;
    background-image: none;
    border: 0;
    border-radius: 0;
outline: 0;
    color: #244b73;
    overflow: visible;
}

/* Remove every legacy circular/radial glow layer. */
.px-whatsapp::before,
.px-whatsapp::after {
    content: none;
    display: none;
    background: none;
animation: none;
}

/* Blue chat outline + blue dots; white glow follows SVG geometry only. */
.px-whatsapp .px-floating-chat-icon {
    display: block;
    width: 100%;
    height: 100%;
    overflow: visible;
    color: #244b73;
    fill: none;
    stroke: #244b73;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.px-whatsapp .px-floating-chat-icon circle {
    fill: #244b73;
    stroke: none;
}

/* =========================================================
   NORTHLINE Builders v1.3.77
   CLEAN FOOTER + FLOATING CONTACT
   ========================================================= */

/* Footer returns to a clean solid surface — no motif or animated light layer. */
.px-footer-v9 {
    background: #244b73;
}
body .px-footer-v9 {
    background: #000;
}
.px-footer-v9::before,
.px-footer-v9::after {
    content: none;
    display: none;
    animation: none;
    background: none;
}

/* Floating contact: icon only, no lamp dots/rings/glow/background. */
.px-whatsapp,
.px-whatsapp:hover,
.px-whatsapp:focus,
.px-whatsapp:focus-visible {
    background: transparent;
    background-image: none;
    border: 0;
    border-radius: 0;
outline: 0;
    overflow: visible;
    color: #000;
}
.px-whatsapp::before,
.px-whatsapp::after {
    content: none;
    display: none;
    animation: none;
    background: none;
}
.px-whatsapp .px-floating-chat-icon {
    color: #000;
    stroke: #000;
    filter: none;
}
.px-whatsapp .px-floating-chat-icon circle {
    fill: #000;
    stroke: none;
}

body .px-whatsapp {
    color: #fff;
}
body .px-whatsapp .px-floating-chat-icon {
    color: #fff;
    stroke: #fff;
}
body .px-whatsapp .px-floating-chat-icon circle {
    fill: #fff;
}

/* =========================================================
   NORTHLINE Builders v1.3.78
   FLOATING CONTACT — BRUSH STROKE + BREATHING LIGHT
   ========================================================= */
.px-whatsapp {
    position: relative;
    isolation: isolate;
    background: transparent;
    border: 0;
    border-radius: 0;
overflow: visible;
    color: #fff;
}

/* Original irregular paint-brush silhouette. */
.px-whatsapp .px-floating-chat-brush {
    position: absolute;
    z-index: -1;
    left: 50%;
    top: 50%;
    width: 76px;
    height: 62px;
    transform: translate(-50%, -50%);
    overflow: visible;
    fill: #3f6f8f;
animation: pxBrushContactBreath 2.35s ease-in-out infinite;
    pointer-events: none;
}

/* White icon and white dots sit above the brush stroke. */

/* Light gently brightens and dims; no circular ring is generated. */
@keyframes pxBrushContactBreath {
    0%,
    100% {
        opacity: 0.82;
}
    50% {
        opacity: 1;
}
}

/* Keep legacy circular light layers disabled. */
.px-whatsapp::before,
.px-whatsapp::after {
    content: none;
    display: none;
}

@media (prefers-reduced-motion: reduce) {
    .px-whatsapp .px-floating-chat-brush {
        animation: none;
    }
}

/* =========================================================
   NORTHLINE Builders v1.3.79
   NATURAL MULTI-STROKE CONTACT BRUSH
   ========================================================= */
.px-whatsapp .px-floating-chat-brush {
    width: 92px;
    height: 70px;
    transform: translate(-50%, -50%) rotate(-2deg);
    fill: #3f6f8f;
    overflow: visible;
    transform-origin: center;
    animation: pxNaturalBrushBreath 2.35s ease-in-out infinite;
}

/* Uneven hand-painted edges; separate strokes intentionally differ in length/opacity. */
.px-whatsapp .px-floating-chat-brush .px-brush-strokes {
}

/* Icon stays visually centered over the irregular brush. */
.px-whatsapp .px-floating-chat-icon {
    color: #fff;
    stroke: #fff;
}
.px-whatsapp .px-floating-chat-icon circle {
    fill: #fff;
}

@keyframes pxNaturalBrushBreath {
    0%,
    100% {
        opacity: 0.82;
}
    50% {
        opacity: 1;
}
}

/* =========================================================
   NORTHLINE Builders v1.3.80
   DENSE NATURAL PAINT SMEAR — REFERENCE-DRIVEN PROPORTIONS
   ========================================================= */
.px-whatsapp .px-floating-chat-brush {
    left: 50%;
    top: 50%;
    width: 104px;
    height: 68px;
    transform: translate(-50%, -50%) rotate(-7deg);
    transform-origin: center;
    fill: #3f6f8f;
    overflow: visible;
    animation: pxDenseSmearBreath 2.35s ease-in-out infinite;
}

/* Keep the white chat completely inside the painted area. */
.px-whatsapp .px-floating-chat-icon {
    position: relative;
    z-index: 2;
    width: 36px;
    height: 36px;
    color: #fff;
    stroke: #fff;
}
.px-whatsapp .px-floating-chat-icon circle {
    fill: #fff;
}

@keyframes pxDenseSmearBreath {
    0%,
    100% {
        opacity: 0.84;
}
    50% {
        opacity: 1;
}
}

/* =========================================================
   NORTHLINE Builders v1.3.81
   REAL BRUSH TEXTURE FROM THE PROVIDED REFERENCE
   ========================================================= */
.px-whatsapp .px-floating-chat-brush {
    position: absolute;
    z-index: -1;
    left: 50%;
    top: 50%;
    width: 112px;
    height: 74px;
    display: block;
    background: url("../images/floating-chat-brush.png") center/contain no-repeat;
    transform: translate(-50%, -50%) rotate(-5deg);
    transform-origin: center;
    opacity: 0.94;
    pointer-events: none;
    animation: pxRealBrushBreath 2.35s ease-in-out infinite;
}

.px-whatsapp .px-floating-chat-icon {
    position: relative;
    z-index: 2;
    width: 36px;
    height: 36px;
    color: #fff;
    stroke: #fff;
}
.px-whatsapp .px-floating-chat-icon circle {
    fill: #fff;
    stroke: none;
}

@keyframes pxRealBrushBreath {
    0%,
    100% {
        opacity: 0.84;
}
    50% {
        opacity: 1;
}
}

@media (prefers-reduced-motion: reduce) {
    .px-whatsapp .px-floating-chat-brush {
        animation: none;
    }
}

/* =========================================================
   NORTHLINE Builders v1.3.82
   FLOATING CONTACT LABEL — SHARES HEADER CTA TEXT
   Brush and icon visuals remain unchanged.
   ========================================================= */
.px-whatsapp .px-floating-contact-label {
    position: absolute;
    left: 50%;
    top: calc(100% + 9px);
    transform: translateX(-50%);
    display: block;
    width: max-content;
    max-width: 140px;
    margin: 0;
    padding: 0;
    background: none;
    border: 0;
color: #000;
    font-family: "Nunito Sans", sans-serif;
    font-size: calc((11px) + 1px);
    line-height: 1.15;
    font-weight: 700;
    letter-spacing: 0.01em;
    text-align: center;
    white-space: nowrap;
    pointer-events: none;
}

body .px-whatsapp .px-floating-contact-label {
    color: #fff;
}

/* v1.3.83 — Floating CTA label size */
.px-whatsapp .px-floating-contact-label {
    font-size: calc((17px) + 1px);
}

/* v1.3.84 — raise floating CTA label closer to brush */
.px-whatsapp .px-floating-contact-label {
    top: calc(100% + 1px);
    font-size: calc((17px) + 1px);
}

/* v1.3.85 — raise floating CTA label again + orange text outline */
.px-whatsapp .px-floating-contact-label {
    top: calc(100% - 7px);
    font-size: calc((17px) + 1px);
    -webkit-text-stroke: 1px #ff8a00;
    paint-order: stroke fill;
}

/* v1.3.86 — high-contrast floating CTA label */

body .px-whatsapp .px-floating-contact-label {
    color: #000;
    -webkit-text-stroke: 2px #fff;
    paint-order: stroke fill;
}

/* v1.3.87 — floating CTA outline doubled: 2px -> 4px */

body .px-whatsapp .px-floating-contact-label {
    -webkit-text-stroke: 4px #fff;
}
@media (max-width: 760px) {
    .px-announcement-bar .px-announcement-close {
        width: 42px;
        height: 42px;
        min-width: 42px;
        min-height: 42px;
        font-size: calc((28px) + 1px);
    }
}

@media (max-width: 1180px) {
    .px-mobile-header-actions {
        display: flex;
        align-items: center;
    }

    .px-mobile-header-actions > .px-header-utility {
        display: flex;
        align-items: center;
        visibility: visible;
    }

    .px-mobile-menu-cta {
        display: flex;
        width: 100%;
        justify-content: center;
        align-items: center;
        margin: 20px 0 16px;
    }

    .px-mobile-menu-cta .px-header-wa {
        display: inline-flex;
        visibility: visible;
        width: auto;
        min-width: 0;
        min-height: 48px;
        align-items: center;
        justify-content: center;
        margin: 0 auto;
        padding-left: 20px;
        padding-right: 20px;
        overflow: visible;
        pointer-events: auto;
        box-sizing: border-box;
    }
}

@media (min-width: 1181px) {
    .px-mobile-menu-cta {
        display: none;
    }
}

/* =========================================================
   NORTHLINE Builders v1.4.1
   UNIFIED RESPONSIVE PAGE GUTTER
   One source of truth for header + active homepage sections.
   ========================================================= */
:root {
    --signature-page-gutter: 32px;
    --signature-reference-gutter: max(16px, 2.2vw);
    --signature-header-gutter: 16px;
}

@media (max-width: 1180px) {
    :root {
        --signature-page-gutter: 16px;
    }
}

@media (min-width: 1181px) {
    .px-header-boundary > .px-brand-link {
        flex: 0 0 auto;
        margin: 0;
        padding: 0;
    }

    .px-header-boundary > .px-desktop-header-controls {
        flex: 1 1 auto;
        min-width: 0;
        margin-left: 24px;
        margin-right: 0;
        padding: 0;
    }

    .px-header-boundary .px-header-utility {
        margin-left: auto;
        margin-right: 0;
        padding: 0;
    }
}

/* Active full-width sections use the same horizontal gutter.
   This replaces independent 32px/16px values with one shared source. */
.px-exclusive-v4-inner {
    box-sizing: border-box;
    padding-left: var(--signature-page-gutter);
    padding-right: var(--signature-page-gutter);
}

.px-designs-v4,
.px-work-v4,
.px-products-v4,
.px-strategy-v4,
.px-photo-v4,
.px-final-v5 {
    box-sizing: border-box;
    padding-left: var(--signature-page-gutter);
    padding-right: var(--signature-page-gutter);
}

/* Desktop hero follows the exact Section 04 left/right reference.
   Mobile hero keeps its existing approved geometry unchanged. */
@media (min-width: 1181px) {
    body.home .px-signature-hero-inner {
        box-sizing: border-box;
        width: auto;
        max-width: none;
        margin-left: var(--signature-reference-gutter);
        margin-right: calc(var(--signature-reference-gutter) + 6px);
    }
}

/* Mobile header controls must not add a second horizontal inset. */
@media (max-width: 1180px) {
    .px-header-boundary > .px-mobile-header-actions {
        margin-right: 0;
        padding-right: 0;
    }

    .px-header-boundary > .px-brand-link {
        margin-left: 0;
        padding-left: 0;
    }
}

/* =========================================================
   NORTHLINE Builders v1.4.2
   HEADER RIGHT EDGE — preserve left edge, remove right-side inset
   ========================================================= */
@media (min-width: 1181px) {
    .px-header-boundary > .px-desktop-header-controls {
        width: auto;
        margin-right: 0;
        padding-right: 0;
    }

    .px-header-boundary .px-desktop-header-controls > .px-header-utility {
        margin-left: auto;
        margin-right: 0;
        padding-right: 0;
        justify-content: flex-end;
    }

    .px-header-boundary .px-desktop-header-controls > .px-header-utility > :last-child {
        margin-right: 0;
    }
}

@media (max-width: 1180px) {
    .px-header-boundary > .px-mobile-header-actions {
        margin-left: auto;
        margin-right: 0;
        padding-right: 0;
    }

    .px-header-boundary > .px-mobile-header-actions > :last-child {
        margin-right: 0;
    }

    .px-header-boundary .px-mobile-menu-toggle {
        margin-right: 0;
    }
}

/* =========================================================
   NORTHLINE Builders v1.4.9
   DESKTOP HEADER — site title ↔ search spacing
   Keep the search responsive; only normalize the inter-item gap.
   ========================================================= */
@media (min-width: 1181px) {
    .px-header-boundary {
        column-gap: var(--signature-page-gutter);
    }

    .px-header-boundary > .px-desktop-header-controls {
        margin-left: 0;
    }

    .px-header-boundary > .px-brand-link {
        margin-right: 0;
    }

    .px-header-boundary .px-desktop-searchbar {
        margin-left: 0;
    }
}

@media (min-width: 1181px) {
}

/* =========================================================
   NORTHLINE Builders v1.5.1
   DESKTOP SUBMENU — large column cards / mega-style dropdown
   Mobile navigation intentionally untouched.
   ========================================================= */
@media (min-width: 1181px) {
    /* Parent item anchors the dropdown panel. */
    .px-desktop-nav .menu-item-has-children {
        position: relative;
    }

    /* Turn the submenu from a vertical row list into a horizontal card grid. */
    .px-desktop-nav .menu-item-has-children > .sub-menu {
        position: absolute;
        top: calc(100% + 14px);
        left: 50%;
        transform: translateX(-50%);
        z-index: 9999;

        display: grid;
        grid-template-columns: repeat(3, minmax(190px, 1fr));
        gap: 0;

        width: max-content;
        min-width: 620px;
        max-width: min(860px, calc(100vw - 64px));

        margin: 0;
        padding: 0;

        overflow: hidden;
        border: 1px solid rgba(0, 0, 0, 0.1);
        border-radius: 0;
        background: #ffffff;
}

    /* Each submenu item becomes its own large column/card. */
    .px-desktop-nav .menu-item-has-children > .sub-menu > li {
        min-width: 0;
        margin: 0;
        padding: 0;
        border: 0;
    }

    .px-desktop-nav .menu-item-has-children > .sub-menu > li > a {
        box-sizing: border-box;
        display: flex;
        align-items: flex-end;
        justify-content: flex-start;

        min-height: 150px;
        width: 100%;

        margin: 0;
        padding: 22px 20px;

        border: 0;
        text-decoration: none;

        font-size: calc((15px) + 1px);
        line-height: 1.15;
        font-weight: 800;
        letter-spacing: -0.01em;

        transition:
            transform 0.22s ease,
            filter 0.22s ease,
            opacity 0.22s ease;
    }

    body .px-desktop-nav .menu-item-has-children > .sub-menu {
        border-color: rgba(255, 255, 255, 0.12);
}

    /* Hover: keep the design clean, no extra border clutter. */

    body .px-desktop-nav .menu-item-has-children > .sub-menu > li > a:hover,
    body .px-desktop-nav .menu-item-has-children > .sub-menu > li > a:focus {
        filter: brightness(1.1);
    }

    /* 1–2 submenu items should not look awkwardly wide. */
    .px-desktop-nav .menu-item-has-children > .sub-menu > li:only-child {
        min-width: 260px;
    }
    .px-desktop-nav .menu-item-has-children > .sub-menu:has(> li:only-child) {
        grid-template-columns: minmax(260px, 1fr);
        min-width: 260px;
    }
    .px-desktop-nav .menu-item-has-children > .sub-menu:has(> li:first-child:nth-last-child(2)) {
        grid-template-columns: repeat(2, minmax(220px, 1fr));
        min-width: 440px;
    }
}

/* =========================================================
   NORTHLINE Builders v1.5.2
   MOTION AUDIT — smoother desktop interactions
   ========================================================= */

/* Desktop submenu: smooth open/close without layout jump. */
@media (min-width: 1181px) {
    .px-desktop-nav .menu-item-has-children > .sub-menu {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;

        transform: translate(-50%, 10px);
        transform-origin: 50% 0;

        transition:
            opacity 0.22s ease,
            transform 0.26s cubic-bezier(0.2, 0.7, 0.2, 1),
            visibility 0s linear 0.26s;
    }

    .px-desktop-nav .menu-item-has-children:hover > .sub-menu,
    .px-desktop-nav .menu-item-has-children:focus-within > .sub-menu {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;

        transform: translate(-50%, 0);

        transition:
            opacity 0.18s ease,
            transform 0.22s cubic-bezier(0.2, 0.7, 0.2, 1),
            visibility 0s linear 0s;
    }

    /* Avoid the slightly jerky vertical jump on each card. */
    .px-desktop-nav .menu-item-has-children > .sub-menu > li > a {
        transform: none;
        transition:
            filter 0.18s ease,
            background-color 0.18s ease,
            color 0.18s ease;
    }

    .px-desktop-nav .menu-item-has-children > .sub-menu > li > a:hover,
    .px-desktop-nav .menu-item-has-children > .sub-menu > li > a:focus {
        transform: none;
    }
}

/* Homepage reveal motion: GPU-friendly and restrained. */
[data-motion-item] {
    backface-visibility: hidden;
    transform: translate3d(0, 0, 0);
}

[data-motion-section].is-in-view [data-motion-item] {
    will-change: auto;
}

/* Respect OS accessibility preference and remove unnecessary movement. */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto;
        animation-duration: 0.01ms;
        animation-iteration-count: 1;
        transition-duration: 0.01ms;
        transition-delay: 0s;
    }

    .px-desktop-nav .menu-item-has-children > .sub-menu {
        transform: translate(-50%, 0);
    }
}

/* =========================================================
   NORTHLINE Builders v1.5.3
   DESKTOP SUBMENU — hover bridge
   Keeps the visual 14px gap while making the submenu reachable.
   ========================================================= */
@media (min-width: 1181px) {
    .px-desktop-nav .menu-item-has-children {
        position: relative;
    }

    .px-desktop-nav .menu-item-has-children::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: 100%;
        height: 18px;
        z-index: 9998;
        background: transparent;
        pointer-events: auto;
    }

    .px-desktop-nav .menu-item-has-children > .sub-menu {
        z-index: 9999;
    }
}

/* =========================================================
   NORTHLINE Builders v1.5.9
   CINEMATIC SUBMENU — Swiss photo + layered reveal motion
   ========================================================= */

:root {
    --px-submenu-c1: 239, 51, 64;
    --px-submenu-c2: 0, 91, 172;
    --px-submenu-c3: 37, 211, 102;
    --px-submenu-c4: 255, 204, 0;
    --px-submenu-c5: 112, 48, 160;
    --px-submenu-c6: 255, 102, 0;
    --px-submenu-c7: 0, 188, 212;
    --px-submenu-c8: 214, 0, 143;
}

/* ---------- DESKTOP ---------- */
@media (min-width: 1181px) {
    .px-desktop-nav .menu-item-has-children > .sub-menu {
        position: absolute;
        overflow: hidden;
        background: #14181b;

        opacity: 0;
        visibility: hidden;
        pointer-events: none;

        clip-path: inset(0 0 100% 0 round 0);
        transform: translate(-50%, 18px) perspective(900px) rotateX(-8deg) scale(0.965);
        transform-origin: 50% 0;
        filter: blur(3px) saturate(0.9);

        transition:
            opacity 0.2s ease,
            transform 0.5s cubic-bezier(0.16, 0.84, 0.24, 1),
            clip-path 0.52s cubic-bezier(0.16, 0.84, 0.24, 1),
            filter 0.38s ease,
            visibility 0s linear 0.52s;
    }

    .px-desktop-nav .menu-item-has-children:hover > .sub-menu,
    .px-desktop-nav .menu-item-has-children:focus-within > .sub-menu {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;

        clip-path: inset(0 0 0 0 round 0);
        transform: translate(-50%, 0) perspective(900px) rotateX(0deg) scale(1);
        filter: blur(0) saturate(1);

        transition:
            opacity 0.18s ease,
            transform 0.52s cubic-bezier(0.16, 0.84, 0.24, 1),
            clip-path 0.52s cubic-bezier(0.16, 0.84, 0.24, 1),
            filter 0.34s ease,
            visibility 0s linear 0s;
    }

    .px-desktop-nav .menu-item-has-children:hover > .sub-menu::before,
    .px-desktop-nav .menu-item-has-children:focus-within > .sub-menu::before {
        transform: scale(1.02);
        filter: saturate(1.06) contrast(1.02);
    }

    .px-desktop-nav .menu-item-has-children:hover > .sub-menu::after,
    .px-desktop-nav .menu-item-has-children:focus-within > .sub-menu::after {
        opacity: 1;
        animation: pxMegaSweep 0.85s cubic-bezier(0.16, 0.84, 0.24, 1) 0.08s both;
    }

    .px-desktop-nav .sub-menu > li {
        position: relative;
        z-index: 1;
        opacity: 0;
        transform: translateY(22px) scale(0.94);
        filter: blur(5px);
        transition:
            opacity 0.26s ease,
            transform 0.46s cubic-bezier(0.16, 0.84, 0.24, 1),
            filter 0.34s ease;
    }

    .px-desktop-nav .menu-item-has-children:hover > .sub-menu > li,
    .px-desktop-nav .menu-item-has-children:focus-within > .sub-menu > li {
        opacity: 1;
        transform: translateY(0) scale(1);
        filter: blur(0);
    }

    .px-desktop-nav .sub-menu > li:nth-child(1) {
        transition-delay: 0.05s;
    }
    .px-desktop-nav .sub-menu > li:nth-child(2) {
        transition-delay: 0.09s;
    }
    .px-desktop-nav .sub-menu > li:nth-child(3) {
        transition-delay: 0.13s;
    }
    .px-desktop-nav .sub-menu > li:nth-child(4) {
        transition-delay: 0.17s;
    }
    .px-desktop-nav .sub-menu > li:nth-child(5) {
        transition-delay: 0.21s;
    }
    .px-desktop-nav .sub-menu > li:nth-child(6) {
        transition-delay: 0.25s;
    }
    .px-desktop-nav .sub-menu > li:nth-child(7) {
        transition-delay: 0.29s;
    }
    .px-desktop-nav .sub-menu > li:nth-child(8) {
        transition-delay: 0.33s;
    }

    .px-desktop-nav .sub-menu > li > a {
        backdrop-filter: blur(1px);
        -webkit-backdrop-filter: blur(1px);
        transition:
            background-color 0.22s ease,
            transform 0.26s cubic-bezier(0.16, 0.84, 0.24, 1),
            box-shadow 0.22s ease,
            filter 0.22s ease;
    }

    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+1) > a {
        background: rgba(var(--px-submenu-c1), 0.2);
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+2) > a {
        background: rgba(var(--px-submenu-c2), 0.2);
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+3) > a {
        background: rgba(var(--px-submenu-c3), 0.2);
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+4) > a {
        background: rgba(var(--px-submenu-c4), 0.2);
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+5) > a {
        background: rgba(var(--px-submenu-c5), 0.2);
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+6) > a {
        background: rgba(var(--px-submenu-c6), 0.2);
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+7) > a {
        background: rgba(var(--px-submenu-c7), 0.2);
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+8) > a {
        background: rgba(var(--px-submenu-c8), 0.2);
    }

    body .px-desktop-nav .sub-menu > li > a {
        color: #fff;
}

    .px-desktop-nav .sub-menu > li > a:hover,
    .px-desktop-nav .sub-menu > li > a:focus {
        transform: translateY(-3px) scale(1.015);
        filter: brightness(1.1) saturate(1.18);
}
}

/* ---------- MOBILE / TABLET ---------- */
@media (max-width: 1180px) {
    .px-mobile-primary-menu .menu-item-has-children > .sub-menu {
        position: relative;
        display: grid;
        box-sizing: border-box;
        grid-template-columns: 1fr;
        gap: 8px;

        width: 100%;
        max-height: 0;
        margin: 0;
        padding: 0 10px;

        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        overflow: hidden;

        border: 0 solid rgba(0, 0, 0, 0.1);
        border-radius: 14px;
        background: #14181b;

        clip-path: inset(0 0 100% 0 round 14px);
        transform: translateY(-10px) scale(0.975);
        filter: blur(2px);

        transition:
            max-height 0.62s cubic-bezier(0.16, 0.84, 0.24, 1),
            opacity 0.24s ease,
            transform 0.46s cubic-bezier(0.16, 0.84, 0.24, 1),
            clip-path 0.52s cubic-bezier(0.16, 0.84, 0.24, 1),
            filter 0.34s ease,
            visibility 0s linear 0.62s,
            margin 0.34s ease,
            padding 0.34s ease,
            border-width 0.34s ease;
    }

    .px-mobile-primary-menu li.submenu-open > .sub-menu {
        max-height: 1700px;
        margin: 10px 0 4px;
        padding: 10px;
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        border-width: 1px;

        clip-path: inset(0 0 0 0 round 14px);
        transform: translateY(0) scale(1);
        filter: blur(0);

        transition:
            max-height 0.68s cubic-bezier(0.16, 0.84, 0.24, 1),
            opacity 0.24s ease,
            transform 0.46s cubic-bezier(0.16, 0.84, 0.24, 1),
            clip-path 0.52s cubic-bezier(0.16, 0.84, 0.24, 1),
            filter 0.34s ease,
            visibility 0s linear 0s,
            margin 0.34s ease,
            padding 0.34s ease,
            border-width 0.34s ease;
    }

    .px-mobile-primary-menu li.submenu-open > .sub-menu::before {
        transform: scale(1.02);
        filter: saturate(1.06) contrast(1.02);
    }

    .px-mobile-primary-menu li.submenu-open > .sub-menu::after {
        opacity: 1;
        animation: pxMegaSweep 0.9s cubic-bezier(0.16, 0.84, 0.24, 1) 0.06s both;
    }

    .px-mobile-primary-menu .sub-menu > li {
        position: relative;
        z-index: 1;
        opacity: 0;
        transform: translateY(-14px) scale(0.96);
        filter: blur(4px);
        transition:
            opacity 0.24s ease,
            transform 0.42s cubic-bezier(0.16, 0.84, 0.24, 1),
            filter 0.3s ease;
    }

    .px-mobile-primary-menu li.submenu-open > .sub-menu > li {
        opacity: 1;
        transform: translateY(0) scale(1);
        filter: blur(0);
    }

    .px-mobile-primary-menu .sub-menu > li:nth-child(1) {
        transition-delay: 0.04s;
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(2) {
        transition-delay: 0.08s;
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(3) {
        transition-delay: 0.12s;
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(4) {
        transition-delay: 0.16s;
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(5) {
        transition-delay: 0.2s;
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(6) {
        transition-delay: 0.24s;
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(7) {
        transition-delay: 0.28s;
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8) {
        transition-delay: 0.32s;
    }

    .px-mobile-primary-menu .sub-menu > li > a {
        box-sizing: border-box;
        display: flex;
        align-items: center;
        min-height: 58px;
        width: 100%;
        padding: 14px 16px;
        border: 0;
        border-radius: 10px;
        font-size: calc((15px) + 1px);
        line-height: 1.2;
        font-weight: 800;
        text-decoration: none;
        backdrop-filter: blur(1px);
        -webkit-backdrop-filter: blur(1px);
    }

    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+1) > a {
        background: rgba(var(--px-submenu-c1), 0.2);
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+2) > a {
        background: rgba(var(--px-submenu-c2), 0.2);
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+3) > a {
        background: rgba(var(--px-submenu-c3), 0.2);
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+4) > a {
        background: rgba(var(--px-submenu-c4), 0.2);
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+5) > a {
        background: rgba(var(--px-submenu-c5), 0.2);
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+6) > a {
        background: rgba(var(--px-submenu-c6), 0.2);
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+7) > a {
        background: rgba(var(--px-submenu-c7), 0.2);
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+8) > a {
        background: rgba(var(--px-submenu-c8), 0.2);
    }

    body .px-mobile-primary-menu .sub-menu > li > a {
        color: #fff;
}

    .px-mobile-primary-menu .sub-menu > li > a:active {
        transform: scale(0.985);
        filter: brightness(1.1) saturate(1.18);
    }
}

@media (min-width: 720px) and (max-width: 1180px) {
    .px-mobile-primary-menu .menu-item-has-children > .sub-menu {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@keyframes pxMegaSweep {
    0% {
        transform: translateX(-125%) rotate(2deg);
        opacity: 0;
    }
    18% {
        opacity: 0.72;
    }
    100% {
        transform: translateX(125%) rotate(2deg);
        opacity: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .px-desktop-nav .menu-item-has-children > .sub-menu,
    .px-desktop-nav .menu-item-has-children > .sub-menu::before,
    .px-desktop-nav .menu-item-has-children > .sub-menu::after,
    .px-desktop-nav .menu-item-has-children > .sub-menu > li,
    .px-mobile-primary-menu .menu-item-has-children > .sub-menu,
    .px-mobile-primary-menu .menu-item-has-children > .sub-menu::before,
    .px-mobile-primary-menu .menu-item-has-children > .sub-menu::after,
    .px-mobile-primary-menu .menu-item-has-children > .sub-menu > li {
        animation: none;
        transition: none;
        transform: none;
        filter: none;
    }
}

/* =========================================================
   NORTHLINE Builders v1.6.0
   DESKTOP SUBMENU PHOTO LAYER — root fix
   Mobile appearance intentionally preserved.
   ========================================================= */
@media (min-width: 1181px) {
    .px-desktop-nav .menu-item-has-children > .sub-menu {
        background: transparent;
        background-color: transparent;
    }

    .px-desktop-nav .menu-item-has-children > .sub-menu::before {
        z-index: 0;
        background:
            linear-gradient(rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05)),
            var(--signature-submenu-bg) center / cover no-repeat;
    }

    .px-desktop-nav .menu-item-has-children > .sub-menu::after {
        z-index: 1;
    }

    .px-desktop-nav .menu-item-has-children > .sub-menu > li {
        z-index: 2;
    }

    /* Keep the requested colors as a thin tint, not opaque blocks. */
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+1) > a {
        background: rgba(var(--px-submenu-c1), 0.16);
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+2) > a {
        background: rgba(var(--px-submenu-c2), 0.16);
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+3) > a {
        background: rgba(var(--px-submenu-c3), 0.16);
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+4) > a {
        background: rgba(var(--px-submenu-c4), 0.16);
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+5) > a {
        background: rgba(var(--px-submenu-c5), 0.16);
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+6) > a {
        background: rgba(var(--px-submenu-c6), 0.16);
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+7) > a {
        background: rgba(var(--px-submenu-c7), 0.16);
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+8) > a {
        background: rgba(var(--px-submenu-c8), 0.16);
    }
}

/* =========================================================
   NORTHLINE Builders v1.6.1
   DESKTOP PHOTO VISIBILITY — paint image on real panel layer
   Mobile intentionally untouched.
   ========================================================= */
@media (min-width: 1181px) {
    .px-desktop-nav .menu-item-has-children > .sub-menu {
        /* Root fix: the photo now paints on the submenu itself, not behind card stacking contexts. */
        background-image:
            linear-gradient(rgba(0, 0, 0, 0.06), rgba(0, 0, 0, 0.06)), var(--signature-submenu-bg);
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
        background-color: #1b2023;
    }

    /* No second photo layer on desktop; it was the source of the masking issue. */
    .px-desktop-nav .menu-item-has-children > .sub-menu::before {
        content: none;
    }

    /* Sweep stays above the photo but below text/cards. */
    .px-desktop-nav .menu-item-has-children > .sub-menu::after {
        z-index: 1;
    }

    .px-desktop-nav .menu-item-has-children > .sub-menu > li {
        position: relative;
        z-index: 2;
        background: transparent;
    }

    /* Very thin color glass overlays so the landscape remains obvious. */
    .px-desktop-nav .sub-menu > li > a {
        background-color: transparent;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+1) > a {
        background: rgba(var(--px-submenu-c1), 0.11);
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+2) > a {
        background: rgba(var(--px-submenu-c2), 0.11);
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+3) > a {
        background: rgba(var(--px-submenu-c3), 0.11);
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+4) > a {
        background: rgba(var(--px-submenu-c4), 0.11);
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+5) > a {
        background: rgba(var(--px-submenu-c5), 0.11);
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+6) > a {
        background: rgba(var(--px-submenu-c6), 0.11);
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+7) > a {
        background: rgba(var(--px-submenu-c7), 0.11);
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+8) > a {
        background: rgba(var(--px-submenu-c8), 0.11);
    }
}

/* DESKTOP: active submenu card becomes fully colored and pops forward. */
@media (min-width: 1181px) {
    .px-desktop-nav .sub-menu > li > a {
        position: relative;
        overflow: hidden;
        transform: translateZ(0);
        transition:
            background 0.22s ease,
            color 0.2s ease,
            transform 0.32s cubic-bezier(0.16, 0.84, 0.24, 1),
            box-shadow 0.28s ease,
            filter 0.24s ease;
    }

    .px-desktop-nav .sub-menu > li > a::before {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        opacity: 0;
        transform: scale(0.82);
        transition:
            opacity 0.22s ease,
            transform 0.34s cubic-bezier(0.16, 0.84, 0.24, 1);
    }

    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+1) > a::before {
        background: rgb(var(--px-submenu-c1));
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+2) > a::before {
        background: rgb(var(--px-submenu-c2));
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+3) > a::before {
        background: rgb(var(--px-submenu-c3));
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+4) > a::before {
        background: rgb(var(--px-submenu-c4));
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+5) > a::before {
        background: rgb(var(--px-submenu-c5));
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+6) > a::before {
        background: rgb(var(--px-submenu-c6));
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+7) > a::before {
        background: rgb(var(--px-submenu-c7));
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+8) > a::before {
        background: rgb(var(--px-submenu-c8));
    }

    .px-desktop-nav .sub-menu > li > a > * {
        position: relative;
        z-index: 2;
    }

    /* Text node itself is preserved by the link stacking context. */
    .px-desktop-nav .sub-menu > li > a:hover,
    .px-desktop-nav .sub-menu > li > a:focus-visible {
        color: #fff;
transform: translateY(-7px) scale(1.035);
        filter: saturate(1.08);
}

    .px-desktop-nav .sub-menu > li > a:hover::before,
    .px-desktop-nav .sub-menu > li > a:focus-visible::before {
        opacity: 1;
        transform: scale(1);
    }

    /* Yellow needs dark text for contrast. */
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+4) > a:hover,
  .px-desktop-nav .sub-menu > li:nth-child(8n/**/+4) > a:focus-visible {
        color: #111;
}

    /* Quick halo burst */
    .px-desktop-nav .sub-menu > li > a::after {
        content: "";
        position: absolute;
        left: 50%;
        top: 50%;
        width: 22px;
        height: 22px;
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.34);
        opacity: 0;
        transform: translate(-50%, -50%) scale(0.2);
        pointer-events: none;
    }
    .px-desktop-nav .sub-menu > li > a:hover::after,
    .px-desktop-nav .sub-menu > li > a:focus-visible::after {
        animation: pxSubmenuBurst 0.48s ease-out both;
    }
}

/* MOBILE: tapping/opening a specific submenu item gives the same full-color focus feel. */
@media (max-width: 1180px) {
    .px-mobile-primary-menu .sub-menu > li > a {
        position: relative;
        overflow: hidden;
        transition:
            background 0.2s ease,
            color 0.2s ease,
            transform 0.24s cubic-bezier(0.16, 0.84, 0.24, 1),
            box-shadow 0.24s ease;
    }

    .px-mobile-primary-menu .sub-menu > li > a:active,
    .px-mobile-primary-menu .sub-menu > li > a:focus-visible {
        transform: scale(0.975);
}

    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+1) > a:active,
  .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+1) > a:focus-visible {
        background: rgb(var(--px-submenu-c1));
        color: #fff;
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+2) > a:active,
  .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+2) > a:focus-visible {
        background: rgb(var(--px-submenu-c2));
        color: #fff;
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+3) > a:active,
  .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+3) > a:focus-visible {
        background: rgb(var(--px-submenu-c3));
        color: #fff;
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+4) > a:active,
  .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+4) > a:focus-visible {
        background: rgb(var(--px-submenu-c4));
        color: #111;
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+5) > a:active,
  .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+5) > a:focus-visible {
        background: rgb(var(--px-submenu-c5));
        color: #fff;
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+6) > a:active,
  .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+6) > a:focus-visible {
        background: rgb(var(--px-submenu-c6));
        color: #fff;
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+7) > a:active,
  .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+7) > a:focus-visible {
        background: rgb(var(--px-submenu-c7));
        color: #fff;
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+8) > a:active,
  .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+8) > a:focus-visible {
        background: rgb(var(--px-submenu-c8));
        color: #fff;
    }
}

@keyframes pxSubmenuBurst {
    0% {
        opacity: 0.58;
        transform: translate(-50%, -50%) scale(0.2);
    }
    100% {
        opacity: 0;
        transform: translate(-50%, -50%) scale(10);
    }
}

@media (prefers-reduced-motion: reduce) {
    .px-desktop-nav .sub-menu > li > a,
    .px-desktop-nav .sub-menu > li > a::before,
    .px-desktop-nav .sub-menu > li > a::after,
    .px-mobile-primary-menu .sub-menu > li > a {
        animation: none;
        transition: none;
        transform: none;
    }
}

/* WordPress admin bar integration.
   The theme header is in normal document flow, so WordPress' own admin-bar document offset
   is authoritative. A second theme-level top offset would create a duplicate gap. */
body.admin-bar .px-site-header,
body.admin-bar .px-site-header.is-scrolled,
body.admin-bar.is-scrolled .px-site-header,
body.admin-bar.px-header-static .px-site-header,
body.admin-bar.px-header-static .px-site-header.is-scrolled,
body.admin-bar.px-header-dynamic .px-site-header,
body.admin-bar.px-header-dynamic .px-site-header.is-scrolled,
body.admin-bar.px-header-dynamic.is-scrolled .px-site-header {
    top: 0;
}

/* =========================================================
   NORTHLINE Builders v1.7.0
   Canonical Dark desktop submenu
   - text always visible
   - clean photo at rest
   - no permanent overlay
   - exact hovered card becomes solid color
   ========================================================= */
@media (min-width: 1181px) {
    body .px-desktop-nav .menu-item-has-children > .sub-menu {
        background-image: var(--signature-submenu-bg);
        background-position: center center;
        background-size: cover;
        background-repeat: no-repeat;
        background-color: #0b1118;
    }

    body .px-desktop-nav .sub-menu > li {
        opacity: 1;
    }

    body .px-desktop-nav .sub-menu > li > a {
        position: relative;
        z-index: 2;
        opacity: 1;
        visibility: visible;
        color: #fff;
        background: transparent;
        background-color: transparent;
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
}

    body .px-desktop-nav .sub-menu > li > a::before {
        content: none;
    }

    body .px-desktop-nav .sub-menu > li:nth-child(8n/**/+1) > a:hover,
  body .px-desktop-nav .sub-menu > li:nth-child(8n/**/+1) > a:focus-visible {
        background: rgb(var(--px-submenu-c1));
    }
    body .px-desktop-nav .sub-menu > li:nth-child(8n/**/+2) > a:hover,
  body .px-desktop-nav .sub-menu > li:nth-child(8n/**/+2) > a:focus-visible {
        background: rgb(var(--px-submenu-c2));
    }
    body .px-desktop-nav .sub-menu > li:nth-child(8n/**/+3) > a:hover,
  body .px-desktop-nav .sub-menu > li:nth-child(8n/**/+3) > a:focus-visible {
        background: rgb(var(--px-submenu-c3));
    }
    body .px-desktop-nav .sub-menu > li:nth-child(8n/**/+4) > a:hover,
  body .px-desktop-nav .sub-menu > li:nth-child(8n/**/+4) > a:focus-visible {
        background: rgb(var(--px-submenu-c4));
        color: #111;
}
    body .px-desktop-nav .sub-menu > li:nth-child(8n/**/+5) > a:hover,
  body .px-desktop-nav .sub-menu > li:nth-child(8n/**/+5) > a:focus-visible {
        background: rgb(var(--px-submenu-c5));
    }
    body .px-desktop-nav .sub-menu > li:nth-child(8n/**/+6) > a:hover,
  body .px-desktop-nav .sub-menu > li:nth-child(8n/**/+6) > a:focus-visible {
        background: rgb(var(--px-submenu-c6));
    }
    body .px-desktop-nav .sub-menu > li:nth-child(8n/**/+7) > a:hover,
  body .px-desktop-nav .sub-menu > li:nth-child(8n/**/+7) > a:focus-visible {
        background: rgb(var(--px-submenu-c7));
    }
    body .px-desktop-nav .sub-menu > li:nth-child(8n/**/+8) > a:hover,
  body .px-desktop-nav .sub-menu > li:nth-child(8n/**/+8) > a:focus-visible {
        background: rgb(var(--px-submenu-c8));
    }

    /* Keep motion, but never hide the label. */
    body .px-desktop-nav .sub-menu > li > a:hover,
    body .px-desktop-nav .sub-menu > li > a:focus-visible {
        opacity: 1;
        visibility: visible;
        transform: translateY(-7px) scale(1.035);
        filter: saturate(1.08);
}
}

/* =========================================================
   NORTHLINE Builders v1.7.3
   Canonical mobile submenu motion
   ========================================================= */
@media (max-width: 1180px) {
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+1) {
        --px-mobile-card: var(--px-submenu-c1);
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+2) {
        --px-mobile-card: var(--px-submenu-c2);
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+3) {
        --px-mobile-card: var(--px-submenu-c3);
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+4) {
        --px-mobile-card: var(--px-submenu-c4);
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+5) {
        --px-mobile-card: var(--px-submenu-c5);
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+6) {
        --px-mobile-card: var(--px-submenu-c6);
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+7) {
        --px-mobile-card: var(--px-submenu-c7);
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+8) {
        --px-mobile-card: var(--px-submenu-c8);
    }

    .px-mobile-primary-menu > .menu-item-has-children > a::after {
        transform-origin: 50% 50%;
        transition:
            transform 0.38s cubic-bezier(0.16, 1, 0.3, 1),
            filter 0.22s ease;
    }

    .px-mobile-primary-menu > .menu-item-has-children.submenu-open > a::after {
        transform: rotate(225deg) translate(-1px, -1px) scale(1.12);
}

    .px-mobile-primary-menu .menu-item-has-children > .sub-menu {
        transform-origin: 50% 0;
        transform: translateY(-12px) scale(0.965);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        max-height: 0;
        overflow: hidden;
        clip-path: inset(0 0 100% 0 round 14px);
        transition:
            max-height 0.64s cubic-bezier(0.16, 0.84, 0.24, 1),
            opacity 0.24s ease,
            transform 0.48s cubic-bezier(0.16, 0.84, 0.24, 1),
            clip-path 0.52s cubic-bezier(0.16, 0.84, 0.24, 1),
            visibility 0s linear 0.64s,
            margin 0.32s ease,
            padding 0.32s ease,
            border-width 0.32s ease;
    }

    .px-mobile-primary-menu li.submenu-open > .sub-menu {
        max-height: 1700px;
        margin: 10px 0 4px;
        padding: 10px;
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        border-width: 1px;
        clip-path: inset(0 0 0 0 round 14px);
        transform: translateY(0) scale(1);
        transition-delay: 0s;
    }

    .px-mobile-primary-menu .menu-item-has-children > .sub-menu::before {
        transform: scale(1.12);
        filter: saturate(0.92) contrast(0.98);
        transition:
            transform 0.82s cubic-bezier(0.16, 0.84, 0.24, 1),
            filter 0.52s ease;
    }

    .px-mobile-primary-menu li.submenu-open > .sub-menu::before {
        transform: scale(1.02);
        filter: saturate(1.06) contrast(1.02);
    }

    .px-mobile-primary-menu li.submenu-open > .sub-menu::after {
        animation: pxMobileSweep173 0.82s cubic-bezier(0.16, 0.84, 0.24, 1) 0.04s both;
    }

    .px-mobile-primary-menu .sub-menu > li {
        opacity: 0;
        transform: translate3d(0, 18px, 0) scale(0.9);
        filter: blur(5px);
        transform-origin: 50% 0;
    }

    .px-mobile-primary-menu li.submenu-open > .sub-menu > li {
        animation: pxMobileCard173 0.56s cubic-bezier(0.16, 0.84, 0.24, 1) both;
    }

    .px-mobile-primary-menu li.submenu-open > .sub-menu > li:nth-child(1) {
        animation-delay: 0.05s;
    }
    .px-mobile-primary-menu li.submenu-open > .sub-menu > li:nth-child(2) {
        animation-delay: 0.11s;
    }
    .px-mobile-primary-menu li.submenu-open > .sub-menu > li:nth-child(3) {
        animation-delay: 0.17s;
    }
    .px-mobile-primary-menu li.submenu-open > .sub-menu > li:nth-child(4) {
        animation-delay: 0.23s;
    }
    .px-mobile-primary-menu li.submenu-open > .sub-menu > li:nth-child(5) {
        animation-delay: 0.29s;
    }
    .px-mobile-primary-menu li.submenu-open > .sub-menu > li:nth-child(6) {
        animation-delay: 0.35s;
    }
    .px-mobile-primary-menu li.submenu-open > .sub-menu > li:nth-child(7) {
        animation-delay: 0.41s;
    }
    .px-mobile-primary-menu li.submenu-open > .sub-menu > li:nth-child(8) {
        animation-delay: 0.47s;
    }

    .px-mobile-primary-menu .sub-menu > li > a {
        position: relative;
        overflow: hidden;
        z-index: 1;
        background: rgba(var(--px-mobile-card), 0.18);
        transition:
            transform 0.24s cubic-bezier(0.16, 0.84, 0.24, 1),
            background 0.22s ease,
            color 0.2s ease,
            box-shadow 0.24s ease,
            filter 0.22s ease;
    }

    .px-mobile-primary-menu .sub-menu > li > a::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: -1;
        background: rgb(var(--px-mobile-card));
        opacity: 0;
        transform: scale(0.8);
        pointer-events: none;
        transition:
            opacity 0.2s ease,
            transform 0.28s cubic-bezier(0.16, 0.84, 0.24, 1);
    }

    .px-mobile-primary-menu li.submenu-open > .sub-menu > li > a::before {
        animation: pxMobileColor173 0.58s cubic-bezier(0.16, 0.84, 0.24, 1) both;
    }

    .px-mobile-primary-menu li.submenu-open > .sub-menu > li:nth-child(1) > a::before {
        animation-delay: 0.08s;
    }
    .px-mobile-primary-menu li.submenu-open > .sub-menu > li:nth-child(2) > a::before {
        animation-delay: 0.14s;
    }
    .px-mobile-primary-menu li.submenu-open > .sub-menu > li:nth-child(3) > a::before {
        animation-delay: 0.2s;
    }
    .px-mobile-primary-menu li.submenu-open > .sub-menu > li:nth-child(4) > a::before {
        animation-delay: 0.26s;
    }
    .px-mobile-primary-menu li.submenu-open > .sub-menu > li:nth-child(5) > a::before {
        animation-delay: 0.32s;
    }
    .px-mobile-primary-menu li.submenu-open > .sub-menu > li:nth-child(6) > a::before {
        animation-delay: 0.38s;
    }
    .px-mobile-primary-menu li.submenu-open > .sub-menu > li:nth-child(7) > a::before {
        animation-delay: 0.44s;
    }
    .px-mobile-primary-menu li.submenu-open > .sub-menu > li:nth-child(8) > a::before {
        animation-delay: 0.5s;
    }

    .px-mobile-primary-menu .sub-menu > li > a:active,
    .px-mobile-primary-menu .sub-menu > li > a:focus-visible {
        transform: translateY(-4px) scale(1.02);
filter: saturate(1.08);
    }

    .px-mobile-primary-menu .sub-menu > li > a:active::before,
    .px-mobile-primary-menu .sub-menu > li > a:focus-visible::before {
        opacity: 1;
        transform: scale(1);
    }

    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+4) > a:active,
  .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+4) > a:focus-visible {
        color: #111;
}
}

@keyframes pxMobileCard173 {
    0% {
        opacity: 0;
        transform: translate3d(0, 18px, 0) scale(0.9);
        filter: blur(5px);
    }
    58% {
        opacity: 1;
        transform: translate3d(0, -5px, 0) scale(1.025);
        filter: blur(0);
    }
    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1);
        filter: blur(0);
    }
}

@keyframes pxMobileColor173 {
    0% {
        opacity: 0;
        transform: scale(0.8);
    }
    46% {
        opacity: 1;
        transform: scale(1);
    }
    100% {
        opacity: 0;
        transform: scale(1);
    }
}

@keyframes pxMobileSweep173 {
    0% {
        opacity: 0;
        transform: translateX(-120%) rotate(2deg);
    }
    25% {
        opacity: 0.55;
    }
    100% {
        opacity: 0;
        transform: translateX(120%) rotate(2deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .px-mobile-primary-menu > .menu-item-has-children > a::after,
    .px-mobile-primary-menu .menu-item-has-children > .sub-menu,
    .px-mobile-primary-menu .menu-item-has-children > .sub-menu::before,
    .px-mobile-primary-menu .menu-item-has-children > .sub-menu::after,
    .px-mobile-primary-menu .sub-menu > li,
    .px-mobile-primary-menu .sub-menu > li > a,
    .px-mobile-primary-menu .sub-menu > li > a::before {
        animation: none;
        transition: none;
        transform: none;
        filter: none;
    }
}

/* =========================================================
   NORTHLINE Builders v1.7.4
   Mobile submenu item interaction motion
   - pointer hover (tablet/mouse)
   - keyboard focus
   - touch/pointer press via .is-touch-active
   ========================================================= */
@media (max-width: 1180px) {
    .px-mobile-primary-menu .sub-menu > li > a {
        will-change: transform, filter, box-shadow;
    }

    /* Mouse / trackpad hover on tablet-width layouts. */
    @media (hover: hover) and (pointer: fine) {
        .px-mobile-primary-menu .sub-menu > li > a:hover {
            transform: translateY(-6px) scale(1.025);
            filter: saturate(1.1) brightness(1.04);
}

        .px-mobile-primary-menu .sub-menu > li > a:hover::before {
            opacity: 1;
            transform: scale(1);
        }

        .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+4) > a:hover {
            color: #111;
}
    }

    /* Touch / pen / coarse-pointer feedback.
     JS adds .is-touch-active briefly to the exact item being touched. */
    .px-mobile-primary-menu .sub-menu > li > a.is-touch-active,
    .px-mobile-primary-menu .sub-menu > li > a:focus-visible {
        transform: translateY(-6px) scale(1.025);
        filter: saturate(1.12) brightness(1.05);
}

    .px-mobile-primary-menu .sub-menu > li > a.is-touch-active::before,
    .px-mobile-primary-menu .sub-menu > li > a:focus-visible::before {
        opacity: 1;
        transform: scale(1);
    }

    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+4) > a.is-touch-active,
  .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+4) > a:focus-visible {
        color: #111;
}

    /* Subtle secondary pulse so the interaction feels alive, not static. */
    .px-mobile-primary-menu .sub-menu > li > a.is-touch-active {
        animation: pxMobileItemTouch174 0.34s cubic-bezier(0.16, 0.84, 0.24, 1) both;
    }
}

@keyframes pxMobileItemTouch174 {
    0% {
        transform: translateY(0) scale(1);
    }
    55% {
        transform: translateY(-7px) scale(1.032);
    }
    100% {
        transform: translateY(-6px) scale(1.025);
    }
}

@media (prefers-reduced-motion: reduce) {
    .px-mobile-primary-menu .sub-menu > li > a.is-touch-active {
        animation: none;
    }
}

/* =========================================================
   NORTHLINE Builders v1.7.6
   Hero tagline integrated into video
   ========================================================= */
.px-signature-hero-video-wrap {
    position: relative;
    overflow: hidden;
}

.px-signature-hero-copy.px-signature-hero-copy-overlay {
    position: absolute;
    z-index: 3;
    right: 36px;
    bottom: 34px;
    width: min(88%, 760px);
    margin: 0;
    padding: 0;
    text-align: right;
    pointer-events: none;
}

.px-signature-hero-copy.px-signature-hero-copy-overlay h1 {
    margin: 0;
    color: #fff;
}

.px-signature-hero-copy.px-signature-hero-copy-overlay p {
    margin-top: 6px;
    color: rgba(255, 255, 255, 0.88);
}

.px-signature-hero-copy.px-signature-hero-copy-overlay .px-signature-hero-accent {
    margin-left: auto;
    margin-right: 0;
}

@media (max-width: 767px) {
    .px-signature-hero-copy.px-signature-hero-copy-overlay {
        right: 18px;
        bottom: 18px;
        width: calc(100% - 36px);
    }

    .px-signature-hero-copy.px-signature-hero-copy-overlay h1 {
        font-size: calc((clamp(18px, 5.2vw, 26px)) + 1px);
        line-height: 1.05;
    }

    .px-signature-hero-copy.px-signature-hero-copy-overlay p {
        font-size: calc((clamp(12px, 3.4vw, 16px)) + 1px);
        line-height: 1.25;
    }
}

/* =========================================================
   NORTHLINE Builders v1.7.7
   Hero video overlay typography — slightly larger
   ========================================================= */
.px-signature-hero-copy.px-signature-hero-copy-overlay h1 {
    font-size: calc((clamp(32px, 2.85vw, 49px)) + 1px);
    line-height: 1.02;
}

.px-signature-hero-copy.px-signature-hero-copy-overlay p {
    font-size: calc((clamp(16px, 1.28vw, 21px)) + 1px);
    line-height: 1.28;
}

@media (max-width: 767px) {
    .px-signature-hero-copy.px-signature-hero-copy-overlay h1 {
        font-size: calc((clamp(19px, 5.4vw, 28px)) + 1px);
    }

    .px-signature-hero-copy.px-signature-hero-copy-overlay p {
        font-size: calc((clamp(13px, 3.55vw, 17px)) + 1px);
    }
}

/* =========================================================
   NORTHLINE Builders v1.7.9
   Mobile hero headline — compact single-line treatment
   ========================================================= */
@media (max-width: 767px) {
    .px-signature-hero-copy.px-signature-hero-copy-overlay {
        right: 12px;
        width: calc(100% - 24px);
    }

    .px-signature-hero-copy.px-signature-hero-copy-overlay h1 {
        font-size: calc((clamp(13px, 3.65vw, 18px)) + 1px);
        line-height: 1.08;
        white-space: nowrap;
        letter-spacing: -0.025em;
    }
}

/* =========================================================
   NORTHLINE Builders v1.8.3
   Header edge correction
   Hero geometry from v1.8.2 intentionally preserved.
   ========================================================= */
@media (min-width: 1181px) {
    :root {
        --signature-header-gutter: 20px;
    }
}

@media (min-width: 1181px) {
    .px-header-boundary > .px-desktop-header-controls,
    .px-header-boundary .px-desktop-header-controls > .px-header-utility {
        margin-right: 0;
        padding-right: 0;
    }
}

@media (max-width: 1180px) {
    .px-header-boundary > .px-mobile-header-actions,
    .px-header-boundary .px-mobile-menu-toggle {
        margin-right: 0;
        padding-right: 0;
    }
}

/* =========================================================
   NORTHLINE Builders v1.8.8
   Header right-side micro adjustment only
   ========================================================= */

/* v1.9.1 — Footer readability: align supporting footer copy with homepage body text. */
.tm-footer-wrapper .tm-tagline,
.tm-footer-wrapper .tm-brand-desc,
.tm-footer-wrapper .tm-number-badge,
.tm-footer-wrapper .tm-family-site,
.tm-footer-wrapper .tm-social-text,
.tm-footer-wrapper .tm-nav-links a,
.tm-footer-wrapper .tm-back-to-top,
.tm-footer-wrapper .tm-footer-sub-bottom,
.tm-footer-wrapper .tm-sub-slogan {
    font-size: calc((16px) + 1px);
}

@media (max-width: 900px) {
    .tm-footer-wrapper .tm-tagline,
    .tm-footer-wrapper .tm-brand-desc,
    .tm-footer-wrapper .tm-number-badge,
    .tm-footer-wrapper .tm-family-site,
    .tm-footer-wrapper .tm-social-text,
    .tm-footer-wrapper .tm-nav-links a,
    .tm-footer-wrapper .tm-back-to-top,
    .tm-footer-wrapper .tm-footer-sub-bottom,
    .tm-footer-wrapper .tm-sub-slogan {
        font-size: calc((16px) + 1px);
    }
}

/* =========================================================
   NORTHLINE Builders v1.9.2 — content readability system
   Layout geometry is intentionally unchanged.
   Section 07 body copy is the reference size for homepage copy.
   ========================================================= */
:root {
    --northline-body-copy-size: 16px;
    --northline-body-copy-line: 1.7;
}

/* Improve white hero copy over bright video without changing the hero layout. */
.px-signature-hero-video-wrap::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.06) 20%,
        rgba(0, 0, 0, 0.18) 58%,
        rgba(0, 0, 0, 0.48) 100%
    );
}
.px-signature-hero-copy.px-signature-hero-copy-overlay h1 {
}
.px-signature-hero-copy.px-signature-hero-copy-overlay p {
    color: #fff;
}

/* Shared homepage body-copy scale. Headline hierarchy remains untouched. */
.px-exclusive-v4-copy p,
.px-designs-v4-head p,
.px-process-v4-head p,
.px-process-v4-copy > p,
.px-why-v5-copy p,
.px-products-v4-head p,
.px-products-v4-copy p,
.px-strategy-v4-copy p,
.px-final-v5-side p {
    font-size: var(--northline-body-copy-size);
    line-height: var(--northline-body-copy-line);
}

/* The active footer is px-footer-v9. Match its readable copy to section body text. */
.px-footer-v9-brand p,
.px-footer-v9-socials a,
.px-footer-v9-toplink,
.px-footer-v9-bottom,
.px-footer-v9-bottom span,
.px-footer-v9-copyright,
.px-footer-v9-copyright a {
    font-size: var(--northline-body-copy-size);
    line-height: 1.55;
}

@media (max-width: 767px) {
    :root {
        --northline-body-copy-size: 15px;
    }
    .px-signature-hero-video-wrap::after {
        background: linear-gradient(
            180deg,
            rgba(0, 0, 0, 0.04) 12%,
            rgba(0, 0, 0, 0.18) 52%,
            rgba(0, 0, 0, 0.54) 100%
        );
    }
}

/* Footer: three balanced zones — business, enquiry, utility. */
.px-footer-v9-top {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 1.15fr) minmax(180px, 0.65fr);
    align-items: start;
    gap: clamp(32px, 5vw, 80px);
}
.px-footer-v9-brand p,
.px-footer-v9-enquiry p,
.px-footer-v9-phone a,
.px-footer-v9-form input,
.px-footer-v9-form select,
.px-footer-v9-form textarea,
.px-footer-v9-form button,
.px-footer-v9-socials a,
.px-footer-v9-toplink,
.px-footer-v9-bottom {
    font-size: calc((16px) + 1px);
    line-height: 1.6;
}
.px-footer-v9-brand p {
    max-width: 430px;
    color: #9b9b9b;
}
.px-footer-v9-phone {
    margin-top: 28px;
    display: grid;
    gap: 5px;
}
.px-footer-v9-phone span,
.px-footer-v9-enquiry > strong,
.px-footer-v9-form label > span {
    font-size: calc((12px) + 1px);
    line-height: 1.3;
    font-weight: 800;
    letter-spacing: 0.1em;
}
.px-footer-v9-phone span,
.px-footer-v9-form label > span {
    color: #777;
}
.px-footer-v9-phone a {
    font-weight: 700;
    color: #fff;
}
.px-footer-v9-enquiry > strong {
    display: block;
    color: #fff;
}
.px-footer-v9-enquiry > p {
    margin: 10px 0 22px;
    max-width: 560px;
    color: #9b9b9b;
}
.px-footer-v9-form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px 18px;
}
.px-footer-v9-form label {
    display: grid;
    gap: 7px;
    min-width: 0;
}
.px-footer-v9-form-message {
    grid-column: 1/-1;
}
.px-footer-v9-form input,
.px-footer-v9-form select,
.px-footer-v9-form textarea {
    width: 100%;
    min-width: 0;
    padding: 11px 0;
    border: 0;
    border-bottom: 1px solid #343434;
    border-radius: 0;
    background: transparent;
    color: #fff;
    font: inherit;
    outline: none;
}
.px-footer-v9-form select {
    appearance: auto;
}
.px-footer-v9-form option {
    color: #111;
}
.px-footer-v9-form textarea {
    resize: vertical;
}
.px-footer-v9-form input:focus,
.px-footer-v9-form select:focus,
.px-footer-v9-form textarea:focus {
    border-bottom-color: #fff;
}
.px-footer-v9-form button {
    grid-column: 1/-1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 4px;
    padding: 14px 0;
    border: 0;
    border-top: 1px solid #555;
    border-bottom: 1px solid #555;
    background: transparent;
    color: #fff;
    font-weight: 800;
    cursor: pointer;
}
.px-footer-v9-form button:hover,
.px-footer-v9-form button:focus-visible {
    border-color: #fff;
}
.px-footer-v9-notice {
    padding: 8px 0;
    color: #fff;
}
.px-footer-v9-aside {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
}
.px-footer-v9-socials {
    display: grid;
    padding: 0;
    border: 0;
    gap: 9px;
}
.px-footer-v9-bottom {
    border-top: 1px solid #242424;
    padding-top: 20px;
}

@media (max-width: 900px) {
    .px-footer-v9-top {
        grid-template-columns: 1fr 1fr;
    }
    .px-footer-v9-aside {
        grid-column: 1/-1;
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
        border-top: 1px solid #242424;
        padding-top: 20px;
    }
    .px-footer-v9-socials {
        display: flex;
        flex-wrap: wrap;
    }
}
@media (max-width: 620px) {
    .px-footer-v9-top {
        display: grid;
        grid-template-columns: 1fr;
        gap: 36px;
    }
    .px-footer-v9-aside {
        grid-column: auto;
        display: flex;
        flex-direction: column;
    }
    .px-footer-v9-form {
        grid-template-columns: 1fr;
    }
    .px-footer-v9-form-message,
    .px-footer-v9-form button {
        grid-column: auto;
    }
    .px-footer-v9-brand p,
    .px-footer-v9-enquiry p,
    .px-footer-v9-phone a,
    .px-footer-v9-form input,
    .px-footer-v9-form select,
    .px-footer-v9-form textarea,
    .px-footer-v9-form button,
    .px-footer-v9-socials a,
    .px-footer-v9-toplink,
    .px-footer-v9-bottom {
        font-size: calc((15px) + 1px);
    }
}
.px-announcement-phone {
    color: inherit;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
}

.px-footer-v9-top {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(220px, 0.8fr) minmax(150px, 0.45fr);
    align-items: start;
    gap: clamp(28px, 4vw, 64px);
    padding-bottom: 28px;
}
.px-footer-v9-brand p {
    max-width: 520px;
    margin: 12px 0 0;
    color: #8b8b8b;
}
.px-footer-v9-phone {
    margin-top: 20px;
    display: grid;
    gap: 7px;
}
.px-footer-v9-phone a {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    width: max-content;
    color: #fff;
    font-weight: 700;
}
.px-footer-v9-phone a svg,
.px-footer-v9-location svg {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.px-footer-v9-location {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-top: 12px;
    color: #8b8b8b;
    font-size: calc((16px) + 1px);
    line-height: 1.55;
}

.px-footer-v9-enquiry {
    border: 0;
    margin: 0;
    padding: 0;
}
.px-footer-v9-enquiry summary {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 0 0 12px;
    border-bottom: 1px solid #343434;
    color: #fff;
    font-size: calc((16px) + 1px);
    line-height: 1.4;
    font-weight: 800;
    cursor: pointer;
}
.px-footer-v9-enquiry summary::-webkit-details-marker {
    display: none;
}
.px-footer-v9-enquiry summary span {
    font-size: calc((22px) + 1px);
    font-weight: 400;
    transition: transform 0.2s ease;
}
.px-footer-v9-enquiry[open] summary span {
    transform: rotate(45deg);
}
.px-footer-v9-enquiry > p {
    margin: 14px 0 16px;
    max-width: 420px;
    color: #8b8b8b;
    font-size: calc((16px) + 1px);
    line-height: 1.55;
}
.px-footer-v9-form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 16px;
    padding-top: 2px;
}
.px-footer-v9-form label {
    display: grid;
    gap: 5px;
}
.px-footer-v9-form label > span {
    font-size: calc((11px) + 1px);
}
.px-footer-v9-form input,
.px-footer-v9-form select,
.px-footer-v9-form textarea {
    padding: 8px 0;
    font-size: calc((15px) + 1px);
    line-height: 1.45;
}
.px-footer-v9-form textarea {
    min-height: 60px;
}
.px-footer-v9-form button {
    padding: 11px 0;
    font-size: calc((14px) + 1px);
    line-height: 1.4;
}
.px-footer-v9-aside {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 18px;
}
.px-footer-v9-socials {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 7px;
    padding: 0;
    border: 0;
}
.px-footer-v9-bottom {
    margin-top: 0;
}

@media (max-width: 900px) {
    .px-footer-v9-top {
        grid-template-columns: 1fr 1fr;
    }
    .px-footer-v9-aside {
        grid-column: 1/-1;
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
        border-top: 1px solid #242424;
        padding-top: 18px;
    }
    .px-footer-v9-socials {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
    }
}
@media (max-width: 620px) {
    .px-footer-v9-top {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    .px-footer-v9-aside {
        grid-column: auto;
        flex-direction: column;
        align-items: flex-start;
    }
    .px-footer-v9-socials {
        align-items: flex-start;
    }
    .px-footer-v9-form {
        grid-template-columns: 1fr;
    }
    .px-footer-v9-form-message,
    .px-footer-v9-form button {
        grid-column: auto;
    }
    .px-footer-v9-location {
        font-size: calc((15px) + 1px);
    }
}

/* =========================================================
   NORTHLINE Builders v1.9.9 — footer final layout
   Desktop structure:
   1. Brand/contact + Project Enquiry
   2. Horizontal social strip
   3. Copyright | Back to top | note
   ========================================================= */
@media (min-width: 901px) {
    .px-footer-v9-top {
        display: grid;
        grid-template-columns: minmax(320px, 0.82fr) minmax(0, 1.68fr);
        align-items: start;
        gap: clamp(28px, 3vw, 56px);
        padding-bottom: 28px;
    }

    .px-footer-v9-enquiry {
        width: 100%;
        min-width: 0;
    }

    .px-footer-v9-form {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 10px 18px;
    }

    .px-footer-v9-form-message {
        grid-column: 1 / 3;
    }

    .px-footer-v9-form button {
        grid-column: 3 / 4;
        align-self: end;
        margin-top: 0;
    }

    .px-footer-v9-form textarea {
        min-height: 48px;
        max-height: 72px;
    }

    .px-footer-v9-socials {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: flex-start;
        gap: clamp(24px, 3vw, 52px);
        width: 100%;
        margin: 0;
        padding: 18px 0;
        border-top: 1px solid #242424;
        border-bottom: 1px solid #242424;
    }

    .px-footer-v9-socials a {
        display: inline-flex;
        flex: 0 0 auto;
        width: auto;
        margin: 0;
        white-space: nowrap;
    }

    .px-footer-v9-bottom {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
        align-items: center;
        gap: 24px;
        width: 100%;
        padding-top: 18px;
        border-top: 0;
    }

    .px-footer-v9-copyright {
        justify-self: start;
    }
    .px-footer-v9-toplink {
        justify-self: center;
        white-space: nowrap;
    }
    .px-footer-v9-bottom-note {
        justify-self: end;
        text-align: right;
        white-space: nowrap;
    }
}

@media (min-width: 1181px) {
    .px-desktop-searchbar-submit {
        font-size: calc((18px) + 1px);
    }
}
@media (min-width: 1181px) and (max-width: 1500px) {
    .px-desktop-searchbar-submit {
        font-size: calc((16px) + 1px);
    }
}
@media (min-width: 1181px) and (max-width: 1280px) {
    .px-desktop-searchbar-submit {
        font-size: calc((14px) + 1px);
    }
}

@media (max-width: 900px) {
    .px-footer-v9-top {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 30px;
    }

    .px-footer-v9-socials {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        justify-content: flex-start;
        gap: 14px 28px;
        width: 100%;
        padding: 18px 0;
        border-top: 1px solid #242424;
        border-bottom: 1px solid #242424;
    }
}

@media (max-width: 620px) {
    .px-footer-v9-top {
        grid-template-columns: 1fr;
    }
    .px-footer-v9-form {
        grid-template-columns: 1fr;
    }
    .px-footer-v9-form-message,
    .px-footer-v9-form button {
        grid-column: auto;
    }
    .px-footer-v9-bottom {
        grid-template-columns: 1fr;
        gap: 10px;
    }
    .px-footer-v9-toplink,
    .px-footer-v9-bottom-note {
        justify-self: start;
        text-align: left;
    }
}

/* =========================================================
   NORTHLINE Builders v1.9.10 — footer finishing pass
   Keeps the established footer design; fixes form geometry and utility row.
   ========================================================= */
@media (min-width: 901px) {
    .px-footer-v9-form {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(180px, 0.78fr);
        grid-template-areas:
            "name email project"
            "message message submit";
        column-gap: 24px;
        row-gap: 16px;
        align-items: end;
    }
    .px-footer-v9-form > label:nth-of-type(1) {
        grid-area: name;
    }
    .px-footer-v9-form > label:nth-of-type(2) {
        grid-area: email;
    }
    .px-footer-v9-form > label:nth-of-type(3) {
        grid-area: project;
    }
    .px-footer-v9-form > .px-footer-v9-form-message {
        grid-area: message;
    }
    .px-footer-v9-form > button {
        grid-area: submit;
    }

    .px-footer-v9-form label {
        min-width: 0;
        margin: 0;
    }
    .px-footer-v9-form label > span {
        display: block;
        margin: 0 0 5px;
        white-space: nowrap;
    }
    .px-footer-v9-form input,
    .px-footer-v9-form select,
    .px-footer-v9-form textarea {
        display: block;
        box-sizing: border-box;
        width: 100%;
        margin: 0;
    }
    .px-footer-v9-form textarea {
        height: 52px;
        min-height: 52px;
        max-height: 52px;
        resize: none;
    }
    .px-footer-v9-form button {
        box-sizing: border-box;
        width: 100%;
        min-height: 52px;
        margin: 0;
        padding: 0 2px;
    }

    .px-footer-v9-bottom {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        width: 100%;
        align-items: center;
        gap: 16px;
        padding-top: 16px;
        font-size: calc((13px) + 1px);
        line-height: 1.4;
    }
    .px-footer-v9-bottom .px-footer-v9-copyright {
        justify-self: start;
        text-align: left;
        font-size: calc((13px) + 1px);
    }
    .px-footer-v9-bottom .px-footer-v9-toplink {
        justify-self: center;
        text-align: center;
        font-size: calc((13px) + 1px);
    }
    .px-footer-v9-bottom .px-footer-v9-bottom-note {
        justify-self: end;
        text-align: right;
        font-size: calc((13px) + 1px);
    }
}

@media (max-width: 900px) and (min-width: 621px) {
    .px-footer-v9-form {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 14px 20px;
    }
    .px-footer-v9-form-message {
        grid-column: 1/-1;
    }
    .px-footer-v9-form button {
        grid-column: 1/-1;
    }
    .px-footer-v9-bottom,
    .px-footer-v9-bottom .px-footer-v9-copyright,
    .px-footer-v9-bottom .px-footer-v9-toplink,
    .px-footer-v9-bottom .px-footer-v9-bottom-note {
        font-size: calc((13px) + 1px);
    }
}

@media (max-width: 620px) {
    .px-footer-v9-bottom,
    .px-footer-v9-bottom .px-footer-v9-copyright,
    .px-footer-v9-bottom .px-footer-v9-toplink,
    .px-footer-v9-bottom .px-footer-v9-bottom-note {
        font-size: calc((12px) + 1px);
    }
}

/* =========================================================
   NORTHLINE Builders v1.9.11 — footer utility row alignment
   Desktop only: preserve existing vertical spacing while locking
   copyright left, Back to Top to the true centre, and service note right.
   ========================================================= */
@media (min-width: 901px) {
    .px-footer-v9-bottom {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
        align-items: center;
        width: 100%;
        gap: 16px;
        /* Keep the established vertical spacing unchanged. */
        font-size: calc((11px) + 1px);
        line-height: 1.4;
    }
    .px-footer-v9-bottom .px-footer-v9-copyright {
        min-width: 0;
        justify-self: start;
        text-align: left;
        font-size: calc((11px) + 1px);
        white-space: nowrap;
    }
    .px-footer-v9-bottom .px-footer-v9-toplink {
        min-width: 0;
        justify-self: center;
        text-align: center;
        font-size: calc((11px) + 1px);
        white-space: nowrap;
    }
    .px-footer-v9-bottom .px-footer-v9-bottom-note {
        min-width: 0;
        justify-self: end;
        text-align: right;
        font-size: calc((11px) + 1px);
        white-space: nowrap;
    }
}

/* =========================================================
   NORTHLINE Builders v1.9.12 — footer utility row root fix
   Desktop: use absolute anchors inside a relative row so the
   centre and right items are independent of left-copy width.
   Existing vertical spacing is intentionally preserved.
   ========================================================= */
@media (min-width: 901px) {
    .px-footer-v9-bottom {
        position: relative;
        display: block;
        width: 100%;
        min-height: 20px;
        font-size: calc((12px) + 1px);
        line-height: 1.4;
    }

    .px-footer-v9-bottom .px-footer-v9-copyright {
        display: block;
        width: max-content;
        max-width: calc(50% - 120px);
        margin: 0;
        font-size: calc((12px) + 1px);
        line-height: 1.4;
        text-align: left;
        white-space: nowrap;
    }

    .px-footer-v9-bottom .px-footer-v9-toplink {
        position: absolute;
        left: 50%;
        top: 3px;
        transform: translateX(-50%);
        margin: 0;
        font-size: calc((12px) + 1px);
        line-height: 1.4;
        text-align: center;
        white-space: nowrap;
    }

    .px-footer-v9-bottom .px-footer-v9-bottom-note {
        position: absolute;
        right: 0;
        top: 3px;
        margin: 0;
        font-size: calc((12px) + 1px);
        line-height: 1.4;
        text-align: right;
        white-space: nowrap;
    }
}

@media (max-width: 900px) {
    .px-footer-v9-bottom .px-footer-v9-toplink,
    .px-footer-v9-bottom .px-footer-v9-bottom-note {
        position: static;
        transform: none;
    }
}

/* NORTHLINE Builders v1.9.13 — baseline alignment
   Lower the centered and right utility links slightly so their visual
   baseline matches the copyright text without changing footer spacing. */
@media (min-width: 901px) {
    .px-footer-v9-bottom .px-footer-v9-toplink,
    .px-footer-v9-bottom .px-footer-v9-bottom-note {
        top: 3px;
    }
}

/* =========================================================
   NORTHLINE Builders v1.9.14 — footer baseline root fix
   Root cause: the utility row keeps 18px top padding, while the
   absolutely-positioned center/right items were anchored at top:3px.
   Anchor them to the same content start as the normal-flow copyright.
   ========================================================= */
@media (min-width: 901px) {
    .px-footer-v9-bottom {
        position: relative;
        display: block;
        width: 100%;
        padding-top: 18px;
        min-height: calc(18px + 1.4em);
        box-sizing: border-box;
        font-size: calc((12px) + 1px);
        line-height: 1.4;
    }

    .px-footer-v9-bottom .px-footer-v9-copyright {
        display: block;
        margin: 0;
        font-size: calc((12px) + 1px);
        line-height: 1.4;
    }

    .px-footer-v9-bottom .px-footer-v9-toplink,
    .px-footer-v9-bottom .px-footer-v9-bottom-note {
        top: 18px;
        margin: 0;
        font-size: calc((12px) + 1px);
        line-height: 1.4;
    }
}

/* =========================================================
   NORTHLINE Builders v1.9.15 — hero overlay horizontal gutter balance
   Desktop only. Preserve typography and structure; let the hero copy
   use the full video width minus equal 36px left/right gutters.
   ========================================================= */
@media (min-width: 768px) {
    .px-signature-hero-copy.px-signature-hero-copy-overlay {
        left: 36px;
        right: 36px;
        width: auto;
        max-width: none;
    }
}

/* =========================================================
   NORTHLINE Builders v1.9.18
   Footer enquiry always visible + floating call label spacing
   ========================================================= */
.px-footer-v9-enquiry-always-open .px-footer-v9-enquiry-title {
    display: block;
    padding: 0 0 12px;
    border-bottom: 1px solid #343434;
    color: #fff;
    font-size: calc((16px) + 1px);
    line-height: 1.4;
    font-weight: 800;
}

/* Keep the floating contact anchored to the right.
   A longer label expands to the left instead of pushing right. */
.px-whatsapp .px-floating-contact-label {
    left: auto;
    right: 0;
    transform: none;
    width: max-content;
    max-width: none;
    text-align: right;
    letter-spacing: 0.045em;
    word-spacing: 0.16em;
    white-space: nowrap;
}

/* =========================================================
   NORTHLINE Builders v1.9.19
   Footer rhythm + floating contact safe inset
   - Reduce excess desktop gap before social strip
   - Move floating contact slightly inward/upward
   ========================================================= */
@media (min-width: 901px) {
    .px-footer-v9-top {
        padding-bottom: 18px;
    }

    .px-floating-contact-stack {
        right: 36px;
        bottom: 36px;
    }
}

@media (min-width: 901px) {
    /* The social strip should follow the tallest top-column content directly.
     Keep only a compact breathing space here; do not alter the footer's top inset. */
    .px-footer-v9-top {
        padding-bottom: 8px;
        margin-bottom: 0;
    }
    .px-footer-v9-socials {
        margin-top: 0;
    }

    /* Equal columns preserve true left / page-centre / right placement.
     Baseline alignment makes the actual letter bottoms line up, instead of
     compensating with independent absolute top offsets. */
    .px-footer-v9-bottom {
        position: relative;
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
        align-items: baseline;
        width: 100%;
        min-height: 0;
        padding-top: 18px;
        gap: 16px;
        font-size: calc((12px) + 1px);
        line-height: 1.4;
    }
    .px-footer-v9-bottom .px-footer-v9-copyright,
    .px-footer-v9-bottom .px-footer-v9-toplink,
    .px-footer-v9-bottom .px-footer-v9-bottom-note {
        position: static;
        top: auto;
        right: auto;
        left: auto;
        transform: none;
        margin: 0;
        padding: 0;
        font-size: calc((12px) + 1px);
        line-height: 1.4;
        white-space: nowrap;
        align-self: baseline;
    }
    .px-footer-v9-bottom .px-footer-v9-copyright {
        justify-self: start;
        text-align: left;
    }
    .px-footer-v9-bottom .px-footer-v9-toplink {
        justify-self: center;
        text-align: center;
    }
    .px-footer-v9-bottom .px-footer-v9-bottom-note {
        justify-self: end;
        text-align: right;
    }
}

@media (min-width: 1181px) {
    /* Resting labels: explicit contrast in both themes. */

    body .px-desktop-nav .sub-menu > li > a {
        color: #fff;
}

    /* Retire the old expanding color pseudo-layer. It could visually sit over
     the raw text node. Hover color now lives on the link itself. */
    .px-desktop-nav .sub-menu > li > a::before {
        content: none;
    }

    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+1) > a:hover,
  .px-desktop-nav .sub-menu > li:nth-child(8n/**/+1) > a:focus-visible {
        background-color: rgb(var(--px-submenu-c1));
        color: #fff;
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+2) > a:hover,
  .px-desktop-nav .sub-menu > li:nth-child(8n/**/+2) > a:focus-visible {
        background-color: rgb(var(--px-submenu-c2));
        color: #fff;
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+3) > a:hover,
  .px-desktop-nav .sub-menu > li:nth-child(8n/**/+3) > a:focus-visible {
        background-color: rgb(var(--px-submenu-c3));
        color: #fff;
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+4) > a:hover,
  .px-desktop-nav .sub-menu > li:nth-child(8n/**/+4) > a:focus-visible {
        background-color: rgb(var(--px-submenu-c4));
        color: #111;
}
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+5) > a:hover,
  .px-desktop-nav .sub-menu > li:nth-child(8n/**/+5) > a:focus-visible {
        background-color: rgb(var(--px-submenu-c5));
        color: #fff;
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+6) > a:hover,
  .px-desktop-nav .sub-menu > li:nth-child(8n/**/+6) > a:focus-visible {
        background-color: rgb(var(--px-submenu-c6));
        color: #fff;
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+7) > a:hover,
  .px-desktop-nav .sub-menu > li:nth-child(8n/**/+7) > a:focus-visible {
        background-color: rgb(var(--px-submenu-c7));
        color: #fff;
    }
    .px-desktop-nav .sub-menu > li:nth-child(8n/**/+8) > a:hover,
  .px-desktop-nav .sub-menu > li:nth-child(8n/**/+8) > a:focus-visible {
        background-color: rgb(var(--px-submenu-c8));
        color: #fff;
    }

    .px-desktop-nav .sub-menu > li > a:hover,
    .px-desktop-nav .sub-menu > li > a:focus-visible {
        opacity: 1;
        visibility: visible;
}
}

@media (max-width: 1180px) {
    body .px-mobile-primary-menu .sub-menu > li > a {
        color: #fff;
background: rgba(0, 0, 0, 0.2);
    }

    /* Same fix as desktop: direct state backgrounds keep the label above the
     interaction color instead of relying on a pseudo-element layer. */
    .px-mobile-primary-menu .sub-menu > li > a::before {
        content: none;
    }

    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+1) > a:is(:hover,:active,:focus-visible,.is-touch-active) {
        background-color: rgb(var(--px-submenu-c1));
        color: #fff;
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+2) > a:is(:hover,:active,:focus-visible,.is-touch-active) {
        background-color: rgb(var(--px-submenu-c2));
        color: #fff;
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+3) > a:is(:hover,:active,:focus-visible,.is-touch-active) {
        background-color: rgb(var(--px-submenu-c3));
        color: #fff;
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+4) > a:is(:hover,:active,:focus-visible,.is-touch-active) {
        background-color: rgb(var(--px-submenu-c4));
        color: #111;
}
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+5) > a:is(:hover,:active,:focus-visible,.is-touch-active) {
        background-color: rgb(var(--px-submenu-c5));
        color: #fff;
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+6) > a:is(:hover,:active,:focus-visible,.is-touch-active) {
        background-color: rgb(var(--px-submenu-c6));
        color: #fff;
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+7) > a:is(:hover,:active,:focus-visible,.is-touch-active) {
        background-color: rgb(var(--px-submenu-c7));
        color: #fff;
    }
    .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+8) > a:is(:hover,:active,:focus-visible,.is-touch-active) {
        background-color: rgb(var(--px-submenu-c8));
        color: #fff;
    }

    .px-mobile-primary-menu .sub-menu > li > a:is(:hover, :active, :focus-visible, .is-touch-active) {
        opacity: 1;
        visibility: visible;
    }
}

/* =========================================================
   NORTHLINE Builders v1.9.30
   Submenu dark-hover + mobile contrast hardening
   ========================================================= */

@media (min-width: 1181px) {
    body .px-site-header .px-desktop-nav .sub-menu > li > a:is(:hover, :focus-visible) {
        color: #fff;
        opacity: 1;
        visibility: visible;
}
    body .px-site-header .px-desktop-nav .sub-menu > li:nth-child(8n/**/+4) > a:is(:hover,:focus-visible) {
        color: #fff;
        background-color: rgb(var(--px-submenu-c4));
}
}

@media (max-width: 1180px) {
    /* Mobile/touch uses the same explicit contrast contract as desktop. */

    body .px-site-header .px-mobile-primary-menu .sub-menu > li > a {
        color: #fff;
        background-color: rgba(4, 10, 16, 0.42);
}
    body
        .px-site-header
        .px-mobile-primary-menu
        .sub-menu
        > li
        > a:is(:hover, :active, :focus-visible, .is-touch-active) {
        color: #fff;
        opacity: 1;
        visibility: visible;
}
    body .px-site-header .px-mobile-primary-menu .sub-menu > li:nth-child(8n/**/+4) > a:is(:hover,:active,:focus-visible,.is-touch-active) {
        color: #fff;
        background-color: rgb(var(--px-submenu-c4));
}
}

/* =========================================================
   NORTHLINE Builders v1.9.31
   Floating call optical centering
   ========================================================= */
.px-whatsapp .px-floating-contact-label {
    left: 50%;
    right: auto;
    transform: translateX(calc(-50% + 3px));
    width: max-content;
    max-width: none;
    text-align: center;
}

/* =========================================================
   NORTHLINE Builders v1.9.32
   Bidirectional section reveals + media hover + floating label motion
   ========================================================= */
/* Sections 01–07: re-enter motion from either scroll direction. */
body.home.px-motion-ready section[data-motion-section] [data-motion-item] {
    opacity: 0;
    transform: translate3d(0, 52px, 0) scale(0.985);
    filter: blur(5px);
    transition:
        opacity 0.68s ease,
        transform 0.88s cubic-bezier(0.16, 1, 0.3, 1),
        filter 0.68s ease;
}
body.home.px-motion-ready section[data-motion-section].motion-from-above [data-motion-item] {
    transform: translate3d(0, -52px, 0) scale(0.985);
}
body.home.px-motion-ready section[data-motion-section].motion-from-below [data-motion-item] {
    transform: translate3d(0, 52px, 0) scale(0.985);
}
body.home.px-motion-ready section[data-motion-section].is-motion-visible [data-motion-item] {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    filter: blur(0);
}
body.home section[data-motion-section].is-motion-visible [data-motion-item]:nth-child(2) {
    transition-delay: 0.035s;
}
body.home section[data-motion-section].is-motion-visible [data-motion-item]:nth-child(3) {
    transition-delay: 0.07s;
}
body.home section[data-motion-section].is-motion-visible [data-motion-item]:nth-child(4) {
    transition-delay: 0.105s;
}

/* Image motion: subtle lift/zoom only on pointer devices; layout stays unchanged. */
@media (hover: hover) and (pointer: fine) {
    body.home
        section[data-motion-section]
        :is(
            figure,
            .px-about-v4-media,
            .px-why-v5-media,
            .px-strategy-v4-media,
            .px-product-image,
            .px-work-v4-card,
            .px-designs-v4-row
        ) {
        overflow: hidden;
    }
    body.home section[data-motion-section] img {
        transform: scale(1);
        transform-origin: center;
        transition:
            transform 0.62s cubic-bezier(0.2, 0.72, 0.2, 1),
            filter 0.42s ease;
        will-change: transform;
    }
    body.home
        section[data-motion-section]
        :is(
            figure,
            .px-about-v4-media,
            .px-why-v5-media,
            .px-strategy-v4-media,
            .px-product-image,
            .px-work-v4-card,
            .px-designs-v4-row
        ):hover
        img {
        transform: scale(1.065);
    }
}

/* Floating label: reserve its width so the existing icon/background never moves. */
.px-whatsapp .px-floating-contact-label.px-type-label {
    min-width: var(--px-type-label-width, auto);
    display: inline-flex;
    justify-content: center;
    align-items: center;
    white-space: pre;
}
.px-floating-contact-label .px-type-char {
    display: inline-block;
    opacity: 0;
    transform: translateY(3px);
    transition:
        opacity 0.18s ease,
        transform 0.18s ease;
}
.px-floating-contact-label .px-type-char.is-visible {
    opacity: 1;
    transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
    body.home.px-motion-ready section[data-motion-section] [data-motion-item] {
        opacity: 1;
        transform: none;
        filter: none;
        transition: none;
    }
    body.home section[data-motion-section] img {
        transform: none;
        transition: none;
    }
    .px-floating-contact-label .px-type-char {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

/* v1.9.33 — canonical visible motion fix.
   The block front-page does not wrap these sections in <main>, so motion selectors
   must target the rendered sections directly. */
@media (hover: hover) and (pointer: fine) {
    body.home section[data-motion-section] :is(.px-work-v4-card, .px-products-v4-card, .px-designs-v4-row) {
        transition:
            transform 0.48s cubic-bezier(0.16, 1, 0.3, 1),
            box-shadow 0.48s ease;
    }
    body.home
        section[data-motion-section]
        :is(.px-work-v4-card, .px-products-v4-card, .px-designs-v4-row):hover {
        transform: translate3d(0, -7px, 0);
    }
}

/* v1.9.35 — progressive-enhancement safety: content is never hidden unless motion JS is alive. */
body.home:not(.px-motion-ready) section[data-motion-section] [data-motion-item],
body.home:not(.px-motion-ready) .px-page-motion[data-motion-section] [data-motion-item] {
    opacity: 1;
    transform: none;
    filter: none;
}

/* =========================================================
   NORTHLINE Builders v1.9.34 — complete page motion + water hover
   ========================================================= */
/* Hero, Sections 01–07 and footer use one canonical reveal language. */
body.home.px-motion-ready .px-page-motion[data-motion-section] [data-motion-item] {
    opacity: 0;
    transform: translate3d(0, 58px, 0) scale(0.982);
    filter: blur(7px);
    transition:
        opacity 0.72s ease,
        transform 0.96s cubic-bezier(0.16, 1, 0.3, 1),
        filter 0.72s ease;
    will-change: opacity, transform, filter;
}
body.home.px-motion-ready .px-page-motion[data-motion-section].motion-from-above [data-motion-item] {
    transform: translate3d(0, -58px, 0) scale(0.982);
}
body.home.px-motion-ready .px-page-motion[data-motion-section].motion-from-below [data-motion-item] {
    transform: translate3d(0, 58px, 0) scale(0.982);
}
body.home.px-motion-ready .px-page-motion[data-motion-section].is-motion-visible [data-motion-item] {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    filter: blur(0);
}
body.home .px-footer-v9.px-page-motion [data-motion-item]:nth-child(2) {
    transition-delay: 0.08s;
}
body.home .px-footer-v9.px-page-motion [data-motion-item]:nth-child(3) {
    transition-delay: 0.16s;
}

/* Linked-image water interaction: cursor bloom + expanding liquid ring. */
@media (hover: hover) and (pointer: fine) {
    body.home .px-water-hover {
        position: relative;
        overflow: hidden;
        isolation: isolate;
    }
    body.home .px-water-hover::after {
        content: \"\";
        position: absolute;
        inset: 0;
        z-index: 3;
        pointer-events: none;
        opacity: 0;
        background: radial-gradient(
            circle 110px at var(--px-water-x, 50%) var(--px-water-y, 50%),
            rgba(255, 255, 255, 0.22) 0%,
            rgba(255, 255, 255, 0.09) 28%,
            rgba(255, 255, 255, 0) 70%
        );
        transition: opacity 0.3s ease;
        mix-blend-mode: soft-light;
    }
    body.home .px-water-hover:hover::after {
        opacity: 1;
    }
    body.home .px-water-hover > img,
    body.home .px-water-hover picture img {
        transition:
            transform 0.75s cubic-bezier(0.16, 1, 0.3, 1),
            filter 0.55s ease;
    }
    body.home .px-water-hover:hover > img,
    body.home .px-water-hover:hover picture img {
        transform: scale(1.045);
        filter: saturate(1.04) contrast(1.015);
    }
    body.home .px-water-ripple {
        position: absolute;
        z-index: 4;
        width: 28px;
        height: 28px;
        margin: -14px 0 0 -14px;
        border-radius: 50%;
        pointer-events: none;
        border: 1px solid rgba(255, 255, 255, 0.72);
        background: radial-gradient(
            circle,
            rgba(255, 255, 255, 0.18) 0 18%,
            rgba(255, 255, 255, 0.06) 34%,
            transparent 62%
        );
animation: pxWaterRipple 1s cubic-bezier(0.12, 0.65, 0.2, 1) forwards;
    }
}
@keyframes pxWaterRipple {
    0% {
        opacity: 0.95;
        transform: scale(0.35);
        filter: blur(0);
    }
    55% {
        opacity: 0.52;
    }
    100% {
        opacity: 0;
        transform: scale(9);
        filter: blur(0.6px);
    }
}

@media (prefers-reduced-motion: reduce) {
    body.home.px-motion-ready .px-page-motion[data-motion-section] [data-motion-item] {
        opacity: 1;
        transform: none;
        filter: none;
        transition: none;
    }
    body.home .px-water-ripple {
        display: none;
    }
    body.home .px-water-hover::after {
        display: none;
    }
}

/* =========================================================
   NORTHLINE Builders v1.9.36 — pronounced liquid hover
   Stronger cursor water interaction for linked imagery + footer imagery.
   ========================================================= */
@media (hover: hover) and (pointer: fine) {
    body.home .px-water-hover::after {
        opacity: 0;
        background:
            radial-gradient(
                circle 92px at var(--px-water-x, 50%) var(--px-water-y, 50%),
                rgba(255, 255, 255, 0.52) 0%,
                rgba(255, 255, 255, 0.25) 24%,
                rgba(64, 164, 255, 0.22) 43%,
                rgba(255, 255, 255, 0) 72%
            ),
            radial-gradient(
                circle 180px at var(--px-water-x, 50%) var(--px-water-y, 50%),
                rgba(39, 132, 221, 0.18) 0%,
                rgba(255, 255, 255, 0.08) 42%,
                transparent 72%
            );
        mix-blend-mode: screen;
        transition: opacity 0.16s ease;
    }
    body.home .px-water-hover:hover::after {
        opacity: 1;
    }

    body.home .px-water-hover > img,
    body.home .px-water-hover picture img {
        transition:
            transform 0.62s cubic-bezier(0.16, 1, 0.3, 1),
            filter 0.35s ease;
        transform-origin: var(--px-water-x, 50%) var(--px-water-y, 50%);
    }
    body.home .px-water-hover:hover > img,
    body.home .px-water-hover:hover picture img {
        transform: scale(1.075);
        filter: saturate(1.13) contrast(1.055) brightness(1.035);
    }

    body.home .px-water-ripple {
        width: 34px;
        height: 34px;
        margin: -17px 0 0 -17px;
        border: 2px solid rgba(255, 255, 255, 0.94);
        background: radial-gradient(
            circle,
            rgba(255, 255, 255, 0.42) 0 10%,
            rgba(80, 176, 255, 0.28) 20%,
            rgba(255, 255, 255, 0.1) 38%,
            transparent 63%
        );
mix-blend-mode: screen;
        animation: pxWaterRippleStrong 1.15s cubic-bezier(0.12, 0.7, 0.18, 1) forwards;
    }
    body.home .px-water-ripple.px-water-ripple-2 {
        animation-delay: 0.1s;
        opacity: 0.72;
    }
    body.home .px-water-ripple.px-water-ripple-3 {
        animation-delay: 0.2s;
        opacity: 0.48;
    }

    /* Footer imagery receives the same interaction without changing footer geometry. */
    body.home .px-footer-v9 .px-water-hover {
        display: inline-block;
        max-width: 100%;
        vertical-align: top;
    }
}
@keyframes pxWaterRippleStrong {
    0% {
        opacity: 1;
        transform: scale(0.18);
        filter: blur(0);
    }
    28% {
        opacity: 0.92;
    }
    62% {
        opacity: 0.48;
    }
    100% {
        opacity: 0;
        transform: scale(12);
        filter: blur(1.1px);
    }
}

/* =========================================================
   NORTHLINE Builders v1.9.37 — calm premium viewport motion
   Small travel, no blur/zoom on section reveal: readable and low-disorientation.
   ========================================================= */
body.home.px-motion-ready .px-page-motion[data-motion-section] [data-motion-item] {
    opacity: 0;
    transform: translate3d(0, 20px, 0);
    filter: none;
    transition:
        opacity 0.58s cubic-bezier(0.22, 0.61, 0.36, 1),
        transform 0.76s cubic-bezier(0.16, 1, 0.3, 1);
    will-change: opacity, transform;
}
body.home.px-motion-ready .px-page-motion[data-motion-section].motion-from-above [data-motion-item] {
    transform: translate3d(0, -20px, 0);
}
body.home.px-motion-ready .px-page-motion[data-motion-section].motion-from-below [data-motion-item] {
    transform: translate3d(0, 20px, 0);
}
body.home.px-motion-ready .px-page-motion[data-motion-section].is-motion-visible [data-motion-item] {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    filter: none;
}
body.home .px-page-motion.is-motion-visible [data-motion-item]:nth-child(2) {
    transition-delay: 0.025s;
}
body.home .px-page-motion.is-motion-visible [data-motion-item]:nth-child(3) {
    transition-delay: 0.05s;
}
body.home .px-page-motion.is-motion-visible [data-motion-item]:nth-child(4) {
    transition-delay: 0.075s;
}

/* Section 02 process imagery is explicitly a liquid-hover surface. */
@media (hover: hover) and (pointer: fine) {
    body.home .px-process-v4-item figure.px-water-hover {
        position: relative;
        overflow: hidden;
        isolation: isolate;
    }
}

/* =========================================================
   NORTHLINE Builders v1.9.38 — calm liquid interaction + mobile CTA safe edge
   - One restrained liquid pulse instead of three expanding rings.
   - Cursor bloom remains visible but does not distort or over-zoom imagery.
   - On mobile, the label's final character defines the right safe margin;
     icon/brush follow that anchor instead of allowing the label to overflow.
   ========================================================= */
@media (hover: hover) and (pointer: fine) {
    body.home .px-water-hover::after {
        opacity: 0;
        background: radial-gradient(
            circle 76px at var(--px-water-x, 50%) var(--px-water-y, 50%),
            rgba(255, 255, 255, 0.34) 0%,
            rgba(255, 255, 255, 0.16) 28%,
            rgba(92, 168, 224, 0.11) 46%,
            rgba(255, 255, 255, 0) 72%
        );
        mix-blend-mode: screen;
        transition: opacity 0.22s ease;
    }
    body.home .px-water-hover:hover::after {
        opacity: 0.82;
    }

    body.home .px-water-hover > img,
    body.home .px-water-hover picture img {
        transform-origin: center;
        transition:
            transform 0.55s cubic-bezier(0.16, 1, 0.3, 1),
            filter 0.38s ease;
    }
    body.home .px-water-hover:hover > img,
    body.home .px-water-hover:hover picture img {
        transform: scale(1.025);
        filter: saturate(1.045) contrast(1.02) brightness(1.012);
    }

    body.home .px-water-ripple {
        width: 30px;
        height: 30px;
        margin: -15px 0 0 -15px;
        border: 1.5px solid rgba(255, 255, 255, 0.78);
        background: radial-gradient(
            circle,
            rgba(255, 255, 255, 0.28) 0 13%,
            rgba(100, 181, 236, 0.14) 30%,
            rgba(255, 255, 255, 0.06) 48%,
            transparent 68%
        );
mix-blend-mode: screen;
        animation: pxWaterRippleCalm 0.78s cubic-bezier(0.2, 0.7, 0.2, 1) forwards;
    }
}
@keyframes pxWaterRippleCalm {
    0% {
        opacity: 0.82;
        transform: scale(0.35);
    }
    55% {
        opacity: 0.42;
    }
    100% {
        opacity: 0;
        transform: scale(5.2);
    }
}

@media (max-width: 480px) {
    .px-floating-contact-stack {
        right: 16px;
        width: auto;
        max-width: none;
        align-items: flex-end;
    }
    .px-floating-contact-stack .px-whatsapp {
        align-self: flex-end;
    }
    .px-whatsapp .px-floating-contact-label,
    .px-whatsapp .px-floating-contact-label.px-type-label {
        left: auto;
        right: 0;
        transform: none;
        max-width: calc(100vw - 32px);
        text-align: right;
        justify-content: flex-end;
    }
}

/* =========================================================
   NORTHLINE Builders v1.9.41 — Hero headline scale
   Final authority: larger headline without changing hero geometry.
   ========================================================= */
.px-signature-hero-copy.px-signature-hero-copy-overlay h1 {
    font-size: calc((clamp(38px, 3.45vw, 60px)) + 1px);
    line-height: 1.01;
    letter-spacing: -0.035em;
}
@media (max-width: 767px) {
    .px-signature-hero-copy.px-signature-hero-copy-overlay h1 {
        font-size: calc((clamp(18px, 5vw, 26px)) + 1px);
        line-height: 1.06;
        white-space: normal;
    }
}

/* Floating contact brush: yellow artwork; icon remains white. */
.px-whatsapp .px-floating-chat-brush {
    background-image: url("../images/floating-chat-brush.png");
}

/* v1.9.43 — bright gaming-style yellow, shape and icon unchanged. */
.px-whatsapp .px-floating-chat-brush {
    background-image: url("../images/floating-chat-brush.png");
}
.px-whatsapp .px-floating-chat-brush {
    background-image: url("../images/floating-chat-brush.png");
}

/* v1.9.45 — Restore the original blue floating-contact brush. */
.px-whatsapp .px-floating-chat-brush {
    background-image: url("../images/floating-chat-brush.png");
}

/* =========================================================
   NORTHLINE Builders v1.9.48 — stable header CTA hover geometry
   Keep the approved architectural frame, but never move/resize the
   CTA on hover. This prevents the adjacent desktop navigation from
   appearing to shift when the pointer enters the CTA.
   ========================================================= */
@media (min-width: 1181px) {
    .px-desktop-header-controls .px-header-whatsapp-cta,
    .px-desktop-header-controls .px-header-whatsapp-cta:visited,
    .px-desktop-header-controls .px-header-whatsapp-cta:hover,
    .px-desktop-header-controls .px-header-whatsapp-cta:focus-visible {
        flex: 0 0 auto;
        transform: none;
        filter: none;
margin: 0;
        padding: 16px 34px;
        min-height: 52px;
        line-height: 1.25;
        transition:
            background-image 0.16s ease,
            color 0.16s ease;
    }
}
/* Frame still disappears on interaction, without changing geometry. */

/* ==========================================================
   VOLTERRA Electrical 2.0 — premium electrician visual system
   One global horizontal gutter for header, hero, sections + footer.
   ========================================================== */
:root {
    --volterra-yellow: #f5df18;
    --volterra-ink: #07131d;
    --volterra-navy: #0b2233;
    --volterra-line: rgba(7, 19, 29, 0.16);
}
body.home {
    background: #f7f8f8;
}
body.home .wp-site-blocks {
    overflow: hidden;
}
/* Hero: full cinematic electrician presentation, preserving editable video. */
body.home .px-signature-hero {
    background: var(--volterra-ink);
    min-height: clamp(620px, 82vh, 880px);
}
body.home .px-signature-hero-inner {
    display: block;
    position: relative;
    min-height: inherit;
    padding-top: 0;
    padding-bottom: 0;
}
body.home .px-signature-hero-brand {
    position: absolute;
    z-index: 5;
    left: var(--signature-page-gutter);
    top: clamp(92px, 11vh, 132px);
    width: auto;
    padding: 0;
    background: transparent;
}
body.home .px-signature-hero-brand-fallback {
    color: #fff;
    display: flex;
    align-items: baseline;
    gap: 8px;
    letter-spacing: 0.12em;
}
body.home .px-signature-hero-brand-fallback strong {
    font-size: calc((13px) + 1px);
}
.px-signature-hero-brand-fallback > span:last-child {
    font-size: calc((9px) + 1px);
    color: var(--volterra-yellow);
}
body.home .px-signature-hero-feature {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}
body.home .px-signature-hero-video-wrap {
    height: 100%;
    min-height: inherit;
    position: relative;
    background: var(--volterra-ink);
}
body.home .px-signature-hero-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: saturate(0.72) contrast(1.08) brightness(0.68);
}
body.home .px-signature-hero-video-wrap:after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        90deg,
        rgba(4, 15, 24, 0.94) 0%,
        rgba(4, 15, 24, 0.78) 37%,
        rgba(4, 15, 24, 0.24) 72%,
        rgba(4, 15, 24, 0.18) 100%
    );
    pointer-events: none;
}
body.home .px-signature-hero-copy.px-signature-hero-copy-overlay {
    z-index: 4;
    left: var(--signature-page-gutter);
    right: auto;
    top: 50%;
    bottom: auto;
    transform: translateY(-42%);
    width: min(700px, 62vw);
    max-width: 700px;
    color: #fff;
    padding: 0;
}
body.home .px-signature-hero-copy h1 {
    font-size: calc((clamp(52px, 6.2vw, 96px)) + 1px);
    line-height: 0.91;
    letter-spacing: -0.055em;
    font-weight: 800;
    max-width: 690px;
}
body.home .px-signature-hero-copy p {
    font-size: calc((clamp(16px, 1.35vw, 21px)) + 1px);
    line-height: 1.55;
    max-width: 590px;
    color: rgba(255, 255, 255, 0.84);
    margin-top: 26px;
}
body.home .px-signature-hero-accent {
    display: block;
    width: 92px;
    height: 6px;
    background: var(--volterra-yellow);
    margin-top: 30px;
    border: 0;
}
/* Editorial sections: sharp, technical, generous whitespace. */
body.home
    :is(
        .px-exclusive-v4,
        .px-process-v4,
        .px-work-v4,
        .px-why-v5,
        .px-products-v4,
        .px-strategy-v4,
        .px-final-v5
    ) {
    border-radius: 0;
}
body.home .px-exclusive-v4 {
    background: #fff;
    padding: 96px 0;
    border-bottom: 1px solid var(--volterra-line);
}
body.home .px-exclusive-v4 h2 {
    font-size: calc((clamp(42px, 5vw, 76px)) + 1px);
    letter-spacing: -0.045em;
    line-height: 0.95;
}
body.home .px-exclusive-v4-label span:first-child {
    color: #111;
    font-weight: 800;
}
.px-exclusive-v4-label span:last-child {
    color: #59636b;
}
body.home .px-exclusive-v4-copy strong {
    color: #111;
    border-bottom: 5px solid var(--volterra-yellow);
    padding-bottom: 5px;
}
body.home .px-process-v4 {
    background: #eef1f2;
    padding: 100px 0;
}
body.home .px-process-v4-track {
    gap: 1px;
}
.px-process-v4-item {
    background: #fff;
    border: 0;
    overflow: hidden;
}
.px-process-v4-item figure {
    aspect-ratio: 4/3;
    overflow: hidden;
}
.px-process-v4-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.px-process-v4-copy {
    padding: 28px;
}
.px-process-v4-copy > span {
    color: #b29f00;
    font-weight: 800;
}
body.home .px-work-v4 {
    background: #07131d;
    color: #fff;
    padding: 100px 0;
}
.px-work-v4-head span {
    color: var(--volterra-yellow);
}
.px-work-v4-head h2 {
    color: #fff;
}
.px-work-v4-grid {
    gap: 2px;
}
.px-work-v4-card {
    border-radius: 0;
}
.px-work-v4-card:after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(0deg, rgba(3, 11, 17, 0.72), transparent 58%);
    pointer-events: none;
}
.px-work-v4-card > div {
    z-index: 2;
}
.px-work-v4-card strong {
    color: #fff;
}
body.home .px-why-v5 {
    background: #fff;
    padding-top: 110px;
    padding-bottom: 110px;
    gap: clamp(48px, 7vw, 110px);
}
.px-why-v5-media {
    border-radius: 0;
}
.px-why-v5-media figcaption span {
    background: var(--volterra-yellow);
    color: #07131d;
    border-color: #07131d;
}
.px-why-v5-copy > span {
    color: #9a8900;
}
.px-why-v5-copy h2 {
    font-size: calc((clamp(42px, 5vw, 72px)) + 1px);
    letter-spacing: -0.045em;
}
body.home .px-products-v4 {
    background: #f7f8f8;
    padding-top: 100px;
    padding-bottom: 100px;
}
.px-products-v4-grid {
    gap: 1px;
}
.px-products-v4-card {
    background: #fff;
    border: 1px solid rgba(7, 19, 29, 0.1);
    border-radius: 0;
}
.px-products-v4-card figure {
    aspect-ratio: 16/10;
}
.px-products-v4-copy span {
    color: #9a8900;
}
.px-products-v4-copy h3 {
    font-weight: 800;
}
body.home .px-strategy-v4 {
    background: #0b2233;
    color: #fff;
    padding-top: 100px;
    padding-bottom: 100px;
}
.px-strategy-v4-copy > span {
    color: var(--volterra-yellow);
}
.px-strategy-v4-copy h2,
.px-strategy-v4-copy p {
    color: #fff;
}
.px-strategy-v4-media {
    border-radius: 0;
}
.px-strategy-v4-media figcaption span {
    background: var(--volterra-yellow);
    color: #07131d;
}
body.home .px-final-v5 {
    background: var(--volterra-yellow);
    color: #07131d;
}
.px-final-v5-shell {
    padding-top: 88px;
    padding-bottom: 88px;
}
.px-final-v5 :is(h2, p, span, b) {
    color: #07131d;
}
.px-final-v5-link {
    border-color: #07131d;
}

body.home .px-footer-v9 {
    margin: 0;
}
@media (max-width: 767px) {
    body.home .px-signature-hero {
        min-height: 680px;
    }
    body.home .px-signature-hero-brand {
        top: 92px;
    }
    body.home .px-signature-hero-copy.px-signature-hero-copy-overlay {
        width: calc(100% - (var(--signature-page-gutter) * 2));
        max-width: none;
        transform: translateY(-30%);
    }
    body.home .px-signature-hero-copy h1 {
        font-size: calc((clamp(46px, 13vw, 68px)) + 1px);
    }
    body.home .px-signature-hero-video-wrap:after {
        background: linear-gradient(90deg, rgba(4, 15, 24, 0.9), rgba(4, 15, 24, 0.42));
    }
    body.home .px-exclusive-v4,
    body.home .px-process-v4,
    body.home .px-work-v4 {
        padding-top: 72px;
        padding-bottom: 72px;
    }
}

/* =========================================================
   SHIFT AUTO v3.0.0 — premium full-black automotive skin.
   Presentation only: existing editable blocks/settings remain intact.
   ========================================================= */
:root {
    --shift-black: #000;
    --shift-panel: #070707;
    --shift-panel-2: #0d0d0d;
    --shift-white: #f5f5f2;
    --shift-muted: #9a9a96;
    --shift-red: #ff2438;
    --shift-line: rgba(255, 255, 255, 0.14);
}
html,
body,
body.home,
.wp-site-blocks {
    background: #000;
    color: var(--shift-white);
}
body.home
    :is(
        .px-exclusive-v4,
        .px-process-v4,
        .px-work-v4,
        .px-why-v5,
        .px-products-v4,
        .px-strategy-v4,
        .px-final-v5,
        .px-footer-v9
    ) {
    background: #000;
    color: var(--shift-white);
}
body.home
    :is(
        .px-exclusive-v4-inner,
        .px-process-v4-inner,
        .px-work-v4-inner,
        .px-why-v5,
        .px-products-v4-inner,
        .px-strategy-v4-inner,
        .px-final-v5-shell,
        .px-footer-v9-inner
    ) {
    padding-left: var(--signature-page-gutter);
    padding-right: var(--signature-page-gutter);
    max-width: none;
    width: 100%;
    box-sizing: border-box;
}
/* Hero */
body.home .px-signature-hero {
    background: #000;
    min-height: clamp(650px, 88vh, 940px);
    border-bottom: 1px solid var(--shift-line);
}
body.home .px-signature-hero-video-wrap {
    background: #000;
    overflow: hidden;
}
body.home .px-shift-hero-image {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center 55%;
    transform: scale(1.02);
    animation: shiftHeroDrift 12s ease-in-out infinite alternate;
}
@keyframes shiftHeroDrift {
    from {
        transform: scale(1.02) translate3d(0, 0, 0);
    }
    to {
        transform: scale(1.075) translate3d(-1.1%, 0, 0);
    }
}
body.home .px-signature-hero-video {
    filter: saturate(1.18) contrast(1.12) brightness(0.58);
}
body.home .px-signature-hero-video-wrap:after {
    background: linear-gradient(
        90deg,
        #000 0%,
        rgba(0, 0, 0, 0.91) 29%,
        rgba(0, 0, 0, 0.44) 62%,
        rgba(0, 0, 0, 0.18) 100%
    );
}
body.home .px-signature-hero-brand-fallback strong {
    font-size: calc((17px) + 1px);
    font-weight: 900;
    letter-spacing: -0.03em;
}
.px-signature-hero-brand-fallback > span:last-child {
    color: var(--shift-red);
    font-weight: 800;
}
body.home .px-signature-hero-copy h1 {
    color: #fff;
    text-transform: uppercase;
    font-size: calc((clamp(62px, 7.4vw, 118px)) + 1px);
    line-height: 0.82;
    letter-spacing: -0.07em;
    max-width: 720px;
    text-wrap: balance;
}
body.home .px-signature-hero-copy p {
    color: rgba(255, 255, 255, 0.72);
    max-width: 560px;
}
body.home .px-signature-hero-accent {
    background: var(--shift-red);
    width: 120px;
    height: 3px;
}
/* Section typography + rhythm */
body.home :is(.px-exclusive-v4, .px-process-v4, .px-work-v4, .px-why-v5, .px-products-v4, .px-strategy-v4) {
    border-bottom: 1px solid var(--shift-line);
    padding-top: clamp(86px, 9vw, 142px);
    padding-bottom: clamp(86px, 9vw, 142px);
}
body.home
    :is(.px-exclusive-v4, .px-process-v4, .px-work-v4, .px-why-v5, .px-products-v4, .px-strategy-v4)
    :is(h2, h3, strong) {
    color: #fff;
}
body.home :is(.px-exclusive-v4, .px-process-v4, .px-work-v4, .px-why-v5, .px-products-v4, .px-strategy-v4) p {
    color: var(--shift-muted);
}
body.home
    :is(
        .px-exclusive-v4-label,
        .px-process-v4-head > span,
        .px-work-v4-head > span,
        .px-why-v5-copy > span,
        .px-products-v4-head > span,
        .px-strategy-v4-copy > span
    ) {
    color: var(--shift-red);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-weight: 800;
}
body.home .px-exclusive-v4 h2,
body.home .px-process-v4 h2,
body.home .px-work-v4 h2,
body.home .px-why-v5 h2,
body.home .px-products-v4 h2,
body.home .px-strategy-v4 h2 {
    font-size: calc((clamp(42px, 5.4vw, 82px)) + 1px);
    line-height: 0.92;
    letter-spacing: -0.055em;
    text-transform: uppercase;
}
body.home .px-exclusive-v4-copy strong {
    color: #fff;
    border-bottom-color: var(--shift-red);
}
/* Cards: dark, sharp, image-led */
body.home .px-process-v4-track,
body.home .px-products-v4-grid {
    gap: 1px;
    background: var(--shift-line);
}
body.home .px-process-v4-item,
body.home .px-products-v4-card {
    background: var(--shift-panel);
    border: 0;
    border-radius: 0;
    color: #fff;
    transition:
        transform 0.55s cubic-bezier(0.16, 1, 0.3, 1),
        background 0.35s ease;
}
body.home :is(.px-process-v4-item, .px-products-v4-card):hover {
    background: #101010;
    transform: translateY(-8px);
}
body.home :is(.px-process-v4-item, .px-products-v4-card) img {
    filter: saturate(1.18) contrast(1.05);
    transition:
        transform 0.8s cubic-bezier(0.16, 1, 0.3, 1),
        filter 0.5s ease;
}
body.home :is(.px-process-v4-item, .px-products-v4-card):hover img {
    transform: scale(1.055);
    filter: saturate(1.35) contrast(1.08);
}
body.home .px-process-v4-copy > span,
body.home .px-products-v4-copy span {
    color: var(--shift-red);
}
/* Recent work: cinematic mosaic */
body.home .px-work-v4-grid {
    gap: 2px;
    background: #000;
}
.px-work-v4-card {
    min-height: clamp(280px, 34vw, 520px);
    overflow: hidden;
    border-radius: 0;
}
.px-work-v4-card img {
    filter: saturate(1.3) brightness(0.78);
}
.px-work-v4-card:hover img {
    transform: scale(1.07);
    filter: saturate(1.45) brightness(0.94);
}
.px-work-v4-card:after {
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.88), rgba(0, 0, 0, 0.05) 68%);
}
/* Why: offset editorial split */
body.home .px-why-v5 {
    gap: clamp(50px, 8vw, 130px);
}
.px-why-v5-media {
    border-radius: 0;
}
.px-why-v5-media img {
    filter: saturate(1.2) contrast(1.08);
}
.px-why-v5-media figcaption span {
    background: var(--shift-red);
    color: #fff;
    border: 0;
}
/* Workshop section */
body.home .px-strategy-v4 {
    background: #050505;
}
.px-strategy-v4-media {
    border-radius: 0;
}
.px-strategy-v4-media img {
    filter: saturate(1.3) contrast(1.08);
}
.px-strategy-v4-media figcaption span {
    background: rgba(0, 0, 0, 0.76);
    color: #fff;
    border: 1px solid var(--shift-line);
    backdrop-filter: blur(8px);
}
/* CTA */
body.home .px-final-v5 {
    background: #000;
    border-bottom: 1px solid var(--shift-line);
}
.px-final-v5-shell {
    padding-top: clamp(92px, 10vw, 150px);
    padding-bottom: clamp(92px, 10vw, 150px);
    border-top: 1px solid var(--shift-line);
}
.px-final-v5 :is(h2, p, span, b) {
    color: #fff;
}
.px-final-v5 h2 {
    text-transform: uppercase;
    font-size: calc((clamp(48px, 6.5vw, 96px)) + 1px);
    line-height: 0.9;
    letter-spacing: -0.06em;
}
.px-final-v5-link {
    border: 1px solid #fff;
    color: #fff;
    background: transparent;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease;
}
.px-final-v5-link:hover {
    background: var(--shift-red);
    border-color: var(--shift-red);
    transform: translateY(-3px);
}
/* Footer: full black, high contrast. */
body .px-footer-v9 {
    background: #000;
    color: #fff;
    border-top: 1px solid var(--shift-line);
}
.px-footer-v9 :is(h2, h3, h4, strong, label, a) {
    color: #fff;
}
.px-footer-v9 p,
.px-footer-v9 small {
    color: rgba(255, 255, 255, 0.66);
}
.px-footer-v9 input,
.px-footer-v9 textarea,
.px-footer-v9 select {
    background: #080808;
    color: #fff;
    border-color: rgba(255, 255, 255, 0.28);
}
.px-footer-v9 button {
    background: #fff;
    color: #000;
    border-color: #fff;
}
/* Header stays black/translucent and uses the same global gutter. */
/* v3.78.9: removed legacy dark header authority; canonical white header lives in header-solid-white-v3789.css */
/* Motion polish: preserve existing observer, add subtle image depth. */
@media (hover: hover) and (pointer: fine) {
    body.home [data-motion-section] figure {
        perspective: 1000px;
    }
    body.home [data-motion-section] figure img {
        transform-origin: center center;
    }
}
@media (max-width: 767px) {
    body.home .px-signature-hero-copy h1 {
        font-size: calc((clamp(52px, 15vw, 78px)) + 1px);
    }
    .px-why-v5-media {
}
}
@media (prefers-reduced-motion: reduce) {
    body.home .px-shift-hero-image {
        animation: none;
    }
}

/* =========================================================
   SHIFT AUTO v3.4.1 — compact global section entry rhythm
   The upper breathing room before each section label is 50%
   of v3.4.0, while the lower section rhythm stays unchanged.
   One global rule only; no per-section top-spacing overrides.
   ========================================================= */
:root {
    --px-section-space-top: 36px;
}
body.home
    main
    > section:not(.px-hero):not(.px-hero-quote-grid):not(.px-kinetic-showcase):not(.px-portfolio-mosaic) {
    padding-top: var(--px-section-space-top);
    padding-bottom: var(--px-section-space);
}
@media (max-width: 1024px) {
    :root {
        --px-section-space-top: 28px;
    }
}
@media (max-width: 767px) {
    :root {
        --px-section-space-top: 22px;
    }
}

/* =========================================================
   SHIFT AUTO v3.4.2 — REAL global section rhythm authority
   Root-cause fix: v3.4.1 targeted `main > section`, but homepage
   sections are not direct children of <main>. Apply spacing to the
   actual section classes so older clamp/min-height spacing cannot win.
   ========================================================= */
:root {
    --shift-section-pad-y: 44px;
    --shift-section-head-gap: 28px;
}
body.home :is(.px-exclusive-v4, .px-process-v4, .px-work-v4, .px-why-v5, .px-strategy-v4, .px-final-v5) {
    padding-top: var(--shift-section-pad-y);
    padding-bottom: var(--shift-section-pad-y);
    min-height: 0;
    height: auto;
    box-sizing: border-box;
}
/* Section labels/headings begin close to the upper divider. */
body.home
    :is(
        .px-exclusive-v4-label,
        .px-process-v4-head,
        .px-work-v4-head,
        .px-why-v5-copy,
        .px-strategy-v4-copy
    ) {
    margin-top: 0;
}
body.home :is(.px-process-v4-head, .px-work-v4-head) {
    margin-bottom: var(--shift-section-head-gap);
}
/* Remove legacy vertical offsets on the section wrappers/inner shells. */
body.home
    :is(
        .px-exclusive-v4-inner,
        .px-process-v4-inner,
        .px-work-v4-inner,
        .px-why-v5,
        .px-strategy-v4-inner,
        .px-final-v5-shell
    ) {
    margin-top: 0;
    margin-bottom: 0;
}
body.home .px-final-v5-shell {
    padding-top: var(--shift-section-pad-y);
    padding-bottom: var(--shift-section-pad-y);
    min-height: 0;
}
@media (max-width: 1024px) {
    :root {
        --shift-section-pad-y: 36px;
        --shift-section-head-gap: 24px;
    }
}
@media (max-width: 767px) {
    :root {
        --shift-section-pad-y: 28px;
        --shift-section-head-gap: 20px;
    }
}
@media (max-width: 1350px) {
    .px-announcement-bar {
        overflow-x: auto;
        scrollbar-width: none;
    }
    .px-announcement-bar::-webkit-scrollbar {
        display: none;
    }
    .px-topbar-left {
        flex: 0 0 auto;
    }
    .px-topbar-item {
        padding-left: 14px;
        padding-right: 14px;
    }
    .px-topbar-cta {
        padding-left: 15px;
        padding-right: 15px;
    }
}
@media (max-width: 767px) {
    .px-announcement-bar {
        height: auto;
        min-height: 42px;
        overflow-x: auto;
    }
    .px-topbar-left,
    .px-topbar-right {
        height: 42px;
        flex: 0 0 auto;
    }
    .px-topbar-left {
        padding-left: 12px;
    }
    .px-topbar-item,
    .px-topbar-cta {
        height: 42px;
        min-height: 42px;
        font-size: 10.5px;
    }
    .px-topbar-item {
        padding-left: 12px;
        padding-right: 12px;
    }
    .px-topbar-cta {
        padding-left: 13px;
        padding-right: 13px;
    }
    .px-topbar-icon {
        width: 17px;
        height: 17px;
        flex-basis: 17px;
    }
}

/* Legacy v3.78.3 topbar viewport-fit patch removed in v3.82.9. */


/* Source: evercare-care-hero-v3810.css */
/* TEMAGUE Alpha Vision v3.81.0 — premium care hero. One geometry authority. */
.ec-care-hero,
.ec-care-hero * {
    box-sizing: border-box;
    font-family: "Nunito Sans", sans-serif;
}
body.home .ec-care-hero {
    position: relative;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background: #eef4e9;
    color: #103f3d;
    border: 0;
    border-radius: 0;
}
body.home .ec-care-hero__grid {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
overflow: hidden;
}
@media (min-width: 981px) {
    body.home .ec-care-hero__grid {
        --ec-hero-height: 400px;
        display: grid;
        grid-template-columns: minmax(0, 72%) minmax(330px, 28%);
        height: var(--ec-hero-height);
        min-height: 0;
        max-height: var(--ec-hero-height);
        background: #fff;
    }
    body.home .ec-care-hero__story {
        display: grid;
        grid-template-columns: minmax(390px, 43%) minmax(0, 57%);
        height: 100%;
        min-height: 0;
        margin: 0;
        padding: 0;
        overflow: hidden;
        background: #eef4e9;
    }
    body.home .ec-care-hero__copy {
        position: relative;
        z-index: 2;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        height: 100%;
        min-height: 0;
        margin: 0;
        padding: 34px clamp(28px, 3vw, 58px);
        overflow: hidden;
        background: #eef4e9;
    }
    body.home .ec-care-hero__copy:after {
        content: "";
        position: absolute;
        width: 190px;
        height: 190px;
        left: -95px;
        bottom: -105px;
        border: 1px solid rgba(11, 91, 88, 0.12);
        border-radius: 50%;
        pointer-events: none;
    }
    body.home .ec-care-hero__media {
        position: relative;
        align-self: stretch;
        width: 100%;
        height: 100%;
        min-height: 0;
        margin: 0;
        padding: 0;
        overflow: hidden;
        background: #dfe8db;
        line-height: 0;
    }
    body.home .ec-care-hero__media:after {
        content: "";
        position: absolute;
        inset: 0;
pointer-events: none;
    }
    body.home .ec-care-hero__media img {
        position: absolute;
        inset: 0;
        display: block;
        width: 100%;
        max-width: none;
        height: 100%;
        min-height: 0;
        margin: 0;
        padding: 0;
        border: 0;
        border-radius: 0;
        object-fit: cover;
        object-position: center 42%;
        clip-path: none;
        transform: none;
    }
    body.home .ec-care-hero__aside {
        display: grid;
        grid-template-rows: 120px minmax(0, 1fr);
        height: 100%;
        min-height: 0;
        margin: 0;
        padding: 0;
        overflow: hidden;
        background: #fff;
        border-left: 1px solid #e5ebe2;
    }
    body.home .ec-care-hero__tiles {
        display: grid;
        grid-template-columns: 1fr 1fr;
        height: 120px;
        margin: 0;
        padding: 0;
        border-bottom: 1px solid #e5ebe2;
    }
    body.home .ec-care-hero__tile {
        position: relative;
        height: 120px;
        min-height: 0;
        padding: 19px 20px 17px;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        text-decoration: none;
        overflow: hidden;
        transition:
            transform 0.25s ease,
            filter 0.25s ease;
    }
    body.home .ec-care-hero__tile + .ec-care-hero__tile {
        border-left: 1px solid rgba(7, 63, 61, 0.08);
    }
    body.home .ec-care-hero__guide {
        position: relative;
        height: 100%;
        min-height: 0;
        margin: 0;
        padding: 30px clamp(24px, 2.1vw, 38px);
        background: #fff;
        display: flex;
        flex-direction: column;
        justify-content: center;
        overflow: hidden;
    }
}
body.home .ec-care-hero__eyebrow {
    display: flex;
    align-items: center;
    gap: 13px;
    margin: 0 0 16px;
    color: #657773;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    white-space: nowrap;
}
body.home .ec-care-hero__eyebrow i {
    width: 38px;
    height: 1px;
    background: #9eb4a7;
    display: block;
}
body.home .ec-care-hero h1 {
    margin: 0;
    max-width: 570px;
    font-size: calc(clamp(38px, 3.1vw, 57px) + 2px);
    line-height: 0.96;
    letter-spacing: -0.052em;
    font-weight: 750;
    color: #123f3d;
    text-wrap: balance;
}
body.home .ec-care-hero h1 span,
body.home .ec-care-hero h1 strong {
    display: block;
}
body.home .ec-care-hero h1 strong {
    color: #6ca33d;
    font-weight: 750;
}
body.home .ec-care-hero__copy > p {
    max-width: 430px;
    margin: 17px 0 21px;
    color: #596a66;
    font-size: 16px;
    line-height: 1.55;
    font-weight: 450;
}
body.home .ec-care-hero__primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    min-width: 0;
    min-height: 42px;
    padding: 0 17px 0 20px;
    border: 1px solid #0b5b58;
    border-radius: 999px;
    background: #0b5b58;
    color: #fff;
    text-decoration: none;
    font-size: 14px;
    font-weight: 700;
transition: none;
}
body.home .ec-care-hero__primary b {
    font-size: 20px;
    line-height: 1;
    font-weight: 400;
    color: #d8ee84;
}
.ec-care-hero__primary:hover {
    transform: none;
}
body.home .ec-care-hero__tile--dark {
    background: #0b5b58;
    color: #fff;
}
body.home .ec-care-hero__tile--light {
    background: #eef4e9;
    color: #123f3d;
}
body.home .ec-care-hero__icon {
    font-size: 31px;
    line-height: 1;
    font-weight: 300;
    opacity: 0.9;
}
body.home .ec-care-hero__icon--heart {
    font-size: 39px;
}
body.home .ec-care-hero__tile-row {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 10px;
}
body.home .ec-care-hero__tile-row strong {
    max-width: 120px;
    font-size: 15px;
    line-height: 1.15;
    letter-spacing: -0.015em;
}
body.home .ec-care-hero__tile-row b {
    font-size: 21px;
    font-weight: 400;
    color: #88b85a;
}
body.home .ec-care-hero__guide:after {
    content: "";
    position: absolute;
    right: -90px;
    bottom: -130px;
    width: 285px;
    height: 285px;
    border: 1px solid #e2ebe0;
    border-radius: 50%;
pointer-events: none;
}
body.home .ec-care-hero__guide-label {
    position: relative;
    z-index: 1;
    color: #8c9995;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.19em;
}
body.home .ec-care-hero__guide h2 {
    position: relative;
    z-index: 1;
    margin: 10px 0 22px;
    max-width: 390px;
    color: #173f3e;
    font-size: calc(clamp(20px, 1.45vw, 27px) + 2px);
    line-height: 1.17;
    letter-spacing: -0.035em;
    font-weight: 600;
}
body.home .ec-care-hero__search {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 17px minmax(0, 1fr) 31px;
    align-items: center;
    gap: 10px;
    width: 100%;
    height: 44px;
    margin: 0;
    padding: 0 7px 0 15px;
    border: 1px solid #e2e9df;
    border-radius: 999px;
    background: #fff;
}
body.home .ec-care-hero__search-icon {
    width: 14px;
    height: 14px;
    border: 2px solid #0b5b58;
    border-radius: 50%;
    position: relative;
}
body.home .ec-care-hero__search-icon:after {
    content: "";
    position: absolute;
    width: 6px;
    height: 2px;
    background: #0b5b58;
    right: -5px;
    bottom: -3px;
    transform: rotate(45deg);
    border-radius: 2px;
}
body.home .ec-care-hero__search input[type="search"] {
    width: 100%;
    min-width: 0;
    height: 38px;
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: #344b48;
    font:
        500 11px/1.2 "Nunito Sans",
        sans-serif;
    appearance: none;
    -webkit-appearance: none;
}
body.home .ec-care-hero__search input[type="search"]::placeholder {
    color: #7e8b87;
    opacity: 1;
}
body.home .ec-care-hero__search button {
    display: grid;
    place-items: center;
    width: 31px;
    height: 31px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #eef4e9;
    color: #0b5b58;
    font:
        600 18px/1 "Nunito Sans",
        sans-serif;
    cursor: pointer;
}
body.home header + main,
body.home .wp-site-blocks > header + main {
    margin-block-start: 0;
    margin-top: 0;
    padding-top: 0;
}
body.home main,
body.home .wp-site-blocks,
body.home .entry-content {
    --wp--style--block-gap: 0;
}
@media (max-width: 980px) {
    body.home .ec-care-hero {
        width: 100%;
        max-width: none;
        margin: 0;
    }
    body.home .ec-care-hero__grid {
        display: block;
        height: auto;
        min-height: 0;
        max-height: none;
    }
    body.home .ec-care-hero__story {
        display: grid;
        grid-template-columns: 1fr;
        height: auto;
        min-height: 0;
        background: #eef4e9;
    }
    body.home .ec-care-hero__copy {
        height: auto;
        min-height: 0;
        padding: 42px 30px 34px;
        background: #eef4e9;
    }
    body.home .ec-care-hero__media {
        position: relative;
        height: 304px;
        min-height: 0;
        margin: 0;
        padding: 0;
        overflow: hidden;
    }
    body.home .ec-care-hero__media img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        clip-path: none;
        border-radius: 0;
    }
    body.home .ec-care-hero__aside {
        display: block;
        height: auto;
        min-height: 0;
        border: 0;
        border-top: 1px solid #e5ebe2;
    }
    body.home .ec-care-hero__tiles {
        display: grid;
        grid-template-columns: 1fr 1fr;
        height: 120px;
    }
    body.home .ec-care-hero__tile {
        height: 120px;
        padding: 20px 24px;
    }
    body.home .ec-care-hero__guide {
        height: auto;
        min-height: 176px;
        padding: 30px;
        background: #fff;
    }
}
@media (max-width: 600px) {
    body.home .ec-care-hero__copy {
        padding: 34px 22px 30px;
    }
    body.home .ec-care-hero__eyebrow {
        font-size: 10px;
        margin-bottom: 14px;
    }
    body.home .ec-care-hero h1 {
        font-size: 42px;
        line-height: 0.98;
    }
    body.home .ec-care-hero__copy > p {
        font-size: 15px;
        margin: 15px 0 20px;
    }
    body.home .ec-care-hero__media {
        height: 232px;
    }
    body.home .ec-care-hero__tiles {
        grid-template-columns: 1fr 1fr;
        height: 104px;
    }
    body.home .ec-care-hero__tile {
        height: 104px;
        padding: 17px;
    }
    body.home .ec-care-hero__icon {
        font-size: 26px;
    }
    body.home .ec-care-hero__icon--heart {
        font-size: 33px;
    }
    body.home .ec-care-hero__tile-row strong {
        font-size: 13px;
    }
    body.home .ec-care-hero__guide {
        padding: 28px 22px;
        min-height: 168px;
    }
    body.home .ec-care-hero__guide h2 {
        font-size: 24px;
        margin-bottom: 19px;
    }
}

/* v3.82.0 mobile CTA root state: no movement, frame, focus ring or generated overlay. */
@media (max-width: 980px) {
    body.home .ec-care-hero__primary,
    body.home .ec-care-hero__primary:link,
    body.home .ec-care-hero__primary:visited,
    body.home .ec-care-hero__primary:hover,
    body.home .ec-care-hero__primary:focus,
    body.home .ec-care-hero__primary:focus-visible,
    body.home .ec-care-hero__primary:active {
        transform: none;
        translate: none;
        scale: none;
        animation: none;
        transition: none;
        outline: 0;
        border: 0;
filter: none;
        -webkit-tap-highlight-color: transparent;
    }
    body.home .ec-care-hero__primary::before,
    body.home .ec-care-hero__primary::after {
        content: none;
        display: none;
    }
}
/* v3.82.7 adjacency hardening: the hero owns no top spacer. */
body.home .wp-site-blocks > .evercare-header-template + .ec-care-hero {
    margin-top: 0;
    margin-block-start: 0;
    padding-top: 0;
}

/* EVERCARE v3.84.0 — hero typography +2px from the currently rendered v3.83.9 scale. */
body.home .ec-care-hero__eyebrow { font-size: 13px; }
body.home .ec-care-hero h1 { font-size: calc(clamp(38px, 3.1vw, 57px) + 4px); }
body.home .ec-care-hero__copy > p { font-size: 18px; }
body.home .ec-care-hero__primary { font-size: 16px; }
body.home .ec-care-hero__tile-row strong { font-size: 17px; }
body.home .ec-care-hero__guide-label { font-size: 13px; }
body.home .ec-care-hero__guide h2 { font-size: calc(clamp(20px, 1.45vw, 27px) + 4px); }
body.home .ec-care-hero__search input[type="search"] { font-size: 13px; }
body.home .ec-care-hero__search button { font-size: 20px; }
@media (max-width: 600px) {
  body.home .ec-care-hero__eyebrow { font-size: 12px; }
  body.home .ec-care-hero h1 { font-size: 44px; }
  body.home .ec-care-hero__copy > p { font-size: 17px; }
  body.home .ec-care-hero__primary { font-size: 16px; }
  body.home .ec-care-hero__tile-row strong { font-size: 15px; }
  body.home .ec-care-hero__guide-label { font-size: 13px; }
  body.home .ec-care-hero__guide h2 { font-size: 26px; }
  body.home .ec-care-hero__search input[type="search"] { font-size: 13px; }
}

/* EVERCARE v3.84.1 — explicit two-line hero copy. */
body.home .ec-care-hero__description > span {
  display: block;
}

/* EVERCARE v3.84.2 — exact two-line desktop hero copy.
   Each admin field owns exactly one visual line on desktop. */
@media (min-width: 981px) {
  body.home .ec-care-hero__story {
    grid-template-columns: minmax(0, 55%) minmax(0, 45%);
  }
  body.home .ec-care-hero__copy {
    overflow: visible;
    padding-inline: clamp(28px, 3vw, 58px) 18px;
  }
  body.home .ec-care-hero h1 {
    width: max-content;
    max-width: none;
    font-size: clamp(34px, 2.55vw, 51px);
    line-height: .98;
    text-wrap: nowrap;
  }
  body.home .ec-care-hero h1 > span,
  body.home .ec-care-hero h1 > strong {
    display: block;
    width: max-content;
    max-width: none;
    white-space: nowrap;
    text-wrap: nowrap;
  }
  body.home .ec-care-hero__description {
    width: max-content;
    max-width: none;
  }
  body.home .ec-care-hero__description > span {
    display: block;
    width: max-content;
    max-width: none;
    white-space: nowrap;
    text-wrap: nowrap;
  }
}


/* TEMAGUE Alpha Vision — hero/card split layout */
@media (min-width:981px){
 body.home .ec-care-hero__grid{display:block;height:400px;max-height:400px;width:100%}
 body.home .ec-care-hero__story{display:grid;grid-template-columns:minmax(390px,43%) minmax(0,57%);width:100%;height:400px}
}
body.home .ec-care-hero-cards{display:grid;width:100vw;max-width:none;margin:0;position:relative;left:50%;transform:translateX(-50%);grid-template-columns:1fr 1fr;padding:0;gap:0;overflow:hidden}
body.home .ec-care-hero-cards__left{display:grid;grid-template-columns:1fr 1fr;min-width:0}
body.home .ec-care-hero-cards .ec-care-hero__tile,
body.home .ec-care-hero-cards .ec-care-hero__guide{margin:0;border-radius:0;min-height:230px;height:100%;width:100%}
body.home .ec-care-hero-cards .ec-care-hero__guide{display:flex;flex-direction:column;justify-content:center}
@media (max-width:980px){
 body.home .ec-care-hero-cards{grid-template-columns:1fr}
 body.home .ec-care-hero-cards__left{grid-template-columns:1fr 1fr}
}
@media (max-width:620px){
 body.home .ec-care-hero-cards__left{grid-template-columns:1fr}
}

/* v3.85.24 — compact post-hero card strip.
   Keep the first two cards as one paired row on every viewport; the guide card
   remains a separate full-width row below them on tablet/mobile. */
body.home .ec-care-hero-cards .ec-care-hero__tile,
body.home .ec-care-hero-cards .ec-care-hero__guide{
  min-height:161px;
}
@media (max-width:620px){
  body.home .ec-care-hero-cards__left{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  }
  body.home .ec-care-hero-cards .ec-care-hero__tile,
  body.home .ec-care-hero-cards .ec-care-hero__guide{
    min-height:161px;
  }
}

/* v3.85.25 — card-strip correction.
   Mobile keeps cards 1 + 2 paired side-by-side; card 3 sits below.
   All three cards are ~25% shorter than v3.85.24 and their content is vertically centered. */
body.home .ec-care-hero-cards .ec-care-hero__tile,
body.home .ec-care-hero-cards .ec-care-hero__guide{
  height:121px;
  min-height:121px;
  box-sizing:border-box;
  justify-content:center;
}
body.home .ec-care-hero-cards .ec-care-hero__tile{
  gap:12px;
}
body.home .ec-care-hero-cards__left{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  min-width:0;
}
@media (max-width:980px){
  body.home .ec-care-hero-cards{
    grid-template-columns:1fr;
  }
  body.home .ec-care-hero-cards__left{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  }
}
@media (max-width:620px){
  body.home .ec-care-hero-cards__left{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    width:100%;
  }
  body.home .ec-care-hero-cards .ec-care-hero__tile,
  body.home .ec-care-hero-cards .ec-care-hero__guide{
    height:121px;
    min-height:121px;
  }
  body.home .ec-care-hero-cards .ec-care-hero__tile{
    padding:14px 16px;
  }
  body.home .ec-care-hero-cards .ec-care-hero__guide{
    padding:16px 22px;
  }
}


/* Source: evercare-header-layout-v3833.css */
/* TEMAGUE Alpha Vision v3.83.2 — canonical header + standard dropdown navigation. */
/* TEMAGUE Alpha Vision v3.82.9 — canonical responsive header. One header, no hamburger/drawer. */
.evercare-header-template,
.evercare-header-template > .wp-block-shortcode,
.px-site-header,
.px-announcement-bar,
.px-topbar-shell,
.px-header-shell,
.px-header-boundary {
    box-sizing: border-box;
    margin: 0;
    padding-block: 0;
}
.evercare-header-template {
    display: block;
    width: 100%;
    max-width: none;
    padding: 0;
    line-height: 0;
}
.evercare-header-template > .wp-block-shortcode {
    display: block;
    width: 100%;
    max-width: none;
    padding: 0;
    line-height: 0;
}
.px-site-header {
    position: relative;
    inset: auto;
    display: block;
    width: 100%;
    max-width: none;
    height: auto;
    min-height: 0;
    padding: 0;
    background: #fff;
    border: 0;
transform: none;
    font-family: "Nunito Sans", sans-serif;
    line-height: normal;
}
.px-site-header::before,
.px-site-header::after,
.px-header-shell::before,
.px-header-shell::after,
.px-header-boundary::before,
.px-header-boundary::after,
.px-brand-link::before,
.px-brand-link::after {
    content: none;
    display: none;
}
/* Standard compact top bar; every configured item remains visible. */
.px-announcement-bar {
    position: relative;
    display: block;
    width: 100%;
    max-width: none;
    min-height: 36px;
    padding: 0;
    background: #0b4742;
    border: 0;
overflow: visible;
}
.px-topbar-shell {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    max-width: none;
    min-height: 36px;
    padding: 0 24px;
    gap: 12px;
    color: #fff;
    overflow: visible;
    font-family: "Nunito Sans", sans-serif;
    line-height: 1;
}
.px-topbar-left,
.px-topbar-right {
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 0;
    margin: 0;
    padding: 0;
}
.px-topbar-left {
    flex: 1 1 auto;
}
.px-topbar-right {
    flex: 0 0 auto;
}
.px-topbar-item,
.px-topbar-status {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    margin: 0;
    padding: 0 12px;
    gap: 7px;
    border: 0;
    background: transparent;
    color: #fff;
    font:
        600 10px/1 "Nunito Sans",
        sans-serif;
    text-decoration: none;
    white-space: nowrap;
    transform: none;
    transition: none;
    animation: none;
}
.px-topbar-icon {
    display: grid;
    place-items: center;
    width: 14px;
    height: 14px;
    flex: 0 0 14px;
    color: #d8ef7a;
}
.px-topbar-icon svg {
    display: block;
    width: 14px;
    height: 14px;
    overflow: visible;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.px-topbar-item:first-child .px-topbar-icon svg {
    fill: currentColor;
    stroke: currentColor;
}
.px-topbar-status i {
    display: block;
    width: 7px;
    height: 7px;
    flex: 0 0 7px;
    border-radius: 50%;
    background: #d8ef7a;
}
/* Desktop row: title, CTA, flexible space, menu at right edge. */
.px-header-shell {
    display: block;
    width: 100%;
    max-width: none;
    min-height: 56px;
    padding: 0;
    background: #fff;
}
.px-header-boundary {
    display: grid;
    grid-template-columns: auto auto minmax(20px, 1fr) auto;
    align-items: stretch;
    width: 100%;
    max-width: none;
    min-height: 56px;
    padding: 0;
    background: #fff;
}
.px-brand-link {
    grid-column: 1;
    display: flex;
    align-items: center;
    min-height: 56px;
    margin: 0;
    padding: 0 28px;
    color: #080808;
    text-decoration: none;
    transform: none;
    transition: none;
    animation: none;
}
.px-brand-text {
    display: block;
    color: #080808;
    font:
        700 30px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: -0.035em;
    white-space: nowrap;
    transform: none;
    transition: none;
}
.px-brand-image {
    display: block;
    width: auto;
    max-width: 300px;
    height: auto;
    max-height: 42px;
    transform: none;
    transition: none;
}
.px-header-boundary > .px-sa-header-utility {
    grid-column: 2;
    display: flex;
    align-items: center;
    min-height: 56px;
    margin: 0;
    padding: 0 20px;
}
.px-site-header .sa342-header-call,
.px-site-header .sa342-header-call:hover,
.px-site-header .sa342-header-call:focus,
.px-site-header .sa342-header-call:focus-visible,
.px-site-header .sa342-header-call:active {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: auto;
    min-height: 32px;
    margin: 0;
    padding: 0;
    background: transparent;
    background-image: none;
    border: 0;
    border-radius: 0;
    outline: 0;
color: #111;
    text-decoration: none;
    transform: none;
    translate: none;
    scale: none;
    filter: none;
    transition: none;
    animation: none;
    will-change: auto;
}
.px-site-header .sa342-header-call::before,
.px-site-header .sa342-header-call::after,
.px-site-header .sa342-header-call *::before,
.px-site-header .sa342-header-call *::after {
    content: none;
    display: none;
}
.px-site-header .sa342-header-call * {
    margin: 0;
    transform: none;
    translate: none;
    scale: none;
    transition: none;
    animation: none;
}
.px-site-header .sa342-header-call__icon {
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    color: #111;
}
.px-site-header .sa342-header-call__icon svg {
    display: block;
    width: 16px;
    height: 16px;
    fill: currentColor;
}
.px-site-header .sa342-header-call__copy {
    display: flex;
    flex-direction: column;
    gap: 2px;
    line-height: 1;
}
.px-site-header .sa342-header-call__copy small {
    color: #65706d;
    font:
        600 7px/1 "Nunito Sans",
        sans-serif;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    white-space: nowrap;
}
.px-site-header .sa342-header-call__copy strong {
    color: #111;
    font:
        700 11px/1 "Nunito Sans",
        sans-serif;
    white-space: nowrap;
}










/* Legacy mobile UI is not part of the canonical header. */
.px-mobile-header-actions,
.px-mobile-menu-toggle,
.px-mobile-drawer,
.px-mobile-nav {
    display: none;
}
body.home .wp-site-blocks {
    gap: 0;
    --wp--style--block-gap: 0;
}
body.home .evercare-header-template,
body.home .evercare-header-template + * {
    margin-block: 0;
}
@media (max-width: 980px) {
    .px-topbar-shell {
        min-height: 34px;
        padding: 0 8px;
        gap: 4px;
        flex-wrap: wrap;
        align-content: center;
    }
    .px-topbar-left {
        display: flex;
        flex: 1 1 100%;
        justify-content: space-between;
        order: 1;
    }
    .px-topbar-right {
        display: flex;
        flex: 1 1 100%;
        justify-content: flex-end;
        order: 2;
        border-top: 1px solid rgba(255, 255, 255, 0.12);
    }
    .px-topbar-item,
    .px-topbar-status {
        min-height: 28px;
        padding: 0 5px;
        gap: 4px;
        font-size: 10px;
    }
    .px-topbar-icon,
    .px-topbar-icon svg {
        width: 12px;
        height: 12px;
        flex-basis: 12px;
    }
    .px-announcement-bar {
        min-height: 56px;
    }
    .px-header-shell {
        min-height: 0;
    }
    .px-header-boundary {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-rows: 58px auto;
        align-items: stretch;
        min-height: 0;
        padding: 0;
    }
    .px-brand-link {
        grid-column: 1;
        grid-row: 1;
        min-height: 58px;
        padding: 0 12px;
        min-width: 0;
    }
    .px-brand-text {
        font-size: 24px;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .px-brand-image {
        max-width: 165px;
        max-height: 36px;
    }
    .px-header-boundary > .px-sa-header-utility {
        grid-column: 2;
        grid-row: 1;
        display: flex;
        min-height: 58px;
        padding: 0 12px 0 6px;
        justify-content: flex-end;
    }
    .px-site-header .sa342-header-call {
        gap: 5px;
        min-height: 28px;
    }
    .px-site-header .sa342-header-call__icon {
        width: 19px;
        height: 19px;
        flex-basis: 19px;
    }
    .px-site-header .sa342-header-call__icon svg {
        width: 13px;
        height: 13px;
    }
    .px-site-header .sa342-header-call__copy small {
        display: none;
    }
    .px-site-header .sa342-header-call__copy strong {
        font-size: 10.5px;
    }
    
    
    
    
    
}
@media (max-width: 600px) {
    .px-topbar-copy {
        font-size: 9.5px;
    }
    .px-brand-text {
        font-size: 22px;
    }
    .px-header-boundary > .px-sa-header-utility {
        padding-right: 9px;
    }
    
}

/* v3.82.9 ROOT FIX — no legacy hiding, no header/hero spacer, mobile nav stays in normal flow. */
html body .wp-site-blocks > .wp-block-template-part.evercare-header-template,
html body .wp-site-blocks > .evercare-header-template,
html body .evercare-header-template > .wp-block-shortcode {
    position: relative;
    inset: auto;
    float: none;
    clear: none;
    display: block;
    width: 100%;
    max-width: none;
    height: auto;
    min-height: 0;
    max-height: none;
    margin: 0;
    padding: 0;
    border: 0;
    line-height: 0;
    overflow: visible;
}
html body .evercare-header-template .px-site-header {
    position: relative;
    inset: auto;
    float: none;
    clear: both;
    width: 100%;
    max-width: none;
    height: auto;
    min-height: 0;
    margin: 0;
    padding: 0;
    overflow: visible;
}
html body .px-site-header .px-announcement-bar,
html body .px-site-header .px-topbar-shell,
html body .px-site-header .px-topbar-left,
html body .px-site-header .px-topbar-right {
    overflow: visible;
}
html body .px-site-header .px-topbar-left {
    display: flex;
}
html body .px-site-header .px-topbar-left > .px-topbar-item {
    display: inline-flex;
    visibility: visible;
    opacity: 1;
}
html body .px-site-header .px-topbar-right {
    display: flex;
    margin-left: auto;
}
html body .px-site-header .px-topbar-right > .px-topbar-status {
    display: inline-flex;
    visibility: visible;
    opacity: 1;
}
html body.home .wp-site-blocks > .evercare-header-template + *,
html body.home .wp-site-blocks > .wp-block-template-part.evercare-header-template + *,
html body.home .evercare-header-template + .ec-care-hero {
    clear: both;
    margin-top: 0;
    margin-block-start: 0;
    padding-top: 0;
}
@media (min-width: 981px) {
    html body .px-site-header .px-topbar-shell {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: space-between;
    }
    html body .px-site-header .px-topbar-left {
        flex: 1 1 auto;
        justify-content: flex-start;
        min-width: 0;
    }
    html body .px-site-header .px-topbar-right {
        flex: 0 0 auto;
        justify-content: flex-end;
    }
}
@media (max-width: 980px) {
    html body .px-site-header .px-announcement-bar {
        height: auto;
        min-height: 0;
        max-height: none;
    }
    html body .px-site-header .px-topbar-shell {
        display: grid;
        grid-template-columns: 1fr;
        height: auto;
        min-height: 0;
        max-height: none;
        padding: 0 8px;
    }
    html body .px-site-header .px-topbar-left {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        width: 100%;
        height: auto;
        min-height: 30px;
    }
    html body .px-site-header .px-topbar-left > .px-topbar-item {
        display: flex;
        min-width: 0;
        padding: 0 5px;
        justify-content: center;
    }
    html body .px-site-header .px-topbar-left .px-topbar-copy {
        display: block;
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    html body .px-site-header .px-topbar-right {
        display: flex;
        width: 100%;
        height: 28px;
        justify-content: flex-end;
        border-top: 1px solid rgba(255, 255, 255, 0.12);
    }
    html body .px-site-header .px-header-shell,
    html body .px-site-header .px-header-boundary {
        height: auto;
        min-height: 0;
        max-height: none;
        overflow: visible;
    }
    
    
    
    
    html body .signature-client-01-footer-part,
    html body .tm-footer-wrapper {
        position: relative;
        z-index: 0;
        clear: both;
    }
}

/* Header-to-content must have no generated spacer. */

body.home .evercare-header-template + *,
body.home .wp-site-blocks > .evercare-header-template + *,
body.home .wp-site-blocks > .wp-block-template-part.evercare-header-template + *,
body.home .ec-care-hero {
    margin-top: 0;
    padding-top: 0;
}

/* Parent indicator: small standard chevron, no decorative badge. */



/* DESKTOP — conventional vertical dropdown. */
@media (min-width: 981px) {
    
    
    
    
    
    
    
    
    
    
    
}

/* MOBILE — same menu, submenus closed by default and opened only by click. */
@media (max-width: 980px) {
    
    
    
    
    
    
    
    
    
    
    
    
    
}

/* v3.83.1 ROOT GAP FIX
   WordPress flow layout can generate margin-block-start between top-level blocks.
   Kill only the homepage root-flow gap, plus any stale empty Spacer/Group saved in a DB-customized template. */
body.home .wp-site-blocks {
    gap: 0;
    row-gap: 0;
    --wp--style--block-gap: 0;
}
body.home .wp-site-blocks > * {
    margin-block-start: 0;
    margin-block-end: 0;
}
body.home .wp-site-blocks > * + * {
    margin-block-start: 0;
}
body.home .wp-site-blocks > .wp-block-spacer:has(+ .ec-care-hero),
body.home .wp-site-blocks > .wp-block-group:empty:has(+ .ec-care-hero),
body.home .wp-site-blocks > p:empty:has(+ .ec-care-hero) {
    display: none;
    height: 0;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

body.home .ec-care-hero {
    margin-top: 0;
    padding-top: 0;
}

/* v3.83.2 — STRUCTURAL HEADER/HERO JOIN.
   Header and hero now share one zero-gap stack in the file template. These rules also
   cover database-customized templates that still render them as separate root blocks. */
html body.home,
html body.home .wp-site-blocks {
    margin: 0;
    padding-top: 0;
    padding-bottom: 0;
}
html body.home .wp-site-blocks {
    display: block;
    row-gap: 0;
    gap: 0;
    --wp--style--block-gap: 0px;
}
html body.home .wp-site-blocks > * {
    margin-block-start: 0;
    margin-block-end: 0;
}
html body.home .ec-header-hero-stack {
    display: block;
    width: 100%;
    max-width: none;
    height: auto;
    min-height: 0;
    margin: 0;
    padding: 0;
    gap: 0;
    row-gap: 0;
    line-height: 0;
    background: transparent;
    overflow: visible;
}
html body.home .ec-header-hero-stack > *,
html body.home .ec-header-hero-stack > .wp-block-template-part,
html body.home .ec-header-hero-stack > .evercare-header-template,
html body.home .ec-header-hero-stack > .ec-care-hero {
    margin: 0;
    margin-block: 0;
}
html body.home .ec-header-hero-stack > .wp-block-template-part,
html body.home .ec-header-hero-stack > .evercare-header-template {
    padding: 0;
    height: auto;
    min-height: 0;
    line-height: 0;
}
html body.home .ec-header-hero-stack > .ec-care-hero,
html body.home .evercare-header-template + .ec-care-hero,
html body.home .wp-block-template-part.evercare-header-template + .ec-care-hero {
    display: block;
    position: relative;
    top: auto;
    clear: none;
    margin-top: 0;
    margin-block-start: 0;
    padding-top: 0;
    vertical-align: top;
}
/* Never let an empty legacy block between the canonical header and hero occupy height. */
html body.home .evercare-header-template + :is(.wp-block-spacer, .wp-block-group:empty, p:empty),
html
    body.home
    .wp-block-template-part.evercare-header-template
    + :is(.wp-block-spacer, .wp-block-group:empty, p:empty) {
    display: none;
    height: 0;
    min-height: 0;
    max-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
}
@media (max-width: 980px) {
    
}

/* v3.83.3 — HEADER/HERO STRUCTURAL JOIN, NO PHANTOM WRAPPER BOXES.
   On the homepage the template-part and shortcode wrappers must not generate their own
   layout boxes. Only the real .px-site-header and .ec-care-hero participate in flow. */
body.home .wp-site-blocks {
    display: block;
    margin: 0;
    padding: 0;
    gap: 0;
    row-gap: 0;
    --wp--style--block-gap: 0px;
}
body.home .wp-site-blocks > .evercare-header-template,
body.home .evercare-header-template > .wp-block-shortcode {
    display: contents;
    margin: 0;
    padding: 0;
    border: 0;
    height: 0;
    min-height: 0;
    max-height: 0;
    line-height: 0;
}
body.home .wp-site-blocks > .px-site-header,
body.home .evercare-header-template .px-site-header {
    display: block;
    position: relative;
    width: 100%;
    max-width: none;
    height: auto;
    min-height: 0;
    margin: 0;
    padding: 0;
    clear: none;
    float: none;
}
body.home .wp-site-blocks > .ec-care-hero,
body.home .px-site-header + .ec-care-hero {
    display: block;
    position: relative;
    width: 100%;
    max-width: none;
    margin: 0;
    margin-block: 0;
    padding: 0;
    clear: none;
    float: none;
}
body.home .wp-site-blocks > .px-site-header + .ec-care-hero {
    margin-top: 0;
}
/* No legacy spacer/group is allowed to sit between the canonical header and hero. */
body.home .wp-site-blocks > .wp-block-spacer:first-of-type,
body.home .wp-site-blocks > .wp-block-group:empty {
    margin: 0;
    padding: 0;
    min-height: 0;
}

/* v3.83.6 — SOURCE GEOMETRY FIX.
   Legacy main.css still assigns fixed heights (desktop 72px / mobile 60px) to
   .px-header-shell. The visible canonical header rows are content-driven, so that
   fixed shell height creates the white strip after the menu. Keep every header
   wrapper content-sized. Do not move the hero with negative margins. */
html body .px-site-header,
html body .px-header-shell,
html body .px-header-boundary {
    height: auto;
    max-height: none;
    margin-bottom: 0;
    padding-bottom: 0;
}
html body .px-announcement-bar,
html body .px-topbar-shell {
    height: auto;
    max-height: none;
    margin: 0;
}
@media (min-width: 981px) {
    html body .px-header-shell,
    html body .px-header-boundary {
        min-height: 56px;
    }
    html body .px-announcement-bar,
    html body .px-topbar-shell {
        min-height: 36px;
    }
}
@media (max-width: 980px) {
    html body .px-header-shell,
    html body .px-header-boundary {
        height: auto;
        min-height: 0;
        max-height: none;
        overflow: visible;
    }
    html body .px-announcement-bar,
    html body .px-topbar-shell {
        height: auto;
        min-height: 0;
        max-height: none;
    }
}
/* The real hero follows the header in document flow with no reserved offset. */
html body.home .px-site-header + .ec-care-hero,
html body.home .evercare-header-template + .ec-care-hero,
html body.home .wp-block-template-part.evercare-header-template + .ec-care-hero {
    margin-top: 0;
    padding-top: 0;
}

/* v3.83.7 — HOMEPAGE HEADER/HERO DIRECT-FLOW FIX.
   The homepage now renders the header as a dynamic block, not through
   template-part -> shortcode wrappers. The two real elements are consecutive
   siblings, so neither WordPress wrapper nor shortcode line box can create a
   phantom white row between them. */
body.home .wp-site-blocks > .px-site-header,
body.home .wp-site-blocks > .ec-care-hero {
    margin: 0;
    margin-block: 0;
    padding-top: 0;
    padding-bottom: 0;
}
body.home .wp-site-blocks > .px-site-header + .ec-care-hero {
    margin-top: 0;
    margin-block-start: 0;
    padding-top: 0;
}
body.home .px-site-header {
    height: auto;
    min-height: 0;
    max-height: none;
    line-height: normal;
}
body.home .px-site-header > :last-child,
body.home .px-header-shell > :last-child,
body.home .px-header-boundary > :last-child {
    margin-bottom: 0;
}

/* EVERCARE v3.83.8 — premium editorial primary navigation.
   Visual-only refinement: does not alter the proven header/hero flow geometry. */
@media (min-width: 981px) {
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
}

@media (max-width: 980px) {
    
}

/* EVERCARE v3.84.0 — canonical typography scale.
   Audit found the previous +2px pass did not reach every active header selector.
   This final authority intentionally adds another 2px to the currently rendered
   Top Bar/Header typography without changing header geometry. */
.px-site-header .px-topbar-item,
.px-site-header .px-topbar-status { font-size: 12px; }
.px-site-header .px-brand-text { font-size: 32px; }
.px-site-header .sa342-header-call__copy small { font-size: 9px; }
.px-site-header .sa342-header-call__copy strong { font-size: 13px; }
@media (min-width: 981px) {
  
  
}
@media (max-width: 980px) {
  .px-site-header .px-topbar-item,
  .px-site-header .px-topbar-status,
  .px-site-header .px-topbar-copy { font-size: 12px; }
  .px-site-header .px-brand-text { font-size: 26px; }
  .px-site-header .sa342-header-call__copy small { font-size: 9px; }
  .px-site-header .sa342-header-call__copy strong { font-size: 12.5px; }
  
  
}

/* EVERCARE v3.84.1 — header geometry stability + mobile brand clipping fix. */
@media (max-width: 980px) {
  .px-site-header .px-brand-link,
  .px-site-header .px-brand-text {
    overflow: visible;
  }
  .px-site-header .px-brand-text {
    line-height: 1.16;
    padding-block: 3px 4px;
    text-overflow: clip;
  }
}
@media (min-width: 981px) {
  
  
  
}

/* EVERCARE v3.84.2 — desktop primary-nav geometry lock.
   Hover may change colour only; it must never change the menu box geometry. */
@media (min-width: 981px) {
  
  
  
}


/* Source: evercare-v3845-static-top-header-hero.css */
/* TEMAGUE Alpha Vision v3.84.5 — static Top Bar/Header/Hero authority.
   No motion/animation in these regions; hero story is image-only background. */

/* Motion-free authority: desktop + mobile. */
body .px-announcement-bar,
body .px-announcement-bar *,
body .px-site-header,
body .px-site-header *,
body.home .ec-care-hero,
body.home .ec-care-hero * {
    animation: none;
    animation-name: none;
    transition: none;
    scroll-behavior: auto;
    will-change: auto;
}

/* Header/navigation must never move on hover/focus. */


@media (min-width: 981px) {
    
    
    
    
}

/* Stable submenu indicators: glyphs, never rotated CSS borders. */



/* Hero story: photograph occupies the ENTIRE left story panel. No green copy panel,
   no peel/mask/decorative layer. */
body.home .ec-care-hero__story {
    position: relative;
    isolation: isolate;
    display: block;
    overflow: hidden;
    background: #111;
}
body.home .ec-care-hero__media {
    position: absolute;
    z-index: 0;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    min-height: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background: transparent;
    clip-path: none;
    border-radius: 0;
    transform: none;
}
body.home .ec-care-hero__media img {
    position: absolute;
    z-index: 0;
    inset: 0;
    display: block;
    width: 100%;
    max-width: none;
    height: 100%;
    min-height: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    object-fit: fill;
    object-position: center center;
    clip-path: none;
    filter: none;
    transform: none;
}
body.home .ec-care-hero__copy {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: none;
    height: 100%;
    margin: 0;
    background: transparent;
    background-color: transparent;
    background-image: none;
    overflow: visible;
}
body.home .ec-care-hero__story::before,
body.home .ec-care-hero__story::after,
body.home .ec-care-hero__media::before,
body.home .ec-care-hero__media::after,
body.home .ec-care-hero__copy::before,
body.home .ec-care-hero__copy::after {
    content: none;
    display: none;
}
body.home .ec-care-hero__copy h1,
body.home .ec-care-hero__copy .ec-care-hero__description,
body.home .ec-care-hero__eyebrow {
    color: #fff;
}
body.home .ec-care-hero__copy h1 strong { color: #c8e84a; }

@media (min-width: 981px) {
    body.home .ec-care-hero__story { height: 100%; }
    body.home .ec-care-hero__copy {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        padding: 34px clamp(28px, 3vw, 58px);
    }
}
@media (max-width: 980px) {
    body.home .ec-care-hero__story { min-height: 430px; }
    body.home .ec-care-hero__copy {
        min-height: 430px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
    }
}


/* Source: evercare-navigation-v3848.css */
/* TEMAGUE Alpha Vision v3.84.8 — canonical static navigation.
   Root fix: stable viewport geometry, one desktop nav geometry, visible static dropdowns. */
html { scrollbar-gutter: stable; }

@media (min-width:981px){
  
  html body .px-site-header { position:relative; z-index:10000; }
  html body .px-site-header .px-header-shell { position:relative; z-index:2; }
  html body .px-site-header .px-header-boundary {
    position:relative; z-index:2;
    display:flex; align-items:stretch;
    width:100%; min-width:0;
    margin:0; padding:0; gap:0;
  }
  html body .px-site-header .px-brand-link,
  html body .px-site-header .px-header-boundary > .px-sa-header-utility {
    flex:0 0 auto;
  }
  
  
  
  
  /* Parent marker is a normal glyph; it never rotates or changes dimensions. */
  
  /* Dropdown: hidden without transforms, then displayed in-place on hover/focus. */
  
  
  
  
  
  
  
  
}

/* Keep the same desktop geometry on narrower desktop widths; only reduce padding once,
   consistently on every template. */
@media (min-width:981px) and (max-width:1180px){
  
}


/* Source: evercare-header-cta-v3849.css */
/* TEMAGUE Alpha Vision v3.84.9 — canonical header CTA geometry.
   Purpose: identical CTA footprint on Home, Page and Single templates, with plain text rendering. */

/* Plain CTA typography on every viewport/state. */
html body .px-site-header .sa342-header-call,
html body .px-site-header .sa342-header-call:hover,
html body .px-site-header .sa342-header-call:focus,
html body .px-site-header .sa342-header-call:focus-visible,
html body .px-site-header .sa342-header-call:active,
html body .px-site-header .sa342-header-call *,
html body .px-site-header .sa342-header-call:hover *,
html body .px-site-header .sa342-header-call:focus-visible * {
-webkit-text-stroke:0;
  text-stroke:0;
  filter:none;
}
html body .px-site-header .sa342-header-call::before,
html body .px-site-header .sa342-header-call::after,
html body .px-site-header .sa342-header-call *::before,
html body .px-site-header .sa342-header-call *::after {
  content:none;
  display:none;
}

/* Desktop: reserve one invariant utility column. Its size never depends on template content. */
@media (min-width:981px) {
  html body .px-site-header .px-header-boundary > .px-sa-header-utility {
    box-sizing:border-box;
    flex:0 0 190px;
    width:190px;
    min-width:190px;
    max-width:190px;
    height:56px;
    min-height:56px;
    max-height:56px;
    margin:0;
    padding:0 20px;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    transform:none;
    translate:none;
    scale:none;
    transition:none;
    animation:none;
  }
  html body .px-site-header .px-header-boundary > .px-sa-header-utility .sa342-header-call,
  html body .px-site-header .px-header-boundary > .px-sa-header-utility .sa342-header-call:hover,
  html body .px-site-header .px-header-boundary > .px-sa-header-utility .sa342-header-call:focus,
  html body .px-site-header .px-header-boundary > .px-sa-header-utility .sa342-header-call:focus-visible,
  html body .px-site-header .px-header-boundary > .px-sa-header-utility .sa342-header-call:active {
    box-sizing:border-box;
    display:flex;
    flex:0 0 150px;
    width:150px;
    min-width:150px;
    max-width:150px;
    height:32px;
    min-height:32px;
    max-height:32px;
    margin:0;
    padding:0;
    gap:8px;
    align-items:center;
    justify-content:flex-start;
    overflow:visible;
    border:0;
    outline:0;
    background:transparent;
    background-image:none;
    transform:none;
    translate:none;
    scale:none;
    rotate:none;
    transition:none;
    animation:none;
    will-change:auto;
  }
}


/* Source: evercare-header-geometry-v3850.css */
/* TEMAGUE Alpha Vision v3.85.0 — canonical desktop header geometry.
   One invariant grid is used by Home, Page and Single templates.
   This resolves the historical conflict where navigation CSS changed the
   header boundary from grid to flex and allowed Brand/CTA positions to drift. */
@media (min-width:981px) {
  html body .px-site-header .px-header-shell {
    box-sizing:border-box;
    display:block;
    width:100%;
    max-width:none;
    margin:0;
    padding:0;
  }

  html body .px-site-header .px-header-boundary {
    box-sizing:border-box;
    position:relative;
    display:grid;
    grid-template-columns:max-content 190px minmax(20px,1fr) max-content;
    grid-template-rows:56px;
    align-items:stretch;
    width:100%;
    max-width:none;
    min-width:0;
    height:56px;
    min-height:56px;
    margin:0;
    padding:0;
    gap:0;
    overflow:visible;
  }

  html body .px-site-header .px-header-boundary > .px-brand-link {
    grid-column:1;
    grid-row:1;
    box-sizing:border-box;
    align-self:stretch;
    width:max-content;
    min-width:0;
    height:56px;
    min-height:56px;
    margin:0;
    padding:0 28px;
    flex:none;
    transform:none;
    translate:none;
    scale:none;
    transition:none;
    animation:none;
  }

  html body .px-site-header .px-header-boundary > .px-sa-header-utility {
    grid-column:2;
    grid-row:1;
    box-sizing:border-box;
    align-self:stretch;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    width:190px;
    min-width:190px;
    max-width:190px;
    height:56px;
    min-height:56px;
    max-height:56px;
    margin:0;
    padding:0 20px;
    flex:none;
    transform:none;
    translate:none;
    scale:none;
    transition:none;
    animation:none;
  }

  

  /* The spacer is a real grid track, not a flexible margin on the nav. */
  

  /* CTA rendering is identical on every template and state. */
  html body .px-site-header .px-sa-header-utility .sa342-header-call,
  html body .px-site-header .px-sa-header-utility .sa342-header-call:hover,
  html body .px-site-header .px-sa-header-utility .sa342-header-call:focus,
  html body .px-site-header .px-sa-header-utility .sa342-header-call:focus-visible,
  html body .px-site-header .px-sa-header-utility .sa342-header-call:active {
    box-sizing:border-box;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    flex:none;
    width:150px;
    min-width:150px;
    max-width:150px;
    height:32px;
    min-height:32px;
    max-height:32px;
    margin:0;
    padding:0;
    gap:8px;
    border:0;
    outline:0;
    background:transparent;
filter:none;
-webkit-text-stroke:0;
    transform:none;
    translate:none;
    scale:none;
    transition:none;
    animation:none;
  }
}


/* Source: evercare-desktop-scale-v3852.css */
/* TEMAGUE Alpha Vision v3.85.2 — desktop-only 120% scale authority.
   Scope: Top Bar, Header and Hero. Mobile/tablet geometry is intentionally untouched. */
@media (min-width:981px) {
  /* Top Bar: 36px -> 43.2px (+20%). */
  html body .px-site-header .px-topbar-shell,
  html body .px-site-header .px-topbar-boundary {
    height:43.2px;
    min-height:43.2px;
  }
  html body .px-site-header .px-topbar-item,
  html body .px-site-header .px-topbar-status,
  html body .px-site-header .px-topbar-copy { font-size:14.4px; }

  /* Header: 56px -> 67.2px (+20%). Keep the canonical grid from v3.85.0. */
  html body .px-site-header .px-header-boundary {
    grid-template-rows:67.2px;
    height:67.2px;
    min-height:67.2px;
  }
  
  html body .px-site-header .px-header-boundary>.px-sa-header-utility { max-height:67.2px; }
  html body .px-site-header .px-brand-text { font-size:38.4px; }
  html body .px-site-header .sa342-header-call__copy small { font-size:10.8px; }
  html body .px-site-header .sa342-header-call__copy strong { font-size:15.6px; }
  
  
  

  /* Hero: canonical desktop height 400px -> 480px (+20%). */
  body.home .ec-care-hero__grid { --ec-hero-height:480px; height:480px; min-height:480px; }
  body.home .ec-care-hero__story,
  body.home .ec-care-hero__aside { height:480px; min-height:480px; }

  /* Hero typography: exact 120% desktop scale. */
  body.home .ec-care-hero__eyebrow { font-size:15.6px; }
  body.home .ec-care-hero h1 { font-size:clamp(40.8px,3.06vw,61.2px); }
  body.home .ec-care-hero__copy>p,
  body.home .ec-care-hero__description { font-size:21.6px; }
  body.home .ec-care-hero__primary { font-size:19.2px; }
  body.home .ec-care-hero__tile-row strong { font-size:20.4px; }
  body.home .ec-care-hero__guide-label { font-size:15.6px; }
  body.home .ec-care-hero__guide h2 { font-size:clamp(28.8px,1.74vw,37.2px); }
  body.home .ec-care-hero__search input[type="search"] { font-size:15.6px; }
  body.home .ec-care-hero__search button { font-size:24px; }
}


/* Source: evercare-hero-slideshow-v3853.css */
/* EVERCARE v3.85.4 — reliable proportional five-image hero slideshow */
body.home .ec-care-hero__eyebrow,
body.home .ec-care-hero__description{display:none;}
body.home .ec-care-hero__media{position:absolute;inset:0;overflow:hidden;margin:0;display:block;}
body.home .ec-care-hero__media .ec-care-hero__slide{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center center;opacity:0;visibility:hidden;z-index:0;transform:none;transition:opacity .8s ease;}
body.home .ec-care-hero__media .ec-care-hero__slide.is-active{opacity:1;visibility:visible;z-index:1;}
@media (prefers-reduced-motion:reduce){body.home .ec-care-hero__media .ec-care-hero__slide{transition:none;}}


/* Source: evercare-desktop-refine-v3855.css */
/* TEMAGUE Alpha Vision v3.85.5 — desktop-only typography refinement.
   Keeps v3.85.2 geometry intact; adjusts only requested desktop text sizes and hero copy spacing. */
@media (min-width:981px) {
  /* Primary + dropdown navigation: 20% smaller than v3.85.2 desktop scale (17.4px -> 13.92px). */
  

  /* Hero guide copy: exact 20% reduction from the current desktop values. */
  body.home .ec-care-hero__guide-label { font-size:12.48px; }
  body.home .ec-care-hero__guide h2 { font-size:clamp(23.04px,1.392vw,29.76px); }

  /* Description was removed in v3.85.3, so restore a deliberate headline-to-CTA rhythm. */
  body.home .ec-care-hero__copy h1 { margin:0 0 30px; }
}


/* Source: evercare-hero-cards-v3857.css */
/* TEMAGUE Alpha Vision v3.85.7 — correct desktop top-card height geometry.
   The two coloured cards gain 30% height from the established 180px desktop row.
   The guide row absorbs that added height; its content remains visually anchored. */
@media (min-width:981px) {
  body.home .ec-care-hero__aside {
    grid-template-rows:234px minmax(0,1fr);
  }
  body.home .ec-care-hero__tiles {
    height:234px;
    min-height:234px;
  }
  body.home .ec-care-hero__tile {
    height:234px;
    min-height:234px;
    padding:28px 22px 24px;
  }

  /* Preserve the guide/search content's visual vertical position while its white row becomes shorter. */
  body.home .ec-care-hero__guide {
    padding-top:30px;
    padding-bottom:84px;
  }

  /* Keep the larger dimensional icon treatment from v3.85.6. */
  body.home .ec-care-hero__tile .ec-care-hero__icon {
    width:45px;
    height:45px;
    min-width:45px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:14px;
    font-size:22px;
    line-height:1;
    transform:none;
    transition:none;
    animation:none;
box-sizing:border-box;
  }
  body.home .ec-care-hero__tile--dark .ec-care-hero__icon {
    color:#d9ff63;
    background:linear-gradient(145deg,rgba(255,255,255,.16),rgba(255,255,255,.035));
    border:1px solid rgba(255,255,255,.22);
}
  body.home .ec-care-hero__tile--light .ec-care-hero__icon {
    color:#063f3d;
    background:linear-gradient(145deg,#fff,#e8f0e8);
    border:1px solid rgba(6,63,61,.14);
}
  body.home .ec-care-hero__tile .ec-care-hero__icon i {
    display:block;
    font-size:22px;
    line-height:1;
    transform:none;
  }
}


/* Source: evercare-hero-refine-v3858.css */
/* TEMAGUE Alpha Vision v3.85.10 — guide typography + non-cross 3D support icon refinement. */
@media (min-width:981px) {
  /* True vector dimensional icons: no icon-font dependency, no motion. */
  body.home .ec-care-hero__tile .ec-care-hero__icon {
    width:54px; height:54px; min-width:54px;
    border-radius:17px; padding:9px; overflow:visible;
    transform:none; transition:none; animation:none;
  }
  body.home .ec-care-hero__tile .ec-care-hero__icon svg {
    display:block; width:100%; height:100%; overflow:visible;
    transform:none; filter:drop-shadow(0 3px 2px rgba(0,0,0,.18));
  }
  body.home .ec-care-hero__tile .ec-care-hero__icon .ec-icon-shadow { fill:rgba(0,0,0,.22); transform:translateY(2px); }
  body.home .ec-care-hero__tile .ec-care-hero__icon .ec-icon-highlight { fill:none; stroke:rgba(255,255,255,.72); stroke-width:2; stroke-linecap:round; }
  body.home .ec-care-hero__tile--dark .ec-care-hero__icon {
    background:linear-gradient(145deg,#17746d 0%,#0b5d58 58%,#064944 100%);
    border:1px solid rgba(255,255,255,.25);
}
  body.home .ec-care-hero__tile--light .ec-care-hero__icon {
    background:linear-gradient(145deg,#fff 0%,#eef5ef 55%,#dce9df 100%);
    border:1px solid rgba(6,63,61,.12);
}
  /* Requested reductions from the current v3.85.7 desktop values. */
  body.home .ec-care-hero__guide-label { font-size:8.9856px; } /* additional -20% */
  body.home .ec-care-hero__guide h2 { font-size:clamp(16.5888px,1.00224vw,21.4272px); } /* additional -20% */
  body.home .ec-care-hero__search input[type="search"],
  body.home .ec-care-hero__search input[type="search"]::placeholder { font-size:6.24px; line-height:1.25; } /* -50% from v3.85.9 */
}


/* v3.85.10 — clean search action icon. */
@media (min-width:981px) {
  body.home .ec-care-hero__search button {
    display:flex; align-items:center; justify-content:center;
    transform:none; transition:none; animation:none;
  }
  body.home .ec-care-hero__search-arrow {
    width:22px; height:22px; display:block;
    fill:none; stroke:currentColor; stroke-width:1.8;
    stroke-linecap:round; stroke-linejoin:round;
    transform:none; transition:none; animation:none;
  }
}


/* Source: evercare-type-tune-v38511.css */
/* TEMAGUE Alpha Vision v3.85.11 — requested desktop typography tuning only. */
@media (min-width:981px) {
  /* Top bar: 14.4px -> 13.4px (-1px). */
  html body .px-site-header .px-topbar-item,
  html body .px-site-header .px-topbar-status,
  html body .px-site-header .px-topbar-copy {
    font-size:13.4px;
  }

  /* Hero guide heading: +2px from v3.85.10. */
  body.home .ec-care-hero__guide h2 {
    font-size:clamp(18.5888px, calc(1.00224vw + 2px), 23.4272px);
  }

  /* Search input and placeholder: 6.24px -> 9.24px (+3px). */
  body.home .ec-care-hero__search input[type="search"],
  body.home .ec-care-hero__search input[type="search"]::placeholder {
    font-size:9.24px;
    line-height:1.25;
  }
}


/* Source: evercare-hero-mobile-v38513.css */
/* TEMAGUE Alpha Vision v3.85.13 — mobile Hero authority.
   Fixes SVG intrinsic sizing and normalises Hero typography/controls only on <=980px. */
@media (max-width:980px) {
  body.home .ec-care-hero,
  body.home .ec-care-hero * { box-sizing:border-box; }

  body.home .ec-care-hero__tile .ec-care-hero__icon {
    width:38px; height:38px; min-width:38px;
    padding:6px; border-radius:12px;
    display:inline-flex; align-items:center; justify-content:center;
    overflow:visible; line-height:1;
  }
  body.home .ec-care-hero__tile .ec-care-hero__icon svg {
    display:block; width:26px; height:26px;
    max-width:26px; max-height:26px; overflow:visible;
  }
  body.home .ec-care-hero__tile--dark .ec-care-hero__icon {
    background:linear-gradient(145deg,#17746d,#064944);
    border:1px solid rgba(255,255,255,.22);
}
  body.home .ec-care-hero__tile--light .ec-care-hero__icon {
    background:linear-gradient(145deg,#fff,#dce9df);
    border:1px solid rgba(6,63,61,.12);
}
  body.home .ec-care-hero__tile .ec-icon-shadow { fill:rgba(0,0,0,.20); }
  body.home .ec-care-hero__tile .ec-icon-highlight { fill:none; stroke:rgba(255,255,255,.72); stroke-width:2; stroke-linecap:round; }

  body.home .ec-care-hero h1 { font-size:clamp(32px,9vw,42px); line-height:1.02; }
  body.home .ec-care-hero h1 span,
  body.home .ec-care-hero h1 strong { display:block; }
  body.home .ec-care-hero__primary { display:inline-flex; font-size:14px; line-height:1.2; }
  body.home .ec-care-hero__tile-row strong { font-size:13px; line-height:1.15; }
  body.home .ec-care-hero__guide-label { font-size:9px; line-height:1.2; }
  body.home .ec-care-hero__guide h2 { font-size:21px; line-height:1.18; }
  body.home .ec-care-hero__search input[type="search"],
  body.home .ec-care-hero__search input[type="search"]::placeholder { font-size:11px; line-height:1.25; }
  body.home .ec-care-hero__search-arrow { width:18px; height:18px; display:block; fill:none; stroke:currentColor; stroke-width:1.8; }
}
@media (max-width:600px) {
  body.home .ec-care-hero__tile .ec-care-hero__icon {
    width:34px; height:34px; min-width:34px; padding:5px;
  }
  body.home .ec-care-hero__tile .ec-care-hero__icon svg {
    width:24px; height:24px; max-width:24px; max-height:24px;
  }
  body.home .ec-care-hero__guide h2 { font-size:20px; }
}


/* Source: evercare-hero-polish-v38514.css */
/* TEMAGUE Alpha Vision v3.85.14 — Hero polish.
   1) Desktop story/aside meet edge-to-edge (no white seam).
   2) Headline gains a restrained contrast outline for mixed slideshow imagery.
   3) Mobile headline-to-CTA spacing is explicit and comfortable. */
@media (min-width:981px) {
  body.home .ec-care-hero__grid { column-gap:0; gap:0; }
  body.home .ec-care-hero__story { margin-right:0; border-right:0; }
  body.home .ec-care-hero__aside { margin-left:0; border-left:0; }
}

/* Multi-directional shadow behaves as a soft 1px outline without changing glyph geometry. */
body.home .ec-care-hero__copy h1,
body.home .ec-care-hero__copy h1 span,
body.home .ec-care-hero__copy h1 strong {
}

@media (max-width:980px) {
  body.home .ec-care-hero__copy h1 { margin-bottom:36px; }
  body.home .ec-care-hero__primary { margin-top:0; }
}


/* TEMAGUE Alpha Vision v3.85.15 — assertive 3D controls, zero positional motion. */

/* Shared rule: depth is visual only. Interactive controls never move. */
html body .px-site-header .sa342-header-call,
body.home .ec-care-hero__primary,
body.home .ec-care-hero__tile,
body.home .ec-care-hero__search,
body.home .ec-care-hero__tile-row > b {
  transform:none;
  translate:none;
  scale:1;
  rotate:none;
  transition:none;
  animation:none;
  will-change:auto;
}

/* Header CTA — firm raised control on desktop. */
@media (min-width:981px) {
  html body .px-site-header .px-sa-header-utility .sa342-header-call {
    height:40px;
    min-height:40px;
    max-height:40px;
    padding:0 12px;
    border:1px solid #0b4f49;
    border-radius:9px;
    background:linear-gradient(180deg,#ffffff 0%,#f2f7f5 100%);
}
  html body .px-site-header .px-sa-header-utility .sa342-header-call__icon {
    border-radius:7px;
    background:linear-gradient(145deg,#dfff6b,#a9d936);
}
}

/* Hero primary CTA — assertive but professional depth. */
body.home .ec-care-hero__primary {
  border:1px solid #6f971a;
  border-radius:10px;
  background:linear-gradient(180deg,#dfff72 0%,#b8e53e 58%,#a5d22f 100%);
}
body.home .ec-care-hero__primary:hover,
body.home .ec-care-hero__primary:focus,
body.home .ec-care-hero__primary:active { transform:none; translate:none;  }

/* Support tiles — make the complete card read as a raised 3D surface. */
body.home .ec-care-hero__tile--dark {
  border:1px solid rgba(0,0,0,.30);
}
body.home .ec-care-hero__tile--light {
  border:1px solid rgba(96,126,28,.34);
}
body.home .ec-care-hero__tile:hover,
body.home .ec-care-hero__tile:focus,
body.home .ec-care-hero__tile:active { transform:none; translate:none; }
body.home .ec-care-hero__tile-row > b {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:30px;
  height:30px;
  flex:0 0 30px;
  border-radius:50%;
  font-size:17px;
  line-height:1;
  font-weight:700;
  border:1px solid rgba(0,0,0,.18);
  background:linear-gradient(145deg,#ffffff 0%,#dce7df 100%);
  color:#073d39;
}

/* Search — raised frame and a dimensional submit control. */
body.home .ec-care-hero__search {
  border:1px solid rgba(8,68,62,.30);
  border-radius:13px;
  background:linear-gradient(180deg,#ffffff 0%,#f4f8f6 100%);
}
body.home .ec-care-hero__search button {
  border:1px solid #0b4f49;
  border-radius:9px;
  background:linear-gradient(180deg,#176f67 0%,#07544e 100%);
  color:#fff;
transform:none;
  translate:none;
  transition:none;
  animation:none;
}
body.home .ec-care-hero__search button:hover,
body.home .ec-care-hero__search button:focus,
body.home .ec-care-hero__search button:active { transform:none; translate:none; }

/* Mobile header phone: hard geometry lock fixes the tiny icon shift on hover/touch/focus. */
@media (max-width:980px) {
  html body .px-mobile-header-cta,
  html body .px-mobile-header-cta .sa342-header-call,
  html body .px-mobile-header-cta .sa342-header-call:hover,
  html body .px-mobile-header-cta .sa342-header-call:focus,
  html body .px-mobile-header-cta .sa342-header-call:focus-visible,
  html body .px-mobile-header-cta .sa342-header-call:active,
  html body .px-mobile-header-cta .sa342-header-call__icon,
  html body .px-mobile-header-cta .sa342-header-call__icon svg {
    transform:none;
    translate:none;
    scale:1;
    rotate:none;
    transition:none;
    animation:none;
    will-change:auto;
  }
  html body .px-mobile-header-cta .sa342-header-call {
    position:relative;
    margin:0;
    border-radius:8px;
    background:linear-gradient(180deg,#fff 0%,#f3f7f5 100%);
}
  html body .px-mobile-header-cta .sa342-header-call__icon {
    position:relative;
    inset:auto;
    margin:0;
    width:20px;
    min-width:20px;
    max-width:20px;
    height:20px;
    min-height:20px;
    max-height:20px;
    flex:0 0 20px;
    border-radius:6px;
    background:linear-gradient(145deg,#dfff6b,#a9d936);
}
  html body .px-mobile-header-cta .sa342-header-call__icon svg {
    display:block;
    width:14px;
    height:14px;
    margin:auto;
  }
}


/* Source: evercare-control-refine-v38516.css */
/* TEMAGUE Alpha Vision v3.85.16 — consistent 3D controls without motion. */

/* Hero CTA: restore the established dark-teal colour while retaining firm 3D depth. */
body.home .ec-care-hero__primary,
body.home .ec-care-hero__primary:link,
body.home .ec-care-hero__primary:visited,
body.home .ec-care-hero__primary:hover,
body.home .ec-care-hero__primary:focus,
body.home .ec-care-hero__primary:focus-visible,
body.home .ec-care-hero__primary:active {
  box-sizing:border-box;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:16px;
  min-height:42px;
  padding:0 17px 0 20px;
  border:1px solid #073f3d;
  border-radius:999px;
  background:linear-gradient(180deg,#116d69 0%,#0b5b58 54%,#084b48 100%);
  color:#fff;
transform:none;
  translate:none;
  scale:1;
  transition:none;
  animation:none;
}
body.home .ec-care-hero__primary b { color:#d8ee84; }

/* Tile rows: reserve a real arrow column and center it vertically. */
body.home .ec-care-hero__tile-row {
  display:grid;
  grid-template-columns:minmax(0,1fr) 34px;
  align-items:center;
  column-gap:12px;
  width:100%;
}
body.home .ec-care-hero__tile-row > strong {
  min-width:0;
  align-self:center;
}
body.home .ec-care-hero__tile-row > b,
body.home .ec-care-hero__tile-row > b:hover,
body.home .ec-care-hero__tile-row > b:focus {
  box-sizing:border-box;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  justify-self:end;
  align-self:center;
  width:32px;
  height:32px;
  min-width:32px;
  min-height:32px;
  margin:0;
  padding:0 0 2px;
  border:1px solid rgba(4,48,43,.34);
  border-radius:50%;
  background:linear-gradient(145deg,#ffffff 0%,#e8f0ec 48%,#cbdad3 100%);
  color:#073d39;
  font-size:18px;
  line-height:1;
  font-weight:700;
  text-align:center;
transform:none;
  translate:none;
  scale:1;
  transition:none;
  animation:none;
}

/* Desktop header CTA: its frame follows the actual phone number instead of clipping it. */
@media (min-width:981px) {
  html body .px-site-header .px-header-boundary {
    grid-template-columns:max-content max-content minmax(20px,1fr) max-content;
  }
  html body .px-site-header .px-header-boundary > .px-sa-header-utility {
    width:max-content;
    min-width:0;
    max-width:none;
    padding:0 20px;
  }
  html body .px-site-header .px-sa-header-utility .sa342-header-call,
  html body .px-site-header .px-sa-header-utility .sa342-header-call:hover,
  html body .px-site-header .px-sa-header-utility .sa342-header-call:focus,
  html body .px-site-header .px-sa-header-utility .sa342-header-call:focus-visible,
  html body .px-site-header .px-sa-header-utility .sa342-header-call:active {
    width:max-content;
    min-width:max-content;
    max-width:none;
    height:40px;
    min-height:40px;
    max-height:40px;
    padding:0 13px;
    gap:8px;
    border:1px solid #0b4f49;
    border-radius:9px;
    background:linear-gradient(180deg,#fff 0%,#f2f7f5 100%);
}
  html body .px-site-header .sa342-header-call__copy,
  html body .px-site-header .sa342-header-call__copy strong { white-space:nowrap; }
}

/* Mobile uses the same Hero CTA silhouette/colour as desktop. */
@media (max-width:980px) {
  body.home .ec-care-hero__primary,
  body.home .ec-care-hero__primary:hover,
  body.home .ec-care-hero__primary:focus,
  body.home .ec-care-hero__primary:active {
    border-radius:999px;
    background:linear-gradient(180deg,#116d69 0%,#0b5b58 54%,#084b48 100%);
    border-color:#073f3d;
}

  /* Header CTA also grows with its number while respecting the available row width. */
  html body .px-mobile-header-cta .sa342-header-call {
    box-sizing:border-box;
    width:max-content;
    min-width:0;
    max-width:100%;
    padding-left:9px;
    padding-right:9px;
  }
  html body .px-mobile-header-cta .sa342-header-call__copy {
    min-width:0;
    max-width:none;
  }
  html body .px-mobile-header-cta .sa342-header-call__copy strong {
    white-space:nowrap;
  }
}


/* Source: evercare-structural-polish-v38517.css */
/* TEMAGUE Alpha Vision v3.85.17 — canonical header/nav geometry + hero guide polish.
   Loaded last. Fixes structure rather than adding motion. */

/* Header CTA: the control and its parent size from content, never a fixed phone width. */
html body .px-site-header .px-header-boundary > .px-sa-header-utility{
  box-sizing:border-box; width:max-content; min-width:max-content; max-width:none;
  overflow:visible;
}
html body .px-site-header .px-sa-header-utility .sa342-header-call,
html body .px-site-header .px-sa-header-utility .sa342-header-call:hover,
html body .px-site-header .px-sa-header-utility .sa342-header-call:focus,
html body .px-site-header .px-sa-header-utility .sa342-header-call:active{
  box-sizing:border-box; display:inline-flex; width:max-content; min-width:max-content; max-width:none;
  flex:0 0 auto; overflow:visible; white-space:nowrap;
  transform:none; translate:none; scale:1; rotate:none; transition:none; animation:none;
}
html body .px-site-header .sa342-header-call__copy,
html body .px-site-header .sa342-header-call__copy strong{width:max-content; min-width:max-content; max-width:none; white-space:nowrap; overflow:visible;}

/* Desktop navigation: identical box metrics in every pointer state. */
@media (min-width:981px){
  
  
  
  
}

/* Mobile: same CTA silhouette as desktop, content-sized; menu rows touch with no white seams. */
@media (max-width:980px){
  html body .px-site-header .px-header-boundary>.px-sa-header-utility{min-width:0; max-width:100%; padding-left:6px; padding-right:12px;}
  html body .px-site-header .px-sa-header-utility .sa342-header-call{
    width:max-content; min-width:0; max-width:100%; padding:0 9px;
    border:1px solid #0b4f49; border-radius:9px;
    background:linear-gradient(180deg,#fff 0%,#f2f7f5 100%);
}
  html body .px-site-header .px-sa-header-utility .sa342-header-call__copy{min-width:0;}
  html body .px-site-header .px-sa-header-utility .sa342-header-call__copy strong{min-width:0; font-size:10.5px;}
  
  
  
  
  body.home .ec-care-hero__tile-row>b,
  body.home .ec-care-hero__tile-row>b:hover,
  body.home .ec-care-hero__tile-row>b:focus{ text-decoration:none; border-bottom:0; }
}

/* Guide card: realistic raised white surface with a dimensional quarter-circle motif. */
body.home .ec-care-hero__guide{
  isolation:isolate;
  background:
    linear-gradient(145deg,rgba(255,255,255,.98),rgba(245,249,247,.98));
  border:1px solid rgba(19,73,68,.13);
}
body.home .ec-care-hero__guide::before{
  content:""; display:block; position:absolute; z-index:0;
  right:-116px; bottom:-116px; width:300px; height:300px; border-radius:50%;
  background:
    radial-gradient(circle at 34% 30%,rgba(255,255,255,.95) 0 7%,rgba(255,255,255,0) 28%),
    radial-gradient(circle at 42% 40%,#f7fbf5 0 38%,#e6eee4 39% 53%,#cbdac8 54% 57%,#eef4eb 58% 68%,#b8cbb5 69% 72%,#e9f1e6 73% 100%);
  border:1px solid rgba(44,91,65,.20);
pointer-events:none;
}
body.home .ec-care-hero__guide::after{
  content:""; display:block; position:absolute; z-index:0;
  right:-74px; bottom:-74px; width:198px; height:198px; border-radius:50%;
  background:radial-gradient(circle at 35% 30%,#fff 0 5%,#eef5eb 28%,#d7e4d4 58%,#b8ccb4 100%);
  border:1px solid rgba(42,88,62,.18);
pointer-events:none;
}
body.home .ec-care-hero__guide-label,
body.home .ec-care-hero__guide h2,
body.home .ec-care-hero__search{position:relative;z-index:2;}


/* Source: evercare-header-canonical-v38518.css */
/* TEMAGUE Alpha Vision v3.85.18 — final canonical header controls/navigation.
   Loaded last. One geometry for all pointer states; no motion. */

/* Header CTA: frame is content-driven, including icon + label + full phone number. */
html body .px-site-header .px-header-boundary > .px-header-utility.px-sa-header-utility {
  box-sizing:border-box;
  width:max-content;
  min-width:max-content;
  max-width:none;
  overflow:visible;
}
html body .px-site-header .px-header-boundary > .px-header-utility.px-sa-header-utility > a.sa342-header-call,
html body .px-site-header .px-header-boundary > .px-header-utility.px-sa-header-utility > a.sa342-header-call:hover,
html body .px-site-header .px-header-boundary > .px-header-utility.px-sa-header-utility > a.sa342-header-call:focus,
html body .px-site-header .px-header-boundary > .px-header-utility.px-sa-header-utility > a.sa342-header-call:focus-visible,
html body .px-site-header .px-header-boundary > .px-header-utility.px-sa-header-utility > a.sa342-header-call:active {
  box-sizing:border-box;
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
  flex:0 0 auto;
  width:max-content;
  min-width:max-content;
  max-width:none;
  height:40px;
  min-height:40px;
  max-height:40px;
  margin:0;
  padding:0 13px;
  gap:8px;
  overflow:visible;
  white-space:nowrap;
  border:1px solid #0b4f49;
  border-radius:9px;
  background:linear-gradient(180deg,#fff 0%,#f2f7f5 100%);
transform:none; translate:none; scale:1; rotate:none;
  transition:none; animation:none; filter:none; will-change:auto;
}
html body .px-site-header .px-header-boundary > .px-header-utility.px-sa-header-utility > a.sa342-header-call .sa342-header-call__icon {
  box-sizing:border-box; display:inline-flex; align-items:center; justify-content:center;
  flex:0 0 24px; width:24px; min-width:24px; max-width:24px;
  height:24px; min-height:24px; max-height:24px; margin:0;
  border-radius:7px; background:linear-gradient(145deg,#dfff6b,#a9d936);
transform:none; transition:none; animation:none;
}
html body .px-site-header .px-header-boundary > .px-header-utility.px-sa-header-utility > a.sa342-header-call .sa342-header-call__icon svg {
  display:block; width:15px; height:15px; margin:0; transform:none;
}
html body .px-site-header .px-header-boundary > .px-header-utility.px-sa-header-utility > a.sa342-header-call .sa342-header-call__copy {
  box-sizing:border-box; display:flex; flex-direction:column; justify-content:center;
  flex:0 0 auto; width:max-content; min-width:max-content; max-width:none;
  margin:0; padding:0; overflow:visible; white-space:nowrap;
}
html body .px-site-header .px-header-boundary > .px-header-utility.px-sa-header-utility > a.sa342-header-call .sa342-header-call__copy small,
html body .px-site-header .px-header-boundary > .px-header-utility.px-sa-header-utility > a.sa342-header-call .sa342-header-call__copy strong {
  display:block; width:max-content; min-width:max-content; max-width:none;
  margin:0; padding:0; white-space:nowrap; overflow:visible;
-webkit-text-stroke:0; transform:none; transition:none;
}

/* Desktop navigation: identical metrics at rest/hover/focus. Only colour may change. */
@media (min-width:981px){
  
  
  
  
  
}

/* Mobile: same CTA design and zero seams/motion in menu rows. */
@media (max-width:980px){
  html body .px-site-header .px-header-boundary > .px-header-utility.px-sa-header-utility {
    width:max-content; min-width:0; max-width:calc(100vw - 20px); padding:0 10px 0 6px;
  }
  html body .px-site-header .px-header-boundary > .px-header-utility.px-sa-header-utility > a.sa342-header-call,
  html body .px-site-header .px-header-boundary > .px-header-utility.px-sa-header-utility > a.sa342-header-call:hover,
  html body .px-site-header .px-header-boundary > .px-header-utility.px-sa-header-utility > a.sa342-header-call:focus,
  html body .px-site-header .px-header-boundary > .px-header-utility.px-sa-header-utility > a.sa342-header-call:active {
    width:max-content; min-width:max-content; max-width:none; height:40px; padding:0 10px;
  }
  
}


/* Source: evercare-futuristic-static-v38519.css */
/* TEMAGUE Alpha Vision v3.85.19 — hyper-realistic futuristic surfaces, zero decorative hover. */

/* Hero CTA: physical/futuristic depth while preserving current colour family. */
body.home .ec-care-hero__primary,
body.home .ec-care-hero__primary:hover,
body.home .ec-care-hero__primary:focus,
body.home .ec-care-hero__primary:focus-visible,
body.home .ec-care-hero__primary:active {
  position:relative;
  isolation:isolate;
  border:1px solid rgba(113,157,22,.95);
  border-radius:11px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.48) 0,rgba(255,255,255,0) 24%),
    linear-gradient(180deg,#e4ff7a 0%,#c6ee4a 48%,#acd631 100%);
  color:#143c32;
transform:none; translate:none; scale:1; rotate:none;
  transition:none; animation:none; filter:none; will-change:auto;
}
body.home .ec-care-hero__primary::before {
  content:""; display:block; pointer-events:none;
  position:absolute; z-index:-1; inset:2px 3px auto 3px; height:38%;
  border-radius:8px 8px 45% 45%;
  background:linear-gradient(180deg,rgba(255,255,255,.44),rgba(255,255,255,0));
  opacity:.8; transform:none;
}
body.home .ec-care-hero__primary::after { content:none; display:none; }

/* Desktop menu: static futuristic glass/metal surface. Hover is visually identical. */
@media (min-width:981px){
  
  
  
  
  
  /* Dropdown functionality remains; its surface is static and has no decorative hover response. */
  
}

/* Mobile keeps the same physical CTA language and never animates. */
@media (max-width:980px){
  body.home .ec-care-hero__primary,
  body.home .ec-care-hero__primary:hover,
  body.home .ec-care-hero__primary:focus,
  body.home .ec-care-hero__primary:active {
transform:none; transition:none; animation:none;
  }
}


/* Source: evercare-nav-foundation-v38520.css */
/* TEMAGUE Alpha Vision v3.85.20 — static navigation geometry + foundation floating action. */

/* Requested top-bar type reduction: 13.4px -> 12.4px on desktop. */
@media (min-width:981px){
  html body .px-site-header .px-topbar-item,
  html body .px-site-header .px-topbar-status,
  html body .px-site-header .px-topbar-copy { font-size:12.4px; }
}

/* Desktop navigation: one immutable geometry. No hover styling or moving caret. */
@media (min-width:981px){
  
  
  /* Fixed SVG caret: same pixels in normal/hover/focus; no glyph baseline shift. */
  
  /* Submenu is a conventional, symmetric rectangle. Remove every legacy cut/mask/pseudo layer. */
  
  
  
  
  
  
}

/* Foundation floating action: new organic badge, not the old rectangular/pill control. */
html body .sa-floating-contact-wrap { width:68px; height:68px; max-width:none; }
html body .sa-floating-contact,
html body .sa-floating-contact:hover,
html body .sa-floating-contact:focus,
html body .sa-floating-contact:focus-visible,
html body .sa-floating-contact:active {
  box-sizing:border-box; display:grid; place-items:center;
  width:68px; min-width:68px; max-width:68px; height:68px; min-height:68px;
  margin:0; padding:0; gap:0; overflow:visible;
  border:1px solid rgba(80,118,18,.72);
  border-radius:52% 48% 46% 54% / 46% 54% 46% 54%;
  background:linear-gradient(145deg,#dcff74 0%,#b9e83f 52%,#8fbd24 100%);
  color:#123d32;
clip-path:none; -webkit-clip-path:none;
  transform:none; translate:none; scale:1; rotate:none;
  transition:none; animation:none; filter:none;
}
html body .sa-floating-contact::before { content:""; display:block; position:absolute; inset:5px 9px auto 9px; height:24px; border-radius:50%; background:linear-gradient(180deg,rgba(255,255,255,.58),rgba(255,255,255,0)); pointer-events:none; }
html body .sa-floating-contact::after { content:none; display:none; }
html body .sa-floating-contact-icon { display:grid; place-items:center; width:42px; height:42px; flex:none; border:0; border-radius:50%; background:rgba(255,255,255,.84); color:#17483d;  }
html body .sa-floating-contact-icon svg { width:28px; height:28px; display:block; }
html body .sa-floating-contact-copy,
html body .sa-floating-contact-arrow { display:none; }
@media(max-width:640px){
  html body .sa-floating-contact-wrap { width:60px; height:60px; }
  html body .sa-floating-contact, html body .sa-floating-contact:hover, html body .sa-floating-contact:focus, html body .sa-floating-contact:active { width:60px; min-width:60px; max-width:60px; height:60px; min-height:60px; }
  html body .sa-floating-contact-icon { width:38px; height:38px; }
  html body .sa-floating-contact-icon svg { width:25px; height:25px; }
}


/* Source: evercare-card-strip-v38527.css */
/* TEMAGUE Alpha Vision v3.85.27 — card strip height + mobile vertical centering/readability. */
body.home .ec-care-hero-cards .ec-care-hero__tile,
body.home .ec-care-hero-cards .ec-care-hero__guide{
  height:167px;
  min-height:167px;
  box-sizing:border-box;
  overflow:hidden;
}
body.home .ec-care-hero-cards .ec-care-hero__tile{
  display:flex;
  flex-direction:column;
  justify-content:center;
}
body.home .ec-care-hero-cards .ec-care-hero__guide{
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding-top:16px;
  padding-bottom:16px;
  gap:6px;
}
body.home .ec-care-hero-cards .ec-care-hero__guide-label,
body.home .ec-care-hero-cards .ec-care-hero__guide h2,
body.home .ec-care-hero-cards .ec-care-hero__search{
  margin-top:0;
  margin-bottom:0;
  flex:0 0 auto;
}
body.home .ec-care-hero-cards__left{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
}
@media(max-width:980px){
  body.home .ec-care-hero-cards{grid-template-columns:1fr;}
  body.home .ec-care-hero-cards__left{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    width:100%;
  }
  body.home .ec-care-hero-cards .ec-care-hero__tile,
  body.home .ec-care-hero-cards .ec-care-hero__guide{
    height:167px;
    min-height:167px;
  }
  body.home .ec-care-hero-cards .ec-care-hero__tile{
    justify-content:center;
    padding:16px 18px;
    gap:14px;
  }
  body.home .ec-care-hero-cards .ec-care-hero__tile .ec-care-hero__icon{
    width:44px;
    height:44px;
    min-width:44px;
    font-size:36px;
  }
  body.home .ec-care-hero-cards .ec-care-hero__tile .ec-care-hero__icon svg{
    width:100%;
    height:100%;
    display:block;
  }
  body.home .ec-care-hero-cards .ec-care-hero__tile-row strong{
    font-size:16px;
    line-height:1.15;
  }
  body.home .ec-care-hero-cards .ec-care-hero__tile-row b{
    font-size:13px;
    line-height:1.2;
  }
  body.home .ec-care-hero-cards .ec-care-hero__guide{
    justify-content:center;
    padding:16px 20px;
    gap:5px;
  }
}


/* Source: temague-alpha-vision-v38530.css */
/* TEMAGUE Alpha Vision v3.85.30 — canonical homepage-only overrides. */
:root{--tav-red:#e24b47;--tav-ink:#101413;}
body.home .ec-care-hero__copy h1,body.home .ec-care-hero__copy h1 *{color:#fff;-webkit-text-stroke:0;text-stroke:0;filter:none;}
body.home .ec-care-hero__copy h1>span,body.home .ec-care-hero__copy h1>strong{background:var(--tav-red);border:0;outline:0;}
body.home .ec-care-hero__primary{background:#fff;color:var(--tav-ink);border:0;}
body.home .ec-care-hero__primary:hover{background:var(--tav-red);color:#fff;}
body.home .ec-care-hero__tile,body.home .ec-care-hero__guide{min-height:110%;}
@media (min-width:768px){body.home .ec-care-hero-cards{min-height:clamp(238px,20vw,330px);}body.home .ec-care-hero__tile,body.home .ec-care-hero__guide{height:100%;min-height:0;}}

/* TEMAGUE Alpha Vision v3.85.32 — canonical hero + clean homepage termination.
   The homepage intentionally ends after the support-card strip. */
:root{--tav-red:#ff3b3f;}

/* Hero headline: pure white type on a bright red block; no outline/glow/shadow. */
html body.home .ec-care-hero__copy h1,
html body.home .ec-care-hero__copy h1 span,
html body.home .ec-care-hero__copy h1 strong{
  color:#fff;
  -webkit-text-fill-color:#fff;
  -webkit-text-stroke:0 transparent;
  text-stroke:0;
filter:none;
outline:0;
}
html body.home .ec-care-hero__copy h1>span,
html body.home .ec-care-hero__copy h1>strong{
  display:table;
  width:max-content;
  max-width:100%;
  background:#ff3b3f;
  border:0;
  border-radius:0;
outline:0;
}




/* TEMAGUE Alpha Vision v3.85.33 — canonical hero cleanup.
   Homepage markup ends at the three-card strip; no synthetic post-card section is generated. */
html body.home .ec-care-hero__copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
}
html body.home .ec-care-hero__copy h1{
  margin-block:auto;
}
html body.home .ec-care-hero__primary{display:none;}
html body.home .ec-care-hero-cards::before,
html body.home .ec-care-hero-cards::after{content:none;display:none;}
html body.home .ec-care-hero-cards{margin-bottom:0;padding-bottom:0;}

/* TEMAGUE Alpha Vision v3.85.34 — requested top-bar/header height refinement.
   Desktop canonical geometry only: top bar -2px, main header +5px.
   All direct content rows stay vertically centered. */
@media (min-width:981px) {
  html body .px-site-header .px-announcement-bar,
  html body .px-site-header .px-topbar-shell,
  html body .px-site-header .px-topbar-boundary {
    height:41.2px;
    min-height:41.2px;
    max-height:41.2px;
  }
  html body .px-site-header .px-topbar-shell,
  html body .px-site-header .px-topbar-left,
  html body .px-site-header .px-topbar-right,
  html body .px-site-header .px-topbar-item,
  html body .px-site-header .px-topbar-status {
    align-items:center;
  }

  html body .px-site-header .px-header-shell,
  html body .px-site-header .px-header-boundary {
    height:72.2px;
    min-height:72.2px;
    max-height:72.2px;
  }
  html body .px-site-header .px-header-boundary {
    grid-template-rows:72.2px;
    align-items:center;
  }
  
  
  
}

/* TEMAGUE Alpha Vision v3.85.35 — requested header geometry/menu refinement + card-strip termination cleanup.
   Desktop: top bar -3px from v3.85.34, main header +2px, nav type +2px.
   All header/top-bar children remain vertically centered. Homepage ends flush after the three-card strip. */
@media (min-width:981px) {
  html body .px-site-header .px-announcement-bar,
  html body .px-site-header .px-topbar-shell,
  html body .px-site-header .px-topbar-boundary {
    height:38.2px;
    min-height:38.2px;
    max-height:38.2px;
  }
  html body .px-site-header .px-topbar-shell,
  html body .px-site-header .px-topbar-left,
  html body .px-site-header .px-topbar-right,
  html body .px-site-header .px-topbar-item,
  html body .px-site-header .px-topbar-status {
    display:flex;
    align-items:center;
  }
  html body .px-site-header .px-header-shell,
  html body .px-site-header .px-header-boundary {
    height:74.2px;
    min-height:74.2px;
    max-height:74.2px;
  }
  html body .px-site-header .px-header-boundary {
    grid-template-rows:74.2px;
    align-items:center;
  }
  
  
  
  
}
html body.home .ec-care-hero-cards,
html body.home .ec-care-hero-cards__left,
html body.home .ec-care-hero-cards .ec-care-hero__tile,
html body.home .ec-care-hero-cards .ec-care-hero__guide {
  margin-bottom:0;
  padding-bottom:0;
}
html body.home .ec-care-hero-cards {
  min-height:0;
  height:auto;
  line-height:normal;
  background:transparent;
}
html body.home .ec-care-hero-cards::before,
html body.home .ec-care-hero-cards::after {content:none;display:none;}
html body.home main,
html body.home .wp-site-blocks,
html body.home .entry-content {margin-bottom:0;padding-bottom:0;}


/* TEMAGUE Alpha Vision v3.85.36 — header menu typography refinement.
   Reduce the desktop primary menu by exactly 1px from v3.85.35. */
@media (min-width:981px) {
  
}

/* TEMAGUE Alpha Vision v3.85.37 — canonical desktop header menu stability lock.
   Fixes menu jitter/type resizing by using immutable pixel metrics in every
   interaction state. This intentionally supersedes the relative em overrides
   from v3.85.35/v3.85.36. */
@media (min-width:981px) {
  
}

/* TEMAGUE Alpha Vision v3.85.38 — mockup-locked homepage continuation. */
.av-home,.av-home *,.av-footer,.av-footer *{box-sizing:border-box}.av-home{background:#fff;color:#0e3f3c}.av-shell{width:min(100% - 80px,1440px);margin-inline:auto}.av-kicker{display:block;color:#7d8e8a;font-size:11px;font-weight:800;letter-spacing:.18em;margin-bottom:10px}.av-home h2,.av-footer h2{margin:0;color:#10233e;font-weight:800;letter-spacing:-.045em}.av-btn{display:inline-flex;align-items:center;gap:24px;padding:12px 19px;border-radius:8px;background:#08665f;color:#fff;text-decoration:none;font-size:13px;font-weight:800;box-shadow:0 5px 13px rgba(4,65,60,.14)}.av-btn b{font-size:18px}.av-intro{display:grid;grid-template-columns:.88fr 1.12fr;gap:62px;padding-top:24px;padding-bottom:20px;align-items:center}.av-intro__copy{padding:18px 0 20px}.av-intro h2{font-size:44px;line-height:1.02}.av-intro p{max-width:610px;color:#566764;font-size:16px;line-height:1.55;margin:15px 0 20px}.av-intro__photo{height:300px;position:relative;margin:0;overflow:hidden;border-radius:20px}.av-intro__photo img,.av-trust__photo img{width:100%;height:100%;object-fit:cover}.av-intro__photo figcaption,.av-trust__photo figcaption{position:absolute;right:40px;top:38px;color:#fff;font:700 31px/1.05 cursive;transform:rotate(-5deg);text-align:center;text-shadow:0 2px 4px rgba(0,0,0,.25)}.av-intro__photo figcaption i,.av-trust__photo figcaption i{display:block;width:92px;height:5px;background:#c8ef46;transform:rotate(-7deg);margin:12px auto 0}.av-values{background:linear-gradient(90deg,#f3f7ed,#fbfcf8);border-top:1px solid #eef2e8;border-bottom:1px solid #eef2e8}.av-values__grid{display:grid;grid-template-columns:repeat(4,1fr);padding-top:18px;padding-bottom:18px}.av-values__grid>div{text-align:center;padding:0 20px}.av-values span{display:grid;place-items:center;margin:0 auto 8px;width:48px;height:48px;border-radius:50%;background:#fff;color:#087168;font-size:23px;box-shadow:0 7px 18px rgba(6,69,63,.13)}.av-values strong,.av-values small{display:block}.av-values strong{font-size:14px}.av-values small{font-size:12px;line-height:1.35;color:#60716e;margin-top:5px}.av-services{padding-top:25px;padding-bottom:28px}.av-section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:18px}.av-section-head h2{font-size:31px}.av-btn--pale{background:#eff6f1;color:#174b47;border:1px solid #9bbdb4;box-shadow:none}.av-services__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:28px}.av-service{border:1px solid #e0e7e2;border-radius:10px;overflow:hidden;background:#fff;box-shadow:0 5px 16px rgba(16,52,47,.035)}.av-service figure{height:132px;margin:0;position:relative}.av-service figure img{width:100%;height:100%;object-fit:cover}.av-service figure i{position:absolute;left:14px;bottom:-20px;width:42px;height:42px;display:grid;place-items:center;background:#fff;border-radius:10px;color:#087168;font-style:normal;box-shadow:0 5px 15px rgba(0,0,0,.15)}.av-service>div{padding:24px 16px 15px}.av-service h3{font-size:15px;margin:0 0 5px}.av-service p{font-size:13px;line-height:1.35;color:#667471;min-height:36px;margin:0 0 9px}.av-service a,.av-resources a{font-size:12px;color:#09675f;text-decoration:none;font-weight:800}.av-trust{background:#fbfbf8}.av-trust__grid{display:grid;grid-template-columns:1.05fr .9fr .55fr;align-items:center;gap:38px;padding-top:0;padding-bottom:0}.av-trust__photo{height:310px;margin:0;position:relative;overflow:hidden;border-radius:0 10px 10px 0}.av-trust__photo figcaption{left:20px;right:auto;top:40px;color:#163f3c;font-size:28px}.av-trust__copy h2{font-size:33px}.av-trust__copy p{color:#667471;font-size:14px;line-height:1.5}.av-trust__copy ul{list-style:none;padding:0;margin:12px 0 18px}.av-trust__copy li{font-size:13px;margin:7px 0}.av-trust__copy li:before{content:"✓";display:inline-grid;place-items:center;width:18px;height:18px;margin-right:10px;border-radius:50%;background:#087168;color:#fff;font-size:11px}.av-trust blockquote{margin:0;background:#eef5e8;border-radius:50%;aspect-ratio:1;display:flex;flex-direction:column;justify-content:center;text-align:center;padding:35px;color:#124944}.av-trust blockquote b{font-size:35px;line-height:.6}.av-trust blockquote p{font-size:16px;font-weight:700;line-height:1.35}.av-trust blockquote cite{font-size:13px;font-style:normal}.av-stories{display:grid;grid-template-columns:230px 1fr;gap:35px;padding-top:24px;padding-bottom:24px}.av-stories__title h2{font-size:30px}.av-quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.av-quotes article{border:1px solid #e1e7e3;border-radius:9px;padding:17px 20px}.av-quotes p{min-height:65px;margin:0 0 12px;font-size:13px;line-height:1.35;color:#536562}.av-quotes strong,.av-quotes small{display:block;font-size:12px}.av-quotes strong{color:#0b665f}.av-quotes small{color:#83908d}.av-resources{border-top:1px solid #edf0ed;padding-top:20px;padding-bottom:22px}.av-resources__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}.av-resources article{display:grid;grid-template-columns:130px 1fr;border:1px solid #e1e7e3;border-radius:9px;overflow:hidden;min-height:110px}.av-resources article img{width:100%;height:100%;object-fit:cover}.av-resources article div{padding:13px 15px}.av-resources article small{font-size:9px;color:#87938f;letter-spacing:.08em}.av-resources h3{font-size:14px;line-height:1.25;margin:5px 0 9px}.av-final-cta{background:#087069;color:#fff}.av-final-cta>.av-shell{min-height:92px;display:flex;align-items:center;justify-content:space-between}.av-final-cta .av-kicker{color:#c3d9d3;margin-bottom:4px}.av-final-cta h2{color:#fff;font-size:27px}.av-final-cta__actions{display:flex;align-items:center;gap:30px}.av-final-cta__actions span{display:grid;grid-template-columns:30px auto;font-size:22px}.av-final-cta__actions small,.av-final-cta__actions strong{font-size:12px}.av-btn--lime{background:#d7f16d;color:#18443f;box-shadow:none}.av-footer{background:#064c49;color:#eaf3ef}.av-footer__grid{display:grid;grid-template-columns:1.25fr .65fr 1fr .85fr;gap:55px;padding-top:26px;padding-bottom:25px}.av-footer h2{color:#fff;font-size:28px}.av-footer p,.av-footer a{display:block;color:#d7e5e1;text-decoration:none;font-size:11px;line-height:1.7;margin:6px 0}.av-footer strong{font-size:12px;color:#fff}.av-social{font-size:16px}.av-footer__bottom{border-top:1px solid rgba(255,255,255,.12);min-height:44px;display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#c1d5d0}
@media(max-width:980px){.av-shell{width:min(100% - 40px,1440px)}.av-intro{grid-template-columns:1fr}.av-values__grid,.av-services__grid{grid-template-columns:repeat(2,1fr)}.av-trust__grid{grid-template-columns:1fr 1fr}.av-trust blockquote{display:none}.av-stories{grid-template-columns:1fr}.av-footer__grid{grid-template-columns:1fr 1fr}.av-final-cta>.av-shell{padding-block:20px;gap:20px}.av-resources__grid{grid-template-columns:1fr}}
@media(max-width:600px){.av-shell{width:min(100% - 28px,1440px)}.av-intro h2{font-size:36px}.av-intro__photo{height:260px}.av-values__grid,.av-services__grid,.av-trust__grid,.av-quotes,.av-footer__grid{grid-template-columns:1fr}.av-values__grid{gap:22px}.av-section-head{align-items:flex-start;flex-direction:column}.av-trust__photo{border-radius:10px}.av-stories{padding-block:28px}.av-final-cta>.av-shell,.av-final-cta__actions{align-items:flex-start;flex-direction:column}.av-footer__bottom{align-items:flex-start;gap:8px;flex-direction:column;padding-block:12px}}

/* TEMAGUE Alpha Vision v3.85.42 — audited canonical refinements. */
html body .px-site-header .px-announcement-bar,
html body .px-announcement-bar,
body .px-announcement-bar {
    background: #087069;
}

/* CTA phone: one stable contact unit with no wrapping or inherited grid rules. */
.av-final-cta__actions > span {
    display: none;
}

.av-final-cta__phone {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 0 0 auto;
    white-space: nowrap;
    color: #fff;
    text-decoration: none;
    line-height: 1.15;
}

.av-final-cta__phone > i {
    display: grid;
    place-items: center;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    font-style: normal;
    font-size: 25px;
    line-height: 1;
}

.av-final-cta__phone > span {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 3px;
    white-space: nowrap;
}

.av-final-cta__phone small {
    display: block;
    font-size: 13px;
    line-height: 1.1;
    font-weight: 500;
    white-space: nowrap;
}

.av-final-cta__phone strong {
    display: block;
    font-size: 16px;
    line-height: 1.1;
    font-weight: 800;
    white-space: nowrap;
}

/* Footer typography: canonical size after the requested +2px and +1px revisions. */
.av-footer p,
.av-footer a {
    font-size: 14px;
}

.av-footer strong {
    font-size: 15px;
}

.av-footer .av-social {
    font-size: 19px;
}

.av-footer__bottom {
    font-size: 13px;
}

@media (max-width: 600px) {
    .av-final-cta__phone {
        align-self: flex-start;
    }

    .av-final-cta__phone > span {
        align-items: flex-start;
    }
}

/* TEMAGUE Alpha Vision v3.85.45 — site-title identity + immutable desktop menu interaction.
   Canonical final override: brand is deep care-teal and extra-bold; desktop menu geometry,
   typography and paint remain identical on hover/focus/active so pointer interaction cannot jitter. */
html body .px-site-header .px-brand-text {
  color:#075f59;
  font-weight:900;
  font-synthesis:none;
}

@media (min-width:981px) {
  

  

  

  
}

/* TEMAGUE Alpha Vision v3.85.46 — canonical static desktop navigation + restrained 3D surfaces.
   Requirement: desktop navigation must never move on pointer interaction. 3D is paint-only
   (shadow/highlight), so geometry remains identical in every interactive state. */
@media (min-width:981px) {
  /* Top bar: subtle physical depth without changing its established height/layout. */
  html body .px-site-header .px-topbar-shell {
    position:relative;
    z-index:3;
}

  /* Freeze the complete desktop nav geometry, including hover/focus/current states. */
  

  

  

  /* Hover is intentionally paint-identical: absolutely no visual jump or movement. */
  

  

  
}

/* CTA above footer: restrained dimensional treatment, with the mobile presentation explicitly covered. */
.av-final-cta {
  position:relative;
}
.av-final-cta .av-btn,
.av-final-cta .av-btn:hover,
.av-final-cta .av-btn:focus,
.av-final-cta .av-btn:active {
transform:none;
  translate:none;
  scale:1;
  transition:none;
}
@media (max-width:980px) {
  .av-final-cta {
    border-top:1px solid rgba(255,255,255,.16);
    border-bottom:1px solid rgba(0,45,40,.24);
}
  .av-final-cta__phone > i {
}
}

/* TEMAGUE Alpha Vision v3.85.47 — mobile Our Services image visibility.
   On phones, service photography gets a taller, responsive frame and uses contain
   so the complete source image remains visible instead of being aggressively cropped. */
@media (max-width:600px) {
  .av-services .av-service figure {
    height:auto;
    min-height:0;
    aspect-ratio:auto;
    background:#eef4ef;
    overflow:hidden;
  }
  .av-services .av-service figure img {
    display:block;
    width:100%;
    height:auto;
    max-height:none;
    aspect-ratio:auto;
    object-fit:contain;
    object-position:center center;
  }
}

/* TEMAGUE Alpha Vision v3.85.65 — canonical header/navigation authority.
   One clean rule set: section-aligned desktop header, optically centered brand/CTA,
   content-height desktop menu track so dropdown top:100% behaves naturally, and restored mobile menu colours. */
@media (min-width:981px) {
  html body .px-site-header .px-header-shell {
    width:100%; height:74.2px; min-height:74.2px; margin:0; padding:0; background:#fff; overflow:visible;
  }
  html body .px-site-header .px-header-boundary {
    box-sizing:border-box; position:relative;
    display:grid; grid-template-columns:max-content max-content minmax(20px,1fr) max-content; align-items:center;
    width:min(100% - 80px,1440px); height:74.2px; min-height:74.2px; margin-inline:auto; padding:0; gap:0;
    background:#fff; overflow:visible;
  }
  html body .px-site-header .px-header-boundary > .px-brand-link {
    grid-column:1; align-self:center; display:flex; align-items:center; justify-content:flex-start;
    width:max-content; height:74.2px; min-height:0; margin:0; padding:0 28px 0 0; text-decoration:none;
  }
  html body .px-site-header .px-brand-text {
    display:flex; align-items:center; height:100%; margin:0; padding:0;
    color:#075f59; font-family:'Nunito Sans',sans-serif; font-size:38.4px; font-weight:900; line-height:1;
    letter-spacing:-.035em; white-space:nowrap; font-synthesis:none; 
  }
  html body .px-site-header .px-header-boundary > .px-header-utility.px-sa-header-utility {
    grid-column:2; align-self:center; display:flex; align-items:center; justify-content:flex-start;
    width:auto; min-width:0; height:74.2px; min-height:0; margin:0; padding:0 20px;
  }
  html body .px-site-header .px-header-boundary > nav.ec-primary-nav.px-sa-header-nav {
    grid-column:4; align-self:center; justify-self:end; position:relative;
    display:flex; align-items:center; justify-content:flex-end; width:max-content; height:42px; min-height:42px;
    margin:0 0 0 auto; padding:0; background:transparent; border:0;  overflow:visible;
  }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu {
    box-sizing:border-box; display:flex; align-items:stretch; justify-content:flex-end;
    width:max-content; height:42px; min-height:42px; margin:0; padding:0; gap:0; list-style:none; background:transparent; overflow:visible;
  }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li {
    box-sizing:border-box; position:relative; display:flex; align-items:stretch; width:auto; height:42px; min-height:42px;
    margin:0; padding:0; background:transparent; border:0;  overflow:visible;
  }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li > a,
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li > a:hover,
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li > a:focus,
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li > a:focus-visible,
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li > a:active {
    box-sizing:border-box; position:relative; display:flex; align-items:center; justify-content:center;
    width:auto; height:42px; min-height:42px; margin:0; padding:0 18px; background:transparent; border:0; border-radius:0; 
    color:#102f2c; font-family:'Nunito Sans',sans-serif; font-size:17px; font-weight:700; line-height:1; letter-spacing:.01em;
    white-space:nowrap; text-decoration:none; transform:none; translate:none; scale:1; transition:none; animation:none; filter:none;
  }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li > a::before { content:none; display:none; }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu li.menu-item-has-children > a::after {
    content:'▾'; display:inline-block; position:static; width:10px; height:12px; margin-left:7px; border:0; background:none;
    color:#35615d; font-size:10px; line-height:12px; text-align:center; transform:none; transition:none; animation:none;
  }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li.menu-item-has-children::before { content:none; display:none; }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li > .sub-menu {
    box-sizing:border-box; position:absolute; z-index:10020; left:0; top:100%; display:none;
    width:230px; min-width:230px; max-width:230px; height:auto; margin:0; padding:6px 0; list-style:none;
    background:#fff; border:1px solid #dfe4e1; border-radius:10px;  overflow:hidden;
    opacity:1; visibility:visible; transform:none; transition:none; animation:none;
  }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li:hover > .sub-menu,
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li:focus-within > .sub-menu { display:block; }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li > .sub-menu > li {
    position:relative; display:block; width:100%; margin:0; padding:0; border:0; background:transparent;
  }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li > .sub-menu > li > a {
    box-sizing:border-box; display:flex; align-items:center; width:100%; min-height:52px; margin:0; padding:10px 20px;
    background:#fff; color:#123b38; border:0; border-bottom:1px solid #edf0ee; border-radius:0;
    font-family:'Nunito Sans',sans-serif; font-size:17px; font-weight:600; line-height:1.3; text-decoration:none;
    transform:none; transition:none; animation:none;
  }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li > .sub-menu > li:last-child > a { border-bottom:0; }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li > .sub-menu > li > a:hover,
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li > .sub-menu > li > a:focus-visible { background:#f5f7f5; }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu .sub-menu .sub-menu { top:-7px; left:100%; }
}

@media (max-width:980px) {
  html body .px-site-header .px-header-boundary > nav.ec-primary-nav.px-sa-header-nav {
    grid-column:1/-1; grid-row:2; position:relative; display:block; width:100%; height:auto; margin:0; padding:0;
    background:transparent; overflow:visible; border-top:1px solid #dce2de;
  }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu {
    display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); width:100%; height:auto; margin:0; padding:0; gap:0; list-style:none; overflow:visible;
  }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li {
    position:relative; display:block; min-width:0; margin:0; padding:0; border:0; border-left:1px solid #dce2de; overflow:visible;
  }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li:first-child { border-left:0; }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li > a {
    box-sizing:border-box; display:flex; align-items:center; justify-content:center; width:100%; min-height:44px;
    margin:0; padding:8px 4px; background:#fff; color:#102f2c; border:0; border-radius:0; 
    font-family:'Nunito Sans',sans-serif; font-size:13px; font-weight:700; line-height:1.05; text-align:center; text-decoration:none;
    white-space:normal; transform:none; transition:none; animation:none;
  }
  /* Restore the established mobile colour sequence removed by the previous cleanup. */
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li:nth-last-child(3) > a { background:#a8b99a; color:#102d2b; }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li:nth-last-child(2) > a { background:#0b6963; color:#fff; }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li:nth-last-child(1) > a { background:#050505; color:#fff; }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu li.menu-item-has-children > a::after { content:'▾'; margin-left:6px; font-size:9px; }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu .sub-menu {
    position:absolute; z-index:10030; top:100%; left:0; display:none; width:230px; min-width:230px; margin:0; padding:6px 0;
    list-style:none; background:#fff; border:1px solid #dfe4e1; border-radius:10px;  overflow:hidden;
  }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu li.submenu-open > .sub-menu { display:block; }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu .sub-menu li > a {
    display:block; padding:12px 16px; background:#fff; color:#123b38; border-bottom:1px solid #edf0ee;
    font-family:'Nunito Sans',sans-serif; font-size:15px; font-weight:600; line-height:1.3; text-decoration:none;
  }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu .sub-menu li:last-child > a { border-bottom:0; }
}
@media (max-width:600px) {
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li > a { font-size:13px; padding-inline:4px; }
}


/* TEMAGUE Alpha Vision v3.85.66 — mobile header row geometry.
   Keep the navigation row full-width; align only the first row (brand + CTA) to the
   same 14px phone gutter used by .av-shell. */
@media (max-width:600px) {
  html body .px-site-header .px-header-boundary > .px-brand-link {
    margin-left:14px;
    padding-left:0;
  }
  html body .px-site-header .px-header-boundary > .px-header-utility.px-sa-header-utility {
    margin-right:14px;
    padding-right:0;
  }
}

/* TEMAGUE Alpha Vision v3.85.67 — flat visual reset + canonical menu carets + shared desktop shell geometry.
   - Dimensional paint has been removed from the theme; layout/colour/radius remain intact.
   - Header and homepage sections now consume the same shell variables.
   - Carets are CSS geometry, not font glyphs, so their size/direction is predictable. */
:root {
  --av-shell-max: 1440px;
  --av-shell-gutter-desktop: 40px;
  --av-shell-gutter-tablet: 20px;
  --av-shell-gutter-phone: 14px;
}
.av-shell {
  width:min(calc(100% - (2 * var(--av-shell-gutter-desktop))), var(--av-shell-max));
  margin-inline:auto;
}
@media (min-width:981px) {
  html body .px-site-header .px-header-boundary {
    width:min(calc(100% - (2 * var(--av-shell-gutter-desktop))), var(--av-shell-max));
    margin-inline:auto;
  }

  /* First-level item with children: conventional downward triangle. */
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li.menu-item-has-children > a::after {
    content:"";
    display:inline-block;
    position:static;
    width:0;
    height:0;
    margin-left:8px;
    border-left:5px solid transparent;
    border-right:5px solid transparent;
    border-top:6px solid #35615d;
    border-bottom:0;
    background:transparent;
    font-size:0;
    line-height:0;
    flex:0 0 auto;
  }

  /* Nested item with children: conventional right-pointing triangle. */
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu .sub-menu li.menu-item-has-children > a::after {
    content:"";
    display:inline-block;
    position:static;
    width:0;
    height:0;
    margin-left:auto;
    border-top:5px solid transparent;
    border-bottom:5px solid transparent;
    border-left:6px solid #35615d;
    border-right:0;
    background:transparent;
    font-size:0;
    line-height:0;
    flex:0 0 auto;
  }
}
@media (max-width:980px) {
  .av-shell {
    width:min(calc(100% - (2 * var(--av-shell-gutter-tablet))), var(--av-shell-max));
  }
}
@media (max-width:600px) {
  .av-shell {
    width:min(calc(100% - (2 * var(--av-shell-gutter-phone))), var(--av-shell-max));
  }
}

/* TEMAGUE Alpha Vision v3.85.69 — hero-guide typography only.
   All v3.85.68 dimensional/3D paint rules have been removed. */
body.home .ec-care-hero-cards .ec-care-hero__guide-label {
  font-size:10px;
}
body.home .ec-care-hero-cards .ec-care-hero__guide h2 {
  font-size:22px;
  line-height:1.18;
  text-wrap:balance;
  max-width:100%;
}
body.home .ec-care-hero-cards .ec-care-hero__search input[type="search"],
body.home .ec-care-hero-cards .ec-care-hero__search input[type="search"]::placeholder {
  font-size:14px;
  line-height:1.25;
}

/* TEMAGUE Alpha Vision v3.85.70 — selective dimensional treatment.
   Scope: visual surfaces, controls, icons and frames only.
   Typography, numbers and photographic imagery intentionally receive no dimensional effects. */
:root{
  --av-3d-edge: rgba(5,57,53,.18);
  --av-3d-soft: 0 7px 16px rgba(5,57,53,.12);
  --av-3d-control: 0 4px 0 rgba(4,69,64,.22),0 8px 14px rgba(4,69,64,.10);
  --av-3d-inset: inset 0 1px 0 rgba(255,255,255,.30);
}

/* Selected large surfaces. */
html body .px-site-header .px-announcement-bar{
  box-shadow:var(--av-3d-inset),0 3px 8px rgba(5,57,53,.16);
  position:relative;
  z-index:3;
}
html body .px-site-header .px-header-shell{
  box-shadow:var(--av-3d-inset),0 5px 12px rgba(5,57,53,.13);
  position:relative;
  z-index:2;
}
body.home .ec-care-hero-cards .ec-care-hero__tile,
body.home .ec-care-hero-cards .ec-care-hero__guide{
  box-shadow:var(--av-3d-inset),var(--av-3d-soft);
}
.av-values{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.70),inset 0 -1px 0 rgba(5,57,53,.10),0 7px 16px rgba(5,57,53,.08);
}
.av-final-cta{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 -5px 14px rgba(5,57,53,.11),0 7px 16px rgba(5,57,53,.12);
  position:relative;
}
.av-footer{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.13),0 -7px 18px rgba(5,57,53,.15);
  position:relative;
}

/* Buttons/controls: dimensional surface only; child text remains untouched. */
button,
input[type="button"],input[type="submit"],input[type="reset"],
.av-btn,
.px-header-cta,
.px-sa-header-cta,
.ec-care-hero__primary,
.ec-care-hero__guide button,
.ec-care-hero__guide input[type="submit"]{
  box-shadow:var(--av-3d-inset),var(--av-3d-control);
}

/* Icons: dimensional treatment belongs to the icon surface/shape, never to text. */
.av-values span,
.av-service figure i,
.px-topbar-item i,
.px-topbar-status i,
.px-header-utility i,
.ec-care-hero__icon,
.av-final-cta__phone > i,
.px-whatsapp,
.px-editorial-social-icon{
  box-shadow:var(--av-3d-inset),0 4px 8px rgba(5,57,53,.16);
}

/* Frames / bordered UI surfaces throughout the page. */
.av-service,
.av-quotes article,
.av-resources article,
input:not([type="checkbox"]):not([type="radio"]),
textarea,
select{
  box-shadow:var(--av-3d-inset),0 4px 10px rgba(5,57,53,.08);
}

/* Explicit safeguard: no 3D text/number or photographic-image treatment. */
.av-home img,.av-footer img,.px-site-header img,
.av-home h1,.av-home h2,.av-home h3,.av-home p,.av-home small,.av-home strong,.av-home b,.av-home a,
.av-footer h1,.av-footer h2,.av-footer h3,.av-footer p,.av-footer small,.av-footer strong,.av-footer a,
.px-site-header a,.px-site-header span{
  text-shadow:none;
  filter:none;
}

/* TEMAGUE Alpha Vision v3.85.71 — complete selective dimensional coverage + seamless mobile menu.
   3D remains paint-only: no typography, number or photographic-image effects. */

/* All native/theme button surfaces. */
button,
[role="button"],
input[type="button"], input[type="submit"], input[type="reset"],
.av-btn, .px-header-cta, .px-sa-header-cta,
.ec-care-hero__primary, .ec-care-hero__guide button,
.ec-care-hero__guide input[type="submit"],
.px-mobile-menu-toggle, .sa-floating-contact-icon {
  box-shadow:var(--av-3d-inset),var(--av-3d-control);
}

/* Icon surfaces/shapes used throughout the theme. */
.av-values span,
.av-service figure i,
.px-topbar-item i, .px-topbar-status i,
.px-header-utility i,
.ec-care-hero__icon,
.av-final-cta__phone > i,
.px-whatsapp,
.px-editorial-social-icon,
.sa-floating-contact-icon,
[class*="__icon"]:not(img),
[class*="-icon"]:not(img) {
  box-shadow:var(--av-3d-inset),0 4px 8px rgba(5,57,53,.16);
}

/* Bordered/frame surfaces already present in the design. This adds depth only; no geometry changes. */
.av-service,
.av-quotes article,
.av-resources article,
body.home .ec-care-hero-cards .ec-care-hero__tile,
body.home .ec-care-hero-cards .ec-care-hero__guide,
html body .px-site-header nav.ec-primary-nav .sa341-primary-menu .sub-menu,
input:not([type="checkbox"]):not([type="radio"]), textarea, select {
  box-shadow:var(--av-3d-inset),0 4px 10px rgba(5,57,53,.08);
}

/* Mobile colour blocks are one continuous strip: no separator border/gap between rows. */
@media (max-width:980px) {
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu {
    gap:0;
    column-gap:0;
    row-gap:0;
  }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li,
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li:first-child {
    border-left:0;
    border-right:0;
    margin:0;
  }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li > a {
    margin:0;
    border:0;
    outline-offset:0;
  }
}

/* TEMAGUE Alpha Vision v3.85.81 — canonical homepage geometry after full audit.
   Replaces accumulated v3.85.73–v3.85.80 overrides with one source of truth. */

/* Top bar: retain the approved increased height; content remains structurally centred. */
@media (min-width:981px){
  html body .px-site-header .px-topbar-inner{min-height:39px;align-items:center;}
}
@media (max-width:980px){
  html body .px-site-header .px-topbar-inner{min-height:37px;align-items:center;}
}

/* Header: approved increased height with natural vertical centring. */
@media (min-width:981px){
  html body .px-site-header .px-header-shell,
  html body .px-site-header .px-header-boundary,
  html body .px-site-header .px-header-nav{height:79.2px;min-height:79.2px;}
  html body .px-site-header .px-header-boundary{align-items:center;}
}

/* Hero: image-only presentation and approved proportional height. */
body.home .ec-care-hero__story{position:relative;}
body.home .ec-care-hero__media{inset:0;}
@media (min-width:981px){
  body.home .ec-care-hero__grid,
  body.home .ec-care-hero__story,
  body.home .ec-care-hero__aside{height:540px;min-height:540px;}
  body.home .ec-care-hero__grid{--ec-hero-height:540px;}
}
@media (max-width:980px){
  body.home .ec-care-hero__grid,
  body.home .ec-care-hero__story{min-height:480px;}
}

/* Three cards below hero: one geometry authority. */
body.home .ec-care-hero-cards,
body.home .ec-care-hero-cards__left{min-width:0;}
body.home .ec-care-hero-cards__left{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));}
body.home .ec-care-hero-cards .ec-care-hero__tile,
body.home .ec-care-hero-cards .ec-care-hero__guide{box-sizing:border-box;min-width:0;}
body.home .ec-care-hero-cards .ec-care-hero__tile{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  align-content:center;
  column-gap:18px;
}
body.home .ec-care-hero-cards .ec-care-hero__tile-row{
  display:grid;
  align-content:center;
  gap:5px;
  min-width:0;
  margin:0;
}
body.home .ec-care-hero-cards .ec-care-hero__tile-row strong{margin:0;white-space:normal;}
body.home .ec-care-hero-cards .ec-care-hero__tile-row small{
  display:block;max-width:36ch;font-size:13px;line-height:1.4;font-weight:500;opacity:.84;
}
body.home .ec-care-hero-cards .ec-care-hero__tile-row em{
  display:inline-block;width:max-content;margin-top:3px;font-size:12px;line-height:1.2;
  font-style:normal;font-weight:800;text-decoration:underline;text-underline-offset:3px;
}
body.home .ec-care-hero-cards .ec-care-hero__tile-row b{display:none;}
body.home .ec-care-hero-cards .ec-care-hero__icon{flex:0 0 auto;margin:0;}
body.home .ec-care-hero-cards .ec-care-hero__guide{
  display:flex;flex-direction:column;justify-content:center;align-self:stretch;padding-block:24px;
}
@media (min-width:768px){
  body.home .ec-care-hero-cards{min-height:calc(clamp(238px,20vw,330px) + 40px);}
  body.home .ec-care-hero-cards .ec-care-hero__tile,
  body.home .ec-care-hero-cards .ec-care-hero__guide{height:100%;min-height:0;}
}
@media (max-width:980px){
  body.home .ec-care-hero-cards{grid-template-columns:1fr;}
  body.home .ec-care-hero-cards__left{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:767px){
  body.home .ec-care-hero-cards .ec-care-hero__tile,
  body.home .ec-care-hero-cards .ec-care-hero__guide{height:207px;min-height:207px;}
  body.home .ec-care-hero-cards .ec-care-hero__tile{column-gap:12px;}
  body.home .ec-care-hero-cards .ec-care-hero__tile-row small{font-size:12px;}
}

/* Why Choose Us quote circle: depth belongs to the circle, not its text. */
.av-home .av-trust blockquote{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.78),inset 0 -2px 0 rgba(5,57,53,.10),0 10px 22px rgba(5,57,53,.16);
}

/* What People Say: full-bleed photo, canonical shell inside, no overlay. */
.av-home .av-stories{
  display:block;
  width:100%;
  max-width:none;
  margin:0;
  padding:0;
  background-image:url('https://images.pexels.com/photos/4056609/pexels-photo-4056609.jpeg?auto=compress&cs=tinysrgb&w=1800');
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}
.av-home .av-stories__inner{
  display:grid;
  grid-template-columns:minmax(180px,220px) minmax(0,1fr);
  align-items:start;
  gap:28px;
  padding-top:24px;
  padding-bottom:24px;
}
.av-home .av-quotes{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:stretch;
  gap:18px;
  width:100%;
  min-width:0;
}
.av-home .av-quotes article{
  position:relative;
  display:flex;
  flex-direction:column;
  width:100%;
  min-width:0;
  max-width:none;
  height:auto;
  margin:0;
  padding:17px 20px;
  box-sizing:border-box;
  overflow:hidden;
  background:#f7f7f2;
  border:1px solid #e2e5dd;
  border-radius:9px;
  transform:none;
}
.av-home .av-quotes article p{flex:1 1 auto;min-height:0;}
.av-home .av-stories__title .av-kicker{
  display:inline-block;width:max-content;max-width:100%;padding:6px 9px;
  border:1px solid rgba(255,255,255,.76);border-radius:6px;background:rgba(247,247,242,.92);
  box-shadow:0 3px 10px rgba(16,35,62,.12);color:#536562;
}
.av-home .av-stories__title h2{
  width:max-content;max-width:100%;padding:6px 9px 8px;border-radius:6px;background:rgba(247,247,242,.88);
}
@media (max-width:980px){
  .av-home .av-stories__inner{grid-template-columns:1fr;gap:20px;}
}
@media (max-width:700px){
  .av-home .av-stories__inner{padding-block:28px;}
  .av-home .av-quotes{grid-template-columns:1fr;gap:14px;}
}


/* TEMAGUE Alpha Vision v3.85.83 — requested presentation refinements. */
/* First two hero cards intentionally remain empty visual colour fields. */
body.home .ec-care-hero-cards__left .ec-care-hero__tile{display:block;}

/* Stories: desktop composition retained; title treatment is a compact blue surface, no shadow. */
.av-home .av-stories__inner{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(360px,1.1fr);
  gap:42px;
  align-items:stretch;
  padding-top:34px;
  padding-bottom:34px;
}
.av-home .av-stories__left{display:flex;flex-direction:column;min-width:0;}
.av-home .av-stories__title{margin-bottom:22px;}
.av-home .av-stories__title .av-kicker,
.av-home .av-stories__title h2{
  display:table;
  width:auto;
  max-width:100%;
  color:#fff;
  background:rgba(38,132,224,.92);
  text-shadow:none;
  box-shadow:none;
}
.av-home .av-stories__title .av-kicker{
  margin:0 0 7px;
  padding:6px 10px;
  border-radius:5px;
}
.av-home .av-stories__title h2{
  padding:7px 12px 9px;
  border-radius:6px;
}
.av-home .av-quotes--small{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:auto;align-items:stretch;
}
.av-home .av-quotes--feature{display:grid;grid-template-columns:1fr;align-self:stretch;}
.av-home .av-quotes--feature article{height:100%;min-height:230px;justify-content:flex-end;padding:28px;}
.av-home .av-quotes article{background:#f7f7f2;}
.av-home .av-quotes article p{
  font-family:"Caveat",cursive;
  font-size:21px;
  line-height:1.28;
  font-weight:600;
  letter-spacing:0;
}
.av-home .av-quotes--feature article p{font-size:25px;line-height:1.28;}
@media (max-width:980px){
  .av-home .av-stories__inner{grid-template-columns:1fr;gap:18px;padding-block:28px;}
  .av-home .av-stories__title{margin-bottom:18px;}
  .av-home .av-quotes--small{grid-template-columns:1fr;gap:14px;margin-top:0;}
  .av-home .av-quotes--feature{display:grid;}
  .av-home .av-quotes--feature article{min-height:0;height:auto;padding:17px 20px;}
  .av-home .av-quotes article p,.av-home .av-quotes--feature article p{font-size:20px;line-height:1.3;}
}

/* TEMAGUE Alpha Vision v3.85.84 — restore approved hero-card height + angular stories title ribbons. */
/* Empty colour cards keep the same structural height as the populated design; content removal must not collapse geometry. */
@media (min-width:981px){
  body.home .ec-care-hero-cards,
  body.home .ec-care-hero-cards__left,
  body.home .ec-care-hero-cards .ec-care-hero__tile,
  body.home .ec-care-hero-cards .ec-care-hero__guide{
    min-height:calc(clamp(238px,20vw,330px) + 40px);
  }
  body.home .ec-care-hero-cards__left,
  body.home .ec-care-hero-cards .ec-care-hero__tile,
  body.home .ec-care-hero-cards .ec-care-hero__guide{
    height:auto;
    align-self:stretch;
  }
}
@media (min-width:768px) and (max-width:980px){
  body.home .ec-care-hero-cards .ec-care-hero__tile,
  body.home .ec-care-hero-cards .ec-care-hero__guide{
    min-height:207px;
    height:207px;
  }
}

/* What People Say: blue ribbons are square on the left and taper to a point on the right. */
.av-home .av-stories__title .av-kicker,
.av-home .av-stories__title h2{
  border-radius:0;
  clip-path:polygon(0 0,calc(100% - 22px) 0,100% 50%,calc(100% - 22px) 100%,0 100%);
  padding-right:34px;
}

\n\n/* TEMAGUE Alpha Vision v3.85.87 — requested content, type, testimonial transparency and desktop header alignment. */
/* Restore useful content inside the first two support cards below the hero. */
body.home .ec-care-hero-cards__left .ec-care-hero__tile{
  display:grid;
}
body.home .ec-care-hero-cards__left .ec-care-hero__icon{
  width:48px;height:48px;display:grid;place-items:center;border-radius:50%;
  background:rgba(255,255,255,.18);
}
body.home .ec-care-hero-cards__left .ec-care-hero__icon svg{
  width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;
}
body.home .ec-care-hero-cards__left .ec-care-hero__tile-row strong{font-size:20px;line-height:1.15;}

/* The values section immediately above Our Services: +1px for its text. */
.av-home .av-values strong{font-size:15px;}
.av-home .av-values small{font-size:13px;}

/* What People Say: let the photographic background remain subtly visible through the cards. */
.av-home .av-quotes article{
  background:rgba(247,247,242,.84);
  border-color:rgba(226,229,221,.82);
  backdrop-filter:blur(1.5px);
  -webkit-backdrop-filter:blur(1.5px);
}

/* Desktop header: use the exact same outer shell as .av-shell and remove the final nav inset. */
@media (min-width:981px){
  html body .px-site-header .px-header-boundary{
    width:min(calc(100% - (2 * var(--av-shell-gutter-desktop))), var(--av-shell-max));
    margin-inline:auto;
  }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li:last-child > a{
    padding-right:0;
  }
}
\n\n/* TEMAGUE Alpha Vision v3.85.88 — measured hero-card content, spacing and type refinements. */
/* Top bar: +2px height while every child remains vertically centered. */
html body .px-site-header .px-announcement-bar,
html body .px-site-header .px-topbar-shell{min-height:38px;}
html body .px-site-header .px-topbar-item,
html body .px-site-header .px-topbar-status{min-height:38px;align-items:center;}

/* Section immediately above Our Services: another +1px from v3.85.87. */
.av-home .av-values strong{font-size:16px;}
.av-home .av-values small{font-size:14px;}

/* Below-hero cards: desktop geometry is two equal left cards inside the left column.
   Content stays intentionally minimal, vertically centered and left aligned. */
body.home .ec-care-hero-cards__left .ec-care-hero__tile{
  align-items:center;
  align-content:center;
  justify-items:start;
  text-align:left;
  padding-inline:clamp(22px,2.5vw,42px);
}
body.home .ec-care-hero-cards__left .ec-care-hero__tile-row{
  align-content:center;
  justify-items:start;
  gap:7px;
  max-width:26ch;
}
body.home .ec-care-hero-cards__left .ec-care-hero__tile-row small{max-width:25ch;}

/* Right search card: give the headline more breathing room before the search field. */
body.home .ec-care-hero-cards .ec-care-hero__guide h2{margin-bottom:24px;}

/* Footer typography: +1px again, preserving the established hierarchy. */
.px-editorial-footer-wordmark{font-size:calc(24px + 2px);}
.px-editorial-footer-brand p{font-size:calc(14px + 2px);}
.px-editorial-footer-kicker{font-size:calc(10px + 2px);}
.px-editorial-footer-message h2{font-size:calc(clamp(48px,6.2vw,94px) + 2px);}
.px-editorial-social-name > span:last-child{font-size:calc(13px + 2px);}
.px-editorial-footer-link-row a{font-size:calc(12px + 2px);}
.px-editorial-footer-bottom-left{font-size:calc(11px + 2px);}
.px-editorial-footer-bottom-right{font-size:calc(11px + 2px);}

/* TEMAGUE Alpha Vision v3.85.89 — top-bar, support-card stack, values type and testimonial refinement. */
@media (min-width:981px){
  /* Requested +4px total top-bar height from the 38.2px desktop authority; content remains vertically centered. */
  html body .px-site-header .px-announcement-bar,
  html body .px-site-header .px-topbar-shell,
  html body .px-site-header .px-topbar-boundary{
    height:42.2px;
    min-height:42.2px;
    max-height:42.2px;
  }
  html body .px-site-header .px-topbar-shell,
  html body .px-site-header .px-topbar-left,
  html body .px-site-header .px-topbar-right,
  html body .px-site-header .px-topbar-item,
  html body .px-site-header .px-topbar-status{
    align-items:center;
  }
  html body .px-site-header .px-topbar-item,
  html body .px-site-header .px-topbar-status,
  html body .px-site-header .px-topbar-copy{
    font-size:13.4px;
  }
}

/* Section immediately above Our Services: +1px again. */
.av-home .av-values strong{font-size:17px;}
.av-home .av-values small{font-size:15px;}

/* First two cards remain separate cards, but each card now uses one simple vertical content flow. */
body.home .ec-care-hero-cards__left .ec-care-hero__tile{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
  text-align:left;
  gap:0;
  padding-inline:clamp(22px,2.5vw,42px);
}
body.home .ec-care-hero-cards__left .ec-care-hero__icon{display:none;}
body.home .ec-care-hero-cards__left .ec-care-hero__tile-row{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
  width:100%;
  max-width:32ch;
  gap:0;
}
body.home .ec-care-hero-cards__left .ec-care-hero__tile-row strong{
  display:block;
  width:100%;
  margin:0 0 10px;
  font-size:20px;
  line-height:1.2;
}
body.home .ec-care-hero-cards__left .ec-care-hero__tile-row small{
  display:block;
  width:100%;
  max-width:30ch;
  margin:0 0 15px;
}
body.home .ec-care-hero-cards__left .ec-care-hero__tile-row em{display:block;margin:0;}

/* What People Say: only slightly more transparent than v3.85.88. */
.av-home .av-quotes article{
  background:rgba(247,247,242,.80);
  border-color:rgba(226,229,221,.78);
}

/* TEMAGUE Alpha Vision v3.85.90 — below-hero card alignment, icons and heading scale. */
body.home .ec-care-hero-cards__left .ec-care-hero__tile{
  justify-content:center;
  align-items:flex-start;
  text-align:left;
}
body.home .ec-care-hero-cards__left .ec-care-hero__icon{
  display:grid;
  flex:0 0 auto;
  margin:0 0 12px;
}
body.home .ec-care-hero-cards__left .ec-care-hero__tile-row{
  align-items:flex-start;
  text-align:left;
  max-width:none;
}
body.home .ec-care-hero-cards__left .ec-care-hero__tile-row strong{
  font-size:22px;
  line-height:1.16;
  white-space:nowrap;
}
body.home .ec-care-hero-cards .ec-care-hero__guide h2{
  font-size:calc(clamp(26px,2.15vw,38px) + 3px);
}
@media (max-width:760px){
  body.home .ec-care-hero-cards__left .ec-care-hero__tile-row strong{white-space:normal;}
}

/* TEMAGUE Alpha Vision v3.85.91 — clean stacked hero cards + vertical header/topbar centering. */
/* First two cards: one strict left-aligned vertical stack: icon -> title -> description -> link. */
body.home .ec-care-hero-cards__left .ec-care-hero__tile{
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  align-items:flex-start !important;
  text-align:left !important;
}
body.home .ec-care-hero-cards__left .ec-care-hero__icon{
  display:grid !important;
  align-self:flex-start !important;
  margin:0 0 12px 0 !important;
}
body.home .ec-care-hero-cards__left .ec-care-hero__tile-row{
  display:flex !important;
  flex-direction:column !important;
  justify-content:flex-start !important;
  align-items:flex-start !important;
  text-align:left !important;
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  gap:0 !important;
}
body.home .ec-care-hero-cards__left .ec-care-hero__tile-row strong,
body.home .ec-care-hero-cards__left .ec-care-hero__tile-row small,
body.home .ec-care-hero-cards__left .ec-care-hero__tile-row em{
  display:block !important;
  align-self:flex-start !important;
  text-align:left !important;
  margin-left:0 !important;
  padding-left:0 !important;
}
body.home .ec-care-hero-cards__left .ec-care-hero__tile-row strong{
  width:100%;
  margin-bottom:10px !important;
}
body.home .ec-care-hero-cards__left .ec-care-hero__tile-row small{
  width:100%;
  max-width:30ch !important;
  margin-bottom:15px !important;
}
body.home .ec-care-hero-cards__left .ec-care-hero__tile-row em{margin-bottom:0 !important;}

/* Right search card: 2px smaller than v3.85.90. */
body.home .ec-care-hero-cards .ec-care-hero__guide h2{
  font-size:calc(clamp(26px,2.15vw,38px) + 1px);
}

/* Header and top bar: explicitly keep every content group vertically centered. */
html body .px-site-header .px-topbar-shell,
html body .px-site-header .px-topbar-boundary,
html body .px-site-header .px-topbar-inner,
html body .px-site-header .px-topbar-left,
html body .px-site-header .px-topbar-right,
html body .px-site-header .px-topbar-item,
html body .px-site-header .px-topbar-status,
html body .px-site-header .px-header-shell,
html body .px-site-header .px-header-boundary,
html body .px-site-header .px-header-nav,
html body .px-site-header .px-desktop-header-controls,
html body .px-site-header .px-mobile-header-actions{
  align-items:center !important;
}
@media (min-width:981px){
  html body .px-site-header .px-header-shell,
  html body .px-site-header .px-header-boundary,
  html body .px-site-header .px-header-nav,
  html body .px-site-header .px-desktop-header-controls{
    min-height:79.2px;
  }
}
/* v3.86.00 — Homepage Settings integration helpers */
.ec-care-hero__media video.ec-care-hero__slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.av-footer__bottom a{display:inline;color:inherit;text-decoration:none;margin:0;font-size:inherit;line-height:inherit}
.av-footer__bottom a:hover{text-decoration:underline}

/* =========================================================
   TEMAGUE Alpha Vision v3.86.04
   Minimal nested submenu positioning fix.
   Deliberately changes ONLY nested submenu positioning/visibility.
   No typography, cards, sections, images, footer, or link styling.
   ========================================================= */
@media (min-width:981px){
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li > .sub-menu{
    overflow:visible !important;
  }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu .sub-menu > li.menu-item-has-children{
    position:relative !important;
    overflow:visible !important;
  }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu .sub-menu > li.menu-item-has-children > .sub-menu{
    position:absolute !important;
    top:0 !important;
    left:100% !important;
    right:auto !important;
    z-index:10040 !important;
    margin:0 !important;
  }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu .sub-menu > li.menu-item-has-children:hover > .sub-menu,
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu .sub-menu > li.menu-item-has-children:focus-within > .sub-menu{
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
  }
}
@media (max-width:980px){
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu .sub-menu li.menu-item-has-children > .sub-menu{
    position:static !important;
    inset:auto !important;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    transform:none !important;
  }
}

/* TEMAGUE Alpha Vision v3.86.06 — scoped navigation/card/topbar/footer refinement. */
/* Desktop nested menu: a real second panel, fully styled and isolated from page content. */
@media (min-width:981px){
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu > li > .sub-menu{overflow:visible!important;}
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu .sub-menu > li.menu-item-has-children{position:relative!important;overflow:visible!important;}
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu .sub-menu > li.menu-item-has-children > .sub-menu{
    display:none!important;position:absolute!important;top:-7px!important;left:calc(100% + 1px)!important;right:auto!important;
    width:230px!important;min-width:230px!important;max-width:230px!important;margin:0!important;padding:6px 0!important;
    list-style:none!important;background:#fff!important;border:1px solid #dfe4e1!important;border-radius:10px!important;
    overflow:hidden!important;opacity:1!important;visibility:visible!important;transform:none!important;z-index:10050!important;
  }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu .sub-menu > li.menu-item-has-children:hover > .sub-menu,
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu .sub-menu > li.menu-item-has-children:focus-within > .sub-menu{display:block!important;}
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu .sub-menu .sub-menu > li{display:block!important;width:100%!important;margin:0!important;padding:0!important;}
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu .sub-menu .sub-menu > li > a{
    box-sizing:border-box!important;display:flex!important;align-items:center!important;width:100%!important;min-height:48px!important;
    margin:0!important;padding:10px 18px!important;background:#fff!important;color:#123b38!important;border:0!important;
    border-bottom:1px solid #edf0ee!important;font-family:'Nunito Sans',sans-serif!important;font-size:16px!important;
    font-weight:600!important;line-height:1.25!important;text-decoration:none!important;white-space:normal!important;
  }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu .sub-menu .sub-menu > li:last-child > a{border-bottom:0!important;}
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu .sub-menu .sub-menu > li > a:hover,
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu .sub-menu .sub-menu > li > a:focus-visible{background:#0b6963!important;color:#fff!important;}
}
/* Mobile nested menu stays in flow and never escapes the viewport. */
@media (max-width:980px){
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu .sub-menu li.menu-item-has-children > .sub-menu{
    position:static!important;inset:auto!important;width:100%!important;min-width:0!important;max-width:none!important;margin:0!important;
    padding:0!important;border:0!important;border-radius:0!important;transform:none!important;box-shadow:none!important;
  }
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu .sub-menu li.menu-item-has-children.submenu-open > .sub-menu{display:block!important;}
  html body .px-site-header nav.ec-primary-nav .sa341-primary-menu .sub-menu .sub-menu a{padding-left:26px!important;background:#f4f7f5!important;color:#123b38!important;}
}
/* Top bar: +2px height and +1px type from the current approved state. */
@media (min-width:981px){
  html body .px-site-header .px-announcement-bar,
  html body .px-site-header .px-topbar-shell,
  html body .px-site-header .px-topbar-boundary{height:44.2px!important;min-height:44.2px!important;max-height:44.2px!important;}
  html body .px-site-header .px-topbar-item,
  html body .px-site-header .px-topbar-status,
  html body .px-site-header .px-topbar-copy{font-size:14.4px!important;align-items:center!important;}
}
/* All three post-hero cards: measured authority is 278–370px desktop from v3.85.84 clamp; center content at every viewport. */
body.home .ec-care-hero-cards .ec-care-hero__tile,
body.home .ec-care-hero-cards .ec-care-hero__guide{box-sizing:border-box!important;display:flex!important;flex-direction:column!important;justify-content:center!important;align-content:center!important;}
body.home .ec-care-hero-cards__left .ec-care-hero__tile{align-items:flex-start!important;text-align:left!important;}
body.home .ec-care-hero-cards__left .ec-care-hero__tile-row{flex:0 0 auto!important;justify-content:center!important;}
body.home .ec-care-hero-cards__left .ec-care-hero__tile-link{display:inline!important;color:inherit!important;text-decoration:none!important;font:inherit!important;}
body.home .ec-care-hero-cards__left .ec-care-hero__tile-link:hover,
body.home .ec-care-hero-cards__left .ec-care-hero__tile-link:focus-visible{text-decoration:underline!important;text-underline-offset:3px!important;}
@media (max-width:980px){
  body.home .ec-care-hero-cards .ec-care-hero__tile,
  body.home .ec-care-hero-cards .ec-care-hero__guide{min-height:207px!important;height:207px!important;justify-content:center!important;}
}
@media (max-width:620px){
  body.home .ec-care-hero-cards__left{grid-template-columns:1fr!important;}
  body.home .ec-care-hero-cards .ec-care-hero__tile,
  body.home .ec-care-hero-cards .ec-care-hero__guide{min-height:210px!important;height:auto!important;padding-block:26px!important;justify-content:center!important;}
}
/* Accessible, contrast-safe hover states for homepage/footer links. */
.av-home a:hover,.av-home a:focus-visible{filter:brightness(.82);}
.av-footer a:hover,.av-footer a:focus-visible{color:#fff!important;text-decoration:underline;text-underline-offset:3px;}
/* Footer type +1px and real social brand SVGs. */
.av-footer p,.av-footer a{font-size:12px;}
.av-footer strong{font-size:13px;}
.av-footer__bottom{font-size:11px;}
.av-footer .av-social{display:flex;align-items:center;gap:10px;margin:9px 0 10px;}
.av-footer .av-social a{display:inline-grid;place-items:center;width:30px;height:30px;margin:0;border:1px solid rgba(255,255,255,.28);border-radius:7px;color:#fff;text-decoration:none;}
.av-footer .av-social a:hover,.av-footer .av-social a:focus-visible{background:#fff;color:#064c49!important;filter:none;}
.av-footer .av-social svg{display:block;width:16px;height:16px;fill:currentColor;stroke:currentColor;stroke-width:1.7;}
.av-footer .av-social svg rect,.av-footer .av-social svg circle{fill:none;}

/* TEMAGUE Alpha Vision v3.86.07 — footer typography regression fix.
   Restore the approved footer baseline and apply the requested +1px exactly.
   This intentionally overrides the accidental smaller v3.86.06 footer values only. */
.av-footer p,
.av-footer a{font-size:15px!important;}
.av-footer strong{font-size:16px!important;}
.av-footer__bottom{font-size:14px!important;}
.av-footer .av-social{font-size:19px;}
.av-footer .av-social a{font-size:inherit!important;}


/* TEMAGUE Alpha Vision v3.86.08 — focused responsive polish. */
/* Mobile: cards 1+2 remain one row; guide/search card spans the row below. */
@media (max-width:620px){
  body.home .ec-care-hero-cards__left{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    width:100%!important;
  }
  body.home .ec-care-hero-cards .ec-care-hero__tile{
    min-height:210px!important;
    height:210px!important;
    padding:22px 16px!important;
    justify-content:center!important;
  }
  body.home .ec-care-hero-cards .ec-care-hero__guide{
    min-height:210px!important;
    height:auto!important;
    padding:26px 22px!important;
    justify-content:center!important;
  }
  body.home .ec-care-hero-cards__left .ec-care-hero__tile-row{max-width:100%!important;}
  body.home .ec-care-hero-cards__left .ec-care-hero__tile-row strong{white-space:normal!important;}
}

/* Our Services mobile heart: keep the whole badge inside the image so its lower edge cannot clip. */
@media (max-width:600px){
  .av-services .av-service figure i{bottom:10px!important;z-index:3!important;}
  .av-services .av-service>div{padding-top:18px!important;}
}

/* Image-caption contrast that remains readable on both bright and dark photography. */
.av-intro__photo figcaption,
.av-trust__photo figcaption{
  color:#fff!important;
  background:rgba(4,36,34,.48);
  border:1px solid rgba(255,255,255,.18);
  border-radius:12px;
  padding:10px 14px 12px;
  text-shadow:0 2px 7px rgba(0,0,0,.72),0 0 1px rgba(0,0,0,.9)!important;
  box-shadow:0 8px 22px rgba(0,0,0,.16);
  -webkit-backdrop-filter:blur(3px);
  backdrop-filter:blur(3px);
}

/* Font Awesome brand icons: use the actual brand glyphs, including Threads. */
.av-footer .av-social a{font-size:17px!important;line-height:1!important;}
.av-footer .av-social i{display:block;font-size:17px;line-height:1;color:currentColor;}

/* Floating Back to Top — compact, theme-matched, accessible and unobtrusive. */
.av-floating-backtop{
  position:fixed;right:22px;bottom:22px;z-index:999;
  width:46px;height:46px;border:1px solid rgba(255,255,255,.34);border-radius:50%;
  display:grid;place-items:center;padding:0;cursor:pointer;
  background:#08665f;color:#fff;box-shadow:0 9px 24px rgba(4,65,60,.25);
  opacity:0;visibility:hidden;transform:translateY(10px);
  transition:opacity .22s ease,transform .22s ease,visibility .22s ease,background .2s ease;
}
.av-floating-backtop span{font:700 22px/1 "Plus Jakarta Sans",sans-serif;transform:translateY(-1px);}
.av-floating-backtop.is-visible{opacity:1;visibility:visible;transform:none;}
.av-floating-backtop:hover,.av-floating-backtop:focus-visible{background:#d7f16d;color:#18443f;outline:none;}
.av-floating-backtop:focus-visible{box-shadow:0 0 0 3px rgba(215,241,109,.38),0 9px 24px rgba(4,65,60,.25);}
@media (max-width:600px){.av-floating-backtop{right:14px;bottom:14px;width:42px;height:42px;}}
@media (prefers-reduced-motion:reduce){.av-floating-backtop{transition:none;scroll-behavior:auto;}}

/* TEMAGUE Alpha Vision v3.86.09 — editorial Page/Single redesign. */
body.page:not(.home), body.single { background:#fff!important; color:#173a37!important; }
body.page:not(.home) .wp-site-blocks, body.single .wp-site-blocks { background:#fff!important; }
.av-article-shell{box-sizing:border-box;max-width:none!important;margin:0!important;padding:150px max(24px,calc((100vw - 1240px)/2)) 96px!important;background:linear-gradient(180deg,#f1f6f2 0,#f1f6f2 330px,#fff 330px,#fff 100%);color:#173a37;}
.av-article-hero{max-width:920px!important;margin:0 auto 44px!important;padding:0!important;}
.av-article-eyebrow,.av-article-eyebrow a{margin:0 0 16px!important;color:#08746c!important;font-size:13px!important;font-weight:800!important;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;}
.av-article-title{max-width:850px;margin:0!important;color:#123b38!important;font-size:clamp(42px,6vw,76px)!important;line-height:.98!important;letter-spacing:-.045em!important;font-weight:800!important;}
.av-article-meta{gap:18px!important;margin-top:20px!important;color:#56706d!important;font-size:14px!important;}
.av-article-featured{max-width:1120px!important;margin:0 auto 0!important;border-radius:24px;overflow:hidden;box-shadow:0 22px 54px rgba(18,59,56,.12);}
.av-article-featured img{display:block;width:100%;max-height:620px;object-fit:cover;}
.av-article-card{position:relative;max-width:880px!important;margin:-28px auto 0!important;padding:64px 60px 52px!important;background:#fff;border:1px solid #dfe8e4;border-radius:22px;box-shadow:0 16px 46px rgba(18,59,56,.08);}
.av-article-card .wp-block-post-content{margin-top:0!important;color:#294b48!important;font-size:18px;line-height:1.82;}
.av-article-card .wp-block-post-content p{color:#294b48;}
.av-article-card .wp-block-post-content h2,.av-article-card .wp-block-post-content h3,.av-article-card .wp-block-post-content h4{color:#123b38;line-height:1.15;letter-spacing:-.025em;margin-top:1.7em;}
.av-article-card .wp-block-post-content a{color:#08746c;font-weight:700;text-decoration-thickness:1px;text-underline-offset:3px;}
.av-article-card .wp-block-post-content a:hover{color:#034d48;}
.av-article-card .wp-block-post-content blockquote{margin:36px 0;padding:24px 28px;border-left:4px solid #91b824;background:#f3f7e7;color:#173a37;border-radius:0 14px 14px 0;}
.av-article-card .wp-block-post-content img{border-radius:14px;}
.av-article-card .wp-block-post-content hr{border:0;border-top:1px solid #dfe8e4;margin:42px 0;}
.av-article-share{margin-top:54px;padding-top:26px;border-top:1px solid #dfe8e4;}
.av-article-share__label{display:block;margin-bottom:14px;color:#123b38;font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;}
.av-article-share__links{display:flex;flex-wrap:wrap;gap:10px;}
.av-article-share__links a{display:inline-flex;align-items:center;gap:9px;min-height:42px;padding:0 15px;border:1px solid #cfdcd7;border-radius:999px;color:#123b38!important;background:#fff;text-decoration:none!important;font-size:14px;font-weight:700;transition:background .18s ease,color .18s ease,border-color .18s ease,transform .18s ease;}
.av-article-share__links a:hover,.av-article-share__links a:focus-visible{background:#08665f;color:#fff!important;border-color:#08665f;transform:translateY(-1px);}
.av-article-share__links i{font-size:15px;line-height:1;}
@media(max-width:700px){
 .av-article-shell{padding:118px 16px 62px!important;background:linear-gradient(180deg,#f1f6f2 0,#f1f6f2 260px,#fff 260px,#fff 100%);}
 .av-article-hero{margin-bottom:28px!important;}
 .av-article-title{font-size:clamp(38px,12vw,56px)!important;line-height:1.02!important;}
 .av-article-featured{border-radius:16px;}
 .av-article-card{margin:-12px 0 0!important;padding:38px 22px 34px!important;border-radius:16px;}
 .av-article-card .wp-block-post-content{font-size:16.5px;line-height:1.76;}
 .av-article-share__links a{padding:0;width:42px;justify-content:center;}
 .av-article-share__links a span{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
}

/* TEMAGUE Alpha Vision v3.86.10 — Page/Single geometry correction + TOC. */
body.page:not(.home) .av-article-shell,body.single .av-article-shell{padding:94px max(24px,calc((100vw - 1240px)/2)) 88px!important;background:#fff!important;}
.av-page-shell .av-article-hero,.av-single-shell .av-article-hero{box-sizing:border-box;max-width:1240px!important;margin:0 auto 28px!important;padding:34px 40px!important;background:#f1f6f2;border-radius:22px;}
.av-page-shell .av-article-title,.av-single-shell .av-article-title{max-width:900px!important;font-size:clamp(34px,4.2vw,54px)!important;line-height:1.06!important;letter-spacing:-.035em!important;}
.av-page-shell .av-article-featured,.av-single-shell .av-article-featured{max-width:1240px!important;margin:0 auto 30px!important;}
.av-page-shell .av-article-card{max-width:920px!important;margin:0 auto!important;padding:54px 58px 46px!important;}
.av-single-shell .av-article-hero{margin-left:0!important;margin-right:0!important;}
.av-single-shell .av-article-featured{margin-left:0!important;margin-right:0!important;}
.av-article-breadcrumb{display:flex;flex-wrap:wrap;gap:7px;align-items:center;margin:0 0 14px;color:#607673;font-size:13px;font-weight:700;line-height:1.45;}
.av-article-breadcrumb a{color:#08746c;text-decoration:none}.av-article-breadcrumb a:hover{color:#034d48;text-decoration:underline;text-underline-offset:3px}.av-article-breadcrumb [aria-current="page"]{max-width:44ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.av-single-layout{display:grid!important;grid-template-columns:minmax(0,820px) minmax(220px,280px);gap:72px;align-items:start;max-width:1172px!important;margin:0!important;padding:0!important;}
.av-single-layout>.av-article-card{width:100%;max-width:none!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:#fff!important;}
.av-single-layout .av-article-card .wp-block-post-content{font-size:18px;line-height:1.82;}
.av-toc-column{margin:0!important;padding:0!important;align-self:stretch;}
.av-article-toc{position:sticky;top:118px;padding:22px 22px 20px;border:1px solid #dfe8e4;border-radius:16px;background:#f7faf8;}
.av-article-toc>strong{display:block;margin:0 0 13px;color:#123b38;font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;}
.av-article-toc ol{display:grid;gap:9px;margin:0;padding:0;list-style:none;counter-reset:avtoc;}.av-article-toc li{counter-increment:avtoc;margin:0;padding:0}.av-article-toc a{display:grid;grid-template-columns:22px 1fr;gap:6px;color:#4b6662;text-decoration:none;font-size:13px;font-weight:650;line-height:1.45}.av-article-toc a:before{content:counter(avtoc,decimal-leading-zero);color:#8aa09c;font-size:10px;font-weight:800;padding-top:2px}.av-article-toc a:hover,.av-article-toc a:focus-visible{color:#08746c}.av-article-toc.is-empty{display:none}
.av-back-home{display:inline-flex;align-items:center;gap:8px;margin-top:38px;color:#08746c!important;font-size:14px;font-weight:800;text-decoration:none!important}.av-back-home:hover,.av-back-home:focus-visible{color:#034d48!important;text-decoration:underline!important;text-underline-offset:4px}
@media(max-width:900px){.av-single-layout{grid-template-columns:1fr;gap:28px;max-width:none!important}.av-toc-column{order:-1}.av-article-toc{position:static;top:auto}.av-single-layout>.av-article-card{padding:0!important}.av-page-shell .av-article-card{padding:40px 28px 36px!important}}
@media(max-width:700px){body.page:not(.home) .av-article-shell,body.single .av-article-shell{padding:76px 16px 58px!important}.av-page-shell .av-article-hero,.av-single-shell .av-article-hero{margin-bottom:20px!important;padding:24px 22px!important;border-radius:16px}.av-page-shell .av-article-title,.av-single-shell .av-article-title{font-size:clamp(30px,9vw,42px)!important;line-height:1.08!important}.av-page-shell .av-article-featured,.av-single-shell .av-article-featured{margin-bottom:24px!important}.av-page-shell .av-article-card{margin:0!important;padding:32px 22px 30px!important}.av-article-breadcrumb{font-size:12px}.av-article-breadcrumb [aria-current="page"]{max-width:24ch}}

/* TEMAGUE Alpha Vision v3.86.11 — canonical Page/Single header spacing + left alignment.
   Scoped deliberately to article templates so homepage/header/footer remain untouched. */
body.page:not(.home) .av-article-shell,
body.single .av-article-shell{
  padding-top:28px!important;
}

/* WordPress constrained-layout assigns child margins/max-widths. Keep breadcrumb,
   title and meta on one intentional left edge inside the article hero. */
.av-page-shell .av-article-hero,
.av-single-shell .av-article-hero{
  margin-top:0!important;
}
.av-page-shell .av-article-hero > *,
.av-single-shell .av-article-hero > *{
  margin-left:0!important;
  margin-right:auto!important;
}
.av-single-shell .av-article-breadcrumb,
.av-single-shell .av-article-title,
.av-single-shell .av-article-meta{
  width:100%!important;
  max-width:900px!important;
  justify-content:flex-start!important;
  text-align:left!important;
}
.av-single-shell .av-article-meta{
  margin-top:20px!important;
}
.av-single-shell .av-article-meta > *{
  margin-left:0!important;
  margin-right:0!important;
}

@media(max-width:700px){
  body.page:not(.home) .av-article-shell,
  body.single .av-article-shell{
    padding-top:22px!important;
  }
}

/* TEMAGUE Alpha Vision v3.86.12 — related articles below the automatic TOC. */
.av-related-posts{margin-top:18px;padding:20px 20px 18px;border:1px solid #dfe8e4;border-radius:16px;background:#fff;}
.av-related-posts__title{display:block;margin:0 0 12px;color:#123b38;font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;}
.av-related-posts__list{display:grid;gap:0;}
.av-related-posts__item{margin:0;padding:11px 0;border-top:1px solid #e7eeeb;}
.av-related-posts__item:first-child{padding-top:0;border-top:0;}
.av-related-posts__item:last-child{padding-bottom:0;}
.av-related-posts__item a{display:block;color:#294e4a;font-size:13px;font-weight:700;line-height:1.45;text-decoration:none;}
.av-related-posts__item a:hover,.av-related-posts__item a:focus-visible{color:#08746c;text-decoration:underline;text-underline-offset:3px;}
.av-related-posts__empty{margin:0;color:#607773;font-size:13px;line-height:1.55;}
@media(max-width:900px){.av-related-posts{margin-top:14px;}}

/* TEMAGUE Alpha Vision v3.86.13 — full breadcrumb title, no truncation. */
.av-single-shell .av-article-breadcrumb [aria-current="page"]{
  max-width:none!important;
  min-width:0!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
}
