/* 1. Use a more-intuitive box-sizing model */
*, *::before, *::after {
  box-sizing: border-box;
}

/* 2. Remove default margin */
* {
  margin: 0;
}

/* 3. Enable keyword animations */
@media (prefers-reduced-motion: no-preference) {
  html {
    interpolate-size: allow-keywords;
  }
}

body {
  /* 4. Add accessible line-height */
  line-height: 1.5;
  /* 5. Improve text rendering */
  -webkit-font-smoothing: antialiased;
}

/* 6. Improve media defaults */
img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
}

/* 7. Inherit fonts for form controls */
input, button, textarea, select {
  font: inherit;
}

/* 8. Avoid text overflows */
p, h1, h2, h3, h4, h5, h6 {
  overflow-wrap: break-word;
}

/* 9. Improve line wrapping */
p {
  text-wrap: pretty;
}
h1, h2, h3, h4, h5, h6 {
  text-wrap: balance;
}

/*
  10. Create a root stacking context
*/
#root, #__next {
  isolation: isolate;
}
/**
* @license
*
* Font Family: Switzer
* Designed by: Jérémie Hornus
* URL: https://www.fontshare.com/fonts/switzer
* © 2025 Indian Type Foundry
*
* Switzer Thin 
* Switzer ThinItalic 
* Switzer Extralight 
* Switzer ExtralightItalic 
* Switzer Light 
* Switzer LightItalic 
* Switzer Regular 
* Switzer Italic 
* Switzer Medium 
* Switzer MediumItalic 
* Switzer Semibold 
* Switzer SemiboldItalic 
* Switzer Bold 
* Switzer BoldItalic 
* Switzer Extrabold 
* Switzer ExtraboldItalic 
* Switzer Black 
* Switzer BlackItalic 
* Switzer Variable (Variable font)
* Switzer VariableItalic (Variable font)

*
*/
@font-face {
  font-family: 'Switzer-Thin';
  src: url('../../files/lost-in-music/fonts/Switzer-Thin.woff2') format('woff2'),
       url('../../files/lost-in-music/fonts/Switzer-Thin.woff') format('woff'),
       url('../../files/lost-in-music/fonts/Switzer-Thin.ttf') format('truetype');
  font-weight: 100;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: 'Switzer-ThinItalic';
  src: url('../../files/lost-in-music/fonts/Switzer-ThinItalic.woff2') format('woff2'),
       url('../../files/lost-in-music/fonts/Switzer-ThinItalic.woff') format('woff'),
       url('../../files/lost-in-music/fonts/Switzer-ThinItalic.ttf') format('truetype');
  font-weight: 100;
  font-display: swap;
  font-style: italic;
}
@font-face {
  font-family: 'Switzer-Extralight';
  src: url('../../files/lost-in-music/fonts/Switzer-Extralight.woff2') format('woff2'),
       url('../../files/lost-in-music/fonts/Switzer-Extralight.woff') format('woff'),
       url('../../files/lost-in-music/fonts/Switzer-Extralight.ttf') format('truetype');
  font-weight: 200;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: 'Switzer-ExtralightItalic';
  src: url('../../files/lost-in-music/fonts/Switzer-ExtralightItalic.woff2') format('woff2'),
       url('../../files/lost-in-music/fonts/Switzer-ExtralightItalic.woff') format('woff'),
       url('../../files/lost-in-music/fonts/Switzer-ExtralightItalic.ttf') format('truetype');
  font-weight: 200;
  font-display: swap;
  font-style: italic;
}
@font-face {
  font-family: 'Switzer-Light';
  src: url('../../files/lost-in-music/fonts/Switzer-Light.woff2') format('woff2'),
       url('../../files/lost-in-music/fonts/Switzer-Light.woff') format('woff'),
       url('../../files/lost-in-music/fonts/Switzer-Light.ttf') format('truetype');
  font-weight: 300;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: 'Switzer-LightItalic';
  src: url('../../files/lost-in-music/fonts/Switzer-LightItalic.woff2') format('woff2'),
       url('../../files/lost-in-music/fonts/Switzer-LightItalic.woff') format('woff'),
       url('../../files/lost-in-music/fonts/Switzer-LightItalic.ttf') format('truetype');
  font-weight: 300;
  font-display: swap;
  font-style: italic;
}
@font-face {
  font-family: 'Switzer-Regular';
  src: url('../../files/lost-in-music/fonts/Switzer-Regular.woff2') format('woff2'),
       url('../../files/lost-in-music/fonts/Switzer-Regular.woff') format('woff'),
       url('../../files/lost-in-music/fonts/Switzer-Regular.ttf') format('truetype');
  font-weight: 400;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: 'Switzer-Italic';
  src: url('../../files/lost-in-music/fonts/Switzer-Italic.woff2') format('woff2'),
       url('../../files/lost-in-music/fonts/Switzer-Italic.woff') format('woff'),
       url('../../files/lost-in-music/fonts/Switzer-Italic.ttf') format('truetype');
  font-weight: 400;
  font-display: swap;
  font-style: italic;
}
@font-face {
  font-family: 'Switzer-Medium';
  src: url('../../files/lost-in-music/fonts/Switzer-Medium.woff2') format('woff2'),
       url('../../files/lost-in-music/fonts/Switzer-Medium.woff') format('woff'),
       url('../../files/lost-in-music/fonts/Switzer-Medium.ttf') format('truetype');
  font-weight: 500;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: 'Switzer-MediumItalic';
  src: url('../../files/lost-in-music/fonts/Switzer-MediumItalic.woff2') format('woff2'),
       url('../../files/lost-in-music/fonts/Switzer-MediumItalic.woff') format('woff'),
       url('../../files/lost-in-music/fonts/Switzer-MediumItalic.ttf') format('truetype');
  font-weight: 500;
  font-display: swap;
  font-style: italic;
}
@font-face {
  font-family: 'Switzer-Semibold';
  src: url('../../files/lost-in-music/fonts/Switzer-Semibold.woff2') format('woff2'),
       url('../../files/lost-in-music/fonts/Switzer-Semibold.woff') format('woff'),
       url('../../files/lost-in-music/fonts/Switzer-Semibold.ttf') format('truetype');
  font-weight: 600;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: 'Switzer-SemiboldItalic';
  src: url('../../files/lost-in-music/fonts/Switzer-SemiboldItalic.woff2') format('woff2'),
       url('../../files/lost-in-music/fonts/Switzer-SemiboldItalic.woff') format('woff'),
       url('../../files/lost-in-music/fonts/Switzer-SemiboldItalic.ttf') format('truetype');
  font-weight: 600;
  font-display: swap;
  font-style: italic;
}
@font-face {
  font-family: 'Switzer-Bold';
  src: url('../../files/lost-in-music/fonts/Switzer-Bold.woff2') format('woff2'),
       url('../../files/lost-in-music/fonts/Switzer-Bold.woff') format('woff'),
       url('../../files/lost-in-music/fonts/Switzer-Bold.ttf') format('truetype');
  font-weight: 700;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: 'Switzer-BoldItalic';
  src: url('../../files/lost-in-music/fonts/Switzer-BoldItalic.woff2') format('woff2'),
       url('../../files/lost-in-music/fonts/Switzer-BoldItalic.woff') format('woff'),
       url('../../files/lost-in-music/fonts/Switzer-BoldItalic.ttf') format('truetype');
  font-weight: 700;
  font-display: swap;
  font-style: italic;
}
@font-face {
  font-family: 'Switzer-Extrabold';
  src: url('../../files/lost-in-music/fonts/Switzer-Extrabold.woff2') format('woff2'),
       url('../../files/lost-in-music/fonts/Switzer-Extrabold.woff') format('woff'),
       url('../../files/lost-in-music/fonts/Switzer-Extrabold.ttf') format('truetype');
  font-weight: 800;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: 'Switzer-ExtraboldItalic';
  src: url('../../files/lost-in-music/fonts/Switzer-ExtraboldItalic.woff2') format('woff2'),
       url('../../files/lost-in-music/fonts/Switzer-ExtraboldItalic.woff') format('woff'),
       url('../../files/lost-in-music/fonts/Switzer-ExtraboldItalic.ttf') format('truetype');
  font-weight: 800;
  font-display: swap;
  font-style: italic;
}
@font-face {
  font-family: 'Switzer-Black';
  src: url('../../files/lost-in-music/fonts/Switzer-Black.woff2') format('woff2'),
       url('../../files/lost-in-music/fonts/Switzer-Black.woff') format('woff'),
       url('../../files/lost-in-music/fonts/Switzer-Black.ttf') format('truetype');
  font-weight: 900;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: 'Switzer-BlackItalic';
  src: url('../../files/lost-in-music/fonts/Switzer-BlackItalic.woff2') format('woff2'),
       url('../../files/lost-in-music/fonts/Switzer-BlackItalic.woff') format('woff'),
       url('../../files/lost-in-music/fonts/Switzer-BlackItalic.ttf') format('truetype');
  font-weight: 900;
  font-display: swap;
  font-style: italic;
}
/**
* This is a variable font
* You can control variable axes as shown below:
* font-variation-settings: wght 400.0;
*
* available axes:
'wght' (range from 100.0 to 900.0
*/
@font-face {
  font-family: 'Switzer-Variable';
  src: url('../../files/lost-in-music/fonts/Switzer-Variable.woff2') format('woff2'),
       url('../../files/lost-in-music/fonts/Switzer-Variable.woff') format('woff'),
       url('../../files/lost-in-music/fonts/Switzer-Variable.ttf') format('truetype');
  font-weight: 100 900;
  font-display: swap;
  font-style: normal;
}
/**
* This is a variable font
* You can control variable axes as shown below:
* font-variation-settings: wght 400.0;
*
* available axes:
'wght' (range from 100.0 to 900.0
*/
@font-face {
  font-family: 'Switzer-VariableItalic';
  src: url('../../files/lost-in-music/fonts/Switzer-VariableItalic.woff2') format('woff2'),
       url('../../files/lost-in-music/fonts/Switzer-VariableItalic.woff') format('woff'),
       url('../../files/lost-in-music/fonts/Switzer-VariableItalic.ttf') format('truetype');
  font-weight: 100 900;
  font-display: swap;
  font-style: italic;
}

