:root {
    /* PRIMARY COLOUR / JELLY BEAN */
    --cpr-015: #dae5ed;
    --cpr-030: #b6cadb;
    --cpr-045: #91b0c9;
    --cpr-060: #6c96b6;
    --cpr-075: #487ba4;
    --cpr-100: #236192;
    --cpr-115: #1d517a;
    --cpr-130: #174161;
    --cpr-145: #123149;
    --cpr-160: #0c2031;
    --cpr-175: #061018;
   
    /* ALTERNATE COLOUR / DISCO */
    --ca1-015: #eedae6;
    --ca1-030: #ddb4cc;
    --ca1-045: #cc8fb3;
    --ca1-060: #bb6999;
    --ca1-075: #aa4480;
    --ca1-100: #991e66;
    --ca1-115: #801955;
    --ca1-130: #661444;
    --ca1-145: #4d0f33;
    --ca1-160: #330a22;
    --ca1-175: #1a0511;
    
    /* ALTERNATE COLOUR / VIDA LOCA */
    --ca2-015: #e5ecd9;
    --ca2-030: #ccd9b3;
    --ca2-045: #b2c68d;
    --ca2-060: #98b367;
    --ca2-075: #7fa041;
    --ca2-100: #658d1b;
    --ca2-115: #547617;
    --ca2-130: #435e12;
    --ca2-145: #33470e;
    --ca2-160: #222f09;
    --ca2-175: #111805;
   
    /* TEXT COLOUR / MIRAGE */
    --ctx-015: #d8dadb;
    --ctx-030: #b0b4b8;
    --ctx-045: #898f94;
    --ctx-060: #626970;
    --ctx-075: #3a444d;
    --ctx-100: #131e29;
    --ctx-115: #101922;
    --ctx-130: #0d141b;
    --ctx-145: #0a0f15;
    --ctx-160: #060a0e;
    --ctx-175: #030507;

    /* UTILITIES */
    --cbw:  #FFFFFF;
    --trb:  0.3s all ease;
}

body {
    font-family: 'Poppins', sans-serif;
    margin: 0;
    padding: 0;
    color: var(--ctx-100);
    background-color: var(--cpr-015);
}

.fzf {
    position: absolute;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    top: 0px;
    left: 0px;
    background-color: var(--cpr-015);
    z-index: 999;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: start;
}

/* Background text slowed down significantly to prevent seizure speeds */
.fzf_bg_text {
    position: absolute;
    font-size: 180vh; 
    line-height: 0.8; 
    font-weight: 600;
    color: var(--cpr-060);
    margin: 0;
    top: 50%;
    left: 0;
    opacity: 0.15;
    white-space: nowrap;
    transform: translateY(-50%);
    pointer-events: none;
    user-select: none;
    animation: infiniteScroll 180s linear infinite; /* Bumped from 40s to 180s */
    will-change: transform;
}

.fzf_bg_text::after {
    content: attr(data-content); 
    position: absolute;
    top: 0;
    left: 100%;
}

@keyframes infiniteScroll {
    0% { transform: translate(0, -50%); }
    100% { transform: translate(-100%, -50%); }
}

/* Main Content Styling */
.fzf_content {
    position: relative;
    z-index: 2;
    padding: 5% 10%;
    width: 80%;
    max-width: 800px;
    font-size: 1.2rem;
}

.fzf_content h1 {
    color: var(--cpr-130);
    font-weight: 800;
    font-size: 3.5rem;
    line-height: 1.1;
    margin-bottom: 20px;
}

.highlight {
    color: var(--cpr-060);
}

.fzf_cnt_bodt {
    line-height: 1.6;
    color: var(--ctx-100);
}

.fzf_cnt_bodt p {
    margin-bottom: 15px;
}

/* CTA Button */
.fzf_cnt_cta {
    margin-top: 40px;
}

.fzf_cnt_cta a {
    padding: 15px 35px;
    border: 2px solid var(--cpr-100);
    border-radius: 25px;
    font-size: 1.2rem;
    text-decoration: none;
    color: var(--cpr-100);
    transition: var(--trb);
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    width: fit-content;
    font-weight: 600;
}

.fzf_cnt_cta i {
    font-size: 1.5rem;
    display: block;
    line-height: 0;
}

.fzf_cnt_cta a:is(:hover, :focus, :active) {
    background-color: var(--cpr-100);
    color: var(--cbw);
}

/* Footer / Altitude Branding */
.fzf_footer_logo {
    margin-top: 60px;
    border-top: 2px solid var(--ctx-030);
    padding-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.fzf_footer_logo span {
    font-size: 0.9rem;
    color: var(--ctx-060);
    font-weight: 500;
}

.fzf_footer_logo img {
    width: 180px;
}

/* Responsiveness */
@media(max-width: 800px) {
    .fzf_content h1 { font-size: 2.5rem; }
    .fzf_content { padding: 5%; width: 90%; }
}

@media(max-width: 425px) {
    .fzf_content h1 { font-size: 2rem; }
    .fzf_cnt_cta a { font-size: 1rem; padding: 12px 25px; }
}