:root {
    --reset-black: #000000;
    --reset-white: #f4f4f4;
    --reset-cyan: #6be4eb;
    --reset-magenta: #e54466;
    --reset-charcoal: #2c3138;
    --reset-text: #191d23;
    --reset-muted: #505761;
    --reset-border: rgba(44, 49, 56, .22);
}

@font-face {
    font-family: "Avalon";
    src: url("/reset/assets/fonts/avalon.otf") format("opentype");
}

@font-face {
    font-family: "VCR OSD Mono";
    src: url("/reset/assets/fonts/vcr-osd-mono.ttf") format("truetype");
}

@font-face {
    font-family: "Gill Sans";
    src: url("/assets_/fonts/gill-sans.ttf");
}

@font-face {
    font-family: "Proxima Nova Medium";
    src: url("/assets_/fonts/proxima-nova-regular.ttf");
}

body {
    margin: 0;
    overflow-x: hidden;
    background: var(--reset-white);
    color: var(--reset-text);
    font-family: "Proxima Nova Medium", monospace;
}

.reset-page {
    overflow: hidden;
}

.reset-section {
    position: relative;
    min-inline-size: 0;
    padding: 58px 0;
}

.reset-section + .reset-section {
    border-top: 1px solid rgba(44, 49, 56, .08);
}

.reset-images {
    display: block;
    inline-size: 100%;
    block-size: 100%;
    object-fit: cover;
}

/* Typography */
.reset-kicker,
.reset-kicker-sub,
.reset-kicker-date,
.reset-title,
.reset-copy {
    text-align: left;
    text-align-last: left;
}

.reset-kicker {
    margin: 0 0 8px;
    color: var(--reset-cyan);
    font-family: "Gill Sans", sans-serif;
    font-size: clamp(1.9rem, 2.8vw, 3.5rem) !important;
    font-weight: 600;
    letter-spacing: .08em;
}

.reset-kicker-sub {
    margin: 0 0 8px;
    color: var(--reset-white);
    font-family: "Gill Sans", sans-serif;
    font-size: clamp(.8rem, 1.8vw, 2rem) !important;
    letter-spacing: .08em;
}

.reset-kicker-date {
    margin: 0 0 8px;
    color: var(--reset-magenta);
    font-family: "Gill Sans", sans-serif;
    font-size: clamp(1.3rem, 1.8vw, 2.5rem) !important;
    font-weight: 600;
    letter-spacing: .08em;
}

.reset-title {
    margin: 0;
    font-family: "Gill Sans", sans-serif;
    font-weight: 600;
    line-height: .94;
    letter-spacing: .01em;
}

.reset-title-xl {
    font-size: clamp(2.5rem, 7vw, 4.7rem) !important;
}

.reset-title-lg {
    font-size: clamp(1.8rem, 3.5vw, 3.7rem) !important;
}

.reset-title-md {
    font-size: clamp(1.2rem, 2.6vw, 3rem) !important;
}

.reset-copy {
    max-inline-size: 650px;
    margin: 20px 0 0;
    color: var(--reset-muted);
    font-size: clamp(1.2rem, 1.25vw, 1.3rem) !important;
    line-height: 1.7;
}

.reset-page .reset-hero-content,
.reset-page .reset-title,
#reset-hero-title,
#reset-hero-title span {
    text-align: left !important;
    text-align-last: left !important;
    justify-content: flex-start !important;
}

h1 span {
    color: var(--reset-white) !important;
}

/* Glitch title */
.glitch-title {
    --cyan: #6be4eb;
    --magenta: #e54466;

    position: relative;
    display: inline-block;
    color: var(--reset-white);
    font-family: "Avalon", monospace;
    font-weight: 400;
    line-height: inherit;
    letter-spacing: inherit;
    text-shadow: -3px 0 var(--cyan), 3px 0 var(--magenta);
}

