/* Homepage hero composition
   Scoped to .homepage so the existing site remains unchanged below and elsewhere. */

.homepage {
    --hero-carbon: #171d21;
    --hero-ink: #051725;
    --hero-paper: #f5f4f0;
    --hero-white: #ffffff;
    --hero-copper: #ad4f21;
    --hero-copper-dark: #8f3f19;
    --hero-amber: #f0a12e;
    --hero-soft-gray: #e4e4df;
    --hero-muted: #62686c;
    --hero-line: #d8d8d2;
    --hero-font-display: "Manrope", "Arial", sans-serif;
    background: var(--hero-paper);
}

.homepage.hero-menu-open {
    overflow: hidden;
}

.homepage .hero-composition,
.homepage .hero-composition * {
    box-sizing: border-box;
}

.homepage .hero-composition {
    width: 100%;
    padding: 18px var(--site-shell-gutter) 12px;
    background: var(--hero-paper);
    color: var(--hero-carbon);
}

.homepage .hero-shell {
    width: 100%;
    max-width: var(--site-shell-max);
    margin: 0 auto;
    padding: 0 10px 10px;
    overflow: hidden;
    background: var(--hero-carbon);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 22px;
}

.homepage .hero-nav {
    position: relative;
    z-index: 30;
    display: flex;
    min-height: 64px;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    padding: 4px 12px 4px 16px;
}

.homepage .hero-logo {
    display: flex;
    width: clamp(188px, 11vw, 206px);
    height: auto;
    flex: 0 0 auto;
    align-items: center;
    overflow: visible;
}

.homepage .hero-logo img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
    object-position: left center;
}

.homepage .hero-desktop-nav {
    display: flex;
    align-items: center;
    gap: clamp(20px, 1.65vw, 32px);
}

.homepage .hero-desktop-nav > a {
    position: relative;
    color: rgba(245, 244, 240, 0.82);
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.79rem;
    font-weight: 500;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    transition: color 160ms ease;
}

.homepage .hero-desktop-nav > a:not(.hero-nav-cta)::after {
    position: absolute;
    right: 0;
    bottom: -6px;
    left: 0;
    height: 1px;
    content: "";
    background: var(--hero-copper);
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 180ms ease;
}

.homepage .hero-desktop-nav > a:hover,
.homepage .hero-desktop-nav > a:focus-visible {
    color: var(--hero-white);
}

.homepage .hero-desktop-nav > a:not(.hero-nav-cta):hover::after,
.homepage .hero-desktop-nav > a:not(.hero-nav-cta):focus-visible::after {
    transform: scaleX(1);
    transform-origin: left;
}

.homepage .hero-desktop-nav .hero-nav-cta {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    gap: 13px;
    padding: 0 18px;
    color: var(--hero-white);
    background: var(--hero-copper);
    border-radius: 10px;
    transition: background 160ms ease;
}

