/* ==========================================================
   UNIUTILE
   MANIFESTO V3
   ========================================================== */


/* ==========================================================
   TOKENS
   ========================================================== */

:root {

    --black:
        #0D0D0D;

    --black-deep:
        #050505;

    --black-soft:
        #131313;

    --gold:
        #D4AF37;

    --gold-light:
        #F0CD68;

    --gold-dark:
        #98751F;

    --ivory:
        #F5F1E8;

    --white:
        #FFFFFF;

    --text:
        rgba(
            245,
            241,
            232,
            0.92
        );

    --text-soft:
        rgba(
            245,
            241,
            232,
            0.70
        );

    --text-muted:
        rgba(
            245,
            241,
            232,
            0.44
        );

    --line:
        rgba(
            245,
            241,
            232,
            0.10
        );

    --line-gold:
        rgba(
            212,
            175,
            55,
            0.40
        );

    --container:
        1220px;

    --header-height:
        82px;

    --ease:
        cubic-bezier(
            0.2,
            0.75,
            0.25,
            1
        );

    --ease-cinematic:
        cubic-bezier(
            0.16,
            1,
            0.3,
            1
        );

}


/* ==========================================================
   RESET
   ========================================================== */

*,
*::before,
*::after {

    box-sizing:
        border-box;

}


html {

    scroll-behavior:
        smooth;

    background:
        var(--black);

}


body {

    margin:
        0;

    min-width:
        320px;

    overflow-x:
        hidden;

    background:
        var(--black);

    color:
        var(--text);

    font-family:
        "Source Sans 3",
        "Segoe UI",
        Arial,
        sans-serif;

    line-height:
        1.7;

    -webkit-font-smoothing:
        antialiased;

    text-rendering:
        optimizeLegibility;

}


body.menu-open {

    overflow:
        hidden;

}


img {

    display:
        block;

    max-width:
        100%;

}


a {

    color:
        inherit;

    text-decoration:
        none;

}


button {

    color:
        inherit;

    font:
        inherit;

}


::selection {

    color:
        var(--black);

    background:
        var(--gold-light);

}


a:focus-visible,
button:focus-visible {

    outline:
        2px solid
        var(--gold-light);

    outline-offset:
        5px;

}


/* ==========================================================
   GENERATIVE BACKGROUND
   ========================================================== */

.generative-canvas {

    position:
        fixed;

    z-index:
        0;

    inset:
        0;

    width:
        100%;

    height:
        100%;

    pointer-events:
        none;

    background:

        radial-gradient(
            circle at 78% 20%,
            rgba(
                212,
                175,
                55,
                0.055
            ),
            transparent 30%
        ),

        radial-gradient(
            circle at 18% 75%,
            rgba(
                212,
                175,
                55,
                0.025
            ),
            transparent 34%
        ),

        var(--black);

}


.ambient-layer {

    position:
        fixed;

    z-index:
        1;

    inset:
        0;

    pointer-events:
        none;

    background:

        linear-gradient(
            90deg,

            rgba(
                0,
                0,
                0,
                0.32
            ),

            transparent
            30%,

            transparent
            72%,

            rgba(
                0,
                0,
                0,
                0.18
            )
        ),

        radial-gradient(
            ellipse at center,

            transparent
            20%,

            rgba(
                0,
                0,
                0,
                0.22
            )
            75%,

            rgba(
                0,
                0,
                0,
                0.50
            )
        );

}


.page-shell,
.site-footer {

    position:
        relative;

    z-index:
        5;

}


/* ==========================================================
   CONTAINER
   ========================================================== */

.container {

    width:
        min(
            calc(
                100% - 48px
            ),
            var(--container)
        );

    margin-inline:
        auto;

}


.eyebrow {

    margin:
        0 0
        20px;

    color:
        var(--gold-light);

    font-family:
        "Montserrat",
        sans-serif;

    font-size:
        0.70rem;

    font-weight:
        700;

    letter-spacing:
        0.22em;

    text-transform:
        uppercase;

}


