/*
 * FINF reference-detail pass.
 * Desktop offsets are measured against the supplied 1900 x 900 captures.
 * The product panel is intentionally excluded because it follows the newer
 * port-2000 product design applied in product-2000-overrides.css.
 */

/* Alternating panel surfaces visible in the supplied captures. */
html body.page-home #section-2,
html body.page-home #section-4,
html body.page-home #section-5,
html body.page-home #section-7 {
    background: #ffffff !important;
}

html body.page-home #section-core-services,
html body.page-home #section-3,
html body.page-home #section-6,
html body.page-home #section-8 {
    background: #fbfdff !important;
}

html body.page-home #section-2 > .home-panel__inner,
html body.page-home #section-4 > .home-panel__inner,
html body.page-home #section-5 > .home-panel__inner,
html body.page-home #section-7 > .home-panel__inner {
    background: #ffffff !important;
    overflow: visible !important;
}

html body.page-home #section-core-services > .home-panel__inner,
html body.page-home #section-3 > .home-panel__inner,
html body.page-home #section-6 > .home-panel__inner,
html body.page-home #section-8 > .home-panel__inner {
    background: #fbfdff !important;
    overflow: visible !important;
}

@media (min-width: 861px) {
    /* The hero reference shows the header directly over the visual. */
    html body.page-home:not(.home-after-hero) .site-header {
        background: transparent !important;
        border-bottom-color: transparent !important;
    }

    html body.page-home.home-after-hero .site-header {
        background: rgba(255, 255, 255, .96) !important;
        border-bottom: 1px solid #e8ecf3 !important;
    }
}

@media (min-width: 1201px) {
    /* Reference glyph bounds: 733-793 / 869-929 / 1006-1035 / 1110-1170. */
    html body.page-home .site-nav,
    html body.page-home.home-after-hero .site-nav {
        gap: 50px !important;
    }

    html body.page-home .site-nav > a,
    html body.page-home .site-nav > .site-nav__item > .site-nav__link,
    html body.page-home.home-after-hero .site-nav > a,
    html body.page-home.home-after-hero .site-nav > .site-nav__item > .site-nav__link {
        font-size: 17px !important;
        font-weight: 600 !important;
    }

    html body.page-home .site-lang--dropdown,
    html body.page-home.home-after-hero .site-lang--dropdown {
        transform: translateX(27px) !important;
    }

    html body.page-home .site-nav > :nth-child(1),
    html body.page-home.home-after-hero .site-nav > :nth-child(1) {
        transform: translateX(9px) !important;
    }

    html body.page-home .site-nav > :nth-child(2),
    html body.page-home.home-after-hero .site-nav > :nth-child(2) {
        transform: translateX(4px) !important;
    }

    html body.page-home .site-nav > :nth-child(4),
    html body.page-home.home-after-hero .site-nav > :nth-child(4) {
        transform: translateX(-5px) !important;
    }
}

