﻿/* --- Design tokens --- */
:root {
    --eo-yellow: #fccc02;
    --eo-gray: #585858;
    --eo-border: #585858;
}

.bg-black {
    background: #000 !important
}

div#MainBody {
    background: #000;
}

h2.h4 {
    font-size: 2rem !important;
}

.text-warning {
    color: #ffcd00 !important
}

.bg-warning {
    background-color: #ffcd00 !important
}

/* Utility */
.letter-1 {
    letter-spacing: .06rem;
}

.hero-media-clip {
    overflow-x: clip; 
}

@media (max-width: 500px) {
    .title-is {
        font-size: 2rem !important;
        margin-top: 5.5rem !important;
    }
}

.decor-line-left,
.decor-line-right {
    width: 200px;
    height: auto;
    position: relative;
    top: -3rem;
    margin-top: -3rem;
}
    .decor-line-left polyline,
    .decor-line-right polyline {
        fill: none;
        stroke: var(--eo-yellow);
        stroke-width: 2.5;
        stroke-linecap: round;
        stroke-linejoin: round;
        stroke-dasharray: 16 10;
    }

.pw-booth {
    margin-bottom: clamp(-4rem, -8vw, -1rem);
    max-width: 100%;
    height: auto;
    display: block;
}

@media (max-width: 992px) {
    .pw-booth {
        margin-bottom: -1.25rem;
        margin-top: 6rem;
    }
}

.mp-pw {
    display: block;
    width:100%;
    border-radius: 1rem;
    height:auto
}

h1.title-is {
    font-size: clamp(28px, 8vw, 70px) !important;
}

span.badge {
    font-size: 14px !important;
    font-family: 'sofia w01 bold' !important;
    font-weight: 700;
}

#MainBody .nav > li > a:hover,
#MainBody .nav > li > a:focus {
    background-color: #000 !important;
    color: #ffcd00 !important
}

.nav-link {
    color: #ccc !important;
}
    .nav-link:focus, .nav-link:hover {
        color: var(--eo-yellow);
        text-decoration: underline;
        text-underline-offset: 2px;
    }

/* Borders + rounding alignment with theme */
.border-secondary {
    border-color: var(--eo-border) !important;
}

@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}
