/* --- Base Resets & Structure --- */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body, html {
    font-size: 100%;
    line-height: 1;
    font-family: SuisseIntl; /* Retaining this as it defines the base font */
    margin: 0;
}

.scroller {
    height: 100vh;
}

#wrap {
    margin-bottom: 0;
    background: #fff;
    position: relative;
    z-index: 200;
    overflow: hidden;
}

#wrapper {
    min-height: 100%;
    height: auto !important;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

/* --- Main Screen Component Styles --- */
.main_screen {
    height: 1660px; /* Note: This is a fixed height, responsive views likely change it */
    position: relative;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    z-index: 100;
    background: #000;
}

/* Background Image/Video Layer */
.main_screen .bg_ms {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    bottom: auto;
    width: 100%;
    height: 1190px;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover;
    display: block;
}

/* Full Screen Background Layer (for image: img/mns3.jpg) */
.main_screen .bg_full {
    position: absolute;
    top: 0;
    left: 0;
    background-position: 50% 0;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 50;
    height: 100%;
    width: 100%;
}

.main_screen .bg_full .bg_full_in {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-position: 50% 0;
    background-repeat: no-repeat;
    background-size: cover;
    /* This clip-path is crucial for the visual effect (a circle appearing) */
    -webkit-clip-path: circle(30% at 50% 150%);
    clip-path: circle(30% at 50% 150%);
    z-index: 50;
}

.main_screen .bg_full .bg_full_in .ovr {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: #000;
    opacity: .5;
}

/* Scroll Position Marker (sspmw) */
#sspmw {
    position: relative;
    top: 100vh;
}

/* Cursor/Arrow Element (#c) */
/* Note: This element's opacity will likely be controlled by JavaScript based on its class */
#c {
    position: absolute;
    z-index: 999;
    top: -70px;
    left: -58px;
    width: 162px;
    height: 167px;
    pointer-events: none;
    will-change: transform;
}

#c.prev .cc {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    opacity: 1;
    transition: .35s;
    background: url(../img/s14.svg) no-repeat 0 0/cover;
    -webkit-animation: spin-right 4s linear infinite;
    animation: spin-right 4s linear infinite;
}

#c.prev .arw {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    background: url(../img/n_prev.svg) no-repeat 0 0/cover;
    width: 41px;
    height: 18px;
}

#c.next .cc {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    opacity: 1;
    transition: .35s;
    background: url(../img/s14.svg) no-repeat 0 0/cover;
    -webkit-animation: spin-left 4s linear infinite;
    animation: spin-left 4s linear infinite;
}

#c.next .arw {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    background: url(../img/n_next.svg) no-repeat 0 0/cover;
    width: 41px;
    height: 18px;
}

#c .cc {
    width: 162px;
    height: 167px;
    opacity: 0;
    transition: .35s;
    transform-origin: 50% 50%;
}

@-webkit-keyframes spin-left {
    from { transform: rotate(0); }
    to { transform: rotate(360deg); }
}

@keyframes spin-left {
    from { transform: rotate(0); }
    to { transform: rotate(360deg); }
}

@-webkit-keyframes spin-right {
    from { transform: rotate(0); }
    to { transform: rotate(-360deg); }
}

@keyframes spin-right {
    from { transform: rotate(0); }
    to { transform: rotate(-360deg); }
}

@font-face {
    font-family: SuisseIntl;
    src: url(../fonts/SuisseIntl/SuisseIntl-Thin.woff2) format("woff2");
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}