/* ==========================================================
   MANIFEST
========================================================== */

.manifest{

    position:relative;

    padding:170px 0 140px;

    overflow:hidden;

    text-align:center;

    background:
        radial-gradient(circle at 50% 10%,
            rgba(189,146,79,.09),
            transparent 35%),
        var(--color-surface);

}

.manifest::before{

    content:"";

    position:absolute;

    top:0;
    left:50%;

    width:1px;
    height:120px;

    background:
        linear-gradient(
            to bottom,
            rgba(189,146,79,.40),
            transparent
        );

    transform:translateX(-50%);

}

.manifest .pz-container{

    position:relative;

    z-index:2;

    max-width:900px;

}

.manifest .pz-badge{

    margin-bottom:28px;

}

.manifest-line{

    display:block;

    width:90px;

    height:2px;

    margin:0 auto 40px;

    border-radius:999px;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--color-primary),
            transparent
        );

}

.manifest h2{

    margin-bottom:28px;

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

    line-height:.95;

    letter-spacing:-.06em;

    color:var(--color-text);

}

.manifest p{

    max-width:650px;

    margin:0 auto 48px;

    font-size:1.08rem;

    line-height:1.8;

    color:var(--color-text-secondary);

}

.manifest .pz-btn{

    min-width:340px;

    min-height:70px;

    font-size:1.05rem;

    transition:
        transform .35s ease,
        box-shadow .35s ease;

}

.manifest .pz-btn:hover{

    transform:translateY(-5px);

    box-shadow:
        0 20px 50px rgba(189,146,79,.28);

}


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

.footer{

    position:relative;

    overflow:hidden;

    padding:120px 0 40px;

    background:#090909;

}

.footer::before{

    content:"";

    position:absolute;

    inset:0;

    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,.015),
            transparent 20%
        );

    pointer-events:none;

}


/* ==========================================================
   BACKGROUND WORD
========================================================== */

.footer-background{

    position:absolute;

    left:50%;

    top:45px;

    transform:translateX(-50%);

    font-size:clamp(8rem,18vw,20rem);

    font-weight:900;

    letter-spacing:.12em;

    line-height:1;

    white-space:nowrap;

    color:rgba(255,255,255,.018);

    user-select:none;

    pointer-events:none;

}


/* ==========================================================
   GRID
========================================================== */

.footer-grid{

    position:relative;

    z-index:2;

    display:grid;

    grid-template-columns:
        1.4fr
        .8fr
        .8fr;

    gap:80px;

    align-items:flex-start;

}


/* ==========================================================
   BRAND
========================================================== */

.footer-brand img{

    width:190px;

    margin-bottom:34px;

}

.footer-brand p{

    max-width:420px;

    line-height:1.9;

    color:var(--color-text-secondary);

}

.footer-brand p strong{

    color:var(--color-text);

}


/* ==========================================================
   COLUMNS
========================================================== */

.footer-column h4{

    margin-bottom:28px;

    font-size:.82rem;

    font-weight:700;

    letter-spacing:.14em;

    text-transform:uppercase;

    color:var(--color-primary);

}

.footer-column{

    display:flex;

    flex-direction:column;

    gap:16px;

}

.footer-column a{

    position:relative;

    width:max-content;

    color:var(--color-text-secondary);

    text-decoration:none;

    transition:
        color .3s ease,
        transform .3s ease;

}

.footer-column a:hover{

    color:var(--color-text);

    transform:translateX(6px);

}

/* ==========================================================
   DIVIDER
========================================================== */

.footer-divider{

    position:relative;

    margin:80px 0 34px;

    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,.10),
            transparent
        );

}

.footer-divider::before{

    content:"";

    position:absolute;

    left:50%;
    top:50%;

    width:10px;
    height:10px;

    border-radius:50%;

    background:var(--color-primary);

    transform:translate(-50%,-50%);

    box-shadow:
        0 0 25px rgba(189,146,79,.45);

}


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

.footer-bottom{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:20px;

    flex-wrap:wrap;

}

.footer-bottom span{

    font-size:.82rem;

    letter-spacing:.05em;

    color:var(--color-text-secondary);

}


/* ==========================================================
   HOVER DETAILS
========================================================== */

.footer-column a::after{

    content:"";

    position:absolute;

    left:0;
    bottom:-6px;

    width:0;

    height:1px;

    background:var(--color-primary);

    transition:width .35s ease;

}

.footer-column a:hover::after{

    width:100%;

}

.footer-brand img{

    transition:
        transform .45s ease,
        filter .45s ease;

}

.footer-brand:hover img{

    transform:translateY(-4px);

    filter:drop-shadow(0 10px 24px rgba(189,146,79,.25));

}


/* ==========================================================
   MICRO DETAILS
========================================================== */

.footer-column h4{

    position:relative;

    width:max-content;

}

.footer-column h4::after{

    content:"";

    position:absolute;

    left:0;
    bottom:-10px;

    width:36px;
    height:2px;

    border-radius:999px;

    background:var(--color-primary);

    opacity:.55;

}

.footer::after{

    content:"";

    position:absolute;

    right:-180px;
    bottom:-180px;

    width:420px;
    height:420px;

    border-radius:50%;

    background:
        radial-gradient(circle,
            rgba(189,146,79,.10),
            transparent 70%);

    pointer-events:none;

}


/* ==========================================================
   PERFORMANCE
========================================================== */

.footer-column a,
.footer-brand img,
.manifest .pz-btn{

    will-change:
        transform;

}

.footer-column a,
.footer-brand img{

    backface-visibility:hidden;

}
