@charset "UTF-8";

.barbeer-clean-harbor .mobile-section-art,
.barbeer-clean-harbor .campaign-nav .campaign-nav__mobile-only,
.barbeer-clean-harbor .campaign-nav__mobile-label {
    display: none;
}

@media (max-width: 1000px) {
    .barbeer-clean-harbor {
        --campaign-warning-height: min(16.933333vw, 127px);
        --mb-unit: 1vw;
        --mb-body-font: calc(2.933333vw);
        --mb-body-leading: calc(5.333333vw);
        --mb-main-heading: calc(4.48vw);
        --mb-point-heading: calc(4vw);
        --mb-hero-heading: calc(4.477333vw);
        --mb-hero-leading: calc(6.933333vw);
        --mb-step-heading: calc(4vw);
        --mb-step-leading: calc(4.666667vw);
        --mb-small-font: calc(2.266667vw);
        --mb-award-heading: calc(6.072vw);
        --mb-award-number: calc(3.993333vw);
        --mb-award-unit: calc(3.036vw);
        --mb-award-product: calc(3.996vw);
        --mb-award-small: calc(3.064vw);
        --mb-award-leading: calc(4.656vw);
        --mb-result-heading: calc(8.549333vw);
        --mb-result-copy: calc(3.064vw);
        --mb-nav-font: calc(4.666667vw);
        --mb-side-link-width: min(calc(15.2vw), 103px);
        --mb-side-active-width: min(calc(24vw), 180px);
        --mb-side-link-offset: calc(-1.466667vw);
        background: var(--campaign-cream);
    }

    .barbeer-clean-harbor .campaign {
        overflow: hidden;
    }

    .barbeer-clean-harbor .campaign-nav {
        position: sticky;
        top: 0;
        z-index: 9;
        height: calc(16vw);
        background: #fff;
        box-shadow: 0 2px 10px rgba(50, 31, 17, 0.14);
    }

    .barbeer-clean-harbor .campaign-nav::after {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1;
        background: #fff;
        pointer-events: none;
    }

    .barbeer-clean-harbor .campaign-nav > .campaign-nav__logo {
        top: calc(5.466667vw);
        left: calc(4.933333vw);
        z-index: 2;
        width: calc(19.6vw);
        height: calc(5.066667vw);
        transform: none;
    }

    .barbeer-clean-harbor .campaign-nav__inner {
        position: absolute;
        top: 100%;
        right: 0;
        left: 0;
        z-index: 0;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        justify-content: stretch;
        width: 100%;
        height: calc(42.32vw);
        margin: 0 auto;
        background: #fff854;
        box-shadow: 0 10px 26px rgba(50, 31, 17, 0.18);
        gap: 0;
        opacity: 0;
        pointer-events: none;
        transform: translateY(calc(-100% - 2px));
        visibility: hidden;
        transition: opacity 180ms ease, transform 220ms ease, visibility 0s linear 220ms;
    }

    .barbeer-clean-harbor .campaign-nav.is-open .campaign-nav__inner {
        opacity: 1;
        pointer-events: auto;
        transform: translateY(0);
        visibility: visible;
        transition-delay: 0s;
    }

    .barbeer-clean-harbor .campaign-menu-button {
        position: absolute;
        top: calc(4.666667vw);
        right: calc(5.466667vw);
        z-index: 2;
        display: block;
        width: calc(9.066667vw);
        height: calc(7.066667vw);
        padding: 0;
        border: 0;
        background: transparent;
        cursor: pointer;
    }

    .barbeer-clean-harbor .campaign-menu-button span {
        position: absolute;
        right: 0;
        left: 0;
        height: calc(1.066667vw);
        background: #4b4b4b;
        transform-origin: center;
        transition: top 180ms ease, opacity 140ms ease, transform 180ms ease;
    }

    .barbeer-clean-harbor .campaign-menu-button span:nth-child(1) {
        top: 0;
    }

    .barbeer-clean-harbor .campaign-menu-button span:nth-child(2) {
        top: calc(3.066667vw);
    }

    .barbeer-clean-harbor .campaign-menu-button span:nth-child(3) {
        top: calc(6vw);
    }

    html.campaign-menu-open .barbeer-clean-harbor .campaign-menu-button span:nth-child(1) {
        top: calc(3.066667vw);
        transform: rotate(45deg);
    }

    html.campaign-menu-open .barbeer-clean-harbor .campaign-menu-button span:nth-child(2) {
        opacity: 0;
    }

    html.campaign-menu-open .barbeer-clean-harbor .campaign-menu-button span:nth-child(3) {
        top: calc(3.066667vw);
        transform: rotate(-45deg);
    }

    .barbeer-clean-harbor .campaign-nav a,
    .barbeer-clean-harbor .campaign-nav .campaign-nav__mobile-only {
        position: relative;
        display: flex;
        flex: 1 1 33.333333%;
        align-items: center;
        justify-content: flex-start;
        width: 100%;
        min-height: 0;
        padding: 0 calc(5.066667vw) 0 calc(15.733333vw);
        color: #17100b;
        font-size: var(--mb-nav-font);
        font-weight: 400;
        line-height: 1;
        letter-spacing: 0.03em;
    }

    .barbeer-clean-harbor .campaign-nav a::before {
        content: "";
        position: absolute;
        top: 50%;
        left: calc(6.4vw);
        width: calc(8.133333vw);
        height: 10vw;
        aspect-ratio: 61 / 75;
        background: center / contain no-repeat;
        transform: translateY(-50%);
    }

    .barbeer-clean-harbor .campaign-nav a:nth-child(1)::before {
        background-image: url("../images/mobile/nav-mission.png");
    }

    .barbeer-clean-harbor .campaign-nav a:nth-child(2)::before {
        background-image: url("../images/mobile/nav-treasure.png");
    }

    .barbeer-clean-harbor .campaign-nav a:nth-child(3)::before {
        background-image: url("../images/mobile/nav-awards.png");
    }

    .barbeer-clean-harbor .campaign-nav a:nth-child(4)::before {
        background-image: url("../images/mobile/nav-results.png");
    }

    .barbeer-clean-harbor .campaign-nav a:nth-child(5)::before {
        background-image: url("../images/mobile/nav-ocean.png");
    }

    .barbeer-clean-harbor .campaign-nav a::after {
        right: calc(5.066667vw);
        bottom: 0;
        left: calc(5.066667vw);
        height: 1px;
        border-radius: 0;
        background: #17100b;
        transform: none;
    }

    .barbeer-clean-harbor .campaign-nav a:nth-child(3)::after,
    .barbeer-clean-harbor .campaign-nav a:last-child::after {
        display: none;
    }

    .barbeer-clean-harbor .activity-rules-modal {
        top: calc(16vw);
    }

    .barbeer-clean-harbor .activity-rules-modal__panel {
        top: 0;
        width: min(100%, 750px);
        height: 100%;
        border-width: 0;
        box-shadow: none;
        transform: translateX(50%) scale(0.985);
    }

    .barbeer-clean-harbor .activity-rules-modal__scroll {
        scrollbar-width: thin;
    }

    .barbeer-clean-harbor .activity-rules-modal__scroll::-webkit-scrollbar {
        width: 6px;
    }

    .barbeer-clean-harbor .activity-rules-modal__scroll-cue {
        position: absolute;
        bottom: min(3.2vw, 24px);
        left: 50%;
        z-index: 5;
        display: block;
        width: min(5.333333vw, 40px);
        height: auto;
        padding: 0;
        background: transparent;
        opacity: 1;
        pointer-events: none;
        transform: translateX(-50%);
        transition: opacity 160ms ease;
    }

    .barbeer-clean-harbor .activity-rules-modal__scroll-cue img {
        display: block;
        width: 100%;
        height: auto;
        animation: activity-rules-arrow-nudge 1.35s ease-in-out infinite;
    }

    .barbeer-clean-harbor .activity-rules-modal.is-at-bottom .activity-rules-modal__scroll-cue {
        opacity: 0;
    }

    .barbeer-clean-harbor .activity-rules-modal__close {
        top: clamp(10px, 3.2vw, 24px);
        right: clamp(10px, 3.2vw, 24px);
        width: clamp(44px, 10.666667vw, 64px);
        height: clamp(44px, 10.666667vw, 64px);
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
        transition: opacity 160ms ease;
    }

    .barbeer-clean-harbor .activity-rules-modal__close:hover {
        background: transparent;
        opacity: 0.62;
        transform: none;
    }

    .barbeer-clean-harbor .activity-rules-modal__close:focus-visible {
        outline: none;
        background: transparent;
    }

    .barbeer-clean-harbor .activity-rules-modal__close span {
        width: 72.727%;
        height: 2px;
        border-radius: 0;
    }

    .barbeer-clean-harbor .activity-rules-document {
        min-height: min(1166.666667vw, 8750px);
        background-image: url("../images/popup/popup-bg-mb.jpg");
        background-position: left top;
        background-size: calc(100% + 6px) 100%;
    }

    .barbeer-clean-harbor .activity-rules-document__header {
        width: 80.8%;
        padding-top: min(11.066667vw, 83px);
        margin-bottom: min(2.4vw, 18px);
    }

    .barbeer-clean-harbor .activity-rules-document__body {
        position: relative;
        left: 3px;
        width: min(85.466667vw, 641px);
        max-width: none;
        padding-bottom: min(11.066667vw, 83px);
    }

    .barbeer-clean-harbor .activity-rules-section {
        margin-bottom: min(4vw, 30px);
    }

    .barbeer-clean-harbor .activity-rules-section--name {
        min-height: min(19.333333vw, 145px);
        padding-right: 34%;
        margin-bottom: 0;
    }

    .barbeer-clean-harbor .activity-rules-section:nth-of-type(2) {
        margin-bottom: min(4.266667vw, 32px);
    }

    .barbeer-clean-harbor .activity-rules-section:nth-of-type(3) {
        margin-bottom: min(3.333333vw, 25px);
    }

    .barbeer-clean-harbor .activity-rules-section:nth-of-type(4) {
        margin-bottom: min(3.466667vw, 26px);
    }

    .barbeer-clean-harbor .activity-rules-section:nth-of-type(5) {
        margin-bottom: min(2.933333vw, 22px);
    }

    .barbeer-clean-harbor .activity-rules-section:nth-of-type(6) {
        margin-bottom: min(3.866667vw, 29px);
    }

    .barbeer-clean-harbor .activity-rules-section--points {
        margin-bottom: min(3.6vw, 27px);
    }

    .barbeer-clean-harbor .activity-rules-section--cleanup {
        margin-bottom: min(5.2vw, 39px);
    }

    .barbeer-clean-harbor .activity-rules-section--drawing {
        margin-bottom: min(4.266667vw, 32px);
    }

    .barbeer-clean-harbor .activity-rules-section:nth-of-type(11) {
        margin-bottom: min(3.866667vw, 29px);
    }

    .barbeer-clean-harbor .activity-rules-section:nth-of-type(12) {
        margin-bottom: min(4vw, 30px);
    }

    .barbeer-clean-harbor .activity-rules-section--privacy {
        margin-bottom: 0;
    }

    .barbeer-clean-harbor .activity-rules-section h3 {
        margin-bottom: min(2.133333vw, 16px);
    }

    .barbeer-clean-harbor .activity-rules-section h3 img {
        width: auto;
        max-width: 100%;
        height: min(7.6vw, 57px);
    }

    .barbeer-clean-harbor .activity-rules-section p,
    .barbeer-clean-harbor .activity-rules-section li {
        font-size: min(3.066667vw, 23px);
        line-height: min(5.333333vw, 40px);
        letter-spacing: 0;
    }

    .barbeer-clean-harbor .activity-rules-section > p {
        padding-left: min(0.266667vw, 2px);
    }

    .barbeer-clean-harbor .activity-rules-copy--desktop {
        display: none;
    }

    .barbeer-clean-harbor .activity-rules-copy--mobile {
        display: block;
    }

    .barbeer-clean-harbor .activity-rules-copy__line--mb-1 {
        letter-spacing: 0.03em;
    }

    .barbeer-clean-harbor .activity-rules-copy__line--mb-2 {
        letter-spacing: -0.01em;
    }

    .barbeer-clean-harbor .activity-rules-copy__line--mb-3 {
        letter-spacing: 0.03em;
    }

    .barbeer-clean-harbor .activity-rules-section--description > p,
    .barbeer-clean-harbor .activity-rules-section--period > p,
    .barbeer-clean-harbor .activity-rules-section--cleanup li {
        text-align: justify;
        text-align-last: left;
        text-justify: inter-character;
    }

    .barbeer-clean-harbor .activity-rules-section--eligibility li:nth-child(2) {
        letter-spacing: 0;
    }

    .barbeer-clean-harbor .activity-rules-section--participation li:nth-child(2) {
        letter-spacing: 0.04em;
    }

    .barbeer-clean-harbor .activity-rules-section--period > p {
        letter-spacing: -0.06em;
    }

    .barbeer-clean-harbor .activity-rules-section--participation li:nth-child(4),
    .barbeer-clean-harbor .activity-rules-section--participation li:nth-child(5) {
        letter-spacing: -0.02em;
    }

    .barbeer-clean-harbor .activity-rules-participation-tail {
        letter-spacing: inherit;
    }

    .barbeer-clean-harbor .activity-rules-section--points li:nth-child(2),
    .barbeer-clean-harbor .activity-rules-section--points li:nth-child(6) {
        letter-spacing: -0.02em;
    }

    .barbeer-clean-harbor .activity-rules-section--points > ol > li:nth-child(3) {
        letter-spacing: 0;
    }

    .barbeer-clean-harbor .activity-rules-section--voting li:nth-child(2),
    .barbeer-clean-harbor .activity-rules-section--cleanup li {
        letter-spacing: -0.075em;
    }

    .barbeer-clean-harbor .activity-rules-points-lead {
        letter-spacing: -0.02em;
    }

    .barbeer-clean-harbor .activity-rules-break--desktop {
        display: none;
    }

    .barbeer-clean-harbor .activity-rules-section ol > li {
        padding-left: min(5.333333vw, 40px);
    }

    .barbeer-clean-harbor .activity-rules-section ol > li::before {
        top: min(0.8vw, 6px);
        width: min(3.866667vw, 29px);
        height: min(3.866667vw, 29px);
        font-size: min(2.133333vw, 16px);
    }

    .barbeer-clean-harbor .activity-rules-brand {
        width: min(6.8vw, 51px);
        margin: 0 2px;
        vertical-align: -4px;
    }

    .barbeer-clean-harbor .activity-rules-section--results ul {
        padding-left: min(8vw, 30px);
    }

    .barbeer-clean-harbor .activity-rules-island {
        top: 12px;
        width: 37.48%;
    }

    .barbeer-clean-harbor .activity-rules-points {
        width: 85.803432%;
        height: min(64.8vw, 486px);
        max-width: none;
        aspect-ratio: 550 / 486;
        margin-top: min(2vw, 15px);
    }

    .barbeer-clean-harbor .activity-rules-points table {
        top: 11.11%;
        left: 18.55%;
        width: 60.9%;
        font-size: min(2.8vw, 21px);
    }

    .barbeer-clean-harbor .activity-rules-points th,
    .barbeer-clean-harbor .activity-rules-points td {
        height: min(6.933333vw, 52px);
        border-bottom-width: clamp(1px, 0.266667vw, 2px);
    }

    .barbeer-clean-harbor .activity-rules-points th:first-child,
    .barbeer-clean-harbor .activity-rules-points td:first-child {
        padding-right: min(2.666667vw, 20px);
    }

    .barbeer-clean-harbor .activity-rules-points th:not(:first-child),
    .barbeer-clean-harbor .activity-rules-points td:not(:first-child) {
        padding-left: min(3.466667vw, 26px);
    }

    .barbeer-clean-harbor .activity-rules-points th:first-child,
    .barbeer-clean-harbor .activity-rules-points td:first-child {
        border-right-width: clamp(1px, 0.266667vw, 2px);
    }

    .barbeer-clean-harbor .activity-rules-prize {
        padding-left: min(5.333333vw, 40px);
    }

    .barbeer-clean-harbor .activity-rules-prizes {
        padding: min(0.8vw, 6px) 0 min(3.333333vw, 25px);
    }

    .barbeer-clean-harbor .activity-rules-prizes p + p {
        margin-top: min(1.066667vw, 8px);
    }

    .barbeer-clean-harbor .activity-rules-prizes p:nth-of-type(3),
    .barbeer-clean-harbor .activity-rules-prizes p:nth-of-type(7) {
        margin-top: min(3.333333vw, 25px);
    }

    .barbeer-clean-harbor .activity-rules-prize::before {
        width: min(9.266667vw, 60px);
        height: min(9.266667vw, 60px);
    }

    .barbeer-clean-harbor .activity-rules-prize small {
        font-size: min(2vw, 15px);
    }

    .barbeer-clean-harbor .campaign-nav a:hover {
        color: #a85c00;
    }

    .barbeer-clean-harbor .campaign-nav__desktop-label {
        display: none;
    }

    .barbeer-clean-harbor .campaign-nav__mobile-label {
        display: inline;
    }

    .barbeer-clean-harbor .campaign-active-link {
        position: fixed;
        top: 82vh;
        right: var(--mb-side-link-offset);
        z-index: 13;
        display: block;
        width: var(--mb-side-active-width);
        height: auto;
    }

    .barbeer-clean-harbor .campaign-game-link {
        position: fixed;
        top: 73vh;
        right: max(2px, -4.266667vw);
        z-index: 3;
        display: block;
        width: var(--mb-side-link-width);
        height: auto;
        transform: translateY(-50%);
        transition: filter 180ms ease;
    }

    .barbeer-clean-harbor .campaign-game-link img {
        width: 100%;
        height: auto;
        transition: transform 180ms ease;
    }

    .barbeer-clean-harbor .campaign-game-link:hover {
        transform: translateY(-50%);
    }

    .barbeer-clean-harbor .campaign-game-link:hover img {
        transform: scale(1.02);
    }

    /* Keep fixed side artwork aligned with Safari's changing visual viewport. */
    @supports (height: 100dvh) {
        .barbeer-clean-harbor {
            --mb-side-collapsed-correction: clamp(0px, calc(3vh - 100vh + 100dvh), 3vh);
        }

        .barbeer-clean-harbor .campaign-active-link {
            transform: translateY(calc(100dvh - 100vh - var(--mb-side-collapsed-correction)));
        }

        .barbeer-clean-harbor .campaign-game-link {
            transform: translateY(calc(-50% + 100dvh - 100vh - var(--mb-side-collapsed-correction)));
        }

        .barbeer-clean-harbor .campaign-game-link:hover {
            transform: translateY(calc(-50% + 100dvh - 100vh - var(--mb-side-collapsed-correction)));
        }
    }

    .barbeer-clean-harbor .hero {
        width: 100%;
        height: 138.4vw;
        aspect-ratio: 750 / 1038;
        margin: 0 auto;
        scroll-margin-top: calc(16vw);
    }

    .barbeer-clean-harbor .hero__background {
        background-image: url("../images/mobile/hero-background.jpg");
        background-position: center;
        background-size: 100% 100%;
    }

    .barbeer-clean-harbor .hero__inner {
        width: 100%;
        height: 100%;
    }

    .barbeer-clean-harbor .hero__lockup {
        position: absolute;
        top: 7.418%;
        left: 5.067%;
        width: 92.267%;
        margin: 0;
    }

    .barbeer-clean-harbor .hero__copy {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
    }

    .barbeer-clean-harbor .hero__copy h2 {
        position: absolute;
        top: 51.541%;
        left: 50%;
        width: max-content;
        margin: 0;
        font-size: var(--mb-hero-heading);
        line-height: 1;
        letter-spacing: 0.05em;
        white-space: nowrap;
        transform: translateX(-50%);
    }

    .barbeer-clean-harbor .brand-word,
    .barbeer-clean-harbor .brand-word--lead {
        content: url("../images/mobile/brand-bar.png");
        width: calc(9.333333vw);
        height: auto;
        margin: 0 calc(0.4vw);
        vertical-align: -0.18em;
    }

    .barbeer-clean-harbor .hero__copy p {
        position: absolute;
        top: 58.092%;
        left: 12.4%;
        width: 76.2%;
        margin: 0;
        font-size: var(--mb-body-font);
        line-height: var(--mb-hero-leading);
        letter-spacing: 0.05em;
    }

    .barbeer-clean-harbor .hero-copy-version--desktop {
        display: none;
    }

    .barbeer-clean-harbor .hero-copy-version--mobile,
    .barbeer-clean-harbor .hero-copy-line {
        display: block;
        white-space: nowrap;
    }

    .barbeer-clean-harbor .hero__copy .campaign-button--hero {
        position: absolute;
        top: 85.549%;
        left: 26.533%;
        width: 47.067%;
        height: 10.8vw;
        aspect-ratio: 353 / 81;
        transform: none;
    }

    .barbeer-clean-harbor .campaign-button--hero img {
        content: url("../images/mobile/cta-hero.png");
    }

    .barbeer-clean-harbor .story-background {
        width: 100%;
        height: 873.2vw;
        min-height: 0;
        aspect-ratio: 750 / 6549;
        margin: calc(-3.066667vw) auto 0;
        background-image: url("../images/mobile/story-background.jpg");
        background-position: center;
        background-size: 100% 100%;
    }

    .barbeer-clean-harbor .story-section,
    .barbeer-clean-harbor .steps-section,
    .barbeer-clean-harbor .awards-section {
        position: absolute;
        right: 0;
        left: 0;
        margin: 0;
        scroll-margin-top: calc(16vw + 12px);
    }

    .barbeer-clean-harbor .story-section--mission {
        top: 0.931%;
        height: 21.026%;
    }

    .barbeer-clean-harbor .story-section--ocean {
        top: 22.171%;
        height: 22.721%;
    }

    .barbeer-clean-harbor .steps-section {
        top: 43.533%;
        height: 25.103%;
    }

    .barbeer-clean-harbor .awards-section {
        top: 69.064%;
        height: 29.119%;
    }

    .barbeer-clean-harbor .story-section__inner,
    .barbeer-clean-harbor .steps-panel,
    .barbeer-clean-harbor .awards-panel {
        width: 100%;
        height: 100%;
        margin: 0;
    }

    .barbeer-clean-harbor .story-route,
    .barbeer-clean-harbor .section-shape,
    .barbeer-clean-harbor .photo,
    .barbeer-clean-harbor .ocean-photo {
        display: none;
    }

    .barbeer-clean-harbor .mobile-section-art {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1;
        display: block;
        background: center / 100% 100% no-repeat;
        pointer-events: none;
    }

    .barbeer-clean-harbor .mobile-section-art--mission {
        background-image: url("../images/mobile/mission-art.png");
    }

    .barbeer-clean-harbor .mobile-section-art--ocean {
        background-image: url("../images/mobile/ocean-art.png");
    }

    .barbeer-clean-harbor .mobile-section-art--steps {
        background-image: url("../images/mobile/steps-art.png");
    }

    .barbeer-clean-harbor .story-copy,
    .barbeer-clean-harbor .mission-point {
        z-index: 2;
    }

    .barbeer-clean-harbor .mission-copy {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
    }

    .barbeer-clean-harbor .mission-copy .section-kicker {
        position: absolute;
        top: 16.558%;
        left: 7.067%;
        width: 42.267%;
        margin: 0 !important;
    }

    .barbeer-clean-harbor .mission-copy .section-kicker img {
        content: url("../images/mobile/title-mission.png");
        width: 100%;
        height: auto;
    }

    .barbeer-clean-harbor .mission-copy h2 {
        position: absolute;
        top: 22.15%;
        left: 7.867%;
        width: 52%;
        margin: 0;
        font-size: var(--mb-main-heading);
        line-height: 1;
    }

    .barbeer-clean-harbor .mission-copy__body {
        position: absolute;
        top: 25.78%;
        left: 7.867%;
        width: 74.2%;
        color: #342419;
        font-size: var(--mb-body-font) !important;
        line-height: var(--mb-body-leading) !important;
    }

    .barbeer-clean-harbor .mission-point {
        width: 40%;
    }

    .barbeer-clean-harbor .mission-point--crisis {
        top: 65.505%;
        left: 7.733%;
        width: 41%;
    }

    .barbeer-clean-harbor .mission-point--community {
        top: 76.689%;
        left: 7.6%;
    }

    .barbeer-clean-harbor .story-copy h3,
    .barbeer-clean-harbor .mission-point h3 {
        margin: 0;
        font-size: var(--mb-point-heading);
        line-height: var(--mb-body-leading);
    }

    .barbeer-clean-harbor .mission-point p,
    .barbeer-clean-harbor .story-copy > p:not(.section-kicker) {
        font-size: var(--mb-body-font);
        line-height: var(--mb-body-leading);
    }

    .barbeer-clean-harbor .mission-point p {
        white-space: nowrap;
    }

    .barbeer-clean-harbor .copy-slash {
        font-size: 0.867em;
    }

    .barbeer-clean-harbor .ocean-copy {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 4;
        width: 100%;
    }

    .barbeer-clean-harbor .ocean-copy .section-kicker {
        position: absolute;
        top: 38.911%;
        left: 6.933%;
        width: 78.533%;
        height: auto;
        margin: 0 !important;
    }

    .barbeer-clean-harbor .ocean-copy .section-kicker img {
        content: url("../images/mobile/title-ocean.png");
        width: 100%;
        height: auto;
    }

    .barbeer-clean-harbor .ocean-copy__intro,
    .barbeer-clean-harbor .ocean-copy__partner {
        width: auto;
        color: #342419;
        font-size: var(--mb-body-font);
        line-height: var(--mb-body-leading);
    }

    .barbeer-clean-harbor .ocean-copy__intro {
        top: 44.96%;
        left: 7.867%;
        width: 83.733%;
    }

    .barbeer-clean-harbor .ocean-copy__partner {
        top: 69.086%;
        left: 7.733%;
        width: 74%;
    }

    .barbeer-clean-harbor .ocean-copy__intro .copy-line,
    .barbeer-clean-harbor .ocean-copy__partner .copy-line {
        display: block;
        white-space: nowrap;
    }

    .barbeer-clean-harbor .ocean-copy__intro .copy-line--spacer,
    .barbeer-clean-harbor .ocean-copy__partner .copy-line--spacer {
        display: block;
        height: calc(4.933333vw);
    }

    .barbeer-clean-harbor .ocean-copy__disclosure {
        margin-top: calc(var(--mb-body-leading) * 0.35) !important;
        font-size: var(--mb-small-font);
        line-height: 1;
    }

    .barbeer-clean-harbor .ocean-copy__disclosure .copy-line:first-child {
        line-height: calc(4.133333vw);
    }

    .barbeer-clean-harbor .ocean-copy__disclosure .copy-line:last-child {
        line-height: calc(3.066667vw);
    }

    .barbeer-clean-harbor .ocean-copy__partner h3 {
        margin: 0;
        font-size: var(--mb-point-heading);
        line-height: var(--mb-body-leading);
        white-space: nowrap;
    }

    .barbeer-clean-harbor .ocean-copy .campaign-button {
        position: absolute;
        top: 94.489%;
        left: 25.467%;
        width: 50.8%;
        min-height: 0;
        height: 10.933333vw;
        aspect-ratio: 381 / 82;
        margin: 0;
    }

    .barbeer-clean-harbor .campaign-button--ocean img {
        content: url("../images/mobile/cta-ocean.png");
    }

    .barbeer-clean-harbor .steps-panel__content {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
    }

    .barbeer-clean-harbor .steps-panel h2 {
        position: absolute;
        top: 17.762%;
        left: 36.133%;
        width: 27.6%;
        height: auto;
        margin: 0;
    }

    .barbeer-clean-harbor .steps-panel h2 img {
        content: url("../images/mobile/title-steps.png");
        width: 100%;
        height: auto;
    }

    .barbeer-clean-harbor .steps-panel__lead {
        position: absolute;
        top: 23.236%;
        left: 17.867%;
        width: 66.4%;
        margin: 0;
        font-size: var(--mb-body-font);
        line-height: calc(6.266667vw);
    }

    .barbeer-clean-harbor .steps-panel__lead strong {
        font-size: var(--mb-main-heading);
        line-height: var(--mb-step-leading);
    }

    .barbeer-clean-harbor .steps-panel__lead-version--desktop {
        display: none;
    }

    .barbeer-clean-harbor .steps-panel__lead-version--mobile,
    .barbeer-clean-harbor .steps-panel__lead-title,
    .barbeer-clean-harbor .steps-panel__lead-line,
    .barbeer-clean-harbor .steps-panel__gift-line {
        display: block;
        white-space: nowrap;
    }

    .barbeer-clean-harbor .steps-panel__lead-title {
        height: calc(6.266667vw);
        line-height: calc(4.266667vw);
    }

    .barbeer-clean-harbor .steps-panel__lead-line,
    .barbeer-clean-harbor .steps-panel__gift-line {
        font-size: var(--mb-body-font);
        line-height: calc(6.266667vw);
        text-align: left;
    }

    .barbeer-clean-harbor .steps-panel__lead-line {
        padding-left: calc(3.2vw);
    }

    .barbeer-clean-harbor .steps-panel__gift-line {
        padding-left: calc(4.133333vw);
    }

    .barbeer-clean-harbor .steps-panel__lead .steps-panel__gift {
        font-size: calc(var(--mb-body-font) * 1.136);
    }

    .barbeer-clean-harbor .steps-panel__gift-image {
        display: none;
    }

    .barbeer-clean-harbor .steps-panel__connectors {
        display: none;
    }

    .barbeer-clean-harbor .steps-list {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        display: block;
        width: 100%;
        margin: 0;
        padding: 0;
    }

    .barbeer-clean-harbor .steps-list li {
        position: absolute;
        min-height: 0;
        padding: 0;
    }

    .barbeer-clean-harbor .steps-list li:nth-child(1) {
        top: 33.82%;
        left: 0;
        width: 100%;
    }

    .barbeer-clean-harbor .steps-list li:nth-child(2) {
        top: 64.964%;
        left: 0;
        width: 50%;
    }

    .barbeer-clean-harbor .steps-list li:nth-child(3) {
        top: 64.964%;
        left: 50%;
        width: 50%;
    }

    .barbeer-clean-harbor .steps-list li::after {
        display: none;
    }

    .barbeer-clean-harbor .steps-list__number {
        display: block;
        width: calc(11.866667vw);
        height: 11.866667vw;
        aspect-ratio: 1;
        margin: 0 auto calc(2vw);
    }

    .barbeer-clean-harbor .steps-list li:nth-child(1) .steps-list__number img {
        content: url("../images/mobile/step-number-1.png");
    }

    .barbeer-clean-harbor .steps-list li:nth-child(2) .steps-list__number img {
        content: url("../images/mobile/step-number-2.png");
    }

    .barbeer-clean-harbor .steps-list li:nth-child(3) .steps-list__number img {
        content: url("../images/mobile/step-number-3.png");
    }

    .barbeer-clean-harbor .steps-list__number img {
        width: 100%;
        height: 100%;
    }

    .barbeer-clean-harbor .steps-list h3 {
        margin: 0;
        font-size: var(--mb-step-heading);
        line-height: var(--mb-step-leading);
    }

    .barbeer-clean-harbor .steps-list p {
        min-height: 0;
        margin: 0 auto;
        font-size: var(--mb-body-font);
        line-height: var(--mb-step-leading);
        white-space: nowrap;
    }

    .barbeer-clean-harbor .steps-list__copy--desktop {
        display: none;
    }

    .barbeer-clean-harbor .steps-list__copy--mobile {
        display: block;
    }

    .barbeer-clean-harbor .steps-list li:nth-child(1) p {
        width: 62%;
    }

    .barbeer-clean-harbor .steps-list li:nth-child(2) p,
    .barbeer-clean-harbor .steps-list li:nth-child(3) p {
        width: 86%;
    }

    .barbeer-clean-harbor .steps-list li > img,
    .barbeer-clean-harbor .steps-list__products {
        display: none;
    }

    .barbeer-clean-harbor .steps-panel__content > .campaign-button {
        position: absolute;
        top: 95.012%;
        left: 26.4%;
        width: 47.2%;
        min-height: 0;
        height: 10.933333vw;
        aspect-ratio: 354 / 82;
        transform: none;
    }

    .barbeer-clean-harbor .campaign-button--steps img {
        content: url("../images/mobile/cta-steps.png");
    }

    .barbeer-clean-harbor .awards-content {
        content: url("../images/mobile/awards-art.png?v=20260811a");
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: fill;
    }

    .barbeer-clean-harbor .awards-panel__title {
        top: 15.364%;
        left: 36.133%;
        width: 27.6%;
        height: auto;
    }

    .barbeer-clean-harbor .awards-panel__title img {
        content: url("../images/mobile/title-awards.png");
        width: 100%;
        height: auto;
    }

    .barbeer-clean-harbor .award-card {
        height: auto;
        color: #000;
    }

    .barbeer-clean-harbor .award-card .award-card__copy {
        position: static;
        width: 100%;
    }

    .barbeer-clean-harbor .award-card--special {
        top: 32.617%;
        left: 15.733%;
        width: 67.733%;
    }

    .barbeer-clean-harbor .award-card--first {
        top: 51.6%;
        left: 6.667%;
        width: 38.4%;
    }

    .barbeer-clean-harbor .award-card--second {
        top: 51.652%;
        left: 56.933%;
        width: 29.867%;
    }

    .barbeer-clean-harbor .award-card--third {
        top: 72.627%;
        left: 8.667%;
        width: 36.933%;
    }

    .barbeer-clean-harbor .award-card--fourth {
        top: 72.365%;
        left: 54.533%;
        width: 36%;
    }

    .barbeer-clean-harbor .award-card--fifth {
        top: 89.145%;
        left: 7.6%;
        width: 39.6%;
    }

    .barbeer-clean-harbor .award-card__copy h3 {
        margin: 0 0 calc(2.266667vw);
        font-size: var(--mb-award-heading);
        line-height: calc(5.733333vw);
        letter-spacing: 0.05em;
        white-space: nowrap;
    }

    .barbeer-clean-harbor .award-card__count {
        gap: calc(0.266667vw);
        height: calc(5.733333vw);
        margin-left: calc(0.533333vw);
        border-radius: calc(1.466667vw);
        transform: none;
    }

    .barbeer-clean-harbor .award-card__number {
        font-size: var(--mb-award-number);
    }

    .barbeer-clean-harbor .award-card__unit {
        font-size: var(--mb-award-unit);
    }

    .barbeer-clean-harbor .award-card--special .award-card__count {
        width: calc(8.533333vw);
    }

    .barbeer-clean-harbor .award-card--first .award-card__count,
    .barbeer-clean-harbor .award-card--second .award-card__count,
    .barbeer-clean-harbor .award-card--third .award-card__count {
        width: calc(12.266667vw);
    }

    .barbeer-clean-harbor .award-card--fourth .award-card__count {
        width: calc(14.933333vw);
    }

    .barbeer-clean-harbor .award-card--fifth .award-card__count {
        width: calc(18.133333vw);
    }

    .barbeer-clean-harbor .award-card__copy p {
        font-size: var(--mb-award-product);
        line-height: var(--mb-award-leading);
        letter-spacing: 0.01em;
    }

    .barbeer-clean-harbor .award-card__copy small {
        font-size: var(--mb-award-small);
        line-height: var(--mb-award-leading);
    }

    .barbeer-clean-harbor .award-product-break {
        display: block;
    }

    .barbeer-clean-harbor .award-card__copy strong,
    .barbeer-clean-harbor .award-card__copy small {
        position: relative;
        left: 50%;
        width: max-content;
        max-width: none;
        white-space: nowrap;
        transform: translateX(-50%);
    }

    .barbeer-clean-harbor .results-section {
        width: 100%;
        height: 129.2vw;
        aspect-ratio: 750 / 969;
        margin: calc(-1.866667vw) auto 0;
        scroll-margin-top: calc(16vw + 12px);
        background-image: url("../images/mobile/results-art.jpg");
        background-position: center;
        background-size: 100% 100%;
    }

    .barbeer-clean-harbor .results-section__inner {
        width: 100%;
        height: 100%;
        padding: 0;
    }

    .barbeer-clean-harbor .results-section h2 {
        position: absolute;
        top: 8.978%;
        left: 36.133%;
        width: 27.6%;
        height: auto;
        margin: 0;
    }

    .barbeer-clean-harbor .results-section h2 img {
        content: url("../images/mobile/title-results.png");
        width: 100%;
        height: auto;
    }

    .barbeer-clean-harbor .results-section__announcement {
        position: absolute;
        top: 18.369%;
        left: 17.467%;
        width: 64.8%;
        margin: 0;
        font-size: var(--mb-main-heading);
        line-height: 1;
        letter-spacing: 0.59em;
        white-space: nowrap;
    }

    .barbeer-clean-harbor .winner {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        transform: none;
    }

    .barbeer-clean-harbor .winner__frame,
    .barbeer-clean-harbor .winner__trophy {
        display: none;
    }

    .barbeer-clean-harbor .winner__copy {
        top: 60.372%;
        left: 41.467%;
        width: 17.067%;
        color: #17100b;
        text-align: center;
    }

    .barbeer-clean-harbor .winner__copy h3 {
        margin: 0 0 calc(3.2vw);
        font-size: var(--mb-result-heading);
        line-height: 0.92;
        white-space: nowrap;
    }

    .barbeer-clean-harbor .winner__copy p,
    .barbeer-clean-harbor .winner__copy strong {
        font-size: var(--mb-result-copy);
        line-height: 1.26;
    }

    .barbeer-clean-harbor .winner__copy strong {
        position: relative;
        left: 50%;
        display: block;
        width: max-content;
        letter-spacing: 0.21em;
        white-space: nowrap;
        transform: translateX(-50%);
    }

    .barbeer-clean-harbor .campaign-button:hover,
    .barbeer-clean-harbor .steps-panel__content > .campaign-button:hover {
        transform: none;
    }

    .preview-site-header__inner {
        width: 100%;
        padding: 0 4vw 0 5.6vw;
    }

    .preview-site-header nav {
        display: none;
    }

    .preview-site-header .btn-menu {
        display: block;
    }
}