@media (min-width: 1601px) {
    /* Hero: supplied title origin is 205 x 235. */
    html body.page-home #section-1 .hero-text-block {
        transform: translate(-8px, -8px) !important;
    }

    html body.page-home #section-1 .hero-brand__main {
        font-size: 80px !important;
        transform: scaleY(1.05) !important;
        transform-origin: left center !important;
    }

    html body.page-home #section-1 .hero-brand__sub {
        font-size: 71px !important;
        margin-left: 7px !important;
        transform: translateY(5px) scaleY(.94) !important;
        transform-origin: left center !important;
    }

    html body.page-home #section-1 .hero-text-block h1 {
        margin-bottom: 37px !important;
    }

    html body.page-home #section-1 .hero-text-block p,
    html body.page-home #section-1 .hero-actions {
        transform: translateX(-7px) !important;
    }

    html body.page-home #section-1 .hero-actions {
        margin-top: 25px !important;
    }

    /* Company overview: move copy only; the globe is already aligned. */
    html body.page-home #section-2 .company-overview__title,
    html body.page-home #section-2 .company-overview__headline,
    html body.page-home #section-2 .company-overview__text {
        transform: translateX(-8px) !important;
    }

    html body.page-home #section-2 .company-overview__title {
        font-size: 16px !important;
    }

    html body.page-home #section-2 .company-overview__earth {
        transform: translateX(10px) scale(1.50) !important;
    }

    html body.page-home #section-2 .company-overview__headline {
        font-size: 50px !important;
        line-height: 60px !important;
    }

    /* Core cards: reference frame is x=221, width=1479, y=388. */
    html body.page-home #section-core-services .core-services__cards {
        width: 1495px !important;
        max-width: none !important;
        transform: translate(8px, 3px) !important;
    }

    html body.page-home #section-core-services .core-services__title {
        font-size: 50px !important;
        line-height: 57.5px !important;
        transform: translate(8px, -4px) !important;
    }

    html body.page-home #section-core-services .core-services__cards {
        margin-top: 72px !important;
    }

    html body.page-home #section-core-services .core-service-card__icon img {
        transform: scale(1.42) !important;
        transform-origin: center !important;
    }

    html body.page-home #section-core-services .core-service-card h3 {
        transform: translateY(18px) !important;
    }

    html body.page-home #section-core-services .core-service-card p {
        transform: translateY(-3px) !important;
    }

    /* CEO: preserve the eyebrow baseline while tightening the title/body gap. */
    html body.page-home #section-4 .ceo-message__content {
        transform: translateX(-8px) !important;
    }

    html body.page-home #section-4 .ceo-message__title,
    html body.page-home #section-4 .ceo-message__body {
        transform: translateY(-8px) !important;
    }

    html body.page-home #section-4 .ceo-message__title {
        margin-bottom: 45px !important;
        font-size: 50px !important;
        line-height: 60px !important;
    }

    html body.page-home #section-4 .ceo-message__body {
        gap: 23px !important;
    }

    html body.page-home #section-4 .ceo-message__body p:not(.ceo-message__signature-inline),
    html body.page-home #section-4 .ceo-message__body > p:not(.ceo-message__lead):not(.ceo-message__signature-inline) {
        font-size: 20px !important;
        line-height: 1.65 !important;
    }

    html body.page-home #section-4 .ceo-value-card {
        width: 366px !important;
        transform: translate(9px, 3px) !important;
    }

    html body.page-home #section-4 .ceo-value-card__list {
        padding-left: 0 !important;
    }

    html body.page-home #section-4 .ceo-value-card__item {
        padding: 18px 22px !important;
        font-weight: 800 !important;
    }

    /* Vision left edge in the reference is x=205; keep the card fixed. */
    html body.page-home #section-3 .vision-copy {
        transform: translateX(-8px) !important;
    }

    html body.page-home #section-3 .vision-copy__body > p:nth-child(1) {
        transform: translateY(-5px) !important;
    }

    html body.page-home #section-3 .vision-copy__body > p:nth-child(2) {
        transform: translateY(-9px) !important;
    }

    html body.page-home #section-3 .vision-copy__title {
        margin-bottom: 53px !important;
        font-size: 50px !important;
        line-height: 60.5px !important;
    }

    html body.page-home #section-3 .vision-copy__title > span,
    html body.page-home #section-3 .vision-copy__title em {
        font-size: inherit !important;
        line-height: inherit !important;
    }

    html body.page-home #section-3 .vision-challenges:not(.vision-challenges--text) {
        width: 396px !important;
        padding: 30px 42px 40px !important;
        transform: translate(22px, 3px) !important;
    }

    html body.page-home #section-3 .vision-challenge-list {
        width: auto !important;
        margin-inline: 5px !important;
    }

    html body.page-home #section-3 .vision-challenge-card h4 {
        font-size: 18px !important;
        line-height: 1.2 !important;
        font-weight: 800 !important;
        white-space: nowrap !important;
    }

    /* Business heading is 3px higher, while the cards begin 8px lower. */
    html body.page-home #section-5 .business-services__header {
        transform: translateY(-3px) !important;
    }

    html body.page-home #section-5 .business-services__title {
        font-size: 50.5px !important;
    }

    html body.page-home #section-5 .business-services__cards {
        transform: translateY(8px) !important;
    }

    /* Safety: tune metric rhythm and reproduce the clipped horizontal row. */
    html body.page-home #section-6 .business-safety {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    html body.page-home #section-6 .business-safety__copy {
        transform: translateX(10px) !important;
    }

    html body.page-home #section-6 .business-safety__rate {
        font-size: 97px !important;
        letter-spacing: normal !important;
        transform: translate(1px, -2px) !important;
    }

    html body.page-home #section-6 .business-safety__label {
        letter-spacing: .25px !important;
        transform: translate(1px, -7px) !important;
    }

    html body.page-home #section-6 .business-safety__badges {
        width: 769px !important;
        gap: 14px !important;
        transform: translate(10px, -5px) !important;
    }

    html body.page-home #section-6 .safety-badge {
        width: 85px !important;
        height: 55px !important;
    }

    html body.page-home #section-6 .business-safety__title {
        font-size: 48.5px !important;
        line-height: 56.64px !important;
        transform: translate(1px, -2px) !important;
    }

    html body.page-home #section-6 .business-safety__text {
        margin-top: 24px !important;
        font-size: 20px !important;
        line-height: 30.78px !important;
        letter-spacing: .15px !important;
        transform: translate(1px, -1px) !important;
    }

    html body.page-home #section-6 .business-safety__trust {
        transform: translate(96px, 1px) !important;
    }

    html body.page-home #section-6 .safety-trust-card {
        flex-basis: 324px !important;
        width: 324px !important;
    }

    html body.page-home #section-6 .safety-trust-card img {
        transform: translateY(-8px) !important;
    }

    html body.page-home #section-6 .safety-trust-card--ghost > * {
        visibility: hidden !important;
    }

    /* Contact: keep the eyebrow fixed; lower the headline and form. */
    html body.page-home #section-8 .quote-contact__title {
        transform: translateY(5px) !important;
    }

    html body.page-home #section-8 .quote-contact__layout {
        transform: translate(5px, 9px) !important;
    }

    html body.page-home #section-8 .quote-form {
        width: 726px !important;
        max-width: 726px !important;
        padding-top: 21px !important;
        gap: 3px !important;
    }

    html body.page-home #section-8 .quote-form__grid {
        column-gap: 18px !important;
        row-gap: 13px !important;
    }
}