.glitch-title::before,
.glitch-title::after {
    content: attr(data-text);
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.glitch-title::before {
    color: var(--reset-white);
    text-shadow: -5px 0 var(--cyan);
    transform: translateX(-3px);
    clip-path: polygon(
        0 5%,
        100% 5%,
        100% 14%,
        0 14%,
        0 38%,
        100% 38%,
        100% 47%,
        0 47%,
        0 69%,
        100% 69%,
        100% 77%,
        0 77%
    );
}

.glitch-title::after {
    color: var(--reset-white);
    text-shadow: 5px 0 var(--magenta);
    transform: translateX(3px);
    clip-path: polygon(
        0 17%,
        100% 17%,
        100% 24%,
        0 24%,
        0 51%,
        100% 51%,
        100% 58%,
        0 58%,
        0 83%,
        100% 83%,
        100% 92%,
        0 92%
    );
}

.reset-title.glitch {
    text-shadow: 2px 0 0 var(--reset-magenta), -2px 0 0 var(--reset-cyan);
}

/* Buttons */
.reset-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    max-inline-size: 100%;
    min-height: 52px;
    padding: 12px 22px;
    overflow-wrap: anywhere;
    border: 1px solid var(--reset-magenta);
    background: rgba(255, 255, 255, .58);
    color: #e53664;
    font-size: .95rem;
    font-weight: 600;
    letter-spacing: .03em;
    text-align: center;
    text-transform: uppercase;
    transition: .2s ease;
}

.reset-btn:hover {
    background: var(--reset-magenta);
    color: #ffffff;
    transform: translateY(-2px);
}

.reset-btn-cyan {
    border-color: #00b6d6;
    color: #008faf;
}

.reset-btn-cyan:hover {
    background: #00b6d6;
    color: #081117;
}

/* Frames */
.reset-frame {
    position: relative;
    min-height: 1px;
    inline-size: 100%;
    border: 1px solid rgba(0, 180, 214, .8);
    border-radius: .25rem;
    background: #ffffff;
    box-shadow:
        2px 1px 0 rgba(229, 68, 102, .72),
        -2px -1px 0 rgba(107, 228, 235, .82);
}

.reset-frame::before,
.reset-frame::after {
    content: "";
    position: absolute;
    z-index: 2;
    pointer-events: none;
    height: 3px;
    opacity: .88;
}

.reset-frame::before {
    top: -3px;
    right: 14%;
    left: -4px;
    background: repeating-linear-gradient(
        90deg,
        transparent 0 24px,
        var(--reset-cyan) 24px 44px,
        transparent 44px 62px,
        var(--reset-magenta) 62px 76px,
        transparent 76px 108px
    );
}

.reset-frame::after {
    right: -5px;
    bottom: -3px;
    left: 18%;
    background: repeating-linear-gradient(
        90deg,
        transparent 0 18px,
        var(--reset-magenta) 18px 32px,
        transparent 32px 70px,
        var(--reset-cyan) 70px 92px,
        transparent 92px 118px
    );
}

.reset-frame img {
    position: relative;
    z-index: 1;
}

/* Hero */
.reset-hero {
    min-height: 590px;
    display: flex;
    align-items: center;
    color: #ffffff;
    background-image: url("/reset/assets/images/banner-v2.jpg");
    background-position: center;
    background-size: cover;
}

.reset-hero-content {
    position: relative;
    z-index: 2;
    text-align: left;
    text-align-last: left;
}

.reset-hero .reset-copy {
    max-inline-size: 560px;
    color: rgba(255, 255, 255, .88);
}

.reset-hero .reset-btn {
    padding: .6rem 1rem !important;
    border-color: var(--reset-cyan);
    border-radius: .25rem;
    background: transparent;
    color: var(--reset-cyan);
    font-size: 22px;
}

.reset-hero .reset-btn:hover {
    background: var(--reset-cyan);
    color: #000000;
}

/* Intro */
.reset-split-copy {
    min-inline-size: 0;
}

.video-placeholder {
    position: relative;
    flex-basis: 0;
    flex-grow: 1.28;
    min-inline-size: 0;
    aspect-ratio: 16 / 9;
}