:root{
    --color-accent: #dcccb5;
    --color-background: rgb(20, 20, 20);
}

ul, ol{
    padding: 0;
}

h1, h2, h3, h4{
    font-size: 2rem;
    text-transform: uppercase;
    font-family: 'Switzer-Medium';
}

body{
    font-family: 'Switzer-Regular';
    background: var(--color-background);
    color: var(--color-accent);
    font-size: 20px;
    text-rendering: geometricPrecision;
}

.invisible{
    display: none;
    visibility: hidden;
}

a:active, a:focus, a:link, a:visited{
    color: inherit;
    text-decoration: none;
}

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

#header{
    position: absolute;
    display: block;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 100;
    & .branding{
        & img{
            height: 1.5rem;
            width: auto;
        }
    }
    & .inside{
        padding: 1rem;
    }
}

.mod_article{
    padding: 1rem;
    min-height: 35vmax;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.mod_article:nth-child(odd){
    background: var(--color-accent);
    color: var(--color-background);
}

#wrapper{
}

.content-text{
    & p:not(:last-child){
        margin-bottom: 1rem;
    }
}

#intro{
    position: relative;
    height: 100vh;
    width: 100%;
    padding: 0;
    & .content-image{
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        mix-blend-mode: difference;
        & img{
            max-height: 25vh;
            width: auto;
        }
    }
    & .content-player{
        height: 100%;
        & figure{
            height: 100%;
        }
        video{
            height: 100%;
            width: 100%;
            object-fit: cover;
            object-position: center;
        }
    }
}