/* ==========================================================
   SCROLL PROGRESS
   ========================================================== */

.reading-progress {

    position:
        fixed;

    z-index:
        9999;

    top:
        0;

    left:
        0;

    width:
        0;

    height:
        2px;

    pointer-events:
        none;

    background:

        linear-gradient(
            90deg,
            var(--gold-dark),
            var(--gold-light),
            var(--ivory)
        );

    box-shadow:
        0 0
        18px
        rgba(
            212,
            175,
            55,
            0.70
        );

}


/* ==========================================================
   HEADER
   ========================================================== */

.site-header {

    position:
        fixed;

    z-index:
        2000;

    top:
        0;

    left:
        0;

    width:
        100%;

    height:
        var(--header-height);

    border-bottom:
        1px solid
        transparent;

    transition:

        height
        400ms
        var(--ease),

        background
        400ms
        ease,

        border-color
        400ms
        ease,

        backdrop-filter
        400ms
        ease;

}


.site-header::after {

    content:
        "";

    position:
        absolute;

    left:
        50%;

    bottom:
        -1px;

    width:
        0;

    height:
        1px;

    opacity:
        0;

    transform:
        translateX(
            -50%
        );

    background:

        linear-gradient(
            90deg,
            transparent,
            var(--gold),
            transparent
        );

    transition:

        width
        900ms
        var(--ease-cinematic),

        opacity
        900ms
        ease;

}


.site-header.is-scrolled {

    height:
        72px;

    background:
        rgba(
            13,
            13,
            13,
            0.88
        );

    border-color:
        var(--line);

    backdrop-filter:
        blur(
            18px
        )
        saturate(
            120%
        );

}


.site-header.is-scrolled::after {

    width:
        86%;

    opacity:
        0.34;

}


.header-inner {

    width:
        min(
            calc(
                100% - 48px
            ),
            var(--container)
        );

    height:
        100%;

    margin-inline:
        auto;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

}


.brand {

    display:
        flex;

    align-items:
        center;

}


.brand-logo {

    width:
        clamp(
            145px,
            15vw,
            188px
        );

    height:
        auto;

    transition:

        transform
        400ms
        var(--ease-cinematic),

        filter
        400ms
        ease;

}


.brand:hover
.brand-logo {

    transform:
        scale(
            1.025
        );

    filter:
        brightness(
            1.12
        );

}


/* ==========================================================
   NAV
   ========================================================== */

.main-nav {

    display:
        flex;

    align-items:
        center;

    gap:
        clamp(
            22px,
            3vw,
            42px
        );

}


.main-nav a {

    position:
        relative;

    padding:
        8px 0;

    color:
        rgba(
            255,
            255,
            255,
            0.76
        );

    font-family:
        "Montserrat",
        sans-serif;

    font-size:
        0.79rem;

    font-weight:
        600;

    letter-spacing:
        0.05em;

    transition:
        color
        250ms
        ease;

}


.main-nav a::after {

    content:
        "";

    position:
        absolute;

    left:
        0;

    bottom:
        0;

    width:
        100%;

    height:
        1px;

    transform:
        scaleX(
            0
        );

    transform-origin:
        left;

    background:
        var(--gold-light);

    transition:
        transform
        320ms
        var(--ease-cinematic);

}


.main-nav a:hover,
.main-nav a.is-active {

    color:
        var(--gold-light);

}


.main-nav a:hover::after,
.main-nav a.is-active::after {

    transform:
        scaleX(
            1
        );

}


/* ==========================================================
   MOBILE MENU
   ========================================================== */

.menu-toggle {

    display:
        none;

    position:
        relative;

    z-index:
        2100;

    width:
        44px;

    height:
        44px;

    padding:
        0;

    border:
        0;

    background:
        transparent;

    cursor:
        pointer;

}


.menu-toggle span {

    position:
        absolute;

    left:
        9px;

    width:
        26px;

    height:
        1px;

    background:
        var(--ivory);

    transition:

        top
        300ms
        var(--ease),

        transform
        300ms
        var(--ease);

}


