﻿/* SAN */
:root { --gap-2: 0.104vw; --gap-3: 0.156vw; --gap-4: 0.208vw; --gap-6: 0.313vw; --gap-8: 0.417vw; --gap-10: 0.521vw; --gap-12: 0.625vw; --gap-14: 0.729vw; --gap-16: 0.833vw; --gap-18: 0.938vw; --gap-20: 1.042vw; --gap-24: 1.25vw; --gap-25: 1.302vw; --gap-28: 1.458vw; --gap-30: 1.563vw; --gap-32: 1.667vw; --gap-36: 1.875vw; --gap-40: 2.083vw; --gap-46: 2.395vw; --gap-48: 2.5vw; --gap-50: 2.604vw; --gap-52: 2.708vw; --gap-56: 2.917vw; --gap-60: 3.125vw; --gap-64: 3.333vw; --gap-72: 3.75vw; --gap-78: 4.063vw; --gap-80: 4.17vw; --gap-88: 4.583vw; --gap-90: 4.688vw; --gap-96: 5vw; --gap-100: 5.208vw; --gap-115: 5.990vw; --gap-120: 6.25vw; --gap-135: 7.031vw; --gap-140: 7.292vw; --gap-160: 8.333vw; --gap-180: 9.375vw; --gap-200: 10.417vw; --gap-240: 12.5vw; --gap-260: 13.542vw; --gap-300: 15.625vw; --gap-400: 20.833vw; --gap-600: 31.25vw; --gap-700: 36vw; --fs-10: 0.521vw; --fs-12: 0.625vw; --fs-14: 0.729vw; --fs-15: 0.781vw; --fs-16: 0.833vw; --fs-17: 0.885vw; --fs-18: 0.937vw; --fs-19: 0.99vw; --fs-20: 1.042vw; --fs-22: 1.154vw; --fs-24: 1.25vw; --fs-40: 2.083vw; --fs-45: 2.343vw; --fs-72: 3.75vw; --fs-75: 3.744vw; --fs-88: 4.583vw; --fs-100: 5.2vw; --fs-104: 5.417vw; --fs-242: 12.584vw; --white: #FFF; --black: #000; --font-1: 'narkisstam-regular'; --font-2: 'narkisstam-bold'; --font-3: 'chillax-bold'; }

/*------------------------------------------/*
 GENERAL
/*------------------------------------------*/
html { font-size: 62.5%; overflow-x: clip; }

body { font-family: var(--font-1) !important; line-height: 1; font-size: 1.8rem; zoom: 1 !important; position: relative; }
.sections .grid-content-section, #header2 .max-width { padding: 0; padding-inline: var(--gap-24); max-width: 100%; }

.section-title h1 { color: inherit; font-family: var(--font-3); margin: 0; width: 100%; font-size: var(--fs-100) }
#header2 { background: transparent; position: fixed; }
#header-left a { position: fixed; top: var(--gap-78); left: var(--gap-24); width: 78px; height: 30px; fill: white; mix-blend-mode: difference; cursor: pointer; z-index: 1; }
#header2 ul.menu li, #header2 ul.menu li.active { color: var(--black); }

a.logoHeader { position: fixed; top: 20px; left: var(--gap-24); width: 78px; height: 30px; fill: white; mix-blend-mode: difference; cursor: pointer; z-index: 1; }

#SiteGridContainer { background-color: #fff; }



#header2 .header-top { display: none; }
#allSectionsWrapper { margin-top: 85px; }
.grid-box-fulltext p,
.section-topText p,
.grid-boxes .grid-box-title h3 a { font-size: clamp(1.6rem, var(--fs-18), 1000rem); position: relative; line-height: 1.2; font-family: var(--font-1); }

.top-section { margin-bottom: 0; padding-bottom: 0; }

.section-navigation { margin-bottom: var(--gap-80); padding: 0; position: sticky; top: 70px; z-index: 1; top: 0px; }
.section-navigation a { box-sizing: border-box; border-right: 1px solid #000; font-family: var(--font-2); padding-inline: var(--gap-24); height: 50px; display: flex; align-items: center; }
.section-navigation ul { list-style: none; padding: 0; display: inline-flex; box-sizing: border-box; border: 1px solid #000; background: #fff; margin-bottom: 0; background: #fff; }
.section-navigation a:hover, .section-navigation a:focus { background: #000; color: #fff; }
.section-title h2 { margin: 0; font-family: var(--font-2); font-size: clamp(1.8rem, var(--fs-22), 1000rem); line-height: 1.2; margin-bottom: var(--gap-8); }
.section-title { margin: 0; }

.section-topText { width: 700px; margin: var(--gap-40) auto 0; display: flex; text-align: center; flex-direction: column; gap: var(--gap-24); align-items: center; }
.content-section-Btn a { height: var(--gap-50); border: 1px solid #000; font-size: clamp(1.6rem, var(--fs-18), 1000rem); width: fit-content; min-width: 140px; padding-inline: var(--gap-24); display: inline-flex; align-items: center; justify-content: center; gap: 0; transition: none; transform: none !important; margin: var(--gap-24) auto 0; background: #fff; font-family: var(--font-2); line-height: 1.2; color: #000; border-radius: 0; letter-spacing: 0px; height: 50px; }
.content-section-Btn a:hover, .content-section-Btn a:focus { background: #000; color: #fff; }


.grid-boxes { margin-block: var(--gap-80); }
.grid-boxes.no-children { margin: 0; }
.grid-boxes > .section-animation-item:nth-child(4n), .grid-boxes > .section-animation-item:last-child { border-left-color: #000; }
.grid-boxes .box-image-animation img { transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; }
.grid-boxes .box-image-animation:before { content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, 0.44); z-index: 1; pointer-events: none; opacity: 0; transition: .800s all cubic-bezier(0, 0, 0.15, 1); }
.grid-boxes .box-image-animation { overflow: hidden; outline: unset; }
.grid-boxes .grid-box-image-container { position: relative; height: 100%; }
.grid-boxes .grid-box-image { padding-bottom: 0; overflow: visible; margin: 0; height: auto; aspect-ratio: 1/0.7; }
.grid-boxes .section-animation-item { padding: var(--gap-16); box-sizing: border-box; border: 1px solid #000; border-left: 1px solid transparent; margin-bottom: var(--gap-32); width: 25%; }
.grid-boxes .grid-box-title h3 a { margin: 0; font-family: var(--font-2); color: inherit; height: 100%; }
.grid-boxes .inner-grid-boxes { width: 100%; display: flex; flex-direction: column; justify-content: flex-start; font-size: var(--fs-18); font-family: var(--font-2); align-items: flex-start; text-align: start; height: 133px; }

.grid-boxes .grid-box-title { padding-top: var(--gap-16); }


@media(max-width:767px) {
    #header2 ul.menu li.social-mobile { display: none; }
    #header2 ul.menu { display: block; padding: 0; width: auto; background: transparent; }
    #header2 .header-right-section { padding: 0; }
    #header2 .nav-menu-anim { display: none; }
    #header2 ul.menu li > a { display: block; text-align: right; }
    #header2 ul.menu li:before { display: none; }
    #header2 .menu-nav { margin: 0; }
    #header2 ul.menu li, #header2 ul.menu li.active { background-color: transparent; }

    a.logoHeader { top: 20px; left: 16px; width: 52px; height: 20px; }
    a.logoHeader img { max-width: 100%; }

    #header2 #header-left img { width: 52px; margin-left: 12px; }
    #header2 { padding-bottom: 0; height: 45px; background: #fff; }
    #header-left a { mix-blend-mode: normal; }

    .section-topText { width: 100%; gap: 13px; margin-top: 0; }
    .section-navigation ul { flex-wrap: nowrap; overflow-x: auto; scroll-snap-type: x mandatory; padding-inline: 16px; border: none; background: #fff; max-width: 100vw; }
    .section-navigation ul li { background-color: #fff; }
    .section-navigation a { width: 167px; display: flex; align-items: center; justify-content: center; font-size: 16px; border-block: 1px solid #000; }
    .sections .grid-content-section .grid-boxes { max-width: 100%; margin-inline: 0; display: flex; flex-wrap: wrap; gap: 16px; padding: 16px; }
    .section-navigation ul li:last-child { }
    .section-title h1 { font-size: 40px; margin-bottom: 40px; }
    .sections .grid-content-section .grid-boxes:before { display: none; }
    .grid-boxes .section-animation-item { width: calc(50% - 3px); border-left-color: black; padding: 8px; }
    .sections .grid-content-section { padding: 0; }
    .grid-boxes .inner-grid-boxes { height: auto; }
    .grid-boxes::before,
    .grid-boxes::after { display: none; }

    .sections .grid-content-section .section-title, .sections .grid-content-section .section-topText { padding-inline: 16px; }
    .section-title h2 { font-size: 22px; margin: 0; margin-bottom: 13px; }
    .section-navigation { margin-bottom: 60px; overflow-x: scroll; top: 45px; }
    .section-navigation .section-title { transition: none; }
    .top-section { margin-bottom: 0; padding: 0; }
    .grid-text-section.top-section .section-title { margin-bottom: 0; }
}



footer { padding: 0; position: relative; display: flex; z-index: 12; background: #000; color: #fff; }
#SiteFooter { display: flex; flex-direction: column; align-items: center; padding-top: var(--gap-88); }
#SiteFooter .footer-text.text-center { padding: 0; order: -1; }
#SiteFooter .footer-text.text-center img { width: var(--gap-400); }
#SiteFooter #partners-section { padding: 0; text-align: center; display: flex; flex-direction: column; align-items: center; padding-bottom: var(--gap-88); }
#SiteFooter #partners-section ul { margin: 0; padding: 0; list-style: none; display: flex; justify-content: center; align-items: center; gap: var(--gap-16); font-size: clamp(1.2rem, var(--fs-17), 1000rem); margin-top: var(--gap-40); }
#SiteFooter #partners-section ul li a { font-size: 100%; padding: 0; max-width: unset; margin: 0; }
#SiteFooter #partners-section ul.footer-brands { gap: var(--gap-50); margin-top: var(--gap-88); }
#SiteFooter #partners-section ul.footer-brands img { width: 64px; }
#SiteFooter #partners-section > p { margin-top: var(--gap-40); text-align: center; line-height: 1.4; }
#SiteFooter #partners-section > p a { padding: 0; font-size: 100%; max-width: unset; margin: 0; }
#SiteFooter #partners-section > p a img { width: var(--gap-24); height: auto; aspect-ratio: 1; }
#SiteFooter .site-credit.alternative { display: flex; padding: 5px 0; width: 100%; background: #000; }
#SiteFooter .site-credit.alternative svg path.st0 { fill: var(--white); }
#SiteFooter .site-credit.alternative button.AccessabilityLink { color: inherit; z-index: 1; margin-bottom: 5px; font-size: clamp(1.3rem, 0.73vw, 1000rem); }
#SiteFooter .site-credit.alternative button.AccessabilityLink:hover { color: var(--white); }
#SiteFooter p.creditWrapper svg { fill: var(--white); }
#SiteFooter .site-credit.alternative button.AccessabilityLink { font-size: var(--fs-14); }
.footer-text-divided > div.footer-text-middle { display: flex; flex-direction: column; align-items: center; width: 100%; gap: var(--gap-40); }

@media(max-width: 1024px) {
    #SiteFooter { border-top: 1px solid var(--white); padding-top: var(--gap-56); gap: 0; }
    #SiteFooter .footer-text.text-center img { width: var(--gap-240); }
    #SiteFooter #partners-section { gap: 0; padding-top: 0; }
    #SiteFooter #partners-section ul { padding-block: var(--gap-24); }
    #SiteFooter #partners-section ul.footer-social { padding: 0; margin-top: var(--gap-32); }
    #SiteFooter #partners-section ul.footer-brands { padding-block: 0; margin-block: var(--gap-64); gap: 40px; }
    #SiteFooter #partners-section > p { margin-top: var(--gap-32); }
    #SiteFooter #partners-section ul.footer-brands img { width: 56px; }
    #SiteFooter p { max-width: 240px; line-height: 1.5; }
    .footer-text-divided > div.footer-text-middle { gap: 20px; }
}