.swiper-slide{
    cursor: grab;
}

footer{
    background: black;
    font-size: small;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    & nav{
        & ul{
            list-style: none;
            display: flex;
            gap: 1rem;
        }
    }
    & .typo{
        width: 100%;
        & img{
            opacity: .1;
            width: 100%;
            height: auto;
        }
    }
    & .signet{
        opacity: .1;
        & img{
            max-height: 25vmax;
            width: auto;
        }
    }
    & .logo{
        margin-top: 10vmax;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 4rem;
    }
}

.mod_newslist{
    & > div{
        padding: 1rem 0;
    }
    & > div:not(:last-child){
        border-bottom: 1px dotted var(--color-accent);
    }
}

#nextEvent{
    padding: 1rem;
    position: relative;
    overflow: hidden;
    & .mod_eventlist{
        & .event, & > h2{
            z-index: 10;
            position: relative;
        }
        & .image_container{
            position: absolute;
            top: 0;
            width: 100%;
            left: 0;
            z-index: 1;
            opacity: 0.5;
        }
    }
    & .more{
        font-family: 'Switzer-Medium';
        text-transform: uppercase;
        text-decoration: underline;
    }
}

.content-gallery{
    & ul{
        display: grid;
        list-style: none;
        grid-template-columns: repeat(4, 1fr);
        gap: 1rem;
    }
}