/*
 * The supplied desktop references are 1900px wide. Between 1601px and 1899px,
 * preserve the 1900px composition while compensating for the small residual
 * offsets introduced by the proportional desktop zoom. The hero needs the
 * larger correction; the remaining panels only need 2-5px at 1676px.
 * Safety has its own measured composition and the product panel intentionally
 * follows the port-2000 design, so neither is included here.
 */
@media (min-width: 1601px) and (max-width: 1899px) {
    html body.page-home {
        --finf-reference-hero-y: clamp(0px, calc(209px - 11vw), 33px);
        --finf-reference-y-5: clamp(0px, calc(42px - 2.2vw), 7px);
        --finf-reference-y-4: clamp(0px, calc(34px - 1.8vw), 5px);
        --finf-reference-y-3: clamp(0px, calc(25.5px - 1.35vw), 4px);
        --finf-reference-y-2: clamp(0px, calc(17px - .9vw), 3px);
        --finf-reference-y-13: clamp(0px, calc(110.5px - 5.8vw), 16px);
        --finf-reference-globe-x: clamp(0px, calc(127.5px - 6.7vw), 20px);
    }

    html body.page-home #section-1 .hero-text-block {
        transform: translate(
            calc(-8px - var(--finf-reference-y-5)),
            calc(-8px + var(--finf-reference-hero-y) + var(--finf-reference-y-2))
        ) !important;
    }

    html body.page-home #section-2 .company-overview {
        transform: translateY(calc(-42px + var(--finf-reference-y-2))) !important;
    }

    html body.page-home #section-2 .company-overview__globe {
        transform: translate(
            calc(90px + var(--finf-reference-globe-x)),
            var(--finf-reference-y-3)
        ) !important;
    }

    html body.page-home #section-2 .company-overview__headline {
        transform: translate(
            -8px,
            calc(0px - var(--finf-reference-y-3))
        ) !important;
    }

    html body.page-home #section-core-services .core-services {
        transform: translateY(var(--finf-reference-y-3)) !important;
    }

    html body.page-home #section-core-services .core-services__cards {
        margin-top: calc(72px - var(--finf-reference-y-3)) !important;
    }

    html body.page-home #section-3 .vision-layout {
        transform: translateY(calc(0px - var(--finf-reference-y-2))) !important;
    }

    html body.page-home #section-3 .vision-copy__body,
    html body.page-home #section-3 .vision-quote {
        transform: translateY(calc(0px - var(--finf-reference-y-4))) !important;
    }

    html body.page-home #section-3 .vision-challenges:not(.vision-challenges--text) {
        transform: translate(
            22px,
            calc(3px + var(--finf-reference-y-5))
        ) !important;
    }

    html body.page-home #section-8 .quote-contact {
        transform: translateY(var(--finf-reference-y-4)) !important;
    }

    html body.page-home #section-8 .quote-contact__title {
        transform: translateY(calc(5px - var(--finf-reference-y-5))) !important;
    }

    html body.page-home #section-8 .quote-contact__layout {
        transform: translate(5px, calc(9px - var(--finf-reference-y-4))) !important;
    }

    html body.page-home #section-5 .business-services {
        transform: translate(10px, var(--finf-reference-y-2)) !important;
    }

    html body.page-home #section-5 .business-services__header {
        margin-bottom: calc(48px - var(--finf-reference-y-13)) !important;
    }

    html body.page-home #section-4 .ceo-message {
        transform: none !important;
    }

}

