html {
/* Colours */
    --UpNavy: #0B104F;
    --UpOffWhite: #FFFFEE;
    --UpGreen: #00F6AB;
    --UpTurquoise: #00E1D8;
    --UpBlue: #00CAFF;
    --UpPurple: #C080F0;
    --UpRed: #FF6C9A;
    --UpOrange: #FF8D2F;
    --UpYellow: #FFC100;
/* Fonts */
    --ObviouslyNarrow: "obviously-narrow", sans-serif;
    --FunnelSans: "Funnel Sans", sans-serif;
}
body.holding {
    background-color: var(--UpYellow);
    color: var(--UpNavy);
}
body.holding main {
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: center;
    margin: auto;
    text-align: center;
    position: relative;
    padding: 80px 20px;
    min-height: calc(100vh - 340px);
}
body.holding main .bg-gradient {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    min-width: 1000px;
}
body.holding section {
    z-index: 2;
}
body.holding h1,
body.holding h2 {
    font-family: var(--ObviouslyNarrow);
    color: var(--UpNavy);
    text-wrap: balance;
    line-height: 100%;
}
body.holding h1 {
    font-size: 56px;
    letter-spacing: -1.28px;
    margin-bottom: 40px;
}
body.holding h2 {
    font-size: 32px;
    letter-spacing: -0.64px;
    margin: 0;
}
body.holding p, body.holding a {
    font-family: var(--FunnelSans);
    font-weight: 300;
    font-size: 16px;
    line-height: 150%;
    letter-spacing: -0.24px;
    color: var(--UpNavy);
    font-weight: 400;
}
body.holding a.button {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px 20px;
    background: var(--UpYellow);
    color: var(--UpNavy);
    border-radius: 8px;
    text-decoration: none;
    margin: auto;
    width: fit-content;
    font-weight: 600;
    transition: 0.3s ease all;
    font-size: 14px;
    gap: 16px;
}
body.holding a.button svg {
    transition: 0.3s ease transform;
}
body.holding a.button:hover {
    background: var(--UpRed);
}
body.holding a.button:hover svg {
    transform: rotate(45deg);
}
body.holding a.button:focus-visible {
    outline: 2px solid var(--UpOrange);
    outline-offset: 2px;
}
/* INTRO */
body.holding .intro p {
    max-width: 60ch;
    margin: auto;
}
/* OUTRO */
body.holding .outro p {
    max-width: 37ch;
    margin: auto;
}
body.holding .outro p.sign-off {
    font-size: 16px;
}
/* SALES LIB */ 
body.holding section.sales-library {
    background: var(--UpNavy);
    color: var(--UpOffWhite);
    border-radius: 10px;
    padding: 20px;
    margin: 20px 0;
    max-width: 600px;
}
body.holding section.sales-library p {
    color: var(--UpOffWhite);
    margin-bottom: 20px;
    text-wrap: balance;
}
/* FOOTER STYLES */ 
body.holding footer {
    background-color: var(--UpNavy);
    color: var(--UpOffWhite);
    position: relative;
}
body.holding .footer-container {
    margin: 0;
    justify-content: flex-start;
    text-align: left;
    padding: 40px;
    flex-flow: column;
    align-items: flex-start;
    max-width: 1400px;
    margin: auto;
}
body.holding .footer-section {
    padding: 10px;
    flex: 1;
    max-width: 300px;
}
body.holding .footer-container .rci-logo {
    padding: 0;
}
body.holding footer p {
    font-size: 12px;
    text-wrap: unset;
    color: var(--UpOffWhite);
    max-width: 80ch;
}
body.holding footer p a {
    font-size: 12px;
    color: var(--UpOffWhite);
    transition: 0.3s ease color;
}
body.holding footer p a:hover {
    color: var(--UpYellow);
}
body.holding footer p a:focus-visible {
    color: var(--UpYellow);
    outline: 2px solid var(--UpYellow);
    outline-offset: 1px;
    border-radius: 1px;
}
/* MEDIA QUERIES */
@media only screen and (min-width: 360px) {
    body.holding h1 {
        font-size: clamp(64px, 9.5vw, 128px);
    }
    body.holding h2 {
        font-size: clamp(32px, 6vw, 64px);
    }
    body.holding p, body.holding a {
        font-size: clamp(16px, 1.8vw, 20px);
    }
}
@media only screen and (min-width: 600px) {
    body.holding a.button {
        font-size: 16px;
        padding: 10px 40px;
    }
    body.holding section.sales-library {
        border-radius: 20px;
        padding: 30px 60px;
    }
}
@media only screen and (min-width: 992px) {
    body.holding h1 {
        letter-spacing: -2.56px;
    }
    body.holding h2 {
        letter-spacing: -1.28px;
    }
    body.holding main {
        padding: 100px 20px;
    }
    body.holding a.button {
        padding: 20px 60px;
        border-radius: 10px;
        font-size: 18px;
    }
    body.holding .footer-container {
        flex-flow: row nowrap;
        align-items: flex-start;
    }
    body.holding .footer-section {
        margin-right: 80px;
    }
    body.holding footer p {
        max-width: 50ch;
    }
    body.holding main {
        min-height: calc(100vh - 182px);
    }
    body.holding section.sales-library {
        margin: 40px;
    }
    body.holding section.sales-library {
        max-width: 780px;
    }
}