.menu-toggle span:first-child {

    top:
        17px;

}


.menu-toggle span:last-child {

    top:
        26px;

}


.menu-toggle.is-open
span:first-child {

    top:
        22px;

    transform:
        rotate(
            45deg
        );

}


.menu-toggle.is-open
span:last-child {

    top:
        22px;

    transform:
        rotate(
            -45deg
        );

}


/* ==========================================================
   HERO
   ========================================================== */

.manifesto-hero {

    position:
        relative;

    min-height:
        100svh;

    display:
        flex;

    align-items:
        center;

    overflow:
        hidden;

    border-bottom:
        1px solid
        var(--line);

}


.manifesto-hero::before {

    content:
        "";

    position:
        absolute;

    z-index:
        -1;

    inset:
        0;

    background:

        linear-gradient(
            90deg,

            rgba(
                13,
                13,
                13,
                0.94
            )
            0%,

            rgba(
                13,
                13,
                13,
                0.68
            )
            42%,

            rgba(
                13,
                13,
                13,
                0.14
            )
            100%
        );

}


.manifesto-hero-inner {

    padding-top:
        calc(
            var(--header-height)
            +
            70px
        );

    padding-bottom:
        100px;

}


.manifesto-hero h1 {

    margin:
        0;

    max-width:
        950px;

    color:
        var(--ivory);

    font-family:
        "Montserrat",
        sans-serif;

    font-size:
        clamp(
            4.8rem,
            10vw,
            10.5rem
        );

    font-weight:
        600;

    line-height:
        0.84;

    letter-spacing:
        -0.07em;

    text-transform:
        uppercase;

}


.manifesto-hero h1 span {

    display:
        block;

    color:
        var(--gold-light);

    font-weight:
        300;

}


.hero-divider {

    width:
        min(
            610px,
            80vw
        );

    height:
        1px;

    margin:
        44px 0
        30px;

    overflow:
        hidden;

    background:
        rgba(
            245,
            241,
            232,
            0.09
        );

}


.hero-divider span {

    display:
        block;

    width:
        68%;

    height:
        100%;

    background:

        linear-gradient(
            90deg,
            var(--gold),
            var(--gold-light),
            transparent
        );

    animation:
        dividerFlow
        5s
        ease-in-out
        infinite
        alternate;

}


@keyframes dividerFlow {

    from {

        width:
            32%;

    }

    to {

        width:
            88%;

    }

}


.hero-tagline {

    margin:
        0;

    color:
        var(--ivory);

    font-family:
        "Montserrat",
        sans-serif;

    font-size:
        clamp(
            1.25rem,
            2.4vw,
            2rem
        );

    font-weight:
        300;

}


.hero-tagline strong {

    display:
        block;

    margin-top:
        4px;

    color:
        var(--gold-light);

    font-weight:
        500;

}


.hero-intro {

    max-width:
        580px;

    margin:
        30px 0
        0;

    color:
        var(--text-soft);

    font-size:
        1.08rem;

    line-height:
        1.75;

}


.hero-scroll {

    display:
        inline-flex;

    align-items:
        center;

    gap:
        12px;

    margin-top:
        38px;

    color:
        var(--ivory);

    font-family:
        "Montserrat",
        sans-serif;

    font-size:
        0.78rem;

    font-weight:
        600;

    letter-spacing:
        0.06em;

}


.hero-scroll span {

    color:
        var(--gold-light);

    animation:
        scrollArrow
        1.7s
        ease-in-out
        infinite;

}


@keyframes scrollArrow {

    0%,
    100% {

        transform:
            translateY(
                0
            );

    }

    50% {

        transform:
            translateY(
                7px
            );

    }

}


/* ==========================================================
   HERO ENTRY
   ========================================================== */

.motion-ready
.hero-eyebrow {

    animation:
        heroFade
        800ms
        100ms
        var(--ease-cinematic)
        both;

}


.motion-ready
.manifesto-hero h1 {

    animation:
        heroTitle
        1300ms
        200ms
        var(--ease-cinematic)
        both;

}


