@font-face {
    font-family: "HK Grotesk";
    src: url("../fonts/hkgrotesk-regular.woff2") format("woff2");
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "HK Grotesk";
    src: url("../fonts/hkgrotesk-semibold.woff2") format("woff2");
    font-weight: 600;
    font-display: swap;
}

@font-face {
    font-family: "HK Grotesk";
    src: url("../fonts/hkgrotesk-bold.woff2") format("woff2");
    font-weight: 700;
    font-display: swap;
}

.onz-communities-page {
    --onz-communities-ink: #172d3c;
    --onz-communities-deep: #0a202d;
    --onz-communities-paper: #f3f5f2;
    --onz-communities-soft: #e5ece8;
    --onz-communities-white: #fff;
    --onz-communities-line: rgba(23, 45, 60, .17);
    --onz-communities-muted: #5e6f78;
    --onz-communities-accent: #f9a515;
    --onz-communities-green: #1ec999;
    color: var(--onz-communities-ink);
    background: var(--onz-communities-paper);
    font-family: "HK Grotesk", sans-serif;
}

.onz-communities-page .layout-wrapper.landing { overflow: clip; }

.onz-communities-main,
.onz-communities-main h1,
.onz-communities-main h2,
.onz-communities-main h3,
.onz-communities-main p,
.onz-communities-main a,
.onz-communities-main span,
.onz-communities-main li { font-family: "HK Grotesk", sans-serif; }

.onz-communities-shell {
    width: min(1240px, calc(100% - 48px));
    margin-inline: auto;
}

.onz-communities-page .navbar-landing > .container,
.onz-communities-page .layout-wrapper.landing > section.bg-warning > .container,
.onz-communities-page .custom-footer > .container {
    width: min(1240px, calc(100% - 48px));
    max-width: none;
    padding-inline: 0;
}