.video-placeholder::after {
    content: "▶";
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: center;
    inline-size: 78px;
    block-size: 78px;
    padding-left: 5px;
    border: 2px solid rgba(255, 255, 255, .9);
    border-radius: 50%;
    background: rgba(0, 0, 0, .14);
    color: #ffffff;
    font-size: 1.7rem;
    transform: translate(-50%, -50%);
}

.reset-split .reset-btn {
    margin-top: 28px;
}

/* Horizontal sections */
.reset-horizontal-wrap {
    min-inline-size: 0;
    padding: clamp(24px, 3vw, 42px);
    border: 1px solid var(--reset-magenta);
    background: rgba(255, 255, 255, .42);
}

.reset-horizontal-head {
    margin-bottom: 28px;
}

.reset-horizontal-head .reset-copy {
    max-inline-size: 760px;
    margin-top: 12px;
}

.reset-horizontal-cyan .reset-horizontal-wrap {
    border-color: #00b6d6;
}

/* Galleries */
.reset-gallery .col,
.reset-gallery [class*="col-"],
.reset-pinterest [class*="col-"] {
    min-inline-size: 0;
}

.reset-gallery .reset-frame {
    display: block;
    aspect-ratio: 4 / 3;
}

.reset-family-copy {
    min-inline-size: 0;
}

.reset-pin-tall {
    aspect-ratio: 3 / 4;
}

.reset-pin-short {
    aspect-ratio: 4 / 3;
}

.reset-pin-medium {
    aspect-ratio: 4 / 5;
}

.reset-family .reset-btn {
    margin-top: 28px;
}

/* CTA */
.reset-cta {
    padding: 44px 0;
    border-top: 1px solid rgba(107, 228, 235, .34);
    border-bottom: 1px solid rgba(229, 68, 102, .35);
    background: #050708;
    color: #ffffff;
}

.reset-cta-inner > * {
    min-inline-size: 0;
}

.reset-cta .reset-copy {
    margin-top: 0;
    color: rgba(255, 255, 255, .76);
}

.reset-cta .reset-btn {
    border-color: var(--reset-cyan);
    background: transparent;
    color: var(--reset-cyan);
}

.reset-cta .reset-btn:hover {
    background: var(--reset-cyan);
    color: #000000;
}

/* Cards */
.reset-members-head {
    inline-size: 100%;
    margin-bottom: 32px;
}

.reset-info-card {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 14px;
    text-align: center;
    inline-size: 100%;
    padding: 24px;
    border: 1px solid rgba(0, 182, 214, .8);
    border-radius: .25rem;
    background:
        linear-gradient(
            135deg,
            rgba(107, 228, 235, .07),
            rgba(255, 255, 255, .75) 45%,
            rgba(229, 68, 102, .06)
        );
    box-shadow:
        2px 1px 0 rgba(229, 68, 102, .72),
        -2px -1px 0 rgba(107, 228, 235, .82);
}

.reset-info-content {
    inline-size: 100%;
}

.reset-info-kicker {
    margin: 0 0 7px;
    color: #00a9c7;
    font-family: "VCR OSD Mono", monospace;
    font-size: .78rem;
    letter-spacing: .08em;
}

.reset-info-text {
    margin: 0;
    color: var(--reset-text);
    font-family: "Gill Sans", sans-serif;
    font-size: clamp(1rem, 1.1vw, 1.2rem);
    font-weight: 500;
    line-height: 1.3;
}

.reset-info-text strong {
    font-weight: 700;
}

/* Quote card */
.reset-quote-card {
    align-items: flex-start;
    justify-content: center;
    min-block-size: 100%;
    margin: 0;
    overflow: hidden;
    padding: clamp(26px, 3vw, 38px);
    text-align: left;
}

.reset-quote-card::before {
    content: "";
    position: absolute;
    inset: 12px;
    border: 1px solid rgba(229, 68, 102, .28);
    pointer-events: none;
}