.motion-ready
.hero-divider,
.motion-ready
.hero-tagline,
.motion-ready
.hero-intro,
.motion-ready
.hero-scroll {

    animation:
        heroFade
        1000ms
        var(--ease-cinematic)
        both;

}


.motion-ready
.hero-divider {

    animation-delay:
        480ms;

}


.motion-ready
.hero-tagline {

    animation-delay:
        580ms;

}


.motion-ready
.hero-intro {

    animation-delay:
        690ms;

}


.motion-ready
.hero-scroll {

    animation-delay:
        800ms;

}


@keyframes heroFade {

    from {

        opacity:
            0;

        transform:
            translateY(
                24px
            );

    }

    to {

        opacity:
            1;

        transform:
            translateY(
                0
            );

    }

}


@keyframes heroTitle {

    from {

        opacity:
            0;

        transform:
            translateY(
                40px
            )
            scale(
                0.96
            );

        filter:
            blur(
                12px
            );

    }

    to {

        opacity:
            1;

        transform:
            translateY(
                0
            )
            scale(
                1
            );

        filter:
            blur(
                0
            );

    }

}


/* ==========================================================
   DOCUMENT
   ========================================================== */

.manifesto-document {

    position:
        relative;

    padding:
        60px 0
        80px;

}


.manifesto-section {

    position:
        relative;

    width:
        min(
            calc(
                100% - 48px
            ),
            1140px
        );

    margin:
        0 auto;

    padding:
        110px 0
        120px;

    scroll-margin-top:
        95px;

}


.manifesto-section::before {

    content:
        "";

    position:
        absolute;

    z-index:
        -1;

    inset:
        45px
        -45px;

    opacity:
        0;

    border-radius:
        30px;

    background:

        linear-gradient(
            120deg,

            rgba(
                13,
                13,
                13,
                0.72
            ),

            rgba(
                13,
                13,
                13,
                0.34
            ),

            rgba(
                13,
                13,
                13,
                0.10
            )
        );

    backdrop-filter:
        blur(
            3px
        );

    transition:
        opacity
        900ms
        ease;

}


.manifesto-section.is-visible::before {

    opacity:
        1;

}


.manifesto-section::after {

    content:
        "";

    position:
        absolute;

    left:
        0;

    bottom:
        0;

    width:
        100%;

    height:
        1px;

    background:

        linear-gradient(
            90deg,

            rgba(
                212,
                175,
                55,
                0.46
            ),

            rgba(
                245,
                241,
                232,
                0.08
            )
            45%,

            transparent
            85%
        );

}


.section-accent {

    position:
        absolute;

    left:
        0;

    top:
        88px;

    width:
        52px;

    height:
        2px;

    background:
        var(--gold);

    box-shadow:
        0 0
        16px
        rgba(
            212,
            175,
            55,
            0.45
        );

    transform:
        scaleX(
            0
        );

    transform-origin:
        left;

    transition:
        transform
        1200ms
        300ms
        var(--ease-cinematic);

}


.manifesto-section.is-visible
.section-accent {

    transform:
        scaleX(
            1
        );

}


.section-grid {

    display:
        grid;

    grid-template-columns:
        minmax(
            260px,
            0.52fr
        )
        minmax(
            0,
            1fr
        );

    gap:
        clamp(
            55px,
            8vw,
            120px
        );

    align-items:
        start;

}


.section-heading {

    position:
        sticky;

    top:
        120px;

    padding-top:
        18px;

}


.section-kicker {

    margin:
        0 0
        15px;

    color:
        var(--gold-light);

    font-family:
        "Montserrat",
        sans-serif;

    font-size:
        0.66rem;

    font-weight:
        700;

    letter-spacing:
        0.20em;

}


.section-heading h2 {

    margin:
        0;

    color:
        var(--ivory);

    font-family:
        "Montserrat",
        sans-serif;

    font-size:
        clamp(
            2.3rem,
            4vw,
            4.4rem
        );

    font-weight:
        500;

    line-height:
        1.02;

    letter-spacing:
        -0.05em;

}


