.olj-partners-page {
    padding-top: 24px;
}

.olj-partners-container {
    width: min(1664px, calc(100% - clamp(40px, 11.25vw, 216px)));
    margin-right: auto;
    margin-left: auto;
}

.olj-partners-hero {
    position: relative;
    height: min(905px, 47.14vw);
    min-height: 560px;
    overflow: hidden;
    color: #ffffff;
    background: #0a0a0a;
}

.olj-partners-hero > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.olj-partners-hero__copy {
    position: absolute;
    inset: 0;
    padding-left: max(40px, calc((100vw - 1684px) / 2));
}

.olj-partners-hero h1 {
    position: absolute;
    top: 28.62%;
    left: max(40px, calc((100vw - 1684px) / 2));
    margin: 0;
    font-size: clamp(58px, 5vw, 96px);
    line-height: 1;
}

.olj-partners-hero__lead {
    position: absolute;
    top: 42.32%;
    left: max(40px, calc((100vw - 1684px) / 2));
    width: min(700px, 36.5vw);
    margin: 0;
    font-size: clamp(20px, 1.25vw, 24px);
    font-weight: 500;
    line-height: 1.42;
}

.olj-partners-hero__copy > p:last-child {
    position: absolute;
    top: 72.49%;
    left: max(40px, calc((100vw - 1684px) / 2));
    width: min(634px, 34vw);
    margin: 0;
    color: rgba(255, 255, 255, 0.62);
    font-size: clamp(14px, 0.94vw, 18px);
    line-height: 1.56;
}

.olj-partner-overview {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: clamp(16px, 1.56vw, 30px);
    padding: clamp(48px, 3.8vw, 73px) 0 clamp(110px, 12.4vw, 238px);
}

.olj-partner-overview article {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    aspect-ratio: 318 / 277;
    padding: 10.7% 5% 10.8%;
    overflow: hidden;
    border: 1px solid #515151;
    border-radius: 5px;
    text-align: center;
}

.olj-partner-overview img {
    width: auto;
    height: clamp(44px, 5.2vw, 100px);
    max-width: 82%;
    margin: 0 auto 4%;
    object-fit: contain;
}

.olj-partner-overview h2 {
    margin: 0 0 8%;
    color: #515151;
    font-size: clamp(14px, 0.83vw, 16px);
    font-weight: 500;
}

.olj-partner-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.olj-partner-overview .olj-partner-tags {
    justify-content: center;
    flex-wrap: nowrap;
    gap: 2.5%;
}

.olj-partner-overview .olj-partner-tags span {
    flex: 1 1 0;
    min-width: 0;
    min-height: clamp(22px, 1.77vw, 34px);
    padding: 3px 2px;
    font-size: clamp(7px, 0.57vw, 11px);
    white-space: nowrap;
}

.olj-partner-tags span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 5px 12px;
    border-radius: 6px;
    font-size: 11px;
    background: #d9d9d9;
}

.olj-partner-cases {
    display: grid;
    gap: clamp(78px, 9vw, 173px);
}

.olj-partner-case {
    display: grid;
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1fr);
    gap: clamp(70px, 8.4vw, 162px);
    align-items: center;
}

.olj-partner-case.is-reverse .olj-partner-case__copy {
    order: 2;
}

.olj-partner-case__brand {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 20px;
}

.olj-partner-case__brand img {
    width: clamp(42px, 3.2vw, 64px);
    height: clamp(42px, 3.2vw, 64px);
    object-fit: contain;
}

.olj-partner-case__brand h2 {
    margin: 0;
    font-size: clamp(27px, 2.18vw, 42px);
    line-height: 1.2;
}

.olj-partner-case .olj-partner-tags {
    margin-bottom: clamp(36px, 4vw, 76px);
}

.olj-partner-case h3 {
    margin: 0 0 8px;
    font-size: clamp(19px, 1.67vw, 32px);
    line-height: 1.25;
}

.olj-partner-case p {
    margin: 0 0 clamp(24px, 2.4vw, 46px);
    font-size: clamp(14px, 0.89vw, 17px);
    line-height: 1.55;
}

.olj-partner-case__image {
    width: 100%;
    aspect-ratio: 852 / 701;
    object-fit: cover;
}

.page-template-page-partners .olj-inquiry {
    width: 100%;
    margin: clamp(100px, 11vw, 210px) auto 0;
    padding-top: 0;
    border-top: 0;
    background: #d9d9d9;
}