.homepage .hero-nav-cta span,
.homepage .hero-primary-action span,
.homepage .hero-secondary-action span,
.homepage .hero-rail-arrow,
.homepage .hero-project-arrow {
    display: inline-block;
    transition: transform 180ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.homepage .hero-nav-cta:hover,
.homepage .hero-nav-cta:focus-visible,
.homepage .hero-primary-action:hover,
.homepage .hero-primary-action:focus-visible {
    background: var(--hero-copper-dark);
}

.homepage .hero-nav-cta:hover span,
.homepage .hero-nav-cta:focus-visible span,
.homepage .hero-primary-action:hover span,
.homepage .hero-primary-action:focus-visible span,
.homepage .hero-project-cta:hover .hero-project-arrow,
.homepage .hero-project-cta:focus-visible .hero-project-arrow {
    transform: translateX(4px);
}

.homepage .hero-menu-toggle,
.homepage .hero-mobile-nav {
    display: none;
}

.homepage .hero-panel {
    position: relative;
    display: grid;
    min-height: clamp(540px, 32vw, 620px);
    grid-template-columns: minmax(0, 59%) minmax(380px, 41%);
    overflow: hidden;
    background: var(--hero-paper);
    border: 1px solid rgba(5, 23, 37, 0.12);
    border-radius: 16px;
}

.homepage .hero-panel:focus {
    outline: none;
}

.homepage .hero-content {
    position: relative;
    z-index: 2;
    display: flex;
    max-width: 1000px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: clamp(42px, 3.2vw, 58px) 24px clamp(38px, 2.8vw, 52px) clamp(40px, 4vw, 76px);
    text-align: left;
}

.homepage .hero-eyebrow {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0 0 clamp(22px, 1.6vw, 30px);
    color: var(--hero-muted);
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: clamp(0.64rem, 0.75vw, 0.75rem);
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.homepage .hero-eyebrow > span {
    width: 22px;
    height: 2px;
    background: var(--hero-copper);
}

.homepage .hero-eyebrow b {
    color: var(--hero-copper);
    font-weight: 600;
}

.homepage .hero-title {
    max-width: 940px;
    margin: 0;
    color: var(--hero-carbon);
    font-family: var(--hero-font-display);
    font-size: clamp(3.7rem, 6.15vw, 6.7rem);
    font-weight: 700;
    line-height: 0.89;
    letter-spacing: -0.064em;
}

.homepage .hero-copy {
    max-width: 570px;
    margin: clamp(24px, 2vw, 34px) 0 0;
    color: #40484c;
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: clamp(0.98rem, 1.15vw, 1.1rem);
    line-height: 1.55;
}

.homepage .hero-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
    margin-top: clamp(22px, 1.8vw, 28px);
}

.homepage .hero-primary-action,
.homepage .hero-secondary-action {
    display: inline-flex;
    min-height: 50px;
    align-items: center;
    justify-content: center;
    gap: 18px;
    padding: 0 20px;
    border: 1px solid transparent;
    border-radius: 10px;
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.86rem;
    font-weight: 600;
    text-decoration: none;
}

.homepage .hero-primary-action {
    color: var(--hero-white);
    background: var(--hero-copper);
}

.homepage .hero-secondary-action {
    color: var(--hero-carbon);
    border-color: #bebfbb;
    background: transparent;
    transition: color 160ms ease, border-color 160ms ease, background 160ms ease;
}

.homepage .hero-secondary-action:hover,
.homepage .hero-secondary-action:focus-visible {
    color: var(--hero-white);
    border-color: var(--hero-ink);
    background: var(--hero-ink);
}

.homepage .hero-secondary-action:hover span,
.homepage .hero-secondary-action:focus-visible span,
.homepage .hero-rail-item:hover .hero-rail-arrow,
.homepage .hero-rail-item:focus-visible .hero-rail-arrow {
    transform: translate(3px, -3px);
}

.homepage .hero-visual {
    position: relative;
    z-index: 1;
    min-width: 0;
}

.homepage .hero-visual-guide {
    position: absolute;
    top: 32px;
    right: 26px;
    left: 14px;
    display: flex;
    align-items: center;
    gap: 10px;
    color: #929692;
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.58rem;
    font-weight: 600;
    letter-spacing: 0.12em;
}

.homepage .hero-visual-guide i {
    height: 1px;
    flex: 1;
    background: repeating-linear-gradient(to right, #d2d2cc 0 2px, transparent 2px 6px);
}

.homepage .authority-window {
    position: absolute;
    top: 48px;
    right: clamp(30px, 3vw, 58px);
    bottom: -72px;
    left: clamp(22px, 2.5vw, 48px);
    min-height: 500px;
    overflow: hidden;
    background: var(--hero-ink);
    border: 1px solid #203746;
    border-radius: 220px 220px 24px 24px;
}

.homepage .authority-window::before {
    position: absolute;
    inset: 0;
    content: "";
    background:
        linear-gradient(90deg, transparent 0 49.75%, rgba(255, 255, 255, 0.08) 49.75% 50%, transparent 50%),
        linear-gradient(180deg, transparent 0 72%, rgba(173, 79, 33, 0.84) 72% 73.4%, transparent 73.4%);
    pointer-events: none;
}

.homepage .authority-window-head {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: clamp(62px, 7vw, 100px) clamp(24px, 3vw, 42px) 0;
    color: rgba(245, 244, 240, 0.72);
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.61rem;
    font-weight: 500;
    line-height: 1.45;
    letter-spacing: 0.1em;
    text-align: right;
    text-transform: uppercase;
}

.homepage .authority-window-head img {
    width: clamp(64px, 6vw, 92px);
    height: auto;
    padding: 10px;
    background: var(--hero-paper);
    border-radius: 6px;
}

.homepage .authority-document {
    position: absolute;
    z-index: 3;
    right: clamp(20px, 2vw, 36px);
    bottom: 80px;
    left: clamp(20px, 2vw, 36px);
    min-height: 255px;
    padding: clamp(22px, 2.4vw, 34px);
    color: var(--hero-carbon);
    background: var(--hero-paper);
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 12px 12px 3px 3px;
}

.homepage .authority-document-meta,
.homepage .authority-document-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    color: #737976;
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: clamp(0.5rem, 0.58vw, 0.6rem);
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.1em;
}

.homepage .authority-document h2 {
    max-width: 16ch;
    margin: 24px 0 18px;
    color: var(--hero-carbon);
    font-family: var(--hero-font-display);
    font-size: clamp(1.45rem, 1.8vw, 2.25rem);
    font-weight: 700;
    line-height: 1.02;
    letter-spacing: -0.04em;
}

.homepage .authority-document-rule {
    width: 58px;
    height: 3px;
    margin-bottom: 14px;
    background: var(--hero-copper);
}

.homepage .authority-document p {
    max-width: 31ch;
    margin: 0 0 28px;
    color: #596064;
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: clamp(0.68rem, 0.8vw, 0.78rem);
    line-height: 1.5;
}

.homepage .authority-document-footer {
    padding-top: 12px;
    border-top: 1px solid var(--hero-line);
}

.homepage .authority-window-index {
    position: absolute;
    z-index: 2;
    right: 28px;
    bottom: 22px;
    color: rgba(245, 244, 240, 0.3);
    font-family: var(--hero-font-display);
    font-size: 3.8rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.08em;
}

.homepage .hero-visual-caption {
    position: absolute;
    right: 2px;
    bottom: 44px;
    z-index: 5;
    display: flex;
    align-items: center;
    gap: 9px;
    color: var(--hero-carbon);
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.54rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    writing-mode: vertical-rl;
}

.homepage .hero-visual-caption i {
    width: 1px;
    height: 34px;
    background: var(--hero-copper);
}

.homepage .hero-rail {
    display: grid;
    min-height: 104px;
    grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(300px, 1.32fr);
    gap: 8px;
    padding-top: 8px;
}

.homepage .hero-rail-item,
.homepage .hero-project-cta {
    position: relative;
    display: flex;
    min-width: 0;
    align-items: center;
    padding: 20px 22px;
    overflow: hidden;
    border-radius: 12px;
    font-family: var(--font-body, "Inter", sans-serif);
    text-decoration: none;
}

.homepage .hero-rail-item {
    color: var(--hero-paper);
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: #192229;
    transition: border-color 160ms ease, background 160ms ease;
}

.homepage .hero-rail-item:hover,
.homepage .hero-rail-item:focus-visible {
    border-color: rgba(255, 255, 255, 0.3);
    background: #202b32;
}

.homepage .hero-rail-index {
    position: absolute;
    top: 15px;
    left: 20px;
    color: rgba(245, 244, 240, 0.42);
    font-size: 0.58rem;
    font-weight: 600;
    letter-spacing: 0.1em;
}

.homepage .hero-rail-item strong {
    margin-top: 18px;
    font-size: clamp(0.8rem, 1vw, 0.98rem);
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.homepage .hero-rail-arrow {
    margin: 18px 0 0 auto;
    color: var(--hero-copper);
    font-size: 1.05rem;
}

.homepage .hero-project-cta {
    justify-content: space-between;
    gap: 24px;
    color: var(--hero-white);
    background: var(--hero-copper);
    transition: background 160ms ease;
}

.homepage .hero-project-cta:hover,
.homepage .hero-project-cta:focus-visible {
    background: var(--hero-copper-dark);
}

.homepage .hero-project-cta > span:first-child {
    max-width: 8ch;
    font-family: var(--hero-font-display);
    font-size: clamp(1.3rem, 1.8vw, 1.75rem);
    font-weight: 700;
    line-height: 1.06;
    letter-spacing: -0.04em;
}

.homepage .hero-project-arrow {
    display: grid;
    width: 48px;
    height: 48px;
    flex: 0 0 auto;
    place-items: center;
    color: var(--hero-paper);
    background: var(--hero-carbon);
    border-radius: 50%;
    font-size: 1.45rem;
}

.homepage .hero-composition a:focus-visible,
.homepage .hero-menu-toggle:focus-visible {
    outline: 3px solid var(--hero-amber);
    outline-offset: 3px;
}

.homepage .hero-intro {
    animation: heroContentIn 520ms cubic-bezier(0.2, 0.8, 0.2, 1) both;
}

.homepage .hero-visual-reveal {
    animation: heroVisualIn 620ms 100ms cubic-bezier(0.2, 0.8, 0.2, 1) both;
}

@keyframes heroContentIn {
    from { opacity: 0; transform: translateY(16px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes heroVisualIn {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 1199px) {
    .homepage .hero-panel {
        grid-template-columns: minmax(0, 57%) minmax(330px, 43%);
    }

    .homepage .hero-content {
        padding-left: clamp(34px, 4.5vw, 56px);
    }

    .homepage .hero-title {
        font-size: clamp(3.55rem, 6.25vw, 5.35rem);
    }

    .homepage .authority-window {
        right: 28px;
        left: 24px;
    }
}

@media (max-width: 1023px) {
    .homepage .hero-composition {
        padding: 14px 14px 10px;
    }

    .homepage .hero-shell {
        padding: 0 8px 8px;
    }

    .homepage .hero-nav {
        min-height: 62px;
        padding-inline: 8px;
    }

    .homepage .hero-logo {
        width: 180px;
    }

    .homepage .hero-desktop-nav {
        display: none;
    }

    .homepage .hero-menu-toggle {
        display: flex;
        width: 44px;
        height: 44px;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 5px;
        padding: 11px;
        color: var(--hero-paper);
        border: 1px solid rgba(255, 255, 255, 0.16);
        background: transparent;
        border-radius: 10px;
        cursor: pointer;
    }

    .homepage .hero-menu-toggle span {
        display: block;
        width: 20px;
        height: 2px;
        background: currentColor;
        transition: transform 180ms ease, opacity 180ms ease;
    }

    .homepage .hero-menu-toggle[aria-expanded="true"] span:nth-child(1) {
        transform: translateY(7px) rotate(45deg);
    }

    .homepage .hero-menu-toggle[aria-expanded="true"] span:nth-child(2) {
        opacity: 0;
    }

    .homepage .hero-menu-toggle[aria-expanded="true"] span:nth-child(3) {
        transform: translateY(-7px) rotate(-45deg);
    }

    .homepage .hero-mobile-nav {
        position: fixed;
        inset: 0;
        z-index: -1;
        display: grid;
        place-items: center;
        padding: 96px 24px 28px;
        visibility: hidden;
        opacity: 0;
        background: rgba(5, 23, 37, 0.98);
        transition: opacity 180ms ease, visibility 180ms ease;
    }

    .homepage .hero-mobile-nav:not([hidden]) {
        z-index: 40;
        visibility: visible;
        opacity: 1;
    }

    .homepage .hero-mobile-nav-bar {
        position: absolute;
        top: 14px;
        right: 14px;
        left: 14px;
        z-index: 2;
        display: flex;
        min-height: 62px;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
    }

    .homepage .hero-mobile-brand {
        display: flex;
        width: 180px;
        min-width: 0;
        flex: 0 1 180px;
        align-items: center;
    }

    .homepage .hero-mobile-brand img {
        display: block;
        width: 100%;
        height: auto;
        object-fit: contain;
        object-position: left center;
    }

    .homepage .hero-mobile-close {
        display: inline-flex;
        width: 44px;
        height: 44px;
        flex: 0 0 44px;
        align-items: center;
        justify-content: center;
        padding: 0;
        color: var(--hero-ink);
        border: 1px solid var(--hero-paper);
        background: var(--hero-paper);
        border-radius: 10px;
        box-shadow: 0 2px 12px rgba(0, 0, 0, 0.16);
        font-family: Arial, sans-serif;
        font-size: 2rem;
        font-weight: 300;
        line-height: 1;
        cursor: pointer;
    }

    .homepage .hero-mobile-close span {
        display: block;
        transform: translateY(-1px);
    }

    .homepage .hero-mobile-close:focus-visible {
        outline: 3px solid var(--hero-amber);
        outline-offset: 3px;
    }

    .homepage .hero-mobile-nav-inner {
        display: flex;
        width: min(100%, 440px);
        flex-direction: column;
    }

    .homepage .hero-mobile-nav a {
        display: flex;
        min-height: 54px;
        align-items: center;
        justify-content: space-between;
        color: var(--hero-paper);
        border-bottom: 1px solid rgba(255, 255, 255, 0.14);
        font-family: var(--hero-font-display);
        font-size: 1.25rem;
        font-weight: 600;
        text-decoration: none;
    }

    .homepage .hero-mobile-nav .hero-mobile-cta {
        min-height: 56px;
        margin-top: 24px;
        padding: 0 18px;
        color: var(--hero-white);
        border: 0;
        background: var(--hero-copper);
        border-radius: 10px;
        font-family: var(--font-body, "Inter", sans-serif);
        font-size: 0.94rem;
    }

    .homepage .hero-panel {
        min-height: 590px;
        grid-template-columns: minmax(0, 58%) minmax(300px, 42%);
    }

    .homepage .hero-content {
        padding: 48px 14px 48px 42px;
    }

    .homepage .hero-title {
        font-size: clamp(3.55rem, 7.3vw, 4.7rem);
    }

    .homepage .hero-copy {
        font-size: 0.94rem;
    }

    .homepage .authority-window {
        top: 64px;
        right: 24px;
        bottom: -36px;
        left: 20px;
    }

    .homepage .authority-window-head span,
    .homepage .hero-visual-caption {
        display: none;
    }

    .homepage .authority-document {
        bottom: 58px;
    }

    .homepage .authority-document h2 {
        font-size: 1.55rem;
    }

    .homepage .hero-rail {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .homepage .hero-rail-item,
    .homepage .hero-project-cta {
        min-height: 96px;
    }
}

@media (max-width: 767px) {
    .homepage .hero-composition {
        padding: 10px 10px 8px;
    }

    .homepage .hero-shell {
        border-radius: 18px;
    }

    .homepage .hero-nav {
        min-height: 58px;
    }

    .homepage .hero-logo {
        width: 166px;
    }

    .homepage .hero-panel {
        min-height: 0;
        grid-template-columns: 1fr;
        border-radius: 14px;
    }

    .homepage .hero-content {
        min-width: 0;
        padding: 42px 24px 36px;
    }

    .homepage .hero-eyebrow {
        gap: 7px;
        margin-bottom: 24px;
        font-size: 0.59rem;
        letter-spacing: 0.105em;
    }

    .homepage .hero-eyebrow > span {
        width: 17px;
    }

    .homepage .hero-title {
        font-size: clamp(2.4rem, 11vw, 3.6rem);
        line-height: 0.92;
        letter-spacing: -0.06em;
    }

    .homepage .hero-copy {
        max-width: 33rem;
        margin-top: 27px;
        font-size: 0.92rem;
        line-height: 1.55;
    }

    .homepage .hero-actions {
        margin-top: 25px;
    }

    .homepage .hero-visual {
        min-height: clamp(455px, 118vw, 520px);
        margin-top: -2px;
    }

    .homepage .hero-visual-guide {
        top: 12px;
        right: 20px;
        left: 20px;
    }

    .homepage .authority-window {
        top: 31px;
        right: clamp(20px, 8vw, 42px);
        bottom: -20px;
        left: clamp(20px, 8vw, 42px);
        min-height: 430px;
        border-radius: 160px 160px 18px 18px;
    }

    .homepage .authority-window-head {
        z-index: 4;
        margin: 50px 26px 0;
    }

    .homepage .authority-window-head img {
        width: 68px;
    }

    .homepage .authority-document {
        right: 22px;
        top: 160px;
        bottom: auto;
        left: 22px;
        min-height: 230px;
        padding: 24px;
    }

    .homepage .authority-document h2 {
        margin-block: 21px 15px;
        font-size: clamp(1.45rem, 6vw, 1.9rem);
    }

    .homepage .authority-document p {
        margin-bottom: 20px;
        font-size: 0.72rem;
    }

    .homepage .authority-window-index {
        display: none;
    }

    .homepage .hero-rail {
        grid-template-columns: 1fr;
        gap: 6px;
        padding-top: 7px;
    }

    .homepage .hero-rail-item,
    .homepage .hero-project-cta {
        min-height: 76px;
        padding: 14px 18px;
        border-radius: 10px;
    }

    .homepage .hero-rail-index {
        top: 12px;
        left: 18px;
    }

    .homepage .hero-rail-item strong,
    .homepage .hero-rail-arrow {
        margin-top: 15px;
    }

    .homepage .hero-project-cta {
        min-height: 92px;
    }
}

@media (max-width: 430px) {
    .homepage .hero-content {
        padding-inline: 20px;
    }

    .homepage .hero-primary-action,
    .homepage .hero-secondary-action {
        min-height: 48px;
        padding-inline: 17px;
        gap: 12px;
        font-size: 0.8rem;
    }
}

@media (max-width: 359px) {
    .homepage .hero-composition {
        padding: 8px 8px 6px;
    }

    .homepage .hero-shell {
        padding: 0 6px 6px;
        border-radius: 16px;
    }

    .homepage .hero-logo {
        width: 150px;
    }

    .homepage .hero-mobile-brand {
        width: 154px;
        flex-basis: 154px;
    }

    .homepage .hero-content {
        padding: 36px 16px 30px;
    }

    .homepage .hero-title {
        font-size: 2.4rem;
    }

    .homepage .hero-actions {
        display: grid;
        width: 100%;
        grid-template-columns: 1fr;
    }

    .homepage .hero-primary-action,
    .homepage .hero-secondary-action {
        width: 100%;
    }

    .homepage .hero-visual {
        min-height: 455px;
    }

    .homepage .authority-window {
        right: 15px;
        left: 15px;
    }

    .homepage .authority-document {
        right: 16px;
        left: 16px;
        padding: 20px;
    }

    .homepage .whatsapp-float {
        right: 2px;
        width: 44px;
        height: 44px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .homepage .positioning-row,
    .homepage .positioning-row::after,
    .homepage .positioning-arrow {
        transition: none;
    }
}

/* Final CTA / 08 */
.homepage .final-cta,
.homepage .final-cta * {
    box-sizing: border-box;
}

.homepage .final-cta {
    width: 100%;
    padding: 12px var(--site-shell-gutter) 0;
    background: var(--hero-paper);
}

.homepage .final-cta-panel {
    display: grid;
    width: 100%;
    max-width: var(--site-shell-max);
    min-height: clamp(440px, 33vw, 510px);
    margin: 0 auto;
    padding: clamp(58px, 5.3vw, 84px) clamp(42px, 5.8vw, 92px);
    grid-template-columns: minmax(0, 0.62fr) minmax(320px, 0.38fr);
    gap: clamp(48px, 7vw, 112px);
    color: var(--hero-white);
    background: var(--hero-copper);
    border-radius: 22px;
}

.homepage .final-cta-heading,
.homepage .final-cta-action {
    min-width: 0;
}

.homepage .final-cta-heading {
    display: flex;
    flex-direction: column;
}

.homepage .final-cta-eyebrow {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    color: rgba(255, 255, 255, 0.78);
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.69rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.homepage .final-cta-eyebrow span {
    width: 32px;
    height: 1px;
    background: var(--hero-carbon);
}

.homepage .final-cta h2 {
    width: 100%;
    margin: auto 0 0;
    color: var(--hero-white);
    font-family: var(--hero-font-display);
    font-size: clamp(3.4rem, 5.8vw, 5.8rem);
    font-weight: 600;
    line-height: 0.95;
    letter-spacing: -0.052em;
    hyphens: none;
    overflow-wrap: normal;
    word-break: normal;
}

.homepage .final-cta-action {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding-bottom: 2px;
}

.homepage .final-cta-action > p {
    max-width: 29rem;
    margin: 0 0 clamp(34px, 4vw, 50px);
    color: rgba(255, 255, 255, 0.84);
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: clamp(0.98rem, 1.15vw, 1.08rem);
    line-height: 1.68;
}

.homepage .final-cta-primary {
    display: flex;
    width: min(100%, 410px);
    min-height: 64px;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 0 24px;
    color: var(--hero-paper);
    background: var(--hero-carbon);
    border: 1px solid var(--hero-carbon);
    border-radius: 12px;
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.84rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.035em;
    text-decoration: none;
    transition: color 180ms ease, background 180ms ease, border-color 180ms ease, transform 180ms ease;
}

.homepage .final-cta-arrow {
    font-size: 1.25rem;
    font-weight: 400;
    transition: transform 180ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.homepage .final-cta-primary:hover,
.homepage .final-cta-primary:focus-visible {
    color: var(--hero-carbon);
    background: var(--hero-paper);
    border-color: var(--hero-paper);
    transform: translateY(-1px);
}

.homepage .final-cta-primary:hover .final-cta-arrow,
.homepage .final-cta-primary:focus-visible .final-cta-arrow {
    transform: translateX(5px);
}

.homepage .final-cta-primary:focus-visible {
    outline: 3px solid var(--hero-amber);
    outline-offset: 4px;
}

@media (max-width: 1099px) {
    .homepage .final-cta-panel {
        padding-inline: clamp(36px, 4.8vw, 54px);
        grid-template-columns: minmax(0, 0.59fr) minmax(300px, 0.41fr);
        gap: clamp(38px, 5vw, 58px);
    }

    .homepage .final-cta h2 {
        font-size: clamp(3.3rem, 5.7vw, 4.5rem);
    }
}

@media (max-width: 899px) {
    .homepage .final-cta-panel {
        min-height: 0;
        padding: 64px clamp(28px, 6vw, 52px) 48px;
        grid-template-columns: 1fr;
        gap: 76px;
    }

    .homepage .final-cta h2 {
        margin-top: 56px;
        font-size: clamp(3.7rem, 9.5vw, 5rem);
    }

    .homepage .final-cta-action > p {
        max-width: 36rem;
    }

    .homepage .final-cta-primary {
        width: 100%;
    }
}

@media (max-width: 767px) {
    .homepage .final-cta {
        padding: 8px var(--site-shell-mobile-gutter);
    }

    .homepage .final-cta-panel {
        padding: 54px clamp(20px, 6vw, 28px) 24px;
        gap: 58px;
        border-radius: 20px;
    }

    .homepage .final-cta-eyebrow {
        font-size: 0.62rem;
    }

    .homepage .final-cta h2 {
        margin-top: 48px;
        font-size: clamp(2.75rem, 12.4vw, 4rem);
        line-height: 0.96;
    }

    .homepage .final-cta-action > p {
        margin-bottom: 32px;
        font-size: 0.95rem;
        line-height: 1.62;
    }

    .homepage .final-cta-primary {
        min-height: 58px;
        padding-inline: 20px;
    }
}

@media (max-width: 359px) {
    .homepage .final-cta-panel {
        padding-inline: 18px;
    }

    .homepage .final-cta h2 {
        font-size: 2.55rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .homepage .final-cta-primary,
    .homepage .final-cta-arrow {
        transition: none;
    }
}

/* Services showcase */

.homepage .services-showcase,
.homepage .services-showcase * {
    box-sizing: border-box;
}

.homepage .services-showcase {
    width: 100%;
    padding: 0 12px;
    color: var(--hero-carbon);
    background: var(--hero-white);
}

.homepage .services-showcase-inner {
    display: grid;
    width: 100%;
    max-width: 1540px;
    margin: 0 auto;
    padding: clamp(112px, 9vw, 140px) clamp(34px, 5.4vw, 78px) clamp(120px, 9vw, 144px);
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
        "header action"
        "modules modules";
    column-gap: 48px;
    border-top: 1px solid var(--hero-line);
}

.homepage .services-showcase-header {
    grid-area: header;
    max-width: 820px;
}

.homepage .services-showcase-eyebrow {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 clamp(28px, 3vw, 42px);
    color: var(--hero-muted);
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.68rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.homepage .services-showcase-eyebrow span {
    width: 24px;
    height: 2px;
    flex: 0 0 auto;
    background: var(--hero-copper);
}

.homepage .services-showcase-title {
    max-width: 13ch;
    margin: 0;
    color: var(--hero-carbon);
    font-family: var(--hero-font-display);
    font-size: clamp(3rem, 5vw, 5rem);
    font-weight: 700;
    line-height: 0.96;
    letter-spacing: -0.052em;
    hyphens: none;
}

.homepage .services-showcase-copy {
    max-width: 510px;
    margin: clamp(30px, 3vw, 44px) 0 0;
    color: #4d5559;
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: clamp(1rem, 1.15vw, 1.12rem);
    line-height: 1.6;
    hyphens: none;
}

.homepage .services-all-link {
    grid-area: action;
    align-self: start;
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    gap: 14px;
    padding-top: 1px;
    color: var(--hero-carbon);
    border-bottom: 1px solid #bfc1bc;
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.78rem;
    font-weight: 600;
    text-decoration: none;
    transition: color 170ms ease, border-color 170ms ease;
}

.homepage .services-all-link span,
.homepage .service-module-link b {
    display: inline-block;
    color: var(--hero-copper);
    font-style: normal;
    transition: transform 180ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.homepage .services-all-link:hover,
.homepage .services-all-link:focus-visible {
    color: var(--hero-copper-dark);
    border-color: var(--hero-copper);
}

.homepage .services-all-link:hover span,
.homepage .services-all-link:focus-visible span,
.homepage .service-module:hover .service-module-link b,
.homepage .service-module:focus-visible .service-module-link b {
    transform: translate(4px, -4px);
}

.homepage .services-all-link:focus-visible,
.homepage .service-module:focus-visible {
    outline: 3px solid var(--hero-amber);
    outline-offset: 4px;
}

.homepage .services-modules {
    grid-area: modules;
    display: grid;
    min-height: 570px;
    margin-top: clamp(62px, 6vw, 84px);
    grid-template-columns: minmax(0, 1.38fr) minmax(360px, 1fr);
    gap: 10px;
}

.homepage .service-module {
    position: relative;
    display: flex;
    min-width: 0;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    border: 1px solid transparent;
    border-radius: 16px;
    font-family: var(--font-body, "Inter", sans-serif);
    text-decoration: none;
    transition: color 180ms ease, background 180ms ease, border-color 180ms ease;
}

.homepage .service-module-lead {
    min-height: 570px;
    padding: clamp(34px, 3.8vw, 54px);
    color: var(--hero-paper);
    border-color: #203746;
    background: var(--hero-ink);
}

.homepage .service-module-lead::before {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 1px;
    content: "";
    background: rgba(255, 255, 255, 0.075);
}

.homepage .service-module-lead:hover,
.homepage .service-module-lead:focus-visible {
    border-color: #3b5362;
    background: #071c2b;
}

.homepage .service-module-meta {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    font-size: 0.6rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.homepage .service-module-lead .service-module-meta {
    color: rgba(245, 244, 240, 0.58);
}

.homepage .service-module-figure {
    position: absolute;
    top: clamp(70px, 7vw, 100px);
    right: clamp(22px, 3vw, 46px);
    color: rgba(245, 244, 240, 0.07);
    font-family: var(--hero-font-display);
    font-size: clamp(9rem, 18vw, 16rem);
    font-weight: 700;
    line-height: 0.78;
    letter-spacing: -0.1em;
    pointer-events: none;
}

.homepage .service-module-body {
    position: relative;
    z-index: 2;
}

.homepage .service-module-rule {
    width: 58px;
    height: 3px;
    margin-bottom: 26px;
    background: var(--hero-copper);
    transition: width 200ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.homepage .service-module:hover .service-module-rule,
.homepage .service-module:focus-visible .service-module-rule {
    width: 78px;
}

.homepage .service-module h3 {
    margin: 0;
    font-family: var(--hero-font-display);
    font-weight: 700;
    line-height: 0.98;
    letter-spacing: -0.045em;
}

.homepage .service-module-lead h3 {
    max-width: 10ch;
    color: var(--hero-paper);
    font-size: clamp(3rem, 4.5vw, 4.7rem);
}

.homepage .service-module p {
    hyphens: none;
}

.homepage .service-module-lead p {
    max-width: 520px;
    margin: 24px 0 0;
    color: rgba(245, 244, 240, 0.72);
    font-size: clamp(0.96rem, 1.12vw, 1.08rem);
    line-height: 1.62;
}

.homepage .service-module-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
    margin: 30px 0 0;
    padding: 0;
    color: rgba(245, 244, 240, 0.48);
    list-style: none;
    font-size: 0.59rem;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.homepage .service-module-tags li {
    position: relative;
}

.homepage .service-module-tags li:not(:last-child)::after {
    position: absolute;
    top: 50%;
    right: -11px;
    width: 3px;
    height: 3px;
    content: "";
    background: var(--hero-copper);
    border-radius: 50%;
    transform: translateY(-50%);
}

.homepage .service-module-link {
    display: flex;
    width: max-content;
    max-width: 100%;
    align-items: center;
    gap: 14px;
    margin-top: 34px;
    padding-bottom: 8px;
    border-bottom: 1px solid currentColor;
    font-size: 0.76rem;
    font-weight: 600;
}

.homepage .service-module-lead .service-module-link {
    color: var(--hero-paper);
    border-color: rgba(245, 244, 240, 0.34);
}

.homepage .service-modules-secondary {
    display: grid;
    min-width: 0;
    grid-template-rows: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.homepage .service-module-secondary {
    min-height: 280px;
    padding: clamp(28px, 3vw, 42px);
    color: var(--hero-carbon);
    border-color: #d1d2cd;
}

.homepage .service-module-guest {
    background: var(--hero-soft-gray);
}

.homepage .service-module-authority {
    background: var(--hero-paper);
}

.homepage .service-module-secondary:hover,
.homepage .service-module-secondary:focus-visible {
    color: var(--hero-copper-dark);
    border-color: #b8aaa2;
    background: #eceae5;
}

.homepage .service-module-secondary .service-module-meta {
    color: #767d7a;
}

.homepage .service-module-secondary h3 {
    max-width: 12ch;
    font-size: clamp(2rem, 2.8vw, 3rem);
}

.homepage .service-module-secondary p {
    max-width: 430px;
    margin: 17px 0 0;
    color: #50585c;
    font-size: clamp(0.9rem, 1vw, 1rem);
    line-height: 1.55;
}

.homepage .service-module-secondary .service-module-link {
    margin-top: 24px;
    color: var(--hero-carbon);
    border-color: #b5b6b1;
}

@media (max-width: 1099px) {
    .homepage .services-showcase-inner {
        padding: clamp(88px, 10vw, 108px) clamp(30px, 5.5vw, 52px) clamp(96px, 10vw, 118px);
    }

    .homepage .services-showcase-title {
        font-size: clamp(3rem, 6vw, 4.4rem);
    }

    .homepage .services-modules {
        min-height: 0;
        grid-template-columns: 1fr;
    }

    .homepage .service-module-lead {
        min-height: 470px;
    }

    .homepage .service-modules-secondary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: 1fr;
    }

    .homepage .service-module-secondary {
        min-height: 310px;
    }
}

@media (max-width: 767px) {
    .homepage .services-showcase {
        padding: 0 8px;
    }

    .homepage .services-showcase-inner {
        padding: clamp(68px, 18vw, 80px) clamp(18px, 5.2vw, 30px) clamp(76px, 18vw, 94px);
        grid-template-columns: 1fr;
        grid-template-areas:
            "header"
            "modules"
            "action";
    }

    .homepage .services-showcase-eyebrow {
        margin-bottom: 27px;
        font-size: 0.62rem;
    }

    .homepage .services-showcase-title {
        max-width: 12ch;
        font-size: clamp(2.7rem, 12vw, 3.55rem);
        line-height: 0.98;
    }

    .homepage .services-showcase-copy {
        max-width: 32rem;
        margin-top: 30px;
        font-size: 0.96rem;
    }

    .homepage .services-modules {
        margin-top: 52px;
    }

    .homepage .service-module-lead {
        min-height: 410px;
        padding: 30px 24px;
    }

    .homepage .service-module-figure {
        top: 82px;
        right: 20px;
        font-size: clamp(8rem, 43vw, 11rem);
    }

    .homepage .service-module-lead h3 {
        font-size: clamp(2.7rem, 12.5vw, 3.5rem);
    }

    .homepage .service-modules-secondary {
        grid-template-columns: 1fr;
    }

    .homepage .service-module-secondary {
        min-height: 270px;
        padding: 28px 24px;
    }

    .homepage .service-module-secondary h3 {
        font-size: clamp(2rem, 9vw, 2.7rem);
    }

    .homepage .services-all-link {
        width: max-content;
        margin-top: 34px;
    }
}

@media (max-width: 359px) {
    .homepage .services-showcase-inner {
        padding-inline: 14px;
    }

    .homepage .service-module-meta {
        gap: 10px;
        font-size: 0.54rem;
    }

    .homepage .service-module-lead {
        min-height: 430px;
        padding-inline: 20px;
    }

    .homepage .service-module-tags {
        gap: 7px 16px;
    }

    .homepage .service-module-secondary {
        padding-inline: 20px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .homepage .services-all-link,
    .homepage .services-all-link span,
    .homepage .service-module,
    .homepage .service-module-rule,
    .homepage .service-module-link b {
        transition: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .homepage .hero-intro,
    .homepage .hero-visual-reveal {
        animation: none;
    }

    .homepage .hero-composition *,
    .homepage .hero-composition *::before,
    .homepage .hero-composition *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }
}

/* Credibility / positioning section
   The hero remains the dense opening object; this section introduces a calmer
   editorial rhythm before the existing homepage content resumes. */

.homepage .positioning-section,
.homepage .positioning-section * {
    box-sizing: border-box;
}

.homepage .positioning-section {
    width: 100%;
    padding: 0 12px;
    color: var(--hero-carbon);
    background: var(--hero-paper);
}

.homepage .positioning-inner {
    display: grid;
    width: 100%;
    max-width: 1540px;
    margin: 0 auto;
    padding: clamp(112px, 9vw, 144px) clamp(34px, 5.4vw, 78px) clamp(112px, 9vw, 144px);
    grid-template-columns: minmax(0, 1.34fr) minmax(360px, 0.9fr);
    align-items: center;
    gap: clamp(70px, 8vw, 126px);
    border-top: 1px solid var(--hero-line);
}

.homepage .positioning-intro {
    max-width: 790px;
}

.homepage .positioning-eyebrow {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 clamp(28px, 3vw, 42px);
    color: var(--hero-muted);
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.68rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.homepage .positioning-eyebrow span {
    width: 24px;
    height: 2px;
    flex: 0 0 auto;
    background: var(--hero-copper);
}

.homepage .positioning-title {
    max-width: 12ch;
    margin: 0;
    color: var(--hero-carbon);
    font-family: var(--hero-font-display);
    font-size: clamp(3rem, 5vw, 5.15rem);
    font-weight: 700;
    line-height: 0.98;
    letter-spacing: -0.052em;
}

.homepage .positioning-copy {
    max-width: 510px;
    margin: clamp(32px, 3.5vw, 48px) 0 0;
    color: #4d5559;
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: clamp(1rem, 1.25vw, 1.16rem);
    line-height: 1.6;
    hyphens: none;
}

.homepage .positioning-disciplines {
    min-width: 0;
    align-self: center;
}

.homepage .positioning-system {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    margin: 0 0 30px;
    color: #858a87;
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.61rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.homepage .positioning-system span {
    color: var(--hero-copper);
}

.homepage .positioning-row {
    position: relative;
    display: grid;
    min-height: 92px;
    grid-template-columns: 38px minmax(0, 1fr) 24px;
    align-items: center;
    gap: 18px;
    color: var(--hero-carbon);
    border-top: 1px solid #cfd0cb;
    font-family: var(--font-body, "Inter", sans-serif);
    text-decoration: none;
    transition: color 170ms ease;
}

.homepage .positioning-row:last-child {
    border-bottom: 1px solid #cfd0cb;
}

.homepage .positioning-row::after {
    position: absolute;
    top: -1px;
    right: 0;
    left: 0;
    height: 1px;
    content: "";
    background: var(--hero-copper);
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 200ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.homepage .positioning-index {
    color: #858a87;
    font-size: 0.62rem;
    font-weight: 600;
    letter-spacing: 0.1em;
}

.homepage .positioning-label {
    font-family: var(--hero-font-display);
    font-size: clamp(1.05rem, 1.55vw, 1.38rem);
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.025em;
    text-transform: uppercase;
}

.homepage .positioning-arrow {
    justify-self: end;
    color: var(--hero-copper);
    font-size: 1.05rem;
    transition: transform 180ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.homepage .positioning-row:hover,
.homepage .positioning-row:focus-visible {
    color: var(--hero-copper-dark);
}

.homepage .positioning-row:hover::after,
.homepage .positioning-row:focus-visible::after {
    transform: scaleX(1);
    transform-origin: left;
}

.homepage .positioning-row:hover .positioning-arrow,
.homepage .positioning-row:focus-visible .positioning-arrow {
    transform: translate(4px, -4px);
}

.homepage .positioning-row:focus-visible {
    outline: 3px solid var(--hero-amber);
    outline-offset: 4px;
}

@media (max-width: 1023px) {
    .homepage .positioning-inner {
        padding: clamp(88px, 10vw, 108px) clamp(30px, 5.5vw, 52px);
        grid-template-columns: minmax(0, 1.18fr) minmax(310px, 0.9fr);
        gap: clamp(46px, 6vw, 70px);
    }

    .homepage .positioning-title {
        font-size: clamp(3rem, 5.5vw, 4.4rem);
    }
}

@media (max-width: 899px) {
    .homepage .positioning-inner {
        grid-template-columns: 1fr;
        gap: 68px;
    }

    .homepage .positioning-intro {
        max-width: 680px;
    }

    .homepage .positioning-title {
        max-width: 11ch;
        font-size: clamp(3.45rem, 8.5vw, 4.45rem);
    }

    .homepage .positioning-copy {
        max-width: 470px;
    }

    .homepage .positioning-disciplines {
        width: min(100%, 590px);
        margin-left: auto;
    }
}

@media (max-width: 767px) {
    .homepage .positioning-section {
        padding: 0 8px;
    }

    .homepage .positioning-inner {
        padding: clamp(68px, 18vw, 80px) clamp(18px, 5.2vw, 30px);
        gap: 52px;
    }

    .homepage .positioning-eyebrow {
        margin-bottom: 27px;
        font-size: 0.62rem;
    }

    .homepage .positioning-title {
        max-width: 12ch;
        font-size: clamp(2.7rem, 12.4vw, 3.55rem);
        line-height: 0.99;
    }

    .homepage .positioning-copy {
        max-width: 32rem;
        margin-top: 30px;
        font-size: 0.96rem;
    }

    .homepage .positioning-system {
        justify-content: flex-start;
        margin-bottom: 24px;
        font-size: 0.57rem;
    }

    .homepage .positioning-row {
        min-height: 78px;
        grid-template-columns: 30px minmax(0, 1fr) 22px;
        gap: 12px;
    }

    .homepage .positioning-label {
        font-size: clamp(1rem, 5vw, 1.22rem);
    }
}

@media (max-width: 359px) {
    .homepage .positioning-inner {
        padding-inline: 14px;
    }

    .homepage .positioning-title {
        font-size: 2.52rem;
    }

    .homepage .positioning-system {
        gap: 7px;
        letter-spacing: 0.09em;
    }
}

/* Selected Work / case studies */

.homepage .selected-work,
.homepage .selected-work * {
    box-sizing: border-box;
}

.homepage .selected-work {
    width: 100%;
    padding: 0 12px;
    color: var(--hero-carbon);
    background: var(--hero-white);
}

.homepage .selected-work-inner {
    width: 100%;
    max-width: 1540px;
    margin: 0 auto;
    padding: clamp(112px, 9vw, 140px) clamp(34px, 5.4vw, 78px) clamp(120px, 9vw, 144px);
    border-top: 1px solid var(--hero-line);
}

.homepage .selected-work-header {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(280px, 0.55fr);
    align-items: end;
    gap: 64px;
}

.homepage .selected-work-eyebrow {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 clamp(28px, 3vw, 42px);
    color: var(--hero-muted);
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.68rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.homepage .selected-work-eyebrow span {
    width: 24px;
    height: 2px;
    flex: 0 0 auto;
    background: var(--hero-copper);
}

.homepage .selected-work-title {
    max-width: 10ch;
    margin: 0;
    color: var(--hero-carbon);
    font-family: var(--hero-font-display);
    font-size: clamp(3rem, 5.5vw, 5.25rem);
    font-weight: 700;
    line-height: 0.96;
    letter-spacing: -0.052em;
    hyphens: none;
}

.homepage .selected-work-intro {
    display: flex;
    max-width: 390px;
    justify-self: end;
    flex-direction: column;
    align-items: flex-start;
    gap: 28px;
    padding-bottom: 4px;
}

.homepage .selected-work-intro p {
    margin: 0;
    color: #4d5559;
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: clamp(0.98rem, 1.08vw, 1.08rem);
    line-height: 1.65;
    hyphens: none;
}

.homepage .selected-work-all-link {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    gap: 14px;
    color: var(--hero-carbon);
    border-bottom: 1px solid #bfc1bc;
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.78rem;
    font-weight: 600;
    text-decoration: none;
    transition: color 170ms ease, border-color 170ms ease;
}

.homepage .selected-work-all-link span,
.homepage .case-study-link b {
    display: inline-block;
    color: var(--hero-copper);
    font-style: normal;
    transition: transform 180ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.homepage .selected-work-all-link:hover,
.homepage .selected-work-all-link:focus-visible {
    color: var(--hero-copper-dark);
    border-color: var(--hero-copper);
}

.homepage .selected-work-all-link:hover span,
.homepage .selected-work-all-link:focus-visible span,
.homepage .case-study-feature:hover .case-study-link b,
.homepage .case-study-feature:focus-visible .case-study-link b {
    transform: translate(4px, -4px);
}

.homepage .selected-work-all-link:focus-visible,
.homepage .case-study-feature:focus-visible,
.homepage .case-study-support:focus-visible {
    outline: 3px solid var(--hero-amber);
    outline-offset: 4px;
}

.homepage .selected-work-composition {
    display: grid;
    min-height: 820px;
    margin-top: clamp(64px, 6vw, 88px);
    grid-template-columns: minmax(0, 1.94fr) minmax(330px, 1fr);
    gap: 12px;
}

.homepage .selected-work-composition-single {
    grid-template-columns: minmax(0, 1fr);
}

.homepage .case-study-feature,
.homepage .case-study-support {
    min-width: 0;
    overflow: hidden;
    font-family: var(--font-body, "Inter", sans-serif);
    text-decoration: none;
}

.homepage .case-study-feature {
    display: grid;
    min-height: 820px;
    grid-template-rows: minmax(470px, 1.7fr) minmax(270px, 1fr);
    color: var(--hero-paper);
    background: var(--hero-carbon);
    border-radius: 20px;
}

.homepage .case-study-feature-visual {
    position: relative;
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding: clamp(54px, 6vw, 84px) clamp(38px, 5vw, 74px) 48px;
    background: var(--hero-ink);
    border-bottom: 1px solid rgba(245, 244, 240, 0.14);
}

.homepage .case-study-feature-visual::before,
.homepage .case-study-feature-visual::after {
    position: absolute;
    content: "";
    pointer-events: none;
}

.homepage .case-study-feature-visual::before {
    top: 0;
    bottom: 0;
    left: 33%;
    width: 1px;
    background: rgba(245, 244, 240, 0.07);
}

.homepage .case-study-feature-visual::after {
    top: 50%;
    right: 0;
    left: 0;
    height: 1px;
    background: rgba(245, 244, 240, 0.07);
}

.homepage .case-study-visual-meta {
    position: absolute;
    z-index: 2;
    top: 27px;
    right: 30px;
    left: 30px;
    display: flex;
    justify-content: space-between;
    gap: 20px;
    color: rgba(245, 244, 240, 0.58);
    font-size: 0.58rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.homepage .case-study-artifact {
    position: relative;
    z-index: 2;
    width: min(74%, 560px);
    min-height: 320px;
    padding: clamp(30px, 3.5vw, 48px);
    color: var(--hero-carbon);
    background: var(--hero-paper);
    border: 1px solid rgba(23, 29, 33, 0.16);
    border-radius: 12px;
    transition: transform 220ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.homepage .case-study-feature:hover .case-study-artifact,
.homepage .case-study-feature:focus-visible .case-study-artifact {
    transform: scale(1.015);
}

.homepage .case-study-artifact-head {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    color: var(--hero-muted);
    font-size: 0.56rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.homepage .case-study-artifact > strong {
    display: block;
    max-width: 10ch;
    margin-top: clamp(38px, 5vw, 62px);
    font-family: var(--hero-font-display);
    font-size: clamp(2.2rem, 3.8vw, 4rem);
    font-weight: 700;
    line-height: 0.94;
    letter-spacing: -0.05em;
}

.homepage .case-study-artifact > i {
    display: block;
    width: 58px;
    height: 3px;
    margin-top: 28px;
    background: var(--hero-copper);
}

.homepage .case-study-artifact ul {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 20px;
    margin: 24px 0 0;
    padding: 0;
    color: var(--hero-muted);
    list-style: none;
    font-size: 0.62rem;
    font-weight: 600;
    line-height: 1.35;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.homepage .case-study-artifact li {
    position: relative;
}

.homepage .case-study-artifact li:not(:last-child)::after {
    position: absolute;
    top: 50%;
    right: -12px;
    width: 3px;
    height: 3px;
    content: "";
    background: var(--hero-copper);
    border-radius: 50%;
    transform: translateY(-50%);
}

.homepage .case-study-artifact-foot {
    display: flex;
    margin-top: 38px;
    padding-top: 17px;
    justify-content: space-between;
    gap: 14px;
    color: #7a7f80;
    border-top: 1px solid var(--hero-line);
    font-size: 0.53rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.homepage .case-study-visual-index {
    position: absolute;
    z-index: 1;
    right: -12px;
    bottom: -30px;
    color: rgba(245, 244, 240, 0.055);
    font-family: var(--hero-font-display);
    font-size: clamp(10rem, 17vw, 17rem);
    font-weight: 700;
    line-height: 0.8;
    letter-spacing: -0.1em;
}

.homepage .case-study-feature-content {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(190px, 0.55fr);
    align-items: end;
    gap: clamp(34px, 4vw, 58px);
    padding: clamp(36px, 4vw, 54px);
}

.homepage .case-study-category,
.homepage .case-study-field-label {
    margin: 0;
    color: rgba(245, 244, 240, 0.5);
    font-size: 0.58rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.homepage .case-study-feature h3 {
    max-width: 14ch;
    margin: 19px 0 0;
    color: var(--hero-paper);
    font-family: var(--hero-font-display);
    font-size: clamp(2.35rem, 3.6vw, 3.85rem);
    font-weight: 700;
    line-height: 0.97;
    letter-spacing: -0.045em;
    hyphens: none;
}

.homepage .case-study-summary {
    max-width: 520px;
    margin: 20px 0 0;
    color: rgba(245, 244, 240, 0.68);
    font-size: 0.94rem;
    line-height: 1.6;
    hyphens: none;
}

.homepage .case-study-feature-detail {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
}

.homepage .case-study-feature-detail > strong {
    margin-top: 12px;
    color: var(--hero-paper);
    font-size: 0.87rem;
    font-weight: 600;
    line-height: 1.45;
}

.homepage .case-study-link {
    display: inline-flex;
    align-items: center;
    gap: 13px;
    margin-top: 31px;
    padding-bottom: 8px;
    color: var(--hero-paper);
    border-bottom: 1px solid rgba(245, 244, 240, 0.34);
    font-size: 0.72rem;
    font-weight: 600;
}

.homepage .case-study-supporting {
    display: grid;
    min-width: 0;
    grid-template-rows: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.homepage .case-study-supporting-single {
    grid-template-rows: minmax(0, 1fr);
}

.homepage .case-study-support {
    display: grid;
    min-height: 0;
    grid-template-rows: minmax(150px, 0.82fr) minmax(220px, 1.18fr);
    color: var(--hero-carbon);
    background: var(--hero-paper);
    border: 1px solid #d1d2cd;
    border-radius: 16px;
    transition: color 180ms ease, border-color 180ms ease, background 180ms ease;
}

.homepage .case-study-support:hover,
.homepage .case-study-support:focus-visible {
    color: var(--hero-copper-dark);
    border-color: #b8aaa2;
    background: #eceae5;
}

.homepage .case-study-support-visual {
    position: relative;
    display: flex;
    min-width: 0;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    padding: clamp(24px, 2.4vw, 34px);
    background: var(--hero-soft-gray);
    border-bottom: 1px solid #d1d2cd;
}

.homepage .case-study-support-visual::after {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 67%;
    width: 1px;
    content: "";
    background: rgba(23, 29, 33, 0.08);
}

.homepage .case-study-support-visual > span {
    color: #50585a;
    font-size: 0.53rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.homepage .case-study-support-visual > strong {
    position: relative;
    z-index: 2;
    display: block;
    max-width: 12ch;
    margin-top: 22px;
    font-family: var(--hero-font-display);
    font-size: clamp(1.8rem, 2.3vw, 2.8rem);
    font-weight: 700;
    line-height: 0.98;
    letter-spacing: -0.045em;
    hyphens: none;
    overflow-wrap: normal;
}

.homepage .case-study-support-visual > i {
    display: block;
    width: 38px;
    height: 2px;
    margin: 17px 0;
    background: var(--hero-copper);
}

.homepage .case-study-support-visual > div {
    position: relative;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    gap: 6px 14px;
    color: #50585a;
    font-size: 0.52rem;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.homepage .case-study-support-content {
    display: flex;
    min-height: 0;
    flex-direction: column;
    padding: clamp(26px, 2.6vw, 36px);
}

.homepage .case-study-support-meta {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    color: #555d5f;
    font-size: 0.54rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.homepage .case-study-support h3 {
    max-width: 14ch;
    margin: 17px 0 0;
    color: var(--hero-carbon);
    font-family: var(--hero-font-display);
    font-size: clamp(1.72rem, 2.25vw, 2.55rem);
    font-weight: 700;
    line-height: 0.99;
    letter-spacing: -0.045em;
    hyphens: none;
}

.homepage .case-study-support p {
    margin: 14px 0 0;
    color: #535a5d;
    font-size: clamp(0.82rem, 0.86vw, 0.9rem);
    line-height: 1.52;
    hyphens: none;
}

.homepage .case-study-support-foot {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
    margin-top: auto;
    padding-top: 20px;
}

.homepage .case-study-support-foot > span {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 7px;
    color: #4e5558;
    font-size: 0.68rem;
    line-height: 1.35;
    hyphens: none;
    overflow-wrap: normal;
}

.homepage .case-study-support-foot b {
    color: #555d5f;
    font-size: 0.51rem;
    font-weight: 600;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.homepage .case-study-support-foot i {
    flex: 0 0 auto;
    color: var(--hero-copper);
    font-size: 0.92rem;
    font-style: normal;
    transition: transform 180ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.homepage .case-study-support:hover .case-study-support-foot i,
.homepage .case-study-support:focus-visible .case-study-support-foot i {
    transform: translate(4px, -4px);
}

@media (max-width: 1099px) {
    .homepage .selected-work-inner {
        padding: clamp(88px, 10vw, 108px) clamp(30px, 5.5vw, 52px) clamp(96px, 10vw, 118px);
    }

    .homepage .selected-work-header {
        gap: 48px;
    }

    .homepage .selected-work-title {
        font-size: clamp(3rem, 6vw, 4.4rem);
    }

    .homepage .selected-work-composition {
        min-height: 0;
        grid-template-columns: 1fr;
    }

    .homepage .case-study-feature {
        min-height: 720px;
        grid-template-rows: minmax(400px, 1.45fr) minmax(270px, 1fr);
    }

    .homepage .case-study-supporting {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: 1fr;
    }

    .homepage .case-study-support {
        min-height: 520px;
        grid-template-rows: minmax(210px, 0.8fr) minmax(290px, 1.2fr);
    }
}

@media (max-width: 767px) {
    .homepage .selected-work {
        padding: 0 8px;
    }

    .homepage .selected-work-inner {
        padding: clamp(68px, 18vw, 80px) clamp(18px, 5.2vw, 30px) clamp(76px, 18vw, 94px);
    }

    .homepage .selected-work-header {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .homepage .selected-work-eyebrow {
        margin-bottom: 27px;
        font-size: 0.62rem;
    }

    .homepage .selected-work-title {
        max-width: 11ch;
        font-size: clamp(2.7rem, 12vw, 3.55rem);
        line-height: 0.98;
    }

    .homepage .selected-work-intro {
        max-width: 32rem;
        justify-self: start;
        gap: 22px;
        padding-bottom: 0;
    }

    .homepage .selected-work-intro p {
        font-size: 0.96rem;
    }

    .homepage .selected-work-composition {
        margin-top: 52px;
    }

    .homepage .case-study-feature {
        min-height: 0;
        grid-template-rows: auto auto;
    }

    .homepage .case-study-feature-visual {
        min-height: 390px;
        padding: 64px 20px 34px;
    }

    .homepage .case-study-visual-meta {
        top: 23px;
        right: 22px;
        left: 22px;
        font-size: 0.52rem;
    }

    .homepage .case-study-artifact {
        width: min(100%, 440px);
        min-height: 280px;
        padding: 28px;
    }

    .homepage .case-study-artifact > strong {
        margin-top: 42px;
        font-size: clamp(2.15rem, 10.5vw, 3.2rem);
    }

    .homepage .case-study-artifact-foot {
        margin-top: 30px;
    }

    .homepage .case-study-feature-content {
        grid-template-columns: 1fr;
        align-items: start;
        gap: 30px;
        padding: 32px 26px 36px;
    }

    .homepage .case-study-feature h3 {
        font-size: clamp(2.25rem, 10.5vw, 3.2rem);
    }

    .homepage .case-study-feature-detail > strong {
        max-width: 28rem;
    }

    .homepage .case-study-link {
        margin-top: 25px;
    }

    .homepage .case-study-supporting {
        grid-template-columns: 1fr;
    }

    .homepage .case-study-support {
        min-height: 0;
        grid-template-rows: auto auto;
    }

    .homepage .case-study-support-visual {
        min-height: 220px;
        padding: 28px 26px;
    }

    .homepage .case-study-support-visual > strong {
        font-size: clamp(2rem, 9.5vw, 2.75rem);
    }

    .homepage .case-study-support-content {
        min-height: 280px;
        padding: 28px 26px;
    }

    .homepage .case-study-support h3 {
        font-size: clamp(2rem, 9.5vw, 2.75rem);
    }
}

@media (max-width: 359px) {
    .homepage .selected-work-inner {
        padding-inline: 14px;
    }

    .homepage .case-study-feature-visual {
        min-height: 365px;
        padding-inline: 16px;
    }

    .homepage .case-study-artifact {
        min-height: 266px;
        padding: 24px 20px;
    }

    .homepage .case-study-artifact > strong {
        margin-top: 37px;
        font-size: 2.12rem;
    }

    .homepage .case-study-artifact ul {
        gap: 7px 16px;
        font-size: 0.56rem;
    }

    .homepage .case-study-feature-content,
    .homepage .case-study-support-content,
    .homepage .case-study-support-visual {
        padding-inline: 22px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .homepage .selected-work-all-link,
    .homepage .selected-work-all-link span,
    .homepage .case-study-artifact,
    .homepage .case-study-link b,
    .homepage .case-study-support,
    .homepage .case-study-support-foot i {
        transition: none;
    }
}

/* Process / 04 */

.homepage .process-section,
.homepage .process-section * {
    box-sizing: border-box;
}

.homepage .process-section {
    width: 100%;
    padding: 0 12px;
    color: var(--hero-carbon);
    background: var(--hero-paper);
}

.homepage .process-inner {
    width: 100%;
    max-width: 1540px;
    margin: 0 auto;
    padding: clamp(112px, 9vw, 140px) clamp(34px, 5.4vw, 78px) clamp(120px, 9vw, 144px);
    border-top: 1px solid var(--hero-line);
}

.homepage .process-header {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(290px, 0.5fr);
    align-items: end;
    gap: 64px;
}

.homepage .process-eyebrow {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 clamp(28px, 3vw, 42px);
    color: var(--hero-muted);
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.68rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.homepage .process-eyebrow span {
    width: 24px;
    height: 2px;
    flex: 0 0 auto;
    background: var(--hero-copper);
}

.homepage .process-title {
    max-width: 16ch;
    margin: 0;
    color: var(--hero-carbon);
    font-family: var(--hero-font-display);
    font-size: clamp(3rem, 5.5vw, 5.25rem);
    font-weight: 700;
    line-height: 0.96;
    letter-spacing: -0.052em;
    hyphens: none;
}

.homepage .process-intro {
    max-width: 390px;
    margin: 0 0 5px;
    justify-self: end;
    color: #4d5559;
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: clamp(0.98rem, 1.08vw, 1.08rem);
    line-height: 1.65;
    hyphens: none;
}

.homepage .process-sequence {
    position: relative;
    display: grid;
    margin-top: clamp(68px, 6.4vw, 92px);
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-top: 1px solid #afb2ae;
    border-bottom: 1px solid #afb2ae;
}

.homepage .process-step {
    display: grid;
    min-width: 0;
    min-height: 310px;
    grid-template-columns: minmax(92px, 0.28fr) minmax(0, 0.72fr);
    align-items: start;
    gap: clamp(28px, 3vw, 48px);
    padding: clamp(44px, 4.6vw, 68px) clamp(32px, 4.6vw, 70px);
    text-align: left;
    background: transparent;
    border: 0;
    border-radius: 0;
    font-family: var(--font-body, "Inter", sans-serif);
}

.homepage .process-step:nth-child(odd) {
    border-right: 1px solid #c9cac5;
}

.homepage .process-step:nth-child(-n + 2) {
    border-bottom: 1px solid #afb2ae;
}

.homepage .process-step-number {
    position: relative;
    display: block;
    color: rgba(23, 29, 33, 0.18);
    font-family: var(--hero-font-display);
    font-size: clamp(3.6rem, 6vw, 5.75rem);
    font-weight: 700;
    line-height: 0.78;
    letter-spacing: -0.08em;
}

.homepage .process-step:first-child .process-step-number::after {
    position: absolute;
    right: 1px;
    bottom: -23px;
    left: 2px;
    height: 2px;
    content: "";
    background: var(--hero-copper);
}

.homepage .process-step-content {
    min-width: 0;
}

.homepage .process-step h3 {
    margin: 0;
    color: var(--hero-carbon);
    font-family: var(--hero-font-display);
    font-size: clamp(1rem, 1.25vw, 1.22rem);
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    hyphens: none;
}

.homepage .process-step-rule {
    display: block;
    width: 100%;
    height: 1px;
    margin: 25px 0 24px;
    background: #c9cac5;
}

.homepage .process-step p {
    max-width: 390px;
    margin: 0;
    color: #545c5f;
    font-size: clamp(0.91rem, 0.96vw, 1rem);
    line-height: 1.65;
    hyphens: none;
}

.homepage .process-progression {
    position: absolute;
    z-index: 2;
    top: 50%;
    right: 0;
    left: 0;
    display: grid;
    height: 16px;
    grid-template-columns: 8px 1fr 8px 1fr 8px 1fr 8px;
    align-items: center;
    padding: 0 10%;
    pointer-events: none;
    transform: translateY(-50%);
}

.homepage .process-progression span {
    width: 7px;
    height: 7px;
    background: var(--hero-paper);
    border: 1px solid var(--hero-copper);
    border-radius: 50%;
}

.homepage .process-progression span:first-child {
    background: var(--hero-copper);
}

.homepage .process-progression i {
    display: block;
    height: 1px;
    background: linear-gradient(90deg, var(--hero-copper), #afb2ae);
}

.homepage .process-footer {
    display: flex;
    min-height: 72px;
    align-items: flex-end;
    justify-content: space-between;
    gap: 36px;
    padding-top: 28px;
    font-family: var(--font-body, "Inter", sans-serif);
}

.homepage .process-footer p {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin: 0;
    color: #7a8080;
    font-size: 0.55rem;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.homepage .process-footer p span {
    color: var(--hero-copper);
}

.homepage .process-footer a {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    gap: 14px;
    color: var(--hero-carbon);
    border-bottom: 1px solid #bfc1bc;
    font-size: 0.78rem;
    font-weight: 600;
    text-decoration: none;
    transition: color 170ms ease, border-color 170ms ease;
}

.homepage .process-footer a span {
    display: inline-block;
    color: var(--hero-copper);
    transition: transform 180ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.homepage .process-footer a:hover,
.homepage .process-footer a:focus-visible {
    color: var(--hero-copper-dark);
    border-color: var(--hero-copper);
}

.homepage .process-footer a:hover span,
.homepage .process-footer a:focus-visible span {
    transform: translate(4px, -4px);
}

.homepage .process-footer a:focus-visible {
    outline: 3px solid var(--hero-amber);
    outline-offset: 4px;
}

@media (max-width: 1099px) {
    .homepage .process-inner {
        padding: clamp(88px, 10vw, 108px) clamp(30px, 5.5vw, 52px) clamp(96px, 10vw, 118px);
    }

    .homepage .process-header {
        gap: 48px;
    }

    .homepage .process-title {
        font-size: clamp(3rem, 6vw, 4.4rem);
    }

    .homepage .process-step {
        min-height: 290px;
        grid-template-columns: 76px minmax(0, 1fr);
        gap: 26px;
        padding: clamp(38px, 4.6vw, 52px) clamp(28px, 4.5vw, 44px);
    }

    .homepage .process-step-number {
        font-size: clamp(3.3rem, 7vw, 4.7rem);
    }
}

@media (max-width: 767px) {
    .homepage .process-section {
        padding: 0 8px;
    }

    .homepage .process-inner {
        padding: clamp(68px, 18vw, 80px) clamp(18px, 5.2vw, 30px) clamp(76px, 18vw, 94px);
    }

    .homepage .process-header {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .homepage .process-eyebrow {
        margin-bottom: 27px;
        font-size: 0.62rem;
    }

    .homepage .process-title {
        max-width: 14ch;
        font-size: clamp(2.7rem, 12vw, 3.55rem);
        line-height: 0.98;
    }

    .homepage .process-intro {
        max-width: 32rem;
        margin: 0;
        justify-self: start;
        font-size: 0.96rem;
    }

    .homepage .process-sequence {
        display: block;
        margin-top: 52px;
        border-bottom: 1px solid #afb2ae;
    }

    .homepage .process-sequence::before {
        position: absolute;
        z-index: 1;
        top: 44px;
        bottom: 44px;
        left: 28px;
        width: 1px;
        content: "";
        background: linear-gradient(180deg, var(--hero-copper), #c9cac5 34%, #c9cac5);
        pointer-events: none;
    }

    .homepage .process-step {
        position: relative;
        z-index: 2;
        min-height: 0;
        grid-template-columns: 58px minmax(0, 1fr);
        gap: 18px;
        padding: 33px 0 36px;
        border-right: 0;
        border-bottom: 0;
        border-top: 1px solid #c9cac5;
    }

    .homepage .process-step:nth-child(odd),
    .homepage .process-step:nth-child(-n + 2) {
        border-right: 0;
        border-bottom: 0;
    }

    .homepage .process-step-number {
        width: max-content;
        padding: 6px 8px 8px 0;
        color: rgba(23, 29, 33, 0.42);
        background: var(--hero-paper);
        font-size: 3rem;
        line-height: 0.8;
    }

    .homepage .process-step:first-child .process-step-number::after {
        right: 9px;
        bottom: 0;
    }

    .homepage .process-step h3 {
        font-size: 0.96rem;
        line-height: 1.3;
    }

    .homepage .process-step-rule {
        margin: 17px 0 18px;
    }

    .homepage .process-step p {
        max-width: 29rem;
        font-size: 0.92rem;
        line-height: 1.6;
    }

    .homepage .process-progression {
        display: none;
    }

    .homepage .process-footer {
        min-height: 0;
        align-items: flex-start;
        flex-direction: column;
        gap: 24px;
        padding-top: 30px;
    }

    .homepage .process-footer p {
        gap: 7px;
        font-size: 0.51rem;
    }
}

@media (max-width: 359px) {
    .homepage .process-inner {
        padding-inline: 14px;
    }

    .homepage .process-step {
        grid-template-columns: 52px minmax(0, 1fr);
        gap: 15px;
    }

    .homepage .process-sequence::before {
        left: 25px;
    }

    .homepage .process-step-number {
        font-size: 2.7rem;
    }

    .homepage .process-footer p {
        max-width: 230px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .homepage .process-footer a,
    .homepage .process-footer a span {
        transition: none;
    }
}

/* About / 05 */

.homepage .about-feature,
.homepage .about-feature * {
    box-sizing: border-box;
}

.homepage .about-feature {
    width: 100%;
    padding: 12px;
    color: var(--hero-paper);
    background: var(--hero-paper);
}

.homepage .about-feature-inner {
    display: grid;
    width: 100%;
    max-width: 1540px;
    margin: 0 auto;
    padding: clamp(112px, 9vw, 140px) clamp(34px, 5.4vw, 78px) clamp(120px, 9vw, 144px);
    grid-template-columns: minmax(360px, 0.8fr) minmax(0, 1fr);
    grid-template-areas:
        "eyebrow eyebrow"
        "visual intro"
        "visual principles"
        "visual action";
    column-gap: clamp(64px, 7vw, 108px);
    background: var(--hero-carbon);
    border: 1px solid rgba(245, 244, 240, 0.1);
    border-radius: 6px;
}

.homepage .about-feature-eyebrow {
    grid-area: eyebrow;
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 clamp(56px, 5.5vw, 80px);
    color: rgba(245, 244, 240, 0.58);
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.68rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.homepage .about-feature-eyebrow span {
    width: 24px;
    height: 2px;
    flex: 0 0 auto;
    background: var(--hero-copper);
}

.homepage .about-feature-intro {
    grid-area: intro;
    min-width: 0;
    align-self: start;
    padding-top: clamp(18px, 2vw, 30px);
}

.homepage .about-feature-role {
    margin: 0 0 24px;
    color: rgba(245, 244, 240, 0.5);
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.6rem;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.homepage .about-feature-title {
    max-width: 11ch;
    margin: 0;
    color: var(--hero-paper);
    font-family: var(--hero-font-display);
    font-size: clamp(3.15rem, 5.5vw, 5.35rem);
    font-weight: 700;
    line-height: 0.96;
    letter-spacing: -0.052em;
    hyphens: none;
}

.homepage .about-feature-copy {
    max-width: 600px;
    margin: clamp(30px, 3vw, 44px) 0 0;
    color: rgba(245, 244, 240, 0.72);
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: clamp(0.98rem, 1.08vw, 1.08rem);
    line-height: 1.68;
    hyphens: none;
}

.homepage .about-identity-visual {
    position: relative;
    grid-area: visual;
    display: flex;
    width: 100%;
    max-width: 560px;
    aspect-ratio: 4 / 5;
    min-width: 0;
    align-self: start;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    padding: clamp(30px, 3.6vw, 48px);
    color: var(--hero-carbon);
    background: var(--hero-paper);
    border: 1px solid rgba(245, 244, 240, 0.2);
    border-radius: 3px;
}

.homepage .about-identity-visual::before,
.homepage .about-identity-visual::after {
    position: absolute;
    content: "";
    pointer-events: none;
}

.homepage .about-identity-visual::before {
    top: 0;
    bottom: 0;
    left: 31%;
    width: 1px;
    background: rgba(23, 29, 33, 0.1);
}

.homepage .about-identity-visual::after {
    top: 49%;
    right: 0;
    left: 0;
    height: 2px;
    background: var(--hero-copper);
}

.homepage .about-identity-meta {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    gap: 20px;
    color: var(--hero-muted);
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.56rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.homepage .about-identity-mark {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: auto 0;
}

.homepage .about-identity-mark img {
    display: block;
    width: min(46%, 190px);
    height: auto;
    object-fit: contain;
}

.homepage .about-identity-disciplines {
    position: relative;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 13px;
    color: #6f7678;
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.56rem;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.homepage .about-identity-disciplines i {
    width: 3px;
    height: 3px;
    background: var(--hero-copper);
    border-radius: 50%;
}

.homepage .about-identity-name {
    position: relative;
    z-index: 2;
    display: flex;
    margin-top: clamp(28px, 3vw, 42px);
    padding-top: clamp(24px, 2.5vw, 34px);
    flex-direction: column;
    gap: 10px;
    border-top: 1px solid #c9cac5;
}

.homepage .about-identity-name strong {
    font-family: var(--hero-font-display);
    font-size: clamp(1.8rem, 2.8vw, 2.9rem);
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.045em;
}

.homepage .about-identity-name span {
    color: var(--hero-muted);
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.56rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.homepage .about-principles {
    grid-area: principles;
    align-self: end;
    margin-top: clamp(48px, 5vw, 72px);
    border-top: 1px solid rgba(245, 244, 240, 0.2);
}

.homepage .about-principle {
    display: grid;
    min-height: 94px;
    grid-template-columns: 38px minmax(105px, 0.3fr) minmax(0, 0.7fr);
    align-items: center;
    gap: clamp(18px, 2vw, 30px);
    padding: 21px 0;
    border-bottom: 1px solid rgba(245, 244, 240, 0.16);
    font-family: var(--font-body, "Inter", sans-serif);
}

.homepage .about-principle > span {
    color: rgba(245, 244, 240, 0.38);
    font-size: 0.58rem;
    font-weight: 600;
    letter-spacing: 0.1em;
}

.homepage .about-principle:first-child > span {
    color: var(--hero-copper);
}

.homepage .about-principle h3 {
    margin: 0;
    color: var(--hero-paper);
    font-family: var(--hero-font-display);
    font-size: clamp(1rem, 1.2vw, 1.18rem);
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.homepage .about-principle p {
    max-width: 360px;
    margin: 0;
    color: rgba(245, 244, 240, 0.62);
    font-size: clamp(0.84rem, 0.9vw, 0.92rem);
    line-height: 1.55;
    hyphens: none;
}

.homepage .about-feature-link {
    grid-area: action;
    display: inline-flex;
    width: max-content;
    min-height: 44px;
    align-items: center;
    align-self: end;
    gap: 14px;
    margin-top: clamp(34px, 3.5vw, 48px);
    padding-bottom: 6px;
    color: var(--hero-paper);
    border-bottom: 1px solid rgba(245, 244, 240, 0.32);
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.78rem;
    font-weight: 600;
    text-decoration: none;
    transition: color 170ms ease, border-color 170ms ease;
}

.homepage .about-feature-link span {
    display: inline-block;
    color: var(--hero-copper);
    transition: transform 180ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.homepage .about-feature-link:hover,
.homepage .about-feature-link:focus-visible {
    color: var(--hero-white);
    border-color: var(--hero-copper);
}

.homepage .about-feature-link:hover span,
.homepage .about-feature-link:focus-visible span {
    transform: translate(4px, -4px);
}

.homepage .about-feature-link:focus-visible {
    outline: 3px solid var(--hero-amber);
    outline-offset: 4px;
}

@media (max-width: 1099px) {
    .homepage .about-feature-inner {
        padding: clamp(88px, 10vw, 108px) clamp(30px, 5.5vw, 52px) clamp(96px, 10vw, 118px);
        grid-template-columns: minmax(300px, 0.72fr) minmax(0, 1fr);
        column-gap: clamp(46px, 5vw, 64px);
    }

    .homepage .about-feature-title {
        font-size: clamp(3rem, 6vw, 4.4rem);
    }

    .homepage .about-principle {
        grid-template-columns: 32px minmax(92px, 0.32fr) minmax(0, 0.68fr);
        gap: 16px;
    }
}

@media (max-width: 899px) {
    .homepage .about-feature-inner {
        grid-template-columns: 1fr;
        grid-template-areas:
            "eyebrow"
            "intro"
            "visual"
            "principles"
            "action";
    }

    .homepage .about-feature-intro {
        max-width: 650px;
        padding-top: 0;
    }

    .homepage .about-identity-visual {
        width: min(100%, 540px);
        margin-top: clamp(56px, 8vw, 72px);
    }

    .homepage .about-principles {
        width: min(100%, 650px);
    }
}

@media (max-width: 767px) {
    .homepage .about-feature {
        padding: 8px;
    }

    .homepage .about-feature-inner {
        padding: clamp(68px, 18vw, 80px) clamp(18px, 5.2vw, 30px) clamp(76px, 18vw, 94px);
        border-radius: 5px;
    }

    .homepage .about-feature-eyebrow {
        margin-bottom: 42px;
        font-size: 0.62rem;
    }

    .homepage .about-feature-title {
        max-width: 12ch;
        font-size: clamp(2.7rem, 12vw, 3.55rem);
        line-height: 0.98;
    }

    .homepage .about-feature-copy {
        max-width: 32rem;
        margin-top: 30px;
        font-size: 0.96rem;
    }

    .homepage .about-identity-visual {
        width: 100%;
        margin-top: 52px;
        padding: 28px 24px;
    }

    .homepage .about-identity-mark img {
        width: min(44%, 160px);
    }

    .homepage .about-principles {
        margin-top: 52px;
    }

    .homepage .about-principle {
        min-height: 0;
        grid-template-columns: 34px minmax(0, 1fr);
        gap: 7px 16px;
        padding: 24px 0;
    }

    .homepage .about-principle > span {
        grid-row: 1 / span 2;
        align-self: start;
        padding-top: 5px;
    }

    .homepage .about-principle h3 {
        font-size: 1rem;
    }

    .homepage .about-principle p {
        max-width: 29rem;
        font-size: 0.9rem;
    }

    .homepage .about-feature-link {
        margin-top: 34px;
    }
}

@media (max-width: 359px) {
    .homepage .about-feature-inner {
        padding-inline: 14px;
    }

    .homepage .about-feature-title {
        font-size: 2.52rem;
    }

    .homepage .about-identity-visual {
        min-height: 340px;
        padding: 24px 20px;
    }

    .homepage .about-identity-meta,
    .homepage .about-identity-disciplines,
    .homepage .about-identity-name span {
        font-size: 0.51rem;
    }

    .homepage .about-principle {
        grid-template-columns: 30px minmax(0, 1fr);
        gap: 7px 13px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .homepage .about-feature-link,
    .homepage .about-feature-link span {
        transition: none;
    }
}

/* Testimonials / 06 */
.homepage .testimonials-proof,
.homepage .testimonials-proof * {
    box-sizing: border-box;
}

.homepage .testimonials-proof {
    width: 100%;
    padding: clamp(112px, 10vw, 158px) 12px clamp(120px, 11vw, 172px);
    color: var(--hero-carbon);
    background: #fbfaf7;
}

.homepage .testimonials-proof-inner {
    width: min(100%, 1370px);
    margin: 0 auto;
}

.homepage .testimonials-proof-eyebrow {
    display: flex;
    align-items: center;
    gap: 11px;
    margin: 0 0 clamp(54px, 5vw, 72px);
    color: var(--hero-muted);
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.68rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.homepage .testimonials-proof-eyebrow span {
    width: 24px;
    height: 2px;
    flex: 0 0 auto;
    background: var(--hero-copper);
}

.homepage .testimonials-proof-header {
    display: grid;
    grid-template-columns: minmax(0, 0.6fr) minmax(290px, 0.4fr);
    align-items: end;
    gap: clamp(60px, 9vw, 130px);
}

.homepage .testimonials-proof-header h2 {
    max-width: 10ch;
    margin: 0;
    color: var(--hero-carbon);
    font-family: var(--hero-font-display);
    font-size: clamp(3.7rem, 6.6vw, 6.35rem);
    font-weight: 700;
    line-height: 0.95;
    letter-spacing: -0.055em;
}

.homepage .testimonials-proof-header > p {
    max-width: 440px;
    margin: 0 0 8px;
    color: var(--hero-muted);
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: clamp(1rem, 1.18vw, 1.12rem);
    line-height: 1.65;
    hyphens: none;
}

.homepage .testimonials-proof-composition {
    display: grid;
    margin-top: clamp(76px, 7vw, 104px);
    grid-template-columns: minmax(0, 0.64fr) minmax(310px, 0.36fr);
    border-top: 1px solid var(--hero-line);
    border-bottom: 1px solid var(--hero-line);
}

.homepage .testimonials-proof-composition-single {
    grid-template-columns: minmax(0, 1fr);
}

.homepage .testimonial-feature {
    display: flex;
    min-width: 0;
    min-height: clamp(520px, 46vw, 660px);
    flex-direction: column;
    justify-content: space-between;
    padding: clamp(42px, 4.5vw, 66px) clamp(48px, 7vw, 102px) clamp(44px, 4.5vw, 66px) 0;
    border-right: 1px solid var(--hero-line);
}

.homepage .testimonials-proof-composition-single .testimonial-feature {
    max-width: 960px;
    border-right: 0;
}

.homepage .testimonial-proof-index {
    color: #5c6365;
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.62rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.homepage .testimonial-proof-index span,
.homepage .testimonial-feature .testimonial-proof-index {
    color: var(--hero-copper);
}

.homepage .testimonial-feature blockquote,
.homepage .testimonial-supporting-note blockquote {
    margin: 0;
}

.homepage .testimonial-feature blockquote {
    margin: clamp(56px, 5vw, 76px) 0;
}

.homepage .testimonial-feature blockquote p {
    max-width: 19ch;
    margin: 0;
    color: var(--hero-ink);
    font-family: var(--hero-font-display);
    font-size: clamp(2.45rem, 3.65vw, 3.8rem);
    font-weight: 600;
    line-height: 1.12;
    letter-spacing: -0.037em;
    hyphens: none;
    text-wrap: balance;
}

.homepage .testimonial-proof-identity {
    display: flex;
    align-items: baseline;
    gap: 10px 18px;
    flex-wrap: wrap;
    font-family: var(--font-body, "Inter", sans-serif);
    font-style: normal;
}

.homepage .testimonial-proof-identity strong {
    color: var(--hero-carbon);
    font-size: 0.92rem;
    font-weight: 700;
}

.homepage .testimonial-proof-identity span {
    color: var(--hero-muted);
    font-size: 0.79rem;
    line-height: 1.45;
}

.homepage .testimonial-proof-identity small {
    flex-basis: 100%;
    color: #5c6365;
    font-size: 0.58rem;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.homepage .testimonial-supporting {
    min-width: 0;
}

.homepage .testimonial-supporting-note {
    display: flex;
    min-height: 50%;
    flex-direction: column;
    justify-content: space-between;
    padding: clamp(42px, 4.2vw, 62px) 0 clamp(40px, 4vw, 58px) clamp(42px, 4.4vw, 66px);
}

.homepage .testimonial-supporting-note + .testimonial-supporting-note {
    border-top: 1px solid var(--hero-line);
}

.homepage .testimonial-supporting-note blockquote {
    margin: clamp(44px, 4vw, 60px) 0;
}

.homepage .testimonial-supporting-note blockquote p {
    max-width: 28ch;
    margin: 0;
    color: var(--hero-carbon);
    font-family: var(--hero-font-display);
    font-size: clamp(1.25rem, 1.7vw, 1.58rem);
    font-weight: 600;
    line-height: 1.32;
    letter-spacing: -0.022em;
    hyphens: none;
}

.homepage .testimonial-supporting-note .testimonial-proof-identity {
    display: grid;
    align-items: start;
    gap: 5px;
}

.homepage .testimonials-proof-link {
    display: flex;
    width: max-content;
    min-height: 44px;
    align-items: center;
    gap: 14px;
    margin: clamp(42px, 4vw, 58px) 0 0 auto;
    padding-bottom: 6px;
    color: var(--hero-carbon);
    border-bottom: 1px solid #aeb0ac;
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.78rem;
    font-weight: 700;
    text-decoration: none;
    transition: color 170ms ease, border-color 170ms ease;
}

.homepage .testimonials-proof-link span {
    color: var(--hero-copper);
    transition: transform 180ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.homepage .testimonials-proof-link:hover,
.homepage .testimonials-proof-link:focus-visible {
    color: var(--hero-copper-dark);
    border-color: var(--hero-copper);
}

.homepage .testimonials-proof-link:hover span,
.homepage .testimonials-proof-link:focus-visible span {
    transform: translate(4px, -4px);
}

.homepage .testimonials-proof-link:focus-visible {
    outline: 3px solid var(--hero-amber);
    outline-offset: 4px;
}

@media (max-width: 1099px) {
    .homepage .testimonials-proof-inner {
        width: min(100%, 1120px);
        padding-inline: clamp(18px, 3vw, 30px);
    }

    .homepage .testimonials-proof-header {
        grid-template-columns: minmax(0, 0.58fr) minmax(260px, 0.42fr);
        gap: clamp(48px, 7vw, 80px);
    }

    .homepage .testimonials-proof-composition {
        grid-template-columns: minmax(0, 0.61fr) minmax(290px, 0.39fr);
    }

    .homepage .testimonial-feature {
        padding-right: clamp(42px, 5vw, 64px);
    }

    .homepage .testimonial-feature blockquote p {
        font-size: clamp(2.25rem, 4vw, 3rem);
    }

    .homepage .testimonial-supporting-note {
        padding-left: clamp(34px, 4vw, 48px);
    }
}

@media (max-width: 899px) {
    .homepage .testimonials-proof-header {
        grid-template-columns: 1fr;
        gap: 36px;
    }

    .homepage .testimonials-proof-header > p {
        margin: 0;
    }

    .homepage .testimonials-proof-composition {
        grid-template-columns: 1fr;
    }

    .homepage .testimonial-feature {
        min-height: auto;
        padding: 48px 0 56px;
        border-right: 0;
    }

    .homepage .testimonial-feature blockquote p {
        max-width: 21ch;
        font-size: clamp(2.35rem, 5.8vw, 3.25rem);
    }

    .homepage .testimonial-supporting {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        border-top: 1px solid var(--hero-line);
    }

    .homepage .testimonial-supporting-note {
        min-height: 360px;
        padding: 42px 36px 44px 0;
    }

    .homepage .testimonial-supporting-note + .testimonial-supporting-note {
        padding-right: 0;
        padding-left: 36px;
        border-top: 0;
        border-left: 1px solid var(--hero-line);
    }
}

@media (max-width: 767px) {
    .homepage .testimonials-proof {
        padding: 88px 8px 100px;
    }

    .homepage .testimonials-proof-inner {
        padding-inline: clamp(10px, 3.2vw, 20px);
    }

    .homepage .testimonials-proof-eyebrow {
        margin-bottom: 42px;
        font-size: 0.62rem;
    }

    .homepage .testimonials-proof-header {
        gap: 28px;
    }

    .homepage .testimonials-proof-header h2 {
        font-size: clamp(2.75rem, 13vw, 4rem);
        line-height: 0.98;
    }

    .homepage .testimonials-proof-header > p {
        max-width: 32rem;
        font-size: 0.96rem;
    }

    .homepage .testimonials-proof-composition {
        margin-top: 58px;
    }

    .homepage .testimonial-feature {
        padding: 34px 0 42px;
    }

    .homepage .testimonial-feature blockquote {
        margin: 44px 0 48px;
    }

    .homepage .testimonial-feature blockquote p {
        max-width: 22ch;
        font-size: clamp(2rem, 8.7vw, 2.72rem);
        line-height: 1.15;
    }

    .homepage .testimonial-proof-identity {
        display: grid;
        align-items: start;
        gap: 5px;
    }

    .homepage .testimonial-supporting {
        grid-template-columns: 1fr;
    }

    .homepage .testimonial-supporting-note {
        min-height: 0;
        padding: 34px 0 40px;
    }

    .homepage .testimonial-supporting-note + .testimonial-supporting-note {
        padding-left: 0;
        border-top: 1px solid var(--hero-line);
        border-left: 0;
    }

    .homepage .testimonial-supporting-note blockquote {
        margin: 36px 0 42px;
    }

    .homepage .testimonial-supporting-note blockquote p {
        max-width: 31ch;
        font-size: 1.28rem;
    }

    .homepage .testimonials-proof-link {
        margin-top: 38px;
        margin-left: 0;
    }
}

@media (max-width: 359px) {
    .homepage .testimonials-proof-inner {
        padding-inline: 8px;
    }

    .homepage .testimonials-proof-header h2 {
        font-size: 2.55rem;
    }

    .homepage .testimonial-feature blockquote p {
        font-size: 1.9rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .homepage .testimonials-proof-link,
    .homepage .testimonials-proof-link span {
        transition: none;
    }
}

/* Insights / 07 */
.homepage .insights-feature,
.homepage .insights-feature * {
    box-sizing: border-box;
}

.homepage .insights-feature {
    width: 100%;
    padding: clamp(112px, 10vw, 156px) 12px clamp(120px, 11vw, 170px);
    color: var(--hero-carbon);
    background: #ebe9e2;
}

.homepage .insights-feature-inner {
    width: min(100%, 1370px);
    margin: 0 auto;
}

.homepage .insights-feature-eyebrow {
    display: flex;
    align-items: center;
    gap: 11px;
    margin: 0 0 clamp(54px, 5vw, 72px);
    color: var(--hero-muted);
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.68rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.homepage .insights-feature-eyebrow span {
    width: 24px;
    height: 2px;
    flex: 0 0 auto;
    background: var(--hero-copper);
}

.homepage .insights-feature-header {
    display: grid;
    grid-template-columns: minmax(0, 0.6fr) minmax(300px, 0.4fr);
    align-items: end;
    gap: clamp(60px, 9vw, 130px);
}

.homepage .insights-feature-header h2 {
    max-width: 11ch;
    margin: 0;
    color: var(--hero-carbon);
    font-family: var(--hero-font-display);
    font-size: clamp(3.7rem, 6.4vw, 6.2rem);
    font-weight: 700;
    line-height: 0.95;
    letter-spacing: -0.055em;
    hyphens: none;
}

.homepage .insights-feature-header > p {
    max-width: 450px;
    margin: 0 0 8px;
    color: var(--hero-muted);
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: clamp(1rem, 1.18vw, 1.12rem);
    line-height: 1.65;
    hyphens: none;
}

.homepage .insights-composition {
    display: grid;
    margin-top: clamp(76px, 7vw, 104px);
    grid-template-columns: minmax(0, 0.58fr) minmax(350px, 0.42fr);
    border-top: 1px solid #cbc9c2;
    border-bottom: 1px solid #cbc9c2;
}

.homepage .insight-lead {
    min-width: 0;
    padding: clamp(42px, 4.5vw, 64px) clamp(48px, 6vw, 86px) clamp(48px, 5vw, 72px) 0;
    border-right: 1px solid #cbc9c2;
}

.homepage .insight-lead-media {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 1.72 / 1;
    overflow: hidden;
    color: var(--hero-white);
    background: #d8d6cf;
    text-decoration: none;
}

.homepage .insight-lead-media::after {
    position: absolute;
    inset: 0;
    content: "";
    pointer-events: none;
    background: linear-gradient(180deg, transparent 55%, rgba(5, 23, 37, 0.62));
}

.homepage .insight-lead-media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: saturate(0.72) contrast(0.96);
    transition: transform 420ms cubic-bezier(0.2, 0.8, 0.2, 1), filter 220ms ease;
}

.homepage .insight-lead-media > span {
    position: absolute;
    z-index: 2;
    right: 24px;
    bottom: 22px;
    left: 24px;
    color: rgba(255, 255, 255, 0.9);
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.58rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.homepage .insight-lead-media:hover img,
.homepage .insight-lead-media:focus-visible img {
    filter: saturate(0.9) contrast(1);
    transform: scale(1.025);
}

.homepage .insight-lead-media:focus-visible {
    outline: 3px solid var(--hero-amber);
    outline-offset: 4px;
}

.homepage .insight-lead-content {
    padding-top: clamp(34px, 3.5vw, 48px);
}

.homepage .insight-meta {
    display: flex;
    align-items: center;
    gap: 10px 16px;
    flex-wrap: wrap;
    color: #74797b;
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.6rem;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.homepage .insight-meta span {
    color: var(--hero-copper-dark);
}

.homepage .insight-meta time {
    padding-left: 16px;
    border-left: 1px solid #b8b7b1;
}

.homepage .insight-lead h3,
.homepage .insight-list-item h3 {
    margin: 0;
    font-family: var(--hero-font-display);
    font-weight: 700;
    letter-spacing: -0.038em;
    hyphens: none;
}

.homepage .insight-lead h3 {
    max-width: 19ch;
    margin-top: 22px;
    font-size: clamp(2.15rem, 3vw, 3.2rem);
    line-height: 1.08;
}

.homepage .insight-lead h3 a,
.homepage .insight-list-item h3 a {
    color: var(--hero-ink);
    text-decoration: none;
    transition: color 170ms ease;
}

.homepage .insight-lead h3 a:hover,
.homepage .insight-lead h3 a:focus-visible,
.homepage .insight-list-item h3 a:hover,
.homepage .insight-list-item h3 a:focus-visible {
    color: var(--hero-copper-dark);
}

.homepage .insight-lead h3 a:focus-visible,
.homepage .insight-list-item h3 a:focus-visible {
    outline: 3px solid var(--hero-amber);
    outline-offset: 4px;
}

.homepage .insight-lead-content > p,
.homepage .insight-list-item > p {
    color: var(--hero-muted);
    font-family: var(--font-body, "Inter", sans-serif);
    hyphens: none;
}

.homepage .insight-lead-content > p {
    max-width: 610px;
    margin: 24px 0 0;
    font-size: 0.96rem;
    line-height: 1.68;
}

.homepage .insight-article-link,
.homepage .insights-feature-link {
    display: inline-flex;
    width: max-content;
    min-height: 44px;
    align-items: center;
    gap: 13px;
    padding-bottom: 5px;
    color: var(--hero-carbon);
    border-bottom: 1px solid #aeb0ac;
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.75rem;
    font-weight: 700;
    text-decoration: none;
    transition: color 170ms ease, border-color 170ms ease;
}

.homepage .insight-article-link {
    margin-top: 26px;
}

.homepage .insight-article-link span,
.homepage .insights-feature-link span {
    color: var(--hero-copper);
    transition: transform 180ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

.homepage .insight-article-link:hover,
.homepage .insight-article-link:focus-visible,
.homepage .insights-feature-link:hover,
.homepage .insights-feature-link:focus-visible {
    color: var(--hero-copper-dark);
    border-color: var(--hero-copper);
}

.homepage .insight-article-link:hover span,
.homepage .insight-article-link:focus-visible span,
.homepage .insights-feature-link:hover span,
.homepage .insights-feature-link:focus-visible span {
    transform: translate(4px, -4px);
}

.homepage .insight-article-link:focus-visible,
.homepage .insights-feature-link:focus-visible {
    outline: 3px solid var(--hero-amber);
    outline-offset: 4px;
}

.homepage .insight-supporting {
    min-width: 0;
}

.homepage .insight-list-item {
    display: flex;
    min-height: 50%;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding: clamp(44px, 5vw, 72px) 0 clamp(44px, 5vw, 72px) clamp(44px, 5vw, 72px);
}

.homepage .insight-list-item + .insight-list-item {
    border-top: 1px solid #cbc9c2;
}

.homepage .insight-list-index {
    margin-bottom: clamp(42px, 4vw, 58px);
    color: #8a8f91;
    font-family: var(--font-body, "Inter", sans-serif);
    font-size: 0.62rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.14em;
}

.homepage .insight-list-item h3 {
    max-width: 22ch;
    margin-top: 20px;
    font-size: clamp(1.5rem, 2.2vw, 2.15rem);
    line-height: 1.15;
}

.homepage .insight-list-item > p {
    max-width: 42ch;
    margin: 20px 0 0;
    font-size: 0.88rem;
    line-height: 1.62;
}

.homepage .insights-feature-link {
    display: flex;
    margin: clamp(42px, 4vw, 58px) 0 0 auto;
}

@media (max-width: 1099px) {
    .homepage .insights-feature-inner {
        width: min(100%, 1120px);
        padding-inline: clamp(18px, 3vw, 30px);
    }

    .homepage .insights-feature-header {
        grid-template-columns: minmax(0, 0.58fr) minmax(270px, 0.42fr);
        gap: clamp(48px, 7vw, 80px);
    }

    .homepage .insights-composition {
        grid-template-columns: minmax(0, 0.56fr) minmax(320px, 0.44fr);
    }

    .homepage .insight-lead {
        padding-right: clamp(38px, 4.5vw, 56px);
    }

    .homepage .insight-list-item {
        padding-left: clamp(34px, 4vw, 48px);
    }
}

@media (max-width: 899px) {
    .homepage .insights-feature-header {
        grid-template-columns: 1fr;
        gap: 36px;
    }

    .homepage .insights-feature-header > p {
        margin: 0;
    }

    .homepage .insights-composition {
        grid-template-columns: 1fr;
    }

    .homepage .insight-lead {
        padding: 48px 0 58px;
        border-right: 0;
    }

    .homepage .insight-supporting {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        border-top: 1px solid #cbc9c2;
    }

    .homepage .insight-list-item {
        min-height: 500px;
        justify-content: flex-start;
        padding: 44px 36px 48px 0;
    }

    .homepage .insight-list-item + .insight-list-item {
        padding-right: 0;
        padding-left: 36px;
        border-top: 0;
        border-left: 1px solid #cbc9c2;
    }

    .homepage .insight-list-item .insight-article-link {
        margin-top: auto;
    }
}

@media (max-width: 767px) {
    .homepage .insights-feature {
        padding: 88px 8px 102px;
    }

    .homepage .insights-feature-inner {
        padding-inline: clamp(10px, 3.2vw, 20px);
    }

    .homepage .insights-feature-eyebrow {
        margin-bottom: 42px;
        font-size: 0.62rem;
    }

    .homepage .insights-feature-header {
        gap: 28px;
    }

    .homepage .insights-feature-header h2 {
        font-size: clamp(2.72rem, 12.7vw, 3.9rem);
        line-height: 0.98;
    }

    .homepage .insights-feature-header > p {
        max-width: 32rem;
        font-size: 0.96rem;
    }

    .homepage .insights-composition {
        margin-top: 58px;
    }

    .homepage .insight-lead {
        padding: 32px 0 48px;
    }

    .homepage .insight-lead-media {
        aspect-ratio: 1.46 / 1;
    }

    .homepage .insight-lead-media > span {
        right: 18px;
        bottom: 16px;
        left: 18px;
    }

    .homepage .insight-lead h3 {
        font-size: clamp(1.92rem, 8.4vw, 2.55rem);
        line-height: 1.1;
    }

    .homepage .insight-lead-content > p {
        font-size: 0.92rem;
    }

    .homepage .insight-supporting {
        grid-template-columns: 1fr;
    }

    .homepage .insight-list-item {
        min-height: 0;
        padding: 38px 0 44px;
    }

    .homepage .insight-list-item + .insight-list-item {
        padding-left: 0;
        border-top: 1px solid #cbc9c2;
        border-left: 0;
    }

    .homepage .insight-list-index {
        margin-bottom: 34px;
    }

    .homepage .insight-list-item h3 {
        max-width: 25ch;
        font-size: 1.56rem;
    }

    .homepage .insight-list-item .insight-article-link {
        margin-top: 24px;
    }

    .homepage .insights-feature-link {
        margin-top: 38px;
        margin-left: 0;
    }
}

@media (max-width: 359px) {
    .homepage .insights-feature-inner {
        padding-inline: 8px;
    }

    .homepage .insights-feature-header h2 {
        font-size: 2.48rem;
    }

    .homepage .insight-lead h3 {
        font-size: 1.82rem;
    }

    .homepage .insight-meta {
        align-items: flex-start;
        flex-direction: column;
        gap: 6px;
    }

    .homepage .insight-meta time {
        padding-left: 0;
        border-left: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .homepage .insight-lead-media img,
    .homepage .insight-lead h3 a,
    .homepage .insight-list-item h3 a,
    .homepage .insight-article-link,
    .homepage .insight-article-link span,
    .homepage .insights-feature-link,
    .homepage .insights-feature-link span {
        transition: none;
    }
}

/* Phase 22: the hero shell clips its children, so the approved homepage nav
   uses fixed positioning while retaining its original dimensions and styling. */
.homepage .hero-nav {
    position: fixed;
    top: 18px;
    left: calc(max(var(--site-shell-gutter), (100vw - var(--site-shell-max)) / 2) + 10px);
    right: calc(max(var(--site-shell-gutter), (100vw - var(--site-shell-max)) / 2) + 10px);
    z-index: 1000;
    min-height: 64px;
    color: var(--hero-paper);
    background: var(--hero-carbon);
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 18px;
    box-shadow: 0 6px 16px rgba(5,23,37,.08);
}
.homepage .hero-shell { padding-top: 64px; }
.homepage { scroll-padding-top: 100px; }
.homepage #main-content [id], .homepage [id] { scroll-margin-top: 100px; }
@media(max-width:1023px) {
    .homepage .hero-nav { top:14px; right:24px; left:24px; }
    .homepage { scroll-padding-top: 92px; }
    .homepage #main-content [id], .homepage [id] { scroll-margin-top:92px; }
}
@media(max-width:479px) { .homepage .hero-nav { right:14px; left:14px; } }
/* Phase 22: targeted WCAG contrast corrections from measured audit failures. */
.homepage .hero-visual-guide { color:#5f6568; }
.homepage .hero-rail-index { color:rgba(245,244,240,.72); }
.homepage .service-module-secondary .service-module-meta { color:#555d5a; }
.homepage .positioning-system,
.homepage .positioning-index { color:#5f6662; }
.homepage .process-footer p { color:#5f6568; }
.homepage .about-principle > span { color:#aeb2b3; }
.homepage .about-principle:first-child > span { color:#f08b55; }
.homepage .insight-meta time,
.homepage .insight-list-index { color:#575e60; }
.homepage .final-cta-eyebrow,
.homepage .final-cta-action > p { color:#fff; }