.section-copy {

    max-width:
        720px;

}


.section-copy p {

    margin:
        0 0
        24px;

    color:
        var(--text-soft);

    font-size:
        clamp(
            1.03rem,
            1.35vw,
            1.13rem
        );

    line-height:
        1.82;

}


.section-copy
p.lead {

    margin-bottom:
        32px;

    color:
        var(--ivory);

    font-size:
        clamp(
            1.22rem,
            1.8vw,
            1.45rem
        );

    font-weight:
        600;

    line-height:
        1.62;

}


/* ==========================================================
   EMPHASIS SECTIONS
   ========================================================== */

.manifesto-section-emphasis::before {

    background:

        radial-gradient(
            circle at 75% 45%,

            rgba(
                212,
                175,
                55,
                0.055
            ),

            transparent
            35%
        ),

        linear-gradient(
            120deg,

            rgba(
                13,
                13,
                13,
                0.78
            ),

            rgba(
                13,
                13,
                13,
                0.26
            )
        );

}


/* ==========================================================
   STATEMENTS
   ========================================================== */

.statement {

    position:
        relative;

    margin:
        55px 0
        5px;

    padding:
        30px 0
        26px
        34px;

    border-left:
        1px solid
        var(--gold);

}


.statement::before {

    content:
        "";

    position:
        absolute;

    left:
        -1px;

    top:
        0;

    width:
        1px;

    height:
        36%;

    background:
        var(--gold-light);

    box-shadow:
        0 0
        18px
        rgba(
            212,
            175,
            55,
            0.70
        );

    animation:
        statementPulse
        5s
        ease-in-out
        infinite
        alternate;

}


@keyframes statementPulse {

    from {

        height:
            25%;

    }

    to {

        height:
            90%;

    }

}


.statement p {

    margin:
        0 0
        14px;

    color:
        var(--ivory);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(
            1.35rem,
            2.1vw,
            2rem
        );

    font-style:
        italic;

    line-height:
        1.42;

}


.statement
p:last-child {

    margin-bottom:
        0;

}


.statement-large p {

    font-size:
        clamp(
            1.65rem,
            2.7vw,
            2.55rem
        );

}


/* ==========================================================
   FINAL
   ========================================================== */

.manifesto-section-final {

    padding-bottom:
        90px;

}


.manifesto-section-final::after {

    display:
        none;

}


.final-signature {

    margin-top:
        65px;

    padding-top:
        42px;

    border-top:
        1px solid
        var(--line-gold);

}


.final-signature img {

    width:
        clamp(
            205px,
            27vw,
            330px
        );

    margin-bottom:
        24px;

}


.final-signature strong {

    display:
        block;

    color:
        var(--ivory);

    font-family:
        "Montserrat",
        sans-serif;

    font-size:
        clamp(
            1.65rem,
            3vw,
            2.75rem
        );

    font-weight:
        400;

}


.final-signature span {

    display:
        block;

    margin-top:
        7px;

    color:
        var(--gold-light);

    font-size:
        1.08rem;

}


/* ==========================================================
   CLOSING
   ========================================================== */

.closing-section {

    position:
        relative;

    padding:
        140px 0;

    overflow:
        hidden;

    border-top:
        1px solid
        var(--line);

    border-bottom:
        1px solid
        var(--line);

    background:

        radial-gradient(
            circle at 50% 50%,

            rgba(
                212,
                175,
                55,
                0.10
            ),

            transparent
            42%
        ),

        rgba(
            5,
            5,
            5,
            0.74
        );

    backdrop-filter:
        blur(
            4px
        );

}


.closing-inner {

    text-align:
        center;

}


.closing-inner h2 {

    max-width:
        850px;

    margin:
        0 auto;

    color:
        var(--ivory);

    font-family:
        "Montserrat",
        sans-serif;

    font-size:
        clamp(
            2.6rem,
            5vw,
            5rem
        );

    font-weight:
        500;

    line-height:
        1.02;

    letter-spacing:
        -0.05em;

}