.onz-communities-page .navbar-landing {
    min-height: 72px;
    border-bottom: 1px solid rgba(23, 45, 60, .1);
    background: rgba(246, 248, 247, .95);
    box-shadow: none;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

.onz-communities-page .navbar-landing.is-sticky {
    background: rgba(255, 255, 255, .97) !important;
    box-shadow: 0 10px 35px rgba(13, 32, 44, .09);
}

.onz-communities-kicker {
    margin: 0 0 19px;
    color: #a85f00;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .16em;
    line-height: 1.2;
    text-transform: uppercase;
}

.onz-communities-actions {
    display: flex;
    gap: 28px;
    align-items: center;
    flex-wrap: wrap;
}

.onz-communities-button {
    display: inline-flex;
    min-height: 56px;
    padding: 14px 24px;
    gap: 14px;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
    transition: color 180ms ease, background 180ms ease, border-color 180ms ease, transform 180ms ease;
}

.onz-communities-button:hover { transform: translateY(-2px); }
.onz-communities-button--accent { color: var(--onz-communities-deep); background: var(--onz-communities-accent); }
.onz-communities-button--accent:hover { color: var(--onz-communities-white); border-color: rgba(255, 255, 255, .62); background: transparent; }
.onz-communities-button--light { color: var(--onz-communities-deep); background: var(--onz-communities-white); }
.onz-communities-button--light:hover { color: var(--onz-communities-white); border-color: rgba(255, 255, 255, .62); background: transparent; }

.onz-communities-text-link {
    display: inline-flex;
    gap: 10px;
    align-items: center;
    padding-block: 8px;
    border-bottom: 1px solid currentColor;
    color: var(--onz-communities-ink);
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    transition: color 180ms ease;
}

.onz-communities-text-link--light { color: var(--onz-communities-white); }
.onz-communities-text-link:hover { color: var(--onz-communities-accent); }
.onz-communities-button i,
.onz-communities-text-link i { transition: transform 180ms ease; }
.onz-communities-button:hover i,
.onz-communities-text-link:hover i { transform: translateX(3px); }

.onz-communities-hero {
    position: relative;
    min-height: 720px;
    overflow: hidden;
    isolation: isolate;
    color: var(--onz-communities-white);
    background: var(--onz-communities-deep);
}

.onz-communities-hero__image,
.onz-communities-hero__shade {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.onz-communities-hero__image {
    z-index: -2;
    object-fit: cover;
    object-position: 64% center;
    filter: saturate(.8) contrast(1.04);
    transform: scale(1.02);
}

.onz-communities-hero__shade {
    z-index: -1;
    background:
        linear-gradient(90deg, rgba(5, 24, 34, .98) 0%, rgba(5, 24, 34, .91) 43%, rgba(5, 24, 34, .49) 71%, rgba(5, 24, 34, .24) 100%),
        linear-gradient(0deg, rgba(5, 24, 34, .54) 0%, transparent 48%);
}

.onz-communities-hero__inner {
    display: flex;
    min-height: 720px;
    align-items: center;
    padding-block: 135px 72px;
}

.onz-communities-hero__copy { max-width: 910px; }
.onz-communities-hero .onz-communities-kicker { color: var(--onz-communities-accent); }

.onz-communities-hero__copy > * {
    opacity: 0;
    transform: translateY(24px);
    animation: onz-communities-rise 720ms cubic-bezier(.2, .7, .2, 1) forwards;
}

.onz-communities-hero__copy > :nth-child(1) { animation-delay: 90ms; }
.onz-communities-hero__copy > :nth-child(2) { animation-delay: 200ms; }
.onz-communities-hero__copy > :nth-child(3) { animation-delay: 320ms; }
.onz-communities-hero__copy > :nth-child(4) { animation-delay: 430ms; }

.onz-communities-hero h1 {
    max-width: 930px;
    margin: 0;
    color: var(--onz-communities-white);
    font-size: clamp(54px, 6.25vw, 88px);
    font-weight: 600;
    letter-spacing: -.061em;
    line-height: .93;
}

.onz-communities-hero h1 span { color: var(--onz-communities-accent); }

.onz-communities-hero__copy > p:not(.onz-communities-kicker) {
    max-width: 780px;
    margin: 30px 0 36px;
    color: rgba(255, 255, 255, .84);
    font-size: 20px;
    line-height: 1.55;
}

.onz-communities-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(330px, .52fr);
    gap: 84px;
    align-items: end;
    padding-bottom: 58px;
    border-bottom: 1px solid var(--onz-communities-line);
}

.onz-communities-heading h2,
.onz-communities-collaboration h2,
.onz-communities-continuity h2,
.onz-communities-onboarding h2,
.onz-communities-final h2 {
    margin: 0;
    color: var(--onz-communities-ink);
    font-size: clamp(44px, 5.2vw, 72px);
    font-weight: 600;
    letter-spacing: -.057em;
    line-height: .96;
}

.onz-communities-heading h2 span,
.onz-communities-collaboration h2 span,
.onz-communities-continuity h2 span,
.onz-communities-onboarding h2 span,
.onz-communities-final h2 span { color: #b96e00; }

.onz-communities-heading > p {
    margin: 0;
    color: var(--onz-communities-muted);
    font-size: 18px;
    line-height: 1.6;
}

.onz-communities-principles { padding-block: 112px 126px; background: var(--onz-communities-paper); }

.onz-communities-principles__list {
    display: grid;
    grid-template-columns: repeat(10, minmax(0, 1fr));
    margin: 0;
    padding: 0;
    list-style: none;
}

.onz-communities-principle {
    grid-column: span 2;
    min-height: 290px;
    padding: 38px 24px 32px;
    border-right: 1px solid var(--onz-communities-line);
}

.onz-communities-principle:first-child { padding-left: 0; }
.onz-communities-principle:last-child { padding-right: 0; border-right: 0; }
.onz-communities-principle > span,
.onz-communities-role > span,
.onz-communities-onboarding__step > span {
    display: block;
    margin-bottom: 42px;
    color: #a85f00;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .12em;
}

.onz-communities-principle h3 {
    margin: 0 0 17px;
    color: var(--onz-communities-ink);
    font-size: 23px;
    font-weight: 600;
    letter-spacing: -.03em;
    line-height: 1.12;
}

.onz-communities-principle p,
.onz-communities-role p,
.onz-communities-onboarding__step p {
    margin: 0;
    color: var(--onz-communities-muted);
    font-size: 16px;
    line-height: 1.55;
}

.onz-communities-collaboration { padding-block: 126px; background: var(--onz-communities-soft); }

.onz-communities-collaboration__inner {
    display: grid;
    grid-template-columns: minmax(300px, .78fr) minmax(0, 1.22fr);
    gap: clamp(70px, 9vw, 140px);
    align-items: start;
}

.onz-communities-collaboration__media {
    position: sticky;
    top: 104px;
    margin: 0;
}

.onz-communities-collaboration__media img {
    display: block;
    width: 100%;
    height: min(670px, 70vh);
    object-fit: cover;
    object-position: center;
    filter: saturate(.82);
}

.onz-communities-collaboration__media figcaption {
    display: flex;
    gap: 18px;
    align-items: center;
    padding-top: 18px;
    color: var(--onz-communities-muted);
    font-size: 13px;
    line-height: 1.4;
}

.onz-communities-collaboration__media figcaption span { color: #a85f00; font-weight: 700; }
.onz-communities-collaboration__copy { padding-top: 12px; }
.onz-communities-collaboration__intro {
    max-width: 690px;
    margin: 28px 0 58px;
    color: var(--onz-communities-muted);
    font-size: 19px;
    line-height: 1.62;
}

.onz-communities-roles { border-top: 1px solid var(--onz-communities-line); }

.onz-communities-role {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 18px;
    padding-block: 28px;
    border-bottom: 1px solid var(--onz-communities-line);
}

.onz-communities-role > span { margin: 5px 0 0; }
.onz-communities-role h3 {
    margin: 0 0 7px;
    color: var(--onz-communities-ink);
    font-size: 24px;
    font-weight: 600;
    letter-spacing: -.025em;
}

.onz-communities-continuity { padding-block: 110px 126px; color: var(--onz-communities-white); background: var(--onz-communities-deep); }
.onz-communities-continuity .onz-communities-kicker { color: var(--onz-communities-accent); }

.onz-communities-continuity__top {
    display: grid;
    grid-template-columns: minmax(220px, .45fr) minmax(0, 1fr);
    gap: 70px;
    align-items: start;
    padding-bottom: 44px;
    border-bottom: 1px solid rgba(255, 255, 255, .2);
}

.onz-communities-continuity__statement {
    max-width: 850px;
    margin: 0;
    color: var(--onz-communities-white);
    font-size: clamp(28px, 3.4vw, 44px);
    font-weight: 600;
    letter-spacing: -.04em;
    line-height: 1.08;
}

.onz-communities-continuity__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(340px, .72fr);
    gap: clamp(70px, 10vw, 150px);
    padding-top: 86px;
}

.onz-communities-continuity h2 { color: var(--onz-communities-white); }
.onz-communities-continuity h2 span { color: var(--onz-communities-accent); }
.onz-communities-continuity__copy > p {
    max-width: 670px;
    margin: 30px 0 0;
    color: rgba(255, 255, 255, .72);
    font-size: 19px;
    line-height: 1.65;
}

.onz-communities-continuity__points { margin: 0; padding: 0; list-style: none; border-top: 1px solid rgba(255, 255, 255, .2); }
.onz-communities-continuity__points li {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr);
    gap: 14px;
    align-items: start;
    padding-block: 24px;
    border-bottom: 1px solid rgba(255, 255, 255, .2);
    color: rgba(255, 255, 255, .86);
    font-size: 17px;
    line-height: 1.5;
}

.onz-communities-continuity__points i { color: var(--onz-communities-green); font-size: 21px; }

.onz-communities-growth { padding-block: 118px 128px; background: var(--onz-communities-paper); }
.onz-communities-growth__list { border-bottom: 1px solid var(--onz-communities-line); }

.onz-communities-growth__item {
    display: grid;
    grid-template-columns: 82px minmax(0, 1fr) 60px;
    gap: 22px;
    align-items: center;
    min-height: 150px;
    padding-block: 30px;
    border-top: 1px solid var(--onz-communities-line);
    color: var(--onz-communities-ink);
    text-decoration: none;
    transition: color 190ms ease, padding-inline 190ms ease, background 190ms ease;
}

.onz-communities-growth__item:hover {
    padding-inline: 24px;
    color: var(--onz-communities-deep);
    background: var(--onz-communities-accent);
}

.onz-communities-growth__number { color: #a85f00; font-size: 13px; font-weight: 700; letter-spacing: .12em; }
.onz-communities-growth__item:hover .onz-communities-growth__number { color: var(--onz-communities-deep); }
.onz-communities-growth__item h3 {
    margin: 0 0 8px;
    color: currentColor;
    font-size: clamp(29px, 3vw, 40px);
    font-weight: 600;
    letter-spacing: -.045em;
}

.onz-communities-growth__item p { margin: 0; color: var(--onz-communities-muted); font-size: 17px; line-height: 1.5; }
.onz-communities-growth__item:hover p { color: rgba(10, 32, 45, .78); }
.onz-communities-growth__item > i { justify-self: end; font-size: 27px; transition: transform 190ms ease; }
.onz-communities-growth__item:hover > i { transform: translate(4px, -4px); }

.onz-communities-onboarding { padding-block: 116px 126px; background: var(--onz-communities-accent); }
.onz-communities-onboarding .onz-communities-kicker { color: var(--onz-communities-deep); }
.onz-communities-onboarding h2 span { color: var(--onz-communities-deep); }

.onz-communities-onboarding__header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(340px, .55fr);
    column-gap: 80px;
    align-items: end;
}

.onz-communities-onboarding__header .onz-communities-kicker { grid-column: 1 / -1; }
.onz-communities-onboarding__header > p:last-child {
    margin: 0;
    color: rgba(10, 32, 45, .76);
    font-size: 19px;
    line-height: 1.6;
}

.onz-communities-onboarding__steps {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 64px 0 0;
    padding: 0;
    border-top: 1px solid rgba(10, 32, 45, .24);
    list-style: none;
}

.onz-communities-onboarding__step {
    min-height: 260px;
    padding: 34px 28px 24px;
    border-right: 1px solid rgba(10, 32, 45, .24);
}

.onz-communities-onboarding__step:first-child { padding-left: 0; }
.onz-communities-onboarding__step:last-child { padding-right: 0; border-right: 0; }
.onz-communities-onboarding__step > span { margin-bottom: 48px; color: var(--onz-communities-deep); }
.onz-communities-onboarding__step h3 {
    margin: 0 0 12px;
    color: var(--onz-communities-deep);
    font-size: 23px;
    font-weight: 600;
    letter-spacing: -.03em;
    line-height: 1.15;
}

.onz-communities-onboarding__step p { color: rgba(10, 32, 45, .74); }

.onz-communities-final {
    padding-block: 116px 122px;
    color: var(--onz-communities-white);
    background: #142f3f;
}

.onz-communities-final .onz-communities-kicker { color: var(--onz-communities-accent); }
.onz-communities-final h2 { max-width: 980px; color: var(--onz-communities-white); }
.onz-communities-final h2 span { color: var(--onz-communities-accent); }
.onz-communities-final > .onz-communities-shell > p:not(.onz-communities-kicker) {
    max-width: 720px;
    margin: 28px 0 38px;
    color: rgba(255, 255, 255, .76);
    font-size: 19px;
    line-height: 1.62;
}

.onz-communities-motion .onz-communities-reveal {
    opacity: 0;
    transform: translateY(25px);
    transition: opacity 650ms ease, transform 650ms cubic-bezier(.2, .7, .2, 1);
}

.onz-communities-motion .onz-communities-reveal.is-visible { opacity: 1; transform: translateY(0); }

@keyframes onz-communities-rise {
    to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 1100px) {
    .onz-communities-principles__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .onz-communities-principle { grid-column: auto; min-height: 250px; border-bottom: 1px solid var(--onz-communities-line); }
    .onz-communities-principle:nth-child(2n) { border-right: 0; }
    .onz-communities-principle:nth-child(odd) { padding-left: 0; }
    .onz-communities-principle:nth-child(even) { padding-right: 0; }
    .onz-communities-principle:last-child { grid-column: 1 / -1; min-height: auto; padding-left: 0; }
}

@media (max-width: 900px) {
    .onz-communities-heading,
    .onz-communities-continuity__grid,
    .onz-communities-onboarding__header { grid-template-columns: 1fr; gap: 30px; }

    .onz-communities-collaboration__inner { grid-template-columns: .78fr 1fr; gap: 50px; }
    .onz-communities-collaboration__media { position: static; }
    .onz-communities-onboarding__steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .onz-communities-onboarding__step:nth-child(2n) { border-right: 0; }
    .onz-communities-onboarding__step:nth-child(odd) { padding-left: 0; }
    .onz-communities-onboarding__step:nth-child(even) { padding-right: 0; }
    .onz-communities-onboarding__step:nth-child(-n+2) { border-bottom: 1px solid rgba(10, 32, 45, .24); }
}

@media (max-width: 767.98px) {
    .onz-communities-shell,
    .onz-communities-page .navbar-landing > .container,
    .onz-communities-page .layout-wrapper.landing > section.bg-warning > .container,
    .onz-communities-page .custom-footer > .container { width: min(100% - 32px, 1240px); }

    .onz-communities-hero,
    .onz-communities-hero__inner { min-height: 690px; }
    .onz-communities-hero__inner { align-items: flex-end; padding-block: 130px 64px; }
    .onz-communities-hero__image { object-position: 59% center; }
    .onz-communities-hero__shade {
        background:
            linear-gradient(0deg, rgba(5, 24, 34, .98) 0%, rgba(5, 24, 34, .91) 53%, rgba(5, 24, 34, .49) 100%),
            linear-gradient(90deg, rgba(5, 24, 34, .55), rgba(5, 24, 34, .18));
    }
    .onz-communities-hero h1 { font-size: clamp(45px, 13.3vw, 62px); line-height: .94; }
    .onz-communities-hero__copy > p:not(.onz-communities-kicker) { margin-block: 24px 30px; font-size: 18px; line-height: 1.5; }
    .onz-communities-actions { align-items: flex-start; }

    .onz-communities-heading h2,
    .onz-communities-collaboration h2,
    .onz-communities-continuity h2,
    .onz-communities-onboarding h2,
    .onz-communities-final h2 { font-size: clamp(40px, 12vw, 56px); }

    .onz-communities-principles,
    .onz-communities-collaboration,
    .onz-communities-continuity,
    .onz-communities-growth,
    .onz-communities-onboarding,
    .onz-communities-final { padding-block: 84px 92px; }

    .onz-communities-heading { padding-bottom: 40px; }
    .onz-communities-principles__list { display: block; }
    .onz-communities-principle {
        display: grid;
        grid-template-columns: 48px minmax(0, 1fr);
        min-height: auto;
        padding: 28px 0;
        border-right: 0;
    }
    .onz-communities-principle:last-child { border-bottom: 0; }
    .onz-communities-principle > span { grid-row: 1 / 3; margin: 4px 0 0; }
    .onz-communities-principle h3 { font-size: 22px; }

    .onz-communities-collaboration__inner { display: flex; flex-direction: column-reverse; gap: 50px; }
    .onz-communities-collaboration__media { width: 100%; }
    .onz-communities-collaboration__media img { height: 520px; object-position: center 33%; }
    .onz-communities-collaboration__intro { margin-bottom: 42px; }
    .onz-communities-role { grid-template-columns: 44px minmax(0, 1fr); }

    .onz-communities-continuity__top { grid-template-columns: 1fr; gap: 20px; }
    .onz-communities-continuity__grid { padding-top: 58px; }
    .onz-communities-continuity__copy > p { font-size: 18px; }

    .onz-communities-growth__item { grid-template-columns: 45px minmax(0, 1fr) 28px; min-height: 135px; gap: 10px; }
    .onz-communities-growth__item:hover { padding-inline: 12px; }
    .onz-communities-growth__item h3 { font-size: 28px; }
    .onz-communities-growth__item p { font-size: 15px; }

    .onz-communities-onboarding__steps { display: block; margin-top: 46px; }
    .onz-communities-onboarding__step {
        display: grid;
        grid-template-columns: 46px minmax(0, 1fr);
        min-height: auto;
        padding: 28px 0;
        border-right: 0;
        border-bottom: 1px solid rgba(10, 32, 45, .24);
    }
    .onz-communities-onboarding__step:last-child { border-bottom: 0; }
    .onz-communities-onboarding__step > span { grid-row: 1 / 3; margin: 4px 0 0; }
    .onz-communities-onboarding__header > p:last-child { font-size: 18px; }
}

@media (max-width: 460px) {
    .onz-communities-actions { flex-direction: column; gap: 18px; }
    .onz-communities-button { width: 100%; }
    .onz-communities-final .onz-communities-text-link { align-self: center; }
    .onz-communities-growth__item p { max-width: 255px; }
}

@media (prefers-reduced-motion: reduce) {
    .onz-communities-hero__copy > * { opacity: 1; transform: none; animation: none; }
    .onz-communities-button,
    .onz-communities-text-link,
    .onz-communities-growth__item { transition: none; }
}