.reset-quote-mark {
    position: absolute;
    top: -18px;
    right: 18px;
    color: rgba(229, 68, 102, .16);
    font-family: Georgia, serif;
    font-size: clamp(6rem, 11vw, 9rem);
    font-weight: 700;
    line-height: 1;
}

.reset-quote-text {
    position: relative;
    z-index: 1;
    margin: 0;
    color: var(--reset-text);
    font-family: "Gill Sans", sans-serif;
    font-size: clamp(1.35rem, 1.9vw, 2rem);
    font-weight: 600;
    line-height: 1.15;
}

.reset-quote-source {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: 6px;
    color: #008faf;
    font-family: "VCR OSD Mono", monospace;
    font-size: .88rem;
    font-style: normal;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.reset-quote-source::before {
    content: "";
    display: block;
    inline-size: 34px;
    block-size: 2px;
    background: var(--reset-magenta);
}

/* New Members alert */
.reset-members-content {
    flex: 1 1 62%;
    min-inline-size: 0;
}

.reset-member-alert {
    flex: 0 1 470px;
    display: flex;
    align-items: center;
    gap: 22px;
    inline-size: 100%;
    max-inline-size: 470px;
    padding: 18px 24px;
    border-radius: 4px;
    background: #e7c477;
}

.reset-member-alert-icon {
    flex: 0 0 72px;
    inline-size: 72px;
}

.reset-member-alert-icon svg {
    display: block;
    inline-size: 100%;
    block-size: auto;
}

.reset-member-alert p {
    margin: 0;
    color: #171c26;
    font-family: "Gill Sans", sans-serif;
    font-size: clamp(1.05rem, 1.35vw, 1.35rem) !important;
    font-weight: 600;
    line-height: 1.16;
    letter-spacing: .01em;
}

.reset-member-alert strong {
    font-weight: 700;
}

/* Responsive */
@media (max-width: 991.98px) {
    .reset-section {
        padding: 44px 0;
    }

    .reset-hero {
        min-height: 520px;
        background-position: 62% center;
    }

    .reset-info-card {
        max-inline-size: 620px;
    }

    .reset-member-alert {
        flex-basis: auto;
        max-inline-size: 100%;
    }

    .reset-title-xl {
        font-size: 53px !important;
    }

    .reset-title-lg {
        font-size: 38px !important;
    }

    .reset-title-md {
        font-size: 30px !important;
    }

    .reset-kicker {
        font-size: 38px !important;
    }

    .reset-kicker-sub {
        font-size: 25px !important;
    }
}

@media (max-width: 575.98px) {
    .reset-hero {
        min-height: 560px;
        background-position: 68% center;
    }

    .reset-title-xl {
        font-size: 40px !important;
    }

    .reset-title-lg {
        font-size: clamp(1.55rem, 9vw, 4rem) !important;
    }

    .reset-title-md {
        font-size: clamp(1rem, 8vw, 3rem) !important;
    }

    .reset-kicker {
        font-size: 31px !important;
    }

    .reset-kicker-sub {
        font-size: 20px !important;
    }

    .reset-horizontal-wrap {
        padding: 22px 18px;
    }

    .reset-pin-tall,
    .reset-pin-short,
    .reset-pin-medium {
        aspect-ratio: 4 / 3;
    }

    .reset-btn {
        gap: 12px;
        padding-right: 16px;
        padding-left: 16px;
    }

    .video-placeholder::after {
        inline-size: 62px;
        block-size: 62px;
    }

    .reset-info-card {
        gap: 14px;
        padding: 18px;
    }

    .reset-info-text {
        font-size: 18px !important
    }

    .reset-quote-card {
        padding: 24px;
    }

    .reset-member-alert {
        gap: 15px;
        padding: 16px 18px;
    }

    .reset-member-alert-icon {
        flex-basis: 58px;
        inline-size: 58px;
    }

    .reset-member-alert p {
        font-size: 1rem;
        line-height: 1.2;
    }
}