.closing-actions {

    display:
        flex;

    justify-content:
        center;

    flex-wrap:
        wrap;

    gap:
        14px;

    margin-top:
        42px;

}


/* ==========================================================
   BUTTONS
   ========================================================== */

.button {

    position:
        relative;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    min-height:
        52px;

    padding:
        0 28px;

    overflow:
        hidden;

    border-radius:
        999px;

    white-space:
        nowrap;

    font-family:
        "Montserrat",
        sans-serif;

    font-size:
        0.78rem;

    font-weight:
        700;

    letter-spacing:
        0.035em;

    will-change:
        transform;

    transition:

        transform
        220ms
        var(--ease),

        background
        300ms
        ease,

        border-color
        300ms
        ease,

        box-shadow
        300ms
        ease;

}


.button-primary {

    color:
        #070707;

    background:

        linear-gradient(
            135deg,
            #BE9223,
            var(--gold-light)
        );

    box-shadow:
        0 12px
        35px
        rgba(
            212,
            175,
            55,
            0.18
        );

}


.button-primary:hover {

    box-shadow:
        0 18px
        55px
        rgba(
            212,
            175,
            55,
            0.35
        );

}


.button-secondary {

    color:
        var(--ivory);

    border:
        1px solid
        rgba(
            245,
            241,
            232,
            0.27
        );

    background:
        rgba(
            13,
            13,
            13,
            0.48
        );

    backdrop-filter:
        blur(
            8px
        );

}


.button-secondary:hover {

    border-color:
        var(--line-gold);

    background:
        rgba(
            212,
            175,
            55,
            0.07
        );

}


/* ==========================================================
   REVEAL
   ========================================================== */

.js .reveal {

    opacity:
        0;

    transform:
        translate3d(
            0,
            55px,
            0
        );

    transition:

        opacity
        1000ms
        var(--ease-cinematic),

        transform
        1000ms
        var(--ease-cinematic);

}


.js .reveal.is-visible {

    opacity:
        1;

    transform:
        translate3d(
            0,
            0,
            0
        );

}


/* ==========================================================
   FOOTER
   ========================================================== */

.site-footer {

    padding:
        58px 0
        52px;

    border-top:
        1px solid
        var(--line);

    background:
        #050505;

}


.footer-layout {

    display:
        grid;

    grid-template-columns:

        minmax(
            200px,
            1fr
        )

        auto

        auto;

    gap:
        50px;

    align-items:
        end;

}


.footer-logo {

    width:
        165px;

}


.footer-brand p {

    margin:
        11px 0
        0;

    color:
        var(--gold-light);

    font-size:
        0.82rem;

}


.footer-nav {

    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        25px;

}


.footer-nav a,
.footer-email {

    color:
        var(--text-soft);

    transition:
        color
        250ms
        ease;

}


.footer-nav a {

    font-size:
        0.82rem;

}


.footer-nav a:hover,
.footer-email:hover {

    color:
        var(--gold-light);

}


.footer-meta {

    text-align:
        right;

    color:
        var(--text-muted);

    font-size:
        0.74rem;

}


.footer-email {

    display:
        inline-block;

    margin-bottom:
        8px;

    font-size:
        0.82rem;

}


.footer-meta p {

    margin:
        3px 0;

}


/* ==========================================================
   TABLET
   ========================================================== */

@media
(max-width: 980px) {

    .section-grid {

        grid-template-columns:

            minmax(
                220px,
                0.45fr
            )

            minmax(
                0,
                1fr
            );

        gap:
            50px;

    }


    .footer-layout {

        grid-template-columns:
            1fr;

        align-items:
            start;

    }


    .footer-meta {

        text-align:
            left;

    }

}


/* ==========================================================
   MOBILE
   ========================================================== */