.page-template-page-partners .olj-inquiry__inner {
    width: calc(100vw - 160px);
    min-height: 82px;
    align-items: center;
    flex-direction: row;
    justify-content: space-between;
}

.page-template-page-partners .olj-inquiry h2 {
    font-size: clamp(20px, 1.55vw, 30px);
}

.page-template-page-partners .olj-inquiry__inner p {
    max-width: 1500px;
    font-size: clamp(18px, 1.45vw, 28px);
    line-height: 1.5;
}

.page-template-page-partners .olj-inquiry__email {
    min-width: 170px;
    width: 170px;
    min-height: 48px;
    height: 48px;
    margin-top: 0;
    padding: 0 20px;
    border-radius: 7px;
    justify-content: space-between;
    font-size: 14px;
}

.page-template-page-partners .olj-inquiry__email::after,
.page-template-page-partners .olj-inquiry__email:hover::after,
.page-template-page-partners .olj-inquiry__email:focus-visible::after {
    width: 24px;
    height: 24px;
    margin: 0;
    background-image: url("../images/Partners/img_16.png");
}

@media (max-width: 900px) {
    .olj-partners-page {
        padding-top: 18px;
    }

    .olj-partner-overview {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .olj-partner-case {
        grid-template-columns: 1fr 1fr;
        gap: 36px;
    }
}

@media (max-width: 640px) {
    .olj-partners-page {
        padding-top: 24px;
    }

    .olj-partners-container {
        width: calc(100% - 40px);
    }

    .page-template-page-partners .olj-inquiry {
        width: 100%;
    }

    .olj-partners-hero {
        height: 640px;
        min-height: 0;
    }

    .olj-partners-hero > img {
        object-position: 84% center;
    }

    .olj-partners-hero__copy {
        display: flex;
        flex-direction: column;
        padding: 72px 20px 28px;
        background: rgba(0, 0, 0, 0.38);
    }

    .olj-partners-hero h1,
    .olj-partners-hero__lead,
    .olj-partners-hero__copy > p:last-child {
        position: static;
        width: auto;
    }

    .olj-partners-hero h1 {
        margin-bottom: 14px;
        font-size: 42px;
        line-height: 1.08;
    }

    .olj-partners-hero__lead {
        font-size: 17px;
        line-height: 1.5;
    }

    .olj-partners-hero__copy > p:last-child {
        margin-top: auto;
        margin-bottom: 0;
        font-size: 13px;
        line-height: 1.55;
    }

    .olj-partners-hero__copy > p:last-child {
        padding-bottom: 0;
    }

    .olj-partner-overview,
    .olj-partner-case {
        grid-template-columns: 1fr;
    }

    .olj-partner-overview {
        gap: 16px;
        padding: 40px 0 72px;
    }

    .olj-partner-overview article {
        aspect-ratio: auto;
        min-height: 180px;
        padding: 24px 20px;
    }

    .olj-partner-overview img {
        height: 64px;
        margin-bottom: 12px;
    }

    .olj-partner-overview h2 {
        margin-bottom: 14px;
        font-size: 15px;
    }

    .olj-partner-overview .olj-partner-tags {
        max-width: 260px;
        margin: 0 auto;
        gap: 8px;
    }

    .olj-partner-overview .olj-partner-tags span {
        min-height: 28px;
        padding: 4px 6px;
        font-size: 10px;
    }

    .olj-partner-case.is-reverse .olj-partner-case__copy {
        order: 0;
    }

    .olj-partner-case__image {
        order: -1;
        border-radius: 5px;
    }

    .olj-partner-cases {
        gap: 64px;
    }

    .olj-partner-case {
        gap: 28px;
    }

    .olj-partner-case__brand {
        gap: 12px;
        margin-bottom: 16px;
    }

    .olj-partner-case__brand h2 {
        font-size: 28px;
    }

    .olj-partner-case .olj-partner-tags {
        margin-bottom: 28px;
    }

    .olj-partner-case p {
        margin-bottom: 22px;
        font-size: 14px;
        line-height: 1.65;
    }

    .page-template-page-partners .olj-inquiry {
        padding-top: 0;
    }

    .page-template-page-partners .olj-inquiry__inner {
        width: calc(100vw - 28px);
        min-height: 90px;
        padding: 14px 0;
    }
}
