*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

:root {
    --deep-navy:    #150d60;
    --medium-navy:  #150e54;
    --royal-purple: #1b068c;
    --gold:         #fce046;
    --gold-dark:    #febe29;
    --white:        #ffffff;
    --light-grey:   #f1f1f1;
    --dim:          #dedddd;
    --lime:         #d8e710;
    --purple-light: #b498fc;
    --text-dark:    #080806;
}

html { scroll-behavior: smooth; }

body {
    font-family: 'Roboto', sans-serif;
    background-color: var(--deep-navy);
    color: var(--white);
    overflow-x: hidden;
}

img { max-width: 100%; height: auto; display: block; }

a { text-decoration: none; color: inherit; }

ul { list-style: none; }

.container {
    width: 100%;
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 60px;
}

@media (max-width: 1024px) {
    .container { padding: 0 40px; }
}

@media (max-width: 768px) {
    .container { padding: 0 20px; }
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 32px;
    font-family: 'Rubik', sans-serif;
    font-weight: 700;
    cursor: pointer;
    border: none;
    transition: opacity 0.2s, transform 0.1s;
    text-decoration: none;
}

.btn:hover { opacity: 0.9; }
.btn:active { transform: scale(0.97); }

.btn--primary {
    background-color: var(--gold);
    color: var(--royal-purple);
    border-bottom: 2px solid var(--gold-dark);
    border-left: 2px solid var(--gold-dark);
    padding: 10px 32px;
    font-size: 20px;
}

.btn--full { width: 100%; }

.is-hidden { display: none !important; }