/* v15 motion: three safety cards flow left continuously without a stop. */
html body.page-home #section-6 .business-safety__trust {
    --safety-carousel-gap: 22px;
    --safety-carousel-viewport: min(calc(100vw - 48px), 1016px);
    --safety-carousel-card: calc((var(--safety-carousel-viewport) - (var(--safety-carousel-gap) * 2)) / 3);
    display: block !important;
    width: var(--safety-carousel-viewport) !important;
    max-width: var(--safety-carousel-viewport) !important;
    padding: 0 !important;
    overflow: hidden !important;
    transform: translate(10px, 1px) !important;
}

html body.page-home #section-6 .business-safety__trust-track {
    --safety-carousel-cycle: 0px;
    display: flex;
    width: max-content;
    gap: var(--safety-carousel-gap);
    transform: translate3d(0, 0, 0);
    will-change: transform;
}

html body.page-home #section-6 .business-safety__trust-track.is-running {
    animation: finf-safety-card-flow 12s linear infinite;
}

html body.page-home #section-6 .business-safety__trust .safety-trust-card {
    flex: 0 0 var(--safety-carousel-card) !important;
    width: var(--safety-carousel-card) !important;
    min-width: 0 !important;
}

@media (max-width: 860px) {
    html body.page-home #section-6 .business-safety__trust {
        --safety-carousel-gap: 14px;
        --safety-carousel-viewport: min(calc(100vw - 32px), 340px);
        --safety-carousel-card: var(--safety-carousel-viewport);
        transform: none !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    html body.page-home #section-6 .business-safety__trust-track {
        animation-play-state: paused !important;
    }
}

@keyframes finf-safety-card-flow {
    from {
        transform: translate3d(0, 0, 0);
    }

    to {
        transform: translate3d(calc(0px - var(--safety-carousel-cycle)), 0, 0);
    }
}

/* v16 polish: restore the brighter blue/white balance of the first hero film. */
html body.page-home #section-1 .panel-intro__video[data-video-index="0"] {
    filter: contrast(1.1) saturate(1.06) brightness(1.16) !important;
}

/* Keep the certification divider exactly as wide as the five-mark group. */
html body.page-home #section-6 .business-safety__badges {
    width: min(481px, calc(100vw - 32px)) !important;
    max-width: min(481px, calc(100vw - 32px)) !important;
}

/* v17 language menu: keep every three-letter locale code on one line. */
html body .site-lang__menu {
    min-width: 112px !important;
}

html body .site-lang .site-lang__option,
html body.page-home .site-lang .site-lang__option,
html body.page-home.home-after-hero .site-lang .site-lang__option {
    grid-template-columns: 28px minmax(32px, 1fr) !important;
}

html body .site-lang__option-text {
    display: block !important;
    min-width: 3ch !important;
    white-space: nowrap !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
}