@media
(max-width: 760px) {

    :root {

        --header-height:
            72px;

    }


    .container,
    .header-inner {

        width:
            calc(
                100% - 32px
            );

    }


    .brand-logo {

        width:
            145px;

    }


    .menu-toggle {

        display:
            block;

    }


    .main-nav {

        position:
            fixed;

        inset:
            0;

        display:
            flex;

        flex-direction:
            column;

        align-items:
            center;

        justify-content:
            center;

        gap:
            30px;

        opacity:
            0;

        visibility:
            hidden;

        pointer-events:
            none;

        background:
            rgba(
                13,
                13,
                13,
                0.97
            );

        backdrop-filter:
            blur(
                18px
            );

        transition:

            opacity
            300ms
            var(--ease),

            visibility
            300ms
            var(--ease);

    }


    .main-nav.is-open {

        opacity:
            1;

        visibility:
            visible;

        pointer-events:
            auto;

    }


    .main-nav a {

        font-size:
            1.15rem;

    }


    /* HERO */

    .manifesto-hero {

        min-height:
            840px;

        align-items:
            flex-end;

    }


    .manifesto-hero::before {

        background:

            linear-gradient(
                180deg,

                rgba(
                    13,
                    13,
                    13,
                    0.18
                ),

                rgba(
                    13,
                    13,
                    13,
                    0.72
                )
                48%,

                rgba(
                    13,
                    13,
                    13,
                    0.96
                )
                82%
            );

    }


    .manifesto-hero-inner {

        padding-top:
            145px;

        padding-bottom:
            105px;

    }


    .manifesto-hero h1 {

        font-size:
            clamp(
                3.7rem,
                18vw,
                6rem
            );

        line-height:
            0.90;

    }


    .hero-intro {

        font-size:
            1rem;

    }


    /* SECTIONS */

    .manifesto-document {

        padding-top:
            15px;

    }


    .manifesto-section {

        width:
            calc(
                100% - 32px
            );

        padding:
            85px 0
            90px;

    }


    .manifesto-section::before {

        inset:
            28px
            -14px;

        border-radius:
            20px;

        background:

            linear-gradient(
                180deg,

                rgba(
                    13,
                    13,
                    13,
                    0.76
                ),

                rgba(
                    13,
                    13,
                    13,
                    0.35
                )
            );

    }


    .section-grid {

        display:
            block;

    }


    .section-heading {

        position:
            static;

        margin-bottom:
            36px;

        padding-top:
            0;

    }


    .section-heading h2 {

        font-size:
            clamp(
                2.35rem,
                11vw,
                3.7rem
            );

    }


    .section-accent {

        top:
            66px;

    }


    .section-copy p {

        font-size:
            1.02rem;

        line-height:
            1.78;

    }


    .section-copy
    p.lead {

        font-size:
            1.20rem;

    }


    .statement {

        margin-top:
            42px;

        padding-left:
            23px;

    }


    .statement p {

        font-size:
            1.32rem;

    }


    .statement-large p {

        font-size:
            1.55rem;

    }


    /* CLOSING */

    .closing-section {

        padding:
            105px 0;

    }


    .closing-actions {

        flex-direction:
            column;

        width:
            min(
                350px,
                100%
            );

        margin-inline:
            auto;

    }


    .button {

        width:
            100%;

    }


    /* FOOTER */

    .footer-nav {

        flex-direction:
            column;

        gap:
            9px;

    }

}


/* ==========================================================
   SMALL MOBILE
   ========================================================== */

@media
(max-width: 420px) {

    .eyebrow {

        font-size:
            0.64rem;

        letter-spacing:
            0.16em;

    }


    .manifesto-section {

        width:
            calc(
                100% - 28px
            );

    }


    .final-signature span {

        font-size:
            0.94rem;

    }

}


/* ==========================================================
   REDUCED MOTION
   ========================================================== */

@media
(prefers-reduced-motion: reduce) {

    html {

        scroll-behavior:
            auto;

    }


    *,
    *::before,
    *::after {

        animation-duration:
            0.01ms
            !important;

        animation-iteration-count:
            1
            !important;

        transition-duration:
            0.01ms
            !important;

    }


    .js .reveal {

        opacity:
            1;

        transform:
            none;

    }


    .magnetic {

        transform:
            none
            !